/* Diseño "papel y tinta": campos con línea en vez de caja, un solo botón principal sólido y los secundarios como texto subrayado,
   y Bricolage Grotesque en el texto (los títulos siguen en Big Shoulders). Va después de styles.css y portal.css y antes de tema.css. */
:root{--sans:'Bricolage Grotesque',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--hand:var(--sans);--r:2px}

/* Campos: solo línea inferior */
.login-form input,.step input[type=text],.step input[type=date],.p-avform input,.p-form input,.p-form select,.p-form textarea,.p-edrow input,.p-file input,.p-sem input,.p-cgrid input,.p-cl-tools input,.p-cl-tools select,.p-yo select,#clAn,.p-tbav-yo select{border:0;border-bottom:2px solid var(--navy);border-radius:0;background:transparent;padding-left:0;padding-right:0}
.login-form input:focus,.step input:focus,.p-form input:focus,.p-form select:focus,.p-form textarea:focus{outline:none;border-bottom-color:var(--blue);box-shadow:0 2px 0 var(--blue)}
.hero select{border:0;border-bottom:2px solid rgba(255,255,255,.7);border-radius:0;background:transparent!important;color:#fff!important;padding-left:0}
.hero select option{background-color:#fff;color:#010431}
.pw input{padding-right:3.1rem}

/* Botones: el secundario es texto subrayado; el principal (btn-hl) es sólido */
.btn{background:transparent;border:0;border-radius:0;box-shadow:inset 0 -2px 0 var(--navy);padding:.5rem .15rem;min-height:40px;font-weight:600}
.btn:hover{transform:none;box-shadow:inset 0 -4px 0 var(--blue);color:var(--blue)}
.btn:active{box-shadow:inset 0 -4px 0 var(--blue)}
.btn.btn-hl{background:var(--navy);color:#fff;box-shadow:none;border-radius:2px;padding:.55rem 1.5rem;letter-spacing:.02em}
.btn.btn-hl:hover{background:var(--blue);color:#fff;box-shadow:none}
.btn-danger{box-shadow:inset 0 -2px 0 var(--red);color:var(--red)}
.btn-danger:hover{box-shadow:inset 0 -4px 0 var(--red);color:var(--red)}
.lg-alt{border:0;border-radius:0;background:none;box-shadow:inset 0 -2px 0 var(--navy);justify-self:start;padding:0 .1rem;min-height:36px}
.lg-alt:hover{background:none;box-shadow:inset 0 -4px 0 var(--blue);color:var(--blue)}

/* Sobre fondos oscuros (tarjetas del encabezado): el secundario va en blanco y el principal en lavanda */
.hero .btn,.p-hero .btn,.p-rhero .btn{color:#fff;box-shadow:inset 0 -2px 0 rgba(255,255,255,.8)}
.hero .btn:hover,.p-hero .btn:hover,.p-rhero .btn:hover{color:var(--hl);box-shadow:inset 0 -4px 0 var(--hl)}
.hero .btn.btn-hl,.p-hero .btn.btn-hl,.p-rhero .btn.btn-hl{background:var(--hl);color:#010431;box-shadow:none}
.hero .btn.btn-hl:hover,.p-hero .btn.btn-hl:hover,.p-rhero .btn.btn-hl:hover{background:#fff;color:#010431}

/* Etiquetas y paneles */
.login-form label,.sel-label{font-size:.78rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.nav button{border-radius:2px}
.panel,.step{border:0;border-top:3px solid var(--navy);border-radius:0;background:transparent;padding-left:0;padding-right:0}

/* Modo oscuro: el principal es lavanda con texto oscuro (la variable --navy se invierte a claro) */
:root[data-tema="dark"] .btn.btn-hl{color:#010431}
:root[data-tema="dark"] .btn.btn-hl:hover{background:#fff;color:#010431}

/* Tipografía del sitio también en campos y botones, incluido el autocompletado del navegador (antes, a veces se veía la fuente por defecto) */
button,input,select,textarea{font-family:var(--sans)}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,select:-webkit-autofill,textarea:-webkit-autofill{font-family:var(--sans)!important;-webkit-text-fill-color:var(--ink);caret-color:var(--ink);transition:background-color 600000s 0s,color 600000s 0s}