/* General Modal Styles */
.vanilla-modal {
    background-color: rgba(0, 0, 0, 0.4); /* Semi-transparent backdrop */
}

/* === Theme: Light === */
.vanilla-modal-theme-light .vanilla-modal-content {
    background-color: rgba(255, 255, 255, 0.8); /* Dark background with some transparency */
    color: #000000;
    border: 1px solid #ffffff;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.vanilla-modal-theme-light .vanilla-modal-close {
    color: #000000; /* Black icon */
}

.vanilla-modal-theme-light .vanilla-modal-close svg {
    fill: #000000;
}

/* Dark Theme Input Styles */
.vanilla-modal-theme-light input[type="text"] {
    color: black;
    background-color: rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.8);
}

.vanilla-modal-theme-light input[type="text"]:focus {
    color: black;
    background-color: rgba(0, 0, 0, 0.1);
    border-color: rgba(255, 255, 255, 1);
}

.vanilla-modal-theme-light ::placeholder {
    color: rgba(50, 50, 50, 0.8); /* Lighter placeholder text */
}