/* Buscador v3, ronda 4 (flag mt5_search_v3_enabled): cabecera, barra de abajo del celular y pie del layout mainv2 en
   TODAS las páginas (layouts/_v3-header.php y _v3-footer.php). El layout carga este archivo sólo con el flag prendido y
   pone la clase `mt5v3-site` en el body: con el flag apagado no se carga y el sitio queda igual.

   Prototipo aprobado: docs/buscador-web/prototipo/buscador-mrturno.html (`.hdr`, `.q`, `.zsel`, `.who`, `.sub`,
   `.tabbar`). Marca: Revamp v6 de la app (los mismos tokens que search-v3.css). Celular < 640 px; tablet 640–979
   (la misma franja, más angosta); computadora ≥ 980. */
/* Ronda 6: el pie v3 también va en el micrositio (sin body.mt5v3-site), por eso los tokens también viven en .mt5v3-f. */
body.mt5v3-site, .mt5v3-f {
  --v3s-or: #FF7300;
  --v3s-grad: linear-gradient(90deg, #FF7300 0%, #FF8A26 100%);
  --v3s-link: #D86100;
  --v3s-on-soft: #B04F00;
  --v3s-soft: #FFF2E7;
  --v3s-peach: #FFD9B8;
  --v3s-ink: #231F1D;
  --v3s-ink-2: #3F3835;
  --v3s-ink-3: #6E6560;
  --v3s-line: #F1EAE4;
  --v3s-font: Nunito, "Segoe UI", system-ui, -apple-system, sans-serif;
  --mt2-grad: var(--v3s-grad);
}
/* El pie siempre abajo aunque la página sea corta (sin hueco debajo del pie). */
body.mt5v3-site { min-height: 100vh; }
body.mt5v3-site > .mrturno-h100 { flex: 1 0 auto; }
/* Sin el espaciador de 3rem bajo el menú: lo reemplaza un aire chico (en el buscador, nada). */
body.mt5v3-site .mrturno-h100 > .pt-5 { padding-top: 16px !important; }
/* Ronda 9: la regla vieja del logo (site-custom.css: h1, .h1 { height: 12px; text-indent: -9999px }) escondía todos los
   h1 del sitio. Con la cabecera v3 el logo no es un h1: los títulos de página se ven. :where() deja la especificidad de
   un h1 suelto para que las clases de cada página (p. ej. .mt5v3-pg-title) sigan mandando en tamaño y peso. */
:where(body.mt5v3-site) h1, :where(body.mt5v3-site) .h1 { height: auto; text-indent: 0; background: none; cursor: auto; margin: 0 0 .5rem; }

/* ---------- Cabecera: una sola franja naranja, pegada arriba al bajar ---------- */
.mt5v3-h { position: sticky; top: 0; z-index: 1040; height: auto !important; background: var(--v3s-grad) !important; color: #fff; font-family: var(--v3s-font); padding-top: env(safe-area-inset-top, 0px); box-shadow: 0 2px 10px rgba(180, 80, 10, .14); }
.mt5v3-h *, .mt5v3-h *::before, .mt5v3-h *::after { box-sizing: border-box; }
.mt5v3-h button { font: inherit; cursor: pointer; }
.mt5v3-h-in { max-width: 1320px; margin: 0 auto; padding: 10px 16px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "logo . me" "q q q" "ctx ctx ctx"; gap: 8px 14px; align-items: center; }
.mt5v3-logo { grid-area: logo; justify-self: start; display: block; line-height: 0; }
.mt5v3-logo img { height: 26px; width: auto; display: block; }
.mt5v3-q { grid-area: q; position: relative; display: flex; align-items: stretch; height: 46px; margin: 0; background: #fff; border-radius: 12px; box-shadow: 0 1px 2px rgba(0, 0, 0, .12); min-width: 0; }
.mt5v3-q:focus-within { outline: 2px solid #fff; outline-offset: 2px; }
.mt5v3-q input[type="search"] { flex: 1; min-width: 0; height: 46px; border: 0; border-radius: 12px; padding: 0 50px 0 14px; background: transparent; color: var(--v3s-ink); font-size: 16px; font-family: var(--v3s-font); box-shadow: none; }
.mt5v3-q input[type="search"]::placeholder { color: var(--v3s-ink-3); }
.mt5v3-q input[type="search"]:focus { outline: none; }
.mt5v3-go { position: absolute; right: 5px; top: 5px; width: 36px; height: 36px; border: 0; border-radius: 9px; background: var(--v3s-soft); color: var(--v3s-on-soft) !important; display: grid; place-items: center; padding: 0; }
.mt5v3-go:hover { background: var(--v3s-peach); }
.mt5v3-zsel { display: none; align-items: center; gap: 7px; flex: none; max-width: 210px; padding: 0 12px; border: 0; border-right: 1px solid var(--v3s-peach); border-radius: 12px 0 0 12px; background: var(--v3s-soft); color: var(--v3s-ink); text-align: left; line-height: 1.1; }
.mt5v3-zsel:hover { background: #FFE7D1; }
.mt5v3-zsel svg { flex: none; color: var(--v3s-on-soft); }
.mt5v3-zsel > span:not(.mt5v3-car) { min-width: 0; }
.mt5v3-zsel small { display: block; font-size: 11px; color: var(--v3s-ink-3); }
.mt5v3-zsel b { display: block; font-size: 13.5px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt5v3-car { font-size: 9px; opacity: .8; }
.mt5v3-who-wrap { grid-area: who; display: none; min-width: 0; }
.mt5v3-who { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border: 0; background: none; color: #fff; text-align: left; line-height: 1.15; padding: 4px 8px; border-radius: 8px; min-width: 0; max-width: 260px; min-height: 44px; }
.mt5v3-who:hover { background: rgba(255, 255, 255, .16); }
.mt5v3-who small { font-size: 12px; opacity: .92; }
.mt5v3-who b { font-size: 14.5px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.mt5v3-me { grid-area: me; justify-self: end; border: 0; background: none; padding: 0; display: grid; place-items: center; min-width: 44px; min-height: 44px; }
.mt5v3-avatar { width: 34px; height: 34px; border-radius: 50%; background: #fff; color: var(--v3s-on-soft); font-weight: 900; font-size: 13px; display: grid; place-items: center; letter-spacing: .2px; }
.mt5v3-me:hover .mt5v3-avatar { box-shadow: 0 0 0 3px rgba(255, 255, 255, .35); }
.mt5v3-guest { grid-area: me; justify-self: end; display: flex; align-items: center; gap: 12px; }
.mt5v3-reg { color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.mt5v3-login { background: #fff; color: var(--v3s-on-soft) !important; font-weight: 800; font-size: 14px; padding: 9px 14px; border-radius: 10px; white-space: nowrap; text-decoration: none; box-shadow: 0 2px 6px rgba(0, 0, 0, .12); }
.mt5v3-login:hover { background: var(--v3s-soft); }
/* Celular: zona y «para quién» debajo del buscador */
.mt5v3-ctx { grid-area: ctx; display: flex; gap: 8px; min-width: 0; }
.mt5v3-ctx button { display: inline-flex; align-items: center; gap: 6px; flex: 0 1 auto; border: 0; background: rgba(255, 255, 255, .18); color: #fff; border-radius: 10px; padding: 4px 10px 4px 8px; font-size: 14px; line-height: 1.2; text-align: left; max-width: 100%; min-height: 44px; min-width: 0; }
.mt5v3-ctx button:hover { background: rgba(255, 255, 255, .28); }
.mt5v3-ctx svg { flex: none; }
.mt5v3-ctx button > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mt5v3-ctx small { display: block; font-size: 12px; opacity: .9; }
.mt5v3-ctx b { font-weight: 800; }
/* Línea fina de menús, dentro del mismo naranja (tablet y compu) */
.mt5v3-sub { display: none; border-top: 1px solid rgba(255, 255, 255, .24); }
.mt5v3-sub-in { max-width: 1320px; margin: 0 auto; padding: 0 16px; height: 40px; display: flex; align-items: center; gap: 22px; overflow-x: auto; scrollbar-width: none; }
.mt5v3-sub-in::-webkit-scrollbar { display: none; }
.mt5v3-sub a, .mt5v3-sub button { border: 0; border-bottom: 2px solid transparent; background: none; color: #fff !important; padding: 0; height: 40px; display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; white-space: nowrap; text-decoration: none; opacity: .95; }
.mt5v3-sub a:hover, .mt5v3-sub button:hover { opacity: 1; border-bottom-color: rgba(255, 255, 255, .6); }
.mt5v3-sub a.is-on { font-weight: 800; opacity: 1; border-bottom-color: #fff; }
.mt5v3-sub .mt5v3-idx { font-weight: 800; }
.mt5v3-sp { flex: 1; }
.mt5v3-h :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

/* ---------- Celular: los menús abajo, fijos, como una app ---------- */
.mt5v3-tabbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035; display: grid; grid-template-columns: repeat(4, 1fr); background: #fff; border-top: 1px solid var(--v3s-line); box-shadow: 0 -4px 14px rgba(70, 50, 30, .06); padding-bottom: env(safe-area-inset-bottom, 0px); font-family: var(--v3s-font); }
.mt5v3-tabbar a { height: 58px; display: grid; place-items: center; align-content: center; gap: 3px; font-size: 12.5px; font-weight: 700; color: var(--v3s-ink-3) !important; text-decoration: none; }
.mt5v3-tabbar a.is-on { color: var(--v3s-link) !important; font-weight: 800; }
.mt5v3-tabbar a:focus-visible { outline: 2px solid var(--v3s-or); outline-offset: -4px; }
body.mt5v3-site.mt5v3-tabs { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
body.mt5v3-site.mt5v3-tabs #cookies-alert { bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }

/* El panel de perfil cerrado no deja su sombra asomada en el borde derecho. */
body.mt5v3-site .mt2-profile:not(.mt2-open) .mt2-profile-panel { box-shadow: none; }

/* ---------- Índice «Especialidades ›» ---------- */
.mt5v3-iov { position: fixed; inset: 0; z-index: 100000; background: rgba(35, 31, 29, .4); }
.mt5v3-isheet { position: fixed; left: 0; right: 0; bottom: 0; z-index: 100001; max-height: 80vh; display: flex; flex-direction: column; background: #FCF8F6; border-radius: 18px 18px 0 0; font-family: var(--v3s-font); color: var(--v3s-ink); box-shadow: 0 -8px 30px rgba(70, 50, 30, .18); }
.mt5v3-isheet[hidden], .mt5v3-iov[hidden] { display: none !important; }
.mt5v3-isheet-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; background: #fff; border-bottom: 1px solid var(--v3s-line); border-radius: 18px 18px 0 0; }
.mt5v3-isheet-h h2 { margin: 0; font-size: 19px; line-height: 26px; font-weight: 800; color: var(--v3s-ink); text-align: left; font-family: var(--v3s-font); }
.mt5v3-isheet-x { border: 0; background: none; font-size: 28px; line-height: 1; color: var(--v3s-ink-3); min-width: 44px; min-height: 44px; border-radius: 12px; }
.mt5v3-isheet-b { overflow-y: auto; padding: 12px 16px 18px; overscroll-behavior: contain; }
.mt5v3-idxg { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 2px 12px; }
.mt5v3-idxg a { display: flex; align-items: center; min-height: 44px; padding: 6px 8px; border-radius: 10px; font-size: 15px; font-weight: 700; color: var(--v3s-ink-2) !important; text-decoration: none; }
.mt5v3-idxg a:hover { background: var(--v3s-soft); color: var(--v3s-on-soft) !important; }
.mt5v3-isheet-hint { margin: 10px 0 0; font-size: 13px; line-height: 18px; color: var(--v3s-ink-3); }

/* ---------- Ronda 5: «Conectá tu IA» (prototipo `.ia`, hoja 'ia') ----------
   Sólo para pacientes con Conectar con IA habilitado que todavía no conectaron (SiteHeaderV3::showConnectAi). Pastilla
   blanca sobre el naranja con los logos oficiales de Claude y ChatGPT (web/img/ia). Celular: fila de arriba, entre el
   logo y el avatar, sin «Nuevo»; tablet y compu: en la línea fina, antes de «Ayuda». */
.mt5v3-h .mt5v3-ia { position: relative; display: inline-flex; align-items: center; gap: 8px; flex: none; height: 30px; padding: 0 12px 0 3px; border: 0; border-radius: 99px; background: #fff; color: var(--v3s-ink) !important; font-family: var(--v3s-font); font-weight: 800; font-size: 13.5px; line-height: 1; white-space: nowrap; opacity: 1; box-shadow: 0 2px 10px rgba(120, 50, 0, .22); }
.mt5v3-h .mt5v3-ia:hover { box-shadow: 0 3px 14px rgba(120, 50, 0, .32); border-bottom: 0; }
.mt5v3-h .mt5v3-ia::after { content: ""; position: absolute; inset: -7px -2px; }
.mt5v3-ia-lg { display: inline-flex; }
.mt5v3-ia-lg img { width: 24px; height: 24px; border-radius: 50%; border: 2px solid #fff; box-sizing: content-box; display: block; }
.mt5v3-ia-lg img + img { margin-left: -9px; }
.mt5v3-ia-nw { font-size: 10px; font-weight: 900; letter-spacing: .4px; text-transform: uppercase; color: #fff; background: var(--v3s-on-soft); border-radius: 99px; padding: 2px 6px 1px; line-height: 12px; }
.mt5v3-h-in > .mt5v3-ia { grid-area: ia; justify-self: end; }
.mt5v3-h-in.has-ia { grid-template-areas: "logo ia me" "q q q" "ctx ctx ctx"; }
.mt5v3-sub .mt5v3-ia { margin: 5px 0; }
/* La hoja */
.mt5v3-iasheet .mt5v3-isheet-b { padding: 14px 18px 8px; }
.mt5v3-iabox { display: grid; gap: 12px; font-size: 15.5px; line-height: 22px; color: var(--v3s-ink); }
.mt5v3-iabox p { margin: 0; }
.mt5v3-ia-lgs { display: flex; gap: 10px; }
.mt5v3-ia-lgs img { width: 44px; height: 44px; border-radius: 50%; display: block; }
.mt5v3-ia-ex { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-style: italic; color: var(--v3s-ink-2); font-size: 14.5px; line-height: 20px; }
.mt5v3-iabox .mt5v3-ia-fine { font-size: 13.5px; line-height: 19px; color: var(--v3s-ink-3); }
.mt5v3-isheet-f { padding: 12px 18px calc(14px + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid var(--v3s-line); }
.mt5v3-ia-go { display: flex; align-items: center; justify-content: center; min-height: 48px; border-radius: 14px; background: var(--v3s-or); color: #fff !important; font-family: var(--v3s-font); font-weight: 800; font-size: 16px; text-decoration: none; box-shadow: 0 8px 18px -6px rgba(255, 115, 0, .45); }
.mt5v3-ia-go:hover { background: #E46700; }
.mt5v3-ia-go:focus-visible { outline: 2px solid var(--v3s-ink); outline-offset: 2px; }

/* La hoja «¿Para quién buscás?» en otras páginas: la línea de aviso de guardado, alineada (vacía no ocupa lugar). */
body.mt5v3-site > .mt5-profile { margin: 8px 16px 0; }
body.mt5v3-site > .mt5-profile:not(:has(*)) { display: none; }

/* ---------- Pie compacto ---------- */
.mt5v3-f { background: var(--v3s-grad); color: #fff; font-family: var(--v3s-font); padding: 18px 16px 14px; margin-top: 16px; }
.mt5v3-f-in { max-width: 1320px; margin: 0 auto; display: grid; gap: 12px; }
.mt5v3-f-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 24px; }
.mt5v3-f-logo { line-height: 0; }
.mt5v3-f-logo img { width: 96px; height: auto; display: block; }
.mt5v3-f-nums { margin: 0; display: grid; grid-template-columns: repeat(3, auto); gap: 6px 20px; justify-content: center; }
.mt5v3-f-nums > div { display: flex; flex-direction: column; align-items: center; text-align: center; }
.mt5v3-f-nums dd { margin: 0; font-weight: 800; font-size: 19px; line-height: 24px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mt5v3-f-nums dt { font-weight: 600; font-size: 13px; line-height: 17px; opacity: .95; white-space: nowrap; }
.mt5v3-f-apps { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; }
.mt5v3-f-apps > span { font-size: 13px; font-weight: 700; }
.mt5v3-f-google { height: 40px; width: auto; display: block; }
.mt5v3-f-apple { height: 32px; width: auto; display: block; }
.mt5v3-f-legal { border-top: 1px solid rgba(255, 255, 255, .3); padding-top: 10px; }
.mt5v3-f-links { display: grid; grid-template-columns: repeat(2, minmax(0, auto)); align-items: center; justify-content: center; gap: 2px 20px; }
.mt5v3-f-links a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; color: #fff !important; font-size: 14px; font-weight: 700; text-decoration: none; }
.mt5v3-f-links a:hover { text-decoration: underline; }
.mt5v3-f-aaip img { width: 28px; height: 28px; border-radius: 4px; background: #fff; display: block; }
.mt5v3-f-copy { margin: 0; font-size: 13px; line-height: 18px; opacity: .92; text-align: center; }
.mt5v3-f :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

@media (max-width: 639px) {
  .mt5v3-h-in { column-gap: 8px; }
  .mt5v3-logo img { height: 24px; }
  .mt5v3-guest { gap: 10px; }
  .mt5v3-login { padding: 9px 12px; }
  .mt5v3-f-row:first-child { gap: 10px 18px; }
  .mt5v3-f-logo { flex-basis: 100%; display: flex; justify-content: center; }
  /* «Conectá tu IA» entre el logo y el avatar: sin «Nuevo» para que entre en 360 px */
  .mt5v3-h .mt5v3-ia--top { gap: 6px; padding-right: 10px; font-size: 13px; }
  .mt5v3-ia--top .mt5v3-ia-nw { display: none; }
  .mt5v3-ia--top .mt5v3-ia-lg img { width: 22px; height: 22px; }
}
@media (max-width: 380px) {
  .mt5v3-logo img { height: 22px; }
  .mt5v3-guest { gap: 8px; }
  .mt5v3-reg, .mt5v3-login { font-size: 13px; }
  .mt5v3-login { padding: 8px 10px; }
  .mt5v3-f-nums { gap: 6px 12px; }
  .mt5v3-f-nums dd { font-size: 17px; }
  .mt5v3-h-in.has-ia { column-gap: 6px; }
  .mt5v3-h .mt5v3-ia--top { font-size: 12.5px; padding-right: 9px; }
}

/* ---------- Tablet: la misma franja que la computadora, más angosta ---------- */
@media (min-width: 640px) {
  .mt5v3-h-in { grid-template-columns: auto minmax(0, 1fr) auto auto; grid-template-areas: "logo q who me"; padding: 10px 20px; column-gap: 14px; }
  .mt5v3-h-in.is-guest { grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "logo q me"; }
  .mt5v3-h-in.has-ia { grid-template-areas: "logo q who me"; }
  .mt5v3-h-in > .mt5v3-ia { display: none; }
  .mt5v3-logo img { height: 28px; }
  .mt5v3-h-in > .mt5v3-ctx { display: none; }
  .mt5v3-who-wrap { display: flex; }
  .mt5v3-zsel { display: flex; }
  .mt5v3-sub { display: block; }
  .mt5v3-sub-in { padding: 0 20px; gap: 20px; }
  .mt5v3-tabbar { display: none; }
  body.mt5v3-site.mt5v3-tabs { padding-bottom: 0; }
  body.mt5v3-site.mt5v3-tabs #cookies-alert { bottom: 0; }
  .mt5v3-isheet { left: 50%; right: auto; bottom: auto; top: 120px; width: min(720px, calc(100vw - 40px)); transform: translateX(-50%); max-height: calc(100vh - 160px); border-radius: 18px; }
  .mt5v3-isheet-h { border-radius: 18px 18px 0 0; }
  .mt5v3-iasheet { width: min(500px, calc(100vw - 40px)); }
  .mt5v3-isheet-f { border-radius: 0 0 18px 18px; padding-bottom: 14px; }
  .mt5v3-f { padding: 16px 20px 12px; }
  .mt5v3-f-links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
}
/* Tablet angosta: el «Turno para» corto para que el buscador no quede chico */
@media (min-width: 640px) and (max-width: 979px) {
  .mt5v3-h-in { column-gap: 10px; }
  .mt5v3-logo img { height: 24px; }
  .mt5v3-zsel { max-width: 140px; padding: 0 10px; }
  .mt5v3-who { max-width: 150px; padding: 4px 4px; }
  .mt5v3-who small { font-size: 11.5px; }
  .mt5v3-who b { font-size: 13.5px; }
  .mt5v3-sub a, .mt5v3-sub button { font-size: 13.5px; }
}

/* ---------- Computadora ---------- */
@media (min-width: 980px) {
  /* Alineado con el contenido del buscador (contenedor de 1320 px con 12 px de margen). */
  .mt5v3-h-in, .mt5v3-sub-in, .mt5v3-f-in { max-width: 1344px; }
  .mt5v3-h-in { padding: 12px 24px; grid-template-columns: 170px minmax(0, 1fr) auto auto; column-gap: 20px; }
  .mt5v3-h-in.is-guest { grid-template-columns: 170px minmax(0, 1fr) auto; }
  .mt5v3-logo img { height: 32px; }
  .mt5v3-q, .mt5v3-q input[type="search"] { height: 48px; }
  .mt5v3-go { top: 6px; }
  .mt5v3-sub-in { padding: 0 24px; gap: 26px; }
  .mt5v3-f { padding: 14px 0 10px; }
  .mt5v3-f-in { padding: 0 24px; }
  .mt5v3-f-row { justify-content: space-between; flex-wrap: nowrap; }
  .mt5v3-f-legal { flex-wrap: wrap; }
  .mt5v3-f-links { justify-content: flex-start; }
  .mt5v3-f-copy { text-align: right; }
}

/* ---------- Ronda 7: el comentario en una línea, igual en todas las pantallas (layouts/_v3-feedback) ----------
   Reemplaza la tarjeta grande «¡Ayudanos a mejorar!» del widget Feedback (que sigue en el HTML con su modal y su envío).
   En el micrositio el link toma el color del centro (--mt5m-link, microsite-v3.css). */
body.mt5v3-site #form-feedback > .mt-card, body.mt5m #form-feedback > .mt-card { display: none !important; }
body.mt5v3-site .mrturno-h100 > .mt-4.mb-4 { margin: 8px 0 0 !important; }
body.mt5m .mrturno-h100 > .mt-4, body.mt5m-blank .container > .mt-4 { margin-top: 8px !important; }
.mt5v3-fbk { display: grid; gap: 6px; padding: 10px 4px 2px; font-family: var(--mt5m-font, var(--v3s-font, Nunito, "Segoe UI", system-ui, sans-serif)); }
.mt5v3-fbk-l { display: flex; align-items: flex-start; justify-content: center; gap: 8px; margin: 0; font-size: 15px; line-height: 20px; color: #3F3835; text-align: left; }
.mt5v3-fbk-l > svg { flex: none; margin-top: 2px; color: var(--mt5m-link, #B85300); }
.mt5v3-fbk-l a { color: var(--mt5m-link, #D86100) !important; font-weight: 800; text-decoration: none; }
.mt5v3-fbk-l a:hover { text-decoration: underline; }
.mt5v3-fbk-l a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; border-radius: 4px; }
.mt5v3-fbk-l small { display: block; font-size: 13px; line-height: 18px; color: #6E6560; }
/* Ronda 8: el llamado a los profesionales (antes «¿Tenés un centro de salud?», un link perdido): bloque con contraste y
   botón. Fondo naranja claro de la marca; el botón en orange-800 (#B85300, 4,9:1 con el blanco: AA). En el celular el
   botón va abajo, a todo el ancho. */
.mt5v3-fbk.has-join { gap: 12px; }
.mt5v3-pro { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; padding: 14px 16px; border-radius: 16px; background: #FFF2E7; border: 1.5px solid #FFD9B8; color: #231F1D !important; text-decoration: none !important; text-align: left; }
.mt5v3-pro:hover { background: #FFE7D1; border-color: #FF7300; }
.mt5v3-pro:focus-visible { outline: 2px solid #B85300; outline-offset: 2px; }
.mt5v3-pro-ic { flex: none; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: #B85300; display: grid; place-items: center; }
.mt5v3-pro-t { flex: 1 1 calc(100% - 56px); min-width: 0; }
.mt5v3-pro-t b { display: block; font-size: 16px; line-height: 21px; font-weight: 800; color: #231F1D; }
.mt5v3-pro-t small { display: block; margin-top: 2px; font-size: 14px; line-height: 19px; color: #3F3835; }
.mt5v3-pro-go { flex: 1 1 100%; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 12px; background: #B85300; color: #fff; font-weight: 800; font-size: 15px; line-height: 1.2; white-space: nowrap; box-shadow: 0 6px 14px -6px rgba(184, 83, 0, .55); }
.mt5v3-pro:hover .mt5v3-pro-go { background: #9E4700; }
@media (min-width: 640px) {
  .mt5v3-pro { flex-wrap: nowrap; padding: 14px 18px; }
  .mt5v3-pro-t { flex: 1 1 auto; }
  .mt5v3-pro-go { flex: none; }
}
@media (min-width: 980px) {
  .mt5v3-fbk.has-join { grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr); align-items: center; gap: 24px; }
  .mt5v3-fbk.has-join .mt5v3-fbk-l { justify-content: flex-start; }
}

/* ---------- Ronda 8: letra un punto más grande en el celular (< 640 px) ----------
   +1 px a toda la escala tipográfica del v3 (también los textos chicos de 12-13 px). Mismos selectores que arriba, al
   final del archivo para que ganen sólo en el celular; tablet y compu quedan igual. Sin los íconos de texto (×, ▾). */
@media (max-width: 639px) {
  .mt5v3-q input[type="search"] { font-size: 17px; }
  .mt5v3-zsel small { font-size: 12px; }
  .mt5v3-zsel b { font-size: 14.5px; }
  .mt5v3-who small { font-size: 13px; }
  .mt5v3-who b { font-size: 15.5px; }
  .mt5v3-avatar { font-size: 14px; }
  .mt5v3-reg { font-size: 15px; }
  .mt5v3-login { font-size: 15px; }
  .mt5v3-ctx button { font-size: 15px; }
  .mt5v3-ctx small { font-size: 13px; }
  .mt5v3-sub a, .mt5v3-sub button { font-size: 15px; }
  .mt5v3-tabbar a { font-size: 13.5px; }
  .mt5v3-isheet-h h2 { font-size: 20px; }
  .mt5v3-idxg a { font-size: 16px; }
  .mt5v3-isheet-hint { font-size: 14px; }
  .mt5v3-h .mt5v3-ia { font-size: 14.5px; }
  .mt5v3-ia-nw { font-size: 11px; }
  .mt5v3-iabox { font-size: 16.5px; }
  .mt5v3-ia-ex { font-size: 15.5px; }
  .mt5v3-iabox .mt5v3-ia-fine { font-size: 14.5px; }
  .mt5v3-ia-go { font-size: 17px; }
  .mt5v3-f-nums dd { font-size: 20px; }
  .mt5v3-f-nums dt { font-size: 14px; }
  .mt5v3-f-apps > span { font-size: 14px; }
  .mt5v3-f-links a { font-size: 15px; }
  .mt5v3-f-copy { font-size: 14px; }
  .mt5v3-h .mt5v3-ia--top { font-size: 14px; }
  .mt5v3-fbk-l { font-size: 16px; }
  .mt5v3-fbk-l small { font-size: 14px; }
  .mt5v3-pro-t b { font-size: 17px; }
  .mt5v3-pro-t small { font-size: 15px; }
  .mt5v3-pro-go { font-size: 16px; }
}
@media (max-width: 380px) {
  .mt5v3-q input[type="search"] { font-size: 16px; } /* 360 px: el texto de ayuda del buscador entra entero (16 px: sin zoom en iOS) */
  .mt5v3-reg, .mt5v3-login { font-size: 14px; }
  .mt5v3-f-nums dd { font-size: 18px; }
  .mt5v3-h .mt5v3-ia--top { font-size: 13.5px; }
}

/* ---------- Ronda 16: barra de abajo con «Más» y el aviso de cookies que la tapaba ----------
   Causa de que no se viera la barra (QA de Daniel, iPhone): el aviso de cookies es un `.offcanvas-lg.offcanvas-bottom`
   de Bootstrap; debajo de 992 px Bootstrap le pone `transform: translateY(100%)`. La ronda 4 lo había subido a
   `bottom: 58px` para que quedara arriba de la barra, pero el transform lo bajaba su propia altura (~200 px): quedaba
   justo encima de la barra (z-index 9999 contra 1035), cortado, con el texto blanco del pie sobre beige y «Entendido»
   fuera de la pantalla (no se podía cerrar). Las capturas de las rondas 4 a 15 aceptaban las cookies antes de sacar la
   foto, por eso nunca se vio. Ahora el aviso es una franja blanca compacta apoyada arriba de la barra, legible, con
   «Entendido» de 44 px a la vista, y mientras está abierto el cuerpo reserva su alto (site-v3.js, --mt5v3-ck). */
.mt5v3-tabbar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
.mt5v3-tabbar a, .mt5v3-tabbar .mt5v3-tab-more { min-width: 0; padding: 0 2px; }
.mt5v3-tabbar a > span, .mt5v3-tab-more > span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mt5v3-tab-more { height: 58px; display: grid; place-items: center; align-content: center; gap: 3px; border: 0; background: none; font-family: var(--v3s-font); font-size: 12.5px; font-weight: 700; color: var(--v3s-ink-3); cursor: pointer; }
.mt5v3-tab-more.is-on { color: var(--v3s-link); font-weight: 800; }
.mt5v3-tab-more:focus-visible { outline: 2px solid var(--v3s-or); outline-offset: -4px; }
/* La hoja «Más» (mismo patrón que «Especialidades ›»: fondo #mt5v3-iov, Escape y el fondo cierran) */
.mt5v3-mas-id { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mt5v3-mas-id > div { min-width: 0; }
.mt5v3-mas-id h2 { margin: 0; font-size: 18px; line-height: 23px; font-weight: 800; color: var(--v3s-ink); text-align: left; font-family: var(--v3s-font); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt5v3-mas-id p { margin: 0; font-size: 14px; line-height: 19px; color: var(--v3s-ink-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mt5v3-mas-av { flex: none; width: 44px; height: 44px; border-radius: 50%; background: var(--v3s-soft); color: var(--v3s-on-soft); font-weight: 900; font-size: 15px; display: grid; place-items: center; }
.mt5v3-mas-list { list-style: none; margin: 0; padding: 0; }
.mt5v3-mas-list li + li { border-top: 1px solid var(--v3s-line); }
.mt5v3-mas-list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 52px; padding: 4px 4px; font-size: 17px; font-weight: 700; color: var(--v3s-ink-2) !important; text-decoration: none; }
.mt5v3-mas-list a:hover { color: var(--v3s-on-soft) !important; }
.mt5v3-mas-list a:focus-visible { outline: 2px solid var(--v3s-or); outline-offset: 2px; border-radius: 8px; }
.mt5v3-mas-chev { color: var(--v3s-ink-3); font-size: 22px; line-height: 1; }
.mt5v3-mas-list a.mt5v3-mas-out { color: var(--v3s-ink-3) !important; font-weight: 600; }
.mt5v3-mas .mt5v3-isheet-b { padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }

/* El aviso de cookies del pie v3 (también en el micrositio, que carga este archivo): franja blanca abajo, legible. */
.mt5v3-f #cookies-alert { position: fixed; left: 0; right: 0; bottom: 0; top: auto; width: auto; height: auto !important; min-height: 0; max-height: none; transform: none !important; visibility: visible !important; z-index: 1036; background: #fff !important; color: var(--v3s-ink-2); border-top: 1px solid var(--v3s-line); box-shadow: 0 -6px 18px rgba(70, 50, 30, .12); padding-bottom: env(safe-area-inset-bottom, 0px); font-family: var(--v3s-font, Nunito, system-ui, sans-serif); }
.mt5v3-f #cookies-alert.hidden { display: none !important; }
.mt5v3-f #cookies-alert .offcanvas-body { display: flex; align-items: center; gap: 12px; max-width: 1344px; margin: 0 auto; padding: 10px 16px; overflow: visible; }
.mt5v3-f #cookies-alert p { flex: 1 1 auto; margin: 0; text-align: left !important; font-size: 14px; line-height: 19px; color: var(--v3s-ink-2) !important; }
.mt5v3-f #cookies-alert p a { color: var(--v3s-link, #D86100) !important; font-weight: 800; text-decoration: underline; text-underline-offset: 2px; }
.mt5v3-f #cookies-alert .btn { flex: none; min-height: 44px; margin: 0 !important; padding: 0 18px; border: 0; border-radius: 12px; background: var(--v3s-soft, #FFF2E7) !important; color: var(--v3s-on-soft, #B04F00) !important; font-family: inherit; font-size: 15px; font-weight: 800; max-width: none !important; box-shadow: none; }
.mt5v3-f #cookies-alert .btn:hover { background: var(--v3s-peach, #FFD9B8) !important; }
.mt5v3-f #cookies-alert .btn:focus-visible { outline: 2px solid var(--v3s-ink, #231F1D); outline-offset: 2px; }
/* Con sesión en el celular: arriba de la barra de abajo. */
body.mt5v3-site.mt5v3-tabs .mt5v3-f #cookies-alert { bottom: calc(58px + env(safe-area-inset-bottom, 0px)); padding-bottom: 0; }
/* Mientras el aviso está abierto, el cuerpo reserva su alto: no tapa la acción principal ni el pie. */
body.mt5v3-site { padding-bottom: var(--mt5v3-ck, 0px); }
body.mt5v3-site.mt5v3-tabs { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px) + var(--mt5v3-ck, 0px)); }
body.mt5m { padding-bottom: var(--mt5v3-ck, 0px); }
@media (max-width: 639px) {
  .mt5v3-tab-more { font-size: 13.5px; }
  .mt5v3-f #cookies-alert p { font-size: 15px; line-height: 20px; }
}
@media (max-width: 380px) {
  .mt5v3-tabbar a, .mt5v3-tab-more { font-size: 12.5px; }
  .mt5v3-f #cookies-alert .offcanvas-body { gap: 10px; padding: 8px 12px; }
  .mt5v3-f #cookies-alert p { font-size: 14px; line-height: 19px; }
}
@media (min-width: 640px) {
  .mt5v3-tab-more { display: none; }
  body.mt5v3-site.mt5v3-tabs { padding-bottom: var(--mt5v3-ck, 0px); }
  body.mt5v3-site.mt5v3-tabs .mt5v3-f #cookies-alert { bottom: 0; padding-bottom: env(safe-area-inset-bottom, 0px); }
  .mt5v3-mas { display: none !important; }
}

/* ---------- Ronda 13: la Home (index-v3 con `hero`) ----------
   El buscador va centrado en la página (site/_home-v3): la cabecera no dibuja el suyo ni la línea de zona y «para
   quién» del celular. En el celular la franja queda en una sola fila (logo y acceso o avatar). */
@media (max-width: 639px) {
  .mt5v3-h-in.is-home { grid-template-areas: "logo . me"; }
  .mt5v3-h-in.is-home.has-ia { grid-template-areas: "logo ia me"; }
}

/* ---------- Ronda 16: paso 2 de la reserva (turn/create con el flag): «Siguiente» al resumen ---------- */
body.mt5v3-site .mt5v3-res-sel { margin: 4px 0 8px; font-family: var(--v3s-font); font-size: 15px; line-height: 20px; color: var(--v3s-ink-2); text-align: center; }
body.mt5v3-site .mt5v3-res-next { min-height: 48px; min-width: 200px; border-radius: 14px; font-weight: 800; }
body.mt5v3-site .mt5v3-res-next:disabled { opacity: .5; cursor: not-allowed; }
@media (max-width: 639px) {
  body.mt5v3-site .mt5v3-res-next { width: 100%; max-width: none !important; }
}
/* La acción principal a la vista en el celular (pedido de Daniel: que la barra no la tape y que no haya que bajar a
   buscarla): «Siguiente» del paso 2 y «Confirmar turno» del resumen quedan pegados abajo, arriba de la barra y del aviso
   de cookies, mientras su formulario está en pantalla. */
body.mt5v3-site { --mt5v3-bottom: 0px; }
body.mt5v3-site.mt5v3-tabs { --mt5v3-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 639px) {
  /* Reserva paso a paso (con el resumen v3): «Siguiente» del paso 1 y del 2 fijos abajo, como en la app. */
  body.mt5v3-site:has(#mt5v3-res-next) #slide-1.active .container > .btn-primary.mt5-carousel-ctrl,
  body.mt5v3-site #slide-2.active .mt5v3-res-next { position: fixed; left: 16px; right: 16px; width: auto !important; max-width: none !important; margin: 0 !important; bottom: calc(var(--mt5v3-bottom) + var(--mt5v3-ck, 0px) + 10px); z-index: 1030; min-height: 48px; border-radius: 14px; font-weight: 800; box-shadow: 0 8px 18px -6px rgba(255, 115, 0, .45); }
  body.mt5v3-site #slide-2.active .mt5v3-res-next:disabled { opacity: 1; background: #E9E2DC; border-color: #E9E2DC; color: #6E6560; box-shadow: none; }
  body.mt5v3-site:has(#mt5v3-res-next) #new-turn-carousel { padding-bottom: 72px; }
  .mt5v3 .mt5v3-cf-form .mt5v3-cf-go { position: sticky; bottom: calc(var(--mt5v3-bottom, 0px) + var(--mt5v3-ck, 0px) + 10px); z-index: 5; }
}
@media (min-width: 640px) {
  body.mt5v3-site.mt5v3-tabs { --mt5v3-bottom: 0px; }
}
/* Lo mismo en el micrositio (body.mt5m, sin barra de abajo): la reserva paso a paso también termina en el resumen v3. */
body.mt5m { --mt5v3-bottom: 0px; }
body.mt5m .mt5v3-res-sel { margin: 4px 0 8px; font-size: 15px; line-height: 20px; color: #3F3835; text-align: center; }
body.mt5m .mt5v3-res-next { min-height: 48px; min-width: 200px; border-radius: 14px; font-weight: 800; }
body.mt5m .mt5v3-res-next:disabled { opacity: .5; cursor: not-allowed; }
@media (max-width: 639px) {
  body.mt5m #turn-carousel .carousel-inner, body.mt5m #turn-carousel { overflow: visible; }
  body.mt5m:has(#mt5v3-res-next) #slide-1.active .container > .btn-primary.mt5-carousel-ctrl,
  body.mt5m #slide-2.active .mt5v3-res-next { position: fixed; left: 16px; right: 16px; width: auto !important; max-width: none !important; margin: 0 !important; bottom: calc(var(--mt5v3-ck, 0px) + 10px); z-index: 1030; min-height: 48px; border-radius: 14px; font-weight: 800; }
  body.mt5m #slide-2.active .mt5v3-res-next:disabled { opacity: 1; background: #E9E2DC; border-color: #E9E2DC; color: #6E6560; }
  body.mt5m:has(#mt5v3-res-next) #new-turn-carousel { padding-bottom: 72px; }
}
/* En las pantallas de una sola tarea (cabecera mínima: ingreso, registro, código, «Ya está»; y «Confirmá tu turno») el aviso de cookies no flota:
   va al final, en el pie, para no tapar «Ingresar», «Seguí tu turno en la app» ni «Pagar la seña». */
body.mt5v3-site:has(.mt5v3-h-in.is-min) .mt5v3-f #cookies-alert, body:has(.mt5v3-cf-form) .mt5v3-f #cookies-alert { position: static; bottom: auto; box-shadow: none; border-radius: 12px; margin-top: 12px; padding-bottom: 0; }
body.mt5v3-site:has(.mt5v3-h-in.is-min), body:has(.mt5v3-cf-form) { --mt5v3-ck: 0px !important; }
