/* ==========================================================================
   OrvianGo - estilos de las cuatro vistas: Inicio (visitante), Inicio
   (sesión iniciada), Iniciar sesión y Registrarse.

   Aislamiento: este archivo solo lo enlazan _LayoutOrvian y
   _LayoutOrvianAuth (partial _OrvianHead). Las demás páginas siguen usando
   _Layout con site.css y no cargan nada de lo que está acá. Además, las
   reglas globales cuelgan de body.og-site / body.og-auth.
   ========================================================================== */

/* ---------- Tipografías (autoalojadas en wwwroot/fonts/orviango) ---------- */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/orviango/poppins-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/orviango/poppins-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/orviango/poppins-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; font-display: swap; src: url('../fonts/orviango/poppins-latin-800-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/orviango/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/orviango/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/orviango/inter-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/orviango/inter-latin-700-normal.woff2') format('woff2'); }

/* ---------- Identidad visual ---------- */
:root {
  --og-primary: #0B5D45;
  --og-primary-hover: #084936;
  --og-secondary: #18A66A;
  --og-secondary-hover: #138756;
  --og-lime: #B9F227;
  --og-bg: #F5F8F6;
  --og-card-bg: #FFFFFF;
  --og-text-dark: #17211D;
  --og-text-muted: #53645D;
  --og-border: #E2EAE5;
  --og-primary-subtle: #E6F3EE;
  --og-secondary-subtle: #E2F7EE;
  --og-lime-subtle: #F3FDE4;
  --og-danger: #BA1A1A;

  /* Alias que usa el markup de la variante con sesión iniciada */
  --og-green-primary: var(--og-primary);
  --og-green-secondary: var(--og-secondary);
  --og-lime-accent: var(--og-lime);
}

/* ==========================================================================
   BASE COMÚN
   ========================================================================== */
body.og-site,
body.og-auth {
  background-color: var(--og-bg);
  color: var(--og-text-dark);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  margin-bottom: 0;
}

.og-site h1, .og-site h2, .og-site h3, .og-site h4, .og-site h5, .og-site h6,
.og-site .display-5, .og-site .display-6, .og-site .font-heading,
.og-auth h1, .og-auth h2, .og-auth .font-heading {
  font-family: 'Poppins', sans-serif;
  color: var(--og-text-dark);
}

.og-site a.btn { text-decoration: none; }

.navbar-brand-img { height: 36px; max-height: 38px; width: auto; object-fit: contain; }

/* ==========================================================================
   INICIO (visitante y sesión iniciada): navbar, botones, footer
   ========================================================================== */
body.og-site { padding-bottom: 72px; }
@media (min-width: 992px) { body.og-site { padding-bottom: 0; } }

.og-site .text-dark { color: var(--og-text-dark) !important; }
.og-site .text-secondary { color: var(--og-text-muted) !important; }
.og-site .text-primary { color: var(--og-primary) !important; }
.og-site .bg-primary { background-color: var(--og-primary) !important; }
.og-site .bg-primary-subtle { background-color: var(--og-primary-subtle) !important; color: var(--og-primary) !important; }
.og-site .border-primary-subtle { border-color: #BDE2D4 !important; }
.og-site .border-secondary-subtle { border-color: var(--og-border) !important; }
.og-site .object-cover { object-fit: cover; }

.og-site .btn-primary {
  --bs-btn-bg: var(--og-primary);
  --bs-btn-border-color: var(--og-primary);
  --bs-btn-hover-bg: var(--og-primary-hover);
  --bs-btn-hover-border-color: var(--og-primary-hover);
  --bs-btn-active-bg: var(--og-primary-hover);
  --bs-btn-active-border-color: var(--og-primary-hover);
  --bs-btn-focus-shadow-rgb: 24, 166, 106;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

.og-site .btn-outline-primary {
  --bs-btn-color: var(--og-primary);
  --bs-btn-border-color: var(--og-primary);
  --bs-btn-hover-bg: var(--og-primary);
  --bs-btn-hover-border-color: var(--og-primary);
  --bs-btn-hover-color: #FFFFFF;
  --bs-btn-active-bg: var(--og-primary);
  --bs-btn-active-border-color: var(--og-primary);
  --bs-btn-active-color: #FFFFFF;
  --bs-btn-focus-shadow-rgb: 24, 166, 106;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

/* Botones del dashboard (verde secundario / contorno verde principal) */
.og-site .btn-primary-custom {
  background-color: var(--og-primary);
  border-color: var(--og-primary);
  color: #FFFFFF;
  font-family: 'Poppins', sans-serif;
  padding-top: 12px;
  padding-bottom: 12px;
}
.og-site .btn-primary-custom:hover,
.og-site .btn-primary-custom:focus,
.og-site .btn-primary-custom:active {
  background-color: var(--og-primary-hover);
  border-color: var(--og-primary-hover);
  color: #FFFFFF;
}
.og-site .btn-outline-custom {
  color: var(--og-primary);
  border-color: var(--og-primary);
  background-color: transparent;
}
.og-site .btn-outline-custom:hover,
.og-site .btn-outline-custom:focus,
.og-site .btn-outline-custom:active {
  background-color: var(--og-primary);
  border-color: var(--og-primary);
  color: #FFFFFF;
}
.og-site .btn-white:hover { background-color: var(--og-bg) !important; }

/* Insignias */
.og-site .badge-lime,
.og-site .badge-lime-accent { background-color: var(--og-lime); color: var(--og-text-dark); font-weight: 600; }
.og-site .badge-brand-primary { background-color: rgba(11, 93, 69, 0.12); color: var(--og-primary); border: 1px solid rgba(11, 93, 69, 0.2); }
.og-site .badge-secondary-custom { background-color: rgba(24, 166, 106, 0.15); color: #0b6840; }

/* Navbar (logo principal a color, siempre) */
.og-navbar {
  background-color: #FFFFFF;
  box-shadow: 0 0.125rem 0.375rem rgba(11, 93, 69, 0.06);
  border-bottom: 1px solid var(--og-border);
}
.og-site .nav-link-item {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 0.95rem;
  color: #425249;
  padding: 0.5rem 0.9rem !important;
  border-radius: 0.5rem;
  transition: all 0.15s ease-in-out;
}
.og-site .nav-link-item:hover { color: var(--og-primary); background-color: #EBF5F0; }
.og-site .nav-link-item.active { color: var(--og-primary) !important; background-color: #E3F2EB !important; font-weight: 600; }

/* Botones de acceso del navbar para el visitante */
.og-nav-auth .btn { font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 0.9rem; border-radius: 0.5rem; padding: 0.45rem 1rem; }
.og-nav-auth .btn-og-login { color: var(--og-primary); border: 1.5px solid var(--og-primary); background: #FFFFFF; }
.og-nav-auth .btn-og-login:hover, .og-nav-auth .btn-og-login:focus { background: var(--og-primary); color: #FFFFFF; }
.og-nav-auth .btn-og-register { color: #FFFFFF; background: var(--og-primary); border: 1.5px solid var(--og-primary); }
.og-nav-auth .btn-og-register:hover, .og-nav-auth .btn-og-register:focus { background: var(--og-primary-hover); border-color: var(--og-primary-hover); color: #FFFFFF; }

/* Menú de perfil: el cierre de sesión es un POST dentro de un form */
.og-site .dropdown-menu form { margin: 0; }
.og-site .dropdown-menu .dropdown-item:active { background-color: var(--og-primary); color: #FFFFFF; }

/* Barra inferior móvil */
.mobile-bottom-bar {
  background-color: #FFFFFF;
  border-top: 1px solid var(--og-border);
  box-shadow: 0 -0.25rem 0.75rem rgba(11, 93, 69, 0.07);
  height: 68px;
  z-index: 1030;
}
.mobile-nav-link {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  color: #516A60; text-decoration: none; font-size: 0.72rem; font-weight: 600; padding: 4px 0; width: 100%;
}
.mobile-nav-link i { font-size: 1.25rem; line-height: 1; margin-bottom: 2px; }
.mobile-nav-link.active { color: var(--og-primary); }
.mobile-pub-btn {
  width: 46px; height: 46px;
  background: linear-gradient(135deg, var(--og-primary), var(--og-secondary));
  color: #FFFFFF !important; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 10px rgba(11, 93, 69, 0.35);
  margin-top: -20px; border: 3px solid #FFFFFF;
}

/* Footer (fondo oscuro: logo secundario blanco) */
.og-footer { position: relative; z-index: 2; background-color: var(--og-primary); color: #D3E6DF; border-top: 3px solid var(--og-lime); }
.og-footer a { color: #EBF8F2; text-decoration: none; transition: color 0.15s ease; }
.og-footer a:hover { color: var(--og-lime); text-decoration: underline; }
.og-footer .footer-logo { height: 38px; width: auto; }

.og-site .card { border-color: var(--og-border); }
.og-site .form-control:focus,
.og-site .form-select:focus {
  border-color: var(--og-secondary) !important;
  box-shadow: 0 0 0 0.25rem rgba(24, 166, 106, 0.2) !important;
}
.og-site .btn:focus-visible { box-shadow: 0 0 0 0.25rem rgba(24, 166, 106, 0.3); }

/* ==========================================================================
   INICIAR SESIÓN / REGISTRARSE
   ========================================================================== */
body.og-auth { min-height: 100vh; display: flex; flex-direction: column; justify-content: center; margin: 0; }

.og-auth-page { position: relative; overflow: hidden; width: 100%; padding: 1.5rem 1rem; }
@media (min-width: 768px) { .og-auth-page { padding-left: 2rem; padding-right: 2rem; } }

.og-auth-blob { position: absolute; border-radius: 50%; pointer-events: none; }
.og-auth-blob--a { top: -10rem; left: -10rem; width: 24rem; height: 24rem; background: #A9F2D2; opacity: .4; filter: blur(64px); }
.og-auth-blob--b { bottom: -12rem; right: -8rem; width: 30rem; height: 30rem; background: var(--og-lime); opacity: .3; filter: blur(64px); }
.og-auth-blob--c { top: 50%; left: 75%; transform: translateY(-50%); width: 20rem; height: 20rem; background: #7EFAB6; opacity: .2; filter: blur(40px); }

/* Cabecera = navbar de las pantallas de acceso (logo principal a color) */
.og-auth-header {
  position: relative; z-index: 10;
  display: flex; align-items: center; justify-content: space-between;
  width: 100%; margin: 0 auto 2rem; padding: .5rem 0;
}
@media (min-width: 768px) { .og-auth-header { margin-bottom: 3rem; } }
.og-auth-header--login { max-width: 72rem; }
.og-auth-header--registro { max-width: 56rem; }
.og-auth-brand { display: inline-flex; align-items: center; transition: transform .2s; }
.og-auth-brand:hover { transform: scale(1.02); }
.og-auth-brand img { height: 36px; width: auto; display: block; }

.og-auth-nav { display: flex; align-items: center; gap: .75rem; font-size: .875rem; font-weight: 500; }
@media (min-width: 576px) { .og-auth-nav { gap: 1.5rem; } }
.og-auth-nav a { color: #3D4A41; text-decoration: none; display: inline-flex; align-items: center; gap: .375rem; transition: color .15s; }
.og-auth-nav a:hover { color: var(--og-primary); }
.og-auth-nav .og-auth-back { display: none; }
@media (min-width: 576px) { .og-auth-nav .og-auth-back { display: inline-flex; } }
.og-auth-nav .og-auth-help { background: #EBEFED; color: var(--og-text-dark); padding: .375rem .75rem; border-radius: .5rem; box-shadow: 0 1px 2px rgba(0,0,0,.06); }
.og-auth-nav .og-auth-help:hover { background: #E0E3E1; color: var(--og-text-dark); }
.og-auth-nav .og-auth-help i { color: var(--og-primary); font-size: 1.05rem; }

/* Tarjeta */
.og-auth-wrap { position: relative; z-index: 10; width: 100%; max-width: 32rem; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
.og-auth-card {
  width: 100%; background: #FFFFFF; border-radius: .75rem; padding: 1.5rem;
  box-shadow: 0 20px 25px -5px rgba(224, 227, 225, .6), 0 8px 10px -6px rgba(224, 227, 225, .6);
}
@media (min-width: 576px) { .og-auth-card { padding: 2.25rem; } }

.og-auth-badge {
  display: inline-flex; align-items: center; gap: .5rem; padding: .375rem .875rem; border-radius: 9999px;
  background: rgba(169, 242, 210, .5); color: var(--og-primary);
  font-size: .6875rem; font-weight: 600; letter-spacing: .025em; text-transform: uppercase;
}
@media (min-width: 576px) { .og-auth-badge { font-size: .75rem; } }
.og-auth-badge i { font-size: 1.1rem; color: var(--og-primary); line-height: 1; }

.og-auth-title { font-family: 'Poppins', sans-serif; font-weight: 700; font-size: 1.5rem; line-height: 1.25; letter-spacing: -.025em; margin: 0 0 .5rem; color: var(--og-text-dark); }
@media (min-width: 576px) { .og-auth-title { font-size: 1.75rem; } }
.og-auth-sub { font-size: .875rem; line-height: 1.5; color: #3D4A41; margin: 0 auto; max-width: 24rem; }
.og-auth-sub strong, .og-auth-sub .og-accent { color: var(--og-primary); font-weight: 600; }

.og-auth-pitch { background: #F1F4F2; border-radius: .5rem; padding: .5rem .75rem; margin-bottom: 1.5rem; text-align: center; font-size: .875rem; font-weight: 500; color: #3D4A41; }
.og-auth-pitch a { color: var(--og-primary); font-weight: 700; text-decoration: none; }
.og-auth-pitch a:hover { text-decoration: underline; }

/* Formulario */
.og-form { display: flex; flex-direction: column; gap: 1rem; }
.og-field { display: flex; flex-direction: column; gap: .375rem; text-align: left; }
.og-label { font-size: .875rem; font-weight: 600; color: var(--og-text-dark); margin: 0; }
.og-input-wrap { position: relative; display: flex; align-items: center; }
.og-input-icon { position: absolute; left: .875rem; color: #6D7A70; font-size: 1.15rem; line-height: 1; pointer-events: none; }
.og-input {
  width: 100%; background: #F1F4F2; border: 0; border-radius: .5rem;
  padding: .75rem 1rem .75rem 2.75rem; font: inherit; font-size: .875rem; color: var(--og-text-dark);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05); transition: background-color .15s, box-shadow .15s;
}
.og-input::placeholder { color: #6D7A70; opacity: 1; }
.og-input:focus { outline: 0; background: #EBEFED; box-shadow: 0 0 0 2px var(--og-primary); }
.og-input.input-validation-error { box-shadow: 0 0 0 1.5px var(--og-danger); }
.og-input--password { padding-right: 3rem; }
.og-eye { position: absolute; right: .75rem; display: inline-flex; padding: .25rem; border: 0; border-radius: .25rem; background: transparent; color: #3D4A41; font-size: 1.1rem; line-height: 1; cursor: pointer; transition: background-color .15s; }
.og-eye:hover { background: #E0E3E1; }

.og-field-error, .og-field-error.field-validation-error { display: block; font-size: .8125rem; color: var(--og-danger); }
.og-summary-error { font-size: .875rem; color: #93000A; background: #FFDAD6; border-radius: .5rem; padding: .625rem .875rem; }
.og-summary-error ul { margin: 0; padding-left: 1.1rem; }
.og-summary-error.validation-summary-valid { display: none; }

.og-check { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; user-select: none; font-size: .875rem; color: #3D4A41; margin: 0; }
.og-check input { width: 1rem; height: 1rem; accent-color: var(--og-primary); cursor: pointer; }

.og-btn-submit {
  width: 100%; margin-top: .5rem; display: flex; align-items: center; justify-content: center; gap: .5rem;
  padding: .875rem 1.5rem; border: 0; border-radius: .5rem; cursor: pointer;
  background: var(--og-secondary); color: #FFFFFF; font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 1rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1); transition: background-color .15s, box-shadow .15s;
}
.og-btn-submit:hover { background: var(--og-primary); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .12), 0 4px 6px -4px rgba(0, 0, 0, .1); }
.og-btn-submit:focus-visible { outline: 3px solid rgba(24, 166, 106, .4); outline-offset: 2px; }
.og-btn-submit i { transition: transform .2s; }
.og-btn-submit:hover i { transform: translateX(4px); }
.og-btn-submit--dark { background: var(--og-primary); box-shadow: 0 10px 15px -3px rgba(11, 93, 69, .25), 0 4px 6px -4px rgba(11, 93, 69, .25); }
.og-btn-submit--dark:hover { background: var(--og-primary-hover); }

.og-auth-link { color: var(--og-primary); font-size: .875rem; font-weight: 500; text-decoration: none; }
.og-auth-link:hover { text-decoration: underline; }

.og-divider { display: flex; align-items: center; padding: 1.25rem 0; }
.og-divider span { flex-grow: 1; height: 1px; background: #E0E3E1; }

.og-stamp { margin-top: 1.75rem; background: rgba(241, 244, 242, .7); border-radius: .5rem; padding: .875rem; display: flex; align-items: flex-start; gap: .625rem; text-align: left; }
.og-stamp i { color: var(--og-primary); font-size: 1.25rem; line-height: 1; flex-shrink: 0; margin-top: .1rem; }
.og-stamp p { margin: 0; font-size: .75rem; line-height: 1.6; color: #3D4A41; }
.og-stamp strong { color: var(--og-text-dark); font-weight: 600; }

/* Franja "Red UTN Haedo activa" */
.og-live { width: 100%; max-width: 32rem; margin-top: 1rem; background: #EBEFED; border-radius: .5rem; padding: .75rem; display: flex; align-items: center; justify-content: space-between; font-size: .8125rem; font-weight: 500; color: #3D4A41; box-shadow: 0 1px 2px rgba(0,0,0,.05); }
.og-live-left { display: flex; align-items: center; gap: .5rem; }
.og-live-left strong { font-weight: 500; color: var(--og-text-dark); }
.og-live-extra { display: none; }
@media (min-width: 576px) { .og-live-extra { display: inline; } }
.og-live-eco { display: flex; align-items: center; gap: .25rem; color: var(--og-primary); font-weight: 600; font-size: .75rem; }
.og-ping { position: relative; display: inline-flex; width: .625rem; height: .625rem; }
.og-ping::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #A2D800; opacity: .75; animation: og-ping 1s cubic-bezier(0, 0, .2, 1) infinite; }
.og-ping::after { content: ""; position: relative; width: 100%; height: 100%; border-radius: 50%; background: #769F00; }
@keyframes og-ping { 75%, 100% { transform: scale(2); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .og-ping::before { animation: none; } }

.og-auth-footer { width: 100%; text-align: center; margin-top: 1.5rem; margin-bottom: 1rem; display: flex; flex-direction: column; align-items: center; gap: .75rem; }
.og-auth-footer-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .5rem 1.5rem; font-size: .8125rem; font-weight: 500; color: #3D4A41; }
.og-auth-footer-links a { color: inherit; text-decoration: none; transition: color .15s; }
.og-auth-footer-links a:hover { color: var(--og-primary); }
.og-auth-footer-links .og-dot { color: #6D7A70; }
.og-auth-copy { margin: 0; font-size: .75rem; color: #6D7A70; }
.og-powered { margin-top: .5rem; display: inline-flex; align-items: center; gap: .75rem; padding: .5rem 1rem; border-radius: 9999px; background: #2D3130; color: #EEF1EF; box-shadow: 0 1px 2px rgba(0,0,0,.1); }
.og-powered span { font-size: .6875rem; font-weight: 500; letter-spacing: .025em; text-transform: uppercase; color: #E6E9E7; }
.og-powered img { height: 1rem; width: auto; opacity: .9; transition: opacity .15s; }
.og-powered img:hover { opacity: 1; }

/* ----- Registro ----- */
.og-reg-main { position: relative; z-index: 10; width: 100%; max-width: 660px; margin: 0 auto; background: #FFFFFF; border-radius: .75rem; padding: 1.5rem; overflow: hidden; box-shadow: 0 20px 25px -5px rgba(24, 28, 27, .05), 0 8px 10px -6px rgba(24, 28, 27, .05); }
@media (min-width: 576px) { .og-reg-main { padding: 2.5rem; } }
.og-reg-glow { position: absolute; pointer-events: none; border-radius: 50%; filter: blur(48px); }
.og-reg-glow--a { top: -4rem; right: -4rem; width: 12rem; height: 12rem; background: rgba(169, 242, 210, .35); }
.og-reg-glow--b { bottom: -4rem; left: -4rem; width: 12rem; height: 12rem; background: rgba(185, 242, 39, .2); }
.og-reg-body { position: relative; display: flex; flex-direction: column; gap: 1.5rem; }
.og-reg-head { display: flex; flex-direction: column; align-items: flex-start; gap: .625rem; }
.og-reg-badge { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .75rem; border-radius: 9999px; background: rgba(188, 245, 43, .3); color: #141F00; font-size: .75rem; font-weight: 600; letter-spacing: .025em; }
.og-reg-badge i { font-size: 1rem; line-height: 1; }
.og-reg-title { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: 1.5rem; line-height: 1.25; letter-spacing: -.025em; margin: 0; color: var(--og-text-dark); }
@media (min-width: 576px) { .og-reg-title { font-size: 1.875rem; } }
.og-reg-sub { margin: 0; font-size: .875rem; line-height: 1.625; color: #3D4A41; }
@media (min-width: 576px) { .og-reg-sub { font-size: 1rem; } }
.og-reg-note { background: #F1F4F2; border-radius: .5rem; padding: .875rem; display: flex; align-items: flex-start; gap: .75rem; font-size: .875rem; line-height: 1.5; color: #3D4A41; }
@media (min-width: 576px) { .og-reg-note { padding: 1rem; } }
.og-reg-note-icon { width: 2rem; height: 2rem; border-radius: .5rem; background: rgba(11, 93, 69, .1); display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: .125rem; }
.og-reg-note-icon i { color: var(--og-primary); font-size: 1.2rem; line-height: 1; }
.og-reg-note strong { color: var(--og-primary); font-weight: 500; }
.og-reg-note-title { display: block; font-weight: 600; color: var(--og-text-dark); }

.og-reg-form { display: flex; flex-direction: column; gap: 1.25rem; padding-top: .25rem; }
.og-grid-2 { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 576px) { .og-grid-2 { grid-template-columns: 1fr 1fr; } }
.og-reg-form .og-label { font-size: .75rem; }
.og-reg-form .og-input { background: #EBEFED; padding: .625rem .75rem .625rem 2.25rem; box-shadow: none; }
.og-reg-form .og-input::placeholder { color: rgba(61, 74, 65, .5); }
.og-reg-form .og-input:focus { background: #EBEFED; box-shadow: 0 0 0 2px var(--og-primary); }
.og-reg-form .og-input.input-validation-error { box-shadow: 0 0 0 1.5px var(--og-danger); }
.og-reg-form .og-input--password { padding-right: 2.5rem; }
.og-reg-form .og-input-icon { left: .75rem; font-size: 1.1rem; color: rgba(61, 74, 65, .6); }
.og-reg-form .og-eye { right: .625rem; font-size: 1.05rem; color: rgba(61, 74, 65, .7); }
.og-reg-form .og-btn-submit { margin-top: 0; font-size: .875rem; }
@media (min-width: 576px) { .og-reg-form .og-btn-submit { font-size: 1rem; } }
.og-reg-form .og-btn-submit:active { transform: scale(.99); }
.og-reg-foot-note { display: flex; align-items: center; justify-content: center; gap: .5rem; text-align: center; font-size: .75rem; color: rgba(61, 74, 65, .8); }
.og-reg-foot-note i { color: var(--og-primary); font-size: .95rem; flex-shrink: 0; }
.og-reg-footer { position: relative; z-index: 10; width: 100%; max-width: 56rem; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 2rem; font-size: .75rem; color: #3D4A41; }
@media (min-width: 576px) { .og-reg-footer { flex-direction: row; } }
.og-reg-footer a { color: inherit; text-decoration: none; transition: color .15s; }
.og-reg-footer a:hover { color: var(--og-primary); }
.og-reg-footer-left { display: flex; align-items: center; gap: .5rem; }
.og-reg-footer-left .og-dot-green { width: .5rem; height: .5rem; border-radius: 50%; background: var(--og-secondary); }
.og-reg-footer-right { display: flex; align-items: center; gap: 1.5rem; }

/* Tarjeta de solicitud pendiente: permite que el texto se ajuste en anchos intermedios (tablet) */
.og-site #driverRequestCard .card-body > .d-flex > .d-flex { min-width: 0; }
.og-site #driverRequestCard .card-body > .d-flex > .d-flex > div:last-child { min-width: 0; }
.og-site #driverRequestCard .badge-lime-accent { white-space: normal; }
.og-site #driverRequestCard .d-flex.align-items-center.gap-2.mb-1 { flex-wrap: wrap; }

/* Cabecera de las tarjetas de viajes disponibles: las insignias pasan a otra línea si no caben (tablet) */
.og-site .card > div > .d-flex.justify-content-between.align-items-center.mb-3 { flex-wrap: wrap; gap: .25rem .5rem; }

/* Móviles angostos: logo y botones de acceso caben en una sola fila */
@media (max-width: 420px) {
  .og-site .navbar > .container-xl { flex-wrap: nowrap; }
  .og-site .navbar-brand { margin-right: 0; }
  .og-site .navbar-brand-img { height: 28px; }
  .og-nav-auth { gap: .375rem !important; }
  .og-site .navbar > .container-xl > .d-flex.gap-3 { gap: .5rem !important; }
  .og-site .navbar .dropdown-toggle { padding-right: .5rem !important; }
  .og-nav-auth .btn { font-size: .78rem; padding: .3rem .6rem; }
}

/* Anchos muy reducidos: las insignias largas pueden envolver en vez de ensanchar la página */
@media (max-width: 400px) {
  .og-site .badge { white-space: normal; text-align: left; }
  .og-site .card-body .d-flex.align-items-center.gap-2.mb-3 { flex-wrap: wrap; }
}

/* ==========================================================================
   Interruptor de modo del navbar: Modo pasajero / Modo conductor

   - El estado base de cada modo YA es su pose final y estática:
       pasajero  -> persona corriendo (persona-movimiento.svg)
       conductor -> auto inclinado con líneas de velocidad
   - La transición de 1 s solo existe mientras site.js pone data-animando en el
     botón (se retira al terminar). Los keyframes no usan fill-mode: terminan
     exactamente en el estado base, así que nunca queda nada en movimiento.
   - Los iconos son máscaras CSS de los SVG de /img/orviango/modo. El auto detenido
     se deforma con una matriz que coincide con la silueta de auto-movimiento.svg,
     de modo que el relevo entre ambos es imperceptible.
   ========================================================================== */

.og-site .og-mode-toggle { flex: 0 1 auto; min-width: 0; }

.og-site .og-mode-toggle__button {
  --og-mode-bg: #FFFFFF;
  --og-mode-border: var(--og-border);
  --og-mode-text: var(--og-text-dark);
  --og-mode-caption: var(--og-text-muted);
  --og-mode-chip: var(--og-primary-subtle);
  --og-mode-track: #7F958A;
  --og-mode-thumb: #FFFFFF;
  --og-mode-swap: .17s;

  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  max-width: 100%;
  padding: .25rem .7rem .25rem .25rem;
  border: 1.5px solid var(--og-mode-border);
  border-radius: 999px;
  background: var(--og-mode-bg);
  color: var(--og-mode-text);
  font-family: 'Poppins', sans-serif;
  line-height: 1.1;
  text-align: left;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 1px 2px rgba(11, 93, 69, .08);
  transition: background-color .35s ease, border-color .35s ease, box-shadow .2s ease;
}

.og-site .og-mode-toggle__button[data-modo-visual="conductor"] {
  --og-mode-bg: var(--og-primary);
  --og-mode-border: var(--og-primary-hover);
  --og-mode-text: #FFFFFF;
  --og-mode-caption: #CFE8DD;
  --og-mode-chip: rgba(255, 255, 255, .14);
  --og-mode-track: var(--og-lime);
  --og-mode-thumb: var(--og-primary);
  box-shadow: 0 2px 6px rgba(11, 93, 69, .25);
}

.og-site .og-mode-toggle__button:hover {
  --og-mode-border: #A9D6C4;
  box-shadow: 0 3px 10px rgba(11, 93, 69, .14);
}

.og-site .og-mode-toggle__button[data-modo-visual="conductor"]:hover {
  --og-mode-bg: var(--og-primary-hover);
  --og-mode-border: var(--og-primary-hover);
  box-shadow: 0 3px 10px rgba(11, 93, 69, .32);
}

.og-site .og-mode-toggle__button:active { box-shadow: inset 0 2px 4px rgba(0, 0, 0, .16); }

.og-site .og-mode-toggle__button:focus-visible {
  outline: 3px solid var(--og-primary);
  outline-offset: 3px;
}

/* Sin transiciones en la primera pintura: evita el destello al cargar cada página */
.og-site .og-mode-toggle__button[data-listo="false"],
.og-site .og-mode-toggle__button[data-listo="false"] * { transition: none !important; }

/* ---- Icono ---------------------------------------------------------------- */
.og-site .og-mode-toggle__icon-stage {
  position: relative;
  flex: 0 0 auto;
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 50%;
  background: var(--og-mode-chip);
  transition: background-color .35s ease;
}

.og-site .og-mode-toggle__icon {
  position: absolute;
  inset: .27rem;
  opacity: 0;
  transform-origin: 50% 50%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  -webkit-mask-size: contain;
          mask-size: contain;
  transition: opacity .18s ease;
}

/* Color fijo por capa (no por modo) para que una capa que se desvanece no cambie de color */
.og-site .og-mode-toggle__icon--persona-parada     { background-color: var(--og-primary); -webkit-mask-image: url('../img/orviango/modo/persona.svg');            mask-image: url('../img/orviango/modo/persona.svg');            transform-origin: 50% 92%; }
.og-site .og-mode-toggle__icon--persona-corriendo  { background-color: var(--og-primary); -webkit-mask-image: url('../img/orviango/modo/persona-movimiento.svg');  mask-image: url('../img/orviango/modo/persona-movimiento.svg');  transform-origin: 50% 90%; }
.og-site .og-mode-toggle__icon--auto-detenido      { background-color: #FFFFFF;           -webkit-mask-image: url('../img/orviango/modo/auto.svg');               mask-image: url('../img/orviango/modo/auto.svg'); }
.og-site .og-mode-toggle__icon--auto-cuerpo        { background-color: #FFFFFF;           -webkit-mask-image: url('../img/orviango/modo/auto-movimiento-cuerpo.svg'); mask-image: url('../img/orviango/modo/auto-movimiento-cuerpo.svg'); }
.og-site .og-mode-toggle__icon--auto-lineas        { background-color: var(--og-lime);    -webkit-mask-image: url('../img/orviango/modo/auto-movimiento-lineas.svg'); mask-image: url('../img/orviango/modo/auto-movimiento-lineas.svg'); transform-origin: 70% 50%; }

/* Poses finales (estado de reposo de cada modo) */
.og-site .og-mode-toggle__button[data-modo-visual="pasajero"]  .og-mode-toggle__icon--persona-corriendo,
.og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__icon--auto-cuerpo,
.og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__icon--auto-lineas { opacity: 1; }

/* ---- Etiqueta ------------------------------------------------------------- */
.og-site .og-mode-toggle__copy {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  min-width: 0;
}

.og-site .og-mode-toggle__caption {
  color: var(--og-mode-caption);
  font-size: .625rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: none;
  transition: color 0s linear var(--og-mode-swap);
}

/* Las dos etiquetas posibles ocupan la misma celda: el botón conserva siempre el mismo ancho */
.og-site .og-mode-toggle__label { display: grid; }
.og-site .og-mode-toggle__label > * { grid-area: 1 / 1; }

.og-site .og-mode-toggle__state,
.og-site .og-mode-toggle__sizer {
  font-size: .84rem;
  font-weight: 600;
  white-space: nowrap;
}

.og-site .og-mode-toggle__state {
  color: var(--og-mode-text);
  transition: color 0s linear var(--og-mode-swap);
}

.og-site .og-mode-toggle__sizer { visibility: hidden; pointer-events: none; }

/* El texto cambia al instante y entra con un fundido corto (nunca queda invisible) */
.og-site .og-mode-toggle__state[data-cambio] { animation: og-modo-etiqueta .32s ease-out; }

/* ---- Interruptor ---------------------------------------------------------- */
.og-site .og-mode-toggle__track {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  width: 2.6rem;
  height: 1.45rem;
  padding: .17rem;
  border-radius: 999px;
  background: var(--og-mode-track);
  transition: background-color .35s ease;
}

.og-site .og-mode-toggle__thumb {
  width: 1.11rem;
  height: 1.11rem;
  border-radius: 50%;
  background: var(--og-mode-thumb);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .28);
  transition: transform .4s cubic-bezier(.22, 1, .36, 1), background-color .35s ease;
}

.og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__thumb { transform: translateX(1.15rem); }

/* ---- Transiciones de 1 s (una sola vez por cambio de modo) ---------------- */
.og-site .og-mode-toggle__button[data-animando="pasajero"] .og-mode-toggle__icon--persona-parada    { animation: og-modo-persona-parada 1s linear; }
.og-site .og-mode-toggle__button[data-animando="pasajero"] .og-mode-toggle__icon--persona-corriendo { animation: og-modo-persona-corriendo 1s linear; }
.og-site .og-mode-toggle__button[data-animando="conductor"] .og-mode-toggle__icon--auto-detenido    { animation: og-modo-auto-detenido 1s linear; }
.og-site .og-mode-toggle__button[data-animando="conductor"] .og-mode-toggle__icon--auto-cuerpo      { animation: og-modo-auto-cuerpo 1s linear; }
.og-site .og-mode-toggle__button[data-animando="conductor"] .og-mode-toggle__icon--auto-lineas      { animation: og-modo-auto-lineas 1s linear; }

@keyframes og-modo-persona-parada {
  0%   { opacity: 0; transform: scale(.9); animation-timing-function: ease-out; }
  12%  { opacity: 1; transform: scale(1);  }
  32%  { opacity: 1; transform: translateX(0) rotate(0deg) scale(1); animation-timing-function: cubic-bezier(.5, 0, .8, .4); }
  48%  { opacity: 1; transform: translateX(3%) rotate(9deg) scale(.97); animation-timing-function: linear; }
  58%  { opacity: 0; transform: translateX(5%) rotate(13deg) scale(.95); }
  100% { opacity: 0; transform: translateX(5%) rotate(13deg) scale(.95); }
}

@keyframes og-modo-persona-corriendo {
  0%, 44% { opacity: 0; transform: translateX(-9%) rotate(-6deg) scale(.9); animation-timing-function: cubic-bezier(.2, .7, .3, 1); }
  60%     { opacity: 1; transform: translateX(2%) translateY(-5%) rotate(1deg) scale(1.04); animation-timing-function: cubic-bezier(.3, 0, .2, 1); }
  100%    { opacity: 1; transform: translateX(0) translateY(0) rotate(0deg) scale(1); }
}

@keyframes og-modo-auto-detenido {
  0%   { opacity: 0; transform: translate(0, 0) rotate(0deg) matrix(1, 0, 0, 1, 0, 0); animation-timing-function: ease-out; }
  10%  { opacity: 1; transform: translate(0, 0) rotate(0deg) matrix(1, 0, 0, 1, 0, 0); }
  24%  { opacity: 1; transform: translate(0, 0) rotate(0deg) matrix(1, 0, 0, 1, 0, 0); animation-timing-function: ease-in-out; }
  38%  { opacity: 1; transform: translate(1.2%, 0) rotate(1.6deg) matrix(1, 0, 0, 1, 0, 0); animation-timing-function: cubic-bezier(.4, 0, .2, 1); }
  74%  { opacity: 1; transform: translate(-10.9%, 4.27%) rotate(0deg) matrix(.833, 0, .301, .828, 0, 0); }
  79%  { opacity: 1; transform: translate(-10.9%, 4.27%) rotate(0deg) matrix(.833, 0, .301, .828, 0, 0); }
  79.1%, 100% { opacity: 0; transform: translate(-10.9%, 4.27%) rotate(0deg) matrix(.833, 0, .301, .828, 0, 0); }
}

@keyframes og-modo-auto-cuerpo {
  0%, 70% { opacity: 0; transform: translateX(0); }
  76%     { opacity: 1; transform: translateX(0); }
  79%     { opacity: 1; transform: translateX(-1.5%); animation-timing-function: cubic-bezier(.22, 1, .36, 1); }
  100%    { opacity: 1; transform: translateX(0); }
}

@keyframes og-modo-auto-lineas {
  0%, 62% { opacity: 0; transform: scaleX(0); animation-timing-function: cubic-bezier(.2, .8, .2, 1); }
  86%     { opacity: 1; transform: scaleX(1.2); animation-timing-function: ease-in-out; }
  100%    { opacity: 1; transform: scaleX(1); }
}

@keyframes og-modo-etiqueta {
  from { opacity: .35; transform: translateY(.18rem); }
  to   { opacity: 1;   transform: translateY(0); }
}

/* ---- Navbar con sesión: encaje responsive del control --------------------- */
/* Móvil: logo y menú arriba; modo y notificaciones en una segunda fila */
@media (max-width: 575.98px) {
  .og-site .navbar > .container-xl.og-navbar--modo { flex-wrap: wrap; row-gap: .5rem; }

  .og-site .og-navbar--modo .og-nav-actions {
    order: 3;
    flex: 1 1 100%;
    justify-content: space-between;
    gap: .5rem !important;
  }

  .og-site .og-navbar--modo .navbar-collapse { order: 4; }
  .og-site .og-nav-actions .og-mode-toggle { flex: 1 1 auto; }
  .og-site .og-mode-toggle__button { gap: .55rem; padding-right: .6rem; }
  .og-site .og-mode-toggle__caption { display: none; }
  .og-site .og-mode-toggle__track { margin-left: auto; }
}

@media (max-width: 399.98px) {
  .og-site .og-mode-toggle__button { gap: .4rem; padding: .2rem .5rem .2rem .2rem; }
  .og-site .og-mode-toggle__icon-stage { width: 2rem; height: 2rem; }
  .og-site .og-mode-toggle__icon { inset: .25rem; }
  .og-site .og-mode-toggle__state,
  .og-site .og-mode-toggle__sizer { font-size: .78rem; }
  .og-site .og-mode-toggle__track { width: 2.1rem; height: 1.2rem; padding: .13rem; }
  .og-site .og-mode-toggle__thumb { width: .94rem; height: .94rem; }
  .og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__thumb { transform: translateX(.9rem); }
}

@media (max-width: 339.98px) {
  .og-site .og-mode-toggle__track { width: 1.9rem; }
  .og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__thumb { transform: translateX(.7rem); }
  .og-site .og-navbar--modo .og-nav-actions { gap: .25rem !important; }
  .og-site .og-mode-toggle__button { gap: .3rem; padding-right: .4rem; }
  .og-site .og-mode-toggle__state,
  .og-site .og-mode-toggle__sizer { font-size: .74rem; }
}

/* ---- Accesibilidad -------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .og-site .og-mode-toggle__button,
  .og-site .og-mode-toggle__button * { animation: none !important; }
  .og-site .og-mode-toggle__icon { transition: opacity .2s linear; }
  .og-site .og-mode-toggle__thumb { transition: background-color .2s linear; }
}

@media (forced-colors: active) {
  .og-site .og-mode-toggle__button { border-color: ButtonText; forced-color-adjust: none; background: ButtonFace; color: ButtonText; }
  .og-site .og-mode-toggle__icon { background-color: ButtonText; }
  .og-site .og-mode-toggle__track { background: GrayText; }
  .og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__track { background: Highlight; }
  .og-site .og-mode-toggle__thumb { background: ButtonFace; border: 1px solid ButtonText; }
  .og-site .og-mode-toggle__state, .og-site .og-mode-toggle__caption { color: ButtonText; }
  .og-site .og-mode-toggle__button:focus-visible { outline-color: Highlight; }
}






/* Atmósfera verde de la pantalla Publicar viaje */
.og-site .og-publicar-page {
  position: relative;
  isolation: isolate;
  min-height: calc(100vh - 68px);
  padding: 1rem 0 2rem;
  overflow: visible;
}

.og-site .og-publicar-page::before,
.og-site .og-publicar-page::after {
  position: fixed;
  z-index: 0;
  width: 34rem;
  height: 34rem;
  border-radius: 50%;
  content: "";
  pointer-events: none;
  filter: blur(92px);
}

.og-site .og-publicar-page::before {
  top: -15rem;
  right: -14rem;
  background: rgba(96, 221, 156, .48);
}

.og-site .og-publicar-page::after {
  bottom: -15rem;
  left: -14rem;
  background: rgba(185, 242, 39, .32);
}

.og-site .og-publicar-page > .row {
  position: relative;
  z-index: 1;
}

@media (max-width: 575.98px) {
  .og-site .og-publicar-page::before,
  .og-site .og-publicar-page::after {
    width: 24rem;
    height: 24rem;
    filter: blur(72px);
  }

  .og-site .og-publicar-page::before {
    top: -11rem;
    right: -12rem;
  }

  .og-site .og-publicar-page::after {
    bottom: -11rem;
    left: -12rem;
  }
}

/* Plazas y preferencias del viaje */
.og-site .og-seat-option {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 3.25rem;
  padding: .75rem;
  border: 1px solid transparent;
  border-radius: .75rem;
  background: #F1F4F2;
  color: var(--og-text-dark);
  cursor: pointer;
  font-weight: 600;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

.og-site .og-seat-option:hover {
  background: #E6E9E7;
}

.og-site .og-seat-option__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.og-site .og-seat-option:has(.og-seat-option__input:checked) {
  border-color: var(--og-primary);
  background: var(--og-secondary);
  color: #FFFFFF;
  box-shadow: 0 0 0 1px var(--og-primary);
}

.og-site .og-preference-card {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  min-height: 100%;
  padding: 1rem;
  border: 1px solid transparent;
  border-radius: .75rem;
  background: #F1F4F2;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}

.og-site .og-preference-card:hover {
  background: #E6E9E7;
}

.og-site .og-preference-card:has(.og-preference-card__input:checked) {
  border-color: #BDE2D4;
  background: var(--og-secondary-subtle);
}

.og-site .og-preference-card__input {
  flex: 0 0 auto;
  width: 1.1rem;
  height: 1.1rem;
  margin-top: .15rem;
  accent-color: var(--og-secondary);
}

.og-site .og-preference-card strong,
.og-site .og-preference-card small {
  display: block;
}

.og-site .og-preference-card strong {
  color: var(--og-text-dark);
  font-size: .9rem;
}

.og-site .og-preference-card small {
  margin-top: .15rem;
  color: var(--og-text-muted);
  font-size: .75rem;
}

/* Vista previa de Publicar viaje */
.og-site .og-vista-previa__header {
  padding: .9rem 1rem;
  background: var(--og-primary);
  color: #FFFFFF;
  font-family: 'Poppins', sans-serif;
  font-size: .82rem;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.og-site .og-vista-previa__header .badge {
  background: var(--og-secondary);
  color: #FFFFFF;
  font-size: .65rem;
  text-transform: uppercase;
}

.og-site .og-vista-previa__foto,
.og-site .og-vista-previa__iniciales {
  width: 3.2rem;
  height: 3.2rem;
  flex: 0 0 auto;
}

.og-site .og-vista-previa__foto {
  object-fit: cover;
}

.og-site .og-vista-previa__iniciales {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--og-primary);
  color: #FFFFFF;
  font-weight: 700;
}

.og-site .og-vista-previa__vehiculo {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem .8rem;
  border-radius: .75rem;
  background: #EEF1EF;
  color: var(--og-text-dark);
  font-size: .85rem;
  font-weight: 600;
}

.og-site .og-vista-previa__recorrido {
  position: relative;
}

.og-site .og-vista-previa__punto {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
}

.og-site .og-vista-previa__punto strong,
.og-site .og-vista-previa__punto small {
  display: block;
}

.og-site .og-vista-previa__punto strong {
  color: var(--og-text-dark);
  font-size: .9rem;
}

.og-site .og-vista-previa__punto small {
  margin-top: .15rem;
  color: var(--og-text-muted);
  font-size: .76rem;
}

.og-site .og-vista-previa__marcador {
  width: .75rem;
  height: .75rem;
  margin-top: .25rem;
  border-radius: 50%;
  flex: 0 0 auto;
}

.og-site .og-vista-previa__marcador--origen {
  background: var(--og-secondary);
}

.og-site .og-vista-previa__marcador--destino {
  background: var(--og-primary);
}

.og-site .og-vista-previa__linea {
  width: 2px;
  height: 1.5rem;
  margin: .2rem 0 .2rem .32rem;
  background: var(--og-secondary);
}

.og-site .og-vista-previa__observaciones {
  margin: 0 0 1.25rem;
  padding: .85rem;
  border-radius: .75rem;
  background: #EEF1EF;
  color: var(--og-text-dark);
  font-size: .84rem;
  font-style: italic;
  white-space: pre-wrap;
}

.og-site .og-vista-previa__footer {
  background: #F7FAF8;
}

.og-site .og-vista-previa__aporte {
  color: var(--og-primary);
  font-family: 'Poppins', sans-serif;
  font-size: 1.65rem;
  line-height: 1;
}

.og-site .og-vista-previa__footer .btn:disabled {
  border-color: #6D7A70;
  background: #6D7A70;
  color: #FFFFFF;
  box-shadow: none;
  cursor: not-allowed;
  opacity: 1;
}

/* Área de observaciones de Publicar viaje */
.og-site .og-observaciones-input {
  min-height: 8rem;
  padding: 1rem;
  border: 0;
  border-radius: .75rem;
  background: #EEF1EF;
  color: var(--og-text-dark);
  box-shadow: none;
  resize: vertical;
}

.og-site .og-observaciones-input::placeholder {
  color: #6D7A70;
  opacity: 1;
}

.og-site .og-observaciones-input:focus {
  border: 0;
  background: #E6E9E7;
  box-shadow: 0 0 0 2px var(--og-primary);
}

/* Publicación incompleta: botón visible, pero clickeable */
.og-site .og-vista-previa__submit.is-disabled,
.og-site .og-vista-previa__submit [aria-disabled="true"] {
    background: #9AA7A0;
    border-color: #9AA7A0;
    color: #FFFFFF;
    cursor: pointer;
    opacity: 1;
}

.og-site .og-vista-previa__submit.is-disabled:hover {
    background: #839189;
    border-color: #839189;
}

/* Campos obligatorios pendientes */
.og-site .form-control.is-invalid-client,
.og-site .form-select.is-invalid-client {
    border-color: #C62828;
    box-shadow: 0 0 0 .2rem rgba(198, 40, 40, .12);
}

.og-site .og-campo-incompleto .og-seat-option {
    border-color: #C62828;
    background: #FFF5F5;
}

/* Aviso superior con el resumen de campos pendientes */
.og-site .og-alerta-publicar {
    border: 1px solid #F1A6A6;
    border-radius: .85rem;
    background: #FFF2F2;
    color: #8B1E1E;
    box-shadow: 0 .35rem .9rem rgba(139, 30, 30, .08);
}

/* Breve respuesta visual al insistir en publicar */
.og-site .og-boton-sacudida {
    animation: og-sacudir-boton .34s ease-in-out;
}

@keyframes og-sacudir-boton {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

@media (prefers-reduced-motion: reduce) {
    .og-site .og-boton-sacudida {
        animation: none;
    }
}


/* Mensajes de error al publicar un viaje */
.og-site .og-summary-error,
.og-site .og-alerta-publicar {
    width: 100%;
    padding: 1rem 1.25rem;
    border: 0;
    border-radius: .75rem;
    background: #FFD9D5;
    color: #A31313;
    font-size: .95rem;
    box-shadow: none;
}

.og-site .og-summary-error.validation-summary-valid {
    display: none;
}

.og-site .og-summary-error ul,
.og-site .og-alerta-publicar ul {
    margin: .5rem 0 0;
    padding-left: 1.15rem;
}

.og-site .og-summary-error li::marker,
.og-site .og-alerta-publicar li::marker {
    color: #C62828;
}

/* Separación entre los avisos de error y las tarjetas del formulario */
.og-site #formCrearViaje > .og-alerta-publicar,
.og-site #formCrearViaje > .og-summary-error {
    margin: 0 0 1.75rem !important;
}


/* Línea continua entre origen y destino en la vista previa */
.og-site .og-vista-previa__punto {
    align-items: stretch;
}

.og-site .og-vista-previa__trayecto {
    display: flex;
    flex: 0 0 .75rem;
    flex-direction: column;
    align-items: center;
    width: .75rem;
}

.og-site .og-vista-previa__trayecto .og-vista-previa__linea {
    display: block;
    flex: 1;
    width: 2px;
    min-height: 1.5rem;
    height: auto;
    margin: .22rem 0 0;
    background: var(--og-secondary);
}

/* Menú de perfil del navbar */
.og-site .og-menu-usuario__trigger {
    display: inline-flex;
    padding: .3rem .65rem .3rem .35rem;
    border: 1px solid #DCE6E0;
    border-radius: 999px;
    background: #FFFFFF;
    color: var(--og-text-dark);
    box-shadow: 0 1px 3px rgba(11, 93, 69, .08);
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    text-decoration: none;
}

.og-site .og-menu-usuario__trigger:hover,
.og-site .og-menu-usuario__trigger:focus {
    border-color: #B9DCCD;
    background: #F7FAF8;
    color: var(--og-text-dark);
}

.og-site .og-menu-usuario__trigger::after {
    margin-left: .2rem;
}

.og-site .og-menu-usuario__avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border: 2px solid #FFFFFF;
    border-radius: 50%;
    object-fit: cover;
    background: #66716B;
    color: #FFFFFF;
    box-shadow: 0 0 0 1px #CFE1D8;
    font-size: .85rem;
    font-weight: 700;
    flex: 0 0 auto;
}

.og-site .og-menu-usuario__nombre {
    max-width: 11rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.og-site .og-menu-usuario__lista {
    min-width: 15rem;
    margin-top: .6rem;
    padding: .45rem;
    border: 1px solid #DCE6E0;
    border-radius: .9rem;
    background: #FFFFFF;
    box-shadow: 0 .75rem 1.75rem rgba(11, 93, 69, .14);
}

.og-site .og-menu-usuario__opcion {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .8rem;
    border-radius: .6rem;
    color: var(--og-text-dark);
    font-size: .92rem;
    font-weight: 500;
}

.og-site .og-menu-usuario__opcion i {
    width: 1.1rem;
    color: var(--og-primary);
    font-size: 1rem;
    text-align: center;
}

.og-site .og-menu-usuario__opcion:hover,
.og-site .og-menu-usuario__opcion:focus {
    background: #EAF5EF;
    color: var(--og-primary);
}

.og-site .og-menu-usuario__icono-calificacion {
    color: #E9A400 !important;
}

.og-site .og-menu-usuario__separador {
    margin: .4rem 0;
    border-color: #E3EAE6;
}

.og-site .og-menu-usuario__opcion--salir {
    color: #9B3030;
}

.og-site .og-menu-usuario__opcion--salir i {
    color: #B94A4A;
}

.og-site .og-menu-usuario__opcion--salir:hover,
.og-site .og-menu-usuario__opcion--salir:focus {
    background: #FFF3F2;
    color: #9B3030;
}

@media (max-width: 575.98px) {
    .og-site .og-menu-usuario__nombre {
        display: none;
    }

    .og-site .og-menu-usuario__trigger {
        padding-right: .45rem;
    }
}

/* Acceso a notificaciones */
.og-site .og-notificaciones {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.55rem;
    height: 2.55rem;
    border: 1px solid #DCE6E0;
    border-radius: 50%;
    background: #FFFFFF;
    color: var(--og-primary);
    box-shadow: 0 1px 3px rgba(11, 93, 69, .08);
    font-size: 1.25rem;
    text-decoration: none;
    transition: background-color .2s ease, border-color .2s ease,
                transform .2s ease;
}

.og-site .og-notificaciones:hover,
.og-site .og-notificaciones:focus {
    border-color: #B9DCCD;
    background: #EAF5EF;
    color: var(--og-primary);
    transform: translateY(-1px);
}

.og-site .og-notificaciones__contador {
    position: absolute;
    top: -.3rem;
    right: -.35rem;
    min-width: 1.2rem;
    padding: .1rem .3rem;
    border: 2px solid #FFFFFF;
    border-radius: 999px;
    background: #C23B3B;
    color: #FFFFFF;
    font-size: .65rem;
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
}

/* Tarjeta de seguridad dentro de Mi perfil */
.og-site .og-perfil-seguridad {
    border: 1px solid #E0EAE4;
    background: #FFFFFF;
}

/* Pantalla Mi perfil */
.og-site .og-perfil-introduccion {
    margin-bottom: 1.25rem;
}

.og-site .og-perfil-introduccion__eyebrow {
    display: inline-flex;
    align-items: center;
    margin-bottom: .35rem;
    color: var(--og-primary);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.og-site .og-perfil-introduccion h1 {
    margin-bottom: .35rem;
    color: var(--og-text-dark);
    font-family: 'Poppins', sans-serif;
    font-size: clamp(1.65rem, 3vw, 2rem);
    font-weight: 700;
}

.og-site .og-perfil-introduccion p {
    margin-bottom: 0;
    color: var(--og-text-muted);
}

.og-site .og-perfil-editar {
    padding: .65rem 1rem;
    font-weight: 600;
}

.og-site .og-perfil-card {
    border: 1px solid #E0EAE4 !important;
    overflow: hidden;
}

.og-site .og-perfil-card .card-body {
    padding: clamp(1.25rem, 3vw, 2rem);
}

.og-site .og-perfil-avatar {
    border: 3px solid #FFFFFF;
    box-shadow: 0 0 0 2px #CDE5D9;
    object-fit: cover;
}

.og-site .og-perfil-datos {
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid #E5ECE8;
}

.og-site .og-perfil-datos dt,
.og-site .og-perfil-datos dd {
    padding-top: .6rem;
    padding-bottom: .6rem;
    margin-bottom: 0;
}

.og-site .og-perfil-datos dt {
    color: var(--og-text-muted);
    font-size: .84rem;
    font-weight: 600;
}

.og-site .og-perfil-datos dd {
    color: var(--og-text-dark);
    font-weight: 500;
}

@media (max-width: 575.98px) {
    .og-site .og-perfil-editar {
        width: 100%;
    }

    .og-site .og-perfil-datos dt {
        padding-bottom: .1rem;
    }

    .og-site .og-perfil-datos dd {
        padding-top: .1rem;
        padding-bottom: .85rem;
    }
}

/* Avatar predeterminado cuando no existe foto o la imagen falla */
.og-site .og-menu-usuario__foto,
.og-site .og-perfil-avatar-contenedor {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.og-site .og-avatar-predeterminado {
    background: #E2E6E4;
    color: #68746D;
}

.og-site .og-avatar-predeterminado i {
    font-size: 1.15rem;
}

.og-site .og-perfil-avatar-contenedor {
    width: 96px;
    height: 96px;
}

.og-site .og-perfil-avatar--predeterminado {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 96px;
    background: #E2E6E4;
    color: #68746D;
    font-size: 2.5rem;
}

/* Página de notificaciones */
.og-site .og-notificaciones-pagina {
    max-width: 56rem;
    margin: 0 auto;
}

.og-site .og-notificaciones-pagina__encabezado {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.og-site .og-notificaciones-pagina__eyebrow {
    color: var(--og-primary);
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.og-site .og-notificaciones-pagina h1 {
    margin: .25rem 0;
    color: var(--og-text-dark);
    font-family: 'Poppins', sans-serif;
    font-size: clamp(1.65rem, 3vw, 2rem);
    font-weight: 700;
}

.og-site .og-notificaciones-pagina__encabezado p {
    margin: 0;
    color: var(--og-text-muted);
}

.og-site .og-notificaciones-pagina__contador {
    flex: 0 0 auto;
    padding: .45rem .7rem;
    border-radius: 999px;
    background: #EAF5EF;
    color: var(--og-primary);
    font-size: .8rem;
    font-weight: 700;
}

.og-site .og-notificaciones-lista {
    display: grid;
    gap: .85rem;
}

.og-site .og-notificacion {
    display: flex;
    gap: 1rem;
    padding: 1.1rem;
    border: 1px solid #E0EAE4;
    border-radius: 1rem;
    background: #FFFFFF;
    box-shadow: 0 .25rem .8rem rgba(11, 93, 69, .05);
}

.og-site .og-notificacion--nueva {
    border-color: #B9DCCD;
    background: linear-gradient(90deg, #F1FAF5 0%, #FFFFFF 35%);
}

.og-site .og-notificacion__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 50%;
    flex: 0 0 auto;
    font-size: 1.1rem;
}

.og-site .og-notificacion__icono--solicitud,
.og-site .og-notificacion__icono--aceptada {
    background: #DDF4E8;
    color: #08754B;
}

.og-site .og-notificacion__icono--rechazada,
.og-site .og-notificacion__icono--cancelada {
    background: #FFF0EF;
    color: #B94A4A;
}

.og-site .og-notificacion__icono--calificacion {
    background: #FFF6D9;
    color: #C98A00;
}

.og-site .og-notificacion__icono--general {
    background: #EAF5EF;
    color: var(--og-primary);
}

.og-site .og-notificacion__contenido {
    min-width: 0;
    flex: 1;
}

.og-site .og-notificacion__cabecera {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.og-site .og-notificacion h2 {
    margin: 0;
    color: var(--og-text-dark);
    font-size: 1rem;
    font-weight: 700;
}

.og-site .og-notificacion__estado {
    flex: 0 0 auto;
    padding: .2rem .45rem;
    border-radius: 999px;
    background: var(--og-secondary);
    color: #073B2B;
    font-size: .68rem;
    font-weight: 700;
}

.og-site .og-notificacion__mensaje {
    margin: .35rem 0 .6rem;
    color: var(--og-text-muted);
    font-size: .9rem;
    white-space: pre-wrap;
}

.og-site .og-notificacion__fecha {
    display: block;
    color: #728078;
    font-size: .78rem;
}

.og-site .og-notificacion__acciones {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: .9rem;
}

.og-site .og-notificacion__marcar {
    color: #64726A;
    text-decoration: none;
}

.og-site .og-notificacion__marcar:hover,
.og-site .og-notificacion__marcar:focus {
    color: var(--og-primary);
    text-decoration: underline;
}

.og-site .og-notificaciones-vacias {
    padding: 3rem 1.5rem;
    border: 1px dashed #C9DCD1;
    border-radius: 1rem;
    background: #FFFFFF;
    text-align: center;
}

.og-site .og-notificaciones-vacias__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: .85rem;
    border-radius: 50%;
    background: #EAF5EF;
    color: var(--og-primary);
    font-size: 1.45rem;
}

.og-site .og-notificaciones-vacias h2 {
    margin-bottom: .4rem;
    color: var(--og-text-dark);
    font-size: 1.1rem;
    font-weight: 700;
}

.og-site .og-notificaciones-vacias p {
    margin: 0;
    color: var(--og-text-muted);
}

@media (max-width: 575.98px) {
    .og-site .og-notificaciones-pagina__encabezado {
        align-items: flex-start;
        flex-direction: column;
    }

    .og-site .og-notificacion {
        gap: .75rem;
        padding: 1rem;
    }

    .og-site .og-notificacion__cabecera {
        flex-direction: column;
        gap: .4rem;
    }
}

/* Énfasis moderado para Crear viaje en la navegación móvil */
@media (max-width: 991.98px) {
    body.og-site {
        padding-bottom: 78px;
    }

    .mobile-bottom-bar {
        height: 72px;
    }

    .mobile-nav-link {
        min-height: 62px;
        font-size: .66rem;
    }
}

/* Accesos disponibles dentro de Mi perfil */
.og-site .og-perfil-accesos {
    margin-top: 1.5rem;
    padding: 1.5rem;
    border: 1px solid #E0EAE4;
    border-radius: 1rem;
    background: #FFFFFF;
    box-shadow: 0 .25rem .8rem rgba(11, 93, 69, .04);
}

.og-site .og-perfil-accesos__encabezado {
    margin-bottom: 1rem;
}

.og-site .og-perfil-accesos__encabezado h2 {
    margin: 0 0 .25rem;
    color: var(--og-text-dark);
    font-size: 1.05rem;
    font-weight: 700;
}

.og-site .og-perfil-accesos__encabezado p {
    margin: 0;
    color: var(--og-text-muted);
    font-size: .87rem;
}

.og-site .og-perfil-acceso {
    display: flex;
    align-items: center;
    gap: .85rem;
    min-height: 5rem;
    padding: .85rem;
    border: 1px solid #E0EAE4;
    border-radius: .85rem;
    background: #FFFFFF;
    color: var(--og-text-dark);
    text-decoration: none;
    transition: border-color .2s ease, background-color .2s ease,
                transform .2s ease;
}

.og-site .og-perfil-acceso:hover,
.og-site .og-perfil-acceso:focus {
    border-color: #B9DCCD;
    background: #F5FBF7;
    color: var(--og-text-dark);
    transform: translateY(-1px);
}

.og-site .og-perfil-acceso__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    height: 2.45rem;
    border-radius: 50%;
    background: #EAF5EF;
    color: var(--og-primary);
    flex: 0 0 auto;
}

.og-site .og-perfil-acceso__icono--calificacion {
    background: #FFF6D9;
    color: #C98A00;
}

.og-site .og-perfil-acceso strong,
.og-site .og-perfil-acceso small {
    display: block;
}

.og-site .og-perfil-acceso strong {
    font-size: .9rem;
    font-weight: 700;
}

.og-site .og-perfil-acceso small {
    margin-top: .15rem;
    color: var(--og-text-muted);
    font-size: .77rem;
}

.og-site .og-perfil-acceso__flecha {
    margin-left: auto;
    color: #849087;
}

.og-site .og-perfil-cerrar-sesion {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .35rem 0;
    border: 0;
    background: transparent;
    color: #9B3030;
    font-size: .86rem;
    font-weight: 600;
}

.og-site .og-perfil-cerrar-sesion:hover,
.og-site .og-perfil-cerrar-sesion:focus {
    color: #7D1F1F;
    text-decoration: underline;
}

/* En móvil, Perfil y sus acciones se acceden desde la barra inferior */
@media (max-width: 991.98px) {
    .og-site .og-navbar .og-menu-usuario {
        display: none;
    }
}

/* Pantalla Cambiar contraseña */
.og-site .og-password-page {
    padding-top: 1rem;
}

.og-site .og-password-volver {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    margin-bottom: 1rem;
    color: var(--og-primary);
    font-size: .88rem;
    font-weight: 600;
    text-decoration: none;
}

.og-site .og-password-volver:hover,
.og-site .og-password-volver:focus {
    color: var(--og-primary-hover);
    text-decoration: underline;
}

.og-site .og-password-card {
    padding: clamp(1.35rem, 4vw, 2rem);
    border: 1px solid #E0EAE4;
    border-radius: 1rem;
    background: #FFFFFF;
    box-shadow: 0 .6rem 1.6rem rgba(11, 93, 69, .09);
}

.og-site .og-password-card__encabezado {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
    margin-bottom: 1.75rem;
}

.og-site .og-password-card__icono {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    border-radius: .85rem;
    background: #EAF5EF;
    color: var(--og-primary);
    font-size: 1.3rem;
    flex: 0 0 auto;
}

.og-site .og-password-card__eyebrow {
    color: var(--og-primary);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.og-site .og-password-card h1 {
    margin: .15rem 0 .35rem;
    color: var(--og-text-dark);
    font-family: 'Poppins', sans-serif;
    font-size: 1.45rem;
    font-weight: 700;
}

.og-site .og-password-card p {
    margin: 0;
    color: var(--og-text-muted);
    font-size: .88rem;
}

.og-site .og-password-ver {
    border-color: var(--bs-border-color);
    color: #68746D;
}

.og-site .og-password-ver:hover,
.og-site .og-password-ver:focus {
    border-color: #B9DCCD;
    background: #EAF5EF;
    color: var(--og-primary);
}

.og-site .og-password-errores {
    margin-bottom: 1rem;
    padding: .8rem 1rem;
    border-radius: .75rem;
    background: #FFD9D5;
    color: #A31313;
    font-size: .87rem;
}

.og-site .og-password-errores:empty {
    display: none;
}

.og-site .og-password-errores ul {
    margin: 0;
    padding-left: 1.1rem;
}

.og-site .og-password-guardar {
    font-weight: 600;
}

/* Avatar del saludo de Inicio */
.og-site .og-inicio-avatar {
    display: inline-flex;
    flex: 0 0 auto;
}

.og-site .og-inicio-avatar__vacio {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
}

.og-site .og-inicio-avatar__vacio i {
    font-size: 1.9rem;
}

/* Avatar pequeño con respaldo gris (tarjeta de próximo viaje y vista previa) */
.og-site .og-avatar-chico {
    display: inline-flex;
    flex: 0 0 auto;
}

.og-site .og-avatar-chico__vacio,
.og-site .og-vista-previa__vacio {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.og-site .og-avatar-chico__vacio {
    width: 48px;
    height: 48px;
}

.og-site .og-vista-previa__vacio {
    width: 3.2rem;
    height: 3.2rem;
}

.og-site .og-avatar-chico__vacio i,
.og-site .og-vista-previa__vacio i {
    font-size: 1.5rem;
}


/* Switch de modo: etiqueta en mayúsculas solo cuando se muestra «Modo activo» */
@media (min-width: 576px) {
    .og-site .og-mode-toggle__state,
    .og-site .og-mode-toggle__sizer {
        text-transform: uppercase;
    }
}

/* Móvil y tablet: la campana se accede desde la barra inferior (Avisos) */
@media (max-width: 991.98px) {
    .og-site .og-nav-actions .og-notificaciones {
        display: none;
    }
}

/* Móvil: el switch ocupa el hueco entre el logo y el menú, en tamaño compacto */
@media (max-width: 575.98px) {
    .og-site .og-navbar--modo .navbar-brand { order: 0; }

    .og-site .og-navbar--modo .og-nav-actions {
        order: 1;
        flex: 0 1 auto;
        margin-left: .75rem;
        margin-right: 0;
    }

    .og-site .og-navbar--modo .navbar-toggler {
        order: 2;
        margin-left: auto;
    }
    .og-site .og-navbar--modo .navbar-collapse { order: 3; }

    .og-site .og-nav-actions .og-mode-toggle { flex: 0 1 auto; }

    .og-site .og-mode-toggle__button {
        gap: .35rem;
        padding: .15rem .5rem .15rem .15rem;
    }

    .og-site .og-mode-toggle__icon-stage { width: 1.6rem; height: 1.6rem; }
    .og-site .og-mode-toggle__icon { inset: .2rem; }

    .og-site .og-mode-toggle__state,
    .og-site .og-mode-toggle__sizer { font-size: .72rem; }

    .og-site .og-mode-toggle__track {
        width: 1.7rem;
        height: 1rem;
        padding: .13rem;
        margin-left: .1rem;
    }

    .og-site .og-mode-toggle__thumb { width: .74rem; height: .74rem; }

    .og-site .og-mode-toggle__button[data-modo-visual="conductor"] .og-mode-toggle__thumb {
        transform: translateX(.7rem);
    }
}

/* Contador de notificaciones en el acceso «Avisos» de la barra inferior */
.og-site .og-aviso-barra__icono {
    position: relative;
    display: inline-flex;
}

.og-site .og-aviso-barra__contador {
    top: -.45rem;
    right: -.75rem;
}