/* Solo para pages/b2b_comparativa_productos.py (/cp-...). Manual de marca Lyseon v1.2.
   Todo acotado a #main_b2b_comparativa_productos: Dash carga assets/ global, esto no toca
   otras paginas. Las pildoras de pestañas usan .g2-pills de assets/cica2.css. */

#main_b2b_comparativa_productos {
  color: #333333;
  font-family: 'Open Sans', Arial, sans-serif;
}

/* tarjetas: blancas, borde 1px Line, radio 8px, sombra Navy suave */
#main_b2b_comparativa_productos .cp-card {
  background: #FFFFFF;
  border: 1px solid #DDDDDD;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 32, 91, .06);
  overflow: hidden;
}
#main_b2b_comparativa_productos .cp-main .card-body { padding: 12px; }

/* cabecera Navy con kicker naranja */
#main_b2b_comparativa_productos .cp-header {
  background: #00205B;
  border-bottom: none;
  padding: 16px 20px 12px;
}
#main_b2b_comparativa_productos .cp-kicker {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #FF5722;
}
#main_b2b_comparativa_productos .cp-titulo {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.4;
  color: #FFFFFF;
  margin: 8px 0 0;
}
/* cabecera de tarjeta secundaria (Actualizar PVP) */
#main_b2b_comparativa_productos .cp-header-sec {
  background: #E6E9EF;
  border-bottom: 1px solid #DDDDDD;
  padding: 10px 16px;
}
#main_b2b_comparativa_productos .cp-card-titulo {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #00205B;
  margin: 0;
}
#main_b2b_comparativa_productos .cp-card .card-body { padding: 12px; }
#main_b2b_comparativa_productos .cp-h6 {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #00205B;
}

/* etiquetas de filtros */
#main_b2b_comparativa_productos label,
#main_b2b_comparativa_productos .form-label {
  font-family: 'Open Sans', Arial, sans-serif;
  font-weight: 600;
  font-size: 12px;
  color: #333333;
  margin-bottom: 4px;
}
#main_b2b_comparativa_productos .form-control {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
  color: #333333;
  border: 1px solid #DDDDDD;
  border-radius: 4px;
}
#main_b2b_comparativa_productos .form-control:focus {
  border-color: #FF5722;
  box-shadow: 0 0 0 .2rem rgba(255, 87, 34, .2);
}
/* dcc.Dropdown (react-select v1) */
#main_b2b_comparativa_productos .Select-control {
  border: 1px solid #DDDDDD;
  border-radius: 4px;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
}
#main_b2b_comparativa_productos .Select.is-focused > .Select-control {
  border-color: #FF5722;
  box-shadow: none;
}
#main_b2b_comparativa_productos .Select-placeholder {
  font-weight: 400 !important;
  color: #888888;
}
#main_b2b_comparativa_productos .Select--multi .Select-value {
  background: #E6E9EF;
  border: 1px solid #DDDDDD;
  color: #00205B;
  border-radius: 4px;
}
#main_b2b_comparativa_productos .Select--multi .Select-value-icon {
  border-right: 1px solid #DDDDDD;
}

/* botones: Montserrat Bold, mayuscula, +0.06em, radio 4px.
   Primario = naranja con texto Navy (blanco sobre naranja no pasa AA bajo 19px). */
#main_b2b_comparativa_productos .cp-btn {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: 4px;
  padding: 6px 16px;
  box-shadow: none;
}
#main_b2b_comparativa_productos .cp-btn-primary {
  background: #FF5722 !important;
  border: 1px solid #FF5722 !important;
  color: #00205B !important;
}
#main_b2b_comparativa_productos .cp-btn-primary:hover {
  background: #DF3500 !important;
  border-color: #DF3500 !important;
  color: #FFFFFF !important;
}
#main_b2b_comparativa_productos .cp-btn-secondary {
  background: transparent !important;
  border: 1px solid #00205B !important;
  color: #00205B !important;
}
#main_b2b_comparativa_productos .cp-btn-secondary:hover {
  background: #001337 !important;
  border-color: #001337 !important;
  color: #FFFFFF !important;
}
#main_b2b_comparativa_productos .cp-btn:focus-visible {
  outline: 2px solid #FF5722;
  outline-offset: 2px;
}

/* ---- tablas: pisan assets/custom.css (global, con !important: 11px, centrado, hover naranja viejo) ---- */
#main_b2b_comparativa_productos .dash-table-container .dash-header {
  background-color: #00205B !important;
  color: #FFFFFF !important;
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700 !important;
  font-size: 11px !important;
  text-align: center !important;
  border: none !important;
  border-bottom: 2px solid #FF5722 !important;
  padding: 4px 6px !important;
}
#main_b2b_comparativa_productos .dash-table-container .dash-cell {
  font-family: 'Open Sans', Arial, sans-serif;
  font-weight: 400 !important;
  font-size: 11px !important;
  text-align: center !important;
  padding: 4px 6px !important;
  border: none !important;
  border-bottom: 1px solid #DDDDDD !important;
  color: #333333;
  max-width: none !important;
}
#main_b2b_comparativa_productos .dash-table-container .dash-cell .dash-cell-value {
  text-align: center !important;
}
#main_b2b_comparativa_productos .dash-table-container .dash-row-odd .dash-cell {
  background-color: #F4F6F8 !important;
}
#main_b2b_comparativa_productos .dash-table-container .dash-row:hover .dash-cell {
  background-color: #E6E9EF !important;
  color: #333333 !important;
  font-weight: 400 !important;
  cursor: default;
}
#main_b2b_comparativa_productos .dash-table-container .dash-row-selected .dash-cell {
  background-color: #FFEEE9 !important;
  color: #333333 !important;
  font-weight: 400 !important;
}
/* la fila de marca propia (Orange-10) no se pisa con el zebra */
#main_b2b_comparativa_productos .dash-table-container td[data-dash-column="Marca_Propia"] { font-weight: 600 !important; }
#main_b2b_comparativa_productos .dash-table-container .dash-spreadsheet-container .dash-spreadsheet-inner table {
  box-shadow: none;
  border-radius: 0;
}
/* paginacion */
#main_b2b_comparativa_productos .previous-next-container,
#main_b2b_comparativa_productos .page-number {
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
  color: #333333;
}

/* ---- dropdowns: pisan assets/custom.css (global, !important: borde naranja viejo, texto casi blanco) ---- */
#main_b2b_comparativa_productos .Select-control {
  background-color: #FFFFFF !important;
  border: 1px solid #DDDDDD !important;
  border-radius: 4px !important;
  color: #333333 !important;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
}
#main_b2b_comparativa_productos .Select.is-focused > .Select-control,
#main_b2b_comparativa_productos .Select-control:hover {
  border-color: #FF5722 !important;
}
#main_b2b_comparativa_productos .Select--single > .Select-control .Select-value,
#main_b2b_comparativa_productos .Select-value-label {
  color: #333333 !important;
}
#main_b2b_comparativa_productos .Select-placeholder {
  color: #888888 !important;
  font-weight: 400 !important;
}
#main_b2b_comparativa_productos .Select-menu-outer {
  background-color: #FFFFFF !important;
  border: 1px solid #DDDDDD !important;
  border-radius: 4px;
  box-shadow: 0 2px 10px rgba(0, 32, 91, .06);
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
}
#main_b2b_comparativa_productos .Select-option {
  background-color: #FFFFFF !important;
  color: #333333 !important;
}
#main_b2b_comparativa_productos .Select-option:hover,
#main_b2b_comparativa_productos .Select-option.is-focused {
  background-color: #E6E9EF !important;
  color: #00205B !important;
  font-weight: 600;
}
#main_b2b_comparativa_productos .Select-option.is-selected {
  background-color: #FFEEE9 !important;
  color: #333333 !important;
}
