/* medicube AGE-R · Ajustes para la versión HTML/PHP.
   Reemplaza el comportamiento visual de los componentes de Radix (Dialog, Sheet, Select, Checkbox, Slider)
   por elementos nativos con el mismo aspecto. */

/* ----- Diálogos (<dialog> nativo) ----- */
dialog.mc-dialog{margin:0;right:auto;bottom:auto;color:inherit;overflow:auto;max-height:calc(100dvh - 2rem)}
dialog.mc-dialog:not([open]){display:none}
dialog.mc-dialog::backdrop,dialog.mc-sheet::backdrop{background:rgba(0,0,0,.5)}
dialog.mc-dialog[open]{animation:mc-zoom-in .2s ease-out}
@keyframes mc-zoom-in{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
.mc-dialog-close{position:absolute;top:16px;right:16px;opacity:.7;border:0;background:transparent;padding:2px;cursor:pointer;color:inherit;line-height:0;border-radius:2px}
.mc-dialog-close:hover{opacity:1}
.mc-dialog-close svg{width:16px;height:16px}
.brand-film-dialog .mc-dialog-close{color:#fff;top:24px;right:23px}
html.mc-lock{overflow:hidden}

/* ----- Menú lateral ----- */
dialog.mc-sheet{position:fixed;margin:0;inset:0 0 0 auto;height:100%;max-height:none;width:75%;max-width:24rem;border:0;border-left:1px solid #e5e5e5;box-shadow:0 10px 30px rgba(0,0,0,.18);flex-direction:column;gap:1rem;background:#fff;color:#151517}
dialog.mc-sheet[open]{display:flex;animation:mc-slide-in .35s ease-out}
@media (min-width:640px){dialog.mc-sheet{max-width:24rem}}
@keyframes mc-slide-in{from{transform:translateX(100%)}to{transform:none}}

/* ----- Select nativo con el aspecto del SelectTrigger ----- */
select.mc-select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:34px!important;cursor:pointer;color:inherit;font:inherit;text-overflow:ellipsis}
select.mc-select:focus-visible{outline:2px solid #a83465;outline-offset:1px}

/* ----- Checkbox nativo ----- */
.check-row input[type=checkbox],.access-consent input[type=checkbox]{flex-shrink:0;width:18px;height:18px;margin-top:3px;accent-color:#151517;cursor:pointer}

/* ----- Radios y deslizador de la calculadora ROI / comparador clínico ----- */
.roi-options input[type=radio]{position:absolute;opacity:0;pointer-events:none}
input.mc-range{width:100%;accent-color:#a83465;cursor:pointer}
.clinical-drag input.mc-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;cursor:ew-resize}
.clinical-drag-handle{position:absolute;top:0;bottom:0;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.15);pointer-events:none;transform:translateX(-1px)}
.clinical-drag-handle::after{content:"";position:absolute;top:50%;left:50%;width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid #a83465;transform:translate(-50%,-50%)}

/* ----- Carruseles ----- */
[data-slot=carousel-content]>div{transition:transform .45s cubic-bezier(.25,.8,.25,1);will-change:transform;touch-action:pan-y}
[data-slot=carousel-content].is-dragging>div{transition:none}
@media (prefers-reduced-motion:reduce){[data-slot=carousel-content]>div{transition:none}}
.patient-hero-track{transition:transform .45s cubic-bezier(.25,.8,.25,1),height .3s ease}

/* ----- Varios ----- */
.spin{animation:mc-spin 1s linear infinite}
@keyframes mc-spin{to{transform:rotate(360deg)}}
[hidden]{display:none!important}
.mc-login{max-width:420px;margin:70px auto 90px;padding:0 20px}
.mc-login form{display:grid;gap:16px;margin-top:24px}
.mc-login label{display:grid;gap:6px;font-size:14px}
.mc-login input{min-height:46px;border:1px solid #cfcacd;padding:0 12px;border-radius:2px;font:inherit}
.mc-login button{min-height:48px;background:#151517;color:#fff;border:0;border-radius:2px;font:inherit;cursor:pointer}
.mc-login .error-message{color:#a4133c}