/* ==========================================================================
   ESTILOS DE POPUP Y MODALES CLAYMÓRFICOS
   ========================================================================== */

.clay-modal-content {
    background: var(--clay-bg);
    border-radius: 40px;
    border: none;
    box-shadow: 
        20px 30px 50px rgba(0, 0, 0, 0.25),
        inset -8px -10px 16px rgba(0, 0, 0, 0.1),
        inset 8px 10px 16px rgba(255, 255, 255, 0.9);
    padding: 1.5rem;
}

.clay-modal-header {
    background: var(--pt-rojo);
    color: #ffffff;
    border-radius: 28px;
    box-shadow: 
        6px 8px 16px rgba(176, 0, 8, 0.3),
        inset -4px -5px 8px rgba(0, 0, 0, 0.25),
        inset 4px 5px 8px rgba(255, 255, 255, 0.4);
    padding: 1rem 1.5rem;
}

.clay-close-btn {
    background: var(--pt-amarillo);
    border-radius: 50%;
    opacity: 1;
    box-shadow: 
        2px 4px 8px rgba(0, 0, 0, 0.15),
        inset -2px -2px 4px rgba(0, 0, 0, 0.15),
        inset 2px 2px 4px rgba(255, 255, 255, 0.8);
}