/* ==========================================================
   GOLDEN STEP SIMULATOR — Design System
   Direction: analog trading-terminal, reimagined for the web.
   Amber phosphor accent on near-black, monospace numerics,
   hairline rule dividers, subtle scanline atmosphere.
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;600;700&display=swap');

:root{
  --bg:            #090C11;
  --bg-alt:        #0D1119;
  --surface:       #11161F;
  --surface-2:     #161C28;
  --border:        rgba(255,255,255,0.08);
  --border-strong: rgba(255,255,255,0.14);

  --amber:      #FFB000;
  --amber-dim:  #8A6100;
  --amber-glow: rgba(255,176,0,0.18);

  --teal:  #00D9A3;
  --red:   #FF4D5E;

  --text:      #ECEFF4;
  --text-dim:  #8B96A8;
  --text-faint:#5B6577;

  --font-display: 'Space Grotesk', sans-serif;
  --font-body:    'Inter', sans-serif;
  --font-mono:    'JetBrains Mono', monospace;

  --radius: 10px;
  --radius-sm: 6px;
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  font-size:15.5px;
  line-height:1.6;
  position:relative;
}

/* faint scanline / grid atmosphere behind everything */
body::before{
  content:"";
  position:fixed; inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
}

.container{ position:relative; z-index:1; }

h1,h2,h3,h4,h5,h6{
  font-family:var(--font-display);
  font-weight:600;
  letter-spacing:-0.01em;
  color:var(--text);
}

a{ color:inherit; text-decoration:none; }

.amber-text{ color:var(--amber); }
.teal-text{ color:var(--teal); }
.blue-text{ color:var(--amber); } /* legacy class kept for compatibility */
.gold-text{ color:var(--amber); } /* legacy class kept for compatibility */
.dim{ color:var(--text-dim); }
.mono{ font-family:var(--font-mono); }

/* ---------------------------------------------------------
   Buttons
   --------------------------------------------------------- */
.btn{
  font-family:var(--font-body);
  font-weight:600;
  font-size:14.5px;
  border-radius:var(--radius-sm);
  padding:11px 22px;
  border:1px solid transparent;
  transition:all .15s ease;
  cursor:pointer;
}
.btn-blue,.btn-gold{
  background:var(--amber);
  color:#151206;
  border-color:var(--amber);
}
.btn-blue:hover,.btn-gold:hover{
  background:#FFC53D;
  border-color:#FFC53D;
  color:#151206;
  transform:translateY(-1px);
}
.btn-outline-light{
  background:transparent;
  border-color:var(--border-strong);
  color:var(--text);
}
.btn-outline-light:hover{
  border-color:var(--amber);
  color:var(--amber);
}
.btn-ghost{
  background:transparent;
  border-color:var(--border);
  color:var(--text-dim);
}
.btn-ghost:hover{ color:var(--text); border-color:var(--border-strong); }
.btn-danger-outline{
  background:transparent;
  border-color:rgba(255,77,94,0.4);
  color:var(--red);
}
.btn-danger-outline:hover{ background:rgba(255,77,94,0.1); }
.btn-sm{ padding:7px 14px; font-size:13px; }
.btn:disabled{ opacity:.5; cursor:not-allowed; }

/* ---------------------------------------------------------
   Navbar
   --------------------------------------------------------- */
.custom-nav{
  background:rgba(9,12,17,0.85);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  padding:14px 0;
}
.navbar-brand{
  font-family:var(--font-display);
  font-size:20px;
  display:flex; align-items:center; gap:8px;
}
.navbar-brand .blink{
  display:inline-block; width:8px; height:8px; border-radius:50%;
  background:var(--teal); box-shadow:0 0 8px var(--teal);
  animation:blink 1.6s ease-in-out infinite;
}
@keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:.25;} }

.nav-link{
  color:var(--text-dim) !important;
  font-size:14.5px;
  font-weight:500;
  padding:8px 14px !important;
  transition:color .15s ease;
}
.nav-link:hover{ color:var(--text) !important; }
.navbar-toggler{ border-color:var(--border); }
.navbar-toggler-icon{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(236,239,244,0.85)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* ---------------------------------------------------------
   Glass / premium card system
   --------------------------------------------------------- */
.glass{
  background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015));
  border:1px solid var(--border);
  border-radius:var(--radius);
  backdrop-filter:blur(6px);
}

.card-premium{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:26px;
  transition:border-color .15s ease, transform .15s ease;
  height:100%;
}

.market-access-card{position:relative;overflow:hidden;transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;}
.market-access-card:hover{transform:translateY(-6px);}
.market-access-icon{width:52px;height:52px;border:1px solid rgba(245,180,35,.28);border-radius:14px;display:flex;align-items:center;justify-content:center;margin-bottom:20px;background:rgba(245,180,35,.07);color:var(--amber,#f5b423);font-size:20px;box-shadow:inset 0 0 20px rgba(245,180,35,.04);}
.market-access-icon i{transition:transform .25s ease;}
.market-access-card:hover .market-access-icon i{transform:scale(1.12);}

.card-premium:hover{
  border-color:var(--border-strong);
}
.card-premium h2,.card-premium h3{ font-family:var(--font-mono); }

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.hero{
  padding:150px 0 70px;
  position:relative;
}
.hero .eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--teal);
  display:inline-flex; align-items:center; gap:8px;
  margin-bottom:18px;
}
.hero .eyebrow::before{
  content:""; width:6px; height:6px; background:var(--teal); border-radius:50%;
  box-shadow:0 0 6px var(--teal);
}
.hero h1{
  font-size:3.1rem;
  line-height:1.08;
}
.hero p.lead-text{
  color:var(--text-dim);
  font-size:17px;
  max-width:520px;
}
.disclosure-note{
  font-family:var(--font-mono);
  font-size:12px;
  color:var(--text-faint);
  border-left:2px solid var(--amber-dim);
  padding-left:10px;
  margin-top:20px;
  max-width:480px;
}

/* ---------------------------------------------------------
   Ticker tape — signature element
   --------------------------------------------------------- */
.ticker-wrapper{
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  background:var(--bg-alt);
  overflow:hidden;
  white-space:nowrap;
  padding:12px 0;
}
.ticker-track{
  display:inline-flex;
  gap:40px;
  animation:tickerScroll 32s linear infinite;
  padding-left:100%;
}
@keyframes tickerScroll{
  0%{ transform:translateX(0); }
  100%{ transform:translateX(-100%); }
}
.ticker-item{
  font-family:var(--font-mono);
  font-size:13.5px;
  color:var(--text-dim);
  display:inline-flex; gap:8px; align-items:center;
}
.ticker-item .up{ color:var(--teal); }
.ticker-item .down{ color:var(--red); }

.trust-strip{
  background:var(--bg-alt);
  border-bottom:1px solid var(--border);
  padding:14px 0;
  font-family:var(--font-mono);
  font-size:12.5px;
  color:var(--text-dim);
}
.trust-strip span{ margin:0 18px; }

/* ---------------------------------------------------------
   Sections
   --------------------------------------------------------- */
.section{ padding:80px 0; }
.section-eyebrow{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--amber);
  margin-bottom:10px;
  display:block;
}
.section h2{ font-size:2rem; margin-bottom:8px; }
.section .section-lead{ color:var(--text-dim); max-width:600px; }

/* ---------------------------------------------------------
   Plan cards
   --------------------------------------------------------- */
.plan-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:32px 28px;
  height:100%;
  display:flex; flex-direction:column;
  position:relative;
}
.plan-card.featured{
  border-color:var(--amber);
  box-shadow:0 0 0 1px var(--amber), 0 20px 40px -20px var(--amber-glow);
}
.plan-card .plan-tag{
  position:absolute; top:-12px; right:24px;
  background:var(--amber); color:#151206;
  font-family:var(--font-mono); font-size:11px; font-weight:700;
  padding:4px 10px; border-radius:20px; letter-spacing:.04em;
}
.plan-card .price{
  font-family:var(--font-mono);
  font-size:2.4rem;
  color:var(--amber);
  margin:14px 0 2px;
}
.plan-card .price span{ font-size:14px; color:var(--text-dim); }
.plan-card ul{ list-style:none; padding:0; margin:22px 0; flex:1; }
.plan-card ul li{
  padding:8px 0;
  border-top:1px solid var(--border);
  font-size:14px;
  color:var(--text-dim);
  display:flex; gap:10px; align-items:flex-start;
}
.plan-card ul li::before{
  content:"›"; color:var(--teal); font-family:var(--font-mono); font-weight:700;
}

/* ---------------------------------------------------------
   Forms
   --------------------------------------------------------- */
.form-control, select.form-control{
  background:var(--surface-2);
  border:1px solid var(--border);
  color:var(--text);
  border-radius:var(--radius-sm);
  padding:11px 14px;
  font-size:14.5px;
}
.form-control:focus{
  background:var(--surface-2);
  border-color:var(--amber);
  color:var(--text);
  box-shadow:0 0 0 3px var(--amber-glow);
  outline:none;
}
.form-control::placeholder{ color:var(--text-faint); }
label{ font-size:13px; color:var(--text-dim); margin-bottom:6px; display:block; }

.auth-shell{
  min-height:100vh;
  display:flex; align-items:center; justify-content:center;
  padding:40px 16px;
}
.auth-card{ width:100%; max-width:430px; padding:44px 38px; }

/* ---------------------------------------------------------
   Tables
   --------------------------------------------------------- */
.table-terminal{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}
.table-terminal th{
  text-align:left;
  font-family:var(--font-mono);
  font-size:11.5px;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--text-faint);
  padding:10px 14px;
  border-bottom:1px solid var(--border-strong);
}
.table-terminal td{
  padding:13px 14px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  font-family:var(--font-mono);
}
.table-terminal tr:last-child td{ border-bottom:none; }
.table-terminal tr:hover td{ background:rgba(255,255,255,0.015); }

.badge-up{ color:var(--teal); font-family:var(--font-mono); }
.badge-down{ color:var(--red); font-family:var(--font-mono); }
.badge-pill{
  display:inline-block;
  font-family:var(--font-mono);
  font-size:11px;
  padding:3px 10px;
  border-radius:20px;
  border:1px solid var(--border-strong);
  color:var(--text-dim);
}
.badge-pill.active{ border-color:var(--teal); color:var(--teal); }
.badge-pill.suspended{ border-color:var(--red); color:var(--red); }

/* ---------------------------------------------------------
   Avatars (initials placeholder — swap for real photos)
   --------------------------------------------------------- */
.avatar-initial{
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg, var(--amber) 0%, var(--amber-dim) 100%);
  color:#151206;
  font-family:var(--font-mono); font-weight:700; font-size:14px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}

/* ---------------------------------------------------------
   FAQ accordion
   --------------------------------------------------------- */
.faq-item{
  border-bottom:1px solid var(--border);
  padding:20px 0;
}
.faq-item summary{
  cursor:pointer; font-weight:600; list-style:none;
  display:flex; justify-content:space-between; align-items:center;
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item summary::after{ content:"+"; color:var(--amber); font-size:20px; font-family:var(--font-mono); }
.faq-item[open] summary::after{ content:"−"; }
.faq-item p{ color:var(--text-dim); font-size:14px; margin:12px 0 0; }

/* ---------------------------------------------------------
   Market terminal / asset list
   --------------------------------------------------------- */
.asset-scroll{ max-height:460px; overflow-y:auto; }
.asset-scroll::-webkit-scrollbar{ width:6px; }
.asset-scroll::-webkit-scrollbar-thumb{ background:var(--border-strong); border-radius:10px; }

.asset-row{
  display:flex; justify-content:space-between; align-items:center;
  padding:11px 12px;
  border-radius:var(--radius-sm);
  font-family:var(--font-mono);
  font-size:13.5px;
  cursor:pointer;
  transition:background .12s ease;
  margin-bottom:2px;
}
.asset-row:hover{ background:var(--surface-2); }
.asset-row.active{ background:var(--surface-2); border:1px solid var(--amber-dim); }
.asset-row span{ color:var(--text-dim); }
.asset-row.up span.chg{ color:var(--teal); }
.asset-row.down span.chg{ color:var(--red); }

.mt5-badge{
  font-family:var(--font-mono);
  font-size:11px;
  color:var(--teal);
  border:1px solid var(--teal);
  padding:4px 10px;
  border-radius:20px;
}

/* ---------------------------------------------------------
   Support chat
   --------------------------------------------------------- */
.support-topbar{ background:var(--surface-2); border-bottom:1px solid var(--border); }
.agent-avatar{
  width:42px; height:42px; border-radius:50%;
  background:var(--amber-glow); display:flex; align-items:center; justify-content:center;
  font-size:18px;
}
.support-body{ min-height:340px; max-height:440px; overflow-y:auto; background:var(--bg-alt); }
.support-input{ background:var(--surface-2); border-top:1px solid var(--border); }
.msg{
  max-width:75%;
  padding:10px 14px;
  border-radius:14px;
  margin-bottom:10px;
  font-size:14px;
  line-height:1.5;
}
.msg.agent{ background:var(--surface-2); border:1px solid var(--border); }
.msg.user{ background:var(--amber); color:#151206; margin-left:auto; font-weight:500; }

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.footer-section{
  background:var(--bg-alt);
  border-top:1px solid var(--border);
}
.footer-section h4,.footer-section h5{ font-family:var(--font-display); }
.footer-section a{ color:var(--text-dim); font-size:14px; }
.footer-section a:hover{ color:var(--amber); }
.footer-section ul li{ margin-bottom:8px; }
.footer-legal{
  font-family:var(--font-mono);
  font-size:11.5px;
  color:var(--text-faint);
  line-height:1.7;
}

/* ---------------------------------------------------------
   Alerts
   --------------------------------------------------------- */
.alert{
  border-radius:var(--radius-sm);
  border:1px solid;
  font-size:14px;
  padding:12px 16px;
}
.alert-danger{ background:rgba(255,77,94,0.08); border-color:rgba(255,77,94,0.3); color:#FF8A96; }
.alert-info{ background:rgba(0,217,163,0.08); border-color:rgba(0,217,163,0.3); color:var(--teal); }
.alert-success{ background:rgba(0,217,163,0.08); border-color:rgba(0,217,163,0.3); color:var(--teal); }

/* ---------------------------------------------------------
   Misc utilities
   --------------------------------------------------------- */
.stat-num{ font-family:var(--font-mono); font-size:2rem; color:var(--amber); }
.divider{ border-top:1px solid var(--border); margin:0; }
.pl-positive{ color:var(--teal); }
.pl-negative{ color:var(--red); }

.sidebar-admin{
  background:var(--surface);
  border-right:1px solid var(--border);
  min-height:calc(100vh - 0px);
  padding:26px 18px;
}
.sidebar-admin a{
  display:block;
  padding:10px 14px;
  border-radius:var(--radius-sm);
  color:var(--text-dim);
  font-size:14px;
  margin-bottom:4px;
}
.sidebar-admin a:hover, .sidebar-admin a.active{
  background:var(--surface-2);
  color:var(--amber);
}

@media (max-width: 991px){
  .hero{ padding:130px 0 50px; }
  .hero h1{ font-size:2.2rem; }
}

/* Brokerage conversion */
.market-chart{width:100%;min-height:360px;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:rgba(0,0,0,.12)}
.market-chart.small{min-height:260px}.hero-terminal{padding:18px}.terminal-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}.terminal-stats span{font-size:11px;color:var(--text-dim);font-family:var(--font-mono)}.terminal-stats b{display:block;color:var(--text);font-size:12px;margin-top:3px}.arabic-section{background:linear-gradient(180deg,rgba(255,255,255,.015),transparent)}.person-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:10px;height:100%}.person-card img{width:100%;height:170px;object-fit:cover;border-radius:12px;margin-bottom:10px}.person-card strong,.person-card span{display:block}.person-card strong{font-size:14px}.person-card span{font-size:11px;color:var(--text-dim);margin-top:3px}.feature-list{padding-left:18px;color:var(--text-dim)}.feature-list li{margin:10px 0}.market-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px solid var(--border)}

/* Client experience additions */
.balance-card{background:linear-gradient(135deg,rgba(217,164,65,.08),rgba(255,255,255,.02));border-color:rgba(217,164,65,.22)}
.balance-value{font-family:var(--font-mono);font-size:2rem;color:var(--text);letter-spacing:-.03em}
.arabic-feature-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.arabic-feature-pills span{padding:7px 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-size:12px;color:var(--text-dim)}
.testimonial-section{background:linear-gradient(180deg,rgba(255,255,255,.012),transparent)}
.testimonial-card{height:100%;padding:28px;border:1px solid var(--border);border-radius:18px;background:var(--surface);position:relative}.quote-mark{font-family:Georgia,serif;font-size:54px;line-height:.8;color:var(--amber);opacity:.65}.testimonial-card p{color:var(--text);font-size:15px;line-height:1.75;margin:14px 0 24px}.testimonial-person{display:flex;align-items:center;gap:12px}.testimonial-person .avatar-initial{width:38px;height:38px}.testimonial-person strong,.testimonial-person span{display:block}.testimonial-person strong{font-size:13px}.testimonial-person span{font-size:11px;color:var(--text-faint);margin-top:2px}


/* Live-motion client experience */
.btn-blue,.btn-gold{background:var(--amber)!important;color:#151206!important;border-color:var(--amber)!important;box-shadow:0 8px 22px rgba(255,176,0,.12)}
.btn-blue:hover,.btn-gold:hover{background:#FFC53D!important;border-color:#FFC53D!important;color:#151206!important}
.auth-shell-centered{min-height:calc(100vh - 76px);padding-top:30px;padding-bottom:70px}
.auth-shell-centered .auth-card{margin-left:auto;margin-right:auto;box-shadow:0 24px 70px rgba(0,0,0,.28)}
.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px rgba(0,217,163,.7);animation:livePulse 1.4s ease-in-out infinite;margin-right:6px;vertical-align:middle}
@keyframes livePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}
.live-chip{display:inline-flex;align-items:center;border:1px solid rgba(0,217,163,.25);background:rgba(0,217,163,.06);border-radius:999px;padding:5px 9px;color:var(--teal);font-family:var(--font-mono);font-size:10px;letter-spacing:.04em}
.dashboard-stat-card{min-height:150px}.balance-meta{display:flex;justify-content:space-between;gap:12px;margin-top:16px;color:var(--text-faint);font-size:11px;font-family:var(--font-mono)}
.progress-track{height:6px;background:var(--surface-2);border-radius:99px;overflow:hidden}.progress-fill{height:100%;width:33%;background:linear-gradient(90deg,var(--amber),#ffd36b);border-radius:99px;transition:width .5s ease}
.status-indicator{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--teal);box-shadow:0 0 12px rgba(0,217,163,.55);margin-right:8px;animation:livePulse 1.8s infinite}
.market-pulse-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.pulse-card{padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);min-width:0}.pulse-card span,.live-pulse-item span{display:block;color:var(--text-faint);font:11px var(--font-mono);letter-spacing:.04em}.pulse-card strong{display:block;font:600 19px var(--font-mono);margin:7px 0;color:var(--text)}.pulse-card em,.live-pulse-item em{font-style:normal;font:11px var(--font-mono)}.up{color:var(--teal)!important}.down{color:var(--red)!important}.pulse-flash{animation:valueFlash .55s ease}@keyframes valueFlash{0%{opacity:.45;transform:translateY(2px)}100%{opacity:1;transform:none}}
.live-activity{border-top:1px solid var(--border)}.activity-line{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--border)}.activity-icon{width:34px;height:34px;border-radius:10px;background:var(--amber-glow);display:grid;place-items:center;color:var(--amber);flex:0 0 auto}.activity-line div{min-width:0;flex:1}.activity-line strong,.activity-line small{display:block}.activity-line strong{font-size:13px}.activity-line small{color:var(--text-faint);font-size:11px;margin-top:2px}.activity-time{font:10px var(--font-mono);color:var(--teal)}
.dashboard-action-card{min-height:0}.arabic-dashboard{background:linear-gradient(145deg,rgba(255,176,0,.06),rgba(0,217,163,.03))}.arabic-live{font:11px var(--font-mono);color:var(--teal)}
.live-pulse-section{padding:22px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:rgba(13,17,25,.88)}.live-pulse-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.live-pulse-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.live-pulse-item{padding:14px 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface);min-width:0}.live-pulse-item strong{display:block;font:600 17px var(--font-mono);margin:5px 0}.pulse-disclaimer{margin:12px 0 0;color:var(--text-faint);font-size:11px}
@media(max-width:991px){.market-pulse-grid{grid-template-columns:repeat(2,1fr)}.live-pulse-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:575px){.market-pulse-grid,.live-pulse-grid{grid-template-columns:1fr}.live-pulse-header{align-items:flex-start;gap:12px;flex-direction:column}}

/* Admin authentication */
.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:32px 18px;}
.auth-card{width:min(430px,100%);margin:0 auto;}
.admin-login-btn{background:linear-gradient(135deg,#d8a83e,#b98318)!important;border:1px solid #e2bd61!important;color:#111827!important;font-weight:700!important;box-shadow:0 10px 28px rgba(216,168,62,.22);}
.admin-login-btn:hover{filter:brightness(1.08);transform:translateY(-1px);}

/* Minimal client language selector — intentionally does not alter the existing layout. */
.language-picker{display:flex;align-items:center}
.language-select{
  background:var(--surface);
  color:var(--text);
  border:1px solid var(--border);
  border-radius:6px;
  padding:7px 28px 7px 10px;
  font:500 13px var(--font-body);
  min-width:112px;
  outline:none;
}
.language-select:focus{border-color:var(--amber);}


/* Small additions for asset selection and client services; existing design preserved. */
.asset-row{cursor:pointer;transition:background .15s ease,border-color .15s ease}
.asset-row.active-asset{background:rgba(255,176,0,.07);border-color:rgba(255,176,0,.28)}
.active-time{color:var(--amber)!important;border-color:rgba(255,176,0,.45)!important}
.service-status{font-family:var(--font-mono);font-size:12px;color:var(--teal);display:flex;align-items:center;gap:8px}

/* Dashboard right-column cards: prevent 100% card height from extending into the footer. */
.dashboard-action-card,
.client-service-card{
  height:auto !important;
}

/* Clients admin: keep management controls compact and orderly without changing behavior. */
.client-manage { min-width: 330px; vertical-align: middle; }
.clients-table-card .table-terminal tbody tr { min-height: 190px; }
.clients-table-card .table-terminal tbody td { padding-top: 24px; padding-bottom: 24px; vertical-align: middle; }
.client-manage-form { margin: 0; display: flex; flex-direction: column; gap: 10px; }
.manage-fields { display: grid; grid-template-columns: 1fr 1.45fr; gap: 10px; }
.manage-fields .form-control { width: 100% !important; min-width: 0; }
.manage-balance-actions, .manage-account-actions { display: grid; grid-template-columns: 1fr 1.25fr; gap: 10px; }
.manage-balance-actions .btn, .manage-account-actions .btn { width: 100%; margin: 0; white-space: nowrap; }
.manage-account-actions { margin-top: 2px; }
@media (max-width: 1200px) {
  .client-manage { min-width: 300px; }
  .manage-fields { grid-template-columns: 1fr 1.25fr; }
}

/* Mobile admin responsiveness — layout only, no functionality changes. */
@media (max-width: 767px){
  body{overflow-x:hidden;}
  body > .d-flex{display:block !important; width:100%;}
  .sidebar-admin{
    width:100% !important;
    min-height:auto !important;
    padding:14px 12px !important;
    border-right:0;
    border-bottom:1px solid var(--border);
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:4px;
    overflow-x:auto;
  }
  .sidebar-admin h5{
    width:100%;
    margin:0 0 8px !important;
    padding:0 4px;
  }
  .sidebar-admin a{
    display:inline-flex;
    align-items:center;
    width:auto;
    margin:0 !important;
    padding:9px 11px;
    white-space:nowrap;
    flex:0 0 auto;
  }
  .sidebar-admin .divider{display:none;}
  body > .d-flex > .flex-fill{
    width:100%;
    padding:18px 12px !important;
  }

  /* Keep page headers usable on narrow screens. */
  .flex-fill > .d-flex.justify-content-between{
    align-items:stretch !important;
    flex-direction:column;
    gap:12px;
    margin-bottom:18px !important;
  }
  .flex-fill > .d-flex.justify-content-between form{
    width:100%;
  }
  .flex-fill > .d-flex.justify-content-between form .form-control{min-width:0; flex:1 1 auto;}

  /* Clients: turn each table row into a spacious mobile card. */
  .clients-table-card{overflow:hidden;}
  .clients-table-card .table-responsive{overflow:visible;}
  .clients-table-card .table-terminal,
  .clients-table-card .table-terminal tbody,
  .clients-table-card .table-terminal tr,
  .clients-table-card .table-terminal td{display:block; width:100%;}
  .clients-table-card .table-terminal thead{display:none;}
  .clients-table-card .table-terminal tbody tr{
    min-height:0 !important;
    padding:18px 14px;
    border-bottom:1px solid var(--border-strong);
  }
  .clients-table-card .table-terminal tbody tr:last-child{border-bottom:0;}
  .clients-table-card .table-terminal tbody td{
    padding:7px 0 !important;
    border:0;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    text-align:right;
    font-family:var(--font-mono);
  }
  .clients-table-card .table-terminal tbody td:first-child{
    display:block;
    text-align:left;
    padding-bottom:12px !important;
  }
  .clients-table-card .table-terminal tbody td:nth-child(2)::before{content:'Tier';}
  .clients-table-card .table-terminal tbody td:nth-child(3)::before{content:'Tier request';}
  .clients-table-card .table-terminal tbody td:nth-child(4)::before{content:'Balance';}
  .clients-table-card .table-terminal tbody td:nth-child(5)::before{content:'Status';}
  .clients-table-card .table-terminal tbody td:nth-child(6)::before{content:'Joined';}
  .clients-table-card .table-terminal tbody td:nth-child(2)::before,
  .clients-table-card .table-terminal tbody td:nth-child(3)::before,
  .clients-table-card .table-terminal tbody td:nth-child(4)::before,
  .clients-table-card .table-terminal tbody td:nth-child(5)::before,
  .clients-table-card .table-terminal tbody td:nth-child(6)::before{
    color:var(--text-faint);
    font:11px var(--font-mono);
    text-transform:uppercase;
    letter-spacing:.05em;
    text-align:left;
    flex:0 0 auto;
  }
  .clients-table-card .table-terminal tbody td:nth-child(3){align-items:flex-start;}
  .clients-table-card .table-terminal tbody td:nth-child(3) > *{max-width:65%;}

  .client-manage{
    min-width:0 !important;
    margin-top:12px;
    padding-top:15px !important;
    border-top:1px solid var(--border) !important;
    display:block !important;
  }
  .client-manage-form{width:100%; gap:9px;}
  .manage-fields,
  .manage-balance-actions,
  .manage-account-actions{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  .manage-fields .form-control{min-width:0;}
  .manage-balance-actions .btn,
  .manage-account-actions .btn{min-width:0; padding-left:8px; padding-right:8px;}
}

@media (max-width: 420px){
  .sidebar-admin a{font-size:13px; padding:8px 9px;}
  body > .d-flex > .flex-fill{padding:14px 9px !important;}
  .clients-table-card .table-terminal tbody tr{padding:16px 11px;}
  .manage-fields,
  .manage-balance-actions,
  .manage-account-actions{grid-template-columns:1fr;}
}

/* Mobile admin dashboard: keep the Recent clients section fully within the viewport. */
@media (max-width: 767px){
  .admin-recent-table{width:100% !important;}
  .admin-recent-table thead{display:none;}
  .admin-recent-table,
  .admin-recent-table tbody,
  .admin-recent-table tbody tr,
  .admin-recent-table tbody td{display:block;width:100%;}
  .admin-recent-table tbody tr{
    padding:16px 4px;
    border-bottom:1px solid var(--border);
  }
  .admin-recent-table tbody tr:last-child{border-bottom:0;}
  .admin-recent-table tbody td{
    border:0;
    padding:6px 0 !important;
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    text-align:right;
    min-width:0;
  }
  .admin-recent-table tbody td:first-child{
    display:block;
    text-align:left;
    padding-bottom:10px !important;
  }
  .admin-recent-table tbody td:nth-child(2)::before{content:'Email';}
  .admin-recent-table tbody td:nth-child(3)::before{content:'Tier';}
  .admin-recent-table tbody td:nth-child(4)::before{content:'Status';}
  .admin-recent-table tbody td:nth-child(5)::before{content:'Joined';}
  .admin-recent-table tbody td:nth-child(2)::before,
  .admin-recent-table tbody td:nth-child(3)::before,
  .admin-recent-table tbody td:nth-child(4)::before,
  .admin-recent-table tbody td:nth-child(5)::before{
    color:var(--text-faint);
    font:11px var(--font-mono);
    text-transform:uppercase;
    letter-spacing:.05em;
    text-align:left;
    flex:0 0 auto;
  }
  .admin-recent-table tbody td:nth-child(2){word-break:break-word;}
  .admin-recent-table tbody td:nth-child(2),
  .admin-recent-table tbody td:nth-child(3),
  .admin-recent-table tbody td:nth-child(4),
  .admin-recent-table tbody td:nth-child(5){font-family:var(--font-mono);}
}
@media (max-width: 420px){
  .admin-recent-table tbody tr{padding:14px 2px;}
}

/* Language selector title; preserves the existing navigation layout. */
.language-label{font-size:12px;color:var(--muted,#9aa4b2);margin-right:7px;white-space:nowrap;font-weight:600;}
[dir="rtl"] .language-label{margin-right:0;margin-left:7px;}


/* ==========================================================
   Professional homepage layer
   ========================================================== */
.hero-pro{overflow:hidden;isolation:isolate;--mx:0px;--my:0px}
.hero-pro::before,.hero-pro::after{content:"";position:absolute;pointer-events:none;z-index:-1;border-radius:50%;filter:blur(8px);transition:transform .25s ease}
.hero-pro::before{width:420px;height:420px;right:-110px;top:70px;background:radial-gradient(circle,rgba(255,176,0,.14),transparent 68%);transform:translate3d(var(--mx),var(--my),0)}
.hero-pro::after{width:520px;height:520px;left:-260px;bottom:-180px;background:radial-gradient(circle,rgba(0,217,163,.09),transparent 68%)}
.hero-pro .hero-terminal{box-shadow:0 28px 80px rgba(0,0,0,.35),0 0 0 1px rgba(255,176,0,.03);position:relative;overflow:hidden}
.hero-pro .hero-terminal::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(255,255,255,.018) 50%);background-size:100% 5px;pointer-events:none;opacity:.45}
.section-tight{padding:34px 0 24px}
.cockpit-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:16px}
.market-status{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px;color:var(--text-dim);letter-spacing:.08em}
.market-status small{font-family:var(--font-body);letter-spacing:0;text-transform:none;color:var(--text-faint);margin-left:4px}
.cockpit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.quote-card{position:relative;min-height:176px;padding:20px;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.quote-card:hover{transform:translateY(-3px);border-color:rgba(255,176,0,.28);box-shadow:0 16px 40px rgba(0,0,0,.22)}
.featured-quote{border-color:rgba(255,176,0,.2);background:linear-gradient(145deg,rgba(255,176,0,.07),rgba(255,255,255,.015))}
.quote-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--font-mono);font-size:12px;color:var(--text-dim)}
.quote-tag{font-size:9px;padding:4px 7px;border:1px solid var(--border);border-radius:999px;color:var(--text-faint)}
.quote-value{font-family:var(--font-mono);font-size:27px;font-weight:600;margin-top:16px;letter-spacing:-.04em}
.quote-change{font-family:var(--font-mono);font-size:12px;margin-top:3px}
.value-flash{animation:valueFlash .5s ease}
@keyframes valueFlash{0%{opacity:.35;transform:translateY(3px)}100%{opacity:1;transform:translateY(0)}}
.sparkline{height:42px;display:flex;align-items:flex-end;gap:2px;margin-top:13px;opacity:.8}
.sparkline i{display:block;flex:1;min-width:2px;background:linear-gradient(to top,var(--amber-dim),var(--amber));border-radius:2px 2px 0 0;transition:height .45s ease;opacity:.65}
.market-news-bar{display:flex;align-items:center;margin-top:12px;border:1px solid var(--border);background:var(--bg-alt);border-radius:10px;overflow:hidden;height:44px}
.news-label{height:100%;display:flex;align-items:center;gap:8px;padding:0 16px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--teal);border-right:1px solid var(--border);white-space:nowrap}
.news-window{overflow:hidden;flex:1;position:relative;height:100%}
.news-track{height:100%;display:flex;align-items:center;gap:70px;width:max-content;padding-left:24px;font-size:12px;color:var(--text-dim);white-space:nowrap}
.news-track span{display:inline-block}
.live-pulse-section{padding-top:32px}
@media(max-width:991px){.cockpit-grid{grid-template-columns:repeat(2,1fr)}.hero-pro{padding-top:120px}}
@media(max-width:575px){.cockpit-grid{grid-template-columns:1fr}.cockpit-head{align-items:flex-start;flex-direction:column}.market-status small{display:none}.quote-card{min-height:160px}}