@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&display=swap');

/* ============================================================
   STRASKO GUEST APP — v10
   Font: DM Sans (clean, geometric — matches logo aesthetic)
   Icons: flat SVG-style, monochrome (black/white/blue only)
   Hero: clean white/near-white background
   ============================================================ */

/* ── DARK THEME ───────────────────────────────────────────── */


/* ── LIGHT THEME ──────────────────────────────────────────── */
#sga-app {
  --bg:      #f7f8fa;
  --bg2:     #eceef3;
  --bg3:     #e0e3eb;
  --border:  rgba(0,0,0,0.08);
  --border2: rgba(0,0,0,0.15);
  --text:    #0d1117;
  --text2:   #1f2533;
  --muted:   #636b7e;
  --accent:  #2F3F73;
  --open:    #16a34a;
  --closed:  #dc2626;
  --warn:    #d97706;
  --card:    #ffffff;
  --card-h:  #f0f4ff;
  --shadow:  rgba(0,0,0,0.06);
  --nav-bg:  rgba(247,248,250,0.96);
  --icon-bg: rgba(0,0,0,0.05);
  --icon-border: rgba(0,0,0,0.09);
}

/* ── BASE ─────────────────────────────────────────────────── */
#sga-app {
  border-radius:0!important;
  font-family: 'DM Sans', sans-serif !important;
  background: var(--bg) !important;
  color: var(--text) !important;
  max-width: 460px !important;
  margin: 0 auto !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  box-sizing: border-box !important;
}
#sga-app *, #sga-app *::before, #sga-app *::after { box-sizing:border-box!important; }
#sga-app * { color:inherit; }
#sga-app h1,#sga-app h2,#sga-app h3,#sga-app h4 { margin:0!important;padding:0!important;line-height:inherit!important; }
#sga-app a { color:inherit!important;text-decoration:none!important;background:none!important; }
#sga-app a:hover { color:inherit!important;text-decoration:none!important;opacity:1!important; }
#sga-app p { margin:0!important;padding:0!important;color:inherit!important; }
#sga-app button { font-family:'DM Sans',sans-serif!important;cursor:pointer!important; }
#sga-app img { opacity:1!important; }

/* ── HERO — sticky, centered, optional bg image ─────────── */
#sga-app .sga-hero {
  position:sticky!important;
  top:0!important;
  z-index:10!important;
  padding:36px 24px 32px!important;
  background:#ffffff!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  border-bottom:1px solid rgba(0,0,0,0.07)!important;
  border-radius:0!important;
  overflow:hidden!important;
}
/* Background image layer */
#sga-app .sga-hero-bg {
  position:absolute!important;
  inset:0!important;
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
  z-index:0!important;
}
/* Dark overlay on bg image */
#sga-app .sga-hero-overlay {
  position:absolute!important;
  inset:0!important;
  background:rgba(0,0,0,0.35)!important;
  z-index:1!important;
}
/* Content sits above bg image */
#sga-app .sga-hero-content {
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
}
/* When bg image: invert logo to white */
#sga-app .sga-hero-bg ~ .sga-hero-content .sga-logo-img {
  filter:brightness(0) invert(1)!important;
}
#sga-app .sga-hero-bg ~ .sga-hero-content .sga-logo-text {
  color:#ffffff!important;
}
#sga-app .sga-hero-bg ~ .sga-hero-content .sga-hero-tagline {
  color:rgba(255,255,255,0.80)!important;
}
/* Grid and noise — hidden */
#sga-app .sga-hero-noise,
#sga-app .sga-hero-grid { display:none!important; }

/* Logo */
#sga-app .sga-hero-logo {
  width:120px!important;
  margin-bottom:16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
#sga-app .sga-logo-img {
  width:120px!important;
  height:auto!important;
  display:block!important;
  filter:none!important;
  opacity:1!important;
}
#sga-app .sga-logo-text {
  font-family:'DM Sans',sans-serif!important;
  font-size:22px!important;
  font-weight:700!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  color:#0d1117!important;
  -webkit-text-fill-color:#0d1117!important;
}


/* Tagline */
#sga-app .sga-hero-tagline {
  font-family:'DM Sans',sans-serif!important;
  font-size:12px!important;
  font-weight:400!important;
  color:#8890a4!important;
  letter-spacing:.14em!important;
  text-transform:uppercase!important;
  margin:0 0 20px!important;
  padding:0!important;
  -webkit-text-fill-color:#8890a4!important;
}


#sga-app .sga-nav {
  border-radius:0!important;
  position:sticky!important;top:0!important;z-index:500!important;
  background:var(--nav-bg)!important;
  backdrop-filter:blur(20px)!important;
  border-bottom:1px solid var(--border)!important;
  padding:10px 14px!important;
}
#sga-app .sga-nav-scroll { display:flex!important;gap:6px!important;overflow-x:auto!important;scrollbar-width:none!important; }
#sga-app .sga-nav-scroll::-webkit-scrollbar { display:none!important; }
#sga-app .sga-pill {
  flex-shrink:0!important;padding:6px 14px!important;border-radius:0!important;
  font-size:12px!important;font-weight:500!important;
  border:1px solid var(--border)!important;
  background:transparent!important;color:var(--muted)!important;
  text-decoration:none!important;transition:all .18s!important;
  white-space:nowrap!important;display:inline-block!important;
}
#sga-app .sga-pill:hover, #sga-app .sga-pill.active {
  background:#2F3F73!important;border-color:#2F3F73!important;color:#ffffff!important;
}

/* ── SECTION ──────────────────────────────────────────────── */
#sga-app .sga-section { padding:28px 16px 8px!important;scroll-margin-top:60px!important;background:var(--bg)!important;position:relative!important;z-index:20!important; }
#sga-app .sga-sec-header { margin-bottom:16px!important; }
#sga-app .sga-sec-title {
  font-family:'DM Sans',sans-serif!important;
  font-size:11px!important;font-weight:600!important;
  letter-spacing:.12em!important;text-transform:uppercase!important;
  color:var(--muted)!important;
}

/* ── VENUE CARD ───────────────────────────────────────────── */
#sga-app .sga-card {
  background:var(--card)!important;
  border:1px solid var(--border)!important;
  border-radius:0!important;
  overflow:hidden!important;
  margin-bottom:10px!important;
  cursor:pointer!important;
  transition:background .15s,border-color .15s,box-shadow .15s!important;
  box-shadow:0 1px 4px var(--shadow)!important;
}
#sga-app .sga-card:hover { background:var(--card-h)!important;border-color:var(--border2)!important; }
#sga-app .sga-card-top { display:flex!important;gap:14px!important;padding:14px 16px!important;align-items:flex-start!important;background:transparent!important; }

/* Flat monochrome icon box */
#sga-app .sga-card-icon {
  width:42px!important;height:42px!important;border-radius:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font-size:18px!important;flex-shrink:0!important;line-height:1!important;
  filter:none!important;opacity:1!important;
  background:var(--icon-bg)!important;
  border:1px solid var(--icon-border)!important;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  font-style:normal!important;-webkit-text-fill-color:initial!important;text-shadow:none!important;
}
/* All color classes override to same flat style */
#sga-app .c-blue,#sga-app .c-green,#sga-app .c-orange,
#sga-app .c-purple,#sga-app .c-teal,#sga-app .c-red,
#sga-app .c-yellow,#sga-app .c-pink {
  background:var(--icon-bg)!important;
  border:1px solid var(--icon-border)!important;
}

#sga-app .sga-card-meta { flex:1!important;min-width:0!important; }
#sga-app .sga-card-name {
  font-family:'DM Sans',sans-serif!important;font-size:14px!important;font-weight:600!important;
  margin-bottom:2px!important;color:var(--text)!important;
}
#sga-app .sga-card-desc { font-size:12px!important;color:var(--muted)!important;line-height:1.5!important;margin-bottom:7px!important; }
#sga-app .sga-card-row { display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;flex-wrap:wrap!important; }
#sga-app .sga-hours { font-size:11px!important;color:var(--muted)!important;display:flex!important;align-items:center!important;gap:4px!important; }

/* ── STATUS BADGES ────────────────────────────────────────── */
#sga-app .sga-status { display:inline-flex!important;align-items:center!important;gap:5px!important;font-size:11px!important;font-weight:600!important;padding:2px 8px!important;border-radius:0!important;flex-shrink:0!important; }
#sga-app .sga-status.open { background:rgba(34,201,122,.12)!important;color:var(--open)!important;border:1px solid rgba(34,201,122,.28)!important; }
#sga-app .sga-status.closed { background:rgba(220,38,38,.08)!important;color:var(--closed)!important;border:1px solid rgba(220,38,38,.22)!important; }
#sga-app .sga-status-dot { width:5px!important;height:5px!important;border-radius:50%!important;flex-shrink:0!important;display:inline-block!important; }
#sga-app .sga-status.open .sga-status-dot { background:var(--open)!important;box-shadow:0 0 5px var(--open)!important;animation:sga-pulse 2s infinite!important; }
#sga-app .sga-status.closed .sga-status-dot { background:var(--closed)!important; }
@keyframes sga-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.5)}}

/* ── TAGS ─────────────────────────────────────────────────── */
#sga-app .sga-tags { display:flex!important;gap:4px!important;flex-wrap:wrap!important;margin-top:6px!important; }
#sga-app .sga-tag { font-size:10px!important;padding:2px 8px!important;border-radius:0!important;border:1px solid var(--border)!important;color:var(--muted)!important;font-weight:500!important;background:transparent!important;display:inline-block!important; }
#sga-app .sga-tag-free { border-color:rgba(34,201,122,.35)!important;color:var(--open)!important;background:rgba(34,201,122,.08)!important; }
#sga-app .sga-tag-paid { border-color:rgba(245,158,11,.35)!important;color:var(--warn)!important;background:rgba(245,158,11,.08)!important; }
#sga-app .sga-tag-accent { border-color:rgba(47,63,115,.35)!important;color:var(--accent)!important;background:rgba(47,63,115,.08)!important; }

/* ── DETAIL PANEL ─────────────────────────────────────────── */
#sga-app .sga-detail { display:none!important;padding:12px 16px!important;border-top:1px solid var(--border)!important;background:var(--card-h)!important; }
#sga-app .sga-detail.open { display:block!important; }
#sga-app .sga-detail-row { display:flex!important;align-items:flex-start!important;gap:10px!important;padding:6px 0!important;border-bottom:1px solid var(--border)!important; }
#sga-app .sga-detail-row:last-child { border-bottom:none!important; }
#sga-app .sga-detail-icon { width:18px!important;text-align:center!important;font-size:13px!important;flex-shrink:0!important;margin-top:1px!important; }
#sga-app .sga-detail-text { display:flex!important;flex-direction:column!important;gap:2px!important;flex:1!important; }
#sga-app .sga-detail-text span { font-size:12px!important;color:var(--muted)!important;line-height:1.5!important; }
#sga-app .sga-detail-text span:first-child { color:var(--text2)!important;font-weight:500!important; }

/* ── CARD FOOTER ──────────────────────────────────────────── */
#sga-app .sga-card-footer { border-top:1px solid var(--border)!important;display:flex!important;overflow:hidden!important;background:transparent!important; }
#sga-app .sga-action {
  flex:1!important;display:flex!important;align-items:center!important;justify-content:center!important;
  gap:5px!important;padding:10px 8px!important;font-size:12px!important;font-weight:500!important;
  color:var(--muted)!important;cursor:pointer!important;transition:all .15s!important;
  text-decoration:none!important;border:none!important;background:transparent!important;
  font-family:'DM Sans',sans-serif!important;
  border-right:1px solid var(--border)!important;
}
#sga-app .sga-action:last-child { border-right:none!important; }
#sga-app .sga-action:hover { background:var(--card-h)!important;color:var(--accent)!important; }

/* ── PRACTICAL INFO ───────────────────────────────────────── */
#sga-app .sga-wifi-block {
  display:flex!important;align-items:center!important;gap:14px!important;
  background:rgba(47,63,115,.07)!important;
  border:1px solid rgba(47,63,115,.20)!important;
  border-radius:0!important;padding:16px!important;margin-bottom:12px!important;
}

#sga-app .sga-wifi-icon { font-size:28px!important;flex-shrink:0!important;filter:none!important;opacity:1!important; }
#sga-app .sga-wifi-net { font-size:11px!important;color:var(--muted)!important;margin-bottom:4px!important; }
#sga-app .sga-wifi-pass { display:flex!important;align-items:center!important;gap:8px!important;font-family:monospace!important;font-size:15px!important;font-weight:700!important;color:var(--accent)!important;letter-spacing:.08em!important; }
#sga-app .sga-wifi-copy { font-size:10px!important;padding:2px 9px!important;border-radius:0!important;background:rgba(47,63,115,.12)!important;color:var(--accent)!important;border:1px solid rgba(47,63,115,.28)!important;cursor:pointer!important;font-weight:600!important; }
#sga-app .sga-wifi-copy:hover { background:rgba(47,63,115,.22)!important; }

#sga-app .sga-tiles { display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important;margin-bottom:12px!important; }
#sga-app .sga-tile { background:var(--card)!important;border:1px solid var(--border)!important;border-radius:0!important;padding:14px 12px!important;text-align:center!important;box-shadow:0 1px 3px var(--shadow)!important; }
#sga-app .sga-tile-icon { font-size:22px!important;margin-bottom:5px!important;display:block!important;filter:none!important;opacity:1!important; }
#sga-app .sga-tile-label { font-size:11px!important;font-weight:600!important;color:var(--text)!important;display:block!important;letter-spacing:.02em!important; }
#sga-app .sga-tile-val { font-size:11px!important;color:var(--muted)!important;margin-top:2px!important;display:block!important; }

#sga-app .sga-emergency { display:flex!important;align-items:center!important;gap:12px!important;background:rgba(220,38,38,.06)!important;border:1px solid rgba(220,38,38,.18)!important;border-radius:0!important;padding:14px!important;margin-bottom:14px!important; }
#sga-app .sga-emergency-icon { font-size:22px!important;flex-shrink:0!important;filter:none!important;opacity:1!important; }
#sga-app .sga-emergency-title { font-size:13px!important;font-weight:600!important;margin-bottom:3px!important;color:var(--text)!important; }
#sga-app .sga-emergency p { font-size:12px!important;color:var(--muted)!important;line-height:1.6!important; }
#sga-app .sga-emergency strong { color:var(--text)!important; }
#sga-app .sga-emergency a { color:var(--accent)!important; }

/* ── FEATURED CARDS ───────────────────────────────────────── */
#sga-app .sga-featured-grid { display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important; }
#sga-app .sga-feat-card {
  position:relative!important;border-radius:0!important;padding:16px 14px 14px!important;
  border:1px solid rgba(47,63,115,0.40)!important;display:flex!important;flex-direction:column!important;
  gap:5px!important;overflow:hidden!important;transition:transform .18s,box-shadow .18s!important;
  background:#2F3F73!important;
}

#sga-app .sga-feat-card:hover { transform:translateY(-2px)!important;box-shadow:0 6px 20px rgba(0,0,0,.22)!important; }

/* All color variants — same flat dark */
#sga-app .sga-feat-c-blue,#sga-app .sga-feat-c-green,
#sga-app .sga-feat-c-orange,#sga-app .sga-feat-c-purple,
#sga-app .sga-feat-c-teal,#sga-app .sga-feat-c-red,
#sga-app .sga-feat-c-yellow,#sga-app .sga-feat-c-pink { background:#2F3F73!important; }

#sga-app .sga-feat-badge { position:absolute!important;top:10px!important;right:10px!important;font-size:9px!important;font-weight:700!important;padding:2px 7px!important;border-radius:0!important;background:var(--accent)!important;color:#fff!important;letter-spacing:.05em!important;text-transform:uppercase!important; }
#sga-app .sga-feat-icon {
  font-size:26px!important;line-height:1!important;margin-bottom:2px!important;
  filter:none!important;opacity:1!important;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  font-style:normal!important;-webkit-text-fill-color:initial!important;text-shadow:none!important;
}
#sga-app .sga-feat-title { font-size:13px!important;font-weight:600!important;color:#f0f2f7!important;line-height:1.2!important; }
#sga-app .sga-feat-sub { font-size:11px!important;color:rgba(255,255,255,.55)!important;line-height:1.4!important; }
#sga-app .sga-feat-btn { display:inline-flex!important;align-items:center!important;justify-content:center!important;margin-top:auto!important;padding:7px 12px!important;border-radius:0!important;font-size:11px!important;font-weight:600!important;background:rgba(255,255,255,.10)!important;color:#f0f2f7!important;border:1px solid rgba(255,255,255,.16)!important;text-decoration:none!important;text-align:center!important;transition:background .15s!important; }
#sga-app .sga-feat-btn:hover { background:rgba(255,255,255,.18)!important; }

/* ── ANIMATION / PROGRAMME ────────────────────────────────── */
#sga-app .sga-prog-tabs { display:flex!important;gap:5px!important;margin-bottom:8px!important; }
#sga-app .sga-prog-tab { flex:1!important;padding:7px 5px!important;border-radius:0!important;font-size:11px!important;font-weight:600!important;border:1px solid var(--border)!important;background:var(--card)!important;color:var(--muted)!important;cursor:pointer!important;font-family:'DM Sans',sans-serif!important;text-align:center!important;transition:all .15s!important; }




#sga-app .sga-type-tabs { display:flex!important;gap:5px!important;margin-bottom:14px!important; }
#sga-app .sga-type-tab { flex:1!important;padding:6px!important;border-radius:0!important;font-size:12px!important;font-weight:500!important;border:1px solid var(--border)!important;background:transparent!important;color:var(--muted)!important;cursor:pointer!important;font-family:'DM Sans',sans-serif!important;text-align:center!important;transition:all .15s!important; }


#sga-app .sga-day-block { margin-bottom:6px!important; }
#sga-app .sga-day-block.hidden { display:none!important; }
#sga-app .sga-day-label { font-size:10px!important;font-weight:600!important;text-transform:uppercase!important;letter-spacing:.10em!important;color:var(--muted)!important;padding:10px 0 5px!important;border-top:1px solid var(--border)!important;margin-top:3px!important; }
#sga-app .sga-day-block:first-child .sga-day-label { border-top:none!important;margin-top:0!important; }
#sga-app .sga-event-row { display:flex!important;align-items:flex-start!important;gap:10px!important;padding:11px 12px!important;border-radius:0!important;background:var(--card)!important;border:1px solid var(--border)!important;margin-bottom:7px!important;box-shadow:0 1px 3px var(--shadow)!important;transition:background .15s!important; }
#sga-app .sga-event-row:hover { background:var(--card-h)!important; }
#sga-app .sga-event-row.hidden { display:none!important; }
#sga-app .sga-event-time { font-size:13px!important;font-weight:700!important;color:var(--accent)!important;min-width:40px!important;flex-shrink:0!important;padding-top:1px!important; }
#sga-app .sga-event-icon {
  font-size:18px!important;flex-shrink:0!important;filter:none!important;opacity:1!important;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important;
  font-style:normal!important;-webkit-text-fill-color:initial!important;
}
#sga-app .sga-event-body { flex:1!important;min-width:0!important; }
#sga-app .sga-event-title { font-size:13px!important;font-weight:600!important;color:var(--text)!important;margin-bottom:2px!important; }
#sga-app .sga-event-loc { font-size:11px!important;color:var(--muted)!important;margin-bottom:3px!important; }
#sga-app .sga-event-desc { font-size:11px!important;color:var(--muted)!important;line-height:1.5!important;margin-bottom:5px!important; }
#sga-app .sga-event-tags { display:flex!important;gap:4px!important;flex-wrap:wrap!important; }
#sga-app .sga-events-empty { text-align:center!important;padding:28px 16px!important;color:var(--muted)!important;font-size:13px!important;border:1px dashed var(--border)!important;border-radius:0!important; }

/* ── FOOTER ───────────────────────────────────────────────── */
#sga-app .sga-footer { border-top:1px solid var(--border)!important;padding:22px 16px 36px!important;text-align:center!important;background:transparent!important; }
#sga-app .sga-footer-logo { font-size:16px!important;font-weight:700!important;letter-spacing:.1em!important;text-transform:uppercase!important;color:var(--muted)!important;margin-bottom:6px!important;display:block!important; }
#sga-app .sga-footer p { font-size:11px!important;color:var(--muted)!important;line-height:1.7!important; }
#sga-app .sga-footer a { color:var(--muted)!important; }

/* ── ELEMENTOR WRAPPERS ───────────────────────────────────── */
.elementor-widget-html .elementor-widget-container { padding:0!important;margin:0!important; }
.elementor-widget-html .elementor-column-wrap,
.elementor-widget-html .elementor-widget-wrap { padding:0!important; }
.elementor-widget-html #sga-app { width:100%!important;max-width:100%!important;margin:0!important; }
@media(min-width:768px){ .elementor-widget-html #sga-app { max-width:480px!important;margin:0 auto!important; } }

/* ── LIGHT OVERRIDES ──────────────────────────────────────── */












/* ── ANIMATIONS ───────────────────────────────────────────── */
@keyframes sga-up { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)} }
#sga-app .sga-hero  { animation:sga-up .4s ease both; }
#sga-app .sga-card  { animation:sga-up .35s ease both; }
#sga-app .sga-card:nth-child(2){ animation-delay:.04s; }
#sga-app .sga-card:nth-child(3){ animation-delay:.08s; }
#sga-app .sga-card:nth-child(4){ animation-delay:.12s; }

/* ── NO-ICONS MODE (admin toggle) ─────────────────────────── */
#sga-app.sga-no-icons .sga-card-icon { display:none!important; }
#sga-app.sga-no-icons .sga-card-top { padding:14px 16px 10px!important; }
#sga-app.sga-no-icons .sga-feat-icon { display:none!important; }
#sga-app.sga-no-icons .sga-event-icon { display:none!important; }
#sga-app.sga-no-icons .sga-wifi-icon { display:none!important; }
#sga-app.sga-no-icons .sga-emergency-icon { display:none!important; }
#sga-app.sga-no-icons .sga-tile-icon { display:none!important; }
#sga-app.sga-no-icons .sga-tile { padding:12px!important; }
#sga-app.sga-no-icons .sga-detail-icon { display:none!important; }
#sga-app.sga-no-icons .sga-detail-row { padding-left:4px!important; }



/* Dark mode: hide light logo, show dark logo if it exists */



/* Dark mode: if only one logo exists (no dark version), auto-invert it */

/* Light mode: no filter needed */


/* ── VENUE IMAGE ──────────────────────────────────────────── */
#sga-app .sga-card-image {
  width:100%!important;
  overflow:hidden!important;
  max-height:180px!important;
  border-top:1px solid var(--border)!important;
}
#sga-app .sga-venue-img {
  width:100%!important;
  height:180px!important;
  object-fit:cover!important;
  display:block!important;
  filter:none!important;
  opacity:1!important;
  transition:transform .3s!important;
}
#sga-app .sga-card:hover .sga-venue-img { transform:scale(1.03)!important; }

/* ── PUSH NOTIFICATION BUTTON ─────────────────────────────── */
#sga-app .sga-push-btn {
  margin-top:14px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:7px 16px!important;
  border-radius:0!important;
  font-size:11px!important;
  font-weight:600!important;
  letter-spacing:.04em!important;
  cursor:pointer!important;
  transition:all .2s!important;
  font-family:'DM Sans',sans-serif!important;
  border:1px solid rgba(0,0,0,0.12)!important;
  background:rgba(0,0,0,0.05)!important;
  color:#636b7e!important;
}
#sga-app .sga-push-btn::before { content:'🔔'; font-size:12px; }
#sga-app .sga-push-btn.sga-push-on {
  background:rgba(47,63,115,0.10)!important;
  border-color:rgba(47,63,115,0.25)!important;
  color:#2F3F73!important;
}
#sga-app .sga-push-btn.sga-push-on::before { content:'🔔'; }



/* ── ACCORDION SECTIONS ───────────────────────────────────── */
#sga-app .sga-acc-header {
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  padding:16px 18px!important;
  background:var(--card)!important;
  border:1px solid var(--border)!important;
  border-radius:0!important;
  cursor:pointer!important;
  font-family:'DM Sans',sans-serif!important;
  transition:background .15s,border-color .15s!important;
  margin-bottom:0!important;
  text-align:left!important;
  box-shadow:0 1px 4px var(--shadow)!important;
}
#sga-app .sga-acc-header:hover {
  background:var(--card-h)!important;
  border-color:var(--border2)!important;
}
#sga-app .sga-acc-header.sga-acc-open {
  background:var(--card-h)!important;
  border-color:#2F3F73!important;
  
}
#sga-app .sga-acc-header .sga-sec-title {
  font-size:13px!important;
  font-weight:600!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  color:var(--text)!important;
}
#sga-app .sga-acc-arrow {
  font-size:18px!important;
  color:var(--muted)!important;
  transition:transform .25s!important;
  line-height:1!important;
  display:inline-block!important;
  flex-shrink:0!important;
}
#sga-app .sga-acc-header.sga-acc-open .sga-acc-arrow {
  transform:rotate(180deg)!important;
}
#sga-app .sga-acc-body {
  border:1px solid #2F3F73!important;
  border-top:none!important;
  padding:14px 6px 6px!important;
  background:var(--bg)!important;
}

/* Section padding adjust for accordion */
#sga-app .sga-accordion { padding-bottom:6px!important; }

/* ── HERO CONTROLS ROW ────────────────────────────────────── */
#sga-app .sga-hero-controls {
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
}

/* ── LANGUAGE SWITCHER ────────────────────────────────────── */
#sga-app .sga-lang-switcher {
  position:relative!important;
  display:inline-block!important;
}
#sga-app .sga-lang-btn {
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:5px 12px 5px 10px!important;
  border-radius:100px!important;
  font-size:11px!important;
  font-weight:600!important;
  cursor:pointer!important;
  font-family:'DM Sans',sans-serif!important;
  transition:background .2s!important;
  border:1px solid rgba(0,0,0,0.10)!important;
  background:rgba(0,0,0,0.05)!important;
  color:#636b7e!important;
}

#sga-app .sga-lang-btn:hover,
#sga-app .sga-lang-btn-open {
  background:rgba(47,63,115,0.12)!important;
  border-color:rgba(47,63,115,0.30)!important;
  color:#2F3F73!important;
}

#sga-app .sga-lang-flag { font-size:14px!important;line-height:1!important; }
#sga-app .sga-lang-current { font-size:11px!important;font-weight:700!important;letter-spacing:.05em!important; }
#sga-app .sga-lang-caret { font-size:14px!important;color:inherit!important;opacity:.7!important; }

/* Dropdown menu */
#sga-app .sga-lang-menu {
  position:absolute!important;
  top:calc(100% + 6px)!important;
  right:0!important;
  background:#ffffff!important;
  border:1px solid rgba(0,0,0,0.10)!important;
  border-radius:0!important;
  box-shadow:0 8px 24px rgba(0,0,0,0.14)!important;
  overflow:hidden!important;
  min-width:170px!important;
  z-index:999999!important;
}

#sga-app .sga-lang-menu button {
  display:block!important;
  width:100%!important;
  padding:9px 16px!important;
  text-align:left!important;
  font-size:13px!important;
  font-weight:500!important;
  font-family:'DM Sans',sans-serif!important;
  cursor:pointer!important;
  border:none!important;
  background:transparent!important;
  color:#1f2533!important;
  transition:background .12s!important;
}

#sga-app .sga-lang-menu button:hover { background:rgba(47,63,115,0.08)!important; }

#sga-app .sga-lang-menu button.sga-lang-active {
  background:rgba(47,63,115,0.10)!important;
  color:#2F3F73!important;
  font-weight:700!important;
}


/* ── ADD TO HOME SCREEN BANNER ────────────────────────────── */
#sga-app .sga-a2hs {
  position:fixed!important;
  bottom:16px!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:calc(100% - 32px)!important;
  max-width:440px!important;
  background:#2F3F73!important;
  border-radius:0!important;
  padding:14px 14px 14px 16px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  box-shadow:0 8px 32px rgba(0,0,0,0.35)!important;
  z-index:9999999!important;
  animation:sga-up .35s ease both!important;
}
#sga-app .sga-a2hs-icon {
  font-size:28px!important;
  flex-shrink:0!important;
  filter:none!important;
  opacity:1!important;
}
#sga-app .sga-a2hs-text { flex:1!important;min-width:0!important; }
#sga-app .sga-a2hs-title {
  font-size:13px!important;
  font-weight:700!important;
  color:#ffffff!important;
  margin-bottom:2px!important;
}
#sga-app .sga-a2hs-sub {
  font-size:11px!important;
  color:rgba(255,255,255,0.65)!important;
}
#sga-app .sga-a2hs-btn {
  flex-shrink:0!important;
  padding:7px 18px!important;
  border-radius:0!important;
  font-size:12px!important;
  font-weight:700!important;
  background:#ffffff!important;
  color:#2F3F73!important;
  border:none!important;
  cursor:pointer!important;
  font-family:'DM Sans',sans-serif!important;
  transition:opacity .15s!important;
}
#sga-app .sga-a2hs-btn:hover { opacity:.88!important; }
#sga-app .sga-a2hs-close {
  flex-shrink:0!important;
  width:24px!important;
  height:24px!important;
  border-radius:0!important;
  background:rgba(255,255,255,0.15)!important;
  border:none!important;
  color:#ffffff!important;
  font-size:12px!important;
  cursor:pointer!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-family:'DM Sans',sans-serif!important;
}
#sga-app .sga-a2hs-close:hover { background:rgba(255,255,255,0.25)!important; }

/* iOS tip — bottom bar with arrow pointing to Share button */
#sga-app .sga-ios-tip {
  position:fixed!important;
  bottom:0!important;
  left:50%!important;
  transform:translateX(-50%)!important;
  width:calc(100% - 0px)!important;
  max-width:480px!important;
  background:#2F3F73!important;
  z-index:9999999!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  animation:sga-up .3s ease both!important;
}
#sga-app .sga-ios-tip-inner {
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:14px 16px!important;
  font-size:13px!important;
  color:#ffffff!important;
  width:100%!important;
  justify-content:center!important;
}
#sga-app .sga-ios-share {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:24px!important;
  height:24px!important;
  border-radius:0!important;
  background:rgba(255,255,255,0.20)!important;
  font-size:14px!important;
}
#sga-app .sga-ios-tip strong { color:#ffffff!important; }
#sga-app .sga-ios-tip .sga-a2hs-close {
  position:absolute!important;
  right:12px!important;
  top:50%!important;
  transform:translateY(-50%)!important;
}
#sga-app .sga-ios-tip-arrow {
  width:0!important;
  height:0!important;
  border-left:10px solid transparent!important;
  border-right:10px solid transparent!important;
  border-top:10px solid #2F3F73!important;
  margin-bottom:0!important;
}