/* Tablet Screen Fix for 1024x824 Resolution */

/* Target screens between 992px and 1200px (tablet landscape) */
@media (min-width: 992px) and (max-width: 1200px) {
    
    /* Navigation adjustments */
    .main-navbar .container {
        max-width: 100%;
        padding: 0 2rem;
    }
    
    .brand-name {
        font-size: 1.5rem;
    }
    
    .brand-tagline {
        font-size: 0.7rem;
    }
    
    .navbar-nav .nav-link {
        padding: 0.75rem 0.8rem;
        font-size: 0.9rem;
    }
    
    /* Hero section optimization */
    .hero-title {
        font-size: 6rem;
    }
    
    .hero-subtitle {
        font-size: 1.1rem;
    }
    
    /* Container adjustments */
    .container {
        max-width: 95%;
        padding: 0 1.5rem;
    }
    
    /* Card layouts */
    .service-card {
        padding: 1.5rem;
        margin-bottom: 1.5rem;
    }
    
    .service-icon {
        width: 70px;
        height: 70px;
        font-size: 1.8rem;
    }
    
    /* Admin sidebar adjustments */
    .admin-sidebar {
        width: 180px;
    }
    
    .main-content {
        margin-left: 180px;
        margin-right: 2rem;
        padding: 1.5rem;
    }
    
    .main-content.expanded {
        margin-left: 60px;
    }
    
    /* Table responsiveness */
    .table {
        font-size: 0.9rem;
    }
    
    .table th,
    .table td {
        padding: 0.6rem;
    }
    
    /* Form elements */
    .form-control,
    .form-select {
        padding: 0.6rem 0.8rem;
        font-size: 0.9rem;
    }
    
    /* Button adjustments */
    .btn {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
    
    .btn-lg {
        padding: 0.8rem 1.8rem;
        font-size: 1rem;
    }
    
    /* Product grid optimization */
    .row .col-md-4 {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    
    .row .col-lg-3 {
        flex: 0 0 25%;
        max-width: 25%;
    }
    
    /* Stats cards */
    .stats-card {
        padding: 1.5rem;
    }
    
    .stats-number {
        font-size: 2rem;
    }
    
    /* Modal adjustments */
    .modal-dialog {
        max-width: 80%;
        margin: 2rem auto;
    }
    
    /* Booking page adjustments */
    .booking-card .card-body {
        padding: 2rem;
    }
    
    .service-card {
        height: auto;
        min-height: 280px;
    }
    
    .service-image {
        height: 100px;
    }
    
    /* Cart page optimization */
    .cart-item {
        padding: 1rem;
    }
    
    .quantity-controls {
        gap: 0.4rem;
    }
    
    .quantity-btn {
        width: 28px;
        height: 28px;
    }
    
    /* Payment methods */
    .payment-method {
        padding: 1.2rem 0.8rem;
    }
    
    .payment-method i {
        font-size: 2rem;
    }
    
    /* Top bar adjustments */
    .top-bar {
        font-size: 0.8rem;
    }
    
    .social-link {
        width: 30px;
        height: 30px;
        font-size: 0.8rem;
    }
    
    /* Settings page */
    .nav-tabs .nav-link {
        padding: 0.6rem 1rem;
        font-size: 0.9rem;
    }
    
    .feature-grid {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 0.8rem;
    }
    
    /* Transformations gallery */
    .gallery-item {
        margin-bottom: 1rem;
    }
    
    /* Course page */
    .course-features .col-md-6 {
        margin-bottom: 1rem;
    }
    
    /* Contact page */
    .contact-info .col-md-4 {
        margin-bottom: 1.5rem;
    }
}

/* Specific height adjustments for 824px screens */
@media (min-width: 992px) and (max-width: 1200px) and (max-height: 900px) {
    
    /* Reduce vertical spacing */
    .hero-section {
        padding: 60px 0;
    }
    
    .section {
        padding: 40px 0;
    }
    
    /* Admin sidebar height optimization */
    .admin-sidebar {
        min-height: calc(100vh - 100px);
    }
    
    /* Compact admin cards */
    .admin-content .card-body {
        padding: 1.2rem;
    }
    
    .admin-content .card-header {
        padding: 1rem 1.2rem;
    }
    
    /* Reduce modal size */
    .modal-dialog {
        margin: 1rem auto;
    }
    
    /* Compact booking steps */
    .booking-steps {
        margin-bottom: 1.5rem;
    }
    
    .step-circle {
        width: 50px;
        height: 50px;
        font-size: 1rem;
    }
    
    /* Reduce form spacing */
    .mb-3 {
        margin-bottom: 1rem !important;
    }
    
    .mb-4 {
        margin-bottom: 1.5rem !important;
    }
    
    /* Compact stats display */
    .stats-card {
        padding: 1.2rem;
    }
    
    .stats-number {
        font-size: 1.8rem;
    }
    
    /* Reduce table row height */
    .table th,
    .table td {
        padding: 0.5rem;
    }
}

/* Landscape orientation specific fixes */
@media (min-width: 992px) and (max-width: 1200px) and (orientation: landscape) {
    
    /* Navigation height reduction */
    .main-navbar {
        padding: 0.5rem 0;
    }
    
    .brand-logo {
        height: 40px;
    }
    
    .brand-name {
        font-size: 1.3rem;
    }
    
    .brand-tagline {
        font-size: 0.65rem;
    }
    
    /* Top bar reduction */
    .top-bar {
        padding: 0.3rem 0;
        font-size: 0.75rem;
    }
    
    /* Content spacing */
    .main-content {
        margin-top: 80px;
    }
    
    /* Hero adjustments */
    .hero-section {
        padding: 40px 0;
    }
    
    .hero-title {
        font-size: 5rem;
    }
}