/* Mobile Header Optimizations */

/* Reduce header height on mobile */
@media (max-width: 768px) {
    nav.navbar {
        padding: 6px 12px !important;
    }
    
    /* Smaller logo icon */
    #solver-icon {
        font-size: 1.3rem !important;
    }
    
    /* Reduce status icon sizes */
    #server-icon,
    #client-icon,
    #transcription-icon {
        font-size: 1.4rem !important;
    }
    
    /* Smaller settings button */
    #settings-btn {
        height: 40px !important;
        width: 40px !important;
        font-size: 1rem !important;
    }
    
    /* Reduce gap between elements */
    .d-flex.gap-3 {
        gap: 0.5rem !important;
    }
    
    .d-flex.gap-2 {
        gap: 0.4rem !important;
    }
    
    /* Smaller input group */
    .input-group-lg {
        font-size: 0.95rem;
    }
    
    .input-group-lg .btn {
        padding: 0.4rem 0.6rem;
    }
}

/* Extra small mobile devices */
@media (max-width: 576px) {
    nav.navbar {
        padding: 4px 8px !important;
    }
    
    #solver-icon {
        font-size: 1.2rem !important;
        margin-right: 0.3rem !important;
    }
    
    #server-icon,
    #client-icon,
    #transcription-icon {
        font-size: 1.2rem !important;
    }
    
    #settings-btn {
        height: 36px !important;
        width: 36px !important;
        font-size: 0.9rem !important;
    }
    
    .input-group-lg {
        font-size: 0.9rem;
    }
    
    .input-group-lg .form-control {
        padding: 0.4rem 0.6rem;
    }
    
    .input-group-lg .btn {
        padding: 0.35rem 0.5rem;
        font-size: 0.85rem;
    }
    
    /* Hide some buttons on very small screens */
    #clear-post-btn,
    #process-last-btn {
        display: none !important;
    }
}

/* Landscape mode on mobile */
@media (max-width: 768px) and (orientation: landscape) {
    nav.navbar {
        padding: 4px 12px !important;
    }
    
    #solver-icon {
        font-size: 1.2rem !important;
    }
    
    #server-icon,
    #client-icon,
    #transcription-icon {
        font-size: 1.3rem !important;
    }
}
