/* ==========================================
   PLANNERPRO V3.1
   COTIZACIONES PREMIUM UI
   Scope: #commercialQuotesTab only
========================================== */

#commercialQuotesTab {
  background: #f4f6fb;
  padding: 22px;
  color: #111827;
}

#commercialQuotesContainer {
  display: grid !important;
  grid-template-columns: minmax(900px, 1fr) minmax(520px, 0.75fr) !important;
  gap: 24px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: none !important;
}


#commercialQuotesTab .form-card:first-child {
  grid-column: 1;
}

#commercialQuotesTab .form-card:nth-of-type(2) {
  grid-column: 2;
  position: sticky;
  top: 18px;
}

/* TITLES */
#commercialQuotesTab h2,
#commercialQuotesTab h3 {
  margin: 0 0 16px;
  color: #10182f;
  font-weight: 900;
  letter-spacing: -0.3px;
}

#commercialQuotesTab h2 {
  font-size: 23px;
}

#commercialQuotesTab h3 {
  font-size: 18px;
}

/* GENERAL FORM GRID */
#commercialQuotesTab .form-card:first-child {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
}

#commercialQuotesTab #quoteFormTitle {
  grid-column: 1 / -1;
}

/* INPUTS */
#commercialQuotesTab input,
#commercialQuotesTab select,
#commercialQuotesTab textarea {
  width: 100%;
  min-height: 44px;
  border: 1px solid #dce3ee;
  border-radius: 14px;
  background: #ffffff;
  color: #111827;
  font-size: 13px;
  padding: 0 13px;
  outline: none;
  transition: 0.18s ease;
  box-sizing: border-box;
}

#commercialQuotesTab textarea {
  min-height: 44px;
  padding: 11px 13px;
  resize: vertical;
  line-height: 1.25;
}

#commercialQuotesTab input:focus,
#commercialQuotesTab select:focus,
#commercialQuotesTab textarea:focus {
  border-color: #4f22c9;
  box-shadow: 0 0 0 4px rgba(79, 34, 201, 0.12);
}

/* CHECKBOX IVA */
#commercialQuotesTab label {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  color: #10182f;
  font-size: 14px;
  font-weight: 700;
}

#commercialQuotesTab input[type="checkbox"] {
  width: 18px;
  min-height: 18px;
  height: 18px;
  accent-color: #4f22c9;
  cursor: pointer;
}

/* NOTES */
#commercialQuotesTab #quote_notes {
  grid-column: span 2;
}

#commercialQuotesTab #quote_terms {
  grid-column: span 2;
}

/* DIVIDERS */
#commercialQuotesTab hr {
  grid-column: 1 / -1;
  border: none;
  border-top: 1px solid #e6ebf3;
  margin: 2px 0;
}

/* CONCEPTS TITLE */
#commercialQuotesTab .form-card:first-child > h3 {
  grid-column: 1 / -1;
  padding-top: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}

#commercialQuotesTab .form-card:first-child > h3::before {
  content: "🛒";
  width: 30px;
  height: 30px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #efe8ff;
}

/* CONCEPT INPUTS */
#commercialQuotesTab #item_category_id,
#commercialQuotesTab #item_product_id,
#commercialQuotesTab #item_sku_code,
#commercialQuotesTab #item_quantity,
#commercialQuotesTab #item_unit_price {
  min-height: 44px;
}

#commercialQuotesTab .quote-field-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 44px;
  font-size: 11px;
  font-weight: 700;
  color: #334155;
}

#commercialQuotesTab .quote-field-label input {
  width: 100%;
}

#commercialQuotesTab .quote-field-label select,
#commercialQuotesTab .quote-field-label textarea {
  width: 100%;
}

#commercialQuotesTab .quote-industrial-main-field:has(#quote_client_search) {
  grid-column: span 2;
}

#commercialQuotesTab .quote-industrial-textarea-field {
  grid-column: span 2;
}

#commercialQuotesTab .quote-concepts-capture {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  align-items: end;
}

#commercialQuotesTab .quote-industrial-label {
  display: none;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-label {
  display: block;
  margin: 0 0 2px;
  color: #334155;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-field-label {
  gap: 5px;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-main-field:has(#quote_client_search) {
  grid-column: span 2;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-textarea-field {
  grid-column: span 2;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-checkbox-field {
  align-items: flex-start;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-checkbox-field input {
  margin-top: 3px;
}

#commercialQuotesTab #item_description_text {
  grid-column: 1 / 4;
  min-height: 44px;
}

#commercialQuotesTab button[onclick="addQuoteItem()"] {
  grid-column: 4;
  min-height: 44px;
}

/* QUOTE ITEMS */
#commercialQuotesTab #quoteItemsBox {
  grid-column: 1 / -1;
}

/* EXPERIENCES */
#commercialQuotesTab .quote-experiences-panel {
  grid-column: 1 / -1;
  margin-top: 2px;
  padding: 18px;
  border: 1px solid #cbbcff;
  border-radius: 22px;
  background: linear-gradient(180deg, #fbf9ff 0%, #ffffff 100%);
  box-shadow: inset 0 0 0 1px rgba(79, 34, 201, 0.04);
}

#commercialQuotesTab .quote-experiences-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

#commercialQuotesTab .quote-experiences-header h3 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 9px;
}

#commercialQuotesTab .quote-experiences-header h3::before {
  content: "⭐";
  width: 30px;
  height: 30px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #efe8ff;
}

#commercialQuotesTab .quote-experiences-badge {
  background: #efe8ff;
  color: #4f22c9;
  font-size: 12px;
  font-weight: 900;
  border-radius: 999px;
  padding: 7px 12px;
}

#commercialQuotesTab .quote-experiences-help {
  margin: 0 0 14px;
  color: #667085;
  font-size: 13px;
}

#commercialQuotesTab .quote-experiences-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 14px;
}

#commercialQuotesTab .quote-experience-card {
  background: #ffffff;
  border: 1px solid #e5e9f2;
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
  transition: 0.18s ease;
}

#commercialQuotesTab .quote-experience-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
}

#commercialQuotesTab .quote-experience-checkbox {
  display: flex;
  gap: 9px;
  align-items: center;
  min-height: auto;
  margin: 0 0 8px;
  font-weight: 900;
  color: #10182f;
}

#commercialQuotesTab .quote-experience-card p {
  margin: 0 0 10px;
  min-height: 34px;
  color: #667085;
  font-size: 12px;
  line-height: 1.35;
}

#commercialQuotesTab .quote-experience-card strong {
  color: #4f22c9;
  font-size: 15px;
  font-weight: 900;
}

#commercialQuotesTab .quote-experience-empty {
  grid-column: 1 / -1;
  padding: 16px;
  background: #ffffff;
  border: 1px dashed #c9d2e3;
  border-radius: 16px;
  color: #667085;
  font-size: 13px;
}

/* SAVE BUTTONS */
#commercialQuotesTab #quoteSaveBtn {
  grid-column: 1;
}

#commercialQuotesTab button[onclick="clearQuoteForm()"] {
  grid-column: 2;
}

/* BUTTONS */
#commercialQuotesTab button {
  min-height: 44px;
  border: none;
  border-radius: 14px;
  padding: 0 18px;
  background: linear-gradient(135deg, #1b2a4a, #121a33);
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  transition: 0.18s ease;
  box-shadow: 0 10px 22px rgba(18, 26, 51, 0.20);
}

#commercialQuotesTab button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(18, 26, 51, 0.28);
}

/* SEARCH CARD */
#commercialQuotesTab .form-card:nth-of-type(2) {
  display: grid;
  gap: 12px;
}

#commercialQuotesTab .form-card:nth-of-type(2) h3 {
  margin-bottom: 2px;
}

#commercialQuotesTab #quotesSearchInput,
#commercialQuotesTab #quote_filter_status {
  min-height: 44px;
}

/* LIST BOX ON RIGHT */
#commercialQuotesTab #quotesListBox {
  grid-column: 2;
  background: #ffffff;
  border: 1px solid #e5e9f2;
  border-radius: 22px;
  padding: 16px;
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.08);
}

/* QUOTE CARDS */
#commercialQuotesTab .quotes-grid {
  grid-template-columns: 1fr !important;
}

#commercialQuotesTab .quote-card {
  border-radius: 18px;
  border: 1px solid #e8edf5;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.07);
}

#commercialQuotesTab .quote-actions,
#commercialQuotesTab .quote-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

#commercialQuotesTab .quote-actions button,
#commercialQuotesTab .quote-card-actions button {
  min-height: 34px;
  padding: 0 11px;
  border-radius: 10px;
  font-size: 11px;
}

/* RESPONSIVE */
@media (max-width: 1180px) {
  #commercialQuotesContainer {
    grid-template-columns: 1fr;
  }

  #commercialQuotesTab .form-card:first-child,
  #commercialQuotesTab .form-card:nth-of-type(2),
  #commercialQuotesTab #quotesListBox {
    grid-column: 1;
    position: static;
  }
}

@media (max-width: 850px) {
  #commercialQuotesTab .form-card:first-child {
    grid-template-columns: 1fr;
  }

  #commercialQuotesTab #quote_notes,
  #commercialQuotesTab #quote_terms,
  #commercialQuotesTab #item_description_text,
  #commercialQuotesTab button[onclick="addQuoteItem()"],
  #commercialQuotesTab #quoteSaveBtn,
  #commercialQuotesTab button[onclick="clearQuoteForm()"] {
    grid-column: 1;
  }

  #commercialQuotesTab .quote-experiences-grid {
    grid-template-columns: 1fr;
  }
}

#commercialQuotesTab .form-card {
  width: 1100px !important;
  max-width: 1100px !important;
  min-width: 1100px !important;
}

/* ==================================================
   COTIZACIONES — FORMULARIO IZQUIERDA / LISTADO DERECHA
================================================== */

#commercialQuotesContainer {
    display: grid !important;
    grid-template-columns: 430px minmax(0, 1fr) !important;
    gap: 28px !important;
    align-items: start !important;
    width: 100% !important;
}



.quotes-list-section {
    width: 100% !important;
    min-width: 0 !important;
}

.quotes-toolbar {
    width: 100% !important;
    margin-bottom: 18px !important;
}

.quotes-toolbar h3 {
    margin: 0 0 14px 0 !important;
    text-align: left !important;
}

.quotes-toolbar-row {
    display: grid !important;
    grid-template-columns: 1fr 220px !important;
    gap: 12px !important;
    width: 100% !important;
}

#quotesSearchInput,
#quote_filter_status {
    width: 100% !important;
}

#quotesListBox {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(220px, 1fr)) !important;
    gap: 18px !important;
    width: 100% !important;
    align-items: start !important;
}

#quotesListBox > * {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

#commercialQuotesContainer{
    display:flex !important;
    flex-direction:row !important;
    align-items:flex-start !important;
    gap:28px !important;
    width:100% !important;
    max-width:none !important;
}

/* =========================================
   FORMULARIO IZQUIERDO
========================================= */



/* =========================================
   PANEL DERECHO
========================================= */

.quotes-list-section{
    flex:1 !important;
    width:100% !important;
    min-width:0 !important;
}

/* =========================================
   TOOLBAR
========================================= */

.quotes-toolbar-row{
    display:flex !important;
    flex-direction:row !important;
    gap:12px !important;
    width:100% !important;
}

#quotesSearchInput{
    flex:1 !important;
}

#quote_filter_status{
    width:220px !important;
    min-width:220px !important;
}

/* =========================================
   GRID HORIZONTAL
========================================= */

#quotesListBox{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(260px,1fr)) !important;
    gap:18px !important;
    align-items:start !important;
    width:100% !important;
}

/* cards */
#quotesListBox > *{
    width:100% !important;
    margin:0 !important;
    max-width:none !important;
}

/* FIX LISTADO COTIZACIONES EN HORIZONTAL */

#quotesListBox {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(240px, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
}

#quotesListBox > * {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* ==================================================
   FIX URGENTE — RESTAURAR COTIZACIONES SIN ROMPER UI
================================================== */

#commercialQuotesContainer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 420px !important;
  gap: 22px !important;
  align-items: start !important;
}

#commercialQuotesTab .form-card:first-child {
  grid-column: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}

.quotes-list-section {
  grid-column: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
}

#quotesListBox {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  width: 100% !important;
}

#quotesListBox > * {
  width: 100% !important;
  max-width: none !important;
}

/* ==================================================
   FIX REAL — RECUPERAR LAYOUT ENTERPRISE
================================================== */

#commercialQuotesContainer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 380px !important;
  gap: 24px !important;
  align-items: start !important;
}

/* FORMULARIO */

#commercialQuotesTab .form-card:first-child {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

/* PANEL DERECHO */

.quotes-list-section {
  grid-column: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* BUSCADOR */

.quotes-toolbar-row {
  display: flex !important;
  gap: 12px !important;
  align-items: center !important;
}

#quotesSearchInput {
  flex: 1 !important;
}

#quote_filter_status {
  width: 180px !important;
}

/* LISTADO */

#quotesListBox {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* ==================================================
   FIX REAL COTIZACIONES ENTERPRISE
================================================== */

#commercialQuotesContainer {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 380px !important;
  gap: 24px !important;
  align-items: start !important;
}

.quotes-list-section {
  width: 100% !important;
  min-width: 0 !important;
}

.quotes-toolbar-row {
  display: flex !important;
  gap: 12px !important;
}

#quotesSearchInput {
  flex: 1 !important;
}

#quote_filter_status {
  width: 180px !important;
}

#quotesListBox {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(240px, 1fr)) !important;
  gap: 18px !important;
}


/* ==================================================
   FIX REAL — CARDS DE COTIZACIONES EN HORIZONTAL
================================================== */

#commercialQuotesTab #quotesListBox {
  width: 100% !important;
  min-width: 0 !important;
}

#commercialQuotesTab #quotesListBox .quotes-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(240px, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  align-items: start !important;
}

#commercialQuotesTab #quotesListBox .quote-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* ==================================================
   FIX — AMPLIAR FORMULARIO Y MANTENER LISTADO DERECHA
================================================== */

#commercialQuotesContainer {
  display: grid !important;
  grid-template-columns: minmax(720px, 1fr) minmax(620px, 0.9fr) !important;
  gap: 24px !important;
  align-items: start !important;
  width: 100% !important;
}

#commercialQuotesTab .form-card:first-child {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.quotes-list-section {
  width: 100% !important;
  min-width: 0 !important;
}

/* FIX — ANCHO REAL NUEVA COTIZACIÓN */

#commercialQuotesTab .form-card:first-child {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}

/* ==================================================
   FIX FINAL REAL — EXPANDIR ÁREA COMPLETA
================================================== */

#commercialQuotesTab {
  width: 100% !important;
  max-width: none !important;
}

#commercialQuotesContainer {
  width: 100% !important;
  max-width: none !important;
}

/* CONTENEDOR GLOBAL APP */

.main-content,
.content-area,
.module-content,
#mainContent,
#commercialContainer {
  width: 100% !important;
  max-width: none !important;
}

/* FORMULARIO */

#commercialQuotesTab .form-card:first-child {
  width: 100% !important;
  max-width: none !important;

  grid-template-columns:
    repeat(4, minmax(220px, 1fr)) !important;
}

/* LISTADO */

#commercialQuotesTab #quotesListBox .quotes-grid {
  display: grid !important;

  grid-template-columns:
    repeat(4, minmax(240px, 1fr)) !important;

  gap: 18px !important;
}

/* ==================================================
   FIX — RECUPERAR FONDO PREMIUM COTIZACIONES
================================================== */

#commercialQuotesTab {
  background: #f4f6fb !important;
  border-radius: 22px !important;
  padding: 28px !important;
}

#commercialQuotesContainer {
  background: transparent !important;
}

#commercialQuotesTab .form-card,
#commercialQuotesTab .quotes-list-section,
#commercialQuotesTab #quotesListBox {
  background: transparent !important;
}

/* ==================================================
   BUSCADOR COTIZACIONES IZQUIERDA
================================================== */

#commercialQuotesTab .quotes-toolbar {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

#commercialQuotesTab .quotes-toolbar h3 {
  width: 100% !important;
  text-align: left !important;
  margin-bottom: 12px !important;
}

#commercialQuotesTab .quotes-toolbar-row {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
}

#commercialQuotesTab .quotes-toolbar-row input {
  width: 520px !important;
  max-width: 520px !important;
}

#commercialQuotesTab .quotes-toolbar-row select {
  width: 220px !important;
  max-width: 220px !important;
}

#commercialQuotesContainer {
  display: flex !important;
  flex-direction: column !important;

  width: 100% !important;
  max-width: none !important;

  gap: 28px !important;
}

/* ==================================================
   FIX — MOSTRAR BOTÓN / CHECK DE EXPERIENCIAS
================================================== */

#commercialQuotesTab .quote-experiences-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  width: fit-content !important;
  min-height: 42px !important;
  margin: 10px 0 14px 0 !important;
  padding: 10px 14px !important;
  background: #efe8ff !important;
  color: #4f22c9 !important;
  border-radius: 999px !important;
  font-weight: 900 !important;
  cursor: pointer !important;
}

#commercialQuotesTab .quote-experiences-toggle input {
  display: inline-block !important;
  width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 !important;
  accent-color: #4f22c9 !important;
}

/* ==========================================
   COTIZACIONES CRM GRID V1
========================================== */

.quotes-grid-header,
.quotes-grid-row {
    grid-template-columns:
        110px
        minmax(160px, 1.2fr)
        minmax(140px, 1fr)
        110px
        120px
        120px
        minmax(260px, 300px);
}

.crm-grid-wrapper {
    width: 100%;
    overflow-x: auto;
}

.quote-grid-actions {
    gap: 6px;
    flex-wrap: nowrap;
    min-width: 260px;
}

.quote-grid-actions button {
    width: 32px;
    height: 32px;
    padding: 0;
    flex: 0 0 auto;
}

.compact-status-select {
    width: 105px;
    height: 32px;
    font-size: 12px;
    padding: 4px;
}

/* ==================================================
   COTIZACIONES CRM GRID — FIX FORMATO FINAL
================================================== */

#commercialQuotesContainer {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: none !important;
  gap: 28px !important;
}

#commercialQuotesTab .quotes-list-section {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab .crm-grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
  background: #ffffff !important;
  border: 1px solid #e5e9f2 !important;
  border-radius: 18px !important;
}

#commercialQuotesTab .quotes-grid-header,
#commercialQuotesTab .quotes-grid-row {
  display: grid !important;
  grid-template-columns:
    110px
    minmax(180px, 1.2fr)
    minmax(200px, 1.4fr)
    120px
    130px
    130px
    220px !important;
  align-items: center !important;
  min-width: 1120px !important;
}

#commercialQuotesTab .quotes-grid-header > div,
#commercialQuotesTab .quotes-grid-row > div {
  padding: 14px 12px !important;
  border-bottom: 1px solid #e5e9f2 !important;
  font-size: 13px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#commercialQuotesTab .quotes-grid-header {
  background: #f8fafc !important;
  font-weight: 900 !important;
  color: #10182f !important;
}

#commercialQuotesTab .quotes-grid-row {
  background: #ffffff !important;
}

#commercialQuotesTab .quotes-grid-row:hover {
  background: #f4f6fb !important;
}

#commercialQuotesTab .quote-grid-actions {
  display: flex !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
}

#commercialQuotesTab .quote-grid-actions button {
  width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  border-radius: 10px !important;
  font-size: 12px !important;
}

#commercialQuotesTab .compact-status-select {
  width: 115px !important;
  min-width: 115px !important;
  height: 32px !important;
  min-height: 32px !important;
  font-size: 12px !important;
  padding: 4px 8px !important;
}

/* FIX DURO — ANCHO CRM GRID COTIZACIONES */

#commercialQuotesTab,
#commercialQuotesContainer,
#commercialQuotesContainer > div,
#commercialQuotesTab .quotes-list-section,
#quotesListBox {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#quotesListBox {
  display: block !important;
}

#quotesListBox .crm-grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  display: block !important;
  overflow-x: auto !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  width: 100% !important;
  min-width: 1120px !important;
  display: grid !important;
  grid-template-columns:
    110px
    190px
    230px
    130px
    130px
    140px
    220px !important;
}
.quotes-grid-header > div {
  cursor: pointer;
  user-select: none;
}

/* FIX SELECT ESTATUS COTIZACIONES */

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select {
  appearance: auto !important;
  -webkit-appearance: menulist !important;
  -moz-appearance: menulist !important;

  display: inline-block !important;

  width: 135px !important;
  min-width: 135px !important;
  height: 34px !important;

  padding: 5px 28px 5px 8px !important;

  background-color: #ffffff !important;
  color: #111827 !important;

  border: 1px solid #cbd5e1 !important;
  border-radius: 10px !important;

  cursor: pointer !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

/* ==========================================
   COTIZACIONES CRM GRID V1 — FINAL
========================================== */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  display: grid !important;

  grid-template-columns:
    110px
    190px
    230px
    130px
    130px
    300px
    170px !important;

  align-items: center !important;
}

#quotesListBox .crm-grid-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: auto !important;
}

#quotesListBox .quote-grid-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  min-width: 220px !important;
}

#quotesListBox .quote-grid-actions button {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
}

#quotesListBox .quote-status-column {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

#quotesListBox .compact-status-select {
  width: 140px !important;
  min-width: 140px !important;
  height: 34px !important;
  font-size: 12px !important;
  padding: 4px 8px !important;
}

/* FIX BOTÓN ELIMINAR EN CRM GRID COTIZACIONES */

#quotesListBox .quote-grid-actions {
  width: 240px !important;
  min-width: 240px !important;
}

#quotesListBox .quote-grid-actions .danger-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;

  flex: 0 0 32px !important;

  visibility: visible !important;
  opacity: 1 !important;
}

/* FIX FINAL ACCIONES COTIZACIONES */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns:
    110px
    190px
    230px
    130px
    130px
    300px
    170px !important;
}

#quotesListBox .quote-grid-actions {
  width: 280px !important;
  min-width: 280px !important;
  max-width: none !important;
  overflow: visible !important;
  gap: 10px !important;
}

#quotesListBox .quote-grid-actions button {
  flex: 0 0 32px !important;
}

/* ==========================================
   COTIZACIONES COMPACT V1
========================================== */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns:
    96px
    170px
    150px
    112px
    116px
    188px
    126px !important;
  min-width: 958px !important;
}

#commercialQuotesTab .quotes-grid-header > div,
#commercialQuotesTab .quotes-grid-row > div,
#quotesListBox .quotes-grid-header > div,
#quotesListBox .quotes-grid-row > div {
  padding: 8px 7px !important;
  font-size: 12px !important;
}

#quotesListBox .quote-event-cell {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#quotesListBox .quote-status-column {
  min-width: 0 !important;
}

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select,
#commercialQuotesTab .compact-status-select {
  width: 112px !important;
  min-width: 112px !important;
  height: 28px !important;
  min-height: 28px !important;
  padding: 3px 22px 3px 6px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
}

#quotesListBox .quote-grid-actions {
  width: 178px !important;
  min-width: 178px !important;
  gap: 4px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 27px !important;
  min-width: 27px !important;
  height: 27px !important;
  min-height: 27px !important;
  flex: 0 0 27px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
}

/* ==========================================
   COTIZACIONES COMPACT V2
========================================== */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns:
    88px
    150px
    112px
    96px
    104px
    146px
    102px !important;
  min-width: 798px !important;
}

#commercialQuotesTab .quotes-grid-header > div,
#commercialQuotesTab .quotes-grid-row > div,
#quotesListBox .quotes-grid-header > div,
#quotesListBox .quotes-grid-row > div {
  padding: 6px 5px !important;
  font-size: 11px !important;
}

#quotesListBox .quote-event-cell {
  max-width: 112px !important;
}

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select,
#commercialQuotesTab .compact-status-select {
  width: 94px !important;
  min-width: 94px !important;
  height: 25px !important;
  min-height: 25px !important;
  padding: 2px 18px 2px 5px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
}

/* ==========================================
   COTIZACIONES GLOBAL V1
========================================== */

#commercialQuotesTab #commercialQuotesContainer {
  display: block !important;
}

#commercialQuotesTab #quoteGlobalPanel {
  width: 100% !important;
  min-width: 0 !important;
}

#commercialQuotesTab #quoteFormPanel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab .quotes-global-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 12px !important;
}

#commercialQuotesTab .quotes-global-header h2 {
  margin: 0 0 3px !important;
  font-size: 22px !important;
}

#commercialQuotesTab .quotes-global-header p {
  margin: 0 !important;
  color: #667085 !important;
  font-size: 13px !important;
}

#commercialQuotesTab .quotes-mini-dashboard {
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card {
  border-radius: 8px !important;
  padding: 9px 10px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: auto !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 5px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span,
#commercialQuotesTab .quotes-mini-dashboard-card.main small,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  color: inherit !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card strong,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 14px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card span {
  margin-bottom: 3px !important;
}

#commercialQuotesTab .quotes-toolbar-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 150px !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
}

#commercialQuotesTab #quote_filter_status {
  width: 150px !important;
  min-width: 150px !important;
}

#commercialQuotesTab .quotes-list-section h3 {
  margin: 0 0 8px !important;
  font-size: 15px !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns:
    78px
    150px
    96px
    86px
    96px
    124px
    88px !important;
  min-width: 718px !important;
}

#quotesListBox .quote-event-cell {
  max-width: 96px !important;
}

#quotesListBox .quote-grid-actions {
  width: 124px !important;
  min-width: 124px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 2px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  flex: 0 0 22px !important;
  padding: 0 !important;
  border-radius: 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select,
#commercialQuotesTab .compact-status-select {
  width: 82px !important;
  min-width: 82px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 2px 16px 2px 4px !important;
  border-radius: 5px !important;
  font-size: 9px !important;
}

#commercialQuotesTab .quote-back-btn {
  grid-column: 1 / -1 !important;
  width: fit-content !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

/* ==========================================
   COTIZACIONES GLOBAL V1 - FINAL OVERRIDE
========================================== */

#commercialQuotesTab #commercialQuotesContainer {
  display: block !important;
  grid-template-columns: none !important;
}

#commercialQuotesTab #quoteFormPanel[style*="display: none"],
#commercialQuotesTab #quoteFormPanel[style*="display:none"] {
  display: none !important;
}

#commercialQuotesTab #quoteFormPanel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab #quoteGlobalPanel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab .quotes-mini-dashboard {
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card {
  border-radius: 8px !important;
  padding: 9px 10px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: auto !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 5px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span,
#commercialQuotesTab .quotes-mini-dashboard-card.main small,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  color: inherit !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card strong,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 14px !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 78px 150px 96px 86px 96px 124px 88px !important;
  min-width: 718px !important;
}

#quotesListBox .quote-grid-actions {
  width: 124px !important;
  min-width: 124px !important;
  gap: 2px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  flex: 0 0 22px !important;
  padding: 0 !important;
  border-radius: 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

#commercialQuotesTab .compact-status-select {
  width: 82px !important;
  min-width: 82px !important;
  height: 24px !important;
  min-height: 24px !important;
  font-size: 9px !important;
}

/* ==========================================
   DASHBOARD COTIZACIONES V1.2
========================================== */

#commercialQuotesTab .quotes-mini-dashboard {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: 1 / -1 !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 6px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 28px !important;
  line-height: 1.1 !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span {
  font-size: 13px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card:not(.main) {
  min-height: 62px !important;
  padding: 10px 11px !important;
}

/* ==========================================
   COTIZACIONES GRID ACCIONES FINAL
========================================== */

#quotesListBox .crm-grid-wrapper {
  overflow-x: visible !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 70px 126px minmax(130px, 1fr) 78px 82px 148px 104px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#commercialQuotesTab .quotes-grid-header > div,
#commercialQuotesTab .quotes-grid-row > div,
#quotesListBox .quotes-grid-header > div,
#quotesListBox .quotes-grid-row > div {
  min-width: 0 !important;
}

#quotesListBox .quotes-grid-header > div:nth-child(6),
#quotesListBox .quotes-grid-row > div:nth-child(6),
#quotesListBox .quote-grid-actions {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#quotesListBox .quote-grid-actions {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 5px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

/* ==========================================
   COTIZACIONES GLOBAL GRID V1.2 FINAL
========================================== */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 70px 126px minmax(130px, 1fr) 78px 82px 148px 104px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#quotesListBox .quote-event-cell {
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#quotesListBox .quote-grid-actions {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
}

#quotesListBox .quote-status-column {
  overflow: visible !important;
  min-width: 104px !important;
}

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select,
#commercialQuotesTab .compact-status-select {
  width: 100px !important;
  min-width: 100px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 2px 20px 2px 5px !important;
  font-size: 9px !important;
  border-radius: 5px !important;
}

/* ==========================================
   COTIZACIONES DASHBOARD MAIN CARD BALANCE
========================================== */

#commercialQuotesTab .quotes-mini-dashboard-card.main .quote-dashboard-equivalent {
  display: block;
  margin-top: 14px !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  line-height: 1.25;
  color: #0f172a !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main .quote-dashboard-equivalent-words {
  display: block;
  max-width: 620px;
  margin-top: 7px !important;
  font-size: 11.5px !important;
  font-weight: 500 !important;
  line-height: 1.42 !important;
  letter-spacing: 0;
  color: #64748b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main .quote-dashboard-equivalent-words span {
  display: block;
  margin: 0;
  color: inherit;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main .quote-dashboard-count {
  display: block;
  margin-top: 13px !important;
  font-size: 11px;
  font-weight: 500;
  color: #64748b !important;
}

/* ==========================================
   COTIZACIONES UX — CLIENTE BUSCABLE / ACCIONES / EXPERIENCIAS
========================================== */

#commercialQuotesTab #quote_client_id[hidden],
#commercialQuotesTab #quoteExperiencesPanel[hidden] {
  display: none !important;
}

#commercialQuotesTab .quote-form-actions-bar {
  grid-column: 1 / -1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 8px 0 12px !important;
  border-bottom: 1px solid #e5e9f2 !important;
}

#commercialQuotesTab .quote-form-actions-bar button,
#commercialQuotesTab .quote-form-actions-bar #quoteSaveBtn,
#commercialQuotesTab .quote-form-actions-bar .quote-back-btn {
  grid-column: auto !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 14px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  box-shadow: none !important;
}

#commercialQuotesTab .quote-form-actions-bar #quoteSaveBtn {
  background: #0f172a !important;
}

#commercialQuotesTab .quote-final-actions-bar {
  grid-column: 1 / -1 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  padding-top: 14px !important;
  margin-top: 4px !important;
  border-top: 1px solid #e5e9f2 !important;
}

#commercialQuotesTab .quote-final-actions-bar #quoteSaveBtn {
  grid-column: auto !important;
  min-width: 190px !important;
  min-height: 44px !important;
  border-radius: 10px !important;
  background: #0f172a !important;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.16) !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] button[onclick*="cobr"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] button[onclick*="Cobr"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] button[onclick*="payment"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] button[onclick*="Payment"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] button[title*="Cobro"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] button[title*="cobro"],
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-payment-action,
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-charge-action {
  display: none !important;
}

#commercialQuotesTab #quote_client_search {
  grid-column: span 2 !important;
}

#commercialQuotesTab #item_warehouse_id {
  min-height: 44px !important;
}

#commercialQuotesTab .quote-experiences-toggle {
  grid-column: 1 / -1 !important;
}

#commercialQuotesTab #quoteExperiencesPanel {
  grid-column: 1 / -1 !important;
}

@media (max-width: 850px) {
  #commercialQuotesTab .quote-form-actions-bar {
    flex-wrap: wrap !important;
  }

  #commercialQuotesTab #quote_client_search {
    grid-column: 1 !important;
  }
}

/* ==========================================
   DASHBOARD COTIZACIONES V1.2
========================================== */

#commercialQuotesTab .quotes-mini-dashboard {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: 1 / -1 !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 6px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 28px !important;
  line-height: 1.1 !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span {
  font-size: 13px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card:not(.main) {
  min-height: 62px !important;
  padding: 10px 11px !important;
}

/* ==========================================
   DASHBOARD COTIZACIONES V1.2
========================================== */

#commercialQuotesTab .quotes-mini-dashboard {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: 1 / -1 !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 6px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 28px !important;
  line-height: 1.1 !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span {
  font-size: 13px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card:not(.main) {
  min-height: 62px !important;
  padding: 10px 11px !important;
}

#quotesListBox .quote-grid-actions {
  width: 138px !important;
  min-width: 138px !important;
  gap: 2px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  border-radius: 6px !important;
  font-size: 10px !important;
}

/* ==========================================
   CONCEPTOS COTIZADOS V2 — PDF INTERACTIVO
========================================== */

.quote-items-pdf-view {
  width: 100%;
  border: 1px solid #e5e9f2;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
}

.quote-items-pdf-header,
.quote-items-pdf-row {
  display: grid;
  grid-template-columns:
    minmax(360px, 1fr)
    90px
    120px
    130px
    110px;
  align-items: start;
}

.quote-items-pdf-header {
  background: #f8fafc;
  font-size: 12px;
  font-weight: 800;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.quote-items-pdf-header > div,
.quote-items-pdf-row > div {
  padding: 14px 16px;
  border-bottom: 1px solid #e5e9f2;
}

.quote-items-pdf-row:last-child > div {
  border-bottom: none;
}

.quote-item-concept-cell strong {
  display: block;
  margin-bottom: 8px;
  color: #0f172a;
  font-size: 14px;
  font-weight: 800;
}

.quote-item-description {
  color: #475569;
  font-size: 13px;
  line-height: 1.55;
}

.quote-item-number-cell {
  text-align: right;
  color: #111827;
  font-size: 13px;
  white-space: nowrap;
}

.quote-item-total-cell {
  font-weight: 800;
}

.quote-item-actions-cell {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.quote-item-actions-cell button {
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 10px;
}

/* ==========================================
   FIX VISUAL COTIZACIÓN — ALIANZA / TOTALES / ACCIONES
========================================== */

/* ALIANZA COMERCIAL */
.quote-alliance-card,
.alliance-card,
#quoteAllianceSection,
.quote-alliance-section {
  width: 100% !important;
  max-width: 100% !important;
}

/* TOTALES DE COTIZACIÓN */
#quoteTotalsBox,
.quote-totals-box,
.quote-totals-summary {
  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns: repeat(5, minmax(140px, 1fr)) !important;
  gap: 12px !important;

  margin-top: 16px !important;
  padding: 16px !important;

  background: #ffffff !important;
  border: 1px solid #e5e9f2 !important;
  border-radius: 16px !important;
}

/* Si los totales son texto plano dentro del contenedor */
#quoteTotalsBox p,
.quote-totals-box p,
.quote-totals-summary p {
  margin: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

/* TOTAL CLIENTE MÁS FUERTE */
#quoteTotalsBox strong,
.quote-totals-box strong,
.quote-totals-summary strong {
  font-size: 15px !important;
  font-weight: 900 !important;
}

/* ACCIONES CONCEPTOS */
.quote-item-actions-cell {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}

.quote-item-actions-cell button {
  margin: 0 !important;
  flex: 0 0 32px !important;
}

/* AJUSTE DE COLUMNAS CONCEPTOS */
.quote-items-pdf-header,
.quote-items-pdf-row {
  grid-template-columns:
    minmax(480px, 1fr)
    80px
    110px
    130px
    100px !important;
}

/* ACCIONES CONCEPTOS — CENTRADAS */
.quote-item-actions-cell {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
}

.quote-item-actions-cell button {
  margin: 0 !important;
  flex: 0 0 32px !important;
}


/* TOTALES — SIMÉTRICOS */
.quote-totals-box,
.quote-totals-summary,
#quoteTotalsBox {
  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns:
    1fr
    1fr
    1fr
    1fr !important;

  gap: 18px !important;
  align-items: end !important;

  padding: 16px 18px !important;
  margin-top: 18px !important;

  background: #ffffff !important;
  border: 1px solid #e5e9f2 !important;
  border-radius: 16px !important;
}

.quote-totals-box > div,
.quote-totals-summary > div,
#quoteTotalsBox > div {
  font-size: 13px !important;
  font-weight: 700 !important;
}

.quote-total-client,
#quoteTotalClientBox {
  grid-column: 3 / 4 !important;
  margin-top: 8px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}


/* Cuando se despliega alianza */
#quoteAllianceSection {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  width: 100%;
}

/* TOTALES SIMÉTRICOS */
.quote-totals-box {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  gap: 12px;
  align-items: end;
  padding: 16px 18px;
  margin-top: 18px;
  background: #ffffff;
  border: 1px solid #e5e9f2;
  border-radius: 16px;
}

.quote-total-row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.quote-total-row span,
.quote-total-row strong:first-child {
  font-size: 13px;
  font-weight: 800;
}

.quote-total-row strong {
  font-size: 15px;
  font-weight: 900;
}

.quote-total-row input {
  width: 100%;
}

/* TOTAL CLIENTE debajo de Total cotización */
.grand-total-row {
  grid-column: 3 / 4;
}

/* ==========================================
   TOTALES COTIZACIÓN V2 — SIMÉTRICO FINAL
========================================== */

.quote-totals-box {
  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns:
    1fr
    1fr
    1fr
    1fr !important;

  gap: 16px !important;
  padding: 18px 20px !important;
  margin-top: 18px !important;

  background: #ffffff !important;
  border: 1px solid #e5e9f2 !important;
  border-radius: 16px !important;

  box-sizing: border-box !important;
}

.quote-total-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
  min-width: 0 !important;
}

.quote-total-row span,
.quote-total-row strong:first-child {
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
}

.quote-total-row strong {
  font-size: 15px !important;
  font-weight: 900 !important;
  color: #020617 !important;
}

.quote-total-row input {
  width: 100% !important;
  max-width: 160px !important;
  height: 36px !important;
}

.grand-total-row {
  grid-column: 3 / 4 !important;
  grid-row: 2 !important;

  padding-top: 6px !important;
  border-top: 1px solid #e5e9f2 !important;
}


.quote-alliance-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 700;
}

.quote-alliance-fields {
  display: grid;
  grid-template-columns: 1.2fr 1fr 100px 130px 1.4fr;
  gap: 10px;
  align-items: center;
}

.quote-alliance-fields select,
.quote-alliance-fields input,
.quote-alliance-fields textarea {
  width: 100%;
  margin: 0 !important;
}

/* FIX FINAL ALIANZA COMERCIAL */

.quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
}

#quoteAllianceSection.quote-alliance-fields {
  display: none !important;
}


.quote-alliance-fields select,
.quote-alliance-fields input,
.quote-alliance-fields textarea {
  width: 100% !important;
  margin: 0 !important;
}

/* ALIANZA COMERCIAL V2 — FINAL */

.quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 700 !important;
}

/* Campos desplegados */
.quote-alliance-fields {
  grid-column: 1 / -1 !important;

  width: 100% !important;
  max-width: 100% !important;

  grid-template-columns:
    minmax(180px, 1.3fr)
    minmax(150px, 1fr)
    120px
    150px
    minmax(220px, 1.5fr) !important;

  gap: 12px !important;
  align-items: center !important;

  margin-top: 10px !important;
}

/* Cuando JS lo muestra */
#quoteAllianceSection[style*="display: block"],
#quoteAllianceSection[style*="display:block"],
#quoteAllianceSection[style*="display: grid"],
#quoteAllianceSection[style*="display:grid"] {
  display: grid !important;
}

.quote-alliance-fields select,
.quote-alliance-fields input,
.quote-alliance-fields textarea {
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.quote-alliance-fields textarea {
  min-height: 36px !important;
  resize: vertical !important;
}

/* FIX ALIANZA COMERCIAL — CAMPOS LEGIBLES */

.quote-alliance-bar {
  grid-template-columns: 220px 240px 1fr !important;
  min-height: 88px !important;
}

.quote-alliance-fields {
  display: grid !important;
  grid-template-columns:
    220px
    170px
    120px
    150px
    minmax(260px, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
}

.quote-alliance-fields select,
.quote-alliance-fields input {
  min-width: 0 !important;
  height: 38px !important;
}

.quote-alliance-fields textarea {
  min-width: 260px !important;
  height: 38px !important;
}

/* ALIANZA COMERCIAL V3 */

#quoteAllianceSection {
  width: 100% !important;

  display: grid !important;

  grid-template-columns:
    220px
    180px
    140px
    160px
    minmax(300px, 1fr) !important;

  gap: 12px !important;

  margin-top: 12px !important;
  margin-bottom: 20px !important;

  align-items: center !important;
}

#quoteAllianceSection textarea {
  min-height: 40px !important;
  width: 100% !important;
}

#quoteAllianceSection select,
#quoteAllianceSection input {
  width: 100% !important;
}
/* FIX CONCEPTOS — FORMULARIO HORIZONTAL */

#commercialQuotesTab .quote-items-row {
  display: grid !important;
  grid-template-columns:
    1.2fr
    1.2fr
    1fr
    1fr !important;
  gap: 14px !important;
  align-items: center !important;
  width: 100% !important;
}

#commercialQuotesTab .quote-items-row select,
#commercialQuotesTab .quote-items-row input {
  width: 100% !important;
}

#commercialQuotesTab #item_description_text {
  width: calc(100% - 260px) !important;
  display: inline-block !important;
  vertical-align: top !important;
}

#commercialQuotesTab #quoteItemAddBtn {
  width: 240px !important;
  display: inline-block !important;
  margin-left: 14px !important;
  vertical-align: top !important;
}

/* CAPTURA DE CONCEPTOS POR EMPRESA */

#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_event_name,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_event_type_id,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_venue_id,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_guest_count,
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-association-logo-toggle,
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-alliance-bar,
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-guarantee-row,
#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-experiences-toggle,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quoteExperiencesPanel {
  display: none !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_client_search,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_notes,
#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_terms {
  grid-column: span 2 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #quote_event_date {
  min-height: 44px !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-sku-field,
#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-lot-field,
#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-warehouse-field {
  display: none !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] #item_category_id {
  grid-column: 1 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] #item_product_id {
  width: 100% !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-product-field {
  grid-column: 2 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-quantity-field {
  grid-column: 3 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-price-field {
  grid-column: 4 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] .quote-description-field {
  grid-column: 1 / 4 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] #item_description_text {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}

#commercialQuotesTab[data-quote-capture-mode="planner"] #quoteItemAddBtn {
  grid-column: 4 !important;
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #item_category_id {
  display: none !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-concepts-capture {
  grid-template-columns: 140px minmax(260px, 1fr) 110px 170px 150px !important;
  column-gap: 12px !important;
  row-gap: 10px !important;
  align-items: end !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-industrial-label {
  display: block !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-sku-field {
  grid-column: 1 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #item_sku_code {
  width: 100% !important;
  max-width: 140px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-product-field {
  grid-column: 2 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-quantity-field {
  grid-column: 3 !important;
  max-width: 110px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #item_quantity {
  width: 100% !important;
  max-width: 110px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-price-field {
  grid-column: 4 !important;
  max-width: 170px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #item_unit_price {
  width: 100% !important;
  max-width: 170px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-lot-field {
  grid-column: 1 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-warehouse-field {
  grid-column: 2 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-description-field {
  grid-column: 3 / 6 !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #item_description_text {
  width: 100% !important;
  display: block !important;
  margin: 0 !important;
  min-height: 44px !important;
}

#commercialQuotesTab[data-quote-capture-mode="industrial"] #quoteItemAddBtn {
  grid-column: 5 !important;
  grid-row: 1 !important;
  width: 100% !important;
  max-width: 150px !important;
  display: block !important;
  margin: 0 !important;
  justify-self: end !important;
}

@media (max-width: 900px) {
  #commercialQuotesTab[data-quote-capture-mode="planner"] #item_category_id,
  #commercialQuotesTab[data-quote-capture-mode="planner"] .quote-product-field,
  #commercialQuotesTab[data-quote-capture-mode="planner"] .quote-quantity-field,
  #commercialQuotesTab[data-quote-capture-mode="planner"] .quote-price-field,
  #commercialQuotesTab[data-quote-capture-mode="planner"] .quote-description-field,
  #commercialQuotesTab[data-quote-capture-mode="planner"] #quoteItemAddBtn,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-sku-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-product-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-quantity-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-price-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-lot-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-warehouse-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-description-field,
  #commercialQuotesTab[data-quote-capture-mode="industrial"] #quoteItemAddBtn {
    grid-column: 1 / -1 !important;
    max-width: none !important;
  }

  #commercialQuotesTab[data-quote-capture-mode="industrial"] .quote-concepts-capture {
    grid-template-columns: 1fr !important;
  }
}

/* ALIANZA COMERCIAL INLINE FINAL */

.quote-alliance-inline {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 180px 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  margin: 14px 0 22px !important;
}

.quote-alliance-inline .quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 800 !important;
}

.quote-alliance-inline #quoteAllianceSection {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1.3fr 1fr 120px 150px 1.6fr !important;
  gap: 10px !important;
  align-items: center !important;
}

.quote-alliance-inline #quoteAllianceSection[style*="display:none"] {
  display: none !important;
}

.quote-alliance-inline select,
.quote-alliance-inline input,
.quote-alliance-inline textarea {
  width: 100% !important;
  margin: 0 !important;
}

.quote-alliance-inline {
  display: grid !important;
  grid-template-columns: 210px 1fr !important;
  gap: 12px !important;
  align-items: center !important;
  width: 100% !important;
  margin: 14px 0 22px !important;
}

.quote-alliance-inline .quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 800 !important;
}

.quote-alliance-inline .quote-alliance-fields {
  display: grid !important;
  grid-template-columns: 1.3fr 1fr 110px 140px 1.5fr !important;
  gap: 10px !important;
  align-items: center !important;
}

.quote-alliance-inline .quote-alliance-fields[style*="display:none"] {
  display: none !important;
}

.quote-alliance-inline select,
.quote-alliance-inline input,
.quote-alliance-inline textarea {
  width: 100% !important;
  margin: 0 !important;
  height: 36px !important;
  box-sizing: border-box !important;
}

.quote-alliance-inline {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 210px 1fr !important;
  gap: 12px !important;
  align-items: center !important;
  margin: 14px 0 22px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 800 !important;
}

.quote-alliance-fields {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1.3fr 1fr 120px 150px 1.6fr !important;
  gap: 10px !important;
  align-items: center !important;
}

.quote-alliance-fields[style*="display:none"] {
  display: none !important;
}

/* FIX DEFINITIVO — ALIANZA EN FORMULARIO COTIZACIONES */

#commercialQuotesTab .form-card .quote-alliance-inline {
  grid-column: 1 / -1 !important;

  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns: 220px 1fr !important;
  gap: 14px !important;
  align-items: center !important;

  padding: 0 !important;
  margin: 12px 0 18px 0 !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#commercialQuotesTab .quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  font-weight: 800 !important;
}

#commercialQuotesTab .quote-alliance-fields {
  width: 100% !important;

  display: grid !important;
  grid-template-columns:
    220px
    160px
    120px
    150px
    minmax(260px, 1fr) !important;

  gap: 10px !important;
  align-items: center !important;
}

#commercialQuotesTab .quote-alliance-fields[style*="display:none"] {
  display: none !important;
}

#commercialQuotesTab .quote-alliance-fields select,
#commercialQuotesTab .quote-alliance-fields input,
#commercialQuotesTab .quote-alliance-fields textarea {
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* ==========================================
   ALIANZA COMERCIAL INLINE — OVERRIDE FINAL
========================================== */

#commercialQuotesTab .quote-alliance-inline {
  grid-column: 1 / -1 !important;

  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns: 210px 1fr !important;
  gap: 14px !important;
  align-items: center !important;

  margin: 14px 0 22px 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#commercialQuotesTab .quote-alliance-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;

  margin: 0 !important;
  padding: 0 !important;

  font-weight: 800 !important;
  white-space: nowrap !important;
}

#commercialQuotesTab #quoteAllianceSection.quote-alliance-fields {
  width: 100% !important;

  display: grid !important;
  grid-template-columns:
    220px
    160px
    120px
    150px
    minmax(260px, 1fr) !important;

  gap: 10px !important;
  align-items: center !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#commercialQuotesTab #quoteAllianceSection[style*="display:none"] {
  display: none !important;
}

#commercialQuotesTab #quoteAllianceSection select,
#commercialQuotesTab #quoteAllianceSection input,
#commercialQuotesTab #quoteAllianceSection textarea {
  width: 100% !important;
  height: 36px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* ==========================================
   TOTALES COTIZACIÓN — BANDA FINANCIERA V2
========================================== */

#commercialQuotesTab .quote-totals-box {
  grid-column: 1 / -1 !important;

  width: 100% !important;
  max-width: 100% !important;

  display: grid !important;
  grid-template-columns:
    150px
    150px
    190px
    170px
    220px !important;

  gap: 18px !important;
  align-items: end !important;

  margin: 22px 0 18px !important;
  padding: 16px 18px !important;

  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#commercialQuotesTab .quote-total-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

#commercialQuotesTab .quote-total-row span,
#commercialQuotesTab .quote-total-row strong:first-child {
  font-size: 13px !important;
  font-weight: 800 !important;
}

#commercialQuotesTab .quote-total-row strong {
  font-size: 15px !important;
  font-weight: 900 !important;
}

#commercialQuotesTab #quoteGuaranteeAmount {
  width: 120px !important;
  height: 36px !important;
}

#commercialQuotesTab .grand-total-row {
  grid-column: 3 / 4 !important;
  grid-row: 2 !important;

  padding-top: 8px !important;
  border-top: 1px solid #dbe3ef !important;
}

#commercialQuotesTab .quote-totals-box {
  margin-left: 14px !important;
}

#commercialQuotesTab .grand-total-row {
  margin-top: 4px !important;
}

#commercialQuotesTab .quote-totals-box {
  margin-top: 18px !important;
  margin-bottom: 28px !important;
}

#commercialQuotesTab .quote-items-pdf-view {
  margin-bottom: 10px !important;
}

/* TOTALES — ALINEACIÓN DERECHA TIPO DOCUMENTO */

#commercialQuotesTab .quote-totals-box {
  width: 760px !important;
  max-width: 100% !important;

  margin-left: auto !important;
  margin-right: 36px !important;

  grid-template-columns:
    140px
    140px
    180px
    150px !important;
}

#commercialQuotesTab .grand-total-row {
  grid-column: 3 / 4 !important;
}

#commercialQuotesTab .quote-totals-box {
  grid-template-columns:
    150px
    140px
    140px
    180px !important;
}

.grand-total-row {
  margin-top: 2px !important;
}
.grand-total-row {
  transform: translateY(-6px);
}


/* ==========================================
   TOTALES COTIZACIÓN — BLOQUE OFICIAL FINAL
========================================== */

#commercialQuotesTab .quote-totals-box {
  grid-column: 1 / -1 !important;

  width: 860px !important;
  max-width: 100% !important;

  margin-left: auto !important;
  margin-right: 40px !important;
  margin-top: 22px !important;
  margin-bottom: 34px !important;

  display: grid !important;
  grid-template-columns:
    150px
    150px
    150px
    190px !important;

  gap: 22px !important;
  align-items: end !important;

  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#commercialQuotesTab .quote-total-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}

#commercialQuotesTab #quoteGuaranteeAmount {
  width: 120px !important;
  height: 36px !important;
}

#commercialQuotesTab .grand-total-row {
  grid-column: 4 / 5 !important;
  grid-row: 2 !important;

  margin-top: 0 !important;
  padding-top: 10px !important;

  border-top: 2px solid #c7b7ff !important;
}

#commercialQuotesTab .grand-total-row strong:first-child {
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  color: #0f172a !important;
}

#commercialQuotesTab .grand-total-row strong:last-child {
  font-size: 24px !important;
  font-weight: 900 !important;
  color: #0f172a !important;
}

/* EXPERIENCIAS — LISTADO HORIZONTAL */

.experiences-crm-grid {
  width: 100%;
  border: 1px solid #e5e9f2;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
}

.experiences-crm-header,
.experiences-crm-row {
  display: grid;
  grid-template-columns:
    220px
    minmax(320px, 1fr)
    130px
    110px
    150px;
  align-items: center;
}

.experiences-crm-header {
  background: #f8fafc;
  font-size: 12px;
  font-weight: 900;
  color: #475569;
  text-transform: uppercase;
}

.experiences-crm-header > div,
.experiences-crm-row > div {
  padding: 13px 14px;
  border-bottom: 1px solid #e5e9f2;
}

.experiences-crm-row:last-child > div {
  border-bottom: none;
}

.experiences-crm-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-start;
}

.experiences-crm-actions button {
  width: 32px;
  height: 32px;
  padding: 0;
}

/* ==========================================
   EXPERIENCIAS EN COTIZACIÓN — LISTADO HORIZONTAL
========================================== */

.quote-experiences-list {
  width: 100%;
  background: #ffffff;
  border: 1px solid #e5e9f2;
  border-radius: 16px;
  overflow: hidden;
}

.quote-experiences-list-header,
.quote-experiences-list-row {
  display: grid;
  grid-template-columns:
    90px
    260px
    minmax(320px, 1fr)
    230px;
  gap: 12px;
  align-items: center;
}

.quote-experiences-list-header {
  background: #f8fafc;
  font-size: 12px;
  font-weight: 900;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.quote-experiences-list-header > div,
.quote-experiences-list-row > div {
  padding: 13px 14px;
  border-bottom: 1px solid #e5e9f2;
}

.quote-experiences-list-row:last-child > div {
  border-bottom: none;
}

.quote-experience-include-cell {
  display: flex;
  justify-content: center;
  align-items: center;
}

.quote-experience-name-cell strong {
  font-weight: 900;
  color: #0f172a;
}

.quote-experience-description-cell {
  color: #334155;
  line-height: 1.45;
}

.quote-experience-price-cell input {
  width: 100%;
}

/* EXPERIENCIAS V2 — ANCHO COMPLETO */

.quote-experiences-panel {
  width: 100% !important;
  max-width: 100% !important;
}

#quoteExperiencesContainer {
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
  overflow-x: auto !important;
}

#quoteExperiencesContainer .quote-experiences-list {
  width: 100% !important;
  min-width: 980px !important;
}

#quoteExperiencesContainer .quote-experiences-list-header,
#quoteExperiencesContainer .quote-experiences-list-row {
  display: grid !important;
  grid-template-columns: 90px 260px minmax(360px, 1fr) 240px !important;
  gap: 12px !important;
  align-items: center !important;
}

#quoteExperiencesContainer .quote-experiences-list-header > div,
#quoteExperiencesContainer .quote-experiences-list-row > div {
  min-width: 0 !important;
}

#quoteExperiencesContainer .quote-experiences-list-row > div {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

#quoteExperiencesContainer .quote-experience-price-input {
  height: 34px !important;
}

.quotes-mini-dashboard {

  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin: 18px 0 24px;

}

.quotes-mini-dashboard-card {

  background: #ffffff;
  border-radius: 16px;
  padding: 14px 16px;
  border: 1px solid #e5e9f2;

}

.quotes-mini-dashboard-card span {

  display: block;
  font-size: 12px;
  font-weight: 800;
  margin-bottom: 6px;

}

.quotes-mini-dashboard-card strong {

  display: block;
  font-size: 16px;
  font-weight: 900;

}

.quotes-mini-dashboard-card small {

  display: block;
  margin-top: 4px;
  font-size: 11px;

}

/* TOTAL GENERAL */

.quotes-mini-dashboard-card.main {

  grid-column: 1 / -1;

  background: linear-gradient(
    135deg,
    #1e293b,
    #0f172a
  );

  color: white;

  border: none;

}

.quotes-mini-dashboard-card.main span,
.quotes-mini-dashboard-card.main small {

  color: rgba(255,255,255,.8);

}

.quotes-mini-dashboard-card.main strong {

  font-size: 28px;
  color: white;

}

.quotes-mini-dashboard-card.main strong + strong {

  margin-top: 4px;

}

.quotes-mini-dashboard-card.main small + small {

  margin-top: 6px;

}

/* BORRADOR */

.quotes-mini-dashboard-card.status-draft {

  border-left: 5px solid #94a3b8;

}

/* ENVIADA */

.quotes-mini-dashboard-card.status-sent {

  border-left: 5px solid #3b82f6;

}

/* REVISION */

.quotes-mini-dashboard-card.status-pending {

  border-left: 5px solid #f59e0b;

}

/* APARTADA */

.quotes-mini-dashboard-card.status-reserved {

  border-left: 5px solid #8b5cf6;

}

/* APROBADA */

.quotes-mini-dashboard-card.status-approved {

  border-left: 5px solid #22c55e;

}

/* RECHAZADA */

.quotes-mini-dashboard-card.status-rejected {

  border-left: 5px solid #ef4444;

}

/* ==========================================
   COTIZACIONES GLOBAL V1 - FINAL OVERRIDE
========================================== */

#commercialQuotesTab #commercialQuotesContainer {
  display: block !important;
  grid-template-columns: none !important;
}

#commercialQuotesTab #quoteFormPanel[style*="display: none"],
#commercialQuotesTab #quoteFormPanel[style*="display:none"] {
  display: none !important;
}

#commercialQuotesTab #quoteFormPanel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab #quoteGlobalPanel {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

#commercialQuotesTab .quotes-global-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 12px !important;
}

#commercialQuotesTab .quotes-mini-dashboard {
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card {
  border-radius: 8px !important;
  padding: 9px 10px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: auto !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 5px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span,
#commercialQuotesTab .quotes-mini-dashboard-card.main small,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  color: inherit !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card strong,
#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 14px !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 78px 150px 96px 86px 96px 124px 88px !important;
  min-width: 718px !important;
}

#quotesListBox .quote-grid-actions {
  width: 124px !important;
  min-width: 124px !important;
  gap: 2px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  min-height: 22px !important;
  flex: 0 0 22px !important;
  padding: 0 !important;
  border-radius: 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

#commercialQuotesTab .compact-status-select {
  width: 100px !important;
  min-width: 100px !important;
  height: 24px !important;
  min-height: 24px !important;
  font-size: 9px !important;
  padding: 2px 20px 2px 5px !important;
}

/* ==========================================
   DASHBOARD COTIZACIONES V1.2 FINAL
========================================== */

#commercialQuotesTab .quotes-mini-dashboard {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(120px, 1fr)) !important;
  gap: 8px !important;
  align-items: stretch !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main {
  grid-column: 1 / -1 !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e5e9f2 !important;
  border-left: 6px solid #1e293b !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main strong {
  font-size: 28px !important;
  line-height: 1.1 !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card.main span {
  font-size: 13px !important;
}

#commercialQuotesTab .quotes-mini-dashboard-card:not(.main) {
  min-height: 62px !important;
  padding: 10px 11px !important;
}

/* ==========================================
   COTIZACIONES GRID ACCIONES FINAL
========================================== */

#quotesListBox .crm-grid-wrapper {
  overflow-x: visible !important;
}

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 74px 136px 88px 82px 86px 148px 82px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#commercialQuotesTab .quotes-grid-header > div,
#commercialQuotesTab .quotes-grid-row > div,
#quotesListBox .quotes-grid-header > div,
#quotesListBox .quotes-grid-row > div {
  min-width: 0 !important;
}

#quotesListBox .quotes-grid-header > div:nth-child(6),
#quotesListBox .quotes-grid-row > div:nth-child(6),
#quotesListBox .quote-grid-actions {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#quotesListBox .quote-grid-actions {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 4px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

#quotesListBox .quote-grid-actions button,
#quotesListBox .quote-grid-actions .danger-btn {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 5px !important;
  font-size: 10px !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

/* ==========================================
   COTIZACIONES GLOBAL GRID V1.2 FINAL
========================================== */

#quotesListBox .quotes-grid-header,
#quotesListBox .quotes-grid-row {
  grid-template-columns: 70px 126px minmax(130px, 1fr) 78px 82px 148px 104px !important;
  min-width: 0 !important;
  width: 100% !important;
}

#quotesListBox .quote-event-cell {
  max-width: none !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#quotesListBox .quote-grid-actions {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
}

#quotesListBox .quote-status-column {
  overflow: visible !important;
  min-width: 104px !important;
}

#quotesListBox .quote-status-select,
#quotesListBox .compact-status-select,
#commercialQuotesTab .compact-status-select {
  width: 100px !important;
  min-width: 100px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 2px 20px 2px 5px !important;
  font-size: 9px !important;
  border-radius: 5px !important;
}
#commercialQuotesTab .quote-remissioned-badge,
#quotesListBox .quote-remissioned-badge {
  display: inline-flex !important;
  align-items: center !important;
  margin-top: 4px !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
  background: #e8f5ee !important;
  color: #17633a !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

#remissionsListBox .remissions-grid-header,
#remissionsListBox .remissions-grid-row {
  display: grid !important;
  grid-template-columns:
    110px
    92px
    minmax(150px, 1fr)
    118px
    76px
    132px
    92px
    196px !important;
  gap: 0 !important;
  align-items: center !important;
  min-width: 966px !important;
}

#remissionsListBox .remissions-grid-header > div,
#remissionsListBox .remissions-grid-row > div {
  padding: 8px 7px !important;
  border-bottom: 1px solid #e5e9f2 !important;
  font-size: 11px !important;
  min-width: 0 !important;
}

#remissionsListBox .remissions-grid-header {
  background: #f8fafc !important;
  font-weight: 900 !important;
}

#remissionsListBox .remissions-grid-row {
  background: #ffffff !important;
}

#commercialRemissionsContainer .remissions-top-products-card {
  min-width: 260px;
}

#commercialRemissionsContainer .remissions-main-total-card span {
  font-size: 13px !important;
  font-weight: 600 !important;
}

#commercialRemissionsContainer .remissions-main-total-card strong {
  font-size: 24px !important;
  line-height: 1.1 !important;
}

#commercialRemissionsContainer .remissions-top-products-panel {
  grid-column: 1 / -1;
  background: #ffffff;
  border: 1px solid #e5e9f2;
  border-radius: 8px;
  padding: 14px;
}

#commercialRemissionsContainer .remissions-top-products-header {
  margin-bottom: 12px;
}

#commercialRemissionsContainer .remissions-top-products-header strong {
  font-size: 14px;
}

#commercialRemissionsContainer .remissions-top-products-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.9fr) minmax(420px, 1.1fr);
  gap: 18px;
  align-items: start;
}

#commercialRemissionsContainer .remissions-bars {
  display: grid;
  gap: 10px;
}

#commercialRemissionsContainer .remissions-bar-row {
  display: grid;
  gap: 4px;
}

#commercialRemissionsContainer .remissions-bar-row > span {
  font-size: 12px;
  font-weight: 700;
  color: #10182f;
}

#commercialRemissionsContainer .remissions-bar-track {
  width: 100%;
  height: 12px;
  border-radius: 999px;
  background: #e5e9f2;
  overflow: hidden;
}

#commercialRemissionsContainer .remissions-bar-fill {
  height: 100%;
  border-radius: 999px;
  background: #17633a;
}

#commercialRemissionsContainer .remissions-bar-row small,
#commercialRemissionsContainer .remissions-top-products-summary small {
  color: #475569;
  font-size: 11px;
}

#commercialRemissionsContainer .remissions-top-products-summary {
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid #e5e9f2;
  display: grid;
  gap: 3px;
}

#commercialRemissionsContainer .remissions-top-products-summary span {
  font-weight: 800;
}

#commercialRemissionsContainer .remissions-products-table {
  display: grid;
  border: 1px solid #e5e9f2;
  border-radius: 8px;
  overflow-x: auto;
}

#commercialRemissionsContainer .remissions-products-table-head,
#commercialRemissionsContainer .remissions-products-table-row {
  display: grid;
  grid-template-columns: 82px 1fr 1fr 110px 130px 82px;
  min-width: 720px;
}

#commercialRemissionsContainer .remissions-products-table-head {
  background: #f8fafc;
  font-weight: 800;
}

#commercialRemissionsContainer .remissions-products-table-head span,
#commercialRemissionsContainer .remissions-products-table-row span {
  padding: 8px;
  border-bottom: 1px solid #e5e9f2;
  font-size: 11px;
}

#remissionsListBox .quote-grid-actions {
  width: 148px !important;
  min-width: 148px !important;
  max-width: 148px !important;
  display: flex !important;
  gap: 4px !important;
}

#remissionsListBox .quote-grid-actions button,
#remissionsListBox .quote-grid-actions .danger-btn {
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  padding: 0 !important;
  border-radius: 5px !important;
  font-size: 9px !important;
  line-height: 1 !important;
}

@media (max-width: 900px) {
  #commercialRemissionsContainer .remissions-top-products-layout {
    display: block;
  }
}