/* ================================================
   AIMARTVA — SIDEBAR STYLES
   ფაილი: /public_html/assets/css/sidebar.css
   
   sidebar.php-დან ამოღებული ყველა სტილი.
   header.php-ში ჩართე: <link rel="stylesheet" href="assets/css/sidebar.css?v=1">
================================================ */

/* ===== SIDEBAR LAYOUT ===== */
.dash-sidebar {
    position: fixed !important;
    top: calc(var(--dash-header-h, 92px) + 14px) !important;
    bottom: calc(var(--dash-footer-h, 54px) + 14px) !important;
    left: max(24px, calc((100vw - 1500px) / 2 + 24px)) !important;
    width: var(--dash-sidebar-w, 280px) !important;
    min-width: var(--dash-sidebar-w, 280px) !important;
    height: auto !important;
    max-height: none !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

.sb-nav {
    flex: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 4px 0;
}

.sb-widget { flex-shrink: 0; }

.sb-user { padding: 14px 16px 8px !important; }
.sb-item { padding: 7px 14px !important; margin: 0 10px !important; }
.sb-divider { margin: 2px 16px !important; }

/* ===== WIDGET (Countdown) ===== */
.sb-widget { padding: 10px 14px 12px !important; margin: 0 10px 10px !important; }
.sb-cd-row { margin-bottom: 6px; }
.sb-cd-msg { font-size: 9px !important; margin-bottom: 4px; }
.sb-cd-selects { gap: 4px !important; margin-bottom: 4px; }
.sb-cd-selects select { padding: 4px 6px !important; font-size: 11px !important; }
.sb-cd-btn { padding: 5px 12px !important; font-size: 11px !important; }
.sb-widget-title { font-size: 10px !important; margin-bottom: 6px; }
.sb-cd-num { font-size: 18px !important; }
.sb-cd-lbl { font-size: 8px !important; }

/* ===== ICON COLORS ===== */
.icon-brand svg { stroke: #818cf8 !important; opacity: .9 !important; }
.icon-brand { background: rgba(99,102,241,.1) !important; }

.icon-slate svg { stroke: #94a3b8 !important; opacity: .85 !important; }
.icon-slate { background: rgba(148,163,184,.08) !important; }

.icon-steel svg { stroke: #7c8db5 !important; opacity: .85 !important; }
.icon-steel { background: rgba(124,141,181,.08) !important; }

.icon-indigo svg { stroke: #6d7bd4 !important; opacity: .85 !important; }
.icon-indigo { background: rgba(109,123,212,.08) !important; }

.icon-cool svg { stroke: #6b9fc8 !important; opacity: .85 !important; }
.icon-cool { background: rgba(107,159,200,.08) !important; }

.icon-warn svg { stroke: #c47070 !important; opacity: .85 !important; }
.icon-warn { background: rgba(196,112,112,.08) !important; }

.icon-ash svg { stroke: #9a8ea8 !important; opacity: .85 !important; }
.icon-ash { background: rgba(154,142,168,.08) !important; }

.icon-amber svg { stroke: #b8975a !important; opacity: .85 !important; }
.icon-amber { background: rgba(184,151,90,.08) !important; }

.icon-logout svg { stroke: #c47070 !important; opacity: .7 !important; }
.icon-logout { background: rgba(196,112,112,.06) !important; }

/* ===== ICON HOVER ===== */
.sb-item:hover .icon-brand { background: rgba(99,102,241,.15) !important; }
.sb-item:hover .icon-slate { background: rgba(148,163,184,.12) !important; }
.sb-item:hover .icon-steel { background: rgba(124,141,181,.12) !important; }
.sb-item:hover .icon-indigo { background: rgba(109,123,212,.12) !important; }
.sb-item:hover .icon-cool { background: rgba(107,159,200,.12) !important; }
.sb-item:hover .icon-warn { background: rgba(196,112,112,.12) !important; }
.sb-item:hover .icon-ash { background: rgba(154,142,168,.12) !important; }
.sb-item:hover .icon-amber { background: rgba(184,151,90,.12) !important; }
.sb-logout-item:hover .icon-logout { background: rgba(196,112,112,.14) !important; }
.sb-logout-item:hover .icon-logout svg { opacity: 1 !important; }
.sb-item:hover .sb-item-icon svg { opacity: 1 !important; }
.sb-item:hover .sb-item-icon { transform: scale(1.04); }

/* ===== ICON ACTIVE ===== */
.sb-item.active .icon-brand { background: rgba(99,102,241,.16) !important; box-shadow: 0 0 10px rgba(99,102,241,.12); }
.sb-item.active .icon-slate { background: rgba(148,163,184,.14) !important; box-shadow: 0 0 10px rgba(148,163,184,.1); }
.sb-item.active .icon-steel { background: rgba(124,141,181,.14) !important; box-shadow: 0 0 10px rgba(124,141,181,.1); }
.sb-item.active .icon-indigo { background: rgba(109,123,212,.14) !important; box-shadow: 0 0 10px rgba(109,123,212,.1); }
.sb-item.active .icon-cool { background: rgba(107,159,200,.14) !important; box-shadow: 0 0 10px rgba(107,159,200,.1); }
.sb-item.active .icon-warn { background: rgba(196,112,112,.14) !important; box-shadow: 0 0 10px rgba(196,112,112,.1); }
.sb-item.active .icon-ash { background: rgba(154,142,168,.14) !important; box-shadow: 0 0 10px rgba(154,142,168,.1); }
.sb-item.active .icon-amber { background: rgba(184,151,90,.14) !important; box-shadow: 0 0 10px rgba(184,151,90,.1); }
.sb-item.active .sb-item-icon svg { opacity: 1 !important; }

/* ===== ICON BASE ===== */
.sb-item-icon {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(255,255,255,.04);
    transition: all .3s cubic-bezier(.4,0,.2,1);
    flex-shrink: 0;
}
.sb-item-icon svg { transition: all .3s; opacity: .55; }

.sb-item-badge {
    font-size: .6rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 6px;
    background: rgba(99,102,241,.85);
    color: #fff;
    letter-spacing: .3px;
    text-transform: uppercase;
}
.err-badge { background: rgba(180,84,84,.85) !important; }

.sb-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.06), transparent);
}

.dash-sidebar.collapsed .sb-item-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
}

/* ===== MOBILE HAMBURGER BUTTON ===== */
.mobile-hamburger {
    display: none;
    position: fixed !important;
    top: 36px !important;
    right: 16px !important;   /* ← left-ის ნაცვლად right */
    left: auto !important;
    z-index: 99999 !important;
    width: 48px !important;
    height: 48px !important;
    width: 44px;
    height: 44px;
    border: none;
    border-radius: 14px;
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    box-shadow: 0 4px 20px rgba(99,102,241,.4);
    transition: all .3s;
}
.mobile-hamburger span {
    display: block;
    width: 22px;
    height: 2.5px;
    background: #fff;
    border-radius: 2px;
    transition: all .3s;
}
.mobile-hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.mobile-hamburger.active span:nth-child(2) { opacity: 0; }
.mobile-hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ===== MOBILE OVERLAY ===== */
.mobile-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(4px);
     z-index: 998;
    opacity: 0;
    transition: opacity .3s;
}
.mobile-overlay.active { opacity: 1; }

/* ===== MOBILE CLOSE BUTTON ===== */
.mobile-close-btn {
    display: none;
    position: absolute;
    top: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 12px;
    background: rgba(255,255,255,.1);
    color: #fff;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: all .2s;
}
.mobile-close-btn:hover {
    background: rgba(239,68,68,.2);
    color: #f87171;
}

/* ===== SIDEBAR MOBILE ===== */
@media (max-width: 900px) {
    .mobile-hamburger {
        display: flex;
    }
    .mobile-overlay {
        display: block;
    }
    .mobile-close-btn {
        display: flex;
    }

       .dash-sidebar {
    position: fixed !important;
    left: -300px !important;
    top: 0 !important;
    width: 280px !important;
    height: 100vh !important;
       z-index: 1001 !important;
    transition: left .3s cubic-bezier(.4,0,.2,1) !important;
    overflow-y: auto !important;
    padding-top: 70px !important;
    background: var(--bg-card, #1a1a3e) !important;  /* ← შეცვალე */
    border-right: 1px solid rgba(99,102,241,0.2) !important;
}
    .dash-sidebar.mobile-open {
        left: 0 !important;
         display: flex !important;
    }

    .sb-nav {
        justify-content: flex-start !important;
    }

    .dash-main {
        margin-left: 0 !important;
        width: 100% !important;
        padding: 70px 12px 20px !important;
    }

    .sb-user {
        margin: 0 16px 16px !important;
    }
    .sb-item {
        margin: 4px 12px !important;
        padding: 10px 14px !important;
    }
    .sb-widget {
        margin: 12px !important;
    }

    /* დამალე collapse ღილაკი მობილურზე */
    .dash-sidebar .sb-collapse-btn,
    .dash-sidebar [onclick*="toggleSidebar"] {
        display: none !important;
    }
    
     .dash-sidebar.mobile-open ~ .mobile-hamburger,
    body.sidebar-open .mobile-hamburger {
        display: none !important;
    }
    body.sidebar-open .mobile-hamburger,
.dash-sidebar.mobile-open ~ .mobile-hamburger {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}
}

@media (max-width: 480px) {
    .dash-sidebar {
        width: 260px !important;
    }
    .mobile-hamburger {
        width: 44px;
        height: 44px;
        top: 12px;
        /*left: 12px;*/
    }
    .sb-item span {
        font-size: .9rem;
    }
}