/* ============================================================================
   oum-theme.css — OUM brand tokens for the Admin Portal.

   Change the hexes in :root below and the whole portal follows.

   Load order: coreuistyle.css -> oum-theme.css -> custom.css.
   Must sit before custom.css, which consumes these tokens.

   Don't de-duplicate public/logos: cms-logo-invert.png and oumlogo.png are
   copies of the oum-* marks, kept under their old names because the 9 module
   repos and the PDF headers still reference those names.
   ============================================================================ */

:root {
    /* --- palette: the only hexes you should need to edit --- */
    --oum-primary: #19499C;
    --oum-primary-rgb: 25, 73, 156;
    --oum-primary-hover: #143C82;
    --oum-primary-active: #102F66;
    --oum-primary-soft: #E8EEF7;

    --oum-accent: #05B6C5;
    --oum-accent-rgb: 5, 182, 197;
    --oum-accent-hover: #049AA6;
    --oum-accent-soft: #E0F7F9;

    --oum-on-brand: #ffffff;
    /* Ink for labels on accent fills — white on cyan is only 2.2:1. */
    --oum-on-accent: #032A31;

    /* --- roles: remap these to restyle without touching the palette --- */
    --oum-sidebar-bg: var(--oum-primary-hover);
    --oum-sidebar-group-bg: var(--oum-primary-active);
    --oum-icon-action: var(--oum-primary);
    --oum-link: var(--oum-primary);
    --oum-link-hover: var(--oum-accent-hover);
    /* Swap to var(--oum-primary-hover) for monochrome navy buttons. */
    --oum-btn-hover-bg: var(--oum-accent);
    --oum-btn-active-bg: var(--oum-accent-hover);
    --oum-btn-disabled-bg: #8CA4CB;
    --oum-focus-ring: 0 0 0 .2rem rgba(var(--oum-accent-rgb), .35);
    --oum-table-head-bg: var(--oum-primary-soft);
    --oum-info-card-bg: var(--oum-accent-soft);
    --oum-tag-bg: var(--oum-primary);
}

/* CoreUI resolves .bg-primary, .text-primary and focus shadows through these. */
:root {
    --cui-primary: var(--oum-primary);
    --cui-primary-rgb: var(--oum-primary-rgb);
    --cui-secondary: var(--oum-accent);
    --cui-secondary-rgb: var(--oum-accent-rgb);
    --cui-link-color: var(--oum-link);
    --cui-link-hover-color: var(--oum-link-hover);
}

/* layouts/app.blade.php (the auth screens) loads Bootstrap instead of CoreUI.
   Bootstrap hardcodes its button palette per component rather than deriving it
   from --bs-primary, hence the explicit .btn-primary block. */
:root {
    --bs-primary: var(--oum-primary);
    --bs-primary-rgb: var(--oum-primary-rgb);
    --bs-link-color: var(--oum-link);
    --bs-link-hover-color: var(--oum-link-hover);
}

.btn-primary {
    --bs-btn-bg: var(--oum-primary);
    --bs-btn-border-color: var(--oum-primary);
    --bs-btn-hover-color: var(--oum-on-accent);
    --bs-btn-hover-bg: var(--oum-btn-hover-bg);
    --bs-btn-hover-border-color: var(--oum-btn-hover-bg);
    --bs-btn-active-color: var(--oum-on-accent);
    --bs-btn-active-bg: var(--oum-btn-active-bg);
    --bs-btn-active-border-color: var(--oum-btn-active-bg);
    --bs-btn-disabled-bg: var(--oum-btn-disabled-bg);
    --bs-btn-disabled-border-color: var(--oum-btn-disabled-bg);
    --bs-btn-focus-shadow-rgb: var(--oum-accent-rgb);
}

/* --- Compatibility layer: recolours hardcoded values in the 9 module repos and
       in style.min.css, none of which this branch touches. !important is what
       beats their inline styles. Drop a rule once its source moves to tokens. --- */

/* Legacy blue as a foreground: the "add" icon and section headings. */
[style*="#1A56CE"]:not([style*="background"]),
[style*="#1a56ce"]:not([style*="background"]) {
    color: var(--oum-icon-action) !important;
}

font[color="#1a56ce" i] {
    color: var(--oum-primary) !important;
}

/* Legacy blue as a fill. */
[style*="background-color:#1a56ce" i],
[style*="background-color: #1a56ce" i],
[style*="background-color:#18439a" i],
[style*="background-color: #18439a" i] {
    background-color: var(--oum-primary) !important;
}

/* Sidebar brand plate. The blades hardcode width="80%" height="80%", which made
   the mark bleed into all four edges; max-width/max-height override that so it
   scales to fit the padded block. Covers the 9 module sidebars too, which use
   the same markup. The height var must go on .sidebar — CoreUI declares it
   there, which shadows :root for every descendant. */
.sidebar {
    --cui-sidebar-brand-height: 4.75rem;
}

.sidebar-brand {
    padding: 14px 24px;
}

.sidebarlogo {
    max-width: 100%;
    max-height: 100%;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

img.dark-logo[src*="cms-logo-invert"] {
    height: auto !important;
}

/* Beige header rows (~200 module blades) become brand-tinted. */
[style*="background-color: #e4e1dc" i],
[style*="background-color:#e4e1dc" i] {
    background-color: var(--oum-table-head-bg) !important;
}

/* Login layout (app2.blade.php) still uses Bootstrap-4 button styling. */
.login-register .btn-primary,
.login-box .btn-primary,
body .btn-primary.btn-rounded {
    background-color: var(--oum-primary);
    border-color: var(--oum-primary);
}

.login-register .btn-primary:hover,
.login-box .btn-primary:hover,
body .btn-primary.btn-rounded:hover {
    background-color: var(--oum-btn-hover-bg);
    border-color: var(--oum-btn-hover-bg);
}

.login-register .btn-link,
.login-box a {
    color: var(--oum-link);
}

.form-control:focus,
.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--oum-primary) !important;
    box-shadow: var(--oum-focus-ring) !important;
}