/* ═══════════════════════════════════════════════════════════════
   APP v3 DARK (23 sept 2026) — partea de DUPĂ login (feed, stats, chat…):
   întunecată, navy adânc din petele ghepardului, cu accentele lui
   (teal / mint / lime) și butoanele „desenate" de pe landing.
   Landing-ul (.lp) și fereastra de Log in / Sign up rămân deschise la culoare.
   Se încarcă DUPĂ styles.css și suprascrie variabilele pentru TOATE temele:
   pe site aspectul rămâne mereu TrackMovo.
   ═══════════════════════════════════════════════════════════════ */
html body, html body[data-theme]{
  --bg:#122033; --card:#1A2C42; --card-2:#22384F;
  --text:#EEF4F7; --text-2:#B7C4CE; --text-3:#8496A6;
  --rule:rgba(255,255,255,.10); --rule-soft:rgba(255,255,255,.05); --rule-strong:rgba(255,255,255,.24);
  --primary:#45C1B5; --accent:#A6F2CE;
  --primary-soft:rgba(69,193,181,.16); --primary-glow:transparent; --on-primary:#15181A;
  --gold:#F5D76E; --danger:#FF7A66;
  --v3-ink:#15181A; --v3-edge:#0A131E; --v3-teal:#45C1B5; --v3-teal-hi:#5CCFC3; --v3-mint:#A6F2CE;
  --v3-navy:#294563; --v3-lime:#C5F84E; --v3-deep:#0E1A29; --v3-field:#0F1C2B;
  --v3-display:'Bricolage Grotesque','Arial Black',system-ui,sans-serif;
  --v3-sh-s:3px 3px 0 var(--v3-edge); --v3-sh:5px 5px 0 var(--v3-edge);
}
body{ background:var(--bg); color:var(--text); }

/* ── titluri în fontul landing-ului ── */
#app h1, #app h2, #app h3, .pro-modal h2, .pro-modal h3, .plan-modal h2, .member-modal h2{
  font-family:var(--v3-display); font-weight:800; letter-spacing:-.02em; }
#app .accent{ color:var(--v3-mint); }

/* ── butoane „desenate" (ca pe landing) ── */
.btn{ border-radius:12px; font-weight:700; transition:transform .12s ease, box-shadow .12s ease, background .12s ease; }
.btn-primary{ background:var(--v3-teal); color:var(--v3-ink); border:2.5px solid var(--v3-edge); box-shadow:var(--v3-sh-s); }
.btn-primary:hover{ background:var(--v3-teal-hi); color:var(--v3-ink); transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--v3-edge); }
.btn-ghost{ background:var(--card-2); color:var(--text); border:2.5px solid var(--v3-edge); box-shadow:var(--v3-sh-s); }
.btn-ghost:hover{ border-color:var(--v3-edge); color:var(--text); background:#2A4460; transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--v3-edge); }
.btn-gold{ background:var(--gold); color:var(--v3-ink); border:2.5px solid var(--v3-edge); box-shadow:var(--v3-sh-s); }
.btn-unlock{ background:var(--v3-teal); color:var(--v3-ink); border:2.5px solid var(--v3-edge); box-shadow:var(--v3-sh-s); }

/* ── containere: suprafață navy + margine închisă + umbră plată ── */
#app .card, #app .post, #app .price-card, #app .challenge-band, #app .kpi, #app .stat-cell, #app .plan-card, #app .mini-card,
#app .macro-tile, #app .chat-box, #app .lb-list, #app .pro-active, #app .dl-feat, #app .form-step, #app .inbox-layout,
#app .feat, #app .testi, #app .theme-card, #app .composer, #app .faq, #app .stat-band, #app .qa-status{
  background:var(--card); border:2px solid var(--v3-edge); box-shadow:var(--v3-sh); }
#app .post .post-video, #app .post .post-thumb, #app .yt-thumb{ border:2px solid var(--v3-edge); }
#app .price-card.hot{ border-color:var(--v3-edge); box-shadow:6px 6px 0 var(--v3-teal); }
#app .hot-badge{ background:var(--v3-lime); color:var(--v3-ink); border:2px solid var(--v3-edge); }
#app .challenge-ico{ background:var(--v3-mint); color:var(--v3-ink); border:2px solid var(--v3-edge); }
#app .progress-bar{ background:var(--v3-field); border:1.5px solid var(--v3-edge); }
#app .progress-fill, #app .challenge-band .progress-fill{ background:var(--v3-teal); box-shadow:none; }

/* ── bara laterală ── */
#app .sidebar{ background:var(--v3-deep); border-right:2px solid var(--v3-edge); }
#app .sb-link{ color:var(--text-2); border:2px solid transparent; }
#app .sb-link:hover{ background:var(--card); color:var(--text); }
#app .sb-link.active{ background:var(--v3-teal); color:var(--v3-ink); border-color:var(--v3-edge); box-shadow:var(--v3-sh-s); }
#app .sb-link.active::before{ display:none; }
#app .sb-link.active .ico{ color:var(--v3-ink); }
#app .sb-profile{ background:var(--card); border:2px solid var(--v3-edge); }
#app .app-topbar{ background:var(--v3-deep); border-bottom:2px solid var(--v3-edge); }
#app .app-burger, #app .icon-btn{ background:var(--card-2); border:2px solid var(--v3-edge); color:var(--text); }
.logo-dot{ box-shadow:none !important; border:2px solid var(--v3-edge); }

/* ── câmpuri de formular ── */
#app .f-field input, #app .f-field select, #app .f-field textarea, #app .chat-input input, #app .composer textarea,
#app .conv-search input, #app .feed-toolbar .search-wrap input, #app .plan-prog-row input, #app .pn-fsearch > input,
.plan-modal .f-field input, .plan-modal .f-field textarea, .member-modal .f-field input{
  background:var(--v3-field); color:var(--text); border:2px solid rgba(255,255,255,.16); }
#app .f-field input:focus, #app .f-field select:focus, #app .f-field textarea:focus, #app .chat-input input:focus, #app .composer textarea:focus{
  border-color:var(--v3-teal); box-shadow:3px 3px 0 var(--v3-edge); outline:none; }

/* ── etichete, cipuri, comutatoare ── */
#app .tag, #app .chip, #app .f-chip, #app .campaign-tag, #app .ctx-chip, #app .pro-chip, #app .sort-btn,
#app .feed-toolbar .sort-btn, #app .feed-toolbar .filter-btn2{ background:var(--card-2); color:var(--text); border:2px solid var(--v3-edge); }
#app .chip.on, #app .f-chip.on{ background:var(--v3-teal); color:var(--v3-ink); border-color:var(--v3-edge); }
#app .tag.pro{ background:var(--v3-lime); color:var(--v3-ink); }
#app .switch{ background:var(--v3-field); border:2px solid var(--v3-edge); }
#app .switch.on{ background:var(--v3-teal); }

/* ── chat ── */
#app .msg.me{ background:var(--v3-teal); color:var(--v3-ink); border:2px solid var(--v3-edge); }
#app .msg.them{ background:var(--card-2); color:var(--text); border:2px solid var(--v3-edge); }

/* ── avatare ── */
#app .avatar, #app .post-ava, #app .lb-ava, #app .conv-ava, .mm-ava{ border:2px solid var(--v3-edge) !important; }

/* ── ferestrele din app (PRO, plan, membru) ── */
.modal-backdrop{ background:rgba(6,11,18,.66); }
.pro-modal, .plan-modal, .member-modal{ background:var(--card); border:2px solid var(--v3-edge); box-shadow:8px 8px 0 var(--v3-edge); }
.mm-close{ background:var(--card-2); border:2px solid var(--v3-edge); color:var(--text); }

/* ── fereastra de Log in / Sign up: rămâne deschisă, ca landing-ul de sub ea ── */
.auth-modal{
  --card:#FFFBF5; --card-2:#F1E9DC; --text:#15181A; --text-2:#434A4E; --text-3:#6B7275;
  --rule:rgba(21,24,26,.14); --rule-strong:rgba(21,24,26,.6); --primary:#1E7F75; --on-primary:#FFFFFF;
  background:#FFFBF5; color:#15181A; border:3px solid var(--v3-ink); box-shadow:10px 10px 0 var(--v3-ink); }
.auth-modal .auth-brand{ font-family:var(--v3-display); font-weight:800; letter-spacing:-.02em; color:#15181A; }
.auth-tabs{ background:#F1E9DC; border:2px solid var(--v3-ink); }
.auth-tab{ color:var(--v3-ink); }
.auth-tab.on{ background:var(--v3-teal); color:var(--v3-ink); border:2px solid var(--v3-ink); box-shadow:2px 2px 0 var(--v3-ink); }
.auth-social-btn{ background:#fff; color:var(--v3-ink); border:2px solid var(--v3-ink); box-shadow:3px 3px 0 var(--v3-ink); }
.auth-social-btn:hover{ background:#D6F7E8; }
.auth-field label{ color:var(--v3-navy); }
.auth-field input{ background:#fff; color:var(--v3-ink); border:2px solid var(--v3-ink); }
.auth-field input:focus{ border-color:var(--v3-navy); box-shadow:3px 3px 0 var(--v3-teal); outline:none; }
.auth-modal .btn-primary{ border-color:var(--v3-ink); box-shadow:3px 3px 0 var(--v3-ink); }
.auth-switch-note button, .auth-forgot, .auth-consent a{ color:var(--v3-navy); }
.auth-modal .mm-close{ background:#fff; border:2px solid var(--v3-ink); color:var(--v3-ink); }

/* ── admin ── */
#admToast{ background:var(--v3-teal); color:var(--v3-ink); border:2px solid var(--v3-edge); }
.adm-edit-btn{ background:#FFF4C2; border:2px solid var(--v3-edge); color:var(--v3-ink); backdrop-filter:none; }

/* ── răspunsuri precompletate din app (formularele din My profile + panoul de membru, 17 oct 2026) ── */
.app-tag{ display:inline-block; margin-left:4px; padding:1px 7px; border-radius:999px; background:var(--primary-soft);
  color:var(--v3-mint); font-family:var(--font-mono); font-size:.6rem; font-weight:600; letter-spacing:.02em;
  text-transform:none; font-style:normal; vertical-align:1px; white-space:nowrap; }
.f-field.from-app input, .f-field.from-app textarea, .f-field.from-app select{ border-color:color-mix(in srgb, var(--primary) 55%, transparent); }
.app-prefill-note .app-tag{ margin:0 2px; }