/* ═══════════════════════════════════════════════════
   RESPONSIVE — MEDIA QUERIES
   ═══════════════════════════════════════════════════ */

@media (max-width: 900px) {
    .detail-layout { flex-direction: column; }
    .detail-layout.log-open .detail-log-panel { width: 100%; }
}

@media (max-width: 768px) {
    :root { --sidebar-w: 0px; }

    .sidebar {
        position: fixed;
        bottom: 0; left: 0; right: 0;
        width: 100%;
        min-width: 100%;
        height: auto;
        flex-direction: row;
        border-right: none;
        border-top: 1px solid var(--border-subtle);
        z-index: 100;
        background: var(--sidebar-mobile-bg);
    }
    .sidebar-brand { display: none; }
    .sidebar-nav {
        flex-direction: row;
        flex: 1;
        padding: 6px 8px;
        gap: 4px;
        justify-content: center;
    }
    .nav-link {
        flex-direction: column;
        gap: 3px;
        font-size: 10.5px;
        padding: 8px 16px;
        text-align: center;
    }
    .nav-link.active::before { display: none; }
    .nav-link-text { display: block; }
    .sidebar-footer { display: none; }

    .main-area { height: calc(100vh - 56px); }
    .content-area { padding: 20px 16px; }

    .topbar { padding: 0 16px; }

    .form-row { grid-template-columns: 1fr; }

    .toast-container { bottom: 72px; right: 16px; left: 16px; }
    .toast { max-width: 100%; }

    .job-card { flex-direction: column; align-items: flex-start; }

    .accounts-header { flex-direction: column; align-items: stretch; gap: 8px; }

    .schedule-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    .schedule-actions {
        margin-left: 0;
        align-self: flex-end;
    }
}
