/* ============================================================
   Backoffice custom overrides (partner-specific branding).
   Loaded AFTER the default stylesheets, so any selector here
   with the same specificity wins by cascade order.
   ============================================================ */

/* ------------------------------------------------------------
   Logo replacements.
   The JS in pippo.js rewrites src attributes; these rules act
   as a CSS-only fallback using `content: url()` in case JS
   doesn't run.
   ------------------------------------------------------------ */
img[src$="/static/img/logo.png"] {
    content: url("/custom/img/aiconis_Logo_RGB.svg") !important;
}
img[src$="/static/img/logo_reverse.png"] {
    content: url("/custom/img/aiconis_Logo_white_RGB.svg") !important;
}
img[src$="/static/img/logo_esteso.png"] {
    content: url("/custom/img/aiconis_Logo_RGB.svg") !important;
}
img[src$="/static/img/logo_esteso_reverse.png"] {
    content: url("/custom/img/aiconis_Logo_white_RGB.svg") !important;
}

/* The aiconis SVGs declare only a viewBox (no intrinsic width/height),
   so an <img> in a flex container with width:auto can collapse to 0
   width. Force concrete dimensions for both the post-JS-swap src and
   the pre-swap src that is being replaced via `content: url()`. */
img[src*="/custom/img/aiconis_Logo"],
img[src$="/static/img/logo.png"],
img[src$="/static/img/logo_reverse.png"],
img[src$="/static/img/logo_esteso.png"],
img[src$="/static/img/logo_esteso_reverse.png"] {
    height: 50px !important;
    width: auto !important;
    max-width: 100%;
    object-fit: contain;
}

/* ============================================================
   Color palette overrides.
   Every CSS custom property that controls a platform color is
   re-declared here. Change any of them to re-skin the backoffice
   for a specific partner. The originals remain in:
     - static/css/global_layout.css
     - static/css/manager/style.css
   ============================================================ */

/* ---- Light theme (default) ---- */
:root {
    /* Global layout */
    --global-sidebar-bg: #494454;
    --global-sidebar-bg-dark: #332c49;
    --global-sidebar-shadow: 5px 0 15px rgba(0, 0, 0, 0.15);

    /* Core palette (blue replaces the red accent) */
    --accent-color: #1233ea;
    --accent-hover: #0e28b8;
    --accent-rgb: 18, 51, 234;
    --accent-soft: rgba(18, 51, 234, 0.2);
    --danger-color: #ef4444;

    /* Text */
    --text-primary: #1E293B;
    --text-secondary: #64748b;

    /* Backgrounds */
    --main-bg-color: #F8FAFC;
    --sidebar-bg-color: #494454;
    --card-bg: #FFFFFF;
    --modal-bg: #FFFFFF;
    --block-bg: #F8FAFC;
    --input-bg: #FFFFFF;
    --input-focus-bg: #FFFFFF;

    /* Glass / borders */
    --glass-bg: rgba(255, 255, 255, 0.8);
    --glass-border: rgba(0, 0, 0, 0.08);
    --border-color: rgba(0, 0, 0, 0.1);

    /* JSON editor */
    --json-bg: #1e293b;
    --json-text: #e2e8f0;

    /* Sidebar text */
    --sidebar-text: rgba(255, 255, 255, 0.85);
    --sidebar-text-muted: rgba(255, 255, 255, 0.5);

    /* Misc */
    --custom-preset-title-color: #1E293B;
    --bs-secondary-color: rgba(33, 37, 41, 0.75);

    /* Login pages (consumed by template-local :root vars) */
    --login-bg: #494454;
    --login-bg-dark: #332c49;
}

/* ---- Dark theme ---- */
.dark-mode {
    --main-bg-color: #0b1020;
    --sidebar-bg-color: #332c49;

    /* Blue accent, slightly brighter on dark for readability */
    --accent-color: #4060ff;
    --accent-hover: #6b83ff;
    --accent-rgb: 64, 96, 255;
    --accent-soft: rgba(64, 96, 255, 0.22);
    --danger-color: #ef4444;

    --text-primary: #f8fafc;
    --text-secondary: #94a3b8;

    --card-bg: rgba(30, 32, 52, 0.65);
    --modal-bg: #1a1d30;
    --block-bg: rgba(30, 32, 52, 0.65);
    --input-bg: rgba(15, 18, 35, 0.6);
    --input-focus-bg: rgba(15, 18, 35, 0.85);

    --glass-bg: rgba(30, 32, 52, 0.45);
    --glass-border: rgba(255, 255, 255, 0.1);
    --border-color: rgba(255, 255, 255, 0.12);

    --json-bg: rgba(15, 18, 35, 0.95);
    --json-text: #e2e8f0;

    --custom-preset-title-color: #ffffff;
    --bs-secondary-color: rgba(255, 255, 255, 1);
}

/* ------------------------------------------------------------
   Backoffice sidebar nav: active item uses accent color for text
   and a soft accent background. On the dark purple sidebar the
   accent blue is unreadable, so force white text and bump the
   background tint for contrast.
   ------------------------------------------------------------ */
.sidebar-table-link.active,
.sidebar-table-link.active:hover,
.sidebar-table-link.active:focus {
    color: #ffffff !important;
    border-left-color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.12) !important;
}
.sidebar-table-link.active i {
    color: #ffffff !important;
}

/* ------------------------------------------------------------
   Login / reset-password pages.
   The templates apply a hardcoded 3-stop gradient on <body>,
   so overriding --login-bg* vars isn't enough — we replace the
   background entirely. Scoped via :has(.login-container) so the
   manager page body (which also loads pippo.css) is untouched.
   ------------------------------------------------------------ */
body:has(.login-container) {
    background: linear-gradient(135deg, #494454 0%, #332c49 100%) !important;
}