:root {
      --navy:    #0D1B2A;
      --red:     #C1121F;
      --gold:    #E6A817;
      --white:   #FFFFFF;
      --success: #1A7A4A;
      --radius:  10px;
      --shadow:  0 4px 24px rgba(13,27,42,0.12);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    body { font-family: 'Inter', sans-serif; background: var(--navy); color: var(--white); min-height: 100vh; -webkit-font-smoothing: antialiased; }

    nav {
      display: flex; align-items: center; justify-content: space-between;
      padding: 1.1rem 2.5rem;
      background: rgba(255,255,255,0.03);
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }
    .logo { font-family: 'DM Sans', sans-serif; font-weight: 800; font-size: 1.4rem; color: var(--white); text-decoration: none; display: flex; align-items: center; gap: 8px; }
    .logo span { color: var(--red); }
    
    .nav-user { display: flex; align-items: center; gap: 15px; }
    .logout-btn { background: transparent; border: 1px solid rgba(255,255,255,0.2); color: var(--white); padding: 0.4rem 0.9rem; border-radius: 6px; cursor: pointer; font-size: 0.85rem; transition: 0.2s; }
    .logout-btn:hover { background: var(--red); border-color: var(--red); }

    main { max-width: 1100px; margin: 2.5rem auto; padding: 0 1.5rem; display: grid; grid-template-columns: 1.3fr 1fr; gap: 2.5rem; }
    @media (max-width: 850px) { main { grid-template-columns: 1fr; } }

    .card { background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.06); border-radius: var(--radius); padding: 2rem; box-shadow: var(--shadow); height: fit-content; }
    .card-title { font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 1.3rem; margin-bottom: 1.5rem; display: flex; align-items: center; gap: 10px; }
    
    .kyc-banner { background: var(--gold); color: var(--navy); padding: 1rem; border-radius: var(--radius); margin-bottom: 1.5rem; font-weight: 600; display: none; font-size: 0.9rem; align-items: center; justify-content: space-between; }
    .kyc-banner.show { display: flex; }
    .kyc-link { background: var(--navy); color: var(--white); text-decoration: none; padding: 0.3rem 0.8rem; border-radius: 5px; font-size: 0.8rem; }

    .form-group { margin-bottom: 1.2rem; }
    label { display: block; font-size: 0.85rem; color: rgba(255,255,255,0.6); margin-bottom: 0.4rem; font-weight: 500; }
    input, select { width: 100%; background: rgba(0,0,0,0.2); border: 1px solid rgba(255,255,255,0.15); border-radius: 6px; padding: 0.75rem; color: var(--white); font-size: 0.95rem; font-family: inherit; transition: 0.2s; }
    input:focus, select:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(230,168,23,0.15); }
    
    .rate-box { background: rgba(230,168,23,0.07); border: 1px solid rgba(230,168,23,0.2); border-radius: var(--radius); padding: 1rem; margin-bottom: 1.5rem; font-size: 0.9rem; display: flex; justify-content: space-between; align-items: center; }
    .rate-box strong { color: var(--gold); font-size: 1.1rem; }

    .breakdown { background: rgba(0,0,0,0.15); border-radius: 6px; padding: 1rem; margin-bottom: 1.5rem; font-size: 0.85rem; border: 1px solid rgba(255,255,255,0.03); }
    .breakdown-row { display: flex; justify-content: space-between; margin-bottom: 0.5rem; }
    .breakdown-row:last-child { margin-bottom: 0; padding-top: 0.5rem; border-top: 1px solid rgba(255,255,255,0.1); font-weight: 600; font-size: 0.95rem; }
    .breakdown-row.total-htg { color: var(--gold); }

    .btn { width: 100%; background: var(--red); color: var(--white); border: none; padding: 0.9rem; font-size: 1rem; font-weight: 600; border-radius: 6px; cursor: pointer; transition: 0.2s; font-family: inherit; }
    .btn:hover { background: #d91624; transform: translateY(-1px); }
    .btn:disabled { background: rgba(255,255,255,0.1); color: rgba(255,255,255,0.3); cursor: not-allowed; transform: none; }

    /* File upload design */
    .upload-area { border: 2px dashed rgba(255,255,255,0.2); padding: 1.5rem; border-radius: var(--radius); text-align: center; cursor: pointer; transition: 0.2s; }
    .upload-area:hover { border-color: var(--gold); background: rgba(230,168,23,0.02); }
    .upload-area.has-file { border-color: var(--success); background: rgba(26,122,74,0.05); }
    .upload-icon { font-size: 1.8rem; margin-bottom: 0.5rem; }
    .upload-title { font-size: 0.9rem; font-weight: 500; }
    .upload-sub { font-size: 0.75rem; color: rgba(255,255,255,0.5); margin-top: 0.2rem; }

    .error-msg { color: #ff4d4d; font-size: 0.8rem; margin-top: 0.3rem; display: none; }
    
    /* Historial Section Design */
    .history-section { grid-column: 1 / -1; margin-top: 1rem; }
    .stats-counter { display: inline-flex; align-items: center; background: rgba(26,122,74,0.15); border: 1px solid rgba(26,122,74,0.3); padding: 0.4rem 0.8rem; border-radius: 20px; font-size: 0.85rem; font-weight: 600; color: #4ade80; margin-bottom: 1rem; }
    .table-wrapper { width: 100%; overflow-x: auto; background: rgba(0,0,0,0.15); border: 1px solid rgba(255,255,255,0.06); border-radius: 6px; }
    table { width: 100%; border-collapse: collapse; font-size: 0.85rem; text-align: left; min-width: 600px; }
    th, td { padding: 0.85rem 1rem; border-bottom: 1px solid rgba(255,255,255,0.06); }
    th { font-family: 'DM Sans', sans-serif; font-weight: 600; color: rgba(255,255,255,0.5); background: rgba(255,255,255,0.02); }
    tr:last-child td { border-bottom: none; }
    .status-badge { display: inline-block; padding: 0.2rem 0.5rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; text-transform: uppercase; }
    .status-pending { background: rgba(230,168,23,0.15); color: var(--gold); }
    .status-processing { background: rgba(59,130,246,0.15); color: #60a5fa; }
    .status-completed { background: rgba(26,122,74,0.15); color: #4ade80; }
    .status-failed { background: rgba(193,18,31,0.15); color: #f87171; }
    .empty-history { text-align: center; padding: 2rem; color: rgba(255,255,255,0.4); font-size: 0.9rem; }

    .toast { position: fixed; bottom: 2rem; right: 2rem; padding: 1rem 1.5rem; border-radius: 6px; font-weight: 500; font-size: 0.9rem; transform: translateY(100px); opacity: 0; transition: 0.3s; z-index: 1000; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
    .toast.success { background: var(--success); color: var(--white); }
    .toast.error { background: var(--red); color: var(--white); }
    .toast.show { transform: translateY(0); opacity: 1; }
  
.auth-page { min-height: calc(100vh - 70px); display:flex; align-items:center; justify-content:center; padding:2rem; }
.auth-card { width:100%; max-width:480px; }
.auth-links { text-align:center; margin-top:1rem; font-size:.9rem; color:rgba(255,255,255,.65); }
.auth-links a { color:var(--gold); text-decoration:none; font-weight:700; }
.nav-link { color: rgba(255,255,255,.8); text-decoration:none; margin-left:1rem; font-weight:600; }
.hero { max-width:900px; margin:5rem auto; padding:0 1.5rem; text-align:center; }
.hero h1 { font-family:'DM Sans',sans-serif; font-size:clamp(2.3rem,5vw,4rem); line-height:1.05; margin-bottom:1rem; }
.hero p { color:rgba(255,255,255,.68); font-size:1.05rem; line-height:1.7; max-width:680px; margin:0 auto 2rem; }
.hero-actions { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.btn.secondary { background:transparent; border:1px solid rgba(255,255,255,.25); }
.payment-note { margin-top: .8rem; color: rgba(255,255,255,.55); font-size: .82rem; text-align:center; }

.product-switch { grid-column: 1 / -1; margin-bottom: 1rem; }
.product-options { display:grid; grid-template-columns: 1fr 1fr; gap:1rem; }
.product-option { text-align:left; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); color:var(--white); border-radius:var(--radius); padding:1rem; cursor:pointer; display:flex; flex-direction:column; gap:.25rem; font-family:inherit; }
.product-option.active { border-color:var(--gold); box-shadow:0 0 0 3px rgba(230,168,23,.12); }
.product-option strong { font-size:1rem; }
.product-option small { color:rgba(255,255,255,.55); }
.product-icon { font-size:1.5rem; }
.product-flow { margin-top:1rem; }
.history-tabs { display:flex; gap:.7rem; margin-bottom:1rem; flex-wrap:wrap; }
.history-tab { border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.04); color:var(--white); padding:.55rem .9rem; border-radius:20px; cursor:pointer; font-weight:700; }
.history-tab.active { background:var(--gold); color:var(--navy); border-color:var(--gold); }
.status-unpaid,.status-not_started { background:rgba(230,168,23,0.15); color:var(--gold); }
.status-paid,.status-successful { background:rgba(26,122,74,0.15); color:#4ade80; }
.status-manual_required { background:rgba(255,255,255,0.1); color:rgba(255,255,255,.75); }
@media(max-width:700px){ .product-options{grid-template-columns:1fr;} }

/* Haiti phone input: fixed +509 prefix, user enters only 8 local digits */
.haiti-phone-input {
  display: flex;
  align-items: stretch;
  width: 100%;
}

.haiti-phone-prefix {
  display: inline-flex;
  align-items: center;
  padding: 0 0.9rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-right: 0;
  border-radius: 12px 0 0 12px;
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.88);
  font-weight: 700;
  white-space: nowrap;
}

.haiti-phone-input input {
  border-radius: 0 12px 12px 0;
}

.field-help {
  display: block;
  margin-top: 0.4rem;
  color: rgba(255, 255, 255, 0.55);
  font-size: 0.78rem;
}

/* ── Editable homepage ───────────────────────────────── */
body.home-page{
  min-height:100vh;
  background:#0D1B2A;
  background-repeat:no-repeat;
  color:#fff;
}
.home-shell{
  width:min(1040px, calc(100% - 2rem));
  margin:0 auto;
  padding:5rem 0 3rem;
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);
  gap:2rem;
  align-items:center;
}
.home-hero{
  padding:3rem 2.4rem;
  border:1px solid rgba(255,255,255,.12);
  border-radius:28px;
  background:rgba(13,27,42,.58);
  backdrop-filter:blur(18px);
  box-shadow:0 28px 80px rgba(0,0,0,.28);
}
.home-logo-wrap{
  align-items:center;
  justify-content:flex-start;
  margin-bottom:1.4rem;
}
.home-logo-img{
  max-width:min(320px, 88%);
  max-height:150px;
  object-fit:contain;
  display:block;
}
.home-brand-fallback{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(3rem, 7vw, 5.8rem);
  font-weight:800;
  line-height:.95;
  letter-spacing:-.06em;
  margin-bottom:1.4rem;
}
.home-brand-fallback span{color:#E6A817;display:block}
.home-slogan{
  font-size:clamp(1.15rem,2.4vw,1.8rem);
  line-height:1.35;
  color:rgba(255,255,255,.84);
  max-width:760px;
  margin:0 0 2rem;
}
.home-actions{justify-content:flex-start;flex-wrap:wrap}
.home-announcement{
  padding:2rem;
  border-radius:24px;
  border:1px solid rgba(230,168,23,.32);
  background:linear-gradient(145deg, rgba(230,168,23,.16), rgba(193,18,31,.16)), rgba(13,27,42,.68);
  backdrop-filter:blur(18px);
  box-shadow:0 24px 70px rgba(0,0,0,.24);
}
.announcement-kicker{
  color:#E6A817;
  font-weight:800;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  margin-bottom:.75rem;
}
.home-announcement h2{
  font-family:'DM Sans',sans-serif;
  font-size:clamp(1.5rem,3vw,2.3rem);
  line-height:1.08;
  margin:0 0 1rem;
}
.home-announcement p{
  color:rgba(255,255,255,.76);
  line-height:1.65;
  margin:0 0 1.4rem;
}
.announcement-link{
  display:inline-flex;
  text-decoration:none;
  background:#E6A817;
  color:#0D1B2A;
  font-weight:800;
  padding:.8rem 1.1rem;
  border-radius:12px;
}
@media(max-width:840px){
  .home-shell{grid-template-columns:1fr;padding:2.5rem 0}
  .home-hero{padding:2rem 1.4rem}
}

/* Payout / delivery statuses */
.status-not_started,
.status-manual_required {
  background: rgba(230, 168, 23, 0.15);
  color: var(--gold);
}

.status-processing {
  background: rgba(59, 130, 246, 0.18);
  color: #60a5fa;
}

.status-successful,
.status-completed {
  background: rgba(26, 122, 74, 0.18);
  color: #4ade80;
}

.status-failed {
  background: rgba(193, 18, 31, 0.18);
  color: #f87171;
}


/* ==========================================================
   Fuente de fondos obligatoria al primer acceso
   ========================================================== */
.source-funds-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(12, 20, 35, 0.72);
  backdrop-filter: blur(4px);
}

.source-funds-modal {
  width: min(100%, 460px);
  max-height: calc(100vh - 2rem);
  overflow-y: auto;
  padding: 2rem;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
}

.source-funds-modal h2 {
  margin: 0 0 0.75rem;
  color: #111827;
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}

.source-funds-modal p {
  margin: 0 0 1.4rem;
  color: #5b6472;
  line-height: 1.55;
  text-align: center;
}

.source-funds-icon {
  margin-bottom: 0.75rem;
  font-size: 2.4rem;
  text-align: center;
}

.source-funds-modal .btn {
  width: 100%;
  margin-top: 0.65rem;
}

body.source-funds-required {
  overflow: hidden;
}

@media (max-width: 520px) {
  .source-funds-modal {
    padding: 1.4rem;
    border-radius: 14px;
  }
}


/* KAY Transfe responsive homepage v1 */

/* Desktop refinements */
body.home-page {
  overflow-x: hidden;
}

body.home-page nav {
  width: 100%;
}

body.home-page .home-actions .btn {
  width: auto;
  min-width: 150px;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

body.home-page .announcement-link {
  min-height: 44px;
  align-items: center;
  justify-content: center;
}

/* Tablets and narrow laptops */
@media (max-width: 840px) {
  body.home-page .home-shell {
    width: min(680px, calc(100% - 2rem));
    padding: 2.25rem 0 3rem;
    gap: 1.5rem;
  }

  body.home-page .home-hero {
    padding: 2.25rem 1.75rem;
  }

  body.home-page .home-announcement {
    padding: 1.75rem;
  }

  body.home-page .home-logo-wrap {
    justify-content: center;
  }

  body.home-page .home-logo-img {
    max-width: min(300px, 90%);
  }
}

/* Mobile */
@media (max-width: 600px) {
  body.home-page {
    min-height: 100svh;
    background-attachment: scroll !important;
    background-position: center top !important;
  }

  body.home-page nav {
    min-height: 64px;
    height: auto;
    padding: 0.75rem 1rem;
    gap: 0.75rem;
  }

  body.home-page nav .logo {
    flex-shrink: 0;
    font-size: 1.15rem;
    gap: 4px;
  }

  body.home-page nav .nav-user {
    gap: 0.6rem;
    justify-content: flex-end;
  }

  body.home-page nav .nav-link {
    min-height: 40px;
    margin-left: 0;
    padding: 0.55rem 0.25rem;
    display: inline-flex;
    align-items: center;
    font-size: 0.84rem;
    white-space: nowrap;
  }

  body.home-page .home-shell {
    width: calc(100% - 1.25rem);
    padding: 1.25rem 0 2rem;
    gap: 1rem;
  }

  body.home-page .home-hero {
    padding: 1.6rem 1.15rem;
    border-radius: 20px;
    text-align: center;
  }

  body.home-page .home-logo-wrap {
    margin-bottom: 1rem;
  }

  body.home-page .home-logo-img {
    width: auto;
    max-width: min(260px, 92%);
    max-height: 115px;
    margin: 0 auto;
  }

  body.home-page .home-brand-fallback {
    margin-bottom: 1rem;
    font-size: clamp(2.55rem, 16vw, 4rem);
    line-height: 0.96;
    letter-spacing: -0.05em;
  }

  body.home-page .home-slogan {
    margin: 0 auto 1.4rem;
    max-width: 34rem;
    font-size: clamp(1rem, 5vw, 1.3rem);
    line-height: 1.45;
  }

  body.home-page .home-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  body.home-page .home-actions .btn {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    padding: 0.85rem 1rem;
  }

  body.home-page .home-announcement {
    padding: 1.4rem 1.15rem;
    border-radius: 18px;
  }

  body.home-page .home-announcement h2 {
    font-size: clamp(1.35rem, 7vw, 1.85rem);
    overflow-wrap: anywhere;
  }

  body.home-page .home-announcement p {
    font-size: 0.95rem;
    line-height: 1.55;
    overflow-wrap: anywhere;
  }

  body.home-page .announcement-link {
    width: 100%;
    min-height: 48px;
    text-align: center;
  }

  body.home-page .toast {
    left: 0.75rem;
    right: 0.75rem;
    bottom: 0.75rem;
    width: auto;
    text-align: center;
  }
}

/* Very small phones */
@media (max-width: 360px) {
  body.home-page nav {
    padding-inline: 0.7rem;
  }

  body.home-page nav .logo {
    font-size: 1.02rem;
  }

  body.home-page nav .nav-user {
    gap: 0.35rem;
  }

  body.home-page nav .nav-link {
    padding-inline: 0.15rem;
    font-size: 0.76rem;
  }

  body.home-page .home-shell {
    width: calc(100% - 0.9rem);
  }

  body.home-page .home-hero,
  body.home-page .home-announcement {
    padding-inline: 0.95rem;
  }
}


/* KAY Transfe responsive authentication v1 */
body.auth-body {
  min-height: 100vh;
  min-height: 100svh;
  overflow-x: hidden;
}

body.auth-body .auth-page {
  width: 100%;
  min-height: calc(100vh - 70px);
  min-height: calc(100svh - 70px);
  margin: 0;
  padding: 2rem 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

body.auth-body .auth-card {
  width: min(100%, 480px);
}

body.auth-body .auth-card .card-title {
  margin-bottom: 1.5rem;
}

body.auth-body .auth-card input,
body.auth-body .auth-card select,
body.auth-body .auth-card button {
  min-height: 48px;
}

body.auth-body .auth-card input {
  font-size: 16px;
}

body.auth-body .auth-card .error-msg {
  margin: 0 0 0.9rem;
  line-height: 1.4;
}

body.auth-body .auth-links {
  line-height: 1.5;
}

@media (max-width: 600px) {
  body.auth-body nav {
    min-height: 64px;
    height: auto;
    padding: 0.75rem 1rem;
    gap: 0.75rem;
  }

  body.auth-body nav .logo {
    flex-shrink: 0;
    font-size: 1.15rem;
    gap: 4px;
  }

  body.auth-body nav .nav-user {
    gap: 0.5rem;
  }

  body.auth-body nav .nav-link {
    min-height: 40px;
    margin-left: 0;
    padding: 0.55rem 0.25rem;
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    white-space: nowrap;
  }

  body.auth-body .auth-page {
    min-height: calc(100svh - 64px);
    padding:
      1rem
      max(0.75rem, env(safe-area-inset-right))
      calc(1.25rem + env(safe-area-inset-bottom))
      max(0.75rem, env(safe-area-inset-left));
    align-items: flex-start;
  }

  body.auth-body .auth-card {
    width: 100%;
    max-width: 480px;
    padding: 1.35rem 1rem;
    border-radius: 16px;
  }

  body.auth-body .auth-card .card-title {
    margin-bottom: 1.2rem;
    font-size: 1.45rem;
  }

  body.auth-body .form-group {
    margin-bottom: 1rem;
  }

  body.auth-body .auth-card label {
    font-size: 0.88rem;
  }

  body.auth-body .auth-card input,
  body.auth-body .auth-card select {
    min-height: 50px;
    padding: 0.8rem 0.85rem;
    font-size: 16px;
  }

  body.auth-body .auth-card .btn {
    min-height: 50px;
    padding: 0.85rem 1rem;
  }

  body.auth-body .auth-links {
    margin-top: 1.1rem;
    font-size: 0.9rem;
  }

  body.auth-body .toast {
    left: 0.75rem;
    right: 0.75rem;
    bottom: calc(0.75rem + env(safe-area-inset-bottom));
    width: auto;
    text-align: center;
  }
}

@media (max-width: 360px) {
  body.auth-body nav {
    padding-inline: 0.7rem;
  }

  body.auth-body nav .logo {
    font-size: 1.02rem;
  }

  body.auth-body nav .nav-link {
    font-size: 0.78rem;
  }

  body.auth-body .auth-page {
    padding-inline: 0.55rem;
  }

  body.auth-body .auth-card {
    padding: 1.15rem 0.85rem;
  }
}

@media (max-height: 650px) and (max-width: 600px) {
  body.auth-body .auth-page {
    align-items: flex-start;
    padding-top: 0.75rem;
  }

  body.auth-body .auth-card {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}


/* KAY Transfe responsive customer dashboard v1 */
body.dashboard-body {
  min-height: 100vh;
  min-height: 100svh;
  overflow-x: hidden;
}

body.dashboard-body main {
  width: min(100%, 1100px);
}

body.dashboard-body input,
body.dashboard-body select,
body.dashboard-body button {
  min-height: 44px;
}

body.dashboard-body .table-wrapper {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

body.dashboard-body .breakdown-row > :first-child {
  min-width: 0;
  padding-right: 0.75rem;
}

body.dashboard-body .breakdown-row > :last-child {
  flex-shrink: 0;
  text-align: right;
}

body.dashboard-body .kyc-link {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

@media (max-width: 850px) {
  body.dashboard-body main {
    margin: 1.5rem auto 2rem;
    gap: 1.5rem;
  }

  body.dashboard-body .history-section {
    grid-column: auto;
  }
}

@media (max-width: 600px) {
  body.dashboard-body nav {
    min-height: 64px;
    height: auto;
    padding:
      0.7rem
      max(0.8rem, env(safe-area-inset-right))
      0.7rem
      max(0.8rem, env(safe-area-inset-left));
    gap: 0.75rem;
  }

  body.dashboard-body nav .logo {
    flex-shrink: 0;
    font-size: 1.08rem;
    gap: 4px;
  }

  body.dashboard-body nav .nav-user {
    min-width: 0;
    gap: 0.5rem;
    justify-content: flex-end;
  }

  body.dashboard-body #sendGreeting {
    max-width: 42vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.78rem;
  }

  body.dashboard-body .logout-btn {
    min-height: 40px;
    flex-shrink: 0;
    padding: 0.55rem 0.7rem;
    font-size: 0.78rem;
  }

  body.dashboard-body main {
    width: 100%;
    margin: 1rem auto 1.5rem;
    padding:
      0
      max(0.65rem, env(safe-area-inset-right))
      calc(1rem + env(safe-area-inset-bottom))
      max(0.65rem, env(safe-area-inset-left));
    gap: 1rem;
  }

  body.dashboard-body main > div {
    min-width: 0;
  }

  body.dashboard-body .card {
    min-width: 0;
    padding: 1.15rem 0.95rem;
    border-radius: 14px;
  }

  body.dashboard-body .card-title {
    margin-bottom: 1.1rem;
    gap: 0.45rem;
    font-size: 1.15rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }

  body.dashboard-body .product-switch {
    margin-bottom: 0.75rem;
  }

  body.dashboard-body .product-options {
    grid-template-columns: 1fr;
    gap: 0.7rem;
  }

  body.dashboard-body .product-option {
    min-height: 82px;
    padding: 0.85rem;
  }

  body.dashboard-body .product-option strong {
    font-size: 0.96rem;
  }

  body.dashboard-body .product-option small {
    font-size: 0.78rem;
    line-height: 1.35;
  }

  body.dashboard-body .product-flow {
    margin-top: 0.75rem;
  }

  body.dashboard-body .kyc-banner.show {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    align-items: stretch;
  }

  body.dashboard-body .kyc-banner {
    padding: 0.9rem;
    margin-bottom: 1rem;
    font-size: 0.84rem;
    line-height: 1.45;
  }

  body.dashboard-body .kyc-link {
    width: 100%;
    min-height: 42px;
    padding: 0.55rem 0.75rem;
  }

  body.dashboard-body .form-group {
    margin-bottom: 1rem;
  }

  body.dashboard-body label {
    font-size: 0.86rem;
    line-height: 1.35;
  }

  body.dashboard-body input,
  body.dashboard-body select {
    min-height: 50px;
    padding: 0.8rem;
    font-size: 16px;
  }

  body.dashboard-body input[type="file"] {
    min-height: auto;
    padding: 0.55rem;
  }

  body.dashboard-body .haiti-phone-prefix {
    min-height: 50px;
    padding: 0 0.75rem;
  }

  body.dashboard-body .rate-box {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.35rem;
    align-items: start;
    padding: 0.85rem;
    margin-bottom: 1.1rem;
  }

  body.dashboard-body .rate-box > div {
    overflow-wrap: anywhere;
  }

  body.dashboard-body .breakdown {
    padding: 0.85rem;
    margin-bottom: 1.1rem;
  }

  body.dashboard-body .breakdown-row {
    gap: 0.75rem;
    align-items: flex-start;
    line-height: 1.4;
  }

  body.dashboard-body .breakdown-row > :first-child {
    flex: 1 1 auto;
    overflow-wrap: anywhere;
  }

  body.dashboard-body .breakdown-row > :last-child {
    max-width: 48%;
    overflow-wrap: anywhere;
  }

  body.dashboard-body .btn {
    min-height: 50px;
    padding: 0.85rem 1rem;
  }

  body.dashboard-body .payment-note,
  body.dashboard-body .field-help {
    line-height: 1.45;
  }

  body.dashboard-body .upload-area {
    min-height: 130px;
    padding: 1.1rem 0.8rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  body.dashboard-body .history-section {
    margin-top: 0;
  }

  body.dashboard-body .history-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
  }

  body.dashboard-body .history-tab {
    min-height: 44px;
    padding: 0.6rem 0.45rem;
    border-radius: 10px;
    font-size: 0.8rem;
    line-height: 1.25;
  }

  body.dashboard-body .stats-counter {
    max-width: 100%;
    font-size: 0.8rem;
    line-height: 1.35;
    white-space: normal;
  }

  body.dashboard-body .table-wrapper {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  body.dashboard-body table {
    min-width: 720px;
    font-size: 0.78rem;
  }

  body.dashboard-body th,
  body.dashboard-body td {
    padding: 0.7rem 0.75rem;
    white-space: nowrap;
  }

  body.dashboard-body .empty-history {
    white-space: normal;
  }

  body.dashboard-body .source-funds-overlay {
    padding:
      max(0.7rem, env(safe-area-inset-top))
      max(0.7rem, env(safe-area-inset-right))
      max(0.7rem, env(safe-area-inset-bottom))
      max(0.7rem, env(safe-area-inset-left));
    align-items: center;
  }

  body.dashboard-body .source-funds-modal {
    width: 100%;
    max-width: 440px;
    max-height: calc(100svh - 1.4rem);
    padding: 1.2rem 1rem;
    border-radius: 14px;
  }

  body.dashboard-body .source-funds-modal h2 {
    font-size: 1.3rem;
  }

  body.dashboard-body .source-funds-modal p {
    margin-bottom: 1rem;
    font-size: 0.9rem;
  }

  body.dashboard-body .source-funds-icon {
    margin-bottom: 0.4rem;
    font-size: 2rem;
  }

  body.dashboard-body .toast {
    left: 0.7rem;
    right: 0.7rem;
    bottom: calc(0.7rem + env(safe-area-inset-bottom));
    width: auto;
    text-align: center;
  }
}

@media (max-width: 380px) {
  body.dashboard-body nav {
    padding-inline: 0.55rem;
  }

  body.dashboard-body nav .logo {
    font-size: 0.98rem;
  }

  body.dashboard-body #sendGreeting {
    display: none;
  }

  body.dashboard-body .logout-btn {
    padding-inline: 0.55rem;
    font-size: 0.74rem;
  }

  body.dashboard-body main {
    padding-inline: 0.45rem;
  }

  body.dashboard-body .card {
    padding: 1rem 0.8rem;
  }

  body.dashboard-body .history-tabs {
    grid-template-columns: 1fr;
  }

  body.dashboard-body .breakdown-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.15rem;
  }

  body.dashboard-body .breakdown-row > :last-child {
    max-width: 100%;
    text-align: left;
  }
}


.google-oauth-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  margin-top: 0.75rem;
  text-decoration: none;
  background: var(--red);
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.16);
}

.google-oauth-btn:hover {
  background: #a90f1a;
  color: #ffffff;
}

.google-logo {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border-radius: 50%;
  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
}


.profile-completion-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(3, 10, 18, 0.78);
  backdrop-filter: blur(10px);
}

.profile-completion-overlay .source-funds-modal {
  width: min(520px, 100%);
  color: #172033;
  background: #ffffff;
}


.profile-completion-overlay h2,
.profile-completion-overlay p,
.profile-completion-overlay label,
.profile-completion-overlay .field-help {
  color: #172033;
}

.profile-completion-overlay input {
  color: #172033;
  background: #ffffff;
  border-color: rgba(23, 32, 51, 0.2);
}