/* ========================================================
   Cafeku Admin — Modern, clean, warm
   ======================================================== */
:root {
    --primary: #8B4513;
    --primary-dark: #5a2e0c;
    --accent: #D4A373;
    --bg: #f8f9fa;
    --sidebar-bg: #1a1a2e;
    --sidebar-hover: #16213e;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    background: var(--bg);
    color: #2d2d2d;
}

#topnav {
    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%) !important;
    z-index: 1030;
}

#topnav .navbar-brand { color: var(--accent) !important; }

#sidebarMenu {
    background: var(--sidebar-bg) !important;
    min-height: calc(100vh - 60px);
}

#sidebarMenu .nav-link {
    color: rgba(255,255,255,0.7);
    padding: .65rem 1rem;
    border-left: 3px solid transparent;
    transition: all .2s;
    font-size: .92rem;
}

#sidebarMenu .nav-link:hover {
    color: #fff;
    background: var(--sidebar-hover);
    border-left-color: var(--accent);
}

#sidebarMenu .nav-link.active {
    color: #fff;
    background: var(--sidebar-hover);
    border-left-color: var(--accent);
    font-weight: 600;
}

#sidebarMenu .nav-link i { margin-right: 8px; }

.sidebar-heading {
    font-size: .7rem;
    letter-spacing: .1em;
}

/* ===== Stat cards ===== */
.stat-card { transition: all .2s; border-radius: 12px; }
.stat-card:hover { transform: translateY(-3px); box-shadow: 0 .3rem .8rem rgba(0,0,0,.1) !important; }
.stat-icon {
    width: 52px; height: 52px;
    border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
}

/* ===== Cards ===== */
.card { border-radius: 12px; }
.card-header { border-radius: 12px 12px 0 0 !important; }
.table > :not(caption) > * > * { padding: .85rem .9rem; }

/* ===== Badge categories ===== */
.badge-coffee     { background: #8B4513; color: #fff; }
.badge-non-coffee { background: #D4A373; color: #2d2d2d; }
.badge-food       { background: #C9302C; color: #fff; }
.badge-snack      { background: #FFA500; color: #2d2d2d; }
.badge-dessert    { background: #6F4E37; color: #fff; }

/* ===== Login page ===== */
.login-page {
    min-height: 100vh;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #8B4513 0%, #5a2e0c 50%, #1a1a2e 100%);
    padding: 1rem;
}

.login-box {
    background: #fff;
    padding: 2.5rem 2rem;
    border-radius: 16px;
    width: 100%;
    max-width: 420px;
    box-shadow: 0 1rem 3rem rgba(0,0,0,.3);
}

.login-icon {
    width: 80px; height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--primary));
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff;
    font-size: 2.5rem;
}

.animate-in { animation: fadeUp .6s ease; }
@keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ===== Moka test cards ===== */
.test-card { transition: all .2s; cursor: pointer; }
.test-card:hover { transform: translateY(-4px); box-shadow: 0 .4rem 1rem rgba(0,0,0,.1) !important; }

/* ===== Responsive ===== */
@media (max-width: 768px) {
    main { padding-top: 1rem !important; }
}