/**
 * Responsive Utilities
 * Creative Hands Zambia
 * 
 * Additional responsive helpers and overrides
 */

/* ========================================
   Responsive Typography
   ======================================== */

@media (max-width: 1199px) {
    html {
        font-size: 15px;
    }
}

@media (max-width: 991px) {
    html {
        font-size: 14px;
    }
    
    h1 { font-size: 2.25rem; }
    h2 { font-size: 1.875rem; }
    h3 { font-size: 1.5rem; }
}

@media (max-width: 767px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.75rem; }
    h3 { font-size: 1.375rem; }
    h4 { font-size: 1.25rem; }
}

/* ========================================
   Responsive Spacing
   ======================================== */

@media (max-width: 991px) {
    :root {
        --spacing-3xl: 3rem;
        --spacing-2xl: 2rem;
    }
}

@media (max-width: 767px) {
    :root {
        --spacing-3xl: 2rem;
        --spacing-2xl: 1.5rem;
    }
}

/* ========================================
   Responsive Display Utilities
   ======================================== */

/* Hide on mobile */
@media (max-width: 767px) {
    .hide-mobile {
        display: none !important;
    }
}

/* Hide on tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .hide-tablet {
        display: none !important;
    }
}

/* Hide on desktop */
@media (min-width: 992px) {
    .hide-desktop {
        display: none !important;
    }
}

/* Show only on mobile */
.show-mobile {
    display: none !important;
}

@media (max-width: 767px) {
    .show-mobile {
        display: block !important;
    }
}

/* ========================================
   Mobile Navigation Adjustments
   ======================================== */

@media (max-width: 991px) {
    .navbar-collapse {
        background: var(--color-primary-dark);
        padding: var(--spacing-lg);
        margin-top: var(--spacing-md);
        border-radius: var(--radius-lg);
        box-shadow: var(--shadow-lg);
    }
    
    .navbar-nav .nav-link {
        padding: var(--spacing-md);
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .navbar-nav .nav-link::after {
        display: none;
    }
    
    .dropdown-menu {
        background: var(--color-primary);
        border: none;
        box-shadow: none;
    }
    
    .dropdown-item {
        color: var(--color-white);
        padding-left: var(--spacing-xl);
    }
    
    .dropdown-item:hover {
        background: var(--color-primary-dark);
    }
    
    .btn-donate {
        width: 100%;
        margin-top: var(--spacing-md);
    }
}

/* ========================================
   Mobile Grid Adjustments
   ======================================== */

@media (max-width: 767px) {
    .row.g-4 {
        gap: var(--spacing-lg) !important;
    }
    
    .row.g-5 {
        gap: var(--spacing-xl) !important;
    }
}

/* ========================================
   Touch Device Optimizations
   ======================================== */

@media (hover: none) and (pointer: coarse) {
    /* Increase tap targets */
    .btn,
    .nav-link,
    .dropdown-item {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    
    /* Remove hover effects on touch devices */
    .program-card:hover,
    .news-card:hover,
    .event-card:hover {
        transform: none;
    }
    
    /* Show overlays by default on touch */
    .program-overlay {
        opacity: 1;
        background: rgba(0, 0, 0, 0.5);
    }
}