/* FLAME HQ estate skin v1.0.0 (2026-07-12, feature-element lane)
 * Served at /flame-hq/flame-hq.css, injected into element-web's index.html by
 * the nginx conf override (sub_filter). HOST-EDITABLE: edit this file at
 * /opt/blackbox-infra/config/element/flame-hq/flame-hq.css and hard-refresh -
 * no rebuild, no restart.
 *
 * Palette = ESTATE-WIDE PALETTE LAW (bible GLOBAL_DESIGN_RULES section 2):
 * ground #000000, rail/panel #000000, silverish text, orange #89705E as
 * OUTLINE/ACCENT only (mature-button law: no heavy orange fills).
 * Compound (--cpd-*) tokens are set for BOTH theme classes so the pre-login
 * page (which follows the OS colour scheme) is forced onto the estate dark
 * ground too. The legacy in-app vars come from config.json custom_themes.
 */

:root { color-scheme: dark; }

:root,
.cpd-theme-light,
.cpd-theme-dark {
    /* grounds */
    --cpd-color-bg-canvas-default: #000000;
    --cpd-color-bg-canvas-disabled: #000000;
    --cpd-color-bg-subtle-primary: #262626;
    --cpd-color-bg-subtle-secondary: #1d1d1d;
    /* text */
    --cpd-color-text-primary: #d7d7d7;
    --cpd-color-text-secondary: #9a9a9a;
    --cpd-color-text-placeholder: #6f6f6f;
    --cpd-color-text-action-accent: #89705E;
    --cpd-color-text-link-external: #a68b73;
    /* icons */
    --cpd-color-icon-primary: #d7d7d7;
    --cpd-color-icon-secondary: #9a9a9a;
    --cpd-color-icon-tertiary: #8a8a8a;
    --cpd-color-icon-accent-primary: #89705E;
    --cpd-color-icon-accent-tertiary: #89705E;
    /* borders: neutral rest, orange on focus/hover (outline law) */
    --cpd-color-border-interactive-primary: #3a3a3a;
    --cpd-color-border-interactive-secondary: #2c2c2c;
    --cpd-color-border-interactive-hovered: #89705E;
    --cpd-color-border-focused: #89705E;
    /* solid primary actions: SILVER, not orange (mature-button law) */
    --cpd-color-bg-action-primary-rest: #d7d7d7;
    --cpd-color-bg-action-primary-hovered: #c6c6c6;
    --cpd-color-bg-action-primary-pressed: #b8b8b8;
    --cpd-color-text-on-solid-primary: #000000;
}

/* ---------- pre-login (auth) page: force estate dark ---------- */
.mx_AuthPage {
    background: #000000 !important;
}
.mx_AuthPage .mx_AuthBody,
.mx_AuthBody {
    background: #000000 !important;
    color: #d7d7d7 !important;
}
.mx_AuthBody h1, .mx_AuthBody h2, .mx_AuthBody h3,
.mx_AuthBody label, .mx_AuthHeader {
    color: #d7d7d7 !important;
}
.mx_AuthBody input,
.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select {
    background: #000000 !important;
    color: #d7d7d7 !important;
    border-color: #3a3a3a !important;
}
.mx_AuthBody .mx_Field input:focus {
    border-color: #89705E !important;
}
.mx_AuthFooter, .mx_AuthFooter a {
    color: #8a8a8a !important;
}
.mx_AuthBody a { color: #a68b73 !important; }

/* SSO button: outline treatment, no fill */
.mx_SSOButton {
    background: transparent !important;
    color: #d7d7d7 !important;
    border: 1px solid #89705E !important;
}
.mx_SSOButton:hover {
    background: rgba(137, 112, 94, 0.10) !important;
}

.mx_AuthHeaderLogo img,
.mx_AuthHeader img {
    max-height: 112px !important;
    max-width: 112px !important;
    object-fit: contain;
}

.mx_Welcome,
.mx_WelcomePage,
.mx_EmbeddedPage,
.mx_EmbeddedPage iframe {
    background: #000000 !important;
    color: #d7d7d7 !important;
}

.mx_EmbeddedPage iframe {
    border: 0;
}
