/* =========================================================
   DASHBOARD — page styles (no inline hardcodings)
   - Blue buttons scoped to this page
   - Light/Dark aware
   - Mobile safe (no overflow)
   ========================================================= */

/* Tokens / fallbacks */
:root{
  --page-max: 1100px;
  --radius: 12px;
  --gap: 16px;
  --primary: #1a237e;
  --card: #fff;
  --text: #333;
  --border: #e5e0e0;
  --shadow: 0 2px 6px rgba(0,0,0,.06);
  --muted: #666;
  --badge: #e3f2fd;
}

[data-theme="dark"]{
  --card: #0f172a;
  --text: #e5e7eb;
  --border: #243143;
  --shadow: 0 2px 10px rgba(0,0,0,.35);
  --muted: #9aa6b2;
  --badge: #0b1220;
}

/* Utils */
.is-hidden{ display:none !important; }
.w-100{ width:100% !important; }
.btn-sm{ padding:.45rem .7rem; font-size:.9em; }

/* Page wrap */
.dashboard-wrap{
  max-width: var(--page-max);
  margin: 2rem auto;
  padding: 0 clamp(12px, 3vw, 20px);
}

/* Page title */
.page-title{
  margin: 0 0 .5rem;
  text-align: center;
  font-size: clamp(20px, 2.6vw, 26px);
  font-weight: 800;
  color: var(--primary);
}
.hr{ height:1px; background: var(--border); border:0; margin: 12px 0 18px; }

/* Section toggles */
.section-toggle{
  display:flex; align-items:center; gap:8px;
  margin: 18px 0 8px; cursor:pointer;
  color: var(--primary); font-weight: 800;
  font-size: clamp(17px, 2.2vw, 20px);
}
.section-content{ margin-bottom: 1rem; }

/* Cards */
.dash-card{
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(14px, 2.8vw, 22px);
  margin: 12px 0;
}
.entry-card .title{ color: var(--primary); font-weight: 700; }
.badge{
  display:inline-block; padding:6px 10px; border-radius: 8px;
  background: var(--badge); color: var(--primary);
}
.total-bonus{
  text-align:center; background: var(--badge);
  padding:12px 14px; border-radius:10px; margin: 10px 0 14px;
}
.total-bonus .value{ font-size:1.25em; color: var(--primary); font-weight:800; }

/* Referral box */
.referral-box{
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; flex-wrap:wrap;
  background: var(--badge); padding: 12px 14px; border-radius: 10px;
}
.referral-box .link{
  font-size:14px; color: var(--primary); word-break: break-word; max-width:100%;
  text-decoration: underline;
}

/* Flash messages */
.flash{ margin-bottom: 1rem; }
.flash .ok{
  background:#d4edda; color:#155724; padding:10px; border-radius:8px; text-align:center;
}
.flash .err{
  background:#f8d7da; color:#721c24; padding:10px; border-radius:8px; text-align:center;
}

/* Form controls */
.form-control{
  display:block; width:100%;
  padding:10px 12px; border:1px solid var(--border);
  border-radius:10px; background: var(--card); color: var(--text);
}
.form-row{ margin-top:10px; }
.form-hint{ font-size:.92em; color: var(--muted); }
label strong{ font-weight:700; }

/* Buttons — force BLUE on this page (except danger) */
.dashboard-wrap .btn,
.dashboard-wrap a.btn,
.dashboard-wrap button.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.7rem 1rem; border-radius:10px; border:0; cursor:pointer;
  font-weight:700; background: var(--primary) !important; color:#fff !important;
  box-shadow: var(--shadow);
}
.dashboard-wrap .btn:hover{ filter:brightness(.98); }
.dashboard-wrap .btn:active{ transform:translateY(1px); }
.dashboard-wrap .btn[disabled]{ opacity:.6; cursor:not-allowed; background:#9fa8da !important; }

/* Outlined blue (copy, logout) */
.dashboard-wrap .btn-outline{
  background: transparent !important;
  color: var(--primary) !important;
  border: 1px solid var(--primary) !important;
}
.dashboard-wrap .btn-outline:hover{
  background: var(--primary) !important; color:#fff !important;
}

/* Danger stays red (delete account only) */
.dashboard-wrap .btn-danger{
  background: #c62828 !important;
  color:#fff !important;
}

/* Mobile */
@media (max-width: 480px){
  .dashboard-wrap .btn{ width:100%; }
}
/* === DASHBOARD: titluri mai deschise (fără a afecta butoanele) === */
:root{
  /* light: indigo 500 */
  --dash-title-color: #3f51b5;
}
[data-theme="dark"]{
  /* dark: indigo 300 — vizibil pe fundal închis */
  --dash-title-color: #a5b4fc;
}

/* aplicare pe titlurile din dashboard */
.page-title,
.section-toggle,
.entry-card .title{
  color: var(--dash-title-color) !important;
}

/* opțional: și linkul din referral-box să nu fie prea închis în dark */
.referral-box .link{
  color: var(--dash-title-color) !important;
}
/* === DASHBOARD: contain long redeem codes / links inside cards === */

/* 1) Orice “card” din secțiunile topups/gifts/rewards acceptă wrap agresiv */
.dashboard-wrap .dash-card,
.dashboard-wrap .entry-card,
.dashboard-wrap #topups > div,
.dashboard-wrap #gifts  > div,
.dashboard-wrap #rewards > div{
  overflow-wrap: anywhere;   /* rupe șiruri foarte lungi */
  word-break: break-word;    
  white-space: normal;       /* evită nowrap accidental */
}

/* 2) Linkuri și span-uri din card-uri – nu ies în lateral */
.dashboard-wrap #topups a,
.dashboard-wrap #gifts  a,
.dashboard-wrap #rewards a,
.dashboard-wrap #gifts  span,
.dashboard-wrap #rewards span{
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: normal;
}