/* SweetAlert2 Dark Mode Styles */
body.dark-mode .swal2-popup {
    background-color: var(--secondary-color) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: var(--shadow) !important;
}

body.dark-mode .swal2-title {
    color: var(--text-color) !important;
}

body.dark-mode .swal2-html-container {
    color: var(--text-color) !important;
}

body.dark-mode .swal2-icon.swal2-warning {
    border-color: var(--error-color) !important;
    color: var(--error-color) !important;
}

body.dark-mode .swal2-icon.swal2-error {
     border-color: var(--error-color) !important;
     color: var(--error-color) !important;
}

body.dark-mode .swal2-icon.swal2-success .swal2-success-ring {
     border-color: var(--primary-color) !important;
}

body.dark-mode .swal2-icon.swal2-success [class^=swal2-success-line] {
    background-color: var(--primary-color) !important;
}

body.dark-mode .swal2-icon.swal2-info {
    border-color: var(--primary-color) !important;
    color: var(--primary-color) !important;
}

body.dark-mode .swal2-confirm,
body.dark-mode .swal2-deny,
body.dark-mode .swal2-cancel {
    font-size: 1em !important; /* Match site buttons */
    font-weight: 500 !important; /* Match site buttons */
    padding: 14px 20px !important; /* Match site buttons padding */
    border-radius: 6px !important; /* Match site buttons border-radius */
    transition: background-color 0.2s ease, transform 0.1s ease !important; /* Add transition */
}

body.dark-mode .swal2-confirm {
    background-color: var(--primary-color) !important;
    color: white !important;
}

body.dark-mode .swal2-confirm:focus {
     box-shadow: 0 0 0 3px rgba(var(--primary-color-rgb), 0.5) !important;
}

body.dark-mode .swal2-cancel {
    background-color: var(--secondary-color) !important; /* Use card background */
    color: var(--text-color) !important; /* Use text color */
    border: 1px solid var(--border-color) !important; /* Add border */
}

body.dark-mode .swal2-cancel:focus {
     box-shadow: 0 0 0 3px rgba(var(--border-color-rgb), 0.5) !important;
}

body.dark-mode .swal2-actions button:active {
     transform: scale(0.98) !important; /* Add active transform */
}

body.dark-mode .swal2-input,
body.dark-mode .swal2-textarea,
body.dark-mode .swal2-select {
     background-color: var(--input-bg) !important;
     color: var(--text-color) !important;
     border: 1px solid var(--border-color) !important;
     box-shadow: none !important; /* Remove default box shadow */
}

body.dark-mode .swal2-input:focus,
body.dark-mode .swal2-textarea:focus,
body.dark-mode .swal2-select:focus {
     border-color: var(--primary-color) !important;
     box-shadow: 0 0 0 1px rgba(var(--primary-color-rgb), 0.1) !important; /* Match site input focus */
     outline: none !important;
}

/* Add these new styles for the expense edit dialog */
.swal2-input-group {
    width: 100%;
    margin: 0;
}

.swal2-select-full,
.swal2-input-full {
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

.swal2-select,
.swal2-input {
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.dark-mode .swal2-popup .swal2-input,
body.dark-mode .swal2-popup .swal2-select {
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    background-color: var(--input-bg) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--border-color) !important;
}

.swal2-popup {
    width: 32em !important;
    max-width: 95% !important;
    padding: 2em !important;
}

.swal2-html-container {
    margin: 1em 0 !important;
    padding: 0 !important;
}