/* =============================================================================
   RivalScan — responsive.css
   Todos os breakpoints do sistema
   mobile < 768px | tablet 768-1023px | desktop 1024-1439px | large >= 1440px
   ============================================================================= */

/* ─────────────────────────────────────────────────────────────────────────────
   MOBILE  (< 768px)
   ───────────────────────────────────────────────────────────────────────────── */
@media (max-width: 767px) {

    /* Auth */
    .auth-card           { padding: 28px 20px 24px; }
    .auth-card.wide      { max-width: 100%; }
    .auth-title          { font-size: 20px; }
    .auth-glow           { width: 300px; height: 300px; }

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

    /* Botões */
    .btn-primary,
    .btn-secondary       { width: 100%; }

    /* App shell */
    .app-sidebar {
        transform: translateX(-100%);
        width: 280px;
    }

    .app-sidebar.open    { transform: translateX(0); }

    .app-main,
    .app-footer          { margin-left: 0; padding-left: 16px; padding-right: 16px; }

    .header-search       { display: none; }
    .header-brand        { display: none; }
    .header-menu-btn     { display: flex; }
    .header-trial        { display: none; }
}

/* ─────────────────────────────────────────────────────────────────────────────
   TABLET  (768px – 1023px)
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 768px) and (max-width: 1023px) {

    /* Auth */
    .auth-card { max-width: 480px; }

    /* App shell — sidebar colapsada */
    .app-sidebar         { width: var(--sidebar-collapsed); }
    .app-sidebar .sidebar-label,
    .app-sidebar .nav-item span,
    .app-sidebar .nav-item .nav-badge,
    .app-sidebar .sidebar-plan { display: none; }
    .app-sidebar .nav-item     { justify-content: center; padding: 10px; }

    .app-main,
    .app-footer          { margin-left: var(--sidebar-collapsed); }

    .header-search       { display: none; }
}

/* ─────────────────────────────────────────────────────────────────────────────
   DESKTOP  (1024px – 1439px)
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 1024px) {
    /* App shell padrão — implementado no Lote 3 */
}

/* ─────────────────────────────────────────────────────────────────────────────
   LARGE  (>= 1440px)
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 1440px) {
    /* Expansões de layout grande — implementado nos próximos lotes */
}