/* ===== CLEVERALPHA CALCULATOR SUITE — UNIFIED DESIGN SYSTEM OVERRIDE (/shared/suite-calculator-shell.css) ===== */
:root {
  --jade: #40C1AC !important;
  --jade-hover: #4FD4BE !important;
  --jade-dim: rgba(64,193,172,0.08) !important;
  --jade-line: rgba(64,193,172,0.28) !important;
  --gold: #D4AF37 !important;
  --gold-dim: rgba(212,175,55,0.08) !important;
  --gold-line: rgba(212,175,55,0.28) !important;
  --black: #000000 !important;
  --ink-9: #0A0A0A !important;
  --ink-8: #111111 !important;
  --ink-7: #1A1A1A !important;
  --ink-6: #222222 !important;
  --ink-3: #8E8E8E !important;
  --ink-2: #B0B0B0 !important;
  --ink-1: #E0E0E0 !important;
  --white: #FFFFFF !important;
  --border: #2a2a2a !important;
  --bg-primary: #000000 !important;
  --bg-secondary: #0A0A0A !important;
  --bg-card: #0A0A0A !important;
  --bg-input: #111111 !important;
  --bg-elevated: #111111 !important;
  --accent-green: #40C1AC !important;
  --accent-amber: #D4AF37 !important;
  --accent-red: #ef4444 !important;
  --radius: 0px !important;
  --radius-sm: 0px !important;
  --radius-lg: 0px !important;
  --font-h: Poppins, sans-serif;
  --font-b: Lato, sans-serif;
  --font-m: 'JetBrains Mono', monospace;
}

*, *::before, *::after {
  border-radius: 0px !important;
}

body {
  font-family: var(--font-b) !important;
  background: #000000 !important;
  color: #FFFFFF !important;
  padding-top: 64px !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-h) !important;
  font-weight: 700 !important;
}

/* Hide legacy flagship hero, howto & cookie-banner blocks */
.tool-hero, .ca-tool-eyebrow, #drawerOverlay, #navDrawer, #cookie-banner {
  display: none !important;
}

/* Suite Hero */
.ca-suite-hero {
  padding: 44px 32px 28px;
  border-bottom: 1px solid #2a2a2a;
  background: radial-gradient(ellipse 70% 90% at 0% 30%, rgba(64,193,172,0.06), transparent),
              radial-gradient(ellipse 50% 70% at 100% 100%, rgba(212,175,55,0.04), transparent);
}
.ca-suite-hero-inner {
  max-width: 1180px;
  margin: 0 auto;
}
.ca-suite-eyebrow {
  font-family: var(--font-b);
  font-size: 0.7rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #B0B0B0;
}
.ca-suite-hero h1 {
  font-size: clamp(1.85rem, 3.9vw, 2.9rem);
  margin: 8px 0 12px;
  line-height: 1.18;
  color: #FFFFFF;
}
.ca-suite-hero h1 .jade { color: #40C1AC; }
.ca-suite-hero h1 .gold { color: #D4AF37; }
.ca-suite-hero-tag {
  font-size: 0.96rem;
  color: #E0E0E0;
  max-width: 780px;
  line-height: 1.6;
}

/* Suite Top Shell Container (Visual Explainer + Verdict Banner) */
.ca-suite-top-wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 24px 32px 0;
}
@media (max-width: 760px) {
  .ca-suite-hero { padding: 36px 16px 24px; }
  .ca-suite-top-wrap { padding: 18px 16px 0; }
}

.ca-suite-module {
  background: #0A0A0A;
  border: 1px solid #2a2a2a;
  padding: 22px 24px;
  margin-bottom: 24px;
}
.ca-suite-module-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
}
.ca-suite-chips-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
  padding: 12px;
  background: #111111;
  border: 1px solid #2a2a2a;
}
.ca-suite-cliff {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 12px 14px;
  background: #111111;
  border: 1px solid #2a2a2a;
  border-left: 3px solid #40C1AC;
  cursor: pointer;
  text-align: left;
  width: 100%;
}
.ca-suite-cliff.warn { border-left-color: #D4AF37; }
.ca-suite-cliff.bad { border-left-color: #ef4444; }
.ca-suite-cliff .c-tag {
  font-family: var(--font-m);
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 3px 7px;
  background: rgba(64,193,172,0.1);
  color: #40C1AC;
  flex-shrink: 0;
}
.ca-suite-cliff.warn .c-tag { background: rgba(212,175,55,0.1); color: #D4AF37; }
.ca-suite-cliff.bad .c-tag { background: rgba(239,68,68,0.1); color: #ef4444; }

.ca-suite-verdict {
  background: #0A0A0A;
  border: 1px solid rgba(64,193,172,0.28);
  border-left: 4px solid #40C1AC;
  padding: 18px 22px;
  margin-bottom: 18px;
}
.ca-suite-verdict-hl {
  font-family: var(--font-h);
  font-size: clamp(1.02rem, 2vw, 1.26rem);
  font-weight: 700;
  color: #FFFFFF;
  margin-bottom: 6px;
}
.ca-suite-verdict-sl {
  font-family: var(--font-m);
  font-size: 0.82rem;
  color: #B0B0B0;
  line-height: 1.5;
}

/* Normalize inner calculator containers & cards to Suite Design System */
.tool-body > .container,
.tool-body > .container-fluid,
#app.container {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 8px 32px 48px !important;
}
@media (max-width: 760px) {
  .tool-body > .container,
  .tool-body > .container-fluid,
  #app.container {
    padding: 8px 16px 40px !important;
  }
}

.b-card, .ca-card, .card, .panel, .section-card, .result-card, .chart-box, .input-panel, .output-panel, .step-container {
  background: #0A0A0A !important;
  border: 1px solid #2a2a2a !important;
  box-shadow: none !important;
}

input[type="number"], input[type="text"], input[type="date"], select, textarea {
  background-color: #111111 !important;
  border: 1px solid #2a2a2a !important;
  color: #FFFFFF !important;
  font-family: var(--font-b) !important;
}
input:focus, select:focus, textarea:focus {
  border-color: #40C1AC !important;
  outline: none !important;
}

/* Info Modal */
.ca-shell-info-ov {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.75);
  backdrop-filter: blur(8px);
  z-index: 9650;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.ca-shell-info-ov.open { display: flex; }
.ca-shell-info-modal {
  max-width: 560px;
  width: 100%;
  background: #0A0A0A;
  border: 1px solid rgba(64,193,172,0.3);
  box-shadow: 0 20px 60px rgba(0,0,0,0.8);
  max-height: 90vh;
  overflow-y: auto;
}
.ca-shell-info-hd {
  padding: 18px 22px 14px;
  border-bottom: 1px solid #2a2a2a;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.ca-shell-info-bd { padding: 16px 22px 22px; }
.ca-shell-info-lbl {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #D4AF37;
  margin-bottom: 6px;
}
.ca-shell-info-bd p {
  font-size: 0.86rem;
  color: #E0E0E0;
  line-height: 1.6;
  margin-bottom: 14px;
}
