/* G78P — Stage 3: Settings Center + Public Website visual recovery
   Presentation-only. No modal, event, auth, Supabase, or application behavior. */

/* ---------- Settings center ---------- */
.settings-dashboard{
  gap:18px;
  align-items:start;
}
.settings-dashboard .panel.settings-card{
  position:relative;
  overflow:hidden;
  border:1px solid #d9e5ec;
  border-radius:20px;
  padding:20px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdfe 100%);
  box-shadow:0 8px 24px rgba(13,47,69,.055);
}
.settings-dashboard .panel.settings-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg,#184d6c,#4f9fc5 58%,#9bc9dd);
  opacity:.82;
}
.settings-dashboard .panel-head{
  margin-bottom:14px;
  padding-bottom:12px;
  border-bottom:1px solid #edf2f5;
}
.settings-dashboard .panel-head h3{
  font-size:1rem;
  letter-spacing:-.01em;
  color:#173b52;
}
.settings-dashboard .panel-head .tiny{
  font-size:.72rem;
}
.settings-value-grid{
  gap:12px;
}
.settings-value-grid>div{
  border:1px solid #e2ebf0;
  border-radius:14px;
  padding:14px 15px;
  background:#fff;
  box-shadow:0 2px 7px rgba(13,47,69,.025);
}
.settings-value-grid span{
  font-size:.64rem;
  letter-spacing:.08em;
  color:#718491;
}
.settings-value-grid strong{
  color:#213d4f;
  font-size:.9rem;
}
.settings-access-grid{
  gap:18px;
}
.settings-access-grid>div{
  border:1px solid #e2eaf0;
  border-radius:16px;
  padding:15px;
  background:#fff;
}
.settings-access-grid h4{
  color:#1f4e69;
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.055em;
  margin-bottom:11px;
}
.settings-toggle-summary{
  margin-bottom:9px;
  border-color:#e3ebf0;
  border-radius:13px;
  padding:12px 13px;
  background:#f9fbfc;
}
.settings-toggle-summary:last-child{margin-bottom:0}
.settings-toggle-summary strong{
  color:#263f4e;
  font-size:.82rem;
}
.settings-toggle-summary span{
  font-size:.71rem;
}
.settings-advanced{
  border:1px solid #e1e9ee;
  border-radius:15px;
  padding:0 15px;
  background:#f9fbfc;
}
.settings-advanced summary{
  min-height:52px;
  padding:8px 0;
  color:#294c61;
}
.settings-advanced summary strong{font-size:.84rem}
.settings-advanced[open]{padding-bottom:14px}
.organization-settings-actions{
  margin-top:15px;
  padding-top:15px;
  border-top:1px solid #e9eff3;
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

/* ---------- Public Website admin ---------- */
.mode-card-grid{
  gap:14px;
  margin:4px 0 18px;
}
.mode-card{
  position:relative;
  min-height:118px;
  border:1px solid #dbe6ec;
  border-radius:18px;
  padding:17px 17px 16px;
  background:linear-gradient(180deg,#fff,#fbfdfe);
  box-shadow:0 4px 14px rgba(13,47,69,.035);
}
.mode-card::after{
  content:"";
  position:absolute;
  right:14px;
  top:14px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#cbd7de;
  box-shadow:0 0 0 4px #f0f4f6;
}
.mode-card.selected{
  border-color:#76abc5;
  background:linear-gradient(145deg,#eef7fb,#fff);
  box-shadow:0 8px 22px rgba(24,93,126,.08);
}
.mode-card.selected::after{
  background:#2d7ea6;
  box-shadow:0 0 0 4px #dceef6;
}
.mode-card strong{
  padding-right:26px;
  color:#1d4560;
  font-size:.9rem;
}
.mode-card span{
  margin-top:8px;
  line-height:1.5;
  font-size:.72rem;
}
#publicSiteControlsForm .check-pill{
  border:1px solid #dce8ee;
  border-radius:13px;
  padding:11px 13px;
  background:#f8fbfc;
}
#publicSiteControlsForm .feature-list{
  border:1px solid #e0e8ed;
  border-radius:15px;
  overflow:hidden;
  background:#fff;
}
#publicSiteControlsForm .feature-row{
  padding:12px 14px;
  border-bottom:1px solid #edf2f5;
}
#publicSiteControlsForm .feature-row:hover{
  background:#f8fbfd;
}
#publicSiteControlsForm .feature-row strong{
  color:#27495c;
}
.public-settings-preview{
  position:relative;
  overflow:hidden;
  border:1px solid #cfe0e9;
  border-radius:19px;
  padding:20px;
  background:
    radial-gradient(circle at 100% 0,rgba(63,151,193,.13),transparent 38%),
    linear-gradient(145deg,#f4f9fb,#fff);
  box-shadow:0 8px 25px rgba(13,47,69,.05);
}
.public-settings-preview::before{
  content:"Live public experience";
  display:inline-flex;
  margin-bottom:10px;
  border-radius:999px;
  padding:5px 8px;
  background:#e6f2f7;
  color:#276987;
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.public-settings-preview .eyebrow{
  color:#66808f;
}
.public-settings-preview h3{
  color:#163f59;
  font-size:1.2rem;
  letter-spacing:-.02em;
}
.public-settings-preview .detail-grid>div{
  background:rgba(255,255,255,.86);
}
.portal-section>.panel>.panel-head{
  padding-bottom:12px;
  border-bottom:1px solid #edf2f5;
  margin-bottom:13px;
}
.portal-section .training-offering-card{
  border-color:#dfe8ed;
  border-radius:15px;
  padding:14px 15px;
  box-shadow:none;
}
.portal-section .training-offering-card:hover{
  border-color:#b9d1dd;
  background:#fbfdfe;
}

/* ---------- Public website itself ---------- */
.public-header{
  background:rgba(255,255,255,.97);
  border-bottom:1px solid rgba(18,50,74,.09);
  box-shadow:0 3px 16px rgba(13,47,69,.035);
  backdrop-filter:blur(12px);
}
.public-header-inner{
  min-height:76px;
  max-width:1240px;
}
.public-brand-mark{
  box-shadow:0 8px 20px rgba(16,49,72,.16);
}
.public-brand strong{
  color:#183b51;
}
.public-nav button{
  border-radius:9px;
  padding:9px 10px;
}
.public-nav button:hover{
  background:#f1f6f8;
}
.public-hero{
  background:
    radial-gradient(circle at 82% 12%,rgba(85,171,213,.26),transparent 30%),
    linear-gradient(135deg,#0c283d 0%,#154c6b 58%,#216d90 100%);
}
.public-hero-inner{
  max-width:1240px;
  padding-top:78px;
  padding-bottom:84px;
  gap:48px;
}
.public-hero-copy h1{
  max-width:780px;
  letter-spacing:-.045em;
  line-height:.99;
  font-size:clamp(2.55rem,5vw,4.7rem);
}
.public-hero-copy>p:not(.eyebrow){
  max-width:680px;
  line-height:1.65;
  color:#d6e7ef;
}
.public-hero-actions{
  margin-top:24px;
}
.public-hero-panel{
  border:1px solid rgba(255,255,255,.17);
  border-radius:24px;
  background:rgba(255,255,255,.09);
  box-shadow:0 26px 58px rgba(0,0,0,.2);
  backdrop-filter:blur(14px);
}
.public-stat-grid>div{
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.07);
}
.public-section{
  max-width:1240px;
}
.public-section-head{
  margin-bottom:25px;
}
.public-section-head h2{
  letter-spacing:-.03em;
  color:#153c55;
}
.public-grid{
  gap:18px;
}
.public-card{
  border-color:#dfe8ed;
  border-radius:18px;
  padding:21px;
  box-shadow:0 4px 14px rgba(14,40,64,.04);
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.public-card:hover{
  transform:translateY(-2px);
  border-color:#bdd3df;
  box-shadow:0 13px 30px rgba(14,40,64,.085);
}
.public-card.featured{
  border-color:#9ec5d8;
  box-shadow:0 10px 27px rgba(19,87,121,.075);
}
.public-card h3{
  color:#173f58;
  letter-spacing:-.015em;
}
.public-card>p{
  line-height:1.62;
}
.public-chip{
  background:#edf5f8;
  color:#2a6684;
}
.public-journey-grid{
  gap:14px;
}
.public-journey-step{
  border-radius:16px;
  border-color:#e0e9ee;
  box-shadow:0 3px 12px rgba(13,47,69,.025);
}
.public-contact{
  background:linear-gradient(180deg,#f8fbfc,#edf5f8);
}
.public-contact-card{
  border-color:#d8e4ea;
  border-radius:23px;
  box-shadow:0 16px 40px rgba(14,40,64,.08);
}
.public-footer{
  background:linear-gradient(135deg,#0c273a,#113b55);
}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .settings-dashboard{gap:12px}
  .settings-dashboard .panel.settings-card{padding:16px}
  .settings-access-grid{gap:10px}
}
@media(max-width:650px){
  .mode-card{min-height:0}
  .public-hero-inner{padding-top:56px;padding-bottom:62px}
  .public-hero-copy h1{font-size:2.5rem}
  .public-card{padding:17px}
}