/* 📱 Ultra Compact Mobile Design - Like Native App */

@media (max-width: 768px) {
    .main-content {
        padding-top: 0 !important;
    }

    /* Navbar - كأنه تطبيق */
    .navbar {
        padding: 0.5rem 1rem !important;
        min-height: 50px !important;
    }
    
    .navbar-brand {
        font-size: 1.1rem !important;
        font-weight: 700 !important;
        padding: 0 !important;
    }
    
    .navbar-brand img {
        max-height: 32px !important;
    }
    
    .navbar-toggler {
        padding: 0.35rem 0.5rem !important;
        font-size: 1rem !important;
    }
    
    .navbar-nav .nav-link {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.9rem !important;
    }
    
    /* Container - تصغير Padding */
    .container {
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }
    
    /* Cards - أصغر */
    .card {
        margin-bottom: 0.75rem !important;
        border-radius: 0.75rem !important;
    }
    
    .card-header {
        padding: 0.75rem 1rem !important;
        font-size: 1rem !important;
    }
    
    .card-body {
        padding: 0.85rem !important;
    }
    
    .card-title {
        font-size: 1.1rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* Buttons - حجم تطبيق */
    .btn {
        padding: 0.5rem 1rem !important;
        font-size: 0.9rem !important;
        border-radius: 0.65rem !important;
    }
    
    .btn-lg {
        padding: 0.65rem 1.25rem !important;
        font-size: 1rem !important;
    }
    
    .btn-sm {
        padding: 0.35rem 0.65rem !important;
        font-size: 0.8rem !important;
    }
    
    /* Forms */
    .form-control {
        padding: 0.6rem 0.75rem !important;
        font-size: 0.9rem !important;
        border-radius: 0.65rem !important;
    }
    
    .form-label {
        font-size: 0.9rem !important;
        margin-bottom: 0.35rem !important;
    }
    
    .form-group {
        margin-bottom: 0.85rem !important;
    }
    
    /* Headers */
    h1 {
        font-size: 1.5rem !important;
        margin-bottom: 0.75rem !important;
    }
    
    h2 {
        font-size: 1.3rem !important;
        margin-bottom: 0.65rem !important;
    }
    
    h3 {
        font-size: 1.15rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    h4 {
        font-size: 1.05rem !important;
    }
    
    h5 {
        font-size: 0.95rem !important;
    }
    
    /* Spacing */
    .mt-4, .my-4 {
        margin-top: 1rem !important;
    }
    
    .mb-4, .my-4 {
        margin-bottom: 1rem !important;
    }
    
    .pt-4, .py-4 {
        padding-top: 1rem !important;
    }
    
    .pb-4, .py-4 {
        padding-bottom: 1rem !important;
    }
    
    /* Tables */
    .table {
        font-size: 0.85rem !important;
    }
    
    .table th,
    .table td {
        padding: 0.5rem !important;
    }
    
    /* Badges */
    .badge {
        padding: 0.35rem 0.65rem !important;
        font-size: 0.8rem !important;
    }
    
    /* Alerts */
    .alert {
        padding: 0.75rem 1rem !important;
        font-size: 0.9rem !important;
        border-radius: 0.75rem !important;
    }
    
    /* Modal */
    .modal-header {
        padding: 0.85rem 1rem !important;
    }
    
    .modal-body {
        padding: 1rem !important;
    }
    
    .modal-footer {
        padding: 0.75rem 1rem !important;
    }
    
    /* Page Header - صغير */
    .page-header {
        padding: 0.85rem 1rem !important;
        margin-bottom: 1rem !important;
        border-radius: 0.75rem !important;
    }
    
    .page-header h1 {
        font-size: 1.3rem !important;
        margin: 0 !important;
    }
    
    .page-header p {
        font-size: 0.85rem !important;
        margin: 0.35rem 0 0 0 !important;
    }
}

/* Very Small Phones */
@media (max-width: 375px) {
    .navbar {
        padding: 0.4rem 0.75rem !important;
    }
    
    .navbar-brand {
        font-size: 1rem !important;
    }
    
    .container {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
    
    .card-body {
        padding: 0.65rem !important;
    }
}

/* 📱 Thinner Navbar for Mobile */
@media (max-width: 768px) {
    .navbar-brand {
        font-size: 0.95rem !important;
        font-weight: 600 !important;
        letter-spacing: -0.3px !important;
    }
    
    .navbar-brand img {
        max-height: 28px !important;
    }
}

@media (max-width: 480px) {
    .navbar-brand {
        font-size: 0.9rem !important;
        font-weight: 500 !important;
    }
    
    .navbar-brand img {
        max-height: 24px !important;
    }
}
