[x-cloak] { display: none !important; }

html, body { height: 100%; }
body {
    background-color: #f4f6f8;
    -webkit-tap-highlight-color: transparent;
}

.auth-shell {
    max-width: 420px;
    margin: 0 auto;
    padding: 2rem 1rem;
}

.qty-input {
    width: 5.5rem;
    text-align: center;
    font-weight: 600;
}

.btn.active {
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.4);
}

.list-group-item .gap-2 > * { flex-shrink: 0; }
.list-group-item .flex-grow-1 { min-width: 0; flex-shrink: 1; }

.table > :not(caption) > * > * { vertical-align: middle; }

@media (max-width: 575.98px) {
    .navbar-brand { font-size: 1rem; }
    .container, .container-fluid { padding-left: .75rem; padding-right: .75rem; }
}

/* ===== Admin sidebar layout ===== */
.admin-sidebar {
    width: 240px;
    background-color: #1f2937;
}

.admin-nav .nav-link {
    color: rgba(255, 255, 255, .75);
    border: 0;
    background: transparent;
    border-radius: .375rem;
    padding: .55rem .85rem;
    margin-bottom: .15rem;
    font-weight: 500;
    transition: background-color .12s, color .12s;
}
.admin-nav .nav-link:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, .08);
}
.admin-nav .nav-link.active {
    color: #fff;
    background-color: #0d6efd;
}
.admin-nav .nav-link i {
    width: 1.25rem;
    text-align: center;
}

@media (min-width: 768px) {
    .admin-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 1030;
        display: flex;
        flex-direction: column;
        visibility: visible !important;
        transform: none !important;
    }
    .admin-main {
        margin-left: 240px;
    }
    .admin-topbar { display: none !important; }
}

@media (max-width: 767.98px) {
    .admin-main { margin-left: 0; }
}