/*
 * theme.css — utilities compartidos (sin dark/light, sistema 100% light).
 *
 * [FIX 2026-08-05] Dark mode eliminado. La paleta M3 vive en :root de
 * style.css. Este archivo conserva solo utilities reusables.
 */

/* ---------- GLASS EFFECT ---------- */

.glass {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    box-shadow: 0 4px 30px var(--shadow-color);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* ---------- TOASTS ---------- */

@keyframes toastIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes toastOut { from { transform: translateX(0); opacity: 1; } to { transform: translateX(100%); opacity: 0; } }

.toast-premium {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    min-width: 280px;
    max-width: 420px;
    padding: 0.85rem 1rem;
    background: var(--toast-bg);
    color: #f8fafc;
    border-radius: 12px;
    border: 1px solid var(--toast-border);
    border-left: 4px solid var(--md-sys-color-primary);
    box-shadow: var(--toast-shadow);
    animation: toastIn 0.3s ease-out;
    font-size: 0.875rem;
    font-weight: 500;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}
.toast-premium .toast-icon { font-size: 1.1rem; flex-shrink: 0; }
.toast-premium .toast-message { flex: 1; }
.toast-premium.is-leaving { animation: toastOut 0.3s ease-in forwards; }
.toast-premium[data-type="info"]    { border-left-color: var(--color-info); }
.toast-premium[data-type="info"] .toast-icon    { color: var(--color-info); }
.toast-premium[data-type="success"] { border-left-color: var(--color-success); }
.toast-premium[data-type="success"] .toast-icon { color: var(--color-success); }
.toast-premium[data-type="error"],
.toast-premium[data-type="danger"] { border-left-color: var(--color-error); }
.toast-premium[data-type="error"] .toast-icon,
.toast-premium[data-type="danger"] .toast-icon { color: var(--color-error); }
.toast-premium[data-type="warning"] { border-left-color: var(--color-warning); }
.toast-premium[data-type="warning"] .toast-icon { color: var(--color-warning); }

/* ---------- MODALS PREMIUM ---------- */

.modal-overlay-premium {
    position: fixed;
    inset: 0;
    background: var(--modal-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    animation: modalFadeIn 0.2s ease-out;
}
@keyframes modalFadeIn { from { opacity: 0; } to { opacity: 1; } }

.modal-content-premium {
    background: var(--modal-content-bg);
    border: 1px solid var(--modal-content-border);
    border-radius: 16px;
    padding: 1.5rem 1.75rem;
    max-width: 480px;
    width: calc(100% - 2rem);
    box-shadow: 0 20px 60px var(--shadow-color-heavy);
    animation: modalSlideIn 0.25s ease-out;
}
@keyframes modalSlideIn {
    from { transform: translateY(20px) scale(0.95); opacity: 0; }
    to { transform: translateY(0) scale(1); opacity: 1; }
}
.modal-content-premium .modal-icon-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin: 0 auto 1rem;
    border-radius: 50%;
    background: var(--overlay-light);
}
.modal-content-premium .modal-icon-container[data-type="danger"]  { background: var(--error-soft-bg); }
.modal-content-premium .modal-icon-container[data-type="warning"] { background: var(--warning-soft-bg); }
.modal-content-premium .modal-icon-container[data-type="info"]    { background: var(--info-soft-bg); }
.modal-content-premium .modal-icon {
    font-size: 1.75rem;
    color: var(--md-sys-color-primary);
}
.modal-content-premium .modal-icon[data-type="danger"]  { color: var(--color-error); }
.modal-content-premium .modal-icon[data-type="warning"] { color: var(--color-warning); }
.modal-content-premium .modal-icon[data-type="info"]    { color: var(--color-info); }
.modal-content-premium .modal-title {
    font-size: 1.1rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 0.5rem;
}
.modal-content-premium .modal-message {
    text-align: center;
    font-size: 0.875rem;
    color: var(--text-muted);
    margin-bottom: 1.25rem;
}
.modal-content-premium .modal-verify {
    margin-bottom: 1rem;
}
.modal-content-premium .modal-verify label {
    display: block;
    font-size: 0.75rem;
    color: var(--text-muted);
    margin-bottom: 0.25rem;
}
.modal-content-premium .modal-verify input {
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--md-sys-color-surface);
    color: var(--text-main);
    font-family: inherit;
    font-size: 0.875rem;
}
.modal-content-premium .modal-actions {
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

/* ---------- EMPTY / LOADING STATES ---------- */

.empty-placeholder {
    padding: 3rem 1.5rem;
    text-align: center;
    color: var(--text-muted);
}
.empty-placeholder .empty-icon {
    font-size: 2.5rem;
    color: var(--color-error);
    margin-bottom: 1rem;
}
.empty-placeholder .empty-title {
    color: var(--md-sys-color-on-surface-variant);
    font-weight: 500;
}
.empty-placeholder .empty-subtitle {
    font-size: 0.8rem;
    color: var(--md-sys-color-on-surface-variant);
    margin-top: 0.25rem;
}

/* ---------- SELECTOR ---------- */

select option {
    background-color: #ffffff;
    color: #0f172a;
    padding: 10px;
}