/* ===== Servicios en línea: cuentas de contribuyentes y formularios ===== */


.cuenta-body > *{ max-width: 980px; }
.cuenta-angosta{ max-width: 520px; }
.cuenta-intro{ color: var(--slate); margin-bottom: 24px; max-width: 62ch; }

.form-publico{ background:#fff; border:1px solid var(--line); padding:28px; display:flex; flex-direction:column; gap:18px; }
.form-publico h2{ font-size:1.25rem; margin-bottom:-4px; }
.form-publico fieldset{ border:none; display:flex; flex-direction:column; gap:18px; }
.form-publico legend{ font-family:'Fraunces', serif; font-weight:600; font-size:1.15rem; color:var(--gulf-teal-dark); margin-bottom:14px; }
.form-publico label{ display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:0.95rem; }
.form-publico input[type=text], .form-publico input[type=email], .form-publico input[type=tel],
.form-publico input[type=password], .form-publico select, .form-publico textarea{
  font: inherit; font-weight:400; padding:11px 12px; border:1px solid rgba(28,42,44,0.28); border-radius:var(--radius);
  background:#fff; color:var(--ink); width:100%;
}
.form-publico textarea{ min-height:110px; resize:vertical; }
.form-publico input:focus, .form-publico select:focus, .form-publico textarea:focus{
  outline:2px solid var(--mangrove); outline-offset:1px; border-color:var(--mangrove);
}
.form-publico .ayuda{ font-weight:400; font-size:0.85rem; color:var(--slate); }
.form-publico .opcional{ font-weight:400; color:var(--slate); font-size:0.85rem; }
.form-publico .casilla{ flex-direction:row; align-items:flex-start; gap:10px; font-weight:400; }
.form-publico .casilla input{ margin-top:4px; width:18px; height:18px; flex:none; accent-color: var(--gulf-teal); }
.fila-campos{ display:grid; grid-template-columns: 1fr 1fr; gap:18px; }
.fila-campos-ancha{ display:grid; grid-template-columns: 200px 1fr; gap:18px; }

.boton-form{ display:inline-block; font:inherit; font-weight:700; padding:13px 24px; border:none; border-radius:var(--radius);
  background:var(--gulf-teal); color:#fff; cursor:pointer; text-align:center; }
.boton-form:hover{ background:var(--mangrove); }
.boton-form-borde{ background:transparent; color:var(--gulf-teal); border:2px solid var(--gulf-teal); padding:11px 22px; }
.boton-form-borde:hover{ background:var(--gulf-teal); color:#fff; }
.acciones-form{ display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.enlace-secundario{ color:var(--mangrove); text-decoration:underline; text-underline-offset:3px; font-size:0.95rem; }

.mensaje{ padding:14px 18px; border-left:4px solid; background:#fff; margin-bottom:20px; }
.mensaje-ok{ border-color:#2E7D4F; }
.mensaje-error{ border-color:#B3261E; }
.mensaje-info{ border-color:var(--harvest-gold); }
.mensaje ul{ margin:6px 0 0 18px; }

.campo-trampa{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Panel de la cuenta */
.cuenta-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:24px; margin-bottom:32px; }
.tarjeta{ background:#fff; border:1px solid var(--line); padding:24px; display:flex; flex-direction:column; gap:12px; }
.tarjeta h2{ font-size:1.2rem; }
.tarjeta p{ color:var(--slate); }
.tarjeta .boton-form, .tarjeta .boton-form-borde{ align-self:flex-start; }
.datos-lista{ display:grid; grid-template-columns: max-content 1fr; gap:6px 16px; font-size:0.95rem; }
.datos-lista dt{ color:var(--slate); }
.datos-lista dd{ font-weight:600; word-break:break-word; }
.etiqueta-estado{ display:inline-block; font-size:0.78rem; font-weight:700; padding:3px 10px; border-radius:99px; }
.etiqueta-pendiente{ background:#FFF1D6; color:#7A4B00; }
.etiqueta-aplicada{ background:#DDF2E4; color:#1D5C36; }
.etiqueta-rechazada{ background:#FBE1DF; color:#8C1D18; }
.etiqueta-neutra{ background:#E8EEEF; color:var(--gulf-teal-dark); }
.cuenta-seccion{ margin-top:8px; margin-bottom:32px; }
.cuenta-seccion > h2{ font-size:1.35rem; margin-bottom:14px; }
.nota-solicitud{ font-size:0.88rem; color:var(--slate); margin-top:4px; }

.texto-legal{ background:#fff; border:1px solid var(--line); padding:28px; max-width:75ch; }
.texto-legal h2{ font-size:1.15rem; margin:22px 0 8px; }
.texto-legal h2:first-child{ margin-top:0; }
.texto-legal p, .texto-legal li{ margin-bottom:8px; }
.texto-legal ul{ margin-left:20px; }

@media (max-width: 720px){
  .fila-campos, .fila-campos-ancha, .cuenta-grid{ grid-template-columns: 1fr; }
  .form-publico, .tarjeta, .texto-legal{ padding:20px; }
}

/* ===== Botón "Servicios en línea / Mi cuenta" a la derecha del menú ===== */
.nav-bar{ display:flex; align-items:center; gap:12px; }
.nav-bar .nav-lista{ flex:1 1 auto; min-width:0; }
.nav-cuenta{
  flex:none; display:inline-flex; align-items:center; gap:8px; margin-left:auto;
  padding:8px 16px; border-radius:999px; white-space:nowrap;
  background: var(--harvest-gold); color: var(--texto-sobre-acento, #1C2A2C);
  font:700 0.85rem 'Public Sans', sans-serif; letter-spacing:0.02em;
  border:2px solid transparent; transition: background .15s, color .15s, border-color .15s;
}
.nav-cuenta:hover, .nav-cuenta:focus-visible{ background: transparent; color: var(--salt-white); border-color: var(--salt-white); }
.nav-cuenta.activo{ background: transparent; color: var(--salt-white); border-color: var(--harvest-gold); }
.nav-cuenta svg{ flex:none; }

/* Escritorio: el menú se compacta un poco para que quepa el botón en la misma línea */
@media (min-width: 1101px){
  .nav-bar .nav-lista{ flex-wrap:nowrap; }
  .nav-bar .nav-link{ padding-left:13px; padding-right:13px; }
}
@media (min-width: 1101px) and (max-width: 1240px){
  .nav-bar .nav-link{ padding-left:10px; padding-right:10px; font-size:0.84rem; }
  .nav-cuenta{ padding:7px 13px; font-size:0.8rem; }
}

/* Pantallas medianas (tabletas, laptops pequeñas): mismo menú que en celular */
@media (min-width: 881px) and (max-width: 1100px){
  .nav-toggle{ display:flex; }
  .nav-lista{ display:none; flex-direction:column; padding-bottom:10px; }
  nav.main-nav.menu-abierto .nav-lista{ display:flex; }
  nav.main-nav{ max-height:100vh; overflow-y:auto; }
  .nav-link{ width:100%; justify-content:space-between; padding:13px 4px; border-bottom:1px solid rgba(255,255,255,0.08); }
  .mega{ position:static; box-shadow:none; max-height:none; border-top:none; }
  .mega-grid{ columns:1; padding:14px 18px 4px; }
}

/* Celular y pantallas medianas: botón de Menú a la izquierda, Servicios en línea a la derecha, la lista abajo */
@media (max-width: 1100px){
  .nav-bar{ flex-wrap:wrap; gap:0; }
  .nav-bar .nav-lista{ order:3; flex-basis:100%; }
  .nav-cuenta{ padding:7px 14px; font-size:0.82rem; }
}

/* Nombre completado desde el registro de contribuyentes */
.form-publico input.campo-confirmado{ background:#F1F7F2; border-color:#7BB38D; color:var(--ink); }
