/*
 * ============================================================================
 *  OVER THEME COLOURS (Preclinic v1.8.2 on Bootstrap 4)
 * ============================================================================
 *
 *  This is the ONLY file to edit to change the colours of the admin area.
 *  It is plain CSS: no build step is needed, just edit and reload.
 *  Loaded by resources/views/layouts/app.blade.php and layouts/auth.blade.php,
 *  before over-preclinic.css. Wizards and quotation pages do not load it.
 *
 *  Every value below is the Over colour. The original Preclinic value is
 *  written in the comment next to it: to switch to the Preclinic palette,
 *  copy the commented value in place of the active one.
 *
 *  When you change a brand colour, change its whole group:
 *    --x            the colour itself
 *    --x-rgb        the same colour as "r, g, b" (used for transparencies)
 *    --x-hover      a slightly darker shade (hover / active state)
 *    --x-transparent a very light tint (soft backgrounds, alerts, active menu)
 *
 *  Neutral colours (greys, page background, borders, text) come from Preclinic
 *  because they are part of the theme layout, not of the Over brand.
 * ============================================================================
 */

:root {
    /* ---- Typography ------------------------------------------------------ */
    --font-family-base: "Inter", sans-serif;         /* Over (Gull): "Muli", sans-serif */
    --font-size-base: 0.875rem;                      /* Over (Gull): 0.813rem */

    /* ---- Brand colours --------------------------------------------------- */
    --primary: #003473;                              /* Preclinic: #2E37A4 */
    --primary-rgb: 0, 52, 115;                       /* Preclinic: 46, 55, 164 */
    --primary-hover: #002b5e;                        /* Preclinic: #3C449C */
    --primary-transparent: #EBEFF4;                  /* Preclinic: #ECEDF7 */

    --secondary: #0F233B;                            /* Preclinic: #00D3C7 */
    --secondary-rgb: 15, 35, 59;                     /* Preclinic: 0, 211, 199 */
    --secondary-hover: #0B1A2C;                      /* Preclinic: #17C2B9 */
    --secondary-transparent: #ECEDEF;                /* Preclinic: #E8FBFA */

    --success: #4CAF50;                              /* Preclinic: #27AE60 */
    --success-rgb: 76, 175, 80;                      /* Preclinic: 39, 174, 96 */
    --success-hover: #43A047;                        /* Preclinic: #37A465 */
    --success-transparent: #F1F9F1;                  /* Preclinic: #F4FBF7 */

    --info: #003473;                                 /* Preclinic: #2F80ED */
    --info-rgb: 0, 52, 115;                          /* Preclinic: 47, 128, 237 */
    --info-hover: #002b5e;                           /* Preclinic: #3D7FD7 */
    --info-transparent: #EBEFF4;                     /* Preclinic: #F4F9FE */

    --warning: #FFC107;                              /* Preclinic: #E2B93B */
    --warning-rgb: 255, 193, 7;                      /* Preclinic: 253, 175, 34 */
    --warning-hover: #E0A800;                        /* Preclinic: #CEAD47 */
    --warning-transparent: #FFFAEB;                  /* Preclinic: #FEFBF5 */
    --warning-text: #0B192B;                         /* Preclinic: #FFFFFF (text on warning buttons/badges) */

    --danger: #F44336;                               /* Preclinic: #EF1E1E */
    --danger-rgb: 244, 67, 54;                       /* Preclinic: 239, 30, 30 */
    --danger-hover: #D32F2F;                         /* Preclinic: #D93030 */
    --danger-transparent: #FEF0EF;                   /* Preclinic: #FEF4F4 */

    --dark: #0B192B;                                 /* Preclinic: #0B0D0E */
    --dark-rgb: 11, 25, 43;                          /* Preclinic: 11, 13, 14 */
    --dark-hover: #060E18;                           /* Preclinic: #080A0B */
    --dark-transparent: #E7E8EB;                     /* Preclinic: #E7E8EB */

    /* ---- Accent colours -------------------------------------------------- */
    --indigo: #3F51B5;                               /* Preclinic: #3538CD */
    --indigo-rgb: 63, 81, 181;                       /* Preclinic: 53, 56, 205 */
    --indigo-hover: #3949A3;                         /* Preclinic: #3C49BF */
    --indigo-transparent: #EEF0F8;                   /* Preclinic: #EDEDFB */

    --purple: #663399;                               /* Preclinic: #800080 */
    --purple-rgb: 102, 51, 153;                      /* Preclinic: 128, 0, 128 */
    --purple-hover: #552B80;                         /* Preclinic: #7F177F */
    --purple-transparent: #F3EFF7;                   /* Preclinic: #F9F2F9 */

    --pink: #CB3066;                                 /* Preclinic: #DD2590 */
    --pink-rgb: 203, 48, 102;                        /* Preclinic: 221, 37, 144 */
    --pink-hover: #B32A5A;                           /* Preclinic: #E4479B */
    --pink-transparent: #FBF0F4;                     /* Preclinic: #FDF4F9 */

    --orange: #E97D23;                               /* Preclinic: #E04F16 */
    --orange-rgb: 233, 125, 35;                      /* Preclinic: 224, 79, 22 */
    --orange-hover: #D06E1D;                         /* Preclinic: #CF5A32 */
    --orange-transparent: #FDF5ED;                   /* Preclinic: #FDF6F3 */

    --teal: #20C997;                                 /* Preclinic: #0E9384 */
    --teal-rgb: 32, 201, 151;                        /* Preclinic: 14, 147, 132 */
    --teal-hover: #1BAE83;                           /* Preclinic: #358E82 */
    --teal-transparent: #EDFAF6;                     /* Preclinic: #E9F5F4 */

    --cyan: #00BCD4;                                 /* Preclinic: #00D3C7 (Gull had #9C27B0, a purple) */
    --cyan-rgb: 0, 188, 212;                         /* Preclinic: 0, 211, 199 */
    --cyan-hover: #00A5BB;                           /* Preclinic: #39A4C3 */
    --cyan-transparent: #EBF9FB;                     /* Preclinic: #E9F8FB */

    /* ---- Neutrals (Preclinic) -------------------------------------------- */
    --white: #FFFFFF;
    --white-rgb: 255, 255, 255;
    --black: #000000;
    --light: #F5F6F8;                                /* page background */
    --light-rgb: 245, 246, 248;
    --light-hover: #F6F7F9;
    --light-transparent: #FEFEFE;
    --gray-transparent: #E7E8EB;

    --gray-100: #CED1D7;
    --gray-200: #B6BBC4;
    --gray-300: #9DA4B0;
    --gray-400: #858D9C;
    --gray-500: #6C7688;
    --gray-600: #545F74;
    --gray-700: #3B4961;
    --gray-800: #23324D;
    --gray-900: #0A1B39;
    --gray-hover: #091833;

    --light-100: #FDFDFE;
    --light-200: #FCFDFD;
    --light-300: #FBFCFD;
    --light-400: #FBFBFC;
    --light-500: #FAFAFB;
    --light-600: #F9F9FB;
    --light-700: #F8F9FA;
    --light-800: #F7F8FA;
    --light-900: #F6F7F9;

    --heading-color: #0A1B39;                        /* titles, labels, table headers */
    --border-color: #E7E8EB;
    --body-color: #6C7688;                           /* body text */
    --body-color-rgb: 108, 118, 136;

    --box-shadow: 0px 0px 35px 0px rgba(104, 134, 177, 0.15);
    --box-shadow-sm: 0px 1px 1px 0px rgba(0, 0, 0, 0.05);
    --box-shadow-lg: 0 0 45px 0 rgba(108, 118, 136, 0.2);

    /* ---- SweetAlert popups (Over style: navy popup, pink confirm button) --- */
    --swal-bg: var(--primary);                       /* Preclinic: var(--white) */
    --swal-color: #FFFFFF;                           /* Preclinic: var(--body-color) */
    --swal-title-color: #FFFFFF;                     /* Preclinic: var(--heading-color) */
    --swal-confirm-bg: #B70245;                      /* Preclinic: var(--primary) */

    /* ---- Layout (Preclinic) ---------------------------------------------- */
    --sidenav-width: 276px;
    --sidenav-width-sm: 70px;
    --topbar-height: 55px;

    /* ---- Top bar --------------------------------------------------------- */
    --topbar-bg: var(--white);
    --topbar-item-border: var(--border-color);
    --topbar-item-color: var(--gray-900);
    --topbar-item-hover-color: var(--primary);
    --topbar-btn-color: var(--light);

    /* ---- Sidebar --------------------------------------------------------- */
    --menu-bg: var(--white);
    --menu-title-color: var(--gray-400);
    --menu-item-heading: var(--gray-900);
    --menu-item-color: var(--gray-500);
    --menu-item-border: var(--border-color);
    --menu-item-hover-color: var(--primary);
    --menu-item-active-color: var(--primary);
    --menu-active-color: var(--primary);
    --menu-active-bg: var(--primary-transparent);
    --menu-light-bg: var(--light);
}

/* Host "Agents" (elencoweb.com) keeps its purple brand, as the old lite-purple theme did. */
:root[data-brand="agents"] {
    --primary: #663399;
    --primary-rgb: 102, 51, 153;
    --primary-hover: #552B80;
    --primary-transparent: #F3EFF7;
    --info: #663399;
    --info-rgb: 102, 51, 153;
    --info-hover: #552B80;
    --info-transparent: #F3EFF7;
}

/*
 * ---- Dark mode ---------------------------------------------------------------
 * Applied when <html data-bs-theme="dark"> (moon button in the top bar).
 * Values are Preclinic's dark palette. The Over navy is too dark to read on a
 * dark background, so dark mode uses a lighter shade of it.
 */
:root[data-bs-theme="dark"] {
    --primary: #4A86D8;                              /* Preclinic: #2E37A4 (unchanged in dark) */
    --primary-rgb: 74, 134, 216;                     /* Preclinic: 46, 55, 164 */
    --primary-hover: #3B77C9;                        /* Preclinic: #3C449C */
    --info: #4A86D8;
    --info-rgb: 74, 134, 216;
    --info-hover: #3B77C9;
    --secondary: #2A3F5C;                            /* Over secondary lifted for contrast */
    --secondary-rgb: 42, 63, 92;
    --secondary-hover: #34506F;
    --dark: #E3E3E3;
    --dark-rgb: 227, 227, 227;
    --dark-hover: #DADFE2;

    --white: #03041A;                                /* cards, modals, inputs */
    --white-rgb: 3, 4, 26;
    --light: #06081F;                                /* page background */
    --light-rgb: 9, 12, 42;
    --light-hover: #3C4249;
    --light-transparent: #343A40;
    --gray-transparent: #282A2E;
    --dark-transparent: #212123;

    --gray-100: #383B42;
    --gray-200: #484C55;
    --gray-300: #585E69;
    --gray-400: #686F7B;
    --gray-500: #79818F;
    --gray-600: #8891A3;
    --gray-700: #96A3B8;
    --gray-800: #A4B3CE;
    --gray-900: #ADC3E8;
    --gray-hover: #DADFE2;

    --light-100: #141422;
    --light-200: #172020;
    --light-300: #141C23;
    --light-400: #191920;
    --light-500: #1B1B20;
    --light-600: #191922;
    --light-700: #1A1E22;
    --light-800: #191D24;
    --light-900: #1A1E25;

    --primary-transparent: #0B1B33;
    --secondary-transparent: #161719;
    --success-transparent: #051B11;
    --info-transparent: #0B1B33;
    --warning-transparent: #332701;
    --danger-transparent: #330A0A;
    --indigo-transparent: #111134;
    --purple-transparent: #2B172B;
    --pink-transparent: #300E21;
    --orange-transparent: #31180D;
    --teal-transparent: #1B3230;
    --cyan-transparent: #103138;

    --heading-color: #BCC7E1;
    --border-color: #202A36;
    --body-color: #9FACBF;
    --body-color-rgb: 222, 226, 230;

    --box-shadow-sm: 0px 1px 1px 0px rgba(0, 0, 0, 0.05);
    --box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.75);
    --box-shadow-lg: 0px 4.4px 12px -1px rgba(0, 0, 0, 0.75);

    --topbar-bg: #03041A;
    --topbar-item-color: #DBE0E6;
    --topbar-item-hover-color: #BCCEE4;
    --topbar-item-border: #10122C;
    --topbar-btn-color: #06081F;

    --menu-bg: #03041A;
    --menu-item-color: #97AAC1;
    --menu-item-active-color: #E2EEFF;
    --menu-item-heading: #D9DCFF;
    --menu-item-border: #10122C;
    --menu-item-hover-color: var(--primary);
    --menu-light-bg: #06081F;
}

:root[data-bs-theme="dark"][data-brand="agents"] {
    --primary: #9B6BD1;
    --primary-rgb: 155, 107, 209;
    --primary-hover: #8A5AC0;
    --primary-transparent: #2B172B;
    --info: #9B6BD1;
    --info-rgb: 155, 107, 209;
    --info-hover: #8A5AC0;
    --info-transparent: #2B172B;
}