/* style.css */

/* --- 1. GLOBAL & TYPOGRAPHY --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

body {
    background-color: #f4f5f7; /* Limetray Light Grey */
    font-family: 'Inter', sans-serif;
    color: #333;
}

/* --- 2. DASHBOARD CARDS (Floor Map) --- */
.dash-card {
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.02);
    transition: all 0.2s ease;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.dash-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 16px rgba(0,0,0,0.06);
    border-color: #ccc;
}

/* Large Table Number */
.table-num {
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1;
    color: #bdc3c7; /* Default Grey */
    opacity: 0.5;
}

/* Waiter Badge */
.waiter-badge {
    font-size: 0.75rem;
    color: #7f8c8d;
    font-weight: 500;
}

/* --- 3. STATUS LOGIC (Colors) --- */
/* Red (Seated / Attention) */
.st-seated { color: #ff5252; }
.card-seated { border-left: 5px solid #ff5252; }
.card-seated .table-num { color: #ff5252; opacity: 1; }

/* Orange (Ordered / Cooking) */
.st-ordered { color: #ffb300; }
.card-ordered { border-left: 5px solid #ffb300; }
.card-ordered .table-num { color: #ffb300; opacity: 1; }

/* Green (Served / Done) */
.st-served { color: #4caf50; }
.card-served { border-left: 5px solid #4caf50; }
.card-served .table-num { color: #4caf50; opacity: 1; }

/* Grey (Empty) */
.st-empty { color: #9e9e9e; }
.card-empty { border-left: 5px solid #e0e0e0; }


/* --- 4. MOBILE POS VIEW (Active Table) --- */
.mobile-view-container {
    padding-bottom: 90px; /* Space for footer */
}

/* Order Item Cards (Mobile List) */
.mobile-card {
    background: white;
    border: 1px solid #eee;
    border-left-width: 5px; /* Status indicator */
    border-radius: 8px;
    transition: 0.2s;
}

/* Status Colors for Mobile Cards */
.status-draft { border-left-color: #6c757d; }
.status-pending { border-left-color: #ffc107; }
.status-prepared { border-left-color: #198754; }
.status-cancelled { border-left-color: #dc3545; opacity: 0.6; }

/* Sticky Header Details */
.sticky-header-info {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #eaeaea;
}

/* --- 5. FLOATING FOOTER (Actions) --- */
.action-footer {
    position: fixed; 
    bottom: 0; 
    left: 0; 
    right: 0;
    background: white; 
    box-shadow: 0 -4px 20px rgba(0,0,0,0.08);
    padding: 15px; 
    z-index: 1040;
    border-top: 1px solid #eee;
}

/* --- 6. MENU DRAWER (Offcanvas) --- */
.menu-btn {
    height: 80px; 
    display: flex; 
    flex-direction: column; 
    justify-content: center; 
    align-items: start;
    border: 1px solid #eee;
    background: #fff;
    transition: 0.2s;
}
.menu-btn:active {
    background: #f8f9fa;
    transform: scale(0.98);
}