/* =============================================================================
   eKer — admin panel theme (TonuxCorp brand kit v1.0)
   Single place for brand tokens, fonts, radii and component overrides.
   Loaded after the vendor stylesheets (layouts/include + auth/login).

   Primary colour: --bs-primary is also set at runtime from PRIMARY_COLOR
   (System settings > "System color"); default = Deep Navy #0F2B47.
   Cyan is an accent only (<= 10 % of a surface): focus, active states, badges.
   ========================================================================== */

/* --- Fonts (self-hosted, SIL OFL) ---------------------------------------- */
@font-face { font-family: "Inter"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/eker/Inter-Regular.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/eker/Inter-Medium.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/eker/Inter-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/eker/Inter-Bold.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-weight: 800; font-style: normal; font-display: swap; src: url("../fonts/eker/Inter-ExtraBold.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 300; font-style: normal; font-display: swap; src: url("../fonts/eker/SpaceGrotesk-Light.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 400; font-style: normal; font-display: swap; src: url("../fonts/eker/SpaceGrotesk-Regular.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 500; font-style: normal; font-display: swap; src: url("../fonts/eker/SpaceGrotesk-Medium.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 600; font-style: normal; font-display: swap; src: url("../fonts/eker/SpaceGrotesk-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Space Grotesk"; font-weight: 700; font-style: normal; font-display: swap; src: url("../fonts/eker/SpaceGrotesk-Bold.woff2") format("woff2"); }

/* --- Brand tokens ----------------------------------------------------------- */
:root {
    --eker-abyss-navy: #060D18;
    --eker-deep-navy: #0F2B47;
    --eker-navy-700: #0B1F38;
    --eker-surface-dark: #0B1524;
    --eker-border-dark: #17263B;
    --eker-border-strong: #2A3C55;
    --eker-cyan: #00E5FF;
    --eker-cyan-hover: #5CEEFF;
    --eker-cyan-soft: rgba(0, 229, 255, 0.14);
    --eker-white: #FFFFFF;
    --eker-text: #0B1F38;
    --eker-text-secondary: #7286A0;
    --eker-text-muted: #8A9CB2;
    --eker-bg: #F4F6F9;
    --eker-border: #E3E8EF;

    --eker-radius-control: 8px;   /* buttons, inputs */
    --eker-radius-card: 12px;     /* cards */
    --eker-radius-container: 16px;/* containers, modals */
    --eker-radius-pill: 999px;    /* chips */

    --eker-font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --eker-font-display: "Space Grotesk", "Inter", system-ui, sans-serif;

    --bs-primary-rgb: 15, 43, 71;
    --bs-body-font-family: var(--eker-font-body);
    --bs-body-color: #3D4F66;
    --bs-body-bg: var(--eker-bg);
    --bs-border-color: var(--eker-border);
    --bs-border-radius: var(--eker-radius-control);
    --bs-border-radius-sm: 6px;
    --bs-border-radius-lg: var(--eker-radius-card);
    --bs-border-radius-xl: var(--eker-radius-container);
}

/* --- Typography ----------------------------------------------------------- */
body, .form-control, .form-select, .btn, .table, .dropdown-menu, .modal, .sidebar-wrapper {
    font-family: var(--eker-font-body);
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .page-heading h3, .card-title, .modal-title, .auth-title {
    font-family: var(--eker-font-display);
    font-weight: 500;
    letter-spacing: -0.02em;
    color: var(--eker-text);
}

/* --- Surfaces: 1px border, no resting shadow -------------------------------- */
.card {
    border: 1px solid var(--eker-border);
    border-radius: var(--eker-radius-card);
    box-shadow: none;
}
.modal-content { border-radius: var(--eker-radius-container); border: 1px solid var(--eker-border); }
.dropdown-menu { border-radius: var(--eker-radius-card); border: 1px solid var(--eker-border); }

/* --- Controls --------------------------------------------------------------- */
.form-control, .form-select, .input-group-text, .select2-container .select2-selection {
    border-radius: var(--eker-radius-control);
}
.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: var(--eker-deep-navy);
    box-shadow: 0 0 0 3px var(--eker-cyan-soft);
}
.form-check-input:checked { background-color: var(--eker-deep-navy); border-color: var(--eker-deep-navy); }

.btn { border-radius: var(--eker-radius-control); font-weight: 600; }
.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--eker-abyss-navy);
    --bs-btn-hover-border-color: var(--eker-abyss-navy);
    --bs-btn-active-bg: var(--eker-abyss-navy);
    --bs-btn-focus-shadow-rgb: 0, 229, 255;
}
.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
}
.badge { border-radius: var(--eker-radius-pill); font-weight: 600; }
.badge.bg-primary { background-color: var(--bs-primary) !important; }

/* --- Sidebar ---------------------------------------------------------------- */
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link {
    background-color: var(--bs-primary);
    box-shadow: inset 3px 0 0 var(--eker-cyan);
}
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link,
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link span,
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link i,
.sidebar-wrapper .menu .sidebar-item.active > .sidebar-link svg {
    color: #FFFFFF;
    fill: #FFFFFF;
}
.sidebar-wrapper .menu .sidebar-link { border-radius: var(--eker-radius-control); }

/* --- Misc ------------------------------------------------------------------- */
::selection { background: var(--eker-cyan-soft); }
