/* =======================================================================
   Classic — the C&W navy heritage look — TENANT theme (moved from global Light 2026-07-09).

   Tenant Classic theme. Banner + login image live in this folder.
   Rename the copy; the folder name becomes the theme's display name in
   Settings ▸ Appearance (spaces and & are fine). Change the values below and
   save — themes are served LIVE (no republish). A theme.css is loaded AFTER
   app.css, so every :root value here overrides the matching app.css token.

   These values are identical to app.css :root, so selecting "Light" looks
   exactly like the untouched app. Delete any line you don't want to change —
   the app.css default still applies for anything you omit.
   ======================================================================= */
:root {
    color-scheme: light;

    /* ── Brand palette ── */
    --color-red: #E4002B;
    --color-red-70: #DB4C4C;
    --color-red-40: #F5CCCC;
    --color-red-20: #FAE5E5;
    --color-red-10: #FDF2F2;
    --color-darkred: #A6192E;
    --color-darkred-70: #C15E6C;
    --color-orange: #FF671F;
    --color-orange-70: #FF9863;
    --color-orange-10: #FFF3ED;
    --color-lime: #B5BD00;
    --color-lime-80: #737A00;
    --color-lime-70: #C9CE71;
    --color-lime-40: #DEE1AA;
    --color-lime-20: #EEF0D3;
    --color-lime-10: #F7F8E5;
    --color-blue: #0093B2;
    --color-blue-70: #56AAC6;
    --color-blue-40: #9EC8DB;
    --color-blue-20: #CCE9F0;
    --color-blue-10: #E5F4F7;
    --color-lightblue: #9BD3DD;
    --color-darkblue: #003865;
    --color-darkblue-70: #4C7393;
    --color-darkblue-40: #99AFC1;
    --color-darkblue-20: #CCD7E0;
    --color-darkblue-10: #E5EBEF;
    --color-indigo: #1D1740;
    --color-black: #000000;
    --color-darkestgray: #2A2D2D;
    --color-darkgray: #696B6B;
    --color-darkgray-70: #7E7B7D;
    --color-darkgray-40: #ABA9AA;
    --color-darkgray-20: #D0CECF;
    --color-darkgray-10: #F0F0F0;
    --color-gray: #A7A8AA;
    --color-lightestgray: #EEEEEE;
    --color-white: #FFFFFF;

    /* ── Semantic roles (what components reference) ── */
    --sidebar-bg: var(--color-darkblue);
    --sidebar-text: var(--color-white);
    --sidebar-active-accent: var(--color-blue);
    --topbar-bg: var(--color-white);
    /* PWA window titlebar stays BRAND NAVY (the white topbar-bg is only the
       under-photo base; the visible bar is the tenant photo). */
    --titlebar-tint: #003865;
    --topbar-border: var(--color-darkgray-20);
    /* Topbar banner wash (dark→light→dark band over the tenant photo).
       Keep all three stops DARK — topbar text is white. --topbar-banner (not set
       here) may be url(...) to replace the photo or none to remove it. */
    --topbar-wash-edge: rgba(11, 44, 82, 0.92);
    --topbar-wash-strong: rgba(11, 44, 82, 0.80);
    --topbar-wash-center: rgba(11, 44, 82, 0.32);
    --topbar-wash-border: #08233f;
    /* Banner photo is THEME-OWNED (2026-07-09): each theme folder carries its
       own image (or sets none). This file uses the classic apartment banner. */
    --topbar-banner: url('/themes/t/cwke/classic/web/top-banner.jpg');
    /* Nav watermark silhouette — auto-derives from the themed sidebar. */
    --nav-watermark-color: color-mix(in srgb, var(--sidebar-bg) 78%, black);
    --nav-watermark-opacity: 0.6;
    --page-bg: var(--color-darkgray-10);
    --content-bg: var(--color-white);
    --text-primary: var(--color-darkestgray);
    --text-secondary: var(--color-darkgray);
    --accent-primary: var(--color-blue);
    --accent-primary-hover: #007A96;
    --color-danger: var(--color-red);
    --color-danger-hover: var(--color-darkred);
    --color-warning: var(--color-orange);
    --warning-bg: #fff8e6;
    --warning-border: #f0d089;
    --warning-text: #92610a;
    --color-success: var(--color-lime);
    --color-page-title: var(--color-red);
    --border: var(--color-darkgray-20);
    --border-light: var(--color-darkgray-10);

    /* ── Extended semantic roles ── */
    --text-tertiary: #888888;
    --text-muted: #999999;
    --text-heading: #1a1a2e;
    --surface: #f9fafb;
    --surface-hover: #f3f4f6;
    --surface-subtle: #f7f7f8;
    --input-border: #d1d5db;
    --input-border-hover: #9ca3af;
    --divider: #e5e7eb;
    --divider-light: #f0f0f0;
    --backdrop: rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.2);
    --row-hover: #f5f5ff;
    --row-selected: #eef2ff;
    --row-selected-hover: #e0e7ff;
    --row-highlighted: #dbeafe;
    --row-highlighted-hover: #c7d8f7;
    --row-highlighted-selected: #c7d2fe;
    --color-success-action: var(--color-lime-80);
    --color-success-action-hover: #5C6200;
    --chip-accent: #6366f1;
    --chip-grouped-bg: #e8ecff;
    --chip-grouped-border: #a5b4fc;
    --chip-nested-bg: #dde3ff;
    --chip-nested-border: #818cf8;

    /* ── Layout ── */
    --sidebar-width: 220px;
    --sidebar-collapsed-width: 56px;
    --topbar-height: 44px;
    --content-gutter: 1.25rem;
    --tab-height: 36px;
    --split-handle-size: 6px;

    /* ── Typography ── */
    --font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.8125rem;
    --font-size-base: 0.875rem;

    /* ── Effects ── */
    --radius-sm: 4px;
    --radius-md: 6px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,0.08);
    --shadow-md: 0 2px 8px rgba(0,0,0,0.12);
    --transition-fast: 0.15s ease;
    --transition-normal: 0.2s ease;
}

/* ── ENTITY GLYPH OCTAVE — DELIBERATELY INHERITED ────────────────────────────
   Charles ruled 2026-08-02: every theme gets a CONSIDERED verdict on the eight
   --tab-tint-* entity glyph tints. This theme: INHERITS the app.css octave, on
   purpose. C&W Classic reproduces the app.css defaults (--color-blue accent, white content, --color-darkgray-10 strip) as the brand's baseline look. The default octave was tuned against precisely these surfaces; re-tinting would move Classic away from the baseline it exists to BE.
   The question was asked and answered — this is not a silent default. To give
   this theme its own octave later, add a :root block with the eight
   --tab-tint-{contact,user,group,company,office,property,transaction,project}
   and keep the contract: eight distinguishable hues, legible on BOTH the tab
   strip and --content-bg, quieter than the accent underline. */