/* Admin dashboard styles */
.cd-admin .cd-card{background:#fff;border:1px solid rgba(15,23,42,.10);border-radius:18px;padding:18px;margin:16px 0;box-shadow:0 12px 28px rgba(15,23,42,.06)}
.cd-admin .cd-card__head{margin-bottom:12px}
.cd-admin .cd-flex{display:flex;align-items:center;justify-content:space-between;gap:12px}
.cd-admin .cd-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cd-admin .cd-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
@media (max-width:900px){.cd-admin .cd-grid-2,.cd-admin .cd-grid-3{grid-template-columns:1fr}}
.cd-admin .cd-field label{font-weight:700;display:block;margin-bottom:6px}
.cd-admin .cd-pill{font-weight:800;font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.03)}
.cd-network-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:1100px){.cd-network-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.cd-network-cards{grid-template-columns:1fr}}
.cd-net-card{border:1px solid rgba(15,23,42,.08);border-radius:18px;padding:14px;background:linear-gradient(180deg,#fff,rgba(15,23,42,.02))}
.cd-net-card__top{display:flex;gap:12px;align-items:center}
.cd-net-logo{width:44px;height:44px;border-radius:16px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.03);display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:900;color:rgba(15,23,42,.75)}
.cd-net-name{font-weight:900;font-size:16px;color:#0f172a}
.cd-net-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.cd-badge{font-size:12px;font-weight:800;padding:4px 8px;border-radius:999px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.03);color:rgba(15,23,42,.75)}
.cd-badge.is-on{background:rgba(16,185,129,.10);border-color:rgba(16,185,129,.22);color:#065f46}
.cd-badge.is-off{background:rgba(148,163,184,.14);border-color:rgba(148,163,184,.30)}
.cd-badge.is-warn{background:rgba(245,158,11,.10);border-color:rgba(245,158,11,.22);color:#7c2d12}
.cd-add-net-form{margin-top:14px;display:none}
.cd-add-net-form.is-open{display:block}
.cd-admin .cd-table-wrap{overflow:auto}
.cd-admin table.cd-table{table-layout:auto}
.cd-admin table.cd-table th,.cd-admin table.cd-table td{white-space:nowrap;vertical-align:top}
.cd-admin table.cd-table td input[type="text"]{min-width:220px}
.cd-admin table.cd-table td input[type="number"]{min-width:90px}
.cd-admin .cd-media-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cd-admin .cd-status{font-weight:800;color:#059669}
.cd-admin .cd-sub{font-weight:700;color:rgba(15,23,42,.55)}
.cd-switch input{display:none}
.cd-switch span{width:44px;height:24px;border-radius:999px;background:rgba(148,163,184,.35);position:relative;display:inline-block}
.cd-switch span:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:999px;background:#fff;box-shadow:0 6px 14px rgba(15,23,42,.18);transition:all .18s ease}
.cd-switch input:checked+span{background:rgba(16,185,129,.55)}
.cd-switch input:checked+span:after{left:23px}

/* Front (scoped) */
#crypto-donaciones-ui,#crypto-donaciones-ui *{box-sizing:border-box}
#crypto-donaciones-ui img{max-width:100%;height:auto;display:block}
#crypto-donaciones-ui .cd-tab,#crypto-donaciones-ui .cd-card-token,#crypto-donaciones-ui .cd-copy,#crypto-donaciones-ui .cd-x,#crypto-donaciones-ui .cd-presets button{all:unset;box-sizing:border-box;font:inherit}
#crypto-donaciones-ui .cd-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 16px}
#crypto-donaciones-ui .cd-tab{cursor:pointer;border:1px solid rgba(15,23,42,.10);background:#fff;padding:10px 14px;border-radius:999px;font-weight:900;color:rgba(15,23,42,.75)}
#crypto-donaciones-ui .cd-tab.is-active{background:rgba(15,23,42,.92);color:#fff;border-color:rgba(15,23,42,.92)}
#crypto-donaciones-ui .cd-panel{display:none}
#crypto-donaciones-ui .cd-panel.is-active{display:block}
#crypto-donaciones-ui .cd-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media(max-width:820px){#crypto-donaciones-ui .cd-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){#crypto-donaciones-ui .cd-grid{grid-template-columns:1fr}}
#crypto-donaciones-ui .cd-card-token{cursor:pointer;display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:16px 14px;border-radius:22px;background:linear-gradient(180deg,#fff,rgba(15,23,42,.02));border:1px solid rgba(15,23,42,.08);box-shadow:0 14px 32px rgba(15,23,42,.06)}
#crypto-donaciones-ui .cd-coin{width:86px;height:86px;border-radius:999px;background:radial-gradient(120px 120px at 30% 25%,rgba(255,255,255,.95),rgba(255,255,255,.45),rgba(15,23,42,.03));border:1px solid rgba(15,23,42,.10);display:flex;align-items:center;justify-content:center;overflow:hidden}
#crypto-donaciones-ui .cd-coin img{width:46px;height:46px;object-fit:contain;border-radius:16px}
#crypto-donaciones-ui .cd-token-name{font-weight:1000;font-size:16px;color:#0f172a}
#crypto-donaciones-ui .cd-token-sym{font-weight:900;font-size:12px;color:rgba(15,23,42,.55)}
#crypto-donaciones-ui .cd-min{margin-top:6px;width:100%;height:42px;display:flex;align-items:center;justify-content:center;border-radius:14px;background:rgba(15,23,42,.05);border:1px solid rgba(15,23,42,.10);font-weight:1000;color:rgba(15,23,42,.72)}
#crypto-donaciones-ui .cd-modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.42);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:99998}
#crypto-donaciones-ui .cd-modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-48%) scale(.98);width:min(560px,calc(100% - 26px));background:#fff;border:1px solid rgba(15,23,42,.10);border-radius:22px;padding:16px;box-shadow:0 30px 80px rgba(15,23,42,.20);opacity:0;pointer-events:none;transition:opacity .18s ease,transform .18s ease;z-index:99999}
#crypto-donaciones-ui.is-open .cd-modal-backdrop{opacity:1;pointer-events:auto}
#crypto-donaciones-ui.is-open .cd-modal{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
#crypto-donaciones-ui .cd-x{cursor:pointer;width:38px;height:38px;border-radius:999px;display:flex;align-items:center;justify-content:center;position:absolute;right:12px;top:12px;background:rgba(15,23,42,.06);border:1px solid rgba(15,23,42,.10);font-weight:1000}
#crypto-donaciones-ui .cd-modal-head{display:flex;gap:12px;align-items:center;padding:6px 6px 12px}
#crypto-donaciones-ui .cd-modal-coin{width:52px;height:52px;border-radius:999px;background:radial-gradient(120px 120px at 30% 25%,rgba(255,255,255,.95),rgba(255,255,255,.45),rgba(15,23,42,.03));border:1px solid rgba(15,23,42,.10);display:flex;align-items:center;justify-content:center;overflow:hidden}
#crypto-donaciones-ui .cd-modal-coin img{width:30px;height:30px;object-fit:contain;border-radius:12px}
#crypto-donaciones-ui .cd-modal-title{font-weight:1000;font-size:18px;color:#0f172a}
#crypto-donaciones-ui .cd-modal-sub{color:rgba(15,23,42,.62);font-weight:800}
#crypto-donaciones-ui .cd-qr-box{display:grid;grid-template-columns:220px 1fr;gap:14px;padding:12px;border-radius:20px;border:1px solid rgba(15,23,42,.08);background:rgba(255,255,255,.92)}
@media(max-width:560px){#crypto-donaciones-ui .cd-qr-box{grid-template-columns:1fr}}
#crypto-donaciones-ui .cd-qr{width:220px;height:220px;border-radius:18px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.03);display:flex;align-items:center;justify-content:center;overflow:hidden}
#crypto-donaciones-ui .cd-qr img{width:100%;height:100%;object-fit:cover}
#crypto-donaciones-ui .cd-qr-missing{padding:14px;text-align:center;color:rgba(15,23,42,.65);font-weight:900}
#crypto-donaciones-ui .cd-presets{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
#crypto-donaciones-ui .cd-presets button{cursor:pointer;padding:8px 12px;border-radius:999px;border:1px solid rgba(15,23,42,.14);background:rgba(255,255,255,.90);font-weight:1000;color:rgba(15,23,42,.78)}
#crypto-donaciones-ui .cd-presets button:hover{background:rgba(15,23,42,.92);color:#fff;border-color:rgba(15,23,42,.92)}
#crypto-donaciones-ui .cd-wallet-row{display:flex;gap:10px;align-items:center;padding:12px;border-radius:18px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.02)}
#crypto-donaciones-ui .cd-wallet-row code{flex:1;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;word-break:break-all}
#crypto-donaciones-ui .cd-copy{cursor:pointer;padding:10px 12px;border-radius:14px;background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.22);font-weight:1000;color:#065f46}
#crypto-donaciones-ui .cd-warning{margin-top:12px;padding:12px;border-radius:18px;border:1px solid rgba(245,158,11,.22);background:rgba(245,158,11,.08)}
.cd-toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(8px);background:rgba(15,23,42,.92);color:#fff;padding:10px 14px;border-radius:999px;font-weight:1000;opacity:0;transition:all .2s ease;z-index:100000}
.cd-toast.is-show{opacity:1;transform:translateX(-50%) translateY(0)}


/* === PREMIUM OVERRIDES (v3) === */
#crypto-donaciones-ui .cd-tab.is-active{
  border-color: color-mix(in srgb, var(--cd-a) 55%, rgba(15,23,42,.20));
  background:
    radial-gradient(120px 70px at 20% 20%, color-mix(in srgb, var(--cd-a) 30%, transparent), transparent 60%),
    radial-gradient(120px 70px at 80% 30%, color-mix(in srgb, var(--cd-b) 22%, transparent), transparent 62%),
    rgba(15,23,42,.92);
  color:#fff;
}
#crypto-donaciones-ui .cd-card-token{
  background:
    radial-gradient(240px 120px at 20% 20%, color-mix(in srgb, var(--cd-a) 22%, transparent), transparent 60%),
    radial-gradient(260px 150px at 80% 20%, color-mix(in srgb, var(--cd-b) 18%, transparent), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(15,23,42,.02)) !important;
  border:1px solid rgba(15,23,42,.08) !important;
  box-shadow:0 14px 34px rgba(15,23,42,.08) !important;
  border-radius:24px !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
#crypto-donaciones-ui .cd-card-token:hover{
  transform: translateY(-2px) !important;
  border-color: color-mix(in srgb, var(--cd-a) 30%, rgba(15,23,42,.10)) !important;
  box-shadow:0 18px 44px rgba(15,23,42,.12) !important;
}
#crypto-donaciones-ui .cd-coin{
  width:92px !important; height:92px !important;
  border-radius:999px !important;
  box-shadow:0 10px 20px rgba(15,23,42,.08) !important;
}
#crypto-donaciones-ui .cd-coin img{ width:48px !important; height:48px !important; object-fit:contain !important; }
#crypto-donaciones-ui .cd-min{
  background:
    radial-gradient(160px 60px at 20% 50%, color-mix(in srgb, var(--cd-a) 16%, transparent), transparent 60%),
    rgba(15,23,42,.04) !important;
}
#crypto-donaciones-ui .cd-modal-head{
  background:
    radial-gradient(240px 100px at 18% 30%, color-mix(in srgb, var(--cd-a) 20%, transparent), transparent 62%),
    radial-gradient(240px 120px at 82% 30%, color-mix(in srgb, var(--cd-b) 16%, transparent), transparent 64%),
    rgba(15,23,42,.02) !important;
}


/* === NETWORK LOGO SIZING FIX (v3.2.1) === */
#crypto-donaciones-ui .cd-tab{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
#crypto-donaciones-ui .cd-tab-badge{
  width:28px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  overflow:hidden;
  background: rgba(15,23,42,.06);
  border: 1px solid rgba(15,23,42,.08);
  flex:0 0 auto;
}
#crypto-donaciones-ui .cd-tab-badge img{
  width:16px !important;
  height:16px !important;
  object-fit:contain !important;
  display:block !important;
}
#crypto-donaciones-ui .cd-tab-badge span{
  font-weight:800;
  font-size:12px;
  letter-spacing:.4px;
}
#crypto-donaciones-ui .cd-net-logo img,
.cd-admin .cd-net-logo img{
  width:44px !important;
  height:44px !important;
  object-fit:contain !important;
  display:block !important;
}
.cd-admin .cd-net-logo{
  width:56px;
  height:56px;
  border-radius:16px;
  overflow:hidden;
}


/* Guard: avoid theme forcing huge images inside the plugin UI */
#crypto-donaciones-ui img{max-width:100% !important; height:auto !important;}


/* === CENTERING DEFAULT (v1.0.0) === */
#crypto-donaciones-ui{
  width: 100%;
  max-width: 1100px;
  margin: 60px auto;
  padding: 0 20px;
  box-sizing: border-box;
}
#crypto-donaciones-ui .cd-tabs{
  justify-content: center !important;
  align-items: center;
  flex-wrap: wrap;
}
#crypto-donaciones-ui .cd-panels,
#crypto-donaciones-ui .cd-panel{ width:100%; }
#crypto-donaciones-ui .cd-grid{ justify-content: center; }
@media (max-width: 1024px){
  #crypto-donaciones-ui{ max-width: 900px; margin: 50px auto; }
}
@media (max-width: 768px){
  #crypto-donaciones-ui{ max-width: 100%; margin: 40px auto; padding: 0 14px; }
}


/* === ADMIN SAVE BAR === */
.cd-admin .cd-savebar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  background: rgba(255,255,255,0.85);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 12px 14px;
  margin: 18px 0 8px;
}
.cd-admin .cd-savebar__left{
  font-size: 13px;
  color:#334155;
}
@media (max-width: 920px){
  .cd-admin .cd-savebar{ flex-direction:column; align-items:flex-start; }
}

/* === ADMIN SHORTCODE BOX === */
.cd-admin .cd-admin-help{
  display:flex;
  gap:16px;
  align-items:stretch;
  justify-content:space-between;
  background: linear-gradient(135deg, rgba(15,118,110,0.08), rgba(2,132,199,0.06));
  border: 1px solid rgba(15,118,110,0.18);
  border-radius: 14px;
  padding: 16px;
  margin: 14px 0 18px;
}
.cd-admin .cd-admin-help__title{
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 4px;
}
.cd-admin .cd-admin-help__text{
  font-size: 13px;
  color: #334155;
}
.cd-admin .cd-admin-help__right{
  min-width: 260px;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:flex-end;
  justify-content:center;
}
.cd-admin .cd-admin-help__label{
  font-size: 12px;
  color:#475569;
  font-weight:600;
}
.cd-admin .cd-shortcode{
  width: 100%;
  max-width: 320px;
  text-align:left;
  border-radius: 12px;
  border: 1px solid rgba(2,132,199,0.22);
  background: rgba(255,255,255,0.75);
  padding: 10px 12px;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.cd-admin .cd-shortcode code{
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}
.cd-admin .cd-shortcode__hint{
  font-size: 12px;
  color:#64748b;
}
.cd-admin .cd-shortcode:hover{
  background: rgba(255,255,255,0.92);
}
.cd-admin .cd-copy-toast{
  font-size: 12px;
  font-weight: 700;
  color:#0f766e;
}
@media (max-width: 920px){
  .cd-admin .cd-admin-help{ flex-direction:column; align-items:flex-start; }
  .cd-admin .cd-admin-help__right{ align-items:flex-start; min-width: unset; width:100%; }
  .cd-admin .cd-shortcode{ max-width: 100%; }
}

/* === FRONT: TARJETAS MÁS COMPACTAS === */
#crypto-donaciones-ui .cd-card{max-width:340px;margin:0 auto;min-height:208px;padding:14px 14px 12px;border-radius:18px}
#crypto-donaciones-ui .cd-coin{width:70px;height:70px}

@media(max-width:520px){
  #crypto-donaciones-ui .cd-modal-card{max-width:340px}
  #crypto-donaciones-ui .cd-qr{width:170px;height:170px}
}

/* === ADMIN: DANGER BUTTON === */
.cd-admin .cd-danger{
  border-color: rgba(239,68,68,0.35) !important;
  color: #b91c1c !important;
  background: rgba(239,68,68,0.06) !important;
}
.cd-admin .cd-danger:hover{
  background: rgba(239,68,68,0.10) !important;
}

/* === FRONT: GRID 3 COLUMNAS SIEMPRE CENTRADO (BLINDADO) === */
#crypto-donaciones-ui{max-width:1040px !important;margin:60px auto !important;padding:0 14px !important;}
#crypto-donaciones-ui .cd-grid{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
  gap: 14px !important;
  justify-content: center !important;
}
@media(max-width:920px){
  #crypto-donaciones-ui .cd-grid{grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;}
}
@media(max-width:520px){
  #crypto-donaciones-ui .cd-grid{grid-template-columns: 1fr !important;}
}

/* === MOBILE: MODAL MÁS COMPACTO (QR + WALLET) === */
@media(max-width:520px){
  #crypto-donaciones-ui .cd-modal-card{max-width:340px !important;}
  #crypto-donaciones-ui .cd-qr{width:170px !important;height:170px !important;}
  #crypto-donaciones-ui .cd-walletbox{padding:10px 12px !important;}
}

/* === MODO PAGOS: QR CENTRADO Y SIN PRESETS === */
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-presets{display:none !important;}
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-grid{grid-template-columns: 1fr !important; justify-items:center !important;}
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-qr{margin: 0 auto !important;}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-card .cd-qr-wrap{display:flex !important;justify-content:center !important;width:100% !important;}

/* === MODO PAGOS: ocultar monto/presets y centrar QR === */
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-presets{display:none !important;}
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount-wrap,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount-label,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount-input,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-min-label,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-min{display:none !important;}
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-grid{grid-template-columns:1fr !important;justify-items:center !important;}
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-qr-wrap{display:flex !important;justify-content:center !important;width:100% !important;}

/* Modal un poco más angosto (25% aprox), sin romper mobile */
#crypto-donaciones-ui .cd-modal-card{max-width: 720px; width: min(92vw, 720px);}
@media (max-width: 520px){
  #crypto-donaciones-ui .cd-modal-card{width: min(94vw, 520px);}
}


/* ===== FIX MODO PAGOS: QR centrado + modal más angosto ===== */
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-card{
  max-width: 640px !important;
  width: min(92vw, 640px) !important;
}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-grid{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-qr-wrap{
  display:flex !important;
  justify-content:center !important;
  width:100% !important;
}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount-wrap,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-presets,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-min,
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-min-label{
  display:none !important;
}

@media (max-width:520px){
  #crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal-card{
    width: min(92vw, 520px) !important;
  }
}


/* ===== FIX MODO PAGOS: QR centrado + modal más angosto (solo pagos) ===== */
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-modal{
  width:min(420px,calc(100% - 26px)) !important; /* ~25% más angosto vs 560px */
}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-qr-box{
  grid-template-columns:1fr !important;
  justify-items:center !important;
}

#crypto-donaciones-ui[data-cd-mode="payments"] .cd-amount{
  display:none !important;
}

/* Mantén el QR bien centrado */
#crypto-donaciones-ui[data-cd-mode="payments"] .cd-qr{
  margin:0 auto !important;
}


/* ===== Donaciones: quitar input y centrar contenido sin tocar pagos ===== */
#crypto-donaciones-ui[data-cd-mode="donations"] .cd-amount{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
#crypto-donaciones-ui[data-cd-mode="donations"] .cd-amount-head{
  width:100%;
  text-align:center;
}
#crypto-donaciones-ui[data-cd-mode="donations"] .cd-presets{
  justify-content:center;
  align-items:center;
}
#crypto-donaciones-ui[data-cd-mode="donations"] .cd-qr{
  margin:0 auto;
}
@media(max-width:820px){
  #crypto-donaciones-ui[data-cd-mode="donations"] .cd-qr-box{
    grid-template-columns:1fr;
    justify-items:center;
  }
  #crypto-donaciones-ui[data-cd-mode="donations"] .cd-amount{
    width:100%;
  }
}
