/* ===== HOME DASHBOARD ===== */

.home-wrap {
    max-width: 900px;
    margin: auto;
    padding: 20px;
}

.home-header {
    margin-bottom: 24px;
}

    .home-header h2 {
        margin: 0;
        color: var(--text);
    }

.welcome {
    color: var(--muted);
    margin-top: 6px;
    font-size: 14px;
}

.menu-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
}

.menu-card {
    border-radius: 16px;
    padding: 20px;
    text-align: left;
    cursor: pointer;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, opacity 0.18s ease;
    border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

    .menu-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 24px rgba(0, 0, 0, 0.26);
    }

    .menu-card .icon {
        font-size: 28px;
        margin-bottom: 12px;
    }

    .menu-card .title {
        font-weight: 600;
        margin-bottom: 6px;
        font-size: 16px;
    }

    .menu-card .desc {
        font-size: 13px;
        opacity: .92;
    }

    .menu-card.orders {
        background: linear-gradient(135deg, #1976d2, #42a5f5);
        box-shadow: 0 6px 18px rgba(25, 118, 210, .35);
    }

    .menu-card.awaiting {
        background: linear-gradient(135deg, #ff9800, #ffc107);
        box-shadow: 0 6px 18px rgba(255, 152, 0, .35);
    }

    .menu-card.reserves {
        background: linear-gradient(135deg, #00897b, #26c6da);
        box-shadow: 0 6px 18px rgba(0, 137, 123, .30);
    }

    .menu-card.workers {
        background: linear-gradient(135deg, #6a1b9a, #ab47bc);
        box-shadow: 0 6px 18px rgba(106, 27, 154, .30);
    }

    .menu-card.defected {
        background: linear-gradient(135deg, #c62828, #ef5350);
        box-shadow: 0 6px 18px rgba(198, 40, 40, .30);
    }

    .menu-card.dashboard {
        background: linear-gradient(135deg, #2e7d32, #66bb6a);
        box-shadow: 0 6px 18px rgba(46, 125, 50, .30);
    }

    .menu-card.deleted {
        background: linear-gradient(135deg, #2d3436, #636e72);
        box-shadow: 0 6px 18px rgba(45, 52, 54, .35);
    }

    .menu-card.settings {
        background: linear-gradient(135deg, #37474f, #607d8b);
        box-shadow: 0 6px 18px rgba(55, 71, 79, .30);
    }

    .menu-card.admin {
        background: linear-gradient(135deg, #2e7d32, #66bb6a);
        box-shadow: 0 6px 18px rgba(46, 125, 50, .35);
    }

@media (max-width: 600px) {
    .home-wrap {
        padding: 14px;
    }

    .menu-card {
        padding: 16px;
    }
}