:root {
    color-scheme: light;
    --color-green: #4F8A6D;
    --color-green-soft: #CFE2D7;
    --color-green-accessible: #3D7057;
    --color-terracotta: #C97E5A;
    --color-terracotta-accessible: #934C30;
    --color-cream: #F8F4ED;
    --color-chocolate: #3D2F28;
    --color-muted: #695A50;
    --color-border: #E3DAD0;
    --color-surface: #FFFEFB;
}

body.bg-slate-50 {
    background-color: var(--color-cream);
}

body.text-slate-800,
.text-slate-800,
.text-black {
    color: var(--color-chocolate);
}

.bg-white,
.bg-white\/90,
.bg-white\/75 {
    background-color: var(--color-surface);
}

.bg-slate-50 {
    background-color: var(--color-cream);
}

.bg-slate-800,
.bg-slate-900 {
    background-color: var(--color-chocolate);
}

.bg-green-200,
.bg-blue-100 {
    background-color: var(--color-green-soft);
}

.bg-amber-100 {
    background-color: var(--color-terracotta-accessible);
}

.bg-green-500 {
    background-color: var(--color-green-accessible);
}

.bg-green-600 {
    background-color: var(--color-green-accessible);
}

.bg-blue-600 {
    background-color: var(--color-terracotta-accessible);
}

.border-blue-600 {
    border-color: var(--color-terracotta-accessible);
}

.border-blue-600.text-blue-600 {
    color: var(--color-terracotta-accessible);
}

.text-green-500,
.text-green-700,
.text-blue-600,
.text-blue-700 {
    color: var(--color-green-accessible);
}

.text-amber-900 {
    color: #FFFFFF;
}

.text-amber-500 {
    color: var(--color-terracotta);
}

.text-slate-600,
.text-slate-500 {
    color: var(--color-muted);
}

.text-slate-200 {
    color: #F3EDE4;
}

.border-slate-300,
.border-slate-200 {
    border-color: var(--color-border);
}

input,
select,
textarea,
.form-control,
.admin-input,
.password-input {
    border-color: var(--color-border);
    color: var(--color-chocolate);
    background-color: var(--color-surface);
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.admin-input:focus,
.password-input:focus,
.password-toggle:focus-visible {
    outline-color: var(--color-green-accessible);
}

#fecha-nacimiento[readonly],
#cumple-comun[readonly],
#usuario-fecha-nacimiento[readonly] {
    background-color: #e5e7eb;
    color: #4b5563;
    border-color: #9ca3af;
    cursor: not-allowed;
}

.password-toggle {
    border-color: var(--color-border);
    color: var(--color-chocolate);
    background-color: var(--color-surface);
}

.profile-edit-card,
.profile-panel,
.search-card,
.account-gate-card,
.registration-card,
.success-card,
.profile-dialog-card,
.admin-card,
.clinic-tabpanel,
.recovery-panel {
    background-color: var(--color-surface);
    border-color: var(--color-border);
}

.location-card,
.detail-row,
.detail-group {
    border-color: var(--color-border);
}

.account-gate-description {
    color: var(--color-muted);
}

.profile-edit-section {
    border-color: var(--color-green-soft);
    border-left-color: var(--color-green);
    background-color: var(--color-cream);
    color: var(--color-chocolate);
}

.help-icon {
    background-color: var(--color-green);
}

.clinic-tab[aria-selected="true"] {
    border-color: var(--color-green-accessible);
    background-color: var(--color-green-accessible);
}

.professional-card-button {
    border-color: var(--color-terracotta-accessible);
    background-color: var(--color-terracotta-accessible);
}

.admin-list-item:hover {
    background-color: var(--color-cream);
}

.admin-toast {
    background-color: var(--color-green-accessible);
}

.admin-toast-error {
    background-color: #A33D32;
}

.registration-overlay,
.success-overlay,
.account-gate-overlay,
.profile-dialog {
    background-color: rgb(61 47 40 / 58%);
}

.required-indicator,
.text-red-600,
.text-red-700 {
    color: #A33D32;
}

button:focus-visible,
a:focus-visible {
    outline: 2px solid var(--color-green-accessible);
    outline-offset: 3px;
}

main {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.form-field { display: flex; flex-direction: column; gap: 0.5rem; }
.form-field[hidden] { display: none; }
.form-field-full { grid-column: 1 / -1; }
.form-control { box-sizing: border-box; width: 100%; padding: 0.875rem 1rem; border: 1px solid var(--color-border); border-radius: 0.75rem; color: var(--color-chocolate); background: var(--color-surface); font: inherit; }
.form-control:focus { outline: 2px solid var(--color-green-accessible); outline-offset: 2px; }
.form-action-button { width: 30%; cursor: pointer; }
button:disabled { opacity: 0.6; cursor: not-allowed; }
.help-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.2rem; height: 1.2rem; margin-left: 0.35rem; border-radius: 9999px; background: var(--color-green); color: white; font-size: 0.75rem; font-weight: 700; cursor: help; }
.location-card { border: 1px solid var(--color-border); border-radius: 0.75rem; padding: 1rem; }
.required-indicator { color: #A33D32; font-weight: 700; margin-left: 0.2rem; }
.coverage-subcard { min-width: 0; padding: 1rem; border: 1px solid var(--color-border); border-radius: 1rem; background: var(--color-cream); }
.coverage-subcard h3 { margin: 0 0 1rem; color: var(--color-green-accessible); font-size: 1.1rem; font-weight: 700; }
.coverage-checklist { max-height: 14rem; overflow-y: auto; padding: 0.5rem; border: 1px solid var(--color-border); border-radius: 0.75rem; background: var(--color-surface); }
.coverage-checklist label { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.5rem; cursor: pointer; }
.coverage-checklist label:has(input:checked) { background: var(--color-green-soft); border-radius: 0.5rem; }
.coverage-checklist input { appearance: auto; flex: 0 0 auto; width: 1.25rem; height: 1.25rem; margin-top: 0.125rem; padding: 0; accent-color: var(--color-green-accessible); }
.coverage-checklist[aria-disabled="true"] { opacity: 0.6; }
.coverage-checklist label:has(input:disabled) { cursor: not-allowed; }

@media (max-width: 640px) {
    .form-action-button,
    #buscar-button { width: 100%; }
}
