/* ============================================================
   HCAI 2027 — Workshop theme overrides (SELF-CONTAINED)
   Loads AFTER HAXD's stylesheets and only re-skins this page.
   Does NOT modify any HAXD file. Identity: Teal + Amber.
   ============================================================ */

:root,
html[data-theme="light"],
html[data-theme="dark"] {
  /* Re-map HAXD brand accents to teal/amber */
  --primary-color:  #0D9488;   /* Teal */
  --primary-light:  #14B8A6;
  --primary-dark:   #0F766E;
  --primary-accent: #F59E0B;   /* Amber highlight */
  --accent-color:   #F59E0B;
  --accent-light:   #FBBF24;
  --secondary-color:#0891B2;   /* Cyan-teal secondary */
  --secondary-light:#22D3EE;
  --gradient-primary: linear-gradient(135deg, #0D9488 0%, #F59E0B 100%);
  --bg: #F2FBFA;               /* cool teal-tinted page background */
  --light-surface: #E6F7F5;
}
/* Page background + section-title (beat HAXD's [data-theme=light] body !important) */
html[data-theme="light"] body.hcai-body { background-color: #F2FBFA !important; color:#0f2e2b !important; }
body.hcai-body { background: #F2FBFA; }
.section-title { color: #0F3F3A; }
html[data-theme="dark"] body.hcai-body { background-color: #0A1614 !important; }
html[data-theme="dark"] .section-title { color: #99F6E4; }

/* ---- Hero: teal→green gradient with amber glow + orbit canvas ---- */
.hcai-hero.page-hero {
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(13,148,136,.38), transparent 60%),
    radial-gradient(1000px 600px at 85% -20%, rgba(245,158,11,.24), transparent 60%),
    linear-gradient(135deg, #062E2A 0%, #0F766E 55%, #0D9488 100%);
}
.hcai-hero.page-hero::after {
  background-image: radial-gradient(rgba(251,191,36,.14) 1.4px, transparent 1.4px);
  background-size: 24px 24px;
}
.hcai-hero .hcai-orbit-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; opacity: .6;
}
.hcai-hero .container { position: relative; z-index: 1; }
.hcai-hero .section-title::after {
  background: linear-gradient(to right, #FBBF24, rgba(251,191,36,.6)) !important;
}

/* ---- Hero badge + fact pills ---- */
.hcai-badge { background: rgba(255,255,255,.14); border: 1px solid rgba(251,191,36,.5); color: #FEF3C7; }
.hcai-facts { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin-top:1.5rem; }
.hcai-fact {
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.4rem .85rem; border-radius:999px; font-size:.85rem; font-weight:600; color:#ECFEFF;
  background:rgba(255,255,255,.10); border:1px solid rgba(251,191,36,.35);
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
}
.hcai-fact i { color:#FBBF24; }

/* ============================================================
   EDITORIAL LAYOUT (distinct from the sibling workshop)
   ============================================================ */

/* Left-aligned hero + stat strip */
.hcai-hero .hcai-hero-inner { max-width: 820px; }
.hcai-hero-eyebrow { letter-spacing:.16em; text-transform:uppercase; font-weight:700; font-size:.8rem; color:#FBBF24; }
.hcai-stats { display:flex; flex-wrap:wrap; gap:2rem; margin-top:2rem; }
.hcai-stat { text-align:left; }
.hcai-stat-num { font-family:var(--font-heading,"Playfair Display",serif); font-size:2rem; font-weight:800; line-height:1; color:#fff; }
.hcai-stat-label { font-size:.8rem; text-transform:uppercase; letter-spacing:.08em; color:rgba(255,255,255,.75); margin-top:.25rem; }

/* Section eyebrow + left-aligned heading (editorial, not centered) */
.hcai-eyebrow { display:inline-block; letter-spacing:.14em; text-transform:uppercase; font-weight:700; font-size:.78rem; color:var(--primary-color); margin-bottom:.5rem; }
.hcai-h { font-family:var(--font-heading,"Playfair Display",serif); font-weight:800; color:#0F3F3A; font-size:clamp(1.8rem,3.5vw,2.6rem); line-height:1.1; }
html[data-theme="dark"] .hcai-h { color:#99F6E4; }
.hcai-lede { font-size:1.15rem; line-height:1.6; color:#334155; }
html[data-theme="dark"] .hcai-lede { color:#cbd5e1; }

/* About — 3 pillars accent list */
.hcai-pillar { display:flex; gap:1rem; padding:1rem 0; border-top:1px solid rgba(13,148,136,.15); }
.hcai-pillar:first-child { border-top:0; }
.hcai-pillar-icon { flex:0 0 auto; width:2.75rem; height:2.75rem; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.35rem; color:#fff; background:linear-gradient(135deg,#0D9488,#F59E0B); }
.hcai-pillar-title { font-weight:700; color:#0F3F3A; }
.hcai-pillar-desc { color:#64748b; font-size:.9rem; }
html[data-theme="dark"] .hcai-pillar { border-top-color:rgba(20,184,166,.22); }
html[data-theme="dark"] .hcai-pillar-title { color:#CCFBF1; }
html[data-theme="dark"] .hcai-pillar-desc { color:#94a3b8; }

/* Full-bleed teal band (breaks the white monotony) */
.hcai-band { background:linear-gradient(135deg,#0F766E 0%,#0D9488 55%,#14B8A6 100%); color:#fff; position:relative; overflow:hidden; }
.hcai-band::after { content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(251,191,36,.10) 1.4px, transparent 1.4px); background-size:26px 26px; pointer-events:none; }
.hcai-band .hcai-eyebrow { color:#FBBF24; }
.hcai-band .hcai-h { color:#fff; }
.hcai-band .hcai-lede { color:rgba(255,255,255,.9); }

/* ---- Bento-grid topics ---- */
.hcai-bento { display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:150px; gap:1rem; }
.hcai-bento-tile {
  position:relative; overflow:hidden; border-radius:1rem; padding:1.25rem;
  background:#fff; border:1px solid rgba(13,148,136,.16);
  display:flex; flex-direction:column; justify-content:space-between;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.hcai-bento-tile:hover { transform:translateY(-4px); box-shadow:0 14px 30px rgba(13,148,136,.16); border-color:rgba(245,158,11,.45); }
.hcai-bento-tile .bt-icon { width:2.5rem; height:2.5rem; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; color:#fff; background:linear-gradient(135deg,#0D9488,#14B8A6); }
.hcai-bento-tile .bt-title { font-weight:700; color:#0F3F3A; line-height:1.25; font-size:1rem; }
.hcai-bento-tile .bt-num { position:absolute; top:.5rem; right:.9rem; font-family:var(--font-heading,"Playfair Display",serif); font-size:2.4rem; font-weight:800; color:rgba(13,148,136,.08); line-height:1; }
/* feature tiles (span 2) get a colored fill */
.hcai-bento-tile.bt-feature { grid-column:span 2; background:linear-gradient(135deg,#0D9488,#0F766E); border:0; }
.hcai-bento-tile.bt-feature .bt-title { color:#fff; font-size:1.15rem; }
.hcai-bento-tile.bt-feature .bt-icon { background:rgba(255,255,255,.18); }
.hcai-bento-tile.bt-feature .bt-num { color:rgba(255,255,255,.14); }
.hcai-bento-tile.bt-amber { grid-column:span 2; background:linear-gradient(135deg,#F59E0B,#D97706); border:0; }
.hcai-bento-tile.bt-amber .bt-title { color:#fff; font-size:1.15rem; }
.hcai-bento-tile.bt-amber .bt-icon { background:rgba(255,255,255,.2); }
.hcai-bento-tile.bt-amber .bt-num { color:rgba(255,255,255,.18); }
.hcai-bento-tile.bt-tall { grid-row:span 2; }
html[data-theme="dark"] .hcai-bento-tile { background:#122927; border-color:rgba(20,184,166,.3); }
html[data-theme="dark"] .hcai-bento-tile .bt-title { color:#CCFBF1; }
@media (max-width:991.98px){ .hcai-bento{ grid-template-columns:repeat(2,1fr);} .hcai-bento-tile.bt-feature,.hcai-bento-tile.bt-amber{grid-column:span 2;} .hcai-bento-tile.bt-tall{grid-row:span 1;} }
@media (max-width:575.98px){ .hcai-bento{ grid-template-columns:1fr; grid-auto-rows:auto;} .hcai-bento-tile{min-height:130px;} .hcai-bento-tile.bt-feature,.hcai-bento-tile.bt-amber{grid-column:span 1;} }

/* Vertical roadmap timeline (replaces horizontal) */
.hcai-roadmap { position:relative; padding-left:0; margin:0; list-style:none; max-width:720px; }
.hcai-roadmap::before { content:""; position:absolute; left:27px; top:8px; bottom:8px; width:3px; background:linear-gradient(180deg,#0D9488,#F59E0B); border-radius:2px; }
.hcai-rm-step { position:relative; display:flex; gap:1.25rem; padding:.75rem 0; }
.hcai-rm-node { position:relative; z-index:1; flex:0 0 auto; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.35rem; color:#fff; background:linear-gradient(135deg,#0D9488,#14B8A6); box-shadow:0 0 0 6px #F2FBFA; }
.hcai-rm-step.hcai-rm-final .hcai-rm-node { background:linear-gradient(135deg,#F59E0B,#FBBF24); }
.hcai-rm-body { padding-top:.4rem; }
.hcai-rm-label { font-weight:700; color:#0F3F3A; font-size:1.05rem; }
.hcai-rm-date { color:#64748b; font-size:.9rem; }
html[data-theme="dark"] .hcai-rm-node { box-shadow:0 0 0 6px #0A1614; }
html[data-theme="dark"] .hcai-rm-label { color:#CCFBF1; }
html[data-theme="dark"] .hcai-rm-date { color:#94a3b8; }

/* legacy topic card kept for any leftover use */
.hcai-topic {
  background:#fff; border:1px solid rgba(13,148,136,.16);
  border-left:3px solid var(--primary-color); border-radius:.6rem;
  min-height:84px; align-items:center !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.hcai-topic:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(13,148,136,.14); border-left-color:var(--primary-accent); }
.hcai-topic i { color:var(--primary-color); flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; width:2.25rem; height:2.25rem; background:rgba(13,148,136,.09); border-radius:50%; }
.hcai-topic:hover i { background:rgba(245,158,11,.14); color:var(--primary-accent); }
.hcai-topic span { font-weight:500; line-height:1.35; }
html[data-theme="dark"] .hcai-topic { background:#122927; border-color:rgba(20,184,166,.3); border-left-color:#14B8A6; }

/* ---- Submission types + format + templates ---- */
.hcai-subtype {
  background:#fff; border:1px solid rgba(13,148,136,.16); border-top:3px solid var(--primary-color);
  border-radius:.6rem; padding:1.25rem 1rem; transition: transform .18s ease, box-shadow .18s ease;
}
.hcai-subtype:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(13,148,136,.12); }
.hcai-subtype-icon {
  width:3rem; height:3rem; margin:0 auto .6rem; display:flex; align-items:center; justify-content:center;
  border-radius:50%; font-size:1.35rem; color:#fff; background:linear-gradient(135deg,#0D9488,#14B8A6);
}
.hcai-subtype-badge { display:inline-block; font-size:.75rem; font-weight:700; color:var(--primary-dark); background:#E6F7F5; border-radius:50rem; padding:.2rem .7rem; }
html[data-theme="dark"] .hcai-subtype { background:#122927; border-color:rgba(20,184,166,.3); }
html[data-theme="dark"] .hcai-subtype-badge { background:#0f2e2b; color:#99F6E4; }

.hcai-fmt-item { background:#fff; border:1px solid rgba(13,148,136,.16); border-left:4px solid var(--primary-color); border-radius:8px; padding:.85rem 1rem; }
.hcai-fmt-name { font-weight:600; color:#0F3F3A; font-size:.95rem; }
.hcai-fmt-name i { color:var(--primary-color); }
.hcai-fmt-val { color:#6b7280; font-size:.85rem; margin-top:.15rem; }
html[data-theme="dark"] .hcai-fmt-item { background:#122927; border-color:rgba(20,184,166,.3); border-left-color:#14B8A6; }
html[data-theme="dark"] .hcai-fmt-name { color:#CCFBF1; }
html[data-theme="dark"] .hcai-fmt-name i { color:#5EEAD4; }

.hcai-tpl-card { background:#fff; border:1px solid rgba(13,148,136,.16); border-radius:.6rem; padding:1.5rem 1rem; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.hcai-tpl-card:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(13,148,136,.14); border-color:rgba(245,158,11,.4); }
.hcai-tpl-icon { width:3.25rem; height:3.25rem; margin:0 auto .75rem; display:flex; align-items:center; justify-content:center; border-radius:12px; font-size:1.6rem; color:#fff; background:linear-gradient(135deg,#0D9488,#F59E0B); }
.hcai-tpl-card h6 { color:#0F3F3A; }
html[data-theme="dark"] .hcai-tpl-card { background:#122927; border-color:rgba(20,184,166,.3); }
html[data-theme="dark"] .hcai-tpl-card h6 { color:#CCFBF1; }

/* Disabled TBA button */
.hcai-btn-tba, .hcai-btn-tba.disabled {
  background:#E6F7F5 !important; color:var(--primary-dark) !important;
  border:1px dashed rgba(13,148,136,.4) !important; box-shadow:none !important;
}
html[data-theme="dark"] .hcai-btn-tba { background:#0f2e2b !important; color:#99F6E4 !important; }

/* Active submission button — HCAI teal gradient (not Bootstrap blue) */
.hcai-btn-primary, .hcai-btn-primary:visited {
  background: linear-gradient(135deg, #0D9488, #14B8A6) !important;
  color:#fff !important; border:0 !important; font-weight:700;
  box-shadow: 0 8px 20px rgba(13,148,136,.28) !important;
}
.hcai-btn-primary:hover, .hcai-btn-primary:focus {
  background: linear-gradient(135deg, #0F766E, #0D9488) !important;
  color:#fff !important; transform: translateY(-2px);
}

/* ---- Important Dates → horizontal timeline ---- */
.hcai-timeline { list-style:none; margin:0; padding:1.5rem 0 .5rem; display:flex; justify-content:space-between; align-items:flex-start; position:relative; gap:1rem; }
.hcai-timeline::before { content:""; position:absolute; top:calc(1.5rem + 27px); left:8%; right:8%; height:3px; background:linear-gradient(90deg,#0D9488,#F59E0B); border-radius:2px; z-index:0; }
.hcai-tl-step { position:relative; z-index:1; flex:1 1 0; display:flex; flex-direction:column; align-items:center; text-align:center; }
.hcai-tl-node { width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.35rem; margin-bottom:.75rem; background:linear-gradient(135deg,#0D9488,#14B8A6); box-shadow:0 4px 14px rgba(13,148,136,.28), 0 0 0 6px #F2FBFA; transition: transform .2s ease, box-shadow .2s ease; }
.hcai-tl-node i { color:#fff !important; }
.hcai-tl-step:hover .hcai-tl-node { transform:translateY(-4px) scale(1.05); box-shadow:0 8px 22px rgba(245,158,11,.35), 0 0 0 6px #F2FBFA; }
.hcai-tl-final .hcai-tl-node { background:linear-gradient(135deg,#F59E0B,#FBBF24); }
.hcai-tl-label { font-weight:700; color:#0F3F3A; font-size:.95rem; }
.hcai-tl-date { color:#6b7280; font-size:.85rem; margin-top:.15rem; }
@media (max-width:767.98px) {
  .hcai-timeline { flex-direction:column; align-items:flex-start; gap:1.5rem; padding-left:1.25rem; }
  .hcai-timeline::before { top:1.5rem; bottom:1.5rem; left:calc(1.25rem + 26px); right:auto; width:3px; height:auto; background:linear-gradient(180deg,#0D9488,#F59E0B); }
  .hcai-tl-step { flex-direction:row; align-items:center; text-align:left; gap:1rem; width:100%; }
  .hcai-tl-node { margin-bottom:0; }
}
html[data-theme="dark"] .hcai-tl-node { box-shadow:0 4px 14px rgba(13,148,136,.35), 0 0 0 6px #0A1614; }
html[data-theme="dark"] .hcai-tl-label { color:#CCFBF1; }
html[data-theme="dark"] .hcai-tl-date { color:#94a3b8; }

/* ---- Slim navbar + submit button ---- */
.hcai-navbar { background:rgba(255,255,255,.92); box-shadow:0 2px 12px rgba(6,46,42,.08); }
.hcai-navbar .navbar-brand { color:var(--primary-color) !important; }
html[data-theme="dark"] .hcai-navbar { background:rgba(10,22,20,.92); }
.hcai-nav-submit { color:#fff !important; background:linear-gradient(135deg,#0D9488 0%,#F59E0B 100%) !important; border-color:transparent !important; box-shadow:0 3px 10px rgba(13,148,136,.28); }
.hcai-nav-submit:hover { color:#fff !important; background:linear-gradient(135deg,#0F766E 0%,#D97706 100%) !important; transform:translateY(-1px); }

/* ---- Organizers (committee cards) ---- */
.cm-section { margin-bottom:2.5rem; }
.cm-section-header { display:flex; align-items:center; gap:.75rem; margin-bottom:1.25rem; padding-bottom:.75rem; border-bottom:2px solid rgba(13,148,136,.18); }
.cm-section-icon { width:2.25rem; height:2.25rem; display:flex; align-items:center; justify-content:center; border-radius:8px; flex-shrink:0; font-size:1rem; background:linear-gradient(135deg,rgba(13,148,136,.12),rgba(245,158,11,.10)); color:#0F766E; }
.cm-section-title { font-weight:700; font-size:1.35rem; color:#0F3F3A; margin:0; letter-spacing:-.02em; }
.cm-compact-list { display:flex; flex-direction:column; gap:.5rem; }
.cm-compact-item { padding:.85rem 1rem; background:#fff; border:1px solid rgba(13,148,136,.14); border-left:4px solid #0D9488; border-radius:8px; transition: transform .2s ease, box-shadow .2s ease; }
.cm-compact-item:hover { transform:translateX(4px); box-shadow:0 4px 16px rgba(13,148,136,.10); }
.cm-compact-name { font-weight:600; color:#0F3F3A; font-size:.95rem; }
.cm-compact-affil { color:#6b7280; font-size:.85rem; margin-top:.15rem; }
.cm-muted { color:#6b7280; font-style:italic; }
.cm-person { display:flex; align-items:center; gap:.9rem; }
.cm-person-photo { flex:0 0 auto; width:64px; height:64px; border-radius:50%; object-fit:cover; object-position:center 30%; border:2px solid rgba(13,148,136,.30); box-shadow:0 2px 8px rgba(13,148,136,.15); background:#E6F7F5; }
.cm-person-body { min-width:0; }
.cm-person-role { color:var(--primary-color); font-size:.78rem; font-weight:600; margin-top:.1rem; }
.cm-general-highlight { position:relative; }
.cm-chair-lead { position:relative; overflow:hidden; background:linear-gradient(135deg,rgba(13,148,136,.07),rgba(6,46,42,.10)); border:1px solid rgba(13,148,136,.24); border-left:4px solid #0D9488; border-radius:8px; padding:1rem 1.2rem; box-shadow:0 2px 12px rgba(13,148,136,.08); transition: box-shadow .3s ease, transform .3s ease; }
.cm-chair-lead::before { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(251,191,36,.14),transparent); animation:hcaiShimmer 5s ease-in-out infinite; pointer-events:none; }
@keyframes hcaiShimmer { 0%,100%{transform:translateX(-100%);} 50%{transform:translateX(200%);} }
.cm-chair-lead:hover { box-shadow:0 4px 20px rgba(13,148,136,.18); transform:translateY(-2px); }
.cm-chair-lead .cm-compact-name { font-size:1.1rem; font-weight:700; }
.cm-chair-lead .cm-person-photo { width:76px; height:76px; border-color:rgba(13,148,136,.5); }
.cm-icon-glow { animation:hcaiIconGlow 3s ease-in-out infinite; }
@keyframes hcaiIconGlow { 0%,100%{filter:drop-shadow(0 0 2px rgba(251,191,36,.25));} 50%{filter:drop-shadow(0 0 10px rgba(251,191,36,.55));} }
html[data-theme="dark"] .cm-section-header { border-bottom-color:rgba(20,184,166,.3); }
html[data-theme="dark"] .cm-section-icon { background:linear-gradient(135deg,rgba(20,184,166,.22),rgba(251,191,36,.14)); color:#fff; }
html[data-theme="dark"] .cm-section-title { color:#99F6E4; }
html[data-theme="dark"] .cm-compact-item { background:#122927; border-color:rgba(20,184,166,.3); border-left-color:#14B8A6; }
html[data-theme="dark"] .cm-compact-name { color:#CCFBF1; }
html[data-theme="dark"] .cm-compact-affil { color:#94a3b8; }
html[data-theme="dark"] .cm-person-photo { border-color:rgba(20,184,166,.5); background:#122927; }
html[data-theme="dark"] .cm-person-role { color:#5EEAD4; }
html[data-theme="dark"] .cm-chair-lead { background:linear-gradient(135deg,rgba(20,184,166,.14),rgba(10,22,20,.5)); border-color:rgba(20,184,166,.35); }

/* ---- Organizers: compact horizontal placeholder rows (no photo) ---- */
.hcai-org-row {
  display:flex; align-items:center; gap:.85rem;
  background:#fff; border:1px dashed rgba(13,148,136,.35);
  border-left:3px solid var(--primary-color); border-radius:.6rem; padding:.85rem 1rem;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.hcai-org-row:hover { transform:translateX(3px); box-shadow:0 6px 18px rgba(13,148,136,.10); border-left-color:var(--primary-accent); }
.hcai-org-row-icon {
  flex:0 0 auto; width:2.5rem; height:2.5rem; border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:1.2rem;
  color:#fff; background:linear-gradient(135deg,#0D9488,#14B8A6);
}
.hcai-org-row-name { font-weight:600; color:#0F3F3A; font-size:.95rem; line-height:1.2; }
.hcai-org-row-affil { color:#9ca3af; font-size:.8rem; margin-top:.1rem; }
html[data-theme="dark"] .hcai-org-row { background:#122927; border-color:rgba(20,184,166,.4); border-left-color:#14B8A6; }
html[data-theme="dark"] .hcai-org-row-name { color:#CCFBF1; }

/* ---- Footer ---- */
.hcai-footer { background:#062E2A; color:rgba(255,255,255,.72); }
.hcai-footer .hcai-footer-title { color:#FBBF24; }
.hcai-footer a { color:rgba(255,255,255,.72); }
.hcai-footer a:hover { color:#FBBF24; }