/* ===================================
   CSS Responsivo - Mobile First
   =================================== */

/* Tablet (768px e acima) */
@media (min-width: 768px) {
    .container {
        padding: 0 30px;
    }
    
    .navbar .container {
        padding: 15px 30px;
    }
    
    .main-content {
        padding: 50px 0;
    }
}

/* Desktop (1024px e acima) */
@media (min-width: 1024px) {
    .container {
        padding: 0 40px;
    }
    
    .navbar .container {
        padding: 15px 40px;
    }
    
    .main-content {
        padding: 60px 0;
    }
}

/* Mobile (até 640px) */
@media (max-width: 640px) {
    body {
        font-size: 14px;
    }
    
    .navbar .container {
        padding: 12px 15px;
    }
    
    .navbar-menu {
        flex-direction: column;
        gap: 15px;
        width: 100%;
    }
    
    .navbar-nav {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }
    
    .nav-link {
        display: block;
        padding: 10px 0;
    }
    
    .navbar-user,
    .navbar-auth {
        flex-direction: column;
        width: 100%;
    }
    
    .card {
        padding: 16px;
    }
    
    .card-footer {
        flex-direction: column;
    }
    
    .btn {
        width: 100%;
    }
    
    .table {
        font-size: 12px;
    }
    
    .table th,
    .table td {
        padding: 8px;
    }
    
    .form-control {
        font-size: 16px; /* Previne zoom em iOS */
    }
    
    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .footer-content {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .navbar-toggle {
        display: flex;
    }
}

/* Landscape mobile (até 768px de altura) */
@media (max-height: 768px) and (orientation: landscape) {
    .navbar {
        position: relative;
    }
    
    .main-content {
        padding: 20px 0;
    }
}

/* Impressão */
@media print {
    .navbar,
    .footer,
    .navbar-toggle,
    .btn-logout {
        display: none;
    }
    
    body {
        background-color: white;
    }
    
    .card {
        box-shadow: none;
        border: 1px solid #ccc;
        page-break-inside: avoid;
    }
}

/* Acessibilidade */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Modo escuro */
@media (prefers-color-scheme: dark) {
    .alert-success {
        background-color: #064e3b;
        color: #d1fae5;
        border-color: #047857;
    }
    
    .alert-danger {
        background-color: #7f1d1d;
        color: #fee2e2;
        border-color: #dc2626;
    }
    
    .alert-warning {
        background-color: #78350f;
        color: #fef3c7;
        border-color: #d97706;
    }
    
    .alert-info {
        background-color: #1e3a8a;
        color: #dbeafe;
        border-color: #1d4ed8;
    }
}

/* Suporte a notch (iPhone X+) */
@supports (padding: max(0px)) {
    body {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }
}