/*
 * BeLYNC design tokens (centralised; additive — Core is never modified).
 *
 * SINGLE SOURCE OF TRUTH for colour. Custom apps must reference these CSS
 * custom properties (var(--belync-*)) instead of hard-coding hex values. The
 * values below are the defaults derived from the two brand colours
 * (#861F96 / #94A3B8) by middle_east_core/brand/tokens.py; at runtime,
 * boot_session re-injects --belync-primary/-secondary (and their derived
 * shades) from `BeLYNC Settings`, so changing the colours there restyles the
 * product without code changes.
 *
 * Accessibility: body text uses a dark slate (var(--belync-text)); the brand
 * secondary slate (#94A3B8) is NEVER used as body text on white (insufficient
 * contrast) — only for muted backgrounds, borders and large/secondary accents.
 * Contrast of every text/surface pairing is asserted in tests
 * (brand/tokens.py: audit_contrast).
 */

:root {
  --belync-primary: #861F96;
  --belync-secondary: #94A3B8;
  --belync-primary-action: #861F96;
  --belync-primary-hover: #761B84;
  --belync-primary-active: #691875;
  --belync-primary-contrast: #FFFFFF;
  --belync-focus-ring: rgba(134, 31, 150, 0.4);
  --belync-link: #861F96;
  --belync-link-hover: #761B84;
  --belync-selected-bg: #F0E4F2;
  --belync-active-nav-bg: #F3E9F4;
  --belync-active-nav-fg: #7B1D8A;
  --belync-badge-bg: #861F96;
  --belync-badge-fg: #FFFFFF;
  --belync-badge-muted-bg: #F0E4F2;
  --belync-badge-muted-fg: #791C87;
  --belync-page-bg: #F8FAFC;
  --belync-card-bg: #FFFFFF;
  --belync-muted-bg: #F1F5F9;
  --belync-border: #E2E8F0;
  --belync-border-strong: #CBD5E1;
  --belync-heading: #0F172A;
  --belync-text: #0F172A;
  --belync-text-secondary: #475569;
  --belync-text-muted: #64748B;
  --belync-text-on-primary: #FFFFFF;
  --belync-success: #16A34A;
  --belync-warning: #B45309;
  --belync-error: #DC2626;
  --belync-info: #2563EB;
}

/*
 * Restrained, opt-in helpers. We intentionally do NOT override Frappe/ERPNext
 * core component styles globally (that would be fragile across upgrades and
 * risks "excessive purple"). These classes are available to BeLYNC-owned
 * surfaces (print formats, onboarding, custom pages) that want the brand.
 */
.belync-brand-color { color: var(--belync-primary); }
.belync-bg-brand { background-color: var(--belync-primary); color: var(--belync-primary-contrast); }
.belync-link { color: var(--belync-link); text-decoration: none; }
.belync-link:hover { color: var(--belync-link-hover); text-decoration: underline; }
.belync-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 12px;
  line-height: 1.6;
  background: var(--belync-badge-muted-bg);
  color: var(--belync-badge-muted-fg);
}
.belync-badge--solid { background: var(--belync-badge-bg); color: var(--belync-badge-fg); }
.belync-card {
  background: var(--belync-card-bg);
  border: 1px solid var(--belync-border);
  border-radius: 8px;
  padding: 16px;
}
.belync-btn-primary {
  background: var(--belync-primary-action);
  color: var(--belync-primary-contrast);
  border: 1px solid var(--belync-primary-action);
  border-radius: 6px;
  padding: 8px 16px;
  cursor: pointer;
}
.belync-btn-primary:hover { background: var(--belync-primary-hover); border-color: var(--belync-primary-hover); }
.belync-btn-primary:active { background: var(--belync-primary-active); }
.belync-btn-primary:focus-visible { outline: 3px solid var(--belync-focus-ring); outline-offset: 2px; }
.belync-muted { color: var(--belync-text-secondary); }

/*
 * -------------------------------------------------------------------------
 * Phase 10 — Commercial colour (BeLYNC purple) via SUPPORTED Frappe tokens.
 *
 * Frappe v16 drives primary actions, links, active navigation and focus from a
 * small set of CSS custom properties (verified in frappe dist CSS:
 * --primary, --primary-color, --brand-color, --btn-primary,
 * --sidebar-select-color). This file is loaded via app_include_css AFTER Core's
 * stylesheet, so re-pointing those variables at the BeLYNC palette brands the
 * customer-facing Desk with NO !important and without hundreds of selectors.
 *
 * Restraint: only the brand accents are re-pointed (primary / links / active nav /
 * focus). Neutral page/card backgrounds, text and borders are intentionally left on
 * Frappe's accessible defaults so the Desk is branded, not "turned purple".
 * Primary (#861F96) on white and white on primary both exceed WCAG AA.
 * -------------------------------------------------------------------------
 */
:root {
  --primary: var(--belync-primary);
  --primary-color: var(--belync-primary);
  --brand-color: var(--belync-primary);
  --btn-primary: var(--belync-primary-action);
  --sidebar-select-color: var(--belync-active-nav-bg);
}

/* Dark mode: Frappe redefines its tokens under [data-theme="dark"] (higher
 * specificity), so brand them there too — the same purple reads well on dark. */
:root[data-theme="dark"] {
  --primary: var(--belync-primary);
  --primary-color: var(--belync-primary);
  --brand-color: var(--belync-primary);
  --btn-primary: var(--belync-primary-action);
}