/* AaronVC responsive app shell – Bootstrap 5.3.8 compatible */
:root { --avc-ink:#14213d; --avc-accent:#2158d6; --avc-accent-soft:#eaf0ff; --avc-edge:#e5e9f3; --avc-surface:#fff; --avc-bg:#f5f7fc; --avc-bottom-size:76px; }
html { scroll-padding-top:80px; -webkit-text-size-adjust:100%; }
body { background:var(--avc-bg); color:var(--avc-ink); min-height:100dvh; overflow-x:hidden; }
.avc-topbar { z-index:1025; background:rgba(255,255,255,.97); border-bottom:1px solid var(--avc-edge); box-shadow:0 2px 14px rgba(19,39,79,.045); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.avc-topbar-inner { min-height:68px; display:flex; align-items:center; gap:clamp(10px,2vw,32px); padding:8px clamp(14px,3vw,40px); }
.avc-brand { display:inline-flex; gap:11px; align-items:center; text-decoration:none; color:#142542; flex-shrink:0; min-width:0; }
.avc-brand-icon { border-radius:12px; object-fit:contain; box-shadow:0 3px 12px rgba(27,75,165,.11); background:#fff; }
.avc-brand-text { display:flex; flex-direction:column; line-height:1.15; }
.avc-brand-text strong { font-size:clamp(.95rem,1.5vw,1.14rem); font-weight:800; letter-spacing:-.025em; }
.avc-brand-text small { font-size:.68rem; font-weight:600; color:#708099; letter-spacing:.13em; text-transform:uppercase; margin-top:3px; }
.avc-top-desktop { display:flex; justify-content:center; align-items:center; flex:1 1 auto; gap:5px; }
.avc-top-link { display:inline-flex; align-items:center; gap:8px; padding:10px 14px; color:#52617d; font-weight:650; font-size:.9rem; border-radius:11px; text-decoration:none; white-space:nowrap; }
.avc-top-link:hover,.avc-top-link.active { color:var(--avc-accent); background:var(--avc-accent-soft); }
.avc-top-link svg { width:18px; height:18px; }
.avc-header-actions { display:flex; align-items:center; gap:12px; margin-left:auto; }
.avc-user-label { font-size:.8rem; color:#65748d; font-weight:600; max-width:140px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.avc-menu-button { border:1px solid #dfe5f1; background:#fff; border-radius:11px; padding:9px 12px; display:flex; align-items:center; justify-content:center; gap:6px; color:#283a59; font-size:.88rem; font-weight:700; min-height:42px; }
.avc-menu-button:hover { background:#f3f6fc; }
.avc-bottom-nav { display:none; }
.avc-drawer { --bs-offcanvas-width:min(370px,92vw); background:#f9faff; }
.avc-drawer .offcanvas-header { background:#fff; padding:23px 22px; border-bottom:1px solid var(--avc-edge); }
.avc-drawer .offcanvas-body { padding:16px; }
.avc-drawer-eyebrow { font-size:.69rem; font-weight:800; letter-spacing:.14em; color:#6075a5; margin-bottom:7px; }
.avc-account-chip { color:#5c6b82; border:1px solid #e3e8f4; background:#fff; border-radius:12px; padding:12px 15px; margin:0 0 12px; font-size:.83rem; }
.avc-account-chip strong { color:#1b2c4b; }
.avc-drawer-links { display:grid; grid-template-columns:1fr; gap:4px; }
.avc-drawer-item,.avc-logout-link,.avc-install-link { display:flex; align-items:center; gap:12px; width:100%; min-height:47px; padding:10px 14px; border-radius:11px; text-decoration:none; font-weight:650; font-size:.9rem; color:#43526b; background:transparent; border:0; text-align:left; }
.avc-drawer-item svg,.avc-logout-link svg,.avc-install-link svg { flex-shrink:0; width:19px; height:19px; }
.avc-drawer-item:hover,.avc-drawer-item.active { background:#eaf0ff; color:#1a4fca; }
.avc-install-link { background:#eaf0ff; color:#2057d3; margin-top:14px; }
.avc-logout-link { margin-top:16px; background:#fff0f0; color:#bc3333; }
.avc-logout-link:hover { background:#fee4e4; color:#a42222; }
/* Cohesive global treatment with existing PHP dashboards, reports, forms */
body > main { min-width:0; }
main .container, main .container-fluid { max-width:1320px; }
.card { border-color:#e7ebf4; border-radius:16px; box-shadow:0 5px 22px rgba(27,43,82,.04); }
.card-header { border-radius:16px 16px 0 0!important; }
.btn { border-radius:10px; font-weight:600; }
.form-control,.form-select { border-color:#d9e0ee; border-radius:10px; min-height:42px; }
.form-control:focus,.form-select:focus { border-color:#8aabed; box-shadow:0 0 0 .2rem rgba(45,99,211,.12); }
.table { --bs-table-bg:transparent; }
.table-responsive, .avc-table-scroll { max-width:100%; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; border-radius:12px; }
.avc-table-scroll > table { min-width:650px; margin-bottom:0; }
.table th { white-space:nowrap; font-size:.82rem; vertical-align:middle; }
.table td { vertical-align:middle; }
img { max-width:100%; }
canvas,svg { max-width:100%; }
pre,code { overflow-wrap:anywhere; }
.vc-footer.avc-site-footer { color:#728099; padding:20px 0 24px; font-size:.8rem; background:transparent!important; }
.avc-footer-credit { font-size:.73rem; margin-top:4px; }
.avc-main-title { font-weight:800; color:#142540; }
/* Improve existing multi-column admin tables and dropdowns on phones */
@media(max-width:991.98px) {
  :root { --avc-bottom-size:74px; }
  .avc-top-desktop,.avc-user-label { display:none!important; }
  .avc-topbar-inner { min-height:61px; padding:8px 15px; }
  .avc-brand-icon { width:36px; height:36px; border-radius:10px; }
  .avc-brand-text strong { font-size:.94rem; }
  .avc-brand-text small { font-size:.59rem; }
  .avc-menu-button { min-height:40px; padding:8px 10px; }
  .avc-bottom-nav { display:grid; position:fixed; bottom:0; left:0; right:0; z-index:1040; grid-template-columns:repeat(5,minmax(0,1fr)); align-items:stretch; background:rgba(255,255,255,.98); border-top:1px solid #dce3f2; box-shadow:0 -8px 32px rgba(11,31,73,.1); padding:7px max(6px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left)); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
  .avc-tab { appearance:none; -webkit-appearance:none; position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:0; min-height:58px; padding:4px 0 2px; margin:0; border:0; border-radius:13px; text-align:center; background:transparent; color:#667590; text-decoration:none; gap:3px; }
  .avc-tab-icon { display:flex; justify-content:center; align-items:center; width:39px; height:30px; border-radius:11px; transition:background .15s ease; }
  .avc-tab-icon svg { width:22px; height:22px; }
  .avc-tab-label { font-size:clamp(.58rem,2.1vw,.7rem); font-weight:750; line-height:1.08; white-space:nowrap; }
  .avc-tab.active { color:#2056d4; }
  .avc-tab.active .avc-tab-icon { background:#e8eeff; }
  .avc-tab:hover,.avc-tab:focus-visible { color:#174cc1; background:#f6f8fe; }
  body:has(.avc-bottom-nav) { padding-bottom:calc(86px + env(safe-area-inset-bottom)); }
  body:has(.avc-bottom-nav) main { padding-bottom:18px!important; }
  .container,.container-fluid { --bs-gutter-x:1.35rem; }
  main .container,main .container-fluid { max-width:100%; }
  .row { --bs-gutter-x:1rem; --bs-gutter-y:1rem; }
  .card { border-radius:14px; }
  .card-body { padding:clamp(13px,3.5vw,22px); }
  .btn:not(.btn-sm), .form-control, .form-select { min-height:44px; }
  input,select,textarea { font-size:16px!important; }
  .table { font-size:.84rem; }
  .table th,.table td { padding:.65rem .7rem; }
  .avc-table-scroll { margin-bottom:1rem; border:1px solid #e7ebf4; }
  .avc-table-scroll .table { margin:0; }
  h1 { font-size:clamp(1.3rem,5vw,1.85rem); }
  h2 { font-size:clamp(1.15rem,4.4vw,1.55rem); }
  .vc-footer.avc-site-footer { padding-bottom:12px; }
}
@media(max-width:400px) { .avc-brand-text strong { font-size:.87rem; } .avc-tab-icon svg { width:21px; height:21px; } .avc-menu-button span { display:none!important; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; } }

/* Offcanvas structural fallback if CDN CSS is slow to load */
.avc-drawer:not(.show):not(.showing) { visibility:hidden; }
.avc-drawer { position:fixed; top:0; right:0; bottom:0; z-index:1050; }

/* Five-button navigation for volunteer bottom tabs on mobile and desktop */
@media(min-width:992px){.avc-bottom-nav{display:grid;position:fixed;bottom:0;left:0;right:0;z-index:1040;grid-template-columns:repeat(5,minmax(0,1fr));background:#fff;border-top:1px solid #dce3f2;padding:7px max(12px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));box-shadow:0 -8px 28px rgba(11,31,73,.08)}.avc-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:58px;text-decoration:none;color:#667590;border:0;background:transparent}.avc-tab-icon{display:flex;align-items:center;justify-content:center;width:39px;height:30px}.avc-tab-label{font-size:.76rem;font-weight:700}.avc-tab.active{color:#2056d4}.avc-tab.active .avc-tab-icon{background:#e8eeff;border-radius:11px}body:has(.avc-bottom-nav){padding-bottom:90px}}

/* v20261024: Volunteer Mock Poll shortcut in both mobile and desktop header.
   Bottom navigation now includes a dedicated fifth Mock Poll tab. */
.avc-mock-poll-button {
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  white-space:nowrap; flex-shrink:0;
  min-height:43px; padding:9px 13px;
  border-radius:12px; border:1px solid #bcd3ff;
  background:#e9f2ff; color:#164fae; font-size:.85rem;
  font-weight:800; text-decoration:none;
}
.avc-mock-poll-button svg { flex:0 0 auto; width:19px; height:19px; }
.avc-mock-poll-button:hover, .avc-mock-poll-button.is-current { background:#1757c5; border-color:#1757c5; color:white; }
.avc-mock-poll-button:focus-visible { outline:3px solid #9ec5fe; outline-offset:2px; }
@media(max-width:991.98px) {
  .avc-topbar-inner { gap:8px; }
  .avc-header-actions { gap:7px; }
  .avc-brand { flex:1 1 auto; overflow:hidden; }
  .avc-brand-text { min-width:0; }
  .avc-brand-text strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .avc-mock-poll-button { min-height:40px; padding:8px 9px; font-size:.75rem; border-radius:10px; gap:5px; }
  .avc-mock-poll-button svg { width:17px; height:17px; }
}
@media(max-width:365px) {
  .avc-brand-icon { width:32px; height:32px; }
  .avc-brand { gap:7px; }
  .avc-brand-text strong { font-size:.78rem; }
  .avc-brand-text small { font-size:.52rem; letter-spacing:.07em; }
  .avc-topbar-inner { padding-inline:9px; }
  .avc-mock-poll-button { font-size:.7rem; padding-inline:7px; }
}

/* v20261024: Uniform dropdown text/indicator separation.
   Several existing pages use padding-inline:.35rem and hardcoded 80/90px
   widths, leaving their arrows on top of "Religion", "Unknown", etc.
   Put the icon in its own reserved area; never change names or values. */
select.form-select:not([multiple]):not([size]),
select.form-select:not([multiple])[size="1"] {
  padding-inline-start:.75rem !important;
  padding-inline-end:2.85rem !important;
  background-position:right .85rem center !important;
  background-repeat:no-repeat !important;
  background-size:16px 12px !important;
  text-overflow:ellipsis;
  box-sizing:border-box;
}
select.form-select.form-select-sm:not([multiple]):not([size]),
select.form-select.form-select-sm:not([multiple])[size="1"] {
  padding-inline-end:2.65rem !important;
  background-position:right .75rem center !important;
}
/* Non-Bootstrap native dropdowns also need breathing room. */
select:not(.form-select):not([multiple]):not([size]) {
  padding-inline-end:2.25rem !important;
  text-overflow:ellipsis;
}
/* Table filters/inline editors have horizontal scrolling. Do not squeeze
   select labels into 80px just to fit multiple columns side by side. */
.table select.form-select:not([multiple]),
.vc-voters-table-wrap select.form-select:not([multiple]),
.vc-live-table-wrap select.form-select:not([multiple]) {
  min-width:142px !important;
  max-width:none;
}
@media(max-width:991.98px) {
  .filter-bar select.form-select, .vc-filter-card select.form-select { min-width:0; width:100%; }
}

/* Preserve four equal columns for existing admin tabs; volunteers have five. */
.avc-bottom-nav.avc-bottom-nav--four { grid-template-columns:repeat(4,minmax(0,1fr)); }
