/* Prayer Project visual identity for the Board of Directors Portal.
   Mirrors the public site's warm black/glass design while preserving portal density. */
:root{
  --black:#000;
  --surface:#050505;
  --surface2:#0b0a09;
  --surface3:#12100e;
  --line:rgba(255,255,255,.10);
  --line2:rgba(216,195,165,.22);
  --text:#f7f2ea;
  --muted:#c9beb0;
  --soft:#91877b;
  --warm:#d8c3a5;
  --warm2:#fff0d2;
  --danger:#ffd1d1;
  --success:#cff7d6;
  --green:#9ff2b3;
  --green2:#1f7a3a;
  --radius:30px;
  --shadow:0 30px 90px rgba(0,0,0,.72);

  /* Map the portal's original design tokens onto the Prayer Project theme. */
  --navy-950:#050505;
  --navy-900:#090807;
  --navy-800:#12100e;
  --navy-700:#d8c3a5;
  --blue-600:#d8c3a5;
  --blue-500:#fff0d2;
  --blue-100:rgba(216,195,165,.11);
  --blue-50:rgba(255,255,255,.035);
  --ink:#f7f2ea;
  --canvas:#000;
  --warning:#ffe0a8;
  --warning-bg:rgba(255,184,77,.10);
  --danger-bg:rgba(239,68,68,.10);
  --success-bg:rgba(34,197,94,.10);
  --radius-lg:30px;
  --radius-md:24px;
  --radius-sm:16px;
}

html{background:#000!important;color-scheme:dark}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  color:var(--text)!important;
  background:#000!important;
  overflow-x:hidden;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% -10%,rgba(216,195,165,.16),transparent 34rem),
    radial-gradient(circle at 15% 18%,rgba(255,255,255,.04),transparent 28rem),
    linear-gradient(180deg,#000,#030303 45%,#000);
}
body:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:radial-gradient(circle,rgba(255,255,255,.12) 1px,transparent 1px);
  background-size:92px 92px;
  opacity:.055;
  mask-image:linear-gradient(to bottom,black,transparent 72%);
}

::selection{background:rgba(216,195,165,.28);color:var(--warm2)}
a{color:inherit}

/* Shared Prayer Project header */
.site-header{
  position:sticky!important;
  top:0;
  z-index:80;
  height:auto!important;
  min-height:76px;
  padding:10px clamp(19px,4vw,58px)!important;
  background:rgba(0,0,0,.84)!important;
  border-bottom:1px solid var(--line)!important;
  backdrop-filter:blur(18px)!important;
}
.brand{color:var(--text)!important;gap:12px!important}
.brand-mark{
  width:44px!important;
  height:44px!important;
  border-radius:50%!important;
  background:#070707!important;
  border:1px solid rgba(216,195,165,.34)!important;
  color:var(--warm2)!important;
  box-shadow:0 0 42px rgba(216,195,165,.12)!important;
  font-size:18px!important;
  font-weight:800!important;
  letter-spacing:0!important;
}
.brand-mark.small{
  width:40px!important;
  height:40px!important;
  border-radius:50%!important;
  font-size:17px!important;
}
.brand strong,.sidebar-title strong{color:var(--text)!important;font-size:15px!important;font-weight:900!important}
.brand small,.sidebar-title small{
  margin-top:4px;
  color:var(--soft)!important;
  font-size:10px!important;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.environment-badge{
  padding:9px 13px!important;
  border:1px solid rgba(216,195,165,.22)!important;
  background:rgba(216,195,165,.07)!important;
  color:var(--warm2)!important;
  letter-spacing:.12em!important;
  font-weight:900!important;
}

/* Login / first page */
.login-layout{
  min-height:calc(100vh - 76px)!important;
  padding:clamp(48px,7vw,92px) clamp(22px,8vw,130px)!important;
  background:transparent!important;
}
.login-copy{max-width:700px!important}
.eyebrow{
  display:inline-flex!important;
  width:max-content;
  margin:0 0 14px!important;
  padding:9px 14px!important;
  border-radius:999px!important;
  border:1px solid rgba(216,195,165,.28)!important;
  background:rgba(216,195,165,.08)!important;
  color:var(--warm2)!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
}
.login-copy h1,.portal-topbar h1,.section-heading-row h2,.panel-heading h2,.detail-header h2,.placeholder-panel h2,
.first-run-card h1,.first-run-card h2{
  font-family:"Playfair Display",Georgia,serif!important;
  color:var(--text)!important;
}
.login-copy h1{
  max-width:650px!important;
  font-size:clamp(48px,7vw,82px)!important;
  line-height:.96!important;
  letter-spacing:-.055em!important;
}
.login-copy>p:not(.eyebrow){
  color:var(--muted)!important;
  font-size:18px!important;
  line-height:1.85!important;
}
.status-card{
  margin-top:30px!important;
  padding:18px 20px!important;
  border-radius:24px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
  border:1px solid var(--line)!important;
  box-shadow:var(--shadow)!important;
  backdrop-filter:blur(18px)!important;
}
.status-dot{background:var(--green)!important;box-shadow:0 0 0 5px rgba(159,242,179,.10)!important}
.status-card strong{color:var(--text)!important}
.status-card span{color:var(--muted)!important}

.login-card,.panel,.metric,.directory-metrics>div,.director-card,.document-card,.notice-item,.compact-row,.inbox-row,
.first-run-card,.meeting-card,.vote-card,.agenda-card,.governance-card,.security-card,.launch-card{
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
  border:1px solid var(--line)!important;
  box-shadow:var(--shadow)!important;
  backdrop-filter:blur(18px)!important;
}
.login-card,.first-run-card{border-radius:34px!important;padding:clamp(28px,4vw,42px)!important}
.card-heading h2{font-family:"Playfair Display",Georgia,serif!important;color:var(--text)!important;font-size:38px!important;letter-spacing:-.04em!important}
.card-heading>p:last-child,.panel-copy,.section-heading-row p:not(.eyebrow),.long-copy{color:var(--muted)!important}
.login-card label,.admin-form label,.directory-toolbar label>span,.first-run-form label{color:var(--muted)!important}
.field-group small,.field-help,.security-note span,.muted-copy{color:var(--soft)!important}
.security-note{border-top-color:var(--line)!important}
.security-note strong{color:var(--warm2)!important}
.setup-banner{
  border:1px solid rgba(216,195,165,.18)!important;
  background:rgba(216,195,165,.07)!important;
  border-radius:20px!important;
}
.setup-banner span,.setup-banner strong{color:var(--warm2)!important}
.setup-banner small{color:var(--muted)!important}

input,textarea,select,
.login-card input,.admin-form input:not([type=checkbox]),.admin-form select,.admin-form textarea,.review-controls textarea,.directory-toolbar input,.directory-toolbar select,.first-run-form input{
  border:1px solid var(--line)!important;
  background:#030303!important;
  color:var(--text)!important;
  border-radius:18px!important;
  padding:14px 15px!important;
  min-height:48px;
  outline:none!important;
}
input::placeholder,textarea::placeholder{color:#766f67!important}
input:focus,textarea:focus,select:focus,
.login-card input:focus,.admin-form input:focus,.admin-form select:focus,.admin-form textarea:focus,.review-controls textarea:focus,.directory-toolbar input:focus,.directory-toolbar select:focus,.first-run-form input:focus{
  border-color:rgba(216,195,165,.62)!important;
  box-shadow:0 0 0 4px rgba(216,195,165,.08)!important;
}
select option{background:#080706;color:var(--text)}

button,.btn,.primary-button,.secondary-button,.table-action,.link-button{transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease}
.login-card form>button:not(.text-button),.admin-form>button,.primary-button,.first-run-form button{
  min-height:48px!important;
  border-radius:999px!important;
  border:0!important;
  background:linear-gradient(135deg,var(--warm2),var(--warm))!important;
  color:#000!important;
  font-weight:900!important;
  box-shadow:0 14px 40px rgba(216,195,165,.16)!important;
}
.login-card form>button:not(.text-button):hover,.admin-form>button:hover,.primary-button:hover,.first-run-form button:hover{transform:translateY(-2px);filter:brightness(1.04)}
.secondary-button,.table-action,.text-button,.link-button.secondary{
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.055)!important;
  color:var(--text)!important;
}
.secondary-button:hover,.table-action:hover,.text-button:hover{background:rgba(255,255,255,.09)!important;color:var(--warm2)!important}
.text-button{border:0!important;background:transparent!important;color:var(--warm)!important}
.form-message,.first-run-message{color:#ffdca0!important}
.first-run-success{color:var(--green)!important}

/* Portal shell */
.portal-view{min-height:calc(100vh - 76px)!important;background:transparent!important;grid-template-columns:268px minmax(0,1fr)!important}
.sidebar{
  position:sticky;
  top:76px;
  align-self:start;
  min-height:calc(100vh - 76px);
  padding:28px 18px!important;
  background:rgba(3,3,3,.90)!important;
  border-right:1px solid var(--line)!important;
  color:var(--text)!important;
  backdrop-filter:blur(18px);
}
.sidebar-title{border-bottom-color:var(--line)!important}
.sidebar nav{gap:7px!important}
.nav-item{
  border:1px solid transparent!important;
  border-radius:999px!important;
  padding:12px 14px!important;
  color:var(--muted)!important;
  font-weight:800!important;
}
.nav-item:hover{background:rgba(255,255,255,.055)!important;border-color:rgba(255,255,255,.07)!important;color:var(--text)!important}
.nav-item.active{
  background:rgba(216,195,165,.11)!important;
  border-color:rgba(216,195,165,.22)!important;
  color:var(--warm2)!important;
}
.portal-main{padding:40px clamp(22px,4vw,58px)!important;background:transparent!important}
.portal-topbar{
  padding-bottom:24px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.portal-topbar h1{font-size:clamp(34px,4vw,48px)!important;letter-spacing:-.04em!important}
.portal-section{margin-top:30px!important}
.panel{border-radius:30px!important;padding:26px!important;position:relative;overflow:hidden}
.panel:before,.metric:before,.director-card:before,.document-card:before,.login-card:before,.first-run-card:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg,rgba(255,255,255,.09),transparent 34%);
  opacity:.30;
}
.panel>* ,.metric>* ,.director-card>* ,.document-card>* ,.login-card>* ,.first-run-card>*{position:relative;z-index:1}
.panel-heading h2,.section-heading-row h2,.detail-header h2,.placeholder-panel h2{font-size:30px!important;letter-spacing:-.035em!important}

.metric-grid{gap:14px!important}
.metric{position:relative;overflow:hidden;border-radius:26px!important;min-height:170px!important;padding:22px!important}
.metric span,.directory-metrics span{color:var(--soft)!important;text-transform:uppercase;letter-spacing:.08em;font-size:10px!important;font-weight:900!important}
.metric strong,.directory-metrics strong{color:var(--warm2)!important;font-size:32px!important}
.metric small{color:var(--muted)!important}
.dashboard-grid{gap:14px!important}
.detail-list div{border-top-color:rgba(255,255,255,.075)!important}
.detail-list dt{color:var(--soft)!important}
.detail-list dd{color:var(--text)!important}

.permission-chip,.status-pill,.protected-badge,.count-badge,.tag,.badge{
  border:1px solid rgba(216,195,165,.18)!important;
  background:rgba(216,195,165,.09)!important;
  color:var(--warm2)!important;
}
.empty-state,.empty{
  color:var(--muted)!important;
  background:rgba(255,255,255,.025)!important;
  border:1px dashed rgba(255,255,255,.14)!important;
  border-radius:22px!important;
}
.notice-item,.compact-row,.inbox-row,.director-card,.document-card,.directory-metrics>div{
  position:relative;
  overflow:hidden;
  border-radius:22px!important;
  box-shadow:none!important;
}
.notice-item:hover,.compact-row:hover,.inbox-row:hover,.director-card:hover,.document-card:hover{
  background:rgba(255,255,255,.075)!important;
  border-color:rgba(216,195,165,.22)!important;
}
.notice-item strong,.compact-row strong,.inbox-row strong,.director-card-copy strong,.document-card h3,.directory-profile-header h2{color:var(--text)!important}
.notice-item span,.compact-row small,.inbox-row span,.inbox-row small,.director-card-copy span,.director-card-copy small,.document-card>p{color:var(--muted)!important}
.compact-row em,.document-number{color:var(--warm)!important}
.director-avatar{
  border-radius:50%!important;
  background:#070707!important;
  border:1px solid rgba(216,195,165,.28)!important;
  color:var(--warm2)!important;
  box-shadow:0 0 30px rgba(216,195,165,.08)!important;
}
.directory-toolbar{gap:14px!important}
.directory-metrics>div{padding:16px 18px!important}

/* Phase modules: normalize their native cards/tables into the shared theme. */
.portal-main table,.meeting-table,.attendance-table,.records-table,.audit-table{
  border-color:var(--line)!important;
  background:transparent!important;
  color:var(--text)!important;
}
.portal-main th{
  color:var(--soft)!important;
  border-color:var(--line)!important;
  background:rgba(255,255,255,.035)!important;
}
.portal-main td{color:var(--muted)!important;border-color:var(--line)!important}
.portal-main td strong{color:var(--text)!important}
.portal-main hr,.divider{border:0;height:1px;background:linear-gradient(90deg,transparent,rgba(216,195,165,.20),transparent)}

[class*="metric"],[class*="summary"]{border-color:var(--line)}
[class*="card"],[class*="panel"]{color:var(--text)}
[class*="card"] h2,[class*="card"] h3,[class*="panel"] h2,[class*="panel"] h3{color:var(--text)}
[class*="card"] p,[class*="panel"] p{color:var(--muted)}

/* First-run setup page */
.first-run-shell{
  min-height:calc(100vh - 76px)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(360px,620px)!important;
  gap:clamp(36px,7vw,90px)!important;
  align-items:center!important;
  width:min(1160px,calc(100% - 38px));
  margin:0 auto;
  padding:72px 0!important;
  background:transparent!important;
}
.first-run-intro{max-width:620px}
.first-run-intro h1{
  margin:18px 0 18px;
  font-family:"Playfair Display",Georgia,serif;
  font-size:clamp(52px,7vw,84px);
  line-height:.96;
  letter-spacing:-.055em;
  color:var(--text);
}
.first-run-intro p{color:var(--muted);font-size:18px;line-height:1.85}
.first-run-intro .verse-note{
  margin-top:28px;
  padding:22px 24px;
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  border:1px solid var(--line);
  color:var(--muted);
  line-height:1.7;
}
.first-run-intro .verse-note strong{display:block;margin-bottom:7px;color:var(--warm2);font-family:"Playfair Display",Georgia,serif;font-size:22px}
.first-run-card{width:100%!important}
.first-run-card h2{margin:4px 0 8px;font-size:40px!important;letter-spacing:-.04em!important}
.first-run-card>p{color:var(--muted)!important;line-height:1.7!important}
.first-run-note{
  margin-top:22px!important;
  padding:17px!important;
  border:1px solid rgba(216,195,165,.16)!important;
  border-radius:22px!important;
  background:rgba(216,195,165,.055)!important;
  color:var(--muted)!important;
}
.first-run-note strong{color:var(--warm2)!important}
.first-run-actions a{color:var(--warm)!important;font-weight:800!important}

/* Scrollbars */
*{scrollbar-color:rgba(216,195,165,.28) #050505;scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#050505}
::-webkit-scrollbar-thumb{background:rgba(216,195,165,.25);border-radius:999px;border:2px solid #050505}

@media(max-width:1080px){
  .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .first-run-shell{grid-template-columns:1fr!important;max-width:720px}
  .first-run-intro{max-width:none}
}
@media(max-width:820px){
  .site-header{min-height:70px!important}
  .environment-badge{display:none!important}
  .portal-view{display:block!important}
  .sidebar{position:relative!important;top:auto!important;min-height:auto!important;padding:14px!important;border-right:0!important;border-bottom:1px solid var(--line)!important}
  .sidebar-title{padding-bottom:12px!important}
  .sidebar nav{display:flex!important;overflow-x:auto!important;gap:8px!important;padding-bottom:4px!important}
  .nav-item{width:auto!important;min-width:max-content!important}
  .portal-main{padding:28px 16px!important}
  .dashboard-grid,.directory-grid,.document-grid{grid-template-columns:1fr!important}
  .directory-toolbar,.document-toolbar{grid-template-columns:1fr!important}
  .login-layout{grid-template-columns:1fr!important;padding:48px 20px!important}
  .login-copy{max-width:none!important}
  .first-run-shell{width:min(100% - 28px,720px);padding:48px 0!important}
}
@media(max-width:560px){
  .brand strong{font-size:14px!important}
  .brand small{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .metric-grid,.directory-metrics{grid-template-columns:1fr!important}
  .login-copy h1,.first-run-intro h1{font-size:48px!important}
  .login-card,.first-run-card,.panel{padding:22px!important;border-radius:26px!important}
  .portal-topbar{align-items:flex-start!important;flex-direction:column!important}
  .portal-topbar>button{width:100%}
  .button-row{width:100%}
  .button-row>*{flex:1}
}
@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}