/* =============================================================
   PC License Manager — Main Stylesheet
   ============================================================= */

:root {
    --sidebar-w: 230px;
    --topbar-h:  54px;
}

/* ---- Base ---- */
body {
    font-family: 'Segoe UI', system-ui, sans-serif;
    background: #f0f2f5;
    color: #343a40;
}

/* =============================================================
   LAYOUT — Sidebar + Main Content
   ============================================================= */
.wrapper { min-height: 100vh; }

/* SIDEBAR */
#sidebar {
    width: var(--sidebar-w);
    min-height: 100vh;
    flex-shrink: 0;
    transition: width 0.25s ease;
    overflow: hidden;
    white-space: nowrap;
}
#sidebar.collapsed { width: 0; }

.sidebar-brand { min-height: var(--topbar-h); }
.sidebar-text  { transition: opacity 0.2s; }
#sidebar.collapsed .sidebar-text { opacity: 0; }

/* Active nav link */
#sidebar .nav-link { transition: background 0.15s; font-size: .9rem; }
#sidebar .nav-link:hover:not(.active) { background: rgba(255,255,255,.08) !important; color: #fff !important; }

/* MAIN CONTENT */
#main-content {
    min-width: 0;
    min-height: 100vh;
}
.content-area { flex: 1; }

/* =============================================================
   STAT CARDS
   ============================================================= */
.stat-card { border-radius: 14px; transition: transform .2s, box-shadow .2s; }
.stat-card:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,.1) !important; }

.stat-icon {
    width:  56px;
    height: 56px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.stat-label { font-size: .75rem; color: #6c757d; text-transform: uppercase; letter-spacing: .04em; }
.stat-value { font-size: 1.9rem; font-weight: 700; line-height: 1.1; }

/* =============================================================
   CARDS
   ============================================================= */
.card { border-radius: 12px; }
.card-header { border-radius: 12px 12px 0 0 !important; padding: .85rem 1.25rem; }

/* =============================================================
   TABLES
   ============================================================= */
.table th {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #6c757d;
    border-bottom-width: 1px;
}
.table td { vertical-align: middle; }

/* =============================================================
   NAVBAR (top bar)
   ============================================================= */
.navbar { min-height: var(--topbar-h); flex-wrap: nowrap; }

/* =============================================================
   BADGES & CODE
   ============================================================= */
code {
    font-family: 'Consolas', 'Courier New', monospace;
    font-size: .85em;
}

/* =============================================================
   LOGIN PAGE
   ============================================================= */
.login-page {
    background: linear-gradient(135deg, #0d1b2a 0%, #1b2a4a 50%, #16213e 100%);
    min-height: 100vh;
}
.login-card {
    background: rgba(255, 255, 255, .08);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,.15);
    border-radius: 18px;
}
.login-card .form-control,
.login-card .input-group-text {
    background: rgba(255,255,255,.9);
    border-color: rgba(255,255,255,.3);
}
.login-icon {
    width: 72px; height: 72px;
    background: rgba(255,193,7,.15);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin: 0 auto;
    font-size: 2rem;
    color: #ffc107;
}

/* =============================================================
   ALERTS
   ============================================================= */
.alert { border-radius: 10px; }

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width: 768px) {
    #sidebar {
        position: fixed;
        z-index: 1050;
        height: 100vh;
        top: 0; left: 0;
    }
    #sidebar:not(.collapsed) ~ #main-content::before {
        content: '';
        position: fixed; inset: 0;
        background: rgba(0,0,0,.4);
        z-index: 1040;
    }
}