/* ============================================================
   LEQAL theme layer for authenticated / auth pages (login,
   register, cabinet, game pages). Loaded AFTER main.css so it
   recolors the legacy palette to LEQAL without touching page
   markup or JS. No global resets here (that would break layout).
   ============================================================ */
:root {
  --leqal-green: #25c53f;
  --leqal-green-2: #2df052;
  --leqal-green-dk: #0f8c28;
  --leqal-gold: #f2c85b;
  --leqal-gold-dk: #b9862a;
  --leqal-bg: #030604;
  --leqal-panel: #0b1710;
  --leqal-panel-2: #0f1d13;
  --leqal-border: rgba(55, 255, 91, .18);
}

/* --- page background --- */
body {
  background:
    radial-gradient(circle at 75% 4%, rgba(26, 123, 46, .22), transparent 24%),
    radial-gradient(circle at 20% 18%, rgba(157, 116, 32, .10), transparent 20%),
    var(--leqal-bg) !important;
  color: rgba(255, 255, 255, .85);
}

/* --- LEQAL top app bar (injected in _Layout) --- */
.leqal-appbar {
  position: sticky; top: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 10px clamp(14px, 4vw, 48px);
  background: rgba(4, 12, 7, .92);
  border-bottom: 1px solid var(--leqal-border);
  backdrop-filter: blur(6px);
}
.leqal-appbar-logo img { height: 42px; width: auto; display: block; }
.leqal-appbar nav { display: flex; align-items: center; gap: 10px; }
.leqal-appbar-btn {
  min-height: 40px; padding: 0 18px; display: inline-flex; align-items: center;
  border-radius: 10px; font-weight: 800; text-decoration: none;
  background: linear-gradient(180deg, var(--leqal-green-2), var(--leqal-green-dk));
  color: #04220c !important; border: 0;
}
.leqal-appbar-btn.ghost {
  background: transparent; color: #fff !important;
  border: 1px solid var(--leqal-border);
}
.leqal-appbar-btn:hover { filter: brightness(1.06); }

/* balance chip in the top navbar */
.leqal-appbar .leqal-balance {
  background: rgba(0, 0, 0, .28) !important;
  border: 1px solid var(--leqal-gold) !important;
  color: var(--leqal-gold) !important;
  font-weight: 900;
}
.leqal-appbar .leqal-balance .plus {
  margin-left: 4px; width: 18px; height: 18px; line-height: 16px; text-align: center;
  display: inline-block; border-radius: 50%;
  background: linear-gradient(180deg, var(--leqal-green-2), var(--leqal-green-dk)); color: #04220c;
}
.leqal-appbar-burger {
  min-height: 40px; padding: 0 12px; font-size: 20px; line-height: 1;
  border: 1px solid var(--leqal-border); border-radius: 10px;
  background: transparent; color: #fff;
}

/* --- buttons --- */
.btn, .cmn--btn, .btn-primary, .btn-success, .copun_button {
  background: linear-gradient(180deg, var(--leqal-green-2), var(--leqal-green-dk)) !important;
  border-color: transparent !important;
  color: #04220c !important;
  font-weight: 800;
}
.btn-warning, .btn-gold {
  background: linear-gradient(180deg, var(--leqal-gold), var(--leqal-gold-dk)) !important;
  border-color: transparent !important;
  color: #241a03 !important;
}
.btn-outline-primary, .btn-outline-success {
  background: transparent !important;
  border: 1px solid var(--leqal-border) !important;
  color: #fff !important;
}
.btn-danger { background: linear-gradient(180deg, #e2445c, #a11228) !important; }
.btn:hover, .cmn--btn:hover { filter: brightness(1.07); }

/* --- links / accents --- */
a { color: var(--leqal-gold); }
a:hover { color: var(--leqal-green); }
.text--base, .text-warning, .text--warning { color: var(--leqal-gold) !important; }
.text--primary, .text-success, .text--success { color: var(--leqal-green) !important; }
h1, h2, h3, h4, h5, h6, .title { color: #fff; }

/* --- panels / cards / modals --- */
.card, .modal-content, .single-item, .dashboard-inner, .box,
.account__form, .lr_form, .welcome_user, .bonus_left, .label_head {
  background: var(--leqal-panel) !important;
  border: 1px solid var(--leqal-border) !important;
  border-radius: 14px;
  color: rgba(255, 255, 255, .85);
}
.modal-header, .modal-footer { border-color: var(--leqal-border) !important; }
.modal-title { color: #fff !important; }

/* --- form controls --- */
.form-control, .form--control, input:not([type=checkbox]):not([type=radio]),
select, textarea {
  background: rgba(0, 0, 0, .34) !important;
  border: 1px solid var(--leqal-border) !important;
  color: #fff !important;
}
.form-control:focus, .form--control:focus, input:focus, select:focus, textarea:focus {
  border-color: rgba(37, 197, 63, .7) !important;
  box-shadow: 0 0 0 3px rgba(37, 197, 63, .12) !important;
}
::placeholder { color: rgba(255, 255, 255, .45) !important; }

/* --- tables --- */
.table, .table td, .table th { color: rgba(255, 255, 255, .85); border-color: var(--leqal-border) !important; }
.table thead th { color: var(--leqal-gold); }

/* --- auth pages (login / register) --- */
.account-section { background: transparent !important; }
.lr_page, .inner_lr_page { background: transparent !important; }
.lr_form {
  padding: clamp(20px, 4vw, 40px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .45);
}

/* --- preloader: tint the cube to LEQAL green --- */
.preloader { background: var(--leqal-bg) !important; }
.cube__face i, .cube__face { background: rgba(37, 197, 63, .85) !important; box-shadow: 0 0 12px rgba(37, 197, 63, .6); }

/* extra spacing */
.welcome_user { padding-left: 1rem; }
