/*
 * Medicación sin daños colors for the Veltrix admin theme.
 * Source: docs/Medicación sin Daños — Theme Guide for the Admin WebApp.md (light theme only).
 *
 * Loaded after bootstrap.min.css and app.min.css. Only colors are overridden;
 * fonts, sizes, radii, spacing and shadows are left as the theme defines them.
 *
 * Values the guide does not give are derived from its palette and marked "derived".
 * Info has no color of its own in the guide, so it uses the deep blue of the info note.
 */

:root,
[data-bs-theme=light] {
    /* Theme guide tokens */
    --app-bg: #eef4fd;
    --app-card: #ffffff;
    --app-card-hover: #f6f9fe;
    --app-panel: #dce9fb;
    --app-panel-hover: #cddffa;

    --app-text: #15202e;
    --app-text-secondary: #4a586c;
    --app-text-muted: #6b7a8f;
    --app-text-placeholder: #94a2b5;
    --app-divider: rgba(21, 32, 46, 0.16);
    --app-outline-dashed: #b5c2d3;

    --app-blue: #1463d6;
    --app-blue-pressed: #0f52b5;
    --app-blue-deep: #0b3f8f;
    --app-blue-light: #b9d3f6;

    --app-teal: #0f8b8d;
    --app-teal-pressed: #0c7476;
    --app-teal-text: #095c5e;
    --app-teal-tint: #dff3f2;
    --app-teal-border: #b2dedc; /* derived */

    --app-danger: #b3352b;
    --app-danger-pressed: #8c271f;
    --app-danger-text: #8c271f;
    --app-danger-tint: #fbe7e2;
    --app-danger-border: #f0c9c1;

    --app-warning: #d99a2b;
    --app-warning-pressed: #b9821f; /* derived */
    --app-warning-text: #7a4f0e;
    --app-warning-badge-text: #8a5a12;
    --app-warning-tint: #fdf0d8;
    --app-warning-border: #f2ddb4;

    --app-neutral-tint: #eaeff6;

    /* Bootstrap palette */
    --bs-blue: #1463d6;
    --bs-teal: #0f8b8d;
    --bs-green: #0f8b8d;
    --bs-red: #b3352b;
    --bs-yellow: #d99a2b;
    --bs-cyan: #0b3f8f;
    --bs-gray-dark: #15202e;

    --bs-primary: #1463d6;
    --bs-secondary: #eaeff6;
    --bs-success: #0f8b8d;
    --bs-info: #0b3f8f;
    --bs-warning: #d99a2b;
    --bs-danger: #b3352b;
    --bs-light: #eaeff6;
    --bs-dark: #15202e;

    --bs-primary-rgb: 20, 99, 214;
    --bs-secondary-rgb: 234, 239, 246;
    --bs-success-rgb: 15, 139, 141;
    --bs-info-rgb: 11, 63, 143;
    --bs-warning-rgb: 217, 154, 43;
    --bs-danger-rgb: 179, 53, 43;
    --bs-light-rgb: 234, 239, 246;
    --bs-dark-rgb: 21, 32, 46;

    --bs-primary-text-emphasis: #0b3f8f;
    --bs-secondary-text-emphasis: #4a586c;
    --bs-success-text-emphasis: #095c5e;
    --bs-info-text-emphasis: #0b3f8f;
    --bs-warning-text-emphasis: #7a4f0e;
    --bs-danger-text-emphasis: #8c271f;
    --bs-light-text-emphasis: #4a586c;
    --bs-dark-text-emphasis: #15202e;

    --bs-primary-bg-subtle: #dce9fb;
    --bs-secondary-bg-subtle: #f6f9fe;
    --bs-success-bg-subtle: #dff3f2;
    --bs-info-bg-subtle: #dce9fb;
    --bs-warning-bg-subtle: #fdf0d8;
    --bs-danger-bg-subtle: #fbe7e2;
    --bs-light-bg-subtle: #f6f9fe;
    --bs-dark-bg-subtle: #b5c2d3;

    --bs-primary-border-subtle: #b9d3f6;
    --bs-secondary-border-subtle: #eaeff6;
    --bs-success-border-subtle: #b2dedc;
    --bs-info-border-subtle: #b9d3f6;
    --bs-warning-border-subtle: #f2ddb4;
    --bs-danger-border-subtle: #f0c9c1;
    --bs-light-border-subtle: #eaeff6;
    --bs-dark-border-subtle: #94a2b5;

    /* Text and surfaces */
    --bs-body-color: #15202e;
    --bs-body-color-rgb: 21, 32, 46;
    --bs-body-bg: #eef4fd;
    --bs-body-bg-rgb: 238, 244, 253;
    --bs-emphasis-color: #15202e;
    --bs-emphasis-color-rgb: 21, 32, 46;
    --bs-secondary-color: #4a586c;
    --bs-secondary-color-rgb: 74, 88, 108;
    --bs-secondary-bg: #ffffff;
    --bs-secondary-bg-rgb: 255, 255, 255;
    --bs-tertiary-color: #6b7a8f;
    --bs-tertiary-color-rgb: 107, 122, 143;
    --bs-tertiary-bg: #f6f9fe;
    --bs-tertiary-bg-rgb: 246, 249, 254;
    --bs-heading-color: #0b3f8f;

    --bs-link-color: #1463d6;
    --bs-link-color-rgb: 20, 99, 214;
    --bs-link-hover-color: #0f52b5;
    --bs-link-hover-color-rgb: 15, 82, 181;

    --bs-border-color: rgba(21, 32, 46, 0.16);
    --bs-focus-ring-color: rgba(20, 99, 214, 0.25);

    --bs-form-valid-color: #0f8b8d;
    --bs-form-valid-border-color: #0f8b8d;
    --bs-form-invalid-color: #b3352b;
    --bs-form-invalid-border-color: #b3352b;

    /* Topbar, sidebar and footer */
    --bs-header-bg: #ffffff;
    --bs-header-item-color: #4a586c;
    --bs-topbar-search-bg: #eef4fd;
    --bs-topbar-user-bg: #eef4fd;
    --bs-boxed-body-bg: #eef4fd;
    --bs-topnav-bg: #ffffff;
    --bs-topnav-item-color: #4a586c;
    --bs-rightbar-bg: #ffffff;
    --bs-footer-bg: #eef4fd;
    --bs-footer-color: #6b7a8f;

    --bs-sidebar-bg: #ffffff;
    --bs-sidebar-menu-item-color: #4a586c;
    --bs-sidebar-menu-sub-item-color: #4a586c;
    --bs-sidebar-menu-item-icon-color: #6b7a8f;
    --bs-sidebar-menu-item-hover-color: #0b3f8f;
    --bs-sidebar-menu-item-active-color: #1463d6;
    --bs-sidebar-menu-item-active-bg: #dce9fb;
}

:root [data-sidebar=colored],
[data-bs-theme=light] [data-sidebar=colored] {
    --bs-sidebar-colored-bg: #1463d6;
    --bs-sidebar-colored-menu-item-active-bg: #0f52b5;
}

/* Links and headings */
a {
    color: var(--app-blue);
}

a:hover {
    color: var(--app-blue-pressed);
}

/* Buttons */
.btn-primary {
    --bs-btn-bg: var(--app-blue);
    --bs-btn-border-color: var(--app-blue);
    --bs-btn-hover-bg: var(--app-blue-pressed);
    --bs-btn-hover-border-color: var(--app-blue-pressed);
    --bs-btn-focus-shadow-rgb: 20, 99, 214;
    --bs-btn-active-bg: var(--app-blue-pressed);
    --bs-btn-active-border-color: var(--app-blue-pressed);
    --bs-btn-disabled-bg: var(--app-blue);
    --bs-btn-disabled-border-color: var(--app-blue);
}

.btn-success {
    --bs-btn-bg: var(--app-teal);
    --bs-btn-border-color: var(--app-teal);
    --bs-btn-hover-bg: var(--app-teal-pressed);
    --bs-btn-hover-border-color: var(--app-teal-pressed);
    --bs-btn-focus-shadow-rgb: 15, 139, 141;
    --bs-btn-active-bg: var(--app-teal-pressed);
    --bs-btn-active-border-color: var(--app-teal-pressed);
    --bs-btn-disabled-bg: var(--app-teal);
    --bs-btn-disabled-border-color: var(--app-teal);
}

.btn-info {
    --bs-btn-bg: var(--app-blue-deep);
    --bs-btn-border-color: var(--app-blue-deep);
    --bs-btn-hover-bg: var(--app-blue-pressed);
    --bs-btn-hover-border-color: var(--app-blue-pressed);
    --bs-btn-focus-shadow-rgb: 11, 63, 143;
    --bs-btn-active-bg: var(--app-blue-pressed);
    --bs-btn-active-border-color: var(--app-blue-pressed);
    --bs-btn-disabled-bg: var(--app-blue-deep);
    --bs-btn-disabled-border-color: var(--app-blue-deep);
}

.btn-warning {
    --bs-btn-bg: var(--app-warning);
    --bs-btn-border-color: var(--app-warning);
    --bs-btn-hover-bg: var(--app-warning-pressed);
    --bs-btn-hover-border-color: var(--app-warning-pressed);
    --bs-btn-focus-shadow-rgb: 217, 154, 43;
    --bs-btn-active-bg: var(--app-warning-pressed);
    --bs-btn-active-border-color: var(--app-warning-pressed);
    --bs-btn-disabled-bg: var(--app-warning);
    --bs-btn-disabled-border-color: var(--app-warning);
}

.btn-danger {
    --bs-btn-bg: var(--app-danger);
    --bs-btn-border-color: var(--app-danger);
    --bs-btn-hover-bg: var(--app-danger-pressed);
    --bs-btn-hover-border-color: var(--app-danger-pressed);
    --bs-btn-focus-shadow-rgb: 179, 53, 43;
    --bs-btn-active-bg: var(--app-danger-pressed);
    --bs-btn-active-border-color: var(--app-danger-pressed);
    --bs-btn-disabled-bg: var(--app-danger);
    --bs-btn-disabled-border-color: var(--app-danger);
}

.btn-secondary {
    --bs-btn-color: var(--app-text);
    --bs-btn-bg: var(--app-card);
    --bs-btn-border-color: var(--app-divider);
    --bs-btn-hover-color: var(--app-text);
    --bs-btn-hover-bg: var(--app-card-hover);
    --bs-btn-hover-border-color: var(--app-divider);
    --bs-btn-active-color: var(--app-text);
    --bs-btn-active-bg: var(--app-panel);
    --bs-btn-active-border-color: var(--app-divider);
    --bs-btn-disabled-color: var(--app-text-muted);
    --bs-btn-disabled-bg: var(--app-card);
    --bs-btn-disabled-border-color: var(--app-divider);
}

.btn-outline-primary {
    --bs-btn-color: var(--app-blue);
    --bs-btn-border-color: var(--app-blue);
    --bs-btn-hover-bg: var(--app-blue);
    --bs-btn-hover-border-color: var(--app-blue);
    --bs-btn-focus-shadow-rgb: 20, 99, 214;
    --bs-btn-active-bg: var(--app-blue-pressed);
    --bs-btn-active-border-color: var(--app-blue-pressed);
    --bs-btn-disabled-color: var(--app-blue);
    --bs-btn-disabled-border-color: var(--app-blue);
}

.btn-outline-success {
    --bs-btn-color: var(--app-teal);
    --bs-btn-border-color: var(--app-teal);
    --bs-btn-hover-bg: var(--app-teal);
    --bs-btn-hover-border-color: var(--app-teal);
    --bs-btn-focus-shadow-rgb: 15, 139, 141;
    --bs-btn-active-bg: var(--app-teal-pressed);
    --bs-btn-active-border-color: var(--app-teal-pressed);
    --bs-btn-disabled-color: var(--app-teal);
    --bs-btn-disabled-border-color: var(--app-teal);
}

.btn-outline-info {
    --bs-btn-color: var(--app-blue-deep);
    --bs-btn-border-color: var(--app-blue-deep);
    --bs-btn-hover-bg: var(--app-blue-deep);
    --bs-btn-hover-border-color: var(--app-blue-deep);
    --bs-btn-focus-shadow-rgb: 11, 63, 143;
    --bs-btn-active-bg: var(--app-blue-deep);
    --bs-btn-active-border-color: var(--app-blue-deep);
    --bs-btn-disabled-color: var(--app-blue-deep);
    --bs-btn-disabled-border-color: var(--app-blue-deep);
}

.btn-outline-warning {
    --bs-btn-color: var(--app-warning-text);
    --bs-btn-border-color: var(--app-warning);
    --bs-btn-hover-bg: var(--app-warning);
    --bs-btn-hover-border-color: var(--app-warning);
    --bs-btn-focus-shadow-rgb: 217, 154, 43;
    --bs-btn-active-bg: var(--app-warning-pressed);
    --bs-btn-active-border-color: var(--app-warning-pressed);
    --bs-btn-disabled-color: var(--app-warning-text);
    --bs-btn-disabled-border-color: var(--app-warning);
}

.btn-outline-danger {
    --bs-btn-color: var(--app-danger);
    --bs-btn-border-color: var(--app-danger);
    --bs-btn-hover-bg: var(--app-danger);
    --bs-btn-hover-border-color: var(--app-danger);
    --bs-btn-focus-shadow-rgb: 179, 53, 43;
    --bs-btn-active-bg: var(--app-danger-pressed);
    --bs-btn-active-border-color: var(--app-danger-pressed);
    --bs-btn-disabled-color: var(--app-danger);
    --bs-btn-disabled-border-color: var(--app-danger);
}

.btn-link {
    --bs-btn-focus-shadow-rgb: 20, 99, 214;
}

/* Form controls: focus border is the primary blue, invalid is danger */
.form-control::placeholder {
    color: var(--app-text-placeholder);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    border-color: var(--app-blue);
    box-shadow: 0 0 0 .25rem rgba(20, 99, 214, .25);
}

.form-check-input:checked,
.form-check-input[type=checkbox]:indeterminate {
    background-color: var(--app-blue);
    border-color: var(--app-blue);
}

.form-switch .form-check-input:focus {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23b9d3f6'/%3e%3c/svg%3e");
}

.form-range::-webkit-slider-thumb {
    background-color: var(--app-blue);
}

.form-range::-moz-range-thumb {
    background-color: var(--app-blue);
}

.form-range:focus::-webkit-slider-thumb {
    box-shadow: 0 0 0 1px var(--app-bg), 0 0 0 .25rem rgba(20, 99, 214, .25);
}

.form-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 1px var(--app-bg), 0 0 0 .25rem rgba(20, 99, 214, .25);
}

.form-control.is-valid,
.was-validated .form-control:valid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%230f8b8d' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23b3352b'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23b3352b' stroke='none'/%3e%3c/svg%3e");
}

.nav-link:focus-visible {
    box-shadow: 0 0 0 .25rem rgba(20, 99, 214, .25);
}

/* Navigation, pagination, progress, lists */
.nav-pills {
    --bs-nav-pills-link-active-bg: var(--app-blue);
}

.nav-tabs-custom .nav-item .nav-link::after {
    background: var(--app-blue);
}

.nav-tabs-custom .nav-item .nav-link.active {
    color: var(--app-blue);
}

.pagination {
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(20, 99, 214, 0.25);
    --bs-pagination-active-bg: var(--app-blue);
    --bs-pagination-active-border-color: var(--app-blue);
}

.progress,
.progress-stacked {
    --bs-progress-bar-bg: var(--app-blue);
}

.list-group {
    --bs-list-group-active-bg: var(--app-blue);
    --bs-list-group-active-border-color: var(--app-blue);
}

.btn-close {
    --bs-btn-close-focus-shadow: 0 0 0 0.25rem rgba(20, 99, 214, 0.25);
}

.dropdown-item:active,
.dropdown-item.active {
    background-color: var(--app-blue);
}

/* Status badges: same colors as the mobile app's IMC classes and check results */
.badge-soft-primary,
.badge-soft-primary[href]:focus,
.badge-soft-primary[href]:hover {
    color: var(--app-blue-deep);
    background-color: var(--app-panel);
}

.badge-soft-success,
.badge-soft-success[href]:focus,
.badge-soft-success[href]:hover {
    color: var(--app-teal-text);
    background-color: var(--app-teal-tint);
}

.badge-soft-info,
.badge-soft-info[href]:focus,
.badge-soft-info[href]:hover {
    color: var(--app-blue-deep);
    background-color: var(--app-panel);
}

.badge-soft-warning,
.badge-soft-warning[href]:focus,
.badge-soft-warning[href]:hover {
    color: var(--app-warning-badge-text);
    background-color: var(--app-warning-tint);
}

.badge-soft-danger,
.badge-soft-danger[href]:focus,
.badge-soft-danger[href]:hover {
    color: var(--app-danger);
    background-color: var(--app-danger-tint);
}

.badge-soft-secondary,
.badge-soft-secondary[href]:focus,
.badge-soft-secondary[href]:hover {
    color: var(--app-text-secondary);
    background-color: var(--app-neutral-tint);
}

/* Veltrix components with hard-coded colors */
.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a,
.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a i {
    color: var(--app-blue);
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul ul li.active a {
    color: var(--app-blue);
}

.navbar-header .dropdown .header-item.show {
    background: rgba(21, 32, 46, .05);
}

.avatar-title {
    background-color: var(--app-blue);
}

input[switch] + label {
    background-color: #d6dfeb;
}

input[switch]:checked + label,
input[switch=primary]:checked + label {
    background-color: var(--app-blue);
}

input[switch=bool]:checked + label,
input[switch=success]:checked + label {
    background-color: var(--app-teal);
}

input[switch=bool] + label,
input[switch=danger]:checked + label {
    background-color: var(--app-danger);
}

input[switch=warning]:checked + label {
    background-color: var(--app-warning);
}

input[switch=info]:checked + label {
    background-color: var(--app-blue-deep);
}

.activity-feed .feed-item::after {
    background: var(--app-teal);
}

.account-pages .logo-admin {
    border-bottom-color: var(--app-blue);
}

.error,
.parsley-errors-list > li {
    color: var(--app-danger);
}

.parsley-error {
    border-color: var(--app-danger);
}