/**
 * Modal Iframe Styles
 * Minimal styles - most are applied inline via JS
 * Add any additional customizations here
 */

/* Overlay background */
#modal-overlay {
    cursor: pointer;
}

/* Modal container - inline styles applied via JS */
/* Add custom overrides below if needed */

/* Close button base styles */
#modal-close {
    outline: none;
}

#modal-close:focus {
    box-shadow: 0 0 0 3px rgba(0,0,0,0.2);
}

#modal-close svg {
    pointer-events: none;
}

/* Iframe styles */
#modal-iframe {
    background: #fff;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #modal-box {
        width: 95%;
        height: 95%;
        max-width: none;
        max-height: none;
        border-radius: 4px;
    }

    #modal-close {
        width: 40px;
        height: 40px;
        font-size: 28px;
    }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    #modal-overlay,
    #modal-box {
        transition: none !important;
    }
}