/* Siebert brand theme overrides and accessibility improvements */
:root{
  --sb-brand: #7698B3;
  --sb-on-brand: #ffffff;
  --sb-bg: #f7f9fb;
  --sb-text: #0b2230;
  --sb-muted: #5b6b79;
  --sb-success: #2e7d32;
  --sb-warning: #b26a00;
  --sb-danger: #b23b3b;
}

/* Base typography and colors */
html{ scroll-behavior: smooth; }
body{
  background-color: var(--sb-bg);
  color: var(--sb-text);
  font-size: 16px;
  line-height: 1.5;
}

/* Accessible focus styles */
a:focus, button:focus, [role="button"]:focus, .card a:focus{
  outline: 3px solid var(--sb-brand) !important;
  outline-offset: 2px;
}

/* Skip link for keyboard users */
.skip-link{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.skip-link:focus{ position:static; width:auto; height:auto; padding:.5rem .75rem; background:var(--sb-brand); color:var(--sb-on-brand); border-radius:.5rem; z-index:10000; }

/* Map framework highlight utilities to brand color */
.color-highlight{ color: var(--sb-brand) !important; }
.bg-highlight{ background-color: var(--sb-brand) !important; color: var(--sb-on-brand) !important; }

/* Legacy custom helpers normalized to brand */
.bg-sb{ background-color: var(--sb-brand) !important; color: var(--sb-on-brand) !important; }
.color-sb{ color: var(--sb-brand) !important; }
.btn-sb{ background-color: var(--sb-brand) !important; color: var(--sb-on-brand) !important; border-color: #5f82a0 !important; }
.btn-sb:hover{ filter: brightness(0.95); }

/* Ensure icons inside brand backgrounds are legible */
.bg-sb i, .bg-highlight i{ color: var(--sb-on-brand) !important; }

/* Header and footer tweaks */
.header .header-title{ color: var(--sb-text) !important; }
#footer-bar a.active-nav, #footer-bar a:focus{ color: var(--sb-brand) !important; }

/* Card readability improvements */
.card .content p{ color: var(--sb-muted); }
.card h1, .card h2, .card h3, .card h4{ color: var(--sb-text); }

/* Minimum touch target for tappable cards */
.card a, a.card{ min-height: 44px; }

/* Badge contrast on light background */
.badge.bg-green-dark{ background-color: var(--sb-success) !important; }
.badge.bg-warning, .bg-warning{ background-color: #F5B700 !important; color: #1a1a1a !important; }
.bg-success{ background-color: var(--sb-success) !important; }

/* Form improvements */
.input-style input, .input-style select, .input-style textarea{ font-size: 1rem; }
.input-style input:focus, .input-style select:focus, .input-style textarea:focus{ box-shadow: 0 0 0 3px rgba(118,152,179,.3); border-color: var(--sb-brand); }

/* Modal/menu close buttons */
.menu .btn.bg-green-dark{ background-color: var(--sb-success) !important; }

/* Ensure adequate contrast for links */
a{ color: var(--sb-brand); }
a:hover{ color: #5f82a0; }

/* Modern glass header/footer */
.sb-glass{ background: rgba(255,255,255,0.72) !important; backdrop-filter: saturate(180%) blur(14px); box-shadow: 0 6px 18px rgba(11,34,48,0.08); }
.theme-dark .sb-glass{ background: rgba(19,24,28,0.6) !important; box-shadow: 0 6px 18px rgba(0,0,0,0.5); }
.header.sb-glass{ border-bottom: 1px solid rgba(118,152,179,.25); }
#footer-bar.sb-glass{ border-top: 1px solid rgba(118,152,179,.25); }

/* Header brand tweaks */
.header-sb-logo{ width:34px; height:34px; border-radius:50%; }
.header .header-title{ font-weight:700; letter-spacing:.2px; }

/* Footer active pill */
#footer-bar a{ position:relative; }
#footer-bar a.active-nav span{ font-weight:700; }
#footer-bar a.active-nav::after{ content:""; position:absolute; left:50%; transform:translateX(-50%); bottom:-8px; width:26px; height:4px; background:var(--sb-brand); border-radius:2px; }

/* WiFi QR size */
.wifi-qr canvas, .wifi-qr img{ width:180px !important; height:180px !important; }
