/* HOLIUS Theme Role System — STRICT SEMANTIC MAPPING
   Every theme uses the same color role rules. No per-theme layout/color exceptions.

   bg-primary         = page/header/footer background
   bg-surface         = cards/panels/modals/search/input surfaces
   text-main          = primary text
   text-sub           = secondary/meta text
   brand-accent       = primary actions/active states
   brand-accent-hover = action hover
   border-color       = borders/dividers
   shadow-style       = elevation/shadows
*/

:root{
  --semantic-success:#218A4A;
  --semantic-danger:#B42318;
  --semantic-warning:#9A6700;
  --semantic-info:#2563EB;
  --overlay-color:#000000;
  --theme-overlay:color-mix(in srgb,var(--overlay-color) 42%,transparent);
  --theme-highlight-bg:color-mix(in srgb,var(--brand-accent) 24%,var(--bg-surface));
  --theme-highlight-text:var(--text-main);
  --shadow-color:var(--text-main);
  --theme-success-soft:color-mix(in srgb,var(--semantic-success) 11%,var(--bg-surface));
  --theme-danger-soft:color-mix(in srgb,var(--semantic-danger) 9%,var(--bg-surface));
  --theme-warning-soft:color-mix(in srgb,var(--semantic-warning) 12%,var(--bg-surface));
  --theme-info-soft:color-mix(in srgb,var(--semantic-info) 10%,var(--bg-surface));
}

/* Canonical aliases: old code inherits the same semantic roles. */
html{
  --theme-bg:var(--bg-primary);
  --theme-surface:var(--bg-surface);
  --theme-text:var(--text-main);
  --theme-muted:var(--text-sub);
  --theme-accent:var(--brand-accent);
  --theme-accent-hover:var(--brand-accent-hover);
  --theme-border:var(--border-color);
  --theme-shadow:var(--shadow-style);
  --theme-input:var(--bg-surface);
  --theme-header:var(--bg-primary);
  --theme-header-text:var(--text-main);
  --theme-header-hover:var(--bg-surface);

  --bg:var(--bg-primary);
  --surface:var(--bg-surface);
  --surface-2:var(--bg-surface);
  --text:var(--text-main);
  --muted:var(--text-sub);
  --line:var(--border-color);
  --border:var(--border-color);
  --primary:var(--brand-accent);
  --primary2:var(--brand-accent-hover);
  --accent:var(--brand-accent);
  --accent-soft:var(--bg-surface);
  --shadow:var(--shadow-style);
  --danger:var(--semantic-danger);
}

html,body{background:var(--bg-primary)!important;color:var(--text-main)!important}
body,button,input,textarea,select{font-family:var(--font-family)}

/* Page regions are not cards: they keep the page background. */
main,.minimal-home,.home-news-section,.page-hero,.section,.site-footer{
  background-color:transparent!important;
  color:var(--text-main)!important;
}
.site-header,.hh-global-header,.site-footer{
  background:var(--bg-primary)!important;
  color:var(--text-main)!important;
  border-color:var(--border-color)!important;
}

/* Primary and secondary typography. */
body,h1,h2,h3,h4,h5,h6,.title,.section-title,.holius-home-wordmark{color:var(--text-main)!important}
.meta,.text-sub,.copyright,.footer-grid p,.footer-links,.section-head p,.minimal-home-subtitle,
.news-meta,.news-source,.help-text,.form-help,.muted{color:var(--text-sub)!important}

/* Surface role: every card/panel/modal/search field uses bg-surface. */
.card,.form-card,.account-card,.theme-picker-dialog,.hh-apps-panel,
.menu-open .main-nav,.menu-open .account-nav,.search-shell,.search-form,.search-box,
.minimal-search,.bible-search-shell,.church-search-form,.job-search-form,
[data-search-overlay] form,.home-chat-form,.home-chat-login,.home-chat-messages,
.qr-preview,.modal,.dialog,.panel,.dropdown-menu,.input-readonly{
  background:var(--bg-surface)!important;
  color:var(--text-main)!important;
  border-color:var(--border-color)!important;
  box-shadow:var(--shadow-style);
}

/* Inputs use the same surface token in every theme. */
.input,.textarea,.select,
input[type="text"],input[type="search"],input[type="email"],input[type="password"],
input[type="url"],input[type="number"],textarea,select{
  background:var(--bg-surface)!important;
  color:var(--text-main)!important;
  border-color:var(--border-color)!important;
}
input::placeholder,textarea::placeholder{color:var(--text-sub)!important;opacity:.8}
.input:focus,.textarea:focus,.select:focus,input:focus,textarea:focus,select:focus{
  border-color:var(--brand-accent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-accent) 16%,transparent)!important;
}

/* Action role: accent is used only for primary actions/active states. */
.btn:not(.btn-light):not(.btn-soft):not(.btn-danger),.btn-primary,
button[type="submit"]:not(.search-icon-button):not(.bible-search-icon):not(.minimal-search-button):not(.search-icon-submit):not(.minimal-search-submit):not(.search-overlay-submit):not(.bible-direct-submit),
.filter-tab.active,.theme-choice.is-active{
  background:var(--brand-accent)!important;
  border-color:var(--brand-accent)!important;
  color:var(--theme-accent-contrast)!important;
}
.btn:not(.btn-light):not(.btn-soft):not(.btn-danger):hover,.btn-primary:hover{
  background:var(--brand-accent-hover)!important;
  border-color:var(--brand-accent-hover)!important;
}
.btn-light,.btn-soft,.user-chip,.pill,.prayer-count,.badge,.quick-tags a,.filter-tab,.category-check span,.lang-switch{
  background:var(--bg-surface)!important;
  color:var(--text-main)!important;
  border-color:var(--border-color)!important;
}
.filter-tab:hover,.category-check input:focus-visible+span{
  color:var(--brand-accent)!important;
  border-color:var(--brand-accent)!important;
}
.category-check input:checked+span{
  color:var(--brand-accent)!important;
  background:var(--bg-surface)!important;
  border-color:var(--brand-accent)!important;
}

/* Search icon buttons are always transparent. */
.search-icon-button,.bible-search-icon,.minimal-search-button,.search-submit-icon,
.search-icon-submit,.minimal-search-submit,.search-overlay-submit,.bible-direct-submit,
button[aria-label*="검색"].search-icon-button{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:var(--theme-shadow-sm);
  color:var(--text-main)!important;
}

/* Header controls follow the same page text/surface rules. */
.hh-top-link,.hh-theme-top-button,.hh-menu-button,.hh-member-button{color:var(--text-main)!important}
.hh-top-link:hover,.hh-theme-top-button:hover,.hh-menu-button:hover,.hh-member-button:hover{
  background:var(--bg-surface)!important;
}

/* Chat/secondary blocks still use surface, not generated theme-specific colors. */
.chat-msg,.chat-msg.mine{background:var(--bg-surface)!important;color:var(--text-main)!important;border-color:var(--border-color)!important}

/* Links/active indicators. */
a:hover,.admin-link,.eyebrow,.bible-result strong{color:var(--brand-accent)}

/* Semantic statuses remain meaning-based and are not brand colors. */
.alert.success,.alert-success{
  background:color-mix(in srgb,var(--semantic-success) 11%,var(--bg-surface))!important;
  color:var(--semantic-success)!important;
  border-color:color-mix(in srgb,var(--semantic-success) 30%,var(--border-color))!important;
}
.alert.error,.alert-error{
  background:color-mix(in srgb,var(--semantic-danger) 9%,var(--bg-surface))!important;
  color:var(--semantic-danger)!important;
  border-color:color-mix(in srgb,var(--semantic-danger) 30%,var(--border-color))!important;
}
.btn-danger{background:var(--semantic-danger)!important;color:var(--bg-surface)!important;border-color:var(--semantic-danger)!important}

/* Preserve established search geometry. */
.minimal-search,.search-form,.search-box,.bible-search-shell,.church-search-form,.job-search-form,[data-search-overlay] form{
  border-radius:999px!important;
}

/* Intentional media canvas exception: video itself remains neutral dark. */
.media-video{background:#0d0f0d}
.play-badge{background:color-mix(in srgb,var(--overlay-color) 72%,transparent);color:var(--bg-surface)}
