/**
 * Kitsofts — navy primary #002366, pale-blue surfaces (minimal white).
 * Sidebar matches KitMedical layout; colors use Kitsofts navy palette.
 */

:root {
    --kitsofts-brand-text: #000000;
    --kitsofts-brand-accent: #e85d04;
    --kitsofts-brand-accent-dark: #c44900;
    --kitsofts-brand-accent-light: #f07020;
    --kitsofts-brand-accent-rgb: 232, 93, 4;

    --primary: #002366;
    --primary-dark: #001a4d;
    --primary-light: #003d99;
    --secondary: #0d9488;
    --secondary-dark: #0f766e;
    --secondary-light: #14b8a6;
    --accent: #0d9488;
    --accent-dark: #0f766e;
    --primary-rgb: 0, 35, 102;
    --secondary-rgb: 13, 148, 136;
    --teal: #0d9488;
    --teal-dark: #0f766e;
    --teal-light: #5eead4;
    --pale-teal: #b8e0db;
    --pale-teal-mid: #8ecfc6;

    --pale-blue: #94b4dc;
    --pale-blue-mid: #7a9fd0;
    --pale-blue-light: #a8c4e8;
    --pale-blue-soft: #b8cfe8;
    --page-bg: #b0c9e8;
    --surface: #a8c4e8;
    --surface-alt: #94b4dc;

    /* Chrome (navy) vs content (pale blue) */
    --chrome-bg: #002366;
    --chrome-bg-dark: #001a4d;
    --chrome-text: #ffffff;

    --sidebar-bg: #002366;
    --sidebar-inner: #002366;
    --sidebar-item-bg: #002366;
    --sidebar-item-hover: #003080;
    --sidebar-item-text: #ffffff;
    --sidebar-submenu-bg: #001a4d;
    --sidebar-item-border: rgba(255, 255, 255, 0.14);
    --sidebar-shadow: 6px 0 26px rgba(0, 35, 102, 0.32), 2px 0 10px rgba(0, 35, 102, 0.16);

    --warning: #d97706;
    --danger: #dc2626;
    --success: #059669;
    --info: #0369a1;

    --dark: var(--page-bg);
    --darker: var(--pale-blue-soft);
    --dark-blue: var(--pale-blue);
    --light: #000000;
    --card-bg: var(--surface);
    --text-dark: #000000;
    --text-muted: #000000;
    --text-light: #002366;

    --glow: none;
    --gradient: var(--primary);
    --gradient-accent: var(--secondary);
    --gradient-brand: var(--primary);
    --shadow: 0 4px 14px rgba(var(--primary-rgb), 0.12);
    --shadow-lg: 0 12px 28px rgba(var(--primary-rgb), 0.16);
    --border: 1px solid rgba(var(--primary-rgb), 0.18);
    --border-light: 1px solid var(--pale-blue-mid);
    --radius: 0;
    --radius-sm: 0;
    --radius-xs: 0;
    --expired-bg: rgba(220, 38, 38, 0.1);
    --expiring-bg: rgba(217, 119, 6, 0.1);
    --warning-bg: rgba(217, 119, 6, 0.1);
    --success-bg: rgba(5, 150, 105, 0.1);
}

body {
    background: var(--page-bg) !important;
    color: var(--text-dark);
}

/* ── Strip gradients app-wide ── */
.sidebar-header,
.mobile-logo,
.sidebar .logo-text h2,
.logo-icon,
.card-icon,
.summary-card::before,
.chart-card::before,
.table-card::before,
.sticky-header,
.mobile-header,
.nav-link.active,
.user-avatar,
.pharmacy-stat-icon,
.progress-fill,
.floating-badge,
.nav-badge,
.sidebar-header::before {
    background-image: none !important;
}

/* ══════════════════════════════════════════════════════════
   SIDEBAR — KitMedical hkits-sidebar / hkits-menu-head layout
   ══════════════════════════════════════════════════════════ */
body.kitsofts-app .sidebar,
body .sidebar {
    width: 240px !important;
    background: var(--sidebar-bg) !important;
    border-right: 0 !important;
    box-shadow: var(--sidebar-shadow) !important;
    backdrop-filter: none !important;
    border-radius: 0 !important;
}

body.kitsofts-app .sidebar-header,
body .sidebar-header {
    padding: 14px 12px !important;
    background: var(--chrome-bg) !important;
    border-bottom: 3px solid var(--chrome-bg-dark) !important;
    overflow: visible !important;
}

body.kitsofts-app .sidebar-header::before,
body .sidebar-header::before {
    display: none !important;
    opacity: 0 !important;
}

body.kitsofts-app .sidebar .logo-text h2,
body .sidebar .logo-text h2 {
    color: var(--chrome-text) !important;
    background: none !important;
    -webkit-text-fill-color: var(--chrome-text) !important;
    font-size: 15px !important;
    font-weight: bold !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

body.kitsofts-app .sidebar .logo-text p,
body .sidebar .logo-text p {
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: 12px !important;
}

body.kitsofts-app .logo-icon,
body .logo-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 0 !important;
    background: var(--primary) !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 16px !important;
}

body.kitsofts-app .sidebar-logout,
body .sidebar-logout {
    position: absolute;
    right: 10px;
    top: 12px;
    width: 32px;
    height: 32px;
    border-radius: 0 !important;
    color: var(--chrome-text) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    transform: none !important;
}

body.kitsofts-app .sidebar-logout:hover,
body .sidebar-logout:hover {
    background: rgba(255, 255, 255, 0.22) !important;
    color: var(--chrome-text) !important;
    transform: none !important;
}

body.kitsofts-app .sidebar-nav,
body .sidebar-nav {
    padding: 14px 10px 10px !important;
    background: var(--sidebar-inner) !important;
    flex: 1;
    overflow-y: auto;
}

body.kitsofts-app .nav-section,
body.kitsofts-app details.nav-collapsible,
body .nav-section,
body details.nav-collapsible {
    margin-bottom: 8px !important;
}

/* Section headers — dark blue on dark sidebar */
body.kitsofts-app details.nav-collapsible > summary.nav-title,
body.kitsofts-app .nav-title,
body details.nav-collapsible > summary.nav-title,
body .nav-title {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    padding: 12px 12px !important;
    margin: 0 0 4px !important;
    color: var(--sidebar-item-text) !important;
    font-weight: bold !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    background: var(--sidebar-item-bg) !important;
    border: 0 !important;
    border-left: 5px solid var(--pale-blue-mid) !important;
    border-bottom: 1px solid var(--sidebar-item-border) !important;
    border-radius: 0 !important;
    line-height: 1.35 !important;
    box-shadow: none !important;
    cursor: pointer;
    list-style: none;
}

body.kitsofts-app .nav-title::before,
body .nav-title::before {
    display: none !important;
}

body.kitsofts-app details.nav-collapsible > summary.nav-title:hover,
body.kitsofts-app .nav-title:hover,
body details.nav-collapsible > summary.nav-title:hover {
    background: var(--sidebar-item-hover) !important;
    color: var(--sidebar-item-text) !important;
}

body.kitsofts-app details.nav-collapsible > summary .nav-chevron,
body details.nav-collapsible > summary .nav-chevron {
    margin-left: auto !important;
    padding-left: 8px !important;
    font-size: 11px !important;
    opacity: 1 !important;
    color: inherit !important;
}

/* Menu links — KitMedical hkits-menu-head */
body.kitsofts-app .sidebar .nav-link,
body.kitsofts-app .nav-link,
body .sidebar .nav-link,
body .nav-link {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    padding: 14px 12px !important;
    margin: 0 0 8px !important;
    color: var(--sidebar-item-text) !important;
    font-weight: bold !important;
    font-size: 15px !important;
    background: var(--sidebar-item-bg) !important;
    border: 0 !important;
    border-left: 5px solid var(--pale-blue-mid) !important;
    border-bottom: 1px solid var(--sidebar-item-border) !important;
    border-radius: 0 !important;
    text-decoration: none !important;
    line-height: 1.35 !important;
    box-shadow: none !important;
    transform: none !important;
    transition: background 0.15s ease, color 0.15s ease !important;
}

body.kitsofts-app .sidebar .nav-link i,
body.kitsofts-app .nav-link i,
body .sidebar .nav-link i,
body .nav-link i {
    width: 1.45em !important;
    font-size: 16px !important;
    color: var(--pale-blue-mid) !important;
    flex-shrink: 0;
    margin-right: 10px !important;
    text-align: center;
}

body.kitsofts-app .sidebar .nav-link:hover,
body.kitsofts-app .nav-link:hover,
body .sidebar .nav-link:hover,
body .nav-link:hover {
    background: var(--sidebar-item-hover) !important;
    color: var(--sidebar-item-text) !important;
    border-left-color: var(--pale-blue-light) !important;
    transform: none !important;
}

body.kitsofts-app .sidebar .nav-link:hover i,
body.kitsofts-app .nav-link:hover i {
    color: #fff !important;
}

body.kitsofts-app .sidebar .nav-link.active,
body.kitsofts-app .nav-link.active,
body .sidebar .nav-link.active,
body .nav-link.active {
    background: var(--primary-light) !important;
    color: var(--chrome-text) !important;
    border-left-color: var(--pale-blue-light) !important;
    box-shadow: none !important;
}

body.kitsofts-app .sidebar .nav-link.active i,
body.kitsofts-app .nav-link.active i {
    color: #fff !important;
}

/* Submenu links inside collapsible sections */
body.kitsofts-app .nav-links,
body .nav-links {
    list-style: none !important;
    margin: 0 !important;
    padding: 4px 0 6px !important;
    background: var(--sidebar-submenu-bg) !important;
    border-left: 5px solid var(--pale-blue-mid) !important;
    border-bottom: 1px solid var(--sidebar-item-border) !important;
}

body.kitsofts-app .nav-links .nav-link,
body .nav-links .nav-link {
    padding: 11px 14px !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-weight: normal !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-top: 1px solid var(--sidebar-item-border) !important;
    border-bottom: 0 !important;
    background: var(--sidebar-submenu-bg) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.kitsofts-app .nav-links li:first-child .nav-link,
body .nav-links li:first-child .nav-link {
    border-top: 0 !important;
}

body.kitsofts-app .nav-links .nav-link:hover,
body .nav-links .nav-link:hover {
    background: var(--sidebar-item-hover) !important;
    color: #fff !important;
}

body.kitsofts-app .nav-links .nav-link.active,
body .nav-links .nav-link.active {
    background: var(--primary-light) !important;
    color: #fff !important;
    font-weight: bold !important;
}

body.kitsofts-app .main-content,
body .main-content {
    margin-left: 240px !important;
}

/* ── App / page headers — full navy bar ── */
.sticky-header,
.mobile-header {
    background: var(--chrome-bg) !important;
    border-bottom: 3px solid var(--chrome-bg-dark) !important;
    box-shadow: none !important;
}

.sticky-header .page-title,
.mobile-logo,
.sticky-header .page-title i {
    color: var(--chrome-text) !important;
    background: none !important;
    -webkit-text-fill-color: var(--chrome-text) !important;
}

.mobile-menu-btn,
.mobile-logout-btn,
.header-action-btn,
.header-logout-btn,
.lang-btn {
    color: var(--chrome-text) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    border-radius: 0 !important;
}

.mobile-menu-btn:hover,
.mobile-logout-btn:hover,
.header-action-btn:hover,
.header-logout-btn:hover,
.lang-btn:hover {
    background: rgba(255, 255, 255, 0.22) !important;
    color: var(--chrome-text) !important;
}

.lang-btn.active {
    background: rgba(255, 255, 255, 0.28) !important;
    color: var(--chrome-text) !important;
    border-color: rgba(255, 255, 255, 0.4) !important;
}

.main-content,
.dashboard-content {
    background: var(--page-bg) !important;
}

/* ── Cards — pale blue bodies ── */
.summary-card,
.chart-card,
.table-card,
.shop-overview-card,
.pharmacy-stat-card,
.stat-card {
    background: var(--pale-blue-light) !important;
    border: 2px solid var(--pale-blue-mid) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.table-card::before,
.chart-card::before,
.summary-card::before {
    background: var(--chrome-bg) !important;
}

/* Dashboard / module section titles */
.table-title,
.chart-title,
.card-section-title,
.table-card .table-header,
.chart-card > h3,
.chart-card > h4 {
    background: var(--chrome-bg) !important;
    color: var(--chrome-text) !important;
    padding: 10px 12px !important;
    margin: -15px -15px 12px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-bottom: 2px solid var(--chrome-bg-dark) !important;
}

.table-title i,
.chart-title i {
    color: var(--chrome-text) !important;
}

.table-responsive {
    background: var(--pale-blue-light);
}

/* Table headers — navy chrome */
.table th,
.table thead th {
    background: var(--chrome-bg) !important;
    color: var(--chrome-text) !important;
    border-bottom-color: var(--chrome-bg-dark) !important;
    font-weight: bold !important;
}

.table td {
    background: var(--pale-blue-light) !important;
    border-bottom-color: var(--pale-blue-mid) !important;
    color: var(--text-dark) !important;
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
    background: var(--pale-blue) !important;
}

.table tr:hover td {
    background: var(--pale-blue-mid) !important;
}

.card-icon.primary { background: var(--primary) !important; }
.card-icon.success { background: var(--success) !important; }
.card-icon.danger { background: var(--danger) !important; }
.card-icon.warning { background: var(--warning) !important; }
.card-icon.info { background: var(--info) !important; }

.bottom-nav {
    background: var(--pale-blue-light);
    border-top: 2px solid var(--pale-blue-mid);
    box-shadow: none;
}

.bottom-nav-item.active { color: var(--primary); }

.nav-badge.success, .floating-badge.success { background: var(--success); }
.nav-badge.warning, .floating-badge.warning { background: var(--warning); }
.nav-badge.danger, .floating-badge.danger { background: var(--danger); }

.progress-fill { background: var(--primary); }
.progress-fill.danger { background: var(--danger); }
.progress-fill.warning { background: var(--warning); }
.progress-fill.success { background: var(--success); }

.pharmacy-stat-icon.expired { background: var(--danger); }
.pharmacy-stat-icon.expiring { background: var(--warning); }
.pharmacy-stat-icon.lowstock { background: var(--secondary); }
.pharmacy-stat-icon.prescriptions { background: var(--success); }

/* ── Forms & panels ── */
body.kitsofts-flat-bootstrap .panel,
body.kitsofts-flat-bootstrap .well {
    background: var(--surface);
    border-color: rgba(var(--primary-rgb), 0.2);
    border-radius: 0;
}

body.kitsofts-flat-bootstrap .panel-default > .panel-heading,
body.kitsofts-flat-bootstrap .panel-heading {
    background: var(--chrome-bg);
    border-color: var(--chrome-bg-dark);
    color: var(--chrome-text);
}

body.kitsofts-flat-bootstrap .panel-primary > .panel-heading {
    background: var(--chrome-bg);
    color: var(--chrome-text);
    border-color: var(--chrome-bg-dark);
}

body.kitsofts-flat-bootstrap .panel-body {
    background: var(--pale-blue-light);
}

body.kitsofts-flat-bootstrap .form-control {
    background: var(--pale-blue-soft);
    border-color: var(--pale-blue-mid);
    border-radius: 0;
}

body.kitsofts-flat-bootstrap select.form-control {
    background: var(--pale-blue) !important;
}

body.kitsofts-flat-bootstrap .btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary-dark) !important;
    color: #fff !important;
}

body.kitsofts-flat-bootstrap .btn-default {
    background-color: var(--pale-blue-light);
    border-color: var(--pale-blue-mid);
    color: var(--primary);
    border-radius: 0;
}

body.kitsofts-flat-bootstrap .btn-default:hover,
body.kitsofts-flat-bootstrap .btn-default:focus {
    background-color: var(--pale-blue);
    border-color: var(--primary);
    color: var(--primary-dark);
}

body.kitsofts-flat-bootstrap .modal-header {
    background: var(--chrome-bg) !important;
    color: var(--chrome-text) !important;
}

body.kitsofts-flat-bootstrap .modal-body {
    background: var(--pale-blue-light) !important;
}

body.kitsofts-flat-bootstrap .modal-footer {
    background: var(--pale-blue-soft) !important;
}

/* ── Business module pages ── */
body.kitsofts-business-module .business-module-page,
body.kitsofts-business-module .expenses-page {
    background: transparent !important;
    color: var(--text-dark) !important;
}

body.kitsofts-business-module .container .stat-card,
body.kitsofts-business-module .filters-bar {
    background: var(--pale-blue-light) !important;
    border-color: var(--pale-blue-mid) !important;
    color: var(--text-dark) !important;
}

/* Filter panel heads — navy; bodies — pale blue */
body.kitsofts-business-module .filters-section .filters-header,
body.kitsofts-business-module .filter-panel-head {
    background: var(--chrome-bg) !important;
    color: var(--chrome-text) !important;
}

body.kitsofts-business-module .filters-section .filters-body,
body.kitsofts-business-module .filter-panel-body {
    background: var(--pale-blue-soft) !important;
}

body .demo-mode-banner,
div[style*="background:#0d9488"],
div[style*="background: #0d9488"] {
    background: var(--secondary) !important;
}

@media (max-width: 1024px) {
    body.kitsofts-app .main-content,
    body .main-content {
        margin-left: 0 !important;
    }
}