/* ========================================================================
   Responsive — Tablet (768px) and Phone (480px) breakpoints
   ======================================================================== */

/* --- Tablet --- */
@media (max-width: 768px) {
    .slot-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .container {
        padding: var(--space-4);
    }
    .modal {
        min-width: unset;
        width: calc(100% - var(--space-6));
    }
}

/* --- Phone --- */
@media (max-width: 480px) {
    /* Global tap target minimum */
    button, .btn, a.btn {
        min-height: 44px;
        min-width: 44px;
    }

    /* Container */
    .container { padding: var(--space-3); }

    /* Header */
    .header { padding: var(--space-3) var(--space-4); }
    .header h1 { font-size: var(--text-lg); }
    .header .user-chip { display: none; }

    /* Active bar */
    #active-bar { padding: var(--space-2) var(--space-3); }

    /* Navigation: show hamburger, hide secondary */
    .nav { padding: 0 var(--space-2); }
    .nav .nav-secondary { display: none !important; }
    .nav .nav-spacer { display: none; }
    .nav-hamburger { display: flex; margin-left: auto; }

    /* Slot grid: single column */
    .slot-grid { grid-template-columns: 1fr; }

    /* Slot card: mobile action row */
    .slot-card .slot-clear-btn,
    .slot-card .slot-gear-btn { display: none; }
    .slot-action-row { display: flex; }

    /* Slot start/stop buttons */
    .slot-start-btn { min-height: 44px; }

    /* Log table: scrollable wrapper */
    .log-table-scroll {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 calc(var(--space-3) * -1);
        padding: 0 var(--space-3);
    }

    /* Log action buttons */
    .log-table .btn {
        padding: var(--space-2) var(--space-3);
        font-size: var(--text-sm);
        min-height: 44px;
    }

    /* Day nav and timeline zoom */
    .tl-zoom-btn {
        min-width: 44px;
        min-height: 44px;
        font-size: var(--text-base);
    }

    /* Modals: full width */
    .modal {
        min-width: unset;
        width: calc(100% - var(--space-4));
        max-height: 90vh;
        overflow-y: auto;
    }

    /* Suggestions: stack layout */
    .suggestion-card {
        flex-direction: column;
        gap: var(--space-3);
    }
    .suggestion-card .btn {
        width: 100%;
        min-height: 44px;
        text-align: center;
    }

    /* Filter facets: tap targets */
    .facet-header {
        min-height: 44px;
        padding: var(--space-3) var(--space-4);
    }
    .facet-option {
        min-height: 36px;
        padding: var(--space-2) var(--space-3);
    }
    .filter-chip .chip-remove {
        width: 1.25rem;
        height: 1.25rem;
    }
    .active-filter-chips .chips-clear-btn {
        min-height: 36px;
    }
    .suggestions-load-more-btn {
        min-height: 44px;
    }
}