/* Custom Styles for Towing Company Management System */

.tab-content { 
    display: none; 
}

.tab-content.active { 
    display: block; 
}

.navbar-brand { 
    font-weight: bold; 
    font-size: 1.5rem; 
}

.status-badge { 
    padding: 4px 8px; 
    border-radius: 12px; 
    font-size: 0.75rem; 
    font-weight: 600; 
}

.status-pending { 
    background-color: #fef3c7; 
    color: #92400e; 
}

.status-progress { 
    background-color: #dbeafe; 
    color: #1e40af; 
}

.status-completed { 
    background-color: #d1fae5; 
    color: #065f46; 
}

.status-cancelled { 
    background-color: #fee2e2; 
    color: #991b1b; 
}

@media (max-width: 480px) {
    .login-container {
        padding: 1.5rem;
        border-radius: 1rem;
    }
    .login-container h2 {
        font-size: 1.75rem;
    }
    .login-container p {
        font-size: 0.95rem;
    }
    .login-container input,
    .login-container button {
        font-size: 0.95rem;
    }
    .login-container .text-sm {
        font-size: 0.875rem;
    }
    .login-container .flex.items-center.justify-between {
        flex-direction: column;
        gap: 0.75rem;
        align-items: flex-start;
    }
}

.mobile-screen { 
    max-width: 375px; 
    margin: 0 auto; 
    border: 2px solid #e5e7eb; 
    border-radius: 20px; 
    overflow: hidden; 
}

.print-section { 
    page-break-inside: avoid; 
    margin-bottom: 2rem; 
}

@media print { 
    .no-print { 
        display: none !important; 
    }
    body { 
        print-color-adjust: exact; 
    }
}

/* Additional styles for better navigation */
.tab-btn {
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}

.tab-btn:hover {
    text-decoration: none;
}

/* Responsive improvements */
@media (max-width: 768px) {
    .mobile-screen {
        max-width: 100%;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
    
    .navbar-brand {
        font-size: 1.2rem;
    }
    
    .grid {
        gap: 1rem;
    }
}

/* Print styles */
@media print {
    .no-print {
        display: none !important;
    }
    
    .print-section {
        page-break-inside: avoid;
        margin-bottom: 1rem;
    }
    
    body {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
    
    .bg-blue-900,
    .bg-white,
    .bg-gray-50 {
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }
}