/*
  Holmogorka SPPB Addon Core.
  Shared color tokens and small UI primitives for addons.
*/

:root,
body.site,
.com-sppagebuilder,
#sp-page-builder {
  --hm-core-primary: #6a2c91;
  --hm-core-primary-dark: #4e1f6b;
  --hm-core-primary-light: #8c4bb8;
  --hm-core-primary-soft: #f1e8f7;
  --hm-core-secondary: #0fa958;
  --hm-core-secondary-dark: #0a7a3f;
  --hm-core-secondary-light: #39c777;
  --hm-core-secondary-soft: #e7f8ef;
  --hm-core-info: #0665d0;
  --hm-core-info-dark: #044a99;
  --hm-core-info-soft: #e1effe;
  --hm-core-warning: #f3b760;
  --hm-core-warning-dark: #b86e16;
  --hm-core-warning-soft: #fff4e3;
  --hm-core-danger: #e04f1a;
  --hm-core-danger-dark: #9f3410;
  --hm-core-danger-soft: #fde9e2;
  --hm-core-dark: #2c2340;
  --hm-core-dark-2: #4e1f6b;
  --hm-core-surface: #ffffff;
  --hm-core-surface-soft: #f7f4fb;
  --hm-core-border: #e7dff0;
  --hm-core-text: #2f2940;
  --hm-core-muted: #6f6784;
  --hm-core-radius: 22px;
  --hm-core-radius-sm: 8px;
  --hm-core-radius-md: 16px;
  --hm-core-button-radius: 14px;
  --hm-core-shadow: 0 16px 34px rgba(78, 31, 107, .08);
  --hm-core-shadow-soft: 0 12px 28px rgba(33, 37, 41, .06);
}

.hm-ui {
  --hm-ui-accent: var(--hm-core-primary);
  --hm-ui-accent-dark: var(--hm-core-primary-dark);
  --hm-ui-accent-light: var(--hm-core-primary-light);
  --hm-ui-accent-soft: var(--hm-core-primary-soft);
  --hm-ui-accent-text: #ffffff;
  --hm-ui-surface: var(--hm-core-surface);
  --hm-ui-surface-soft: var(--hm-core-surface-soft);
  --hm-ui-text: var(--hm-core-text);
  --hm-ui-muted: var(--hm-core-muted);
  --hm-ui-border: var(--hm-core-border);
  --hm-ui-shadow: var(--hm-core-shadow);
  --hm-ui-radius: var(--hm-core-radius);
  --hm-ui-button-radius: var(--hm-core-button-radius);
  color: var(--hm-ui-text);
}

.hm-ui-theme-brand,
.hm-ui-theme-holmo_primary {
  --hm-ui-accent: var(--hm-core-primary);
  --hm-ui-accent-dark: var(--hm-core-primary-dark);
  --hm-ui-accent-light: var(--hm-core-primary-light);
  --hm-ui-accent-soft: var(--hm-core-primary-soft);
  --hm-ui-border: #eadff2;
  --hm-ui-shadow: 0 16px 34px rgba(78, 31, 107, .08);
}

.hm-ui-theme-glass,
.hm-ui-theme-holmo_glass,
.hm-ui-theme-soft,
.hm-ui-theme-holmo_soft {
  --hm-ui-accent: var(--hm-core-primary);
  --hm-ui-accent-dark: var(--hm-core-primary-dark);
  --hm-ui-accent-light: var(--hm-core-primary-light);
  --hm-ui-accent-soft: var(--hm-core-primary-soft);
  --hm-ui-surface: rgba(255, 255, 255, .92);
  --hm-ui-surface-soft: #faf6fd;
  --hm-ui-border: #e7dff0;
}

.hm-ui-theme-success,
.hm-ui-theme-secondary,
.hm-ui-theme-green,
.hm-ui-theme-holmo_secondary {
  --hm-ui-accent: var(--hm-core-secondary);
  --hm-ui-accent-dark: var(--hm-core-secondary-dark);
  --hm-ui-accent-light: var(--hm-core-secondary-light);
  --hm-ui-accent-soft: var(--hm-core-secondary-soft);
  --hm-ui-border: #d9f0e3;
  --hm-ui-shadow: 0 16px 34px rgba(15, 169, 88, .08);
}

.hm-ui-theme-info,
.hm-ui-theme-oneui,
.hm-ui-theme-oneui_info {
  --hm-ui-accent: var(--hm-core-info);
  --hm-ui-accent-dark: var(--hm-core-info-dark);
  --hm-ui-accent-light: #2e7dd1;
  --hm-ui-accent-soft: var(--hm-core-info-soft);
  --hm-ui-border: #e1e7ef;
  --hm-ui-shadow: var(--hm-core-shadow-soft);
}

.hm-ui-theme-warning {
  --hm-ui-accent: var(--hm-core-warning);
  --hm-ui-accent-dark: var(--hm-core-warning-dark);
  --hm-ui-accent-light: #f7ca84;
  --hm-ui-accent-soft: var(--hm-core-warning-soft);
  --hm-ui-accent-text: #2f2940;
  --hm-ui-border: #fae4c0;
  --hm-ui-shadow: 0 12px 28px rgba(243, 183, 96, .12);
}

.hm-ui-theme-danger {
  --hm-ui-accent: var(--hm-core-danger);
  --hm-ui-accent-dark: var(--hm-core-danger-dark);
  --hm-ui-accent-light: #f07143;
  --hm-ui-accent-soft: var(--hm-core-danger-soft);
  --hm-ui-border: #f7d2c6;
  --hm-ui-shadow: 0 12px 28px rgba(224, 79, 26, .10);
}

.hm-ui-theme-dark,
.hm-ui-theme-holmo_dark {
  --hm-ui-accent: #ffffff;
  --hm-ui-accent-dark: #ffffff;
  --hm-ui-accent-light: rgba(255, 255, 255, .82);
  --hm-ui-accent-soft: rgba(255, 255, 255, .13);
  --hm-ui-accent-text: var(--hm-core-primary-dark);
  --hm-ui-surface: linear-gradient(135deg, var(--hm-core-dark) 0%, var(--hm-core-dark-2) 100%);
  --hm-ui-surface-soft: rgba(255, 255, 255, .10);
  --hm-ui-text: #ffffff;
  --hm-ui-muted: rgba(255, 255, 255, .76);
  --hm-ui-border: rgba(255, 255, 255, .12);
  --hm-ui-shadow: 0 18px 42px rgba(17, 10, 26, .34);
}

.hm-ui-theme-light {
  --hm-ui-accent: var(--hm-core-info);
  --hm-ui-accent-dark: var(--hm-core-info-dark);
  --hm-ui-accent-soft: #eef2f7;
  --hm-ui-surface: #f8f9fa;
  --hm-ui-surface-soft: #ffffff;
  --hm-ui-border: #e9ecef;
  --hm-ui-shadow: none;
}

.hm-ui-theme-custom {
  color: var(--hm-ui-text);
}

.hm-announcement-bar.hm-ui,
.hm-announcement-slider.hm-ui {
  --hm-ab-accent: var(--hm-ui-accent);
  --hm-ab-accent-soft: var(--hm-ui-accent-soft);
  --hm-ab-label-bg: var(--hm-ui-accent-soft);
  --hm-ab-panel: var(--hm-ui-surface);
  --hm-ab-text: var(--hm-ui-text);
  --hm-ab-muted: var(--hm-ui-muted);
  --hm-ab-border: var(--hm-ui-border);
  --hm-ab-shadow: var(--hm-ui-shadow);
  --hm-as-accent: var(--hm-ui-accent);
  --hm-as-soft: var(--hm-ui-accent-soft);
  --hm-as-label-bg: var(--hm-ui-accent-soft);
  --hm-as-panel: var(--hm-ui-surface);
  --hm-as-text: var(--hm-ui-text);
  --hm-as-muted: var(--hm-ui-muted);
  --hm-as-border: var(--hm-ui-border);
  --hm-as-shadow: var(--hm-ui-shadow);
}

.hm-notice-card.hm-ui,
.hm-icon-heading.hm-ui,
.hm-icon-text-card.hm-ui,
.hm-promo-title-card.hm-ui {
  --hm-nc-bg: var(--hm-ui-surface);
  --hm-nc-title: var(--hm-ui-muted);
  --hm-nc-text: var(--hm-ui-text);
  --hm-nc-link: var(--hm-ui-accent);
  --hm-nc-border: var(--hm-ui-border);
  --hm-nc-shadow: var(--hm-ui-shadow);
  --hm-ih-bg: var(--hm-ui-surface);
  --hm-ih-color: var(--hm-ui-text);
  --hm-ih-border: var(--hm-ui-border);
  --hm-ih-shadow: var(--hm-ui-shadow);
  --hm-ih-icon-bg: var(--hm-ui-accent-soft);
  --hm-ih-icon-color: var(--hm-ui-accent);
  --hm-itc-bg: var(--hm-ui-surface);
  --hm-itc-color: var(--hm-ui-text);
  --hm-itc-muted: var(--hm-ui-muted);
  --hm-itc-link: var(--hm-ui-accent);
  --hm-itc-border: var(--hm-ui-border);
  --hm-itc-shadow: var(--hm-ui-shadow);
  --hm-itc-icon-bg: var(--hm-ui-accent-soft);
  --hm-itc-icon-color: var(--hm-ui-accent);
  --hm-itc-badge-bg: var(--hm-ui-accent);
  --hm-itc-badge-color: var(--hm-ui-accent-text);
  --hm-ptc-bg: var(--hm-ui-surface);
  --hm-ptc-color: var(--hm-ui-text);
  --hm-ptc-border: var(--hm-ui-border);
  --hm-ptc-shadow: var(--hm-ui-shadow);
  --hm-ptc-badge-bg: var(--hm-ui-accent);
  --hm-ptc-badge-color: var(--hm-ui-accent-text);
}

.hm-process-steps.hm-ui {
  --hm-ps-bg: var(--hm-ui-surface);
  --hm-ps-text: var(--hm-ui-text);
  --hm-ps-muted: var(--hm-ui-muted);
  --hm-ps-accent: var(--hm-ui-accent);
  --hm-ps-accent-text: var(--hm-ui-accent-text);
  --hm-ps-soft: var(--hm-ui-accent-soft);
  --hm-ps-border: var(--hm-ui-border);
  --hm-ps-shadow: var(--hm-ui-shadow);
  --hm-ps-success-bg: var(--hm-core-secondary-soft);
  --hm-ps-success: var(--hm-core-secondary);
  --hm-ps-connector: var(--hm-ui-border);
}

.hm-section-menu.hm-ui {
  --hm-sm-bg: var(--hm-ui-surface);
  --hm-sm-mobile-bg: var(--hm-ui-surface);
  --hm-sm-sheet-bg: var(--hm-ui-surface);
  --hm-sm-text: var(--hm-ui-text);
  --hm-sm-active: var(--hm-ui-accent);
  --hm-sm-border: var(--hm-ui-border);
  --hm-sm-shadow: var(--hm-ui-shadow);
  --hm-sm-badge-bg: var(--hm-ui-accent-soft);
  --hm-sm-badge-text: var(--hm-ui-accent-dark);
}

.hm-dfcat.hm-ui,
.hm-struct-tree.hm-ui,
.hk-director-block.hm-ui {
  --hm-dfcat-bg: var(--hm-ui-surface);
  --hm-dfcat-bg2: var(--hm-ui-surface-soft);
  --hm-dfcat-border: var(--hm-ui-border);
  --hm-dfcat-text: var(--hm-ui-text);
  --hm-dfcat-muted: var(--hm-ui-muted);
  --hm-dfcat-primary: var(--hm-ui-accent);
  --hm-dfcat-shadow: var(--hm-ui-shadow);
  --hm-primary: var(--hm-ui-accent);
  --hm-primary-dark: var(--hm-ui-accent-dark);
  --hm-secondary: var(--hm-core-secondary);
  --hm-secondary-dark: var(--hm-core-secondary-dark);
  --hm-blue: var(--hm-core-info);
  --hm-surface: var(--hm-ui-surface);
  --hm-surface-2: var(--hm-ui-surface-soft);
  --hm-border: var(--hm-ui-border);
  --hm-text: var(--hm-ui-text);
  --hm-muted: var(--hm-ui-muted);
  --hm-shadow: var(--hm-ui-shadow);
  --hk-primary: var(--hm-ui-accent);
  --hk-primary-dark: var(--hm-ui-accent-dark);
  --hk-primary-light: var(--hm-ui-accent-light);
  --hk-border: var(--hm-ui-border);
  --hk-text: var(--hm-ui-text);
  --hk-muted: var(--hm-ui-muted);
  --hk-bg: var(--hm-ui-surface);
  --hk-bg-soft: var(--hm-ui-surface-soft);
  --hk-shadow: var(--hm-ui-shadow);
}

.hm-ui-card {
  color: var(--hm-ui-text);
  background: var(--hm-ui-surface);
  border: 1px solid var(--hm-ui-border);
  border-radius: var(--hm-ui-radius);
  box-shadow: var(--hm-ui-shadow);
}

.hm-ui-card-soft {
  color: var(--hm-ui-text);
  background: var(--hm-ui-surface-soft);
  border: 1px solid var(--hm-ui-border);
  border-radius: var(--hm-ui-radius);
}

.hm-ui-accent-edge {
  position: relative;
  overflow: hidden;
}

.hm-ui-accent-edge::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--hm-ui-accent);
}

.hm-ui-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--hm-ui-icon-size, 42px);
  height: var(--hm-ui-icon-size, 42px);
  color: var(--hm-ui-accent);
  background: var(--hm-ui-accent-soft);
  border: 1px solid var(--hm-ui-icon-border, transparent);
  border-radius: var(--hm-ui-radius-sm);
  flex: 0 0 auto;
}

.hm-ui-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 4px 9px;
  color: var(--hm-ui-accent);
  background: var(--hm-ui-accent-soft);
  border: 1px solid var(--hm-ui-badge-border, transparent);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.hm-ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 14px;
  color: var(--hm-ui-accent-text) !important;
  background: var(--hm-ui-accent);
  border: 1px solid var(--hm-ui-button-border, transparent);
  border-radius: var(--hm-ui-button-radius);
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
}

.hm-ui-button:hover,
.hm-ui-button:focus {
  color: var(--hm-ui-accent-text) !important;
  text-decoration: none;
}

.hm-ui-button-outline {
  color: var(--hm-ui-accent) !important;
  background: transparent;
  border-color: currentColor;
}

.hm-ui-button-soft {
  color: var(--hm-ui-accent) !important;
  background: var(--hm-ui-accent-soft);
  border-color: transparent;
}

.hm-ui .btn,
.hm-ui .sppb-btn,
.hm-ui .hm-ui-button,
.hm-ui [class$="__button"],
.hm-ui [class*="__button "],
.hm-ui [class*="__button--"],
.hm-ui [class$="-btn"],
.hm-ui [class*="-btn "],
.hm-ui [class*="-btn--"],
.hm-ui .downloadlink,
.hm-ui .openlink,
.hm-ui .download-all,
.hm-ui .openlink-manage-files {
  border-radius: var(--hm-ui-button-radius) !important;
}

.hm-ui-title {
  color: var(--hm-ui-text);
}

.hm-ui-muted {
  color: var(--hm-ui-muted);
}

.hm-ui-link {
  color: var(--hm-ui-accent);
}

.hm-ui-link:hover,
.hm-ui-link:focus {
  color: var(--hm-ui-accent-dark);
}