/* ==============================================================================
   Estilos Customizados, Responsividade & Suporte PWA (Agenda Pro)
   ============================================================================== */

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeIn {
    animation: fadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Suavização de scroll e renderização */
html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

body {
    /* Suporte a Safe Areas para iPhones com notch/Dynamic Island */
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
    min-height: 100vh;
    min-height: -webkit-fill-available;
}

/* Scrollbar sutil e moderna */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Otimização de toque em telas mobile e tablets */
button, a, input, select, textarea {
    touch-action: manipulation;
}

/* Foco acessível */
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 2px solid #4f46e5;
    outline-offset: 2px;
}

/* Responsividade de botões de slots para mobile compacto */
@media (max-width: 640px) {
    .slot-card-mobile {
        padding: 0.75rem 1rem;
    }
}

/* PWA Banner de Instalação */
#pwaInstallBanner {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}