/* ============================================
   ESTILOS RESPONSIVOS
   ============================================ */

/* Orientação paisagem - ajustes especiais */
@media (orientation: landscape) and (max-height: 600px) {
    body {
        padding-top: 60px;
    }

    .container {
        height: calc(100vh - 100px);
        gap: clamp(4px, 1vw, 12px);
    }

    .funcionaria {
        padding: clamp(4px, 1vw, 12px);
    }

    .funcionaria h2 {
        font-size: clamp(8px, 1.5vw, 14px);
        margin: clamp(2px, 0.5vw, 6px) 0;
        min-height: clamp(16px, 2.5vw, 30px);
    }

    .avaliacoes {
        gap: clamp(3px, 0.8vw, 8px);
    }

    .avaliacoes button {
        font-size: clamp(12px, 2vw, 18px);
        padding: clamp(4px, 1vw, 10px) clamp(6px, 1.5vw, 12px);
        min-width: clamp(30px, 4vw, 50px);
        min-height: clamp(25px, 4vw, 40px);
        gap: clamp(1px, 0.3vw, 2px);
    }

    .avaliacoes button .emoji {
        font-size: clamp(12px, 2vw, 18px);
    }

    .avaliacoes button .label {
        font-size: clamp(8px, 1.3vw, 12px);
        font-weight: bold;
    }
}

/* Tablets em retrato */
@media (orientation: portrait) and (max-width: 768px) {
    .container {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important;
        gap: clamp(6px, 1.5vw, 12px);
        height: calc(100vh - 120px);
    }

    .funcionaria.selected .avaliacoes {
        position: static;
        transform: none;
        margin-top: 8px;
        flex-direction: row;
        justify-content: center;
        gap: 6px;
        right: auto;
        top: auto;
    }

    .admin-panel {
        max-width: 90vw;
    }

    .modal-content {
        width: 95%;
        max-width: 350px;
    }
}

/* Telas muito pequenas (smartphones) */
@media (max-width: 480px) {
    body {
        padding: 10px;
        padding-top: 60px;
    }

    .container {
        grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)) !important;
        gap: clamp(4px, 1vw, 8px);
        height: calc(100vh - 100px);
    }

    .funcionaria {
        padding: clamp(6px, 1vw, 10px);
    }

    .funcionaria h2 {
        font-size: clamp(8px, 2vw, 12px);
        min-height: clamp(14px, 2.5vw, 20px);
        margin: clamp(2px, 0.5vw, 6px) 0;
    }

    .admin-panel {
        max-width: 95vw;
        padding: 15px;
    }

    .modal-content {
        width: 95%;
        padding: 20px;
    }

    .controls {
        top: 10px;
        right: 10px;
    }

    .controls button {
        padding: 8px 12px;
        font-size: 12px;
    }
}

/* Espaço muito reduzido verticalmente */
@media (max-height: 500px) {
    body {
        padding-top: 50px;
    }

    .container {
        height: calc(100vh - 80px);
        gap: 4px;
    }

    .avaliacoes button {
        min-height: clamp(25px, 4vh, 40px);
    }
}

/* Modo de impressão */
@media print {
    body {
        background: white;
    }

    .controls,
    .overlay,
    .avaliacoes {
        display: none !important;
    }

    .funcionaria {
        page-break-inside: avoid;
    }
}