/*
 * Stage 1 of docs/design-unification-plan.md: colors on tokens.
 * Accepted by the owner on 2026-10-24 and loaded on every page
 * (templates/element/ui/next_styles.php).
 *
 * Most colors already resolve to --h24-* through var() fallbacks in the site
 * stylesheets. This layer covers colors that come from Bootstrap and from
 * component variables. The widget (#hr24AppBox) keeps its own color themes and
 * is excluded from every rule here. Cabinets (body.body-admin) are stage 6/7.
 */

/* Body text on public pages and in «Мой Храм24». */
html:root body:not(.body-admin):not(.h24-site) {
  color: var(--h24-color-text);
}

/* Primary action: Bootstrap primary/info and the gray submit buttons of the
   login, registration and profile forms. */
html:root body:not(.body-admin):not(.h24-site) :is(.btn-primary, .btn-info, button[type="submit"].btn-secondary):not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-primary);
  border-color: var(--h24-color-primary);
  color: var(--h24-color-on-primary);
}

html:root body:not(.body-admin):not(.h24-site) :is(.btn-primary, .btn-info, button[type="submit"].btn-secondary):not(:where(#hr24AppBox *)):is(:hover, :active) {
  background-color: var(--h24-color-primary-hover);
  border-color: var(--h24-color-primary-hover);
  color: var(--h24-color-on-primary);
}

/* Secondary actions. */
html:root body:not(.body-admin):not(.h24-site) :is(.btn-outline-primary, .btn-outline-info):not(:where(#hr24AppBox *)) {
  background-color: transparent;
  border-color: var(--h24-color-primary);
  color: var(--h24-color-link);
}

html:root body:not(.body-admin):not(.h24-site) :is(.btn-outline-primary, .btn-outline-info):not(:where(#hr24AppBox *)):is(:hover, :active) {
  background-color: var(--h24-color-primary-container);
  border-color: var(--h24-color-primary);
  color: var(--h24-color-on-primary-container);
}

html:root body:not(.body-admin):not(.h24-site) .btn-outline-secondary:not(:where(#hr24AppBox *)) {
  background-color: transparent;
  border-color: var(--h24-color-border-strong);
  color: var(--h24-color-text);
}

html:root body:not(.body-admin):not(.h24-site) .btn-outline-secondary:not(:where(#hr24AppBox *)):is(:hover, :active) {
  background-color: var(--h24-color-surface-sunken);
  color: var(--h24-color-text);
}

/* Destructive actions stay quiet until hovered. */
html:root body:not(.body-admin):not(.h24-site) .btn-outline-danger:not(:where(#hr24AppBox *)) {
  background-color: transparent;
  border-color: var(--h24-color-danger);
  color: var(--h24-color-danger);
}

html:root body:not(.body-admin):not(.h24-site) .btn-outline-danger:not(:where(#hr24AppBox *)):is(:hover, :active) {
  background-color: var(--h24-color-danger-container);
  color: var(--h24-color-on-danger-container);
}

html:root body:not(.body-admin):not(.h24-site) :is(.btn-primary, .btn-info, .btn-secondary, .btn-outline-primary, .btn-outline-info, .btn-outline-secondary, .btn-outline-danger):not(:where(#hr24AppBox *)):focus-visible {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--h24-color-focus) 45%, transparent);
  outline: none;
}

/* Bootstrap text utilities used for links and hints. */
html:root body:not(.body-admin):not(.h24-site) .text-info:not(:where(#hr24AppBox *)) {
  color: var(--h24-color-link) !important;
}

html:root body:not(.body-admin):not(.h24-site) .text-muted:not(:where(#hr24AppBox *)) {
  color: var(--h24-color-text-muted) !important;
}

/* «Мои близкие»: one accent for actions, names in text color in both themes. */
html:root .synodic-shell {
  --synodic-accent: var(--h24-color-primary);
  --synodic-action: var(--h24-color-text-muted);
  --synodic-line: var(--h24-color-border);
  --synodic-hover: var(--h24-color-surface-sunken);
}

html:root .synodic-shell .synodic-entry__name {
  color: var(--h24-color-text);
}

html:root .synodic-shell :is(.synodic-add, .synodic-edit__form) .btn-primary {
  color: var(--h24-color-on-primary);
}

html:root .synodic-shell .synodic-action--delete {
  color: var(--h24-color-danger);
}

/* Breadcrumb current item: Bootstrap gray is below AA on the light chip. */
html:root body:not(.body-admin):not(.h24-site) .breadcrumb-item.active:not(:where(#hr24AppBox *)) {
  color: var(--h24-color-text-muted);
}

/* Bootstrap badges: white on light teal or green is below AA. */
html:root body:not(.body-admin):not(.h24-site) .badge-info:not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-primary-container);
  color: var(--h24-color-on-primary-container);
}

html:root body:not(.body-admin):not(.h24-site) .badge-success:not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-success-container);
  color: var(--h24-color-on-success-container);
}

/* Bootstrap alerts on public pages follow the tokens in both themes. */
html:root body:not(.body-admin):not(.h24-site) .alert-info:not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-primary-container);
  border-color: var(--h24-color-primary-container);
  color: var(--h24-color-on-primary-container);
}

html:root body:not(.body-admin):not(.h24-site) .alert-warning:not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-warning-container);
  border-color: var(--h24-color-warning-container);
  color: var(--h24-color-on-warning-container);
}

html:root body:not(.body-admin):not(.h24-site) .alert-success:not(:where(#hr24AppBox *)) {
  background-color: var(--h24-color-success-container);
  border-color: var(--h24-color-success-container);
  color: var(--h24-color-on-success-container);
}

html:root body:not(.body-admin):not(.h24-site) :is(.alert-info, .alert-warning, .alert-success):not(:where(#hr24AppBox *)) a {
  color: inherit;
  text-decoration: underline;
}