/* =====================================================================
   Sucursal Virtual JAVE
   Todos los estilos van bajo .sv para no interferir con el resto del sitio
   ===================================================================== */
.sv { font-family: "Helvetica Neue", Arial, sans-serif; color: #2b2d36; background: #f3f3f3; padding: 24px 16px 40px; }
.sv * { box-sizing: border-box; }
.sv a { color: #C2272D; }
.sv a:hover, .sv a:focus { color: #8f1c21; }

.sv-wrap { max-width: 1240px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 24px; align-items: flex-start; }
.sv-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }

/* Menu lateral */
.sv-nav { flex: 1 1 220px; background: #fff; border-radius: 6px; padding: 8px; display: flex; flex-direction: column; gap: 2px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.sv-nav-user { padding: 10px 14px 12px; border-bottom: 1px solid #eee; margin-bottom: 6px; font-size: 13px; color: #5c5f6b; line-height: 1.4; }
.sv-nav-user strong { display: block; font-size: 15px; color: #2b2d36; }
.sv-nav a, .sv-nav span.sv-nav-off { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 0 14px; border-radius: 4px; text-decoration: none; color: #3c4150; font-size: 15px; }
.sv-nav a:hover, .sv-nav a:focus { background: #f3f3f3; color: #2b2d36; text-decoration: none; }
.sv-nav a.activo { background: #C2272D; color: #fff; font-weight: 700; }
.sv-nav span.sv-nav-off { color: #7a7d88; cursor: default; }
.sv-pronto { font-size: 11px; font-weight: 700; background: #ececef; color: #4a4d58; border-radius: 10px; padding: 2px 8px; }
.sv-nav .sv-salir { margin-top: 6px; border-top: 1px solid #eee; border-radius: 0 0 4px 4px; }

/* Titulos */
.sv h1, .sv .sv-h1 { margin: 0; font-family: Impact, "Arial Narrow", sans-serif; font-weight: normal; font-size: 30px; color: #3c4150; letter-spacing: .3px; }
.sv h2, .sv .sv-h2 { margin: 0; font-family: Impact, "Arial Narrow", sans-serif; font-weight: normal; font-size: 22px; color: #3c4150; }
.sv-sub { margin: 4px 0 0; font-size: 15px; color: #5c5f6b; }

/* Tarjetas */
.sv-card { background: #fff; border-radius: 6px; padding: 20px; box-shadow: 0 1px 2px rgba(0,0,0,.08); display: flex; flex-direction: column; gap: 12px; }
.sv-row { display: flex; flex-wrap: wrap; gap: 16px; }
.sv-row > .sv-card { flex: 1 1 240px; }
.sv-kpi-label { margin: 0; font-size: 13px; font-weight: 700; color: #5c5f6b; text-transform: uppercase; letter-spacing: .5px; }
.sv-kpi { margin: 0; font-family: Impact, "Arial Narrow", sans-serif; font-size: 32px; color: #2b2d36; line-height: 1.1; }
.sv-kpi small { font-family: "Helvetica Neue", Arial, sans-serif; font-size: 14px; color: #5c5f6b; }
.sv-muted { margin: 0; font-size: 14px; color: #5c5f6b; }
.sv-barra { height: 8px; background: #e6e6ea; border-radius: 4px; overflow: hidden; }
.sv-barra > div { height: 8px; background: #515360; }

.sv-aviso { background: #fff8db; border: 1px solid #ebc511; border-radius: 6px; padding: 12px 16px; font-size: 15px; color: #4a3d00; }
.sv-ok { background: #e2f1e6; border: 1px solid #9ccaa8; border-radius: 6px; padding: 12px 16px; font-size: 15px; color: #1e5a2e; }
.sv-error { background: #fbe9ea; border: 1px solid #e3a3a6; border-radius: 6px; padding: 12px 16px; font-size: 15px; color: #7a1a1e; }

/* Botones */
.sv-btn, .sv a.sv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 0 18px; border-radius: 4px; border: 1px solid #C2272D; background: #C2272D; color: #fff; font-weight: 700; font-size: 15px; text-decoration: none; cursor: pointer; font-family: inherit; }
.sv-btn:hover, .sv a.sv-btn:hover { background: #a51f25; border-color: #a51f25; color: #fff; text-decoration: none; }
.sv-btn-2, .sv a.sv-btn-2 { background: #fff; color: #3c4150; border-color: #515360; }
.sv-btn-2:hover, .sv a.sv-btn-2:hover { background: #f3f3f3; color: #2b2d36; border-color: #515360; }
.sv-btn[disabled] { opacity: .6; cursor: default; }
.sv-btn-off { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border-radius: 4px; border: 1px dashed #b9bbc3; color: #6b6e7a; font-weight: 700; font-size: 15px; cursor: default; }

/* Formularios */
.sv-campo { display: flex; flex-direction: column; gap: 6px; flex: 1 1 220px; }
.sv-campo label { font-size: 14px; font-weight: 700; margin: 0; }
.sv-campo input, .sv-campo select, .sv-campo textarea { min-height: 44px; padding: 0 12px; border: 1px solid #8a8d98; border-radius: 4px; font-size: 16px; font-family: inherit; background: #fff; color: #2b2d36; }
.sv-campo input[readonly] { background: #f3f3f3; }

/* Tablas */
.sv-tabla-box { overflow-x: auto; }
.sv-tabla { width: 100%; border-collapse: collapse; font-size: 14px; }
.sv-tabla th { text-align: left; color: #5c5f6b; font-weight: 700; padding: 10px 8px; border-bottom: 2px solid #e6e6ea; white-space: nowrap; }
.sv-tabla td { padding: 10px 8px; border-bottom: 1px solid #eee; }
.sv-tabla tr:last-child td { border-bottom: 0; }
.sv-num { text-align: right !important; white-space: nowrap; }

/* Datos */
.sv-datos { margin: 0; display: flex; flex-wrap: wrap; gap: 14px 32px; font-size: 15px; }
.sv-datos > div { flex: 1 1 200px; }
.sv-datos dt { font-size: 13px; color: #5c5f6b; font-weight: normal; }
.sv-datos dd { margin: 2px 0 0; font-weight: 700; }
.sv-cajas { display: flex; flex-wrap: wrap; gap: 12px; }
.sv-caja { flex: 1 1 160px; background: #f3f3f3; border-radius: 4px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.sv-caja span { font-size: 13px; color: #5c5f6b; }
.sv-caja strong { font-size: 18px; }

/* Formularios (catalogo) */
.sv-filtros { display: flex; flex-wrap: wrap; gap: 8px; }
.sv-filtro { min-height: 44px; padding: 0 16px; border-radius: 22px; border: 1px solid #8a8d98; background: #fff; color: #3c4150; font-weight: 700; font-size: 14px; cursor: pointer; font-family: inherit; }
.sv-filtro.activo { background: #515360; border-color: #515360; color: #fff; }
.sv-grupo { padding: 0; gap: 0; }
.sv-grupo-head { padding: 18px 20px 10px; }
.sv-item { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; padding: 14px 20px; border-top: 1px solid #eee; }
.sv-item-txt { flex: 999 1 300px; display: flex; flex-direction: column; gap: 4px; }
.sv-item-txt strong { font-size: 15px; }
.sv-item-acc { flex: 1 1 200px; display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.sv-tag { display: inline-block; border-radius: 10px; padding: 1px 8px; font-size: 12px; font-weight: 700; margin-right: 6px; }
.sv-tag-notario { background: #fff8db; color: #4a3d00; border: 1px solid #ebc511; }

@media print {
  .sv-nav, .sv-noimprimir { display: none !important; }
  .sv { background: #fff; padding: 0; }
  .sv-card { box-shadow: none; border: 1px solid #ccc; }
}

/* Pagina de ingreso */
.sv-acceso { padding: 40px 16px 56px; }
.sv-acceso-wrap { max-width: 980px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 40px; align-items: center; justify-content: center; }
.sv-acceso-intro { flex: 1 1 340px; display: flex; flex-direction: column; gap: 14px; }
.sv-acceso-intro h1 { font-size: 40px; }
.sv-acceso-lead { margin: 0; font-size: 17px; line-height: 1.5; color: #4a4d58; }
.sv-acceso-intro ul { margin: 0; padding-left: 20px; font-size: 15px; line-height: 1.9; color: #4a4d58; }
.sv-acceso-card { flex: 0 1 420px; padding: 28px; gap: 14px; }
.sv-acceso-card .sv-campo { flex: none; }
.sv .sv-btn-cu, .sv a.sv-btn-cu { width: 100%; background: #0F69C4; border-color: #0F69C4; min-height: 48px; font-size: 16px; }
.sv .sv-btn-cu:hover, .sv a.sv-btn-cu:hover { background: #0b56a3; border-color: #0b56a3; }
.sv .sv-btn-cu[disabled] { background: #8a8d98; border-color: #8a8d98; opacity: 1; }
.sv-separador { display: flex; align-items: center; gap: 12px; color: #5c5f6b; font-size: 14px; }
.sv-separador::before, .sv-separador::after { content: ""; flex: 1 1 auto; height: 1px; background: #dcdde2; }
.sv-acceso-ayuda { background: #f3f3f3; border-radius: 4px; padding: 12px; line-height: 1.5; }

/* Formulario en linea */
.sv-form-layout { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-start; }
.sv-form-main { flex: 999 1 480px; min-width: 0; }
.sv-form-side { flex: 1 1 240px; }
.sv-form-campos { display: flex; flex-wrap: wrap; gap: 14px 16px; }
.sv-form-campos > .sv-campo { flex: 1 1 260px; }
.sv-form-campos > .sv-campo-opc, .sv-form-campos > .sv-campo-casilla, .sv-form-campos > .sv-form-sub, .sv-form-campos > .sv-form-nota { flex-basis: 100%; }
.sv-form-sub { margin: 10px 0 0; font-size: 16px; font-weight: 700; color: #3c4150; border-bottom: 1px solid #eee; padding-bottom: 6px; width: 100%; }
.sv-form-nota { margin: 0; }
.sv-campo-opc { border: 0; padding: 0; margin: 0; }
.sv-campo-opc legend { font-size: 14px; font-weight: 700; border: 0; margin: 0 0 6px; width: auto; }
.sv-opciones { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.sv-opcion { display: inline-flex; align-items: center; gap: 8px; font-weight: normal !important; min-height: 36px; font-size: 15px; margin: 0; }
.sv-opcion input { width: 18px; height: 18px; margin: 0; min-height: 0; }
.sv-req { color: #a51f25; }
.sv-campo textarea { min-height: 90px; padding: 10px 12px; }
.sv-firma { background: #f3f3f3; border-radius: 6px; padding: 14px 16px; font-size: 14px; line-height: 1.5; }
.sv-campo-error input, .sv-campo-error select, .sv-campo-error textarea { border-color: #a51f25 !important; }
.sv [data-mayus='1'] input { text-transform: uppercase; }
