/* El recorrido guiado en el estilo D de AMPE (maqueta aprobada el 5-oct-2026). Va encima de driver-1.9.0.css y solo
   sobrescribe lo suyo. Colores escritos aquí porque lo cargan las dos familias de pantallas, con fichas distintas. */
.driver-overlay path{fill:#14212b!important}
/* driver.js quita los clics a todo menos al elemento resaltado y al globo. Los pasos que esperan a un diálogo lo abren
   encima, y sin esto el diálogo no se podía pulsar. */
.driver-active dialog[open],.driver-active dialog[open] *{pointer-events:auto}
.driver-active-element{border-radius:8px;box-shadow:0 0 0 2px #2b5f9e,0 0 0 6px rgba(43,95,158,.25)!important}
.driver-popover.ampe-globo{font-family:"IBM Plex Sans",system-ui,sans-serif;color:#14212b;background:#fff;
  border:1px solid #d6dde3;border-radius:12px;box-shadow:0 18px 40px rgba(20,33,43,.28);padding:16px 18px;
  min-width:300px;max-width:380px;font-size:14px;line-height:1.45}
.ampe-globo .driver-popover-title{font:inherit;margin:0}
.ampe-globo .driver-popover-description{font:inherit;color:#14212b;margin:8px 0 0}
.ampe-globo .driver-popover-description p{margin:0 0 .55em;letter-spacing:normal;word-spacing:normal}
.ampe-globo .driver-popover-description p.g-def{font-size:13px;color:#3a4955;margin:.35em 0 0}
.ampe-globo .driver-popover-description p.g-et{font:600 10.5px "IBM Plex Sans",sans-serif;letter-spacing:.12em;
  text-transform:uppercase;color:#4b5a67;margin:.6em 0 .15em}
.ampe-globo .g-prog{display:flex;justify-content:space-between;gap:8px;font:600 11px "IBM Plex Sans",sans-serif;
  letter-spacing:.08em;text-transform:uppercase;color:#2b5f9e;padding-right:28px}
/* «Paso 3 de 4» no se parte: el que se ajusta es el nombre del recorrido o de la guía, a la derecha. */
.ampe-globo .g-prog>span:first-child{white-space:nowrap;flex:none}
.ampe-globo .g-prog>span:last-child{text-align:right;min-width:0}
.ampe-globo .g-barra{height:3px;background:#e3e8ee;border-radius:2px;margin:6px 0 12px}
.ampe-globo .g-barra i{display:block;height:100%;background:#2b5f9e;border-radius:2px}
.ampe-globo .g-cab{display:flex;align-items:center;gap:8px;padding-right:24px}
.ampe-globo .g-num{flex:none;width:27px;height:27px;border-radius:50%;background:#2b5f9e;color:#fff;
  font:700 15px/27px "Barlow Condensed",sans-serif;text-align:center}
.ampe-globo .g-tit{font:700 20px/1.1 "Barlow Condensed",sans-serif}
.ampe-globo .driver-popover-close-btn{color:#4b5a67;font-size:22px;width:32px;height:32px;top:8px;right:8px}
.ampe-globo .g-espera{display:flex;gap:10px;align-items:center;background:#e8eff8;border:1px solid #bfd3ea;border-radius:8px;
  padding:8px 12px;margin:8px 0 2px;font-size:13px}
.ampe-globo .g-giro{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid #bfd3ea;border-top-color:#2b5f9e;
  animation:ampe-giro 1s linear infinite}
@keyframes ampe-giro{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ampe-globo .g-giro{animation:none}}
.ampe-globo .driver-popover-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;
  padding-top:10px;border-top:1px solid #d6dde3}
.ampe-globo .driver-popover-navigation-btns{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.ampe-globo .driver-popover-footer button{font:600 13px "IBM Plex Sans",sans-serif;text-shadow:none;border:1px solid #d6dde3;
  background:#fff;color:#14212b;border-radius:6px;padding:6px 12px;min-height:30px;cursor:pointer;text-align:center;
  display:inline-flex;align-items:center;justify-content:center}
.ampe-globo .driver-popover-next-btn{background:#14212b!important;border-color:#14212b!important;color:#fff!important}
.ampe-globo .g-salir{border:none!important;background:none!important;padding:6px 0!important;color:#4b5a67!important;
  text-decoration:underline;font-weight:400!important}
.ampe-globo .g-enlace{color:#2b5f9e}
.ampe-globo .driver-popover-progress-text{display:none}
/* A 600 px o menos, el globo es una hoja abajo, a todo el ancho y sin flecha. */
@media (max-width:600px){
  .driver-popover.ampe-globo{position:fixed!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;
    max-width:none;min-width:0;width:100%;border-radius:18px 18px 0 0;padding:12px 16px 18px}
  .ampe-globo .driver-popover-arrow{display:none}
  .ampe-globo .driver-popover-footer{flex-direction:column-reverse;align-items:stretch}
  .ampe-globo .driver-popover-navigation-btns{display:flex;flex-direction:column;align-items:stretch}
  .ampe-globo .driver-popover-next-btn{order:-1;padding:10px!important}
  .ampe-globo .driver-popover-footer button{min-height:40px}
}
/* Lo que se sube por encima de la hoja no queda bajo la cabecera. */
@media (max-width:600px){[data-recorrido]{scroll-margin-top:64px}body.driver-active{padding-bottom:var(--hoja-recorrido,0px)}}
/* La entrada junto a «Ayuda» y el aviso al salir. */
.recorrido-entrada{position:relative;display:inline-flex}
.recorrido-boton{border:none;background:none;font:inherit;color:inherit;cursor:pointer;padding:6px 8px;min-height:24px}
.recorrido-menu{position:absolute;right:0;top:calc(100% + 6px);width:300px;max-width:calc(100vw - 16px);box-sizing:border-box;
  background:#fff;border:1px solid #d6dde3;border-radius:10px;box-shadow:0 18px 40px rgba(20,33,43,.22);padding:12px;z-index:50;
  display:flex;flex-direction:column;gap:8px;color:#14212b;font:14px/1.45 "IBM Plex Sans",system-ui,sans-serif;
  text-transform:none;letter-spacing:normal;text-align:left;white-space:normal}
.recorrido-menu[hidden]{display:none}
.recorrido-menu p{margin:0}
.recorrido-menu .r-contexto{color:#3a4955}
.recorrido-menu .r-bot{display:flex;gap:6px;flex-wrap:wrap}
/* Botones propios: la familia de Inicio no carga base.css, donde viven .boton y .primario. */
.recorrido-menu button{font:600 13px "IBM Plex Sans",sans-serif;border:1px solid #d6dde3;background:#fff;color:#14212b;
  border-radius:6px;padding:7px 12px;min-height:32px;cursor:pointer;text-transform:none;letter-spacing:normal}
.recorrido-menu button.primario{background:#14212b;border-color:#14212b;color:#fff}
.recorrido-menu small{display:block;padding:0;font:400 12.5px/1.4 "IBM Plex Sans",sans-serif;color:#4b5a67;
  text-transform:none;letter-spacing:normal}
.ampe-aviso-recorrido{position:fixed;left:24px;bottom:24px;z-index:100;background:#14212b;color:#fff;border-radius:8px;
  padding:10px 14px;font:14px "IBM Plex Sans",sans-serif;box-shadow:0 10px 24px rgba(20,33,43,.3);max-width:calc(100vw - 48px)}
@media (max-width:600px){
  .recorrido-boton{font-size:13px;padding:6px 4px}
  .recorrido-menu{position:fixed;left:8px;right:8px;top:56px;width:auto;max-width:none}
  .recorrido-menu .r-bot button{flex:1 1 100%;min-height:40px}
  .ampe-aviso-recorrido{left:12px;right:12px;bottom:12px;max-width:none}
}
/* La guía fuera de la pantalla de su paso (ADP-920): una tarjeta abajo a la izquierda que no tapa nada ni quita clics. */
.ampe-guia-fuera{position:fixed;left:24px;bottom:24px;z-index:100;width:320px;max-width:calc(100vw - 48px);box-sizing:border-box;
  background:#fff;color:#14212b;border:1px solid #d6dde3;border-radius:10px;
  box-shadow:0 14px 32px rgba(20,33,43,.22);padding:12px 14px;display:flex;flex-direction:column;gap:6px;
  font:14px/1.45 "IBM Plex Sans",system-ui,sans-serif}
.ampe-guia-fuera b{font:700 17px/1.15 "Barlow Condensed",sans-serif}
.ampe-guia-fuera p{margin:0;color:#3a4955}
.ampe-guia-fuera .r-bot{display:flex;gap:6px;flex-wrap:wrap;margin-top:2px}
.ampe-guia-fuera .boton{font:600 13px "IBM Plex Sans",sans-serif;border:1px solid #d6dde3;background:#fff;color:#14212b;
  border-radius:6px;padding:7px 12px;min-height:32px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.ampe-guia-fuera .boton.primario{background:#14212b;border-color:#14212b;color:#fff}
.ampe-guia-fuera .boton:focus-visible{outline:2px solid #2b5f9e;outline-offset:2px}
@media (max-width:600px){.ampe-guia-fuera{left:12px;right:12px;bottom:12px;width:auto;max-width:none}
  .ampe-guia-fuera .boton{flex:1 1 auto;justify-content:center;min-height:40px}}
