/* Landscape/Horizontal Layout Fixes */

@media (orientation: landscape) and (max-height: 500px) {
    /* Reducir padding del header */
    .main-header {
        padding: 8px 12px !important;
        min-height: 50px !important;
    }

    /* Input URL más pequeño */
    .url-input {
        padding: 8px 10px !important;
        font-size: 14px !important;
    }

    /* Botones toolbar más compactos */
    .toolbar button {
        width: 40px !important;
        height: 40px !important;
        font-size: 14px !important;
        margin: 2px !important;
    }

    /* Reducir gap entre elementos */
    .url-controls,
    .navigation-buttons,
    .action-buttons {
        gap: 4px !important;
    }

    /* Browser view ocupa más espacio */
    .browser-view,
    .screenshot-container {
        height: calc(100vh - 140px) !important;
    }

    /* Controles zoom más pequeños */
    #zoomControls {
        padding: 6px 10px !important;
        bottom: 20px !important;
    }

    #zoomControls button {
        width: 36px !important;
        height: 36px !important;
        font-size: 16px !important;
    }

    #zoomLevel {
        font-size: 12px !important;
        min-width: 50px !important;
    }

    /* Botones Go/Stop más pequeños */
    #goBtn, #stopBtn {
        padding: 8px 16px !important;
        font-size: 14px !important;
    }

    /* Ocultar elementos no críticos en landscape */
    .status-indicator {
        display: none !important;
    }
}

/* iPad landscape y tablets */
@media (orientation: landscape) and (min-width: 768px) and (max-height: 600px) {
    .main-header {
        padding: 10px 16px !important;
    }

    .toolbar button {
        width: 44px !important;
        height: 44px !important;
    }
}