/* Finding the Y in You - aligned with the Pilot visual system. */
:root {
  --fy-indigo:#4f46e5;
  --fy-violet:#7c3aed;
  --fy-cyan:#0891b2;
  --fy-ink:#0f1020;
  --fy-body:#374151;
  --fy-muted:#6b7280;
  --fy-faint:#9ca3af;
  --fy-line:#e4e8f5;
  --fy-tint:#f8f9ff;
  --fy-bg:#f6f7fd;
  --fy-grad:linear-gradient(135deg,#4f46e5 0%,#7c3aed 55%,#0891b2 100%);
  --fy-shadow:0 2px 10px rgba(15,16,32,.04);
  --fy-lift:0 14px 34px rgba(79,70,229,.12);
  --fy-radius:16px;
}

body {
  font-family:"Aptos Narrow",Arial,sans-serif !important;
  background:var(--fy-bg) !important;
  color:var(--fy-ink) !important;
}

.fy-nav {
  background:#fff !important;
  border-bottom:1px solid var(--fy-line) !important;
  box-shadow:0 1px 0 rgba(255,255,255,.8),0 8px 26px rgba(15,16,32,.045) !important;
}
.fy-nav-container {
  width:95%;height:60px;margin:0 auto;padding:0 16px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.fy-nav-brand { display:flex;align-items:center;flex:none; }
.fy-nav .nav-logo { height:58px;width:auto;display:block; }
.fy-nav-links { display:flex;align-items:center;gap:10px; }
.fy-nav-links a,.fy-nav-user a {
  display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:8px;
  color:#4f46e5;text-decoration:none;font-size:1.2rem;font-weight:400;letter-spacing:.04em;
  transition:color .2s,background .2s,transform .15s,border-color .2s;
}
.fy-nav-links a:hover,.fy-nav-links a.active {
  color:#fff;background:linear-gradient(90deg,#818cf8 0%,#06b6d4 100%);
}
.fy-nav-user { display:flex;align-items:center; }
.fy-nav-user a { font-size:.88rem;font-weight:600;letter-spacing:.02em;border:1.5px solid #4f46e5; }
.fy-nav-user a:hover { transform:translateY(-1px);background:rgba(79,70,229,.08); }
.fy-nav-user .fy-start { color:#fff;background:var(--fy-grad);border-color:transparent;box-shadow:0 6px 20px rgba(79,70,229,.25); }

.btn, button {
  border-radius:11px !important;
  font-weight:700 !important;
}
.btn svg,button svg { width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none; }
.btn.active,.btn-primary,button.primary,.save-btn {
  background:var(--fy-grad) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 6px 20px rgba(79,70,229,.3) !important;
}
.btn:hover,button:hover { transform:translateY(-2px); }

.page { width:95% !important; padding-top:28px !important; }
.header { gap:16px !important; margin-bottom:16px !important; }

/* Hero bands mirror Pilot headers. */
.page > .hero,
.header > .hero {
  background:var(--fy-grad) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:20px !important;
  padding:28px 32px !important;
  box-shadow:0 12px 40px rgba(79,70,229,.26) !important;
}
.page > .hero::before,.header > .hero::before { display:none !important; }
.page > .hero h1,.header > .hero h1,
.page > .hero h2,.header > .hero h2 { color:#fff !important; }
.page > .hero .muted,.header > .hero .muted { color:rgba(255,255,255,.84) !important; }
.page > .hero .eyebrow,.header > .hero .eyebrow {
  color:#fff !important;
  background:rgba(255,255,255,.16) !important;
  border:1.5px solid rgba(255,255,255,.34) !important;
  border-radius:999px !important;
}
.page > .hero .chip,.header > .hero .chip {
  color:rgba(255,255,255,.92) !important;
  background:rgba(255,255,255,.13) !important;
  border-color:rgba(255,255,255,.22) !important;
  border-radius:10px !important;
}
.page > .hero .chip strong,.header > .hero .chip strong { color:#fff !important; }

.panel,.selector-panel,.progress-card,.sidebar,.email-card,.participant-box,.box {
  border-color:var(--fy-line) !important;
  box-shadow:var(--fy-shadow) !important;
}
.panel,.selector-panel,.progress-card,.email-card,.participant-box,.box {
  border-radius:var(--fy-radius) !important;
  background:#fff !important;
}
.panel::before { background:var(--fy-grad) !important; opacity:1 !important; }
.panel:hover { border-color:rgba(79,70,229,.22) !important; }

.progress-card {
  background:#fff !important;
  border:1.5px solid var(--fy-line) !important;
}
.progress-num { color:var(--fy-indigo) !important; }
.bar,.p-progress { background:rgba(79,70,229,.1) !important; }
.bar span { background:linear-gradient(90deg,var(--fy-indigo),var(--fy-cyan)) !important; }

.sidebar {
  border-radius:var(--fy-radius) !important;
  background:#fff !important;
  padding:12px !important;
}
.side-link { border-radius:10px !important; }
.side-link.active {
  color:var(--fy-indigo) !important;
  background:var(--fy-tint) !important;
  border-color:rgba(79,70,229,.2) !important;
}

.status,.badge,.pill,.hint-pill { border-radius:999px !important; }
.disclosure {
  border-radius:var(--fy-radius) !important;
  border-color:var(--fy-line) !important;
  box-shadow:var(--fy-shadow) !important;
}
.disclosure > summary { padding:16px 20px !important; }
.disclosure[open] > summary { background:var(--fy-tint) !important; color:var(--fy-indigo) !important; }
.question-card,.field,.section-card,.user-row {
  border-radius:12px !important;
}
.question-card { border-color:var(--fy-line) !important; background:#fff !important; }

input,select,textarea,.file-drop {
  border-color:var(--fy-line) !important;
  border-radius:10px !important;
  font-family:"Aptos Narrow",Arial,sans-serif !important;
}
input:focus,select:focus,textarea:focus {
  border-color:var(--fy-indigo) !important;
  box-shadow:0 0 0 3px rgba(79,70,229,.12) !important;
}

table th { background:var(--fy-tint) !important; color:var(--fy-muted) !important; }
table td { border-color:#f1f3fb !important; }
tbody tr:hover td { background:#fcfcff !important; }

.tab-btn,.mode-btn {
  border-radius:11px !important;
  color:var(--fy-indigo) !important;
  border-color:rgba(79,70,229,.28) !important;
  background:rgba(79,70,229,.06) !important;
}
.tab-btn.active,.mode-btn.active {
  background:var(--fy-grad) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 8px 22px rgba(79,70,229,.3) !important;
}
.btn-generate { background:var(--fy-cyan) !important; border-color:var(--fy-cyan) !important; color:#fff !important; }

/* Participants: use the shared Finding Y gradient across both workflows. */
.fy-participants .panel[data-panel="add"]::before { background:var(--fy-grad) !important; }
.fy-participants .panel[data-panel="add"] .step-num {
  background:var(--fy-grad) !important;color:#fff !important;
  border-color:transparent !important;box-shadow:0 8px 18px rgba(79,70,229,.22) !important;
}
.fy-participants .panel[data-panel="invite"]::before { background:var(--fy-grad) !important; }
.fy-participants .participant-box {
  border-top:3px solid var(--fy-indigo) !important;
  overflow:hidden;
}
.fy-participants .email-card {
  border-top:3px solid var(--fy-cyan) !important;
  box-shadow:0 8px 24px rgba(8,145,178,.08) !important;
}
.fy-participants .tab-btn:first-child.active {
  background:var(--fy-grad) !important;
  box-shadow:0 8px 22px rgba(79,70,229,.3) !important;
}
.fy-participants .hint-pill {
  background:rgba(8,145,178,.07) !important;
  border-color:rgba(8,145,178,.22) !important;
  color:#0e7490 !important;
}

/* Public programme page: one Pilot-style hero band with white content cards. */
body.fy-public .grid-bg { display:none; }
body.fy-public .hero { min-height:auto !important; padding:34px 0 !important; }
body.fy-public .hero-inner {
  background:var(--fy-grad);
  border-radius:20px;
  padding:38px 42px;
  box-shadow:0 12px 40px rgba(79,70,229,.26);
}
body.fy-public .hero h1,body.fy-public .hero .intro { color:#fff !important; }
body.fy-public .hero h1 span { color:#fff !important; -webkit-text-fill-color:#fff !important; }
body.fy-public .hero .eyebrow {
  color:#fff !important;background:rgba(255,255,255,.16) !important;
  border-color:rgba(255,255,255,.34) !important;
}
body.fy-public .hero .btn-primary { background:#fff !important;color:var(--fy-indigo) !important; }
body.fy-public .hero .btn:not(.btn-primary) {
  color:#fff !important;background:rgba(255,255,255,.14) !important;border-color:rgba(255,255,255,.34) !important;
}
body.fy-public .step {
  border-radius:14px !important;
  background:rgba(255,255,255,.96) !important;
  border-color:rgba(255,255,255,.3) !important;
  box-shadow:0 8px 22px rgba(15,16,32,.1) !important;
}
body.fy-public .program-band { background:var(--fy-bg) !important; }
body.fy-public .month { border-radius:14px !important; border-color:var(--fy-line) !important; box-shadow:var(--fy-shadow) !important; }

@media(max-width:900px) {
  .fy-nav-container { height:auto;min-height:60px;padding:4px 0;flex-wrap:wrap; }
  .fy-nav-links { order:3;width:100%;overflow-x:auto;padding-bottom:2px; }
  .fy-nav-links a { white-space:nowrap;font-size:1rem; }
  .layout { grid-template-columns:1fr !important; }
  .sidebar { position:static !important; flex-direction:row !important; overflow:auto; }
  .sidebar-title { display:none; }
  body.fy-public .hero-inner { padding:28px 24px; }
}

@media(max-width:600px) {
  .page { width:95% !important; }
  .page > .hero,.header > .hero { padding:22px 20px !important; border-radius:16px !important; }
  .panel { padding:20px !important; }
  .panel-head { flex-direction:column; }
  body.fy-public .hero { padding-left:14px !important; padding-right:14px !important; }
  body.fy-public .hero-inner { width:100% !important; }
}
