@import url("bootstrap5.3/css/bootstrap.min.css");
@import url("bootstrap-icons/font/bootstrap-icons.min.css");




/* Inicio Nuevos Estilos 2024 */

.badge a {
  text-decoration: blink;
  color: #ffffff;
}

.m01 {

  max-width: 900px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}

.interroga {
  --bs-btn-padding-y: 0px;
  --bs-btn-padding-x: 4px;
  --bs-btn-font-size: 9px;
  --bs-btn-border-radius: var(--bs-border-radius-sm);
  border-radius: 25px;
  margin-top: 15px;
}


.m02 {

  max-width: 600px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}



.m03 {

  max-width: 500px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}

.marg01 {

  padding-right: 2px;

  padding-left: 2px;



}

.over01 {
  width: 100%;
  /*height: 450px;*/
  overflow: auto;
}

/* Contenedor con scroll estético reutilizable */
.scroll-premium {
  max-height: 400px;
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 5px;
}
.scroll-premium::-webkit-scrollbar {
  width: 6px;
}
.scroll-premium::-webkit-scrollbar-track {
  background: transparent;
}
.scroll-premium::-webkit-scrollbar-thumb {
  background: #cbd5e0;
  border-radius: 10px;
}
.scroll-premium::-webkit-scrollbar-thumb:hover {
  background: #a0aec0;
}



.active {
  color: #000 !important;
}



@use cssnext;



:root {

  --family1: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', sans-serif;

  --family2: 'Avenir Next', 'Segoe UI', 'Lucida Grande', sans-serif;

  --yellow: #FFC842;

  --break-sm: 32rem;

  --break-md: 48rem;

}



@custom-media --only-small (width <=32rem);



* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}

body {

  font-weight: 400;

  font-family: var(--family1);
  overflow-x: hidden;

}





td,
th {
  padding: .5rem;
}

th {
  text-align: center;
  /*font-weight: 400;*/
  font-size: .8rem;
}

td {
  /*font-family: var(--family2);
  text-align: center ;*/
}

.text-bg-secondary {
  margin: 2px 0px;
}



.table-margen {
  max-width: 1200px !important;

  margin: 1em auto 1em auto;

  display: table;

  float: none !important;

  text-align: center;

}



.table {

  width: 100%;

  padding: 1rem;

}



.table__heading {
  background: rgba(243, 243, 243, .85);
}



@media (--only-small) {

  .table__heading {
    display: none;
  }

  .table__content {

    display: block;

    padding: .5rem 0;

  }

  .table__row {

    margin: .25rem 1rem;

    padding: .5rem 0;

    display: block;

    border-bottom: 2px solid var(--yellow);

  }

  .table__content:before {

    content: attr(data-heading);

    display: inline-block;

    width: 5rem;

    margin-right: .5rem;

    color: #999;

    font-size: .75rem;

    font-weight: 700;

    font-family: var(--family1);

    text-transform: uppercase;

    letter-spacing: 2px;

  }

}



.contenido01 {

  background: #fff;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -moz-box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}



.titulos01 {

  background: linear-gradient(to bottom, #fff 0%, #e8e8e8 100%);

  border: 1px solid #ddd !important;

  text-align: center;

  font-weight: 600;

}





/* Fin Nuevos Estilos 2024 */



.titulos {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 14px;

  font-weight: bold;

  color: #333333;

}





.boton {

  font-style: normal;

  background-color: #337ab7;

  border-color: #2e6da4;

  border: 1px solid transparent;

  color: #fff;

  padding: 1px 5px;

  border-radius: 3px;

}



.textos_destacados {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 12px;

  font-weight: bold;

  color: #999999;

}

.celda_titulo {

  font-family: Verdana, Arial, Helvetica, sans-serif;

  font-size: 12px;

  font-weight: bold;

  text-transform: capitalize;

  background-color: #CCCCCC;

  text-align: center;

  vertical-align: middle;

  color: #666666;

  border-top-style: none;

  border-right-style: none;

  border-bottom-style: none;

  border-left-style: none;

}

.Celda_form {

  color: #666666;
  background-color: #ffffff;
  padding-left: .8em;
  border: 1px solid #e1e1e1;
  border-radius: 3px;
  padding: 5px 10px;

}

.celda_casillas {

  background-color: #CCCCCC;

  text-align: center;

  padding-top: 2px;

  padding-bottom: 2px;

}





/**** MVC *****/

body {

  font-size: 14px;

  font-family: Verdana, Arial, Helvetica, sans-serif;

  margin: 0;

  padding: 0;



}

a {

  text-decoration: underline;

  color: #3399ff;

}

a:hover {

  color: #A5A5A5;

}

h1 {

  font-size: 1.4em;

}

#headlogo {
  background-color: #ffffff;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 10px 0;
  border-bottom: 1px solid #e5e7eb;
}

nav#menuprinc {
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

nav#menuprinc ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

nav#menuprinc ul li {
  float: none;
}



table.estilo01 tbody {

  background: #000;
  border: 20px solid #fff0;
  border-radius: 8px;

}

table.estilo03 tbody {

  background: #000;
  border: 20px solid #fff0;
  border-radius: 8px;

}



table.estilo01,
table.estilo02 {

  max-width: 1250px;

  min-width: 370px;

  margin: 1em auto;

  /*border-collapse: collapse;*/

  /*overflow: hidden;*/

  border: 1px solid #EAEAEA;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}

table.estilo03 {

  width: 100%;

  margin: 1em auto;

  /*border-collapse: collapse;*/

  /*overflow: hidden;*/

  border: 1px solid #EAEAEA;

  border-radius: 8px;

  box-shadow: 0px 0px 20px #e4e4e4;

  -webkit-box-shadow: 0px 0px 20px #e4e4e4;

}

table.estilo01 tr:first-child,
table.estilo02 tr:first-child,
table.estilo03 tr:first-child {

  text-align: center;

  font-weight: bold;

  background: linear-gradient(to bottom, #fff 0%, #e8e8e8 100%);

  /*border: 1px solid #ddd !important;*/

}

table.estilo01 tr,
table.estilo02 tr,
table.estilo03 tr {

  background: #fff;

  font-size: 14px;

  text-align: left;

}

p {
  margin-top: .5rem;
  margin-bottom: .5rem;
}

table.estilo01 td,
table.estilo02 td,
table.estilo03 td {

  padding: 0em 0.5em 0.5em 0.5em;



}

.accordion-body {
  text-align: justify;
}


.row {
  margin-right: calc(0* var(--bs-gutter-x));
  margin-left: calc(0* var(--bs-gutter-x));
}


.coledit {

  width: 20%;

  text-align: center;

}





table.tareas,
table.tareaSinEnc {

  margin: 0 AUTO;

  border-collapse: separate;

  border-spacing: 2px;

}

.tareas tr:first-child {

  background: #EAEAEA !important;

}

.tareas tr:nth-child(2n+1),
.tareaSinEnc tr:nth-child(2n+1),
.estilo02 tr:nth-child(2n+1) {

  background: #F7F7F7;

}

.tareas td {}



table.tareaSinEnc {

  border: 1px solid #EAEAEA;

}

table.tareaSinEnc tr:first-child {

  text-align: inherit;

  font-weight: inherit;

  background: #F7F7F7;

}





.centrado-fila {

  text-align: center !important;

}



.texto_Alerta {

  color: #F00;

  font-weight: bold;

}



.celda_nombre {

  font-weight: bold;

}



ul.cajabuscador {

  float: left;

  min-width: 90px;

  vertical-align: top;

  list-style-type: none;

  margin: .1em;

}

ul.cajabuscador .boton {

  clear: both;

  display: block;

  margin: .5em;

}

ul.cajabuscador h1 {

  font-size: 1em;

  text-align: center;

  background-color: #ddd;

  width: 100%;

}



/*** Form ***/

form {

  clear: both;

}



#paginacion {

  font-size: 1em;

  margin: 1em auto;

  display: block;

  text-align: center;

  width: 90%;

}

#paginacion a {

  text-decoration: none;

}

#paginacion a:hover {

  color: #8bc021;

}



.black_overlay {

  display: none;

  position: absolute;

  top: 0%;

  left: 0%;

  width: 100%;

  height: 150%;

  background-color: #000000;

  z-index: 1001;

  -moz-opacity: 0.8;

  opacity: .80;

  filter: alpha(opacity=80);

}



.white_content {

  display: none;

  position: absolute;

  top: 15%;

  left: 25%;

  width: 50%;

  height: 30%;

  padding: 16px;

  border: 10px solid #FF0000;

  background-color: #FFFFFF;

  overflow: auto;

}

/* Inicio Modern Contract Cards */
body.modern-bg {
	background-color: #f7f9fc;
	font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
.modern-logo-container {
	background-color: #ffffff;
	text-align: center;
	padding: 25px 20px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
	margin-bottom: 40px;
	border-top: 5px solid var(--emp-color, #337ab7);
}
.modern-logo-container img {
	max-height: 80px;
	width: auto;
}
.modern-card {
	background: #ffffff;
	border-radius: 16px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
	border: 1px solid #eef1f6;
	width: 100%;
	max-width: 600px;
	margin: 0 auto 50px;
	overflow: hidden;
}
.modern-header {
	background-color: transparent;
	color: #1f2937;
	padding: 40px 30px 10px;
	text-align: center;
	font-weight: 800;
	font-size: 26px;
	letter-spacing: -0.5px;
}
.modern-subheader {
	text-align: center;
	color: #6b7280;
	font-size: 15px;
	padding: 0 40px;
	margin-bottom: 35px;
	line-height: 1.5;
}

/* --- Premium Design System --- */
.premium-body {
    background-color: #f3f4f6 !important;
}

.card-premium,
.table-premium,
.input-premium,
.btn-premium {
    font-family: 'Inter', sans-serif;
}

.card-premium {
    border: none !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.04) !important;
    border-radius: 10px !important;
    background-color: #ffffff;
    overflow: hidden;
}

.table-premium thead th {
    background-color: #f8f9fa;
    border-bottom: 2px solid #eee;
    color: #444;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.9rem;
    padding: 10px 15px !important;
}

.table-premium td {
    vertical-align: middle;
    padding: 5px 15px !important;
    font-size: 1rem;
    border-bottom: 1px solid #f3f4f6;
    background-color: #fff;
}

.table-premium .folder-row td {
    background-color: #f9fafb !important;
}

.table-premium .category-row:hover td {
    background-color: #fcfcfc;
}

.action-link, .btn-link-action {
    text-decoration: none !important;
    display: inline-flex;
    padding: 2px 6px;
    border-radius: 6px;
    transition: all 0.2s;
    font-size: 0.7rem;
}

.btn-link-action:hover {
    background-color: #f3f4f6;
}

.detail-link {
    text-decoration: none;
    color: #0d6efd;
    transition: all 0.2s;
}

.detail-link:hover {
    text-decoration: underline;
    opacity: 0.8;
}

.text-monto-positivo { color: #198754; font-weight: 600; }
.text-monto-negativo { color: #dc3545; font-weight: 600; }
.sticky-top-custom { position: sticky; top: 1rem; z-index: 100; }

.input-premium {
    border-radius: 12px !important;
    border: 1px solid #e5e7eb !important;
    padding: 12px 18px !important;
    font-size: 0.95rem !important;
    transition: all 0.2s !important;
}

.btn-premium {
    border-radius: 12px !important;
    font-weight: 600 !important;
    padding: 12px 32px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s !important;
    border: none;
}

.btn-premium:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1) !important;
}

.folder-icon-svg {
    margin-right: 12px;
}

.badge-premium {
    font-size: 0.75rem !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
}

.modern-body {
	padding: 0 45px 45px;
}
.modern-form-group {
	margin-bottom: 25px;
	text-align: left;
}
.modern-form-label {
	display: block;
	font-weight: 600;
	margin-bottom: 10px;
	color: #374151;
	font-size: 15px;
}
/* Mantener compatibilidad con inputs existentes en la interfaz moderna */
.modern-card .Celda_form {
	border: 1px solid #d1d5db;
	border-radius: 8px;
	padding: 15px 18px;
	width: 100%;
	font-size: 16px;
	color: #1f2937;
	background-color: #f9fafb;
	transition: all 0.2s;
	box-sizing: border-box;
}
.modern-card .Celda_form:focus {
	border-color: var(--emp-color, #337ab7);
	background-color: #ffffff;
	box-shadow: 0 0 0 3px rgba(51, 122, 183, 0.15);
	outline: none;
}
.modern-card .boton {
	background-color: var(--emp-color, #337ab7);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: 16px 24px;
	font-size: 18px;
	font-weight: 700;
	width: 100%;
	cursor: pointer;
	letter-spacing: 0.5px;
	transition: transform 0.1s, opacity 0.2s, box-shadow 0.2s;
	box-sizing: border-box;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}
.modern-card .boton:active {
	transform: scale(0.98);
}
.modern-card .boton:hover {
	opacity: 0.9;
	box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
}
/* Fin Modern Contract Cards */

.premium-footer {
    background-color: #ffffff;
    border-top: 1px solid #e5e7eb;
    padding: 20px 0;
    margin-top: 50px;
    width: 100%;
}

.premium-footer-content {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 15px;
    padding-right: 50px;
    font-size: 0.85rem;
    color: #6b7280;
    font-family: 'Inter', sans-serif;
}

/* Botón actualizar animación */
@keyframes spin-clockwise {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.btn-actualizar .bi-arrow-clockwise {
    display: inline-block !important;
    transition: transform 0.3s ease !important;
}
.btn-actualizar:not(.loading):hover .bi-arrow-clockwise {
    transform: rotate(180deg) !important;
}
.btn-actualizar.loading .bi-arrow-clockwise {
    animation: spin-clockwise 1s linear infinite !important;
}

/* Responsividad para Cartola Banco */
@media (max-width: 991.98px) {
    .border-mobile-none {
        border-left: none !important;
        border-right: none !important;
        border-top: 1px dashed #dee2e6 !important;
        border-bottom: 1px dashed #dee2e6 !important;
        padding-top: 15px !important;
        padding-bottom: 15px !important;
    }
}

@media (max-width: 767.98px) {
    .table-sm-mobile th,
    .table-sm-mobile td {
        padding: 8px 4px !important;
        font-size: 0.8rem !important;
    }
    .table-sm-mobile th {
        font-size: 0.75rem !important;
    }
    .table-sm-mobile .badge {
        font-size: 0.7rem !important;
        padding: 3px 6px !important;
    }
}

.fs-7 {
	font-size: 0.85rem !important;
	line-height: 1.45 !important;
}

/* Contenedor adaptativo para la tabla de agenda */
.agenda-table-container {
  max-height: max(300px, calc(100vh - 520px));
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: 5px;
}
.agenda-table-container::-webkit-scrollbar {
  width: 6px;
}
.agenda-table-container::-webkit-scrollbar-track {
  background: transparent;
}
.agenda-table-container::-webkit-scrollbar-thumb {
  background: #cbd5e0;
  border-radius: 10px;
}
.agenda-table-container::-webkit-scrollbar-thumb:hover {
  background: #a0aec0;
}

/* Drop zone para carga de archivos */
.drop-zone {
  border: 2px dashed #ced4da;
  transition: border-color 0.2s ease, background-color 0.2s ease;
  background-color: #f8f9fa;
  cursor: pointer;
}
.drop-zone.dragover {
  border-color: #0d6efd;
  background-color: #edf2f7;
}

/* Catálogo por vendedor */
.catalogo-contenedor { width: 100%; max-width: 1200px; }

/* CATALOGO_PDF_INICIO: estilos del documento, aislados de la aplicación */
@scope (.catalogo-pdf) {

400;500;600;700&family=Inter:wght@400;500&family=Space+Grotesk:wght@500;600;700&display=swap');

* { box-sizing:border-box; margin:0; padding:0;
    -webkit-print-color-adjust:exact!important; print-color-adjust:exact!important; }

:scope { margin:0; padding:0; font-family:Inter,Arial,sans-serif; color:var(--texto); width:297mm; }
a { text-decoration:none; color:inherit; }

/* ═══════════════════════════════════════
   PORTADA — Línea "Ritmo"
   Fondo navy con foto de bar difuminada, logo DSB centrado, tagline
   discreto bajo el logo, título Anton grande, y bloque destacado del
   ejecutivo abajo a la izquierda (personalizado por vendedor).
═══════════════════════════════════════ */
.cover {
  page-break-after:always;
  width:297mm; height:167mm;
  position:relative; overflow:hidden;
  background: linear-gradient(140deg, #163a63 0%, #0a2540 55%, #05121f 100%);
}
.cover-photo {
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0.75; mix-blend-mode:overlay;
}
.cover-veil {
  position:absolute; inset:0;
  background: radial-gradient(ellipse 60% 60% at 50% 45%, transparent, rgba(0,0,0,0.42));
}
.cover-pulse {
  position:absolute; left:50%; top:40%; transform:translate(-50%,-50%);
  width:70%; aspect-ratio:1; opacity:0.02; z-index:1; filter:blur(3px);
}

.cover-mark {
  position:absolute; left:50%; top:32%; transform:translate(-50%,-50%);
  width:130mm; height:auto; z-index:2;
  filter: drop-shadow(0 8px 22px rgba(0,0,0,0.6));
}
.cover-tagline {
  position:absolute; left:0; right:0; top:51%; text-align:center; z-index:3;
  color:rgba(227,216,194,0.55);
  font-family:'Space Grotesk',Arial,sans-serif;
  font-size:9px; font-weight:500; letter-spacing:8px; text-transform:uppercase;
}
.cover-title {
  position:absolute; left:0; right:0; top:63%; text-align:center; z-index:3;
  color:#e3d8c2; font-family:'Anton',Arial,sans-serif;
  font-size:44px; letter-spacing:4px; line-height:1;
  text-shadow: 0 4px 22px rgba(0,0,0,0.55);
}
.cover-tag {
  position:absolute; left:0; right:0; top:76%; text-align:center; z-index:3;
  color:#f5a623; font-family:'Space Grotesk',Arial,sans-serif;
  font-size:10px; letter-spacing:8px; text-transform:uppercase; font-weight:600;
}

/* Bloque vendedor — abajo a la izquierda, crece con el nombre */
.cover-seller {
  position:absolute; left:5%; bottom:60px; z-index:4;
  padding:7px 18px;
  background: rgba(200,151,46,0.10);
  border:1px solid rgba(200,151,46,0.42);
  border-radius:4px;
  display:inline-flex; align-items:center; gap:14px;
  width:max-content;
}
.cover-seller-lbl {
  font-family:'Space Grotesk',Arial,sans-serif; font-size:8px; letter-spacing:3.5px;
  text-transform:uppercase; color:#f5a623; font-weight:700;
  padding-right:12px; border-right:1px solid rgba(200,151,46,0.42);
  flex-shrink:0;
}
.cover-seller-info { display:flex; flex-direction:column; gap:4px; }
.cover-seller-name {
  font-family:'Space Grotesk',Arial,sans-serif; font-size:13px; letter-spacing:0.3px;
  color:#e3d8c2; font-weight:700; line-height:1.1; white-space:nowrap;
}
.cover-seller-tel {
  font-family:'Space Grotesk',Arial,sans-serif; font-size:10.5px; letter-spacing:1.2px;
  color:rgba(227,216,194,0.78); font-weight:500;
  display:flex; align-items:center; gap:6px; white-space:nowrap;
}
.cover-seller-tel svg { width:10px; height:10px; stroke:#f5a623; flex-shrink:0; }

/* Franja inferior: 3 features + iconos */
.cover-footer {
  position:absolute; left:0; right:0; bottom:0; padding:12px 4.5% 14px; z-index:4;
}
.cover-features {
  display:grid; grid-template-columns:1fr 1fr 1fr; align-items:stretch;
  border-top:1px solid rgba(200,151,46,0.4); padding-top:10px; gap:10px;
}
.cover-feature {
  display:flex; align-items:center; justify-content:center; gap:8px;
  color:rgba(255,255,255,0.85); font-size:10px; letter-spacing:0.4px;
  border-left:1px solid rgba(200,151,46,0.24); padding:0 12px;
}
.cover-feature:first-child { border-left:none; }
.cover-feature-icon { width:15px; height:15px; flex-shrink:0; }

/* ═══════════════════════════════════════
   ÍNDICE
═══════════════════════════════════════ */
.toc {
  page-break-after:always;
  width:297mm; height:calc(167mm - 32px);
  display:flex; flex-direction:column;
}
.toc-hdr { background:var(--navy); padding:16px 24px; border-bottom:3px solid var(--dorado); }
.toc-hdr-title {
  font-family:Montserrat,Arial,sans-serif; font-size:13px; font-weight:600;
  color:#fff; letter-spacing:7px; text-transform:uppercase;
}
.toc-:scope { flex:1; padding:14px 28px 18px; display:flex; align-items:flex-start; overflow:hidden; }
.toc-grid { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:0 36px; align-content:start; }
.toc-sc-row {
  display:flex; align-items:center; gap:8px; padding:3px 0; margin-top:8px;
  border-bottom:1.5px solid var(--borde);
}
.toc-sc-row:first-child { margin-top:0; }
.toc-sc-dot { width:9px; height:9px; border-radius:2px; flex-shrink:0; }
.toc-sc-name {
  font-family:Montserrat,Arial,sans-serif; font-size:10.5px; font-weight:700;
  color:var(--navy); text-transform:uppercase; letter-spacing:1.1px;
}
.toc-cat {
  font-size:8.5px; padding:1px 0 1px 17px;
  display:flex; justify-content:space-between; align-items:center; color:var(--texto);
}
.toc-pg { color:var(--dorado); font-weight:600; font-family:Montserrat,Arial,sans-serif; font-size:11px; margin-left:6px; white-space:nowrap; }
.toc-dots { flex:1; border-bottom:1px dotted var(--borde); margin:0 6px; min-width:8px; }

/* Botón "volver al índice" — círculo sutil, casi pegado al footer estampado */
.back-to-toc {
  position:absolute; bottom:1mm; right:5mm; z-index:5;
  width:7mm; height:7mm; border-radius:50%;
  background:rgba(200,151,46,0.12);
  border:0.75px solid rgba(200,151,46,0.4);
  display:flex; align-items:center; justify-content:center;
  color:rgba(200,151,46,0.75);
  text-decoration:none;
}
.back-to-toc svg { width:3.5mm; height:3.5mm; display:block; }
/* En páginas de listado (fondo blanco) el mismo botón necesita más contraste */
.chunk-wrap .back-to-toc {
  background:rgba(200,151,46,0.08);
  border-color:rgba(200,151,46,0.5);
  color:var(--dorado);
}

/* ═══════════════════════════════════════
   SPLASH SUPERCATEGORÍA — Línea "Ritmo"
   Fondo color de familia + foto temática difuminada, número gigante
   como marca de agua, nombre en Anton, chips de categorías en una fila.
═══════════════════════════════════════ */
.sc-splash {
  page-break-before:always; break-before:page; page-break-after:always;
  width:297mm; height:calc(167mm - 32px);
  position:relative; overflow:hidden;
}
/* Escena editorial de una sola foto (producto ya integrado al ambiente:
   sirviéndose, con hielo, garnish, cristalería). Toda la profundidad,
   reflejos y sombras vienen de la foto original. */
.sc-splash-ambient {
  position:absolute; inset:0; background-size:cover; background-position:center;
  filter: saturate(1.05) contrast(1.08) brightness(0.88);
}
/* Color wash sutil (opacity baja) — solo tiñe ligeramente hacia el color de
   la familia sin destruir la temperatura natural de la foto. */
.sc-splash-colorwash {
  position:absolute; inset:0; mix-blend-mode:color; opacity:0.22;
}
/* Overlay negro global — oscurece toda la escena para mood cinemático */
.sc-splash-darken {
  position:absolute; inset:0; background:rgba(0,0,0,0.32); z-index:1;
}
/* Veil direccional — oscurece extra el lado donde va el texto */
.sc-splash-veil {
  position:absolute; inset:0; z-index:1;
  background: linear-gradient(90deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.28) 46%, rgba(0,0,0,0.10) 100%);
}
.sc-splash.reverse .sc-splash-veil {
  background: linear-gradient(270deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.28) 46%, rgba(0,0,0,0.10) 100%);
}
/* Viñeta cinemática — oscurece los bordes para dar profundidad de escena */
.sc-splash-vignette {
  position:absolute; inset:0; pointer-events:none; z-index:2;
  background: radial-gradient(ellipse 100% 100% at 50% 50%, transparent 45%, rgba(0,0,0,0.55) 100%);
}
.sc-splash-num {
  position:absolute; right:-3%; top:-20%; z-index:1;
  font-family:'Anton',Arial,sans-serif;
  font-size:520px; line-height:0.8; color:rgba(0,0,0,0.32); user-select:none;
}
.sc-splash-pulse {
  position:absolute; right:8%; top:50%; transform:translateY(-50%);
  width:55%; aspect-ratio:1; opacity:0.04; z-index:1; filter:blur(2px);
}
.sc-splash-name {
  position:absolute; left:5%; right:5%; top:34%; z-index:3;
  color:#e3d8c2; font-family:'Anton',Arial,sans-serif;
  font-size:110px; line-height:0.88; letter-spacing:-0.01em;
  text-shadow: 0 4px 22px rgba(0,0,0,0.45);
}
.sc-splash-cats {
  position:absolute; left:5%; right:5%; top:74%; bottom:6%; z-index:3;
  display:grid; grid-template-columns:repeat(5,auto); gap:6px 6px;
  justify-content:start; align-content:flex-start; overflow:hidden;
}
.sc-splash.reverse .sc-splash-cats { justify-content:end; }
.sc-splash-chip {
  padding:3px 9px; border:1px solid rgba(227,216,194,0.55);
  border-radius:999px; color:#e3d8c2;
  font-family:'Space Grotesk',Arial,sans-serif; font-size:8px;
  letter-spacing:1.5px; text-transform:uppercase; font-weight:500;
  background: rgba(0,0,0,0.18); white-space:nowrap; flex-shrink:0;
}
/* Ritmo visual: cada 2ª supercategoría espeja la composición */
.sc-splash.reverse .sc-splash-num { left:-3%; right:auto; }
.sc-splash.reverse .sc-splash-pulse { right:auto; left:8%; }
.sc-splash.reverse .sc-splash-name { text-align:right; }
.sc-splash.reverse .sc-splash-cats { justify-content:flex-end; }

/* ═══════════════════════════════════════
   PÁGINAS DE PRODUCTO
═══════════════════════════════════════ */
.cat-start    { page-break-before:always; break-before:page; }
.forced-break { page-break-before:always; break-before:page; }

.chunk-wrap {
  position:relative;
  min-height:calc(167mm - 50px);
  padding-left:14mm;
}
.left-stripe {
  position:absolute; left:0; top:0;
  width:14mm;
  /* La franja vertical baja HASTA el borde inferior de la página,
     pasando por detrás del footer y de la strip horizontal. La strip
     horizontal arranca desde x=14mm para no tapar la vertical. */
  height:167mm;
  overflow:hidden;
  display:flex; align-items:flex-start; justify-content:center;
  padding-top:14px;
}
.stripe-label-wrap {
  overflow:hidden;
  max-height:calc(167mm - 50px - 28px);
  display:flex; align-items:flex-start; justify-content:center;
}
.stripe-label {
  display:block;
  writing-mode:vertical-rl; transform:rotate(180deg);
  font-family:Montserrat,Arial,sans-serif; font-size:17px; font-weight:700;
  letter-spacing:2.5px; color:rgba(255,255,255,0.88);
  text-transform:uppercase; white-space:nowrap; overflow:hidden;
}
.sub-hdr { padding:5px 12px; text-align:center; break-after:avoid; page-break-after:avoid; }
.sub-name {
  font-family:Montserrat,Arial,sans-serif; font-size:10.5px; font-weight:600;
  color:#fff; letter-spacing:2px; text-transform:uppercase;
}
.grid { display:grid; grid-template-columns:1fr 1fr 1fr; }
.cell {
  display:flex; align-items:center;
  min-height:104px; padding:7px 9px; gap:8px;
  border-bottom:1px solid var(--borde);
  break-inside:avoid; page-break-inside:avoid;
}
.cell:nth-child(6n+1),.cell:nth-child(6n+2),.cell:nth-child(6n+3) { background:#ffffff; }
.cell:nth-child(6n+4),.cell:nth-child(6n+5),.cell:nth-child(6n+6) { background:#f7f8fa; }
.cell:not(:nth-child(3n)) { border-right:1px solid var(--borde); }
.cell-img { width:72px; height:72px; flex-shrink:0; border:0.5px solid var(--borde); border-radius:4px; object-fit:contain; background:#fff; }
.cell-no-img { width:72px; height:72px; flex-shrink:0; background:#f7f8fa; border:0.5px solid var(--borde); border-radius:4px; }
.cell-info { flex:1; min-width:0; }
.cell-code { font-size:7px; color:var(--gris_txt); text-transform:uppercase; letter-spacing:.4px; margin-bottom:2px; }
.cell-desc { font-size:10px; font-weight:500; color:var(--texto); line-height:1.35; max-height:2.7em; overflow:hidden; }

/* ═══════════════════════════════════════
   CONTRAPORTADA — misma línea que la portada
═══════════════════════════════════════ */
.backcover {
  page-break-before:always; break-before:page;
  width:297mm; height:167mm;
  position:relative; overflow:hidden;
  background: linear-gradient(140deg, #163a63 0%, #0a2540 55%, #05121f 100%);
}
.backcover-title {
  position:absolute; left:0; right:0; top:63%; text-align:center; z-index:3;
  color:#e3d8c2; font-family:'Anton',Arial,sans-serif;
  font-size:44px; letter-spacing:4px; line-height:1;
  text-shadow: 0 4px 22px rgba(0,0,0,0.55);
}
.backcover-tag {
  position:absolute; left:0; right:0; top:76%; text-align:center; z-index:3;
  color:#f5a623; font-family:'Space Grotesk',Arial,sans-serif;
  font-size:10px; letter-spacing:8px; text-transform:uppercase; font-weight:600;
}

/* Mejoras editoriales: páginas completas, lectura y navegación en el propio HTML. */
.pdf-page { page:catalogo; width:297mm; height:167mm; position:relative; break-before:auto; break-after:page; break-inside:avoid; overflow:hidden; }
.pdf-page:last-of-type { break-after:auto; }
.cover, .backcover, .sc-splash, .toc, .cat-start, .forced-break { margin:0; }
.toc-body { flex:none; height:calc(167mm - 110px); }
.toc-cat { min-height:12px; }
.toc-sc-row { min-height:24px; }
.pdf-footer { position:absolute; bottom:0; left:0; width:100%; height:32px; border-top:1px solid var(--dorado); display:flex; align-items:center; justify-content:center; background:#fff; color:var(--gris_txt); font:7.5px Inter,Arial,sans-serif; z-index:10; padding:0 12px; gap:12px; }
.pdf-contacto { display:flex; align-items:center; gap:12px; white-space:nowrap; overflow:hidden; max-width:78%; }
.pdf-contacto > span { display:flex; align-items:center; gap:3px; }
.pdf-contacto svg { width:8.5px; height:8.5px; flex-shrink:0; fill:none; stroke:var(--dorado); stroke-width:1.6; }
.pdf-paginacion { white-space:nowrap; flex-shrink:0; }
.pdf-con-navegacion .pdf-footer { bottom:18px; left:14mm; width:283mm; }
.pdf-navegacion { position:absolute; bottom:0; left:14mm; width:283mm; height:18px; display:flex; z-index:10; }
.pdf-navegacion a { flex:1; display:flex; align-items:center; justify-content:center; font:6.5px Montserrat,Arial,sans-serif; color:white; text-transform:uppercase; }
.cell { height:104px; min-height:104px; }
.cell-desc { max-height:5.4em; line-height:1.35; overflow:hidden; }
.cell-no-img { display:flex; align-items:center; justify-content:center; color:var(--gris_txt); font-size:8px; }
.sub-hdr { background:var(--navy); }
.sub-name { color:var(--navy); }
.cover-seller { max-width:90%; }
.cover-seller-name { white-space:normal; }
.sc-splash-name { font-size:110px; }
.sc-splash-cats { bottom:40px; }
}
@page catalogo { size:297mm 167mm; margin:0; }
@font-face { font-family:Anton; src:url('__FUENTE_ANTON__') format('truetype'); font-weight:400; font-display:block; }
@font-face { font-family:Inter; src:url('__FUENTE_INTER__') format('truetype'); font-weight:100 900; font-display:block; }
@font-face { font-family:Montserrat; src:url('__FUENTE_MONTSERRAT__') format('truetype'); font-weight:100 900; font-display:block; }
@font-face { font-family:'Space Grotesk'; src:url('__FUENTE_SPACEGROTESK__') format('truetype'); font-weight:300 700; font-display:block; }
/* CATALOGO_PDF_FIN */

/* Ingreso manual de órdenes de entrega de productos. */
.productos-orden { width:100%; max-width:1200px; }
.productos-orden-observaciones { white-space:pre-wrap; }
.productos-orden-cantidad { min-width:8rem; }