@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700;800&display=swap');

*::before,
*::after { -webkit-box-sizing:border-box; box-sizing:border-box }

@-ms-viewport { width:device-width }

article, aside, dialog, figcaption, figure, footer, header, main, nav, section { display:block }
html { font-family:"Open Sans", "Helvetica Neue", Arial, sans-serif; line-height:1.15; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -ms-overflow-style:scrollbar; -webkit-tap-highlight-color:rgba(0, 0, 0, 0) }
body { background-color:#fff; color:#444444; font-family:'Open Sans', sans-serif; font-size:0.9rem; font-weight:400; line-height:1.5; margin:0; text-align:left }
a, a:focus, button, button:focus, input, input:focus, textarea, textarea:focus, select, select:focus { outline:none !important }
.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #8b8c90;
    --bs-btn-border-color: #8b8c90;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #615d5c;
    --bs-btn-hover-border-color: #615d5c;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #8b8c90;
    --bs-btn-active-border-color: #8b8c90;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #cccccc;
    --bs-btn-disabled-border-color: #cccccc;
}
.btn-info {
    --bs-btn-color: #000;
    --bs-btn-bg: #0dcaf0;
    --bs-btn-border-color: #0dcaf0;
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: #31d2f2;
    --bs-btn-hover-border-color: #25cff2;
    --bs-btn-focus-shadow-rgb: 11, 172, 204;
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: #bfeaf3;
    --bs-btn-active-border-color: #25cff2;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #000;
    --bs-btn-disabled-bg: #0dcaf0;
    --bs-btn-disabled-border-color: #0dcaf0
}

.bootstrap-select>.dropdown-toggle, .bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle {  
    background:none !important; 
    border: none !important; 
    outline: none !important;
    padding: 6px 0;
}
.bootstrap-select>.dropdown-toggle:after { display: none; }
.bootstrap-select .dropdown-menu { transform: none !important; width: 100%;}
#servicio~.dropdown-menu .inner { height: 200px !important;}

.was-validated .bootstrap-select:has(>:invalid)~.invalid-feedback,
.bootstrap-select:has(>.is-invalid)~.invalid-feedback { display: block;}

table.dataTable th.dt-type-date,
table.dataTable td.dt-type-date { text-align: left;}

.form-check-input { cursor: pointer;}
.form-check-input-lg { width: 4em !important; padding:1em; margin-top: -0.25em; margin-right: 0.5em;  }


/* Header */
header { display:block; width:100%; z-index:100; }
header .top { padding: 1rem 0; }

/* Main */
main { }


/* Menu */
.menu { z-index:100; }
.nav-pills {
    --bs-nav-pills-link-active-color: #000000;
    --bs-nav-pills-link-active-bg: #d0cec9;
}


/* Diagnóstico */
.comentario { padding: .375rem .75rem; border-radius: var(--bs-border-radius); margin-bottom: 1rem; }
.comentario.comentario-profesional { text-align: right; background-color: #EDDFE0;}

/* Recursos */
#recursos .dt-search { /*display: none;*/ }

/* Catálogo */
#catalogo .card .card-body { position: relative;}
#catalogo .card .card-body .card-button { position: absolute; top: -30px; left: 0; right: 0; margin-inline: auto; width: fit-content;}

/* Descuentos */
#descuentos .card { border: 2px solid #f0f0f0; transition: border-color 0.3s ease, box-shadow 0.3s ease; }
#descuentos .btn-check:checked + .card { border: 2px solid #198754; box-shadow: 0 0 10px rgba(25,135,84,0.3); position: relative; }
#descuentos .btn-check:checked + .card:after { content: "\f058";  font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; top: 19px; left:-13px; font-size: 26px; line-height: 1rem; color: green; background-color: white; border-radius: 100% }
#descuentos .card:hover { border: 2px solid #198754; }


/* Footer */
footer { display:block; width:100%; z-index:100; margin-top: 2rem; }
footer .container { margin-left:auto; margin-right:auto; padding-left:15px; padding-right:15px }
footer .bottom { background:#000000; color:#fff; font-size:13px; font-weight:400 }
footer .bottom p { margin:20px 0 }