/* DevTech Pro brand theme for Frappe's website pages — in practice the login
 * screen, which is the first thing anyone sees before the CRM SPA loads.
 *
 * STARTER PALETTE — same caveat as crm.css in this pack.
 *
 * Frappe's website styling derives almost everything from its `--gray-*` ramp
 * (`--text-color` is `--gray-800`, `--border-color` is `--gray-200`,
 * `--btn-primary` is `--gray-900`, ...), so re-pointing that ramp carries the
 * whole surface. Same approach as crm.css: re-point tokens, don't restyle core
 * class names.
 *
 * SPECIFICITY: this sheet is injected through Website Settings' head_html,
 * which Frappe emits after the page's own bundle — so it already wins on order.
 * The selectors are still doubled up on `:root` to match the pattern used when
 * a pack is loaded through `web_include_css` instead, where the framework's own
 * declarations come later and an equal-specificity block would silently lose.
 */

:root:not([data-theme='dark']) {
  --gray-50: #f8fafc;
  --gray-100: #f1f5f9;
  --gray-200: #e2e8f0;
  --gray-300: #cbd5e1;
  --gray-400: #94a3b8;
  --gray-500: #64748b;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1e293b;
  --gray-900: #0f172a;

  --bg-color: #f4f7fa;
  --fg-color: #ffffff;
  --navbar-bg: #ffffff;
  --modal-bg: #ffffff;
  --popover-bg: #ffffff;

  /* Primary action is the brand blue, matching the mark. */
  --primary: #1d4ed8;
  --primary-color: #1d4ed8;
  --btn-primary: #1d4ed8;
  --border-primary: #1d4ed8;

  --scrollbar-thumb-color: #cbd5e1;
  --scrollbar-track-color: transparent;
}

/* Depth the ramp cannot carry: a lifted white card on a tinted plane rather
   than a hairline box. Frappe's 10px radius is left alone. */
:root:not([data-theme='dark']) .page-card,
:root:not([data-theme='dark']) .login-content {
  border: none;
  box-shadow: 0px 2px 6px 0px rgba(2, 6, 23, 0.05),
    0px 20px 42px -18px rgba(2, 6, 23, 0.16);
}
