/* PSO Boston — Shared Stylesheet v2.1 */
/* Primary color is overridden via inline style="--gold:#hex" from DB setting */
:root {
  --navy:      #0a1628;
  --navy-dark: #060e1d;
  --navy-mid:  #0d1e38;
  --blue:      #1a3a6e;
  --gold:      #c9a227;
  --gold-light:#f0c842;
  --white:     #f5f3ee;
  --red:       #b5251e;
  --success:   #2d9e5f;
  --sidebar-w: 240px;
}

* { box-sizing:border-box; margin:0; padding:0; }

body {
  font-family:'DM Sans',sans-serif;
  background:var(--navy);
  color:var(--white);
  overflow-x:hidden;
}

a { color:var(--gold); text-decoration:none; }
a:hover { color:var(--gold-light); }

/* ── BUTTONS ── */
.btn { display:inline-block; padding:10px 24px; border-radius:4px; border:none; cursor:pointer; font-family:'Bebas Neue',sans-serif; font-size:15px; letter-spacing:2px; transition:all .18s; text-decoration:none; }
.btn-primary  { background:var(--gold); color:var(--navy); }
.btn-primary:hover  { background:var(--gold-light); color:var(--navy); transform:translateY(-1px); }
.btn-secondary{ background:transparent; color:var(--white); border:2px solid rgba(245,243,238,.35); }
.btn-secondary:hover{ border-color:var(--gold); color:var(--gold); }
.btn-danger   { background:rgba(181,37,30,.2); color:#f4918e; border:1px solid var(--red); }
.btn-danger:hover{ background:rgba(181,37,30,.4); }
.btn-success  { background:rgba(45,158,95,.2); color:#7ee8a2; border:1px solid var(--success); }
.btn-success:hover{ background:rgba(45,158,95,.4); }
.btn-outline  { background:transparent; color:var(--gold); border:1px solid rgba(201,162,39,.4); }
.btn-outline:hover{ background:rgba(201,162,39,.1); }
.btn-sm { padding:6px 16px; font-size:12px; }
.btn-xs { padding:4px 10px; font-size:11px; }

/* ── FORMS ── */
.form-group { margin-bottom:18px; }
label { display:block; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:rgba(245,243,238,.65); margin-bottom:7px; }
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], input[type="tel"], input[type="url"],
textarea, select {
  width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(245,243,238,.15);
  border-radius:5px; padding:11px 14px; color:var(--white);
  font-family:'DM Sans',sans-serif; font-size:14px; outline:none; transition:border-color .2s;
}
input:focus, textarea:focus, select:focus { border-color:var(--gold); }
input::placeholder, textarea::placeholder { color:rgba(245,243,238,.28); }
select option { background:#0a1628; }
textarea { resize:vertical; min-height:100px; }
input[type="file"] { background:rgba(255,255,255,.04); border:1px dashed rgba(245,243,238,.2); border-radius:5px; padding:10px; }
input[type="color"] { padding:4px; height:40px; border-radius:4px; cursor:pointer; }

/* ── ALERTS ── */
.alert { padding:12px 18px; border-radius:5px; font-size:14px; margin-top:12px; display:none; }
.alert.show { display:block; }
.alert-success { background:rgba(45,158,95,.15); border:1px solid var(--success); color:#7ee8a2; }
.alert-error   { background:rgba(181,37,30,.15); border:1px solid var(--red); color:#f4918e; }
.alert-info    { background:rgba(26,58,110,.4); border:1px solid rgba(201,162,39,.4); color:var(--gold-light); }

/* ── CARDS ── */
.card { background:rgba(255,255,255,.04); border:1px solid rgba(201,162,39,.2); border-radius:8px; padding:28px; transition:border-color .25s; }
.card-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }

/* ── BADGES ── */
.badge { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:700; letter-spacing:1px; }
.badge-verified  { background:rgba(45,158,95,.2);   color:#7ee8a2;             border:1px solid rgba(45,158,95,.4); }
.badge-pending   { background:rgba(201,162,39,.15);  color:var(--gold-light);   border:1px solid rgba(201,162,39,.3); }
.badge-new       { background:rgba(26,58,110,.4);    color:#8ab4f8;             border:1px solid rgba(138,180,248,.3); }
.badge-urgent    { background:rgba(181,37,30,.2);    color:#f4918e;             border:1px solid rgba(181,37,30,.4); }
.badge-resolved  { background:rgba(45,158,95,.1);    color:#7ee8a2;             border:1px solid rgba(45,158,95,.2); }
.badge-superadmin  { background:rgba(201,162,39,.2);   color:var(--gold-light);   border:1px solid rgba(201,162,39,.4); }
.badge-admin       { background:rgba(26,58,110,.4);    color:#8ab4f8;             border:1px solid rgba(138,180,248,.35); }
.badge-union_rep   { background:rgba(45,95,158,.35);   color:#a8d4ff;             border:1px solid rgba(100,180,255,.35); }
.badge-union_support{ background:rgba(100,60,160,.35); color:#d4b4ff;             border:1px solid rgba(180,140,255,.35); }
.badge-moderator   { background:rgba(45,158,95,.15);   color:#7ee8a2;             border:1px solid rgba(45,158,95,.3); }
.badge-viewer      { background:rgba(255,255,255,.06); color:rgba(245,243,238,.55);border:1px solid rgba(245,243,238,.12); }

/* ── TABLES ── */
.table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.data-table { width:100%; border-collapse:collapse; font-size:13px; }
.data-table th { background:rgba(201,162,39,.1); color:var(--gold); text-align:left; padding:11px 14px; font-family:'Bebas Neue',sans-serif; letter-spacing:2px; font-size:12px; border-bottom:1px solid rgba(201,162,39,.22); white-space:nowrap; }
.data-table td { padding:10px 14px; border-bottom:1px solid rgba(255,255,255,.05); color:rgba(245,243,238,.8); vertical-align:top; }
.data-table tr:hover td { background:rgba(255,255,255,.025); }
.data-table td.muted { color:rgba(245,243,238,.35); font-size:12px; }

/* ── ADMIN LAYOUT ── */
.admin-shell { display:flex; min-height:100vh; overflow:hidden; }
.sidebar-wrap { display:flex; flex-shrink:0; } /* transparent wrapper — collapses to 0 on mobile */
.sidebar { width:var(--sidebar-w); background:var(--navy-dark); border-right:2px solid rgba(201,162,39,.18); display:flex; flex-direction:column; position:sticky; top:0; height:100vh; overflow-y:auto; flex-shrink:0; transition:transform .25s; }
.sidebar-logo { padding:20px 18px 16px; border-bottom:1px solid rgba(201,162,39,.12); display:flex; align-items:center; gap:12px; }
.sidebar-logo .lb { width:38px; height:38px; background:var(--gold); border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; color:var(--navy); font-size:13px; flex-shrink:0; }
.sidebar-logo img { width:38px; height:38px; object-fit:contain; border-radius:4px; }
.sidebar-logo-text h2 { font-family:'Bebas Neue',sans-serif; font-size:15px; letter-spacing:2px; color:var(--white); line-height:1.1; }
.sidebar-logo-text p { font-size:8px; color:var(--gold); letter-spacing:2px; text-transform:uppercase; }
.sidebar-nav { flex:1; padding:10px 0; }
.sidebar-nav a { display:flex; align-items:center; gap:10px; padding:10px 18px; font-size:13px; font-weight:500; color:rgba(245,243,238,.58); transition:all .18s; text-decoration:none; border-left:3px solid transparent; }
.sidebar-nav a:hover { color:var(--white); background:rgba(255,255,255,.04); }
.sidebar-nav a.active { color:var(--gold); border-left-color:var(--gold); background:rgba(201,162,39,.06); }
.sidebar-nav .nav-section { font-size:9px; letter-spacing:2px; text-transform:uppercase; color:rgba(245,243,238,.22); padding:12px 18px 5px; font-family:'Bebas Neue',sans-serif; }
.sidebar-footer { padding:13px 18px; border-top:1px solid rgba(245,243,238,.07); font-size:12px; color:rgba(245,243,238,.32); }
.sidebar-footer strong { color:var(--gold); display:block; }
.sidebar-footer a { display:block; margin-top:8px; color:rgba(245,243,238,.35); font-size:12px; }
.sidebar-footer a:hover { color:#f4918e; }
.admin-main { flex:1; min-width:0; overflow-x:hidden; }
.admin-topbar { background:rgba(6,14,29,.9); border-bottom:1px solid rgba(201,162,39,.14); padding:13px 20px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:50; backdrop-filter:blur(8px); gap:12px; }
.admin-topbar h1 { font-family:'Bebas Neue',sans-serif; font-size:20px; letter-spacing:3px; white-space:nowrap; }
.admin-content { padding:20px; }

/* Mobile sidebar toggle */
.sidebar-toggle { display:none; background:none; border:none; color:var(--white); font-size:22px; cursor:pointer; padding:4px 8px; flex-shrink:0; }
.sidebar-close { display:none; position:absolute; top:14px; right:14px; background:none; border:none; color:rgba(245,243,238,.5); font-size:20px; cursor:pointer; }
.sidebar-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:199; }

/* ── STAT CARDS ── */
.stat-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:12px; margin-bottom:22px; }
.stat-card { background:rgba(255,255,255,.04); border:1px solid rgba(201,162,39,.16); border-radius:8px; padding:14px 16px; text-align:center; }
.stat-num { font-family:'Bebas Neue',sans-serif; font-size:36px; color:var(--gold); line-height:1; }
.stat-label { font-size:10px; letter-spacing:2px; text-transform:uppercase; color:rgba(245,243,238,.4); margin-top:4px; }

/* ── SECTION HEADER ── */
.section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; flex-wrap:wrap; gap:10px; }
.section-header h2 { font-family:'Bebas Neue',sans-serif; font-size:20px; letter-spacing:2px; }
.actions-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.search-input { background:rgba(255,255,255,.05); border:1px solid rgba(245,243,238,.14); border-radius:4px; padding:8px 14px; color:var(--white); font-size:13px; font-family:'DM Sans',sans-serif; outline:none; min-width:160px; width:100%; max-width:220px; }
.search-input:focus { border-color:var(--gold); }

/* ── PUBLIC HEADER ── */
.pub-header { background:linear-gradient(135deg,#060e1d 0%,#0a1628 60%,#112040 100%); border-bottom:3px solid var(--gold); padding:0 4%; position:sticky; top:0; z-index:100; display:flex; align-items:center; justify-content:space-between; height:68px; }
.pub-nav { display:flex; align-items:center; }
.pub-nav a { color:var(--white); font-size:12px; font-weight:500; letter-spacing:1px; text-transform:uppercase; margin-left:20px; opacity:.75; transition:opacity .2s,color .2s; white-space:nowrap; }
.pub-nav a:hover { opacity:1; color:var(--gold); }

/* Mobile hamburger */
.nav-toggle { display:none; background:none; border:none; color:var(--white); font-size:24px; cursor:pointer; padding:4px; margin-left:12px; }
.mobile-nav { display:none; position:fixed; inset:0; top:68px; background:rgba(6,14,29,.97); z-index:99; flex-direction:column; padding:24px 0; overflow-y:auto; }
.mobile-nav.open { display:flex; }
.mobile-nav a { color:var(--white); font-size:16px; font-weight:500; letter-spacing:1px; text-transform:uppercase; padding:16px 28px; border-bottom:1px solid rgba(245,243,238,.06); opacity:.8; }
.mobile-nav a:hover { opacity:1; color:var(--gold); background:rgba(201,162,39,.05); }

/* ── MODAL ── */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.85); z-index:999; display:none; align-items:center; justify-content:center; padding:16px; backdrop-filter:blur(4px); }
.modal-overlay.show { display:flex; }
.modal { background:#0d1e38; border:2px solid var(--gold); border-radius:10px; padding:28px; width:100%; max-width:520px; position:relative; max-height:92vh; overflow-y:auto; }
.modal-close { position:absolute; top:13px; right:16px; background:none; border:none; color:var(--white); font-size:22px; cursor:pointer; opacity:.5; }
.modal-close:hover { opacity:1; }
.modal h3 { font-family:'Bebas Neue',sans-serif; font-size:24px; letter-spacing:2px; color:var(--gold); margin-bottom:18px; }

/* ── CAPTCHA ── */
.captcha-wrap { background:rgba(255,255,255,.05); border:1px solid rgba(245,243,238,.15); border-radius:5px; padding:12px 16px; display:flex; align-items:center; gap:14px; }
.captcha-wrap input[type="checkbox"] { width:18px; height:18px; accent-color:var(--gold); cursor:pointer; flex-shrink:0; }
.captcha-math { display:none; margin-top:10px; align-items:center; gap:12px; flex-wrap:wrap; }
.captcha-math.show { display:flex; }
.captcha-math .eq { font-family:'Bebas Neue',sans-serif; font-size:18px; color:var(--gold-light); }
.captcha-math input { width:72px !important; }

/* ── NEWS CARDS ── */
.news-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.news-card { background:rgba(255,255,255,.04); border:1px solid rgba(201,162,39,.16); border-radius:10px; overflow:hidden; transition:border-color .25s,transform .25s; display:flex; flex-direction:column; }
.news-card:hover { border-color:var(--gold); transform:translateY(-3px); }
.news-card-head { background:linear-gradient(135deg,rgba(201,162,39,.1),rgba(26,58,110,.22)); padding:14px 18px 11px; border-bottom:1px solid rgba(201,162,39,.1); }
.news-cat-tag { display:inline-block; background:var(--gold); color:var(--navy); font-family:'Bebas Neue',sans-serif; font-size:10px; letter-spacing:2px; padding:2px 9px; border-radius:2px; margin-bottom:8px; }
.news-card-head h4 { font-family:'Bebas Neue',sans-serif; font-size:17px; letter-spacing:1.5px; color:var(--white); line-height:1.2; }
.news-card-body { padding:13px 18px 18px; flex:1; display:flex; flex-direction:column; }
.news-card-body p { font-size:13px; line-height:1.7; color:rgba(245,243,238,.6); flex:1; margin-bottom:12px; }
.news-meta { font-size:10px; color:rgba(245,243,238,.3); letter-spacing:1px; text-transform:uppercase; }

/* ── STEWARDS ── */
.steward-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; }
.steward-card { background:rgba(255,255,255,.04); border:1px solid rgba(201,162,39,.18); border-radius:10px; padding:20px; display:flex; gap:14px; align-items:flex-start; transition:border-color .25s; }
.steward-card:hover { border-color:var(--gold); }
.steward-avatar { width:50px; height:50px; border-radius:50%; background:rgba(201,162,39,.2); border:2px solid var(--gold); object-fit:cover; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; font-size:18px; color:var(--gold); }
.steward-info h4 { font-family:'Bebas Neue',sans-serif; font-size:16px; letter-spacing:1.5px; color:var(--white); margin-bottom:4px; }
.steward-building { font-size:11px; color:var(--gold); font-weight:500; margin-bottom:4px; text-transform:uppercase; letter-spacing:1px; }
.steward-email a { font-size:13px; color:rgba(245,243,238,.6); }
.steward-email a:hover { color:var(--gold); }

/* ── PUBLIC SECTIONS ── */
section.pub { padding:60px 4%; }
section.pub.dark { background:#060e1d; }
section.pub.mid  { background:#0d1e38; }
.sec-label { font-family:'Bebas Neue',sans-serif; letter-spacing:5px; font-size:11px; color:var(--gold); margin-bottom:8px; }
.sec-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(30px,4vw,52px); letter-spacing:2px; margin-bottom:12px; }
.sec-sub { color:rgba(245,243,238,.6); font-size:15px; line-height:1.7; max-width:560px; margin-bottom:40px; }

/* ── CBA VIEWER ── */
.cba-viewer-wrap { background:rgba(255,255,255,.03); border:1px solid rgba(201,162,39,.2); border-radius:10px; overflow:hidden; }
.cba-toolbar { background:rgba(6,14,29,.85); padding:12px 16px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(201,162,39,.14); flex-wrap:wrap; gap:8px; }
.cba-toolbar-left { font-size:13px; color:rgba(245,243,238,.6); }
.cba-iframe { width:100%; height:80vh; min-height:500px; border:none; display:block; }
.cba-mobile-fallback { display:none; text-align:center; padding:40px 20px; }

/* ── HERO ── */
.hero { min-height:88vh; display:flex; align-items:center; padding:80px 4% 60px; position:relative; overflow:hidden; }
.hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 80% 60% at 70% 50%,rgba(26,58,110,.45) 0%,transparent 70%),repeating-linear-gradient(0deg,transparent,transparent 60px,rgba(201,162,39,.03) 60px,rgba(201,162,39,.03) 61px),repeating-linear-gradient(90deg,transparent,transparent 60px,rgba(201,162,39,.03) 60px,rgba(201,162,39,.03) 61px); pointer-events:none; }
.hero-content { position:relative; max-width:680px; }
.hero-tag { display:inline-block; background:var(--gold); color:var(--navy); font-family:'Bebas Neue',sans-serif; letter-spacing:4px; font-size:11px; padding:4px 14px; margin-bottom:16px; }
.hero h2 { font-family:'Bebas Neue',sans-serif; font-size:clamp(42px,7vw,96px); line-height:.95; letter-spacing:3px; margin-bottom:20px; }
.hero h2 span { color:var(--gold); }
.hero p { font-size:16px; line-height:1.7; color:rgba(245,243,238,.72); max-width:520px; margin-bottom:32px; font-weight:300; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }

/* ── ANNOUNCEMENT BAR ── */
.announcement-bar { background:rgba(201,162,39,.15); border-bottom:1px solid rgba(201,162,39,.3); padding:10px 4%; text-align:center; font-size:13px; color:var(--gold-light); }

/* ── FORM WRAP ── */
.form-wrap { background:rgba(255,255,255,.04); border:1px solid rgba(201,162,39,.2); border-radius:10px; padding:28px; }
.form-wrap h3 { font-family:'Bebas Neue',sans-serif; font-size:24px; letter-spacing:2px; color:var(--gold); margin-bottom:6px; }
.form-wrap .subtitle { font-size:13px; color:rgba(245,243,238,.5); margin-bottom:20px; line-height:1.6; }
.token-note { font-size:11px; color:rgba(245,243,238,.33); margin-top:10px; font-style:italic; }

/* ── TWO COL ── */
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:start; }

/* ── FOOTER ── */
footer.pub { background:#060e1d; border-top:2px solid var(--gold); padding:28px 4%; text-align:center; color:rgba(245,243,238,.35); font-size:12px; }
footer.pub strong { color:var(--gold); }
footer.pub a { color:rgba(245,243,238,.45); }
footer.pub a:hover { color:var(--gold); }
.footer-credit { margin-top:10px; font-size:11px; color:rgba(245,243,238,.2); }
.footer-credit a { color:rgba(245,243,238,.3); }
.footer-credit a:hover { color:var(--gold); }

/* ── SCROLLBAR ── */
::-webkit-scrollbar { width:5px; height:5px; }
::-webkit-scrollbar-track { background:rgba(255,255,255,.03); }
::-webkit-scrollbar-thumb { background:rgba(201,162,39,.28); border-radius:3px; }

/* ── IMPORT AREA ── */
.import-zone { border:2px dashed rgba(201,162,39,.3); border-radius:8px; padding:24px; text-align:center; transition:border-color .2s; cursor:pointer; }
.import-zone:hover, .import-zone.drag-over { border-color:var(--gold); background:rgba(201,162,39,.05); }
.import-zone p { color:rgba(245,243,238,.5); font-size:13px; margin-bottom:8px; }
.import-zone .icon { font-size:32px; margin-bottom:10px; display:block; }

/* ── REPLY FORM ── */
.reply-form { background:rgba(26,58,110,.2); border:1px solid rgba(138,180,248,.2); border-radius:8px; padding:18px; margin-top:12px; }
.reply-form label { color:rgba(138,180,248,.8); }
.reply-form textarea { background:rgba(255,255,255,.07); border-color:rgba(138,180,248,.2); min-height:100px; }
.reply-form textarea:focus { border-color:rgba(138,180,248,.5); }

/* ═══════════════════════════════════
   RESPONSIVE — TABLET & MOBILE
═══════════════════════════════════ */

/* Tablet */
@media (max-width:900px) {
  .two-col { grid-template-columns:1fr; }
  section.pub { padding:48px 4%; }
  .card-grid { grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); }
}

/* Mobile nav: show hamburger, hide desktop nav */
@media (max-width:720px) {
  .pub-nav a:not(.btn-primary) { display:none; }
  .nav-toggle { display:block; }

  section.pub { padding:40px 5%; }
  .sec-sub { margin-bottom:28px; }
  .hero { min-height:70vh; padding:60px 5% 40px; }
  .hero p { font-size:15px; }
  .hero-actions { flex-direction:column; align-items:flex-start; }
  .hero-actions .btn { width:100%; text-align:center; }

  .form-wrap { padding:22px 18px; }
  .steward-grid { grid-template-columns:1fr; }
  .news-grid { grid-template-columns:1fr; }

  .cba-iframe { display:none; }
  .cba-mobile-fallback { display:block; }
}

/* Admin mobile */
@media (max-width:860px) {
  /* Wrapper collapses to zero — kills the flex gap */
  .sidebar-wrap {
    width:0;
    overflow:visible;
    flex-shrink:0;
  }

  .sidebar {
    position:fixed;
    top:0; left:0;
    width:280px;
    height:100vh;
    z-index:200;
    transform:translateX(-100%);
    overflow-y:auto;
    overflow-x:hidden;
  }
  .sidebar.open {
    transform:translateX(0);
    box-shadow:6px 0 28px rgba(0,0,0,.7);
  }

  .sidebar-close { display:block; }
  .sidebar-toggle { display:block; }
  .sidebar-overlay.open { display:block; }

  .admin-shell { position:relative; overflow:hidden; }
  .admin-main { width:100%; }

  .admin-topbar { padding:10px 14px; }
  .admin-topbar h1 { font-size:16px; letter-spacing:2px; }
  .admin-content { padding:12px; }

  .stat-grid { grid-template-columns:repeat(2,1fr); }
  .data-table th, .data-table td { padding:8px 10px; font-size:12px; }
  .section-header { flex-direction:column; align-items:flex-start; }
  .search-input { max-width:100%; width:100%; }
  .two-col { grid-template-columns:1fr; }
  .card { padding:18px; }
}

@media (max-width:480px) {
  .stat-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
  .stat-num { font-size:28px; }
  .modal { padding:20px; }
  .btn { padding:10px 18px; font-size:13px; }
}