/* ==========================================
   Elite Quotes v1.1 Styles
   Tokens: --wd-primary-color, --wd-title-color,
           --wd-text-color, --wd-text-font

   v6.3 fix (2026-05-24 Benjamin item 4): el override de --ec-primary aqui
   era a :root, lo que GLOBALMENTE cambiaba el azul Design MD en toda la
   pagina (afectaba botones checkout, cart, etc.). Re-scoped a wrappers del
   modulo quotes especificamente (.ec-quote-*, .ec-quotes-*).
   ========================================== */

.ec-quote,
.ec-quotes,
[class*="ec-quote-"],
[class*="ec-quotes-"] {
  --ec-primary: rgb(24, 70, 190);
  --ec-primary-light: rgba(24, 70, 190, 0.08);
  --ec-primary-mid: rgba(24, 70, 190, 0.15);
  --ec-dark: #1a1a2e;
  --ec-text: #333;
  --ec-text-muted: #777;
  --ec-border: #e0e0e0;
  --ec-border-light: #f0f0f0;
  --ec-bg-muted: #f7f8fa;
  --ec-success: #2e7d32;
  --ec-success-bg: #e8f5e9;
  --ec-danger: #c62828;
  --ec-danger-bg: #fce4ec;
  --ec-warning: #e65100;
  --ec-warning-bg: #fff3e0;
  --ec-info: #1565c0;
  --ec-info-bg: #e3f2fd;
  --ec-radius: 8px;
  --ec-radius-sm: 4px;
  --ec-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --ec-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --ec-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
}

/* --- Badges --- */
.ec-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1;
}
.ec-badge-vigente {
  background: var(--ec-success-bg);
  color: var(--ec-success);
}
.ec-badge-vencida {
  background: var(--ec-danger-bg);
  color: var(--ec-danger);
}
.ec-badge-renovada {
  background: var(--ec-warning-bg);
  color: var(--ec-warning);
}
.ec-badge-comprada {
  background: var(--ec-info-bg);
  color: var(--ec-info);
}

/* ==========================================
   CART PAGE (/cotizacion/nueva)
   ========================================== */

.ec-quote-cart-page {
  padding: 24px 0 48px;
  max-width: 1200px;
}

/* Page header */
.ec-page-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ec-border);
}
.ec-page-header h1 {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  color: var(--ec-dark);
}
.ec-page-header-left {
  display: flex;
  align-items: baseline;
  gap: 12px;
}
.ec-page-meta {
  font-size: 13px;
  color: var(--ec-text-muted);
  background: var(--ec-bg-muted);
  padding: 2px 10px;
  border-radius: 20px;
}
.ec-back-link {
  font-size: 13px;
  color: var(--ec-primary);
  text-decoration: none;
}
.ec-back-link:hover {
  text-decoration: underline;
}

/* Sections */
.ec-quote-cart-page .ec-section {
  margin-bottom: 16px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius);
  box-shadow: var(--ec-shadow-sm);
}

.ec-section-heading {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--ec-border-light);
}
.ec-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: var(--ec-primary);
  color: #fff;
  border-radius: 50%;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}
.ec-section-heading h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--ec-dark);
}

/* Product table */
.ec-cart-items-wrap {
  overflow-x: auto;
}
.ec-cart-table {
  width: 100%;
  border-collapse: collapse;
}
.ec-cart-table thead {
  display: none;
}
.ec-cart-table td {
  padding: 16px 8px;
  border-bottom: 1px solid var(--ec-border-light);
  vertical-align: middle;
}
.ec-cart-table tr:last-child td {
  border-bottom: none;
}

.ec-td-thumb {
  width: 64px;
  padding-right: 0;
}
.ec-td-thumb img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  border-radius: var(--ec-radius-sm);
  border: 1px solid var(--ec-border-light);
  background: #fff;
}
.ec-td-name {
  padding-left: 4px;
}
.ec-product-name {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--ec-text);
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ec-product-sku {
  display: block;
  font-size: 11px;
  color: var(--ec-text-muted);
  margin-top: 4px;
}

.ec-item-price {
  font-size: 14px;
  color: var(--ec-text);
  white-space: nowrap;
  text-align: right;
}
.ec-item-subtotal {
  font-size: 14px;
  font-weight: 600;
  color: var(--ec-dark);
  white-space: nowrap;
  text-align: right;
}

/* Qty controls */
.ec-qty-wrap {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius-sm);
  overflow: hidden;
}
.ec-qty-btn {
  width: 32px;
  height: 32px;
  background: var(--ec-bg-muted);
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: var(--ec-text);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
.ec-qty-btn:hover {
  background: var(--ec-border);
}
.ec-qty-input {
  width: 44px;
  height: 32px;
  text-align: center;
  border: none;
  border-left: 1px solid var(--ec-border);
  border-right: 1px solid var(--ec-border);
  font-size: 14px;
  font-weight: 600;
  -moz-appearance: textfield;
  padding: 0;
}
.ec-qty-input::-webkit-outer-spin-button,
.ec-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.ec-td-remove {
  width: 32px;
  text-align: center;
}
.ec-remove-item {
  background: none;
  border: none;
  color: var(--ec-text-muted);
  font-size: 20px;
  cursor: pointer;
  padding: 4px;
  border-radius: var(--ec-radius-sm);
  transition: all 0.15s;
  line-height: 1;
}
.ec-remove-item:hover {
  color: var(--ec-danger);
  background: var(--ec-danger-bg);
}

/* Data grid (billing + shipping side by side) */
.ec-data-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.ec-data-block {
}
.ec-data-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--ec-dark);
  margin-bottom: 8px;
}
.ec-data-block select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius-sm);
  font-size: 14px;
  background: #fff;
  color: var(--ec-text);
  cursor: pointer;
}
.ec-data-block select:focus {
  border-color: var(--ec-primary);
  outline: none;
  box-shadow: 0 0 0 3px var(--ec-primary-light);
}
.ec-data-preview {
  margin-top: 8px;
  padding: 10px 12px;
  background: var(--ec-bg-muted);
  border-radius: var(--ec-radius-sm);
  font-size: 12px;
  color: var(--ec-text-muted);
  line-height: 1.5;
  display: none;
}
.ec-data-preview.visible {
  display: block;
}
.ec-data-empty {
  padding: 20px;
  text-align: center;
  background: var(--ec-bg-muted);
  border-radius: var(--ec-radius-sm);
  border: 1px dashed var(--ec-border);
}
.ec-data-empty p {
  margin: 0 0 12px;
  font-size: 13px;
  color: var(--ec-text-muted);
}
.ec-inline-add {
  display: inline-block;
  margin-top: 8px;
  font-size: 12px;
  color: var(--ec-primary);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  text-decoration: none;
}
.ec-inline-add:hover {
  text-decoration: underline;
}

/* Methods grid */
.ec-methods-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.ec-method-group {
}
.ec-method-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--ec-dark);
  margin-bottom: 8px;
}
.ec-radio-option {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  margin: 0 0 8px 0;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius-sm);
  cursor: pointer;
  transition: all 0.15s;
  background: #fff;
}
.ec-radio-option:last-child {
  margin-bottom: 0;
}
.ec-radio-option:hover {
  border-color: var(--ec-primary);
}
.ec-radio-option input[type="radio"] {
  margin: 3px 0 0 0;
  flex-shrink: 0;
  accent-color: var(--ec-primary);
}
.ec-radio-option
  input[type="radio"]:checked
  ~ .ec-radio-content
  .ec-radio-title {
  color: var(--ec-primary);
}
.ec-radio-option:has(input:checked) {
  border-color: var(--ec-primary);
  background: var(--ec-primary-light);
}
.ec-radio-content {
  flex: 1;
}
.ec-radio-title {
  display: block;
  font-size: 14px;
  font-weight: 500;
  color: var(--ec-text);
}
.ec-radio-desc {
  display: block;
  font-size: 12px;
  color: var(--ec-text-muted);
  margin-top: 2px;
}
.ec-surcharge-warn {
  color: var(--ec-danger);
  font-weight: 600;
}

/* Summary box */
.ec-summary-box {
  position: sticky;
  top: 120px;
  background: #fff;
  border: 2px solid var(--ec-dark);
  border-radius: var(--ec-radius);
  padding: 24px;
  box-shadow: var(--ec-shadow-md);
}
.ec-summary-box h3 {
  margin: 0 0 16px 0;
  font-size: 16px;
  font-weight: 700;
  color: var(--ec-dark);
}
.ec-summary-lines {
  padding-bottom: 12px;
}
.ec-summary-line {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  font-size: 14px;
  color: var(--ec-text);
}
.ec-summary-line.ec-discount-line {
  color: #2e7d32;
  font-weight: 600;
}

/* Sprint 3 Fase A v1.10 - Vista consolidada por RUT (Mis Datos de Facturacion) */
.ec-bp-grouped .ec-rut-cards {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.ec-rut-card {
  background: #fff;
  border: 1px solid #e6e9ef;
  border-radius: 10px;
  padding: 18px 20px;
}
.ec-rut-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 14px;
}
.ec-rut-card-title h3 {
  margin: 0 0 2px;
  font-size: 18px;
  color: #1a1a2e;
}
.ec-rut-line {
  margin: 0;
  color: #596372;
  font-size: 13px;
}
.ec-rut-profiles-count {
  background: #eef4ff;
  color: #1e4fa8;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
}
.ec-rut-card-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: flex-start;
}
.ec-rut-collapsible {
  margin-top: 10px;
  padding: 10px 0;
  border-top: 1px dashed #d0d7de;
}
.ec-rut-collapsible summary {
  cursor: pointer;
  font-weight: 600;
  color: #1a1a2e;
  font-size: 14px;
  list-style: revert;
}
.ec-rut-collapsible summary:focus {
  outline: none;
}
.ec-collapsible-count {
  background: #eef0f3;
  color: #596372;
  padding: 1px 8px;
  border-radius: 10px;
  font-size: 11px;
  font-weight: 600;
  margin-left: 4px;
}
.ec-rut-docs-list,
.ec-rut-profiles-list {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ec-rut-docs-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  color: #1a1a2e;
}
.ec-rut-docs-list small {
  color: #7a8491;
  font-size: 12px;
}
.ec-rut-profile-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  background: #f7f9fc;
  border-radius: 6px;
  flex-wrap: wrap;
}
.ec-rut-profile-main strong {
  color: #1a1a2e;
}
.ec-rut-profile-main small {
  color: #596372;
  font-size: 12px;
}
.ec-rut-profile-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ec-chip-default {
  background: #d7f2d7;
  color: #1e5e1e;
}
.ec-rut-card-footer {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #d0d7de;
}

@media (max-width: 640px) {
  .ec-rut-card-head {
    flex-direction: column;
  }
  .ec-rut-profile-item {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Sprint 3 Fase A final - Dropdown Pagar (Mis Cotizaciones) */
.ec-dropdown {
  position: relative;
  display: inline-block;
}
.ec-dropdown .ec-caret {
  font-size: 10px;
  margin-left: 2px;
}
.ec-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 220px;
  background: #fff;
  border: 1px solid #d0d7de;
  border-radius: 6px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  z-index: 20;
  padding: 4px 0;
}
.ec-dropdown-menu[hidden] {
  display: none;
}
.ec-dropdown-menu a {
  display: block;
  padding: 8px 14px;
  color: #1a1a2e;
  text-decoration: none;
  font-size: 13px;
}
.ec-dropdown-menu a:hover {
  background: #f6f7f9;
}

/* Sprint 3 Fase A final - extra badges */
.ec-badge-oc-attached {
  background: #d7f2d7;
  color: #1e5e1e;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  display: inline-block;
}
.ec-badge-neutral {
  background: #eef0f3;
  color: #596372;
}
.ec-badge-discount {
  background: #eef4ff;
  color: #1e4fa8;
}

/* Sprint 3 Fase A final - Datos de Facturacion card head + shared RUT notice */
.ec-shared-rut-notice {
  margin: 14px 0;
  padding: 10px 14px;
  background: #fffdf5;
  border: 1px solid #f5d97e;
  border-radius: 6px;
  font-size: 13px;
  color: #7a5c00;
}
.ec-shared-rut-notice strong {
  color: #5a4100;
}
.ec-profile-card-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.ec-profile-shared-docs {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed #d0d7de;
}
.ec-profile-shared-docs h4 {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: #596372;
  margin: 0 0 6px;
}
.ec-profile-shared-docs ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
}
.ec-profile-shared-docs li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
}
.ec-profile-shared-docs small {
  color: #7a8491;
  font-size: 11px;
}

/* Sprint 3 Fase A - Mis Documentos (account dashboard) */
.ec-my-documents {
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.ec-docs-section {
  background: #fff;
  border: 1px solid #e6e9ef;
  border-radius: 8px;
  padding: 20px;
}
.ec-docs-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 14px;
}
.ec-docs-section-head h2 {
  margin: 0;
  font-size: 18px;
  color: #1a1a2e;
}
.ec-docs-filters {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  flex-wrap: wrap;
  font-size: 12px;
}
.ec-docs-filters label {
  display: flex;
  flex-direction: column;
  gap: 3px;
  color: #596372;
}
.ec-docs-filters select,
.ec-docs-filters input[type="date"] {
  padding: 6px 8px;
  border: 1px solid #c3c4c7;
  border-radius: 4px;
  font-size: 13px;
  min-width: 130px;
}
.ec-docs-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.ec-docs-table th,
.ec-docs-table td {
  padding: 10px 8px;
  text-align: left;
  border-bottom: 1px solid #eef0f3;
}
.ec-docs-table th {
  font-size: 12px;
  color: #596372;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.ec-docs-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.ec-docs-empty-row {
  color: #596372;
  font-style: italic;
}
.ec-docs-pager {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  margin-top: 14px;
  font-size: 13px;
}
.ec-docs-pager[hidden] {
  display: none;
}
.ec-chip {
  display: inline-block;
  padding: 1px 7px;
  font-size: 10px;
  font-weight: 700;
  background: #eef4ff;
  color: #1e4fa8;
  border-radius: 10px;
  margin-left: 4px;
  vertical-align: middle;
}
.ec-chip-oc {
  background: #fff4c2;
  color: #7a5c00;
}
.ec-chip-me {
  background: #d7f2d7;
  color: #1e5e1e;
}

/* Company card */
.ec-company-card {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 20px;
}
.ec-company-card-body {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 1fr;
}
.ec-company-field {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ec-company-field-label {
  font-size: 11px;
  color: #7a8491;
  text-transform: uppercase;
}
.ec-company-field-value {
  font-size: 15px;
  color: #1a1a2e;
}
.ec-company-field-value small {
  display: block;
  font-size: 11px;
  color: #7a8491;
  font-weight: 400;
}
.ec-company-field-discount .ec-company-field-value {
  color: #2e7d32;
  font-weight: 600;
}
.ec-company-users h3,
.ec-company-docs h3 {
  margin: 0 0 6px;
  font-size: 13px;
  color: #596372;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}
.ec-company-users-list,
.ec-company-docs-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 14px;
}
.ec-company-users-list li {
  display: flex;
  align-items: center;
  gap: 6px;
}
.ec-company-users-list .ec-company-user-me {
  font-weight: 600;
}
.ec-company-docs-list li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.ec-company-docs-list small {
  color: #7a8491;
}

.ec-docs-placeholder {
  padding: 16px;
  background: #f7f9fc;
  border-radius: 6px;
  color: #596372;
  font-style: italic;
}

@media (max-width: 768px) {
  .ec-company-card {
    grid-template-columns: 1fr;
  }
  .ec-company-card-body {
    grid-template-columns: 1fr;
  }
  .ec-docs-filters {
    width: 100%;
  }
  .ec-docs-table {
    font-size: 13px;
  }
}

/* Sprint 3 Fase A - Confirmation: OC attached */
.ec-confirm-oc {
  margin: 18px auto;
  padding: 12px 16px;
  background: #eef4ff;
  border: 1px solid #c7d2fe;
  border-radius: 6px;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;
}
.ec-confirm-oc p {
  margin: 0;
  font-size: 14px;
}
.ec-confirm-oc .ec-oc-number {
  font-family: monospace;
  padding: 1px 6px;
  background: #fff;
  border-radius: 3px;
}

/* Sprint 3 Fase 5bis - Attach OC to existing quote */
.ec-oc-attach-existing {
  margin: 20px 0;
  background: #fffdf5;
  border: 1px solid #f5d97e;
}
.ec-oc-attach-existing .ec-oc-block-header strong {
  color: #7a5c00;
}
.ec-oc-attach-existing #ec-attach-oc-btn {
  margin-top: 12px;
}
.ec-oc-attach-expired {
  margin: 20px 0;
  padding: 16px;
  background: #fbe0e0;
  border: 1px solid #f3b6b6;
  border-radius: 6px;
  color: #8b1c1c;
}
.ec-oc-attach-expired .ec-oc-block-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}
.ec-oc-attach-expired strong {
  color: #8b1c1c;
}
.ec-oc-attach-expired span {
  font-size: 13px;
  color: #6b2222;
}
.ec-oc-flash {
  animation: ec-oc-flash-anim 1.4s ease-in-out 1;
}
@keyframes ec-oc-flash-anim {
  0% {
    box-shadow: 0 0 0 0 rgba(245, 217, 126, 0);
  }
  40% {
    box-shadow: 0 0 0 8px rgba(245, 217, 126, 0.6);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(245, 217, 126, 0);
  }
}

/* Sprint 3 Fase A - OC upload block */
.ec-oc-block {
  margin-top: 16px;
  padding: 16px;
  background: #f7f9fc;
  border: 1px solid #d8dee6;
  border-radius: 6px;
}
.ec-oc-block[hidden] {
  display: none;
}
.ec-oc-block-header {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}
.ec-oc-block-header strong {
  font-size: 14px;
  color: var(--ec-dark, #1a1a2e);
}
.ec-oc-block-header span {
  font-size: 12px;
  color: #596372;
}
.ec-oc-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.ec-oc-field label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 4px;
  color: var(--ec-dark, #1a1a2e);
}
.ec-oc-field label .required {
  color: #d63638;
}
.ec-oc-field input[type="file"],
.ec-oc-field input[type="text"] {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid #c3c4c7;
  border-radius: 4px;
  font-size: 13px;
}
.ec-oc-hint {
  display: block;
  font-size: 11px;
  color: #7a8491;
  margin-top: 4px;
}
.ec-oc-error {
  margin-top: 10px;
  padding: 8px 10px;
  background: #fbe0e0;
  color: #8b1c1c;
  border-radius: 4px;
  font-size: 13px;
}
.ec-oc-error[hidden] {
  display: none;
}

@media (max-width: 640px) {
  .ec-oc-fields {
    grid-template-columns: 1fr;
  }
}
.ec-summary-line.ec-subtotal-discounted-line {
  border-top: 1px dashed #d0d7de;
  padding-top: 10px;
  margin-top: 4px;
  font-weight: 600;
}

/* Quote confirmation breakdown */
.ec-confirm-breakdown {
  width: 100%;
  margin: 20px 0;
  border-collapse: collapse;
}
.ec-confirm-breakdown td {
  padding: 6px 0;
  font-size: 14px;
}
.ec-confirm-breakdown td.text-right {
  text-align: right;
}
.ec-confirm-breakdown tr.ec-discount-row td {
  color: #2e7d32;
  font-weight: 600;
}
.ec-confirm-breakdown tr.ec-subtotal-discounted td {
  border-top: 1px dashed #d0d7de;
  padding-top: 10px;
  font-weight: 600;
}
.ec-confirm-breakdown tr.ec-confirm-total td {
  border-top: 2px solid var(--ec-dark);
  padding-top: 10px;
  font-size: 18px;
  font-weight: 700;
  color: var(--ec-dark);
}
.ec-summary-total-wrap {
  border-top: 2px solid var(--ec-dark);
  padding-top: 12px;
  margin-bottom: 16px;
}
.ec-summary-total {
  font-size: 20px;
  font-weight: 700;
  color: var(--ec-dark);
  padding: 0;
  border: none;
  margin: 0;
}
#ec-submit-quote {
  width: 100%;
  padding: 14px;
  font-size: 16px;
  font-weight: 700;
  border-radius: var(--ec-radius-sm);
  background: var(--ec-primary);
  color: #fff;
  border: none;
  cursor: pointer;
  transition: all 0.2s;
  text-transform: none;
  letter-spacing: 0;
}
#ec-submit-quote:hover {
  background: var(--ec-dark);
}
#ec-submit-quote:disabled {
  background: var(--ec-border);
  color: var(--ec-text-muted);
  cursor: not-allowed;
}
.ec-disclaimer {
  font-size: 11px;
  color: var(--ec-text-muted);
  margin-top: 12px;
  text-align: center;
  line-height: 1.4;
}

/* Intent loading state */
.ec-intent-loading {
  text-align: center;
  padding: 80px 20px;
}
.ec-intent-spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--ec-border);
  border-top-color: var(--ec-primary);
  border-radius: 50%;
  animation: ec-spin 0.7s linear infinite;
  margin: 0 auto 16px;
}
@keyframes ec-spin {
  to {
    transform: rotate(360deg);
  }
}
.ec-empty-cart-msg {
  font-size: 15px;
  color: var(--ec-text-muted);
  margin-bottom: 16px;
}

/* ==========================================
   QUOTES TABLE (my-quotes list)
   ========================================== */
.ec-my-quotes h2 {
  margin-bottom: 20px;
}
.ec-quotes-table {
  width: 100%;
  border-collapse: collapse;
}
.ec-quotes-table th {
  background: var(--ec-bg-muted);
  padding: 10px 12px;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: var(--ec-text-muted);
  border-bottom: 2px solid var(--ec-border);
}
.ec-quotes-table td {
  padding: 12px;
  border-bottom: 1px solid var(--ec-border-light);
  vertical-align: middle;
}
.ec-quotes-table tr:hover {
  background: var(--ec-bg-muted);
}
.ec-quotes-table a {
  color: var(--ec-primary);
  font-weight: 600;
  text-decoration: none;
}
.ec-quotes-table a:hover {
  text-decoration: underline;
}

/* ==========================================
   QUOTE DETAIL
   ========================================== */
.ec-quote-detail {
  max-width: 900px;
}
.ec-quote-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--ec-border);
}
.ec-quote-title {
  display: flex;
  align-items: center;
  gap: 12px;
}
.ec-quote-title h2 {
  margin: 0;
  font-size: 22px;
}
.ec-quote-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.ec-renewal-info {
  background: var(--ec-warning-bg);
  padding: 10px 16px;
  border-radius: var(--ec-radius-sm);
  border-left: 3px solid var(--ec-warning);
  font-size: 13px;
  margin-bottom: 16px;
}
.ec-quote-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 16px;
  margin: 20px 0;
}
.ec-info-block {
  background: var(--ec-bg-muted);
  padding: 16px;
  border-radius: var(--ec-radius);
  border: 1px solid var(--ec-border-light);
}
.ec-info-block h3 {
  margin: 0 0 12px 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--ec-dark);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ec-info-block p {
  margin: 4px 0;
  font-size: 13px;
  color: var(--ec-text);
}
.ec-items-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 12px;
}
.ec-items-table th {
  background: var(--ec-dark);
  color: #fff;
  padding: 10px 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ec-items-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--ec-border-light);
  font-size: 13px;
}
.ec-items-table tfoot td {
  padding: 8px 12px;
}
.ec-total-label {
  text-align: right;
}
.ec-total-row td {
  border-top: 2px solid var(--ec-dark);
  font-size: 16px;
  font-weight: 700;
}

/* ==========================================
   PROFILES / ADDRESSES GRID (My Account)
   ========================================== */
.ec-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.ec-section-header h2 {
  margin: 0;
}
.ec-profiles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.ec-profile-card {
  background: #fff;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius);
  padding: 20px;
  position: relative;
  transition: box-shadow 0.2s;
}
.ec-profile-card:hover {
  box-shadow: var(--ec-shadow-md);
}
.ec-profile-card h3 {
  margin: 0 0 12px 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--ec-dark);
}
.ec-profile-card p {
  margin: 3px 0;
  font-size: 13px;
  color: var(--ec-text);
}
.ec-default-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  background: var(--ec-primary);
  color: #fff;
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.ec-card-actions {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--ec-border-light);
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

/* ==========================================
   MODALS
   ========================================== */
.ec-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ec-modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(2px);
}
.ec-modal-content {
  position: relative;
  background: #fff;
  border-radius: var(--ec-radius);
  padding: 32px;
  max-width: 540px;
  width: 92%;
  max-height: 85vh;
  overflow-y: auto;
  box-shadow: var(--ec-shadow-lg);
}
.ec-modal-close-x {
  position: absolute;
  top: 12px;
  right: 16px;
  background: none;
  border: none;
  font-size: 24px;
  color: var(--ec-text-muted);
  cursor: pointer;
  padding: 4px;
  line-height: 1;
}
.ec-modal-close-x:hover {
  color: var(--ec-text);
}
.ec-modal-title {
  margin: 0 0 24px 0;
  font-size: 20px;
  font-weight: 700;
  color: var(--ec-dark);
}
.ec-form-row {
  margin-bottom: 16px;
}
.ec-form-row label {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ec-text);
}
.ec-form-row input,
.ec-form-row textarea,
.ec-form-row select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius-sm);
  font-size: 14px;
  box-sizing: border-box;
  transition:
    border-color 0.15s,
    box-shadow 0.15s;
}
.ec-form-row input:focus,
.ec-form-row select:focus {
  border-color: var(--ec-primary);
  outline: none;
  box-shadow: 0 0 0 3px var(--ec-primary-light);
}
.ec-form-row-half {
  display: flex;
  gap: 12px;
}
.ec-form-row-half > div {
  flex: 1;
}
.ec-form-row-third {
  display: flex;
  gap: 12px;
}
.ec-form-row-third > div {
  flex: 1;
}
.ec-form-actions {
  display: flex;
  gap: 10px;
  margin-top: 24px;
}
.ec-form-actions .button.alt {
  background: var(--ec-primary);
  border-color: var(--ec-primary);
}

/* ==========================================
   CONFIRM PAGE
   ========================================== */
.ec-quote-confirm-page {
  padding: 48px 0;
}
.ec-confirm-box {
  text-align: center;
  padding: 48px 40px;
  background: #fff;
  border: 1px solid var(--ec-border);
  border-radius: var(--ec-radius);
  box-shadow: var(--ec-shadow-md);
  max-width: 600px;
  margin: 0 auto;
}
.ec-confirm-icon {
  font-size: 36px;
  color: var(--ec-success);
  background: var(--ec-success-bg);
  width: 72px;
  height: 72px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.ec-confirm-number {
  font-size: 28px;
  font-weight: 700;
  color: var(--ec-dark);
  margin: 8px 0 4px;
}
.ec-confirm-details {
  background: var(--ec-bg-muted);
  border-radius: var(--ec-radius-sm);
  padding: 16px 20px;
  margin: 24px auto;
  max-width: 380px;
  text-align: left;
}
.ec-confirm-details p {
  margin: 4px 0;
  font-size: 14px;
}
.ec-confirm-actions {
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 28px;
}

/* ==========================================
   QUOTE CTA BUTTON (product page)
   ========================================== */
.ec-quote-cta {
  margin-top: 8px;
}
.ec-quote-cta .button.alt {
  background: var(--ec-primary);
  border-color: var(--ec-primary);
  color: #fff;
}
.ec-quote-cta .button.alt:hover {
  background: var(--ec-primary-dark);
  border-color: var(--ec-primary-dark);
}

/* ==========================================
   RESPONSIVE
   ========================================== */
@media (max-width: 991px) {
  .ec-data-grid {
    grid-template-columns: 1fr;
  }
  .ec-methods-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .ec-page-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .ec-quote-header {
    flex-direction: column;
    align-items: flex-start;
  }
  .ec-quote-info-grid {
    grid-template-columns: 1fr;
  }
  .ec-profiles-grid {
    grid-template-columns: 1fr;
  }
  .ec-summary-box {
    position: static;
    margin-top: 24px;
  }
  .ec-form-row-half {
    flex-direction: column;
    gap: 0;
  }
  .ec-form-row-third {
    flex-direction: column;
    gap: 0;
  }
  .ec-quotes-table {
    font-size: 12px;
  }
  .ec-quotes-table th:nth-child(4),
  .ec-quotes-table td:nth-child(4) {
    display: none;
  }
  .ec-confirm-actions {
    flex-direction: column;
  }
  .ec-confirm-box {
    padding: 32px 20px;
  }

  /* Product table: stack on mobile */
  .ec-cart-table td {
    display: block;
    padding: 4px 0;
    border: none;
    text-align: left;
  }
  .ec-cart-table tr {
    display: block;
    padding: 16px 0;
    border-bottom: 1px solid var(--ec-border-light);
  }
  .ec-td-thumb {
    display: none;
  }
  .ec-td-name {
    padding-left: 0;
  }
  .ec-td-remove {
    position: absolute;
    right: 0;
    top: 16px;
  }
  .ec-cart-table tr {
    position: relative;
  }
  .ec-item-price::before {
    content: "Precio: ";
    font-weight: 600;
    font-size: 12px;
    color: var(--ec-text-muted);
  }
  .ec-item-subtotal::before {
    content: "Subtotal: ";
    font-weight: 600;
    font-size: 12px;
    color: var(--ec-text-muted);
  }
  .ec-item-price,
  .ec-item-subtotal {
    text-align: left;
  }

  /* Sticky mobile summary bar */
  .ec-summary-box {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
    border-radius: var(--ec-radius) var(--ec-radius) 0 0;
    border: none;
    border-top: 2px solid var(--ec-dark);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    padding: 16px 20px;
    max-height: 50vh;
    overflow-y: auto;
  }
  .ec-summary-box h3 {
    font-size: 14px;
    margin-bottom: 8px;
  }
  .ec-summary-lines {
    padding-bottom: 8px;
  }
  .ec-summary-line {
    font-size: 13px;
    padding: 4px 0;
  }
  .ec-summary-total {
    font-size: 18px;
  }
  .ec-disclaimer {
    display: none;
  }

  /* Give body padding so content isn't hidden behind fixed summary */
  .ec-quote-cart-page {
    padding-bottom: 240px;
  }
}

@media (max-width: 480px) {
  .ec-modal-content {
    padding: 24px 16px;
    width: 96%;
  }
  .ec-quote-cart-page .ec-section {
    padding: 16px;
  }
}

/* Utility: button wide */
.button.wide {
  width: 100%;
  text-align: center;
}

/* ==========================================================================
   ITEM 3 — MI CUENTA BUTTON HIERARCHY + MOBILE (v1.19.0)
   Presentation-only redesign. No PHP/JS logic touched. JS-hook classes
   (.ec-edit-*, .ec-delete-*, .ec-convert-btn, .ec-renew-btn,
   .ec-dropdown-toggle, .ec-modal-close, etc.) are preserved in markup;
   these rules only add visual tiers via presentational classes:
     .ec-cta         PRIMARY    solid indigo  (one per card/row/view region)
     .ec-cta-outline SECONDARY  indigo outline
     .ec-cta-danger  DESTRUCTIVE error-red ghost/outline (NEW, on-system)
     .ec-cta-quiet   QUIETEST   text-weight ghost (Ver / PDF / Marcar / Cancelar)

   Brand source of truth: Docs/elite-brand-guidelines/DESIGN.md
   tokens.css IS enqueued site-wide (verified functions.php L1258), so --ec-*
   is available on /my-account/. HOWEVER this file (top of ec-quotes.css)
   re-scopes --ec-primary to rgb(24,70,190) inside any [class*="ec-quote(s)-"]
   wrapper, which shadows the brand indigo on these very account screens. So
   the brand hex (#444ce7 / #272dcf / #e0e0ff / #dc2626) is written explicitly
   here with --ec-* fallbacks to guarantee the canonical Store indigo, not the
   legacy v1.1 blue. Hex values mirror DESIGN.md §2 exactly.
   ========================================================================== */

/* Re-assert brand indigo on the account/confirm wrappers so primary CTAs
   match the rest of the redesigned Store (defeats legacy --ec-primary remap
   at the top of this file for these surfaces only). */
.ec-my-shipping-addresses,
.ec-my-billing-profiles,
.ec-my-quotes,
.ec-quote-detail,
.ec-quote-confirm-page {
  --ec-primary: #444ce7;
  --ec-primary-dark: #272dcf;
  --ec-primary-light: #e0e0ff;
  --ec-error: #dc2626;
}

/* Shared geometry for all account button tiers. Scoped to account wrappers so
   we never touch cart/checkout/PDP buttons that legitimately use .button.alt. */
.ec-my-shipping-addresses .ec-cta,
.ec-my-shipping-addresses .ec-cta-outline,
.ec-my-shipping-addresses .ec-cta-danger,
.ec-my-shipping-addresses .ec-cta-quiet,
.ec-my-billing-profiles .ec-cta,
.ec-my-billing-profiles .ec-cta-outline,
.ec-my-billing-profiles .ec-cta-danger,
.ec-my-billing-profiles .ec-cta-quiet,
.ec-my-quotes .ec-cta,
.ec-my-quotes .ec-cta-outline,
.ec-my-quotes .ec-cta-danger,
.ec-my-quotes .ec-cta-quiet,
.ec-quote-detail .ec-cta,
.ec-quote-detail .ec-cta-outline,
.ec-quote-detail .ec-cta-quiet,
.ec-quote-confirm-page .ec-cta,
.ec-quote-confirm-page .ec-cta-outline,
.ec-quote-confirm-page .ec-cta-quiet {
  font-family: var(--ec-font-display, "Exo 2", sans-serif);
  text-transform: uppercase;
  border-radius: var(--ec-r-md, 8px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  line-height: 1;
  white-space: nowrap; /* kill "AGREGAR / EMPRESA" 2-line wrap on header CTAs */
  cursor: pointer;
  transition:
    background 0.18s,
    border-color 0.18s,
    color 0.18s,
    transform 0.12s,
    box-shadow 0.18s;
}

/* PRIMARY — solid indigo. Mirrors tokens.css .ec-cta. */
.ec-my-shipping-addresses .ec-cta,
.ec-my-billing-profiles .ec-cta,
.ec-my-quotes .ec-cta,
.ec-quote-detail .ec-cta,
.ec-quote-confirm-page .ec-cta {
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.08em;
  background: var(--ec-primary, #444ce7);
  color: #fff;
  border: 1px solid var(--ec-primary, #444ce7);
  box-shadow: var(
    --ec-shadow-ambient,
    0 1px 3px rgba(0, 0, 0, 0.1),
    0 1px 2px rgba(0, 0, 0, 0.06)
  );
}
.ec-my-shipping-addresses .ec-cta:hover,
.ec-my-billing-profiles .ec-cta:hover,
.ec-my-quotes .ec-cta:hover,
.ec-quote-detail .ec-cta:hover,
.ec-quote-confirm-page .ec-cta:hover {
  background: var(--ec-primary-dark, #272dcf);
  border-color: var(--ec-primary-dark, #272dcf);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: var(--ec-shadow-card, 0 4px 12px rgba(0, 0, 0, 0.08));
}

/* SECONDARY — indigo outline. Mirrors tokens.css .ec-cta-outline.
   The .button.alt / .button base from Woodmart paints a solid fill; these
   selectors carry equal/higher specificity (wrapper + class) so they win. */
.ec-my-shipping-addresses .ec-cta-outline,
.ec-my-billing-profiles .ec-cta-outline,
.ec-my-quotes .ec-cta-outline,
.ec-quote-detail .ec-cta-outline,
.ec-quote-confirm-page .ec-cta-outline {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.06em;
  background: transparent;
  color: var(--ec-primary, #444ce7);
  border: 1px solid var(--ec-primary, #444ce7);
  box-shadow: none;
}
.ec-my-shipping-addresses .ec-cta-outline:hover,
.ec-my-billing-profiles .ec-cta-outline:hover,
.ec-my-quotes .ec-cta-outline:hover,
.ec-quote-detail .ec-cta-outline:hover,
.ec-quote-confirm-page .ec-cta-outline:hover {
  background: var(--ec-primary-light, #e0e0ff);
  color: var(--ec-primary-dark, #272dcf);
  border-color: var(--ec-primary, #444ce7);
}

/* DESTRUCTIVE — error-red ghost/outline. NOT a solid red fill, NOT a
   side-stripe. On-system: transparent surface, error border + text, subtle
   error wash on hover. Lives only where "Eliminar" appears. */
.ec-my-shipping-addresses .ec-cta-danger,
.ec-my-billing-profiles .ec-cta-danger,
.ec-my-quotes .ec-cta-danger {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.06em;
  background: transparent;
  color: var(--ec-error, #dc2626);
  border: 1px solid
    color-mix(in srgb, var(--ec-error, #dc2626) 45%, transparent);
  box-shadow: none;
}
.ec-my-shipping-addresses .ec-cta-danger:hover,
.ec-my-billing-profiles .ec-cta-danger:hover,
.ec-my-quotes .ec-cta-danger:hover {
  background: color-mix(in srgb, var(--ec-error, #dc2626) 8%, transparent);
  color: var(--ec-error, #dc2626);
  border-color: var(--ec-error, #dc2626);
}

/* QUIETEST — text-weight ghost for least-frequent / utility actions:
   "Marcar principal", "Ver", "PDF" (in quotes table), "Cancelar",
   "Seguir Comprando", pager arrows, "Limpiar". Carries no color so only the
   primary CTA + status badge carry color in a row. */
.ec-my-shipping-addresses .ec-cta-quiet,
.ec-my-billing-profiles .ec-cta-quiet,
.ec-my-quotes .ec-cta-quiet,
.ec-quote-detail .ec-cta-quiet,
.ec-quote-confirm-page .ec-cta-quiet {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.05em;
  background: transparent;
  color: var(--ec-text-secondary, #44455a);
  border: 1px solid transparent;
  box-shadow: none;
}
.ec-my-shipping-addresses .ec-cta-quiet:hover,
.ec-my-billing-profiles .ec-cta-quiet:hover,
.ec-my-quotes .ec-cta-quiet:hover,
.ec-quote-detail .ec-cta-quiet:hover,
.ec-quote-confirm-page .ec-cta-quiet:hover {
  background: var(--ec-surface-2, #f2f4f6);
  color: var(--ec-text-primary, #060606);
  border-color: var(--ec-border, #e6e8ea);
}

/* Accessible focus ring on every tier (WCAG 2.4.7). */
.ec-my-shipping-addresses .ec-cta:focus-visible,
.ec-my-shipping-addresses .ec-cta-outline:focus-visible,
.ec-my-shipping-addresses .ec-cta-danger:focus-visible,
.ec-my-shipping-addresses .ec-cta-quiet:focus-visible,
.ec-my-billing-profiles .ec-cta:focus-visible,
.ec-my-billing-profiles .ec-cta-outline:focus-visible,
.ec-my-billing-profiles .ec-cta-danger:focus-visible,
.ec-my-billing-profiles .ec-cta-quiet:focus-visible,
.ec-my-quotes .ec-cta:focus-visible,
.ec-my-quotes .ec-cta-outline:focus-visible,
.ec-my-quotes .ec-cta-danger:focus-visible,
.ec-my-quotes .ec-cta-quiet:focus-visible,
.ec-quote-detail .ec-cta:focus-visible,
.ec-quote-detail .ec-cta-outline:focus-visible,
.ec-quote-detail .ec-cta-quiet:focus-visible,
.ec-quote-confirm-page .ec-cta:focus-visible,
.ec-quote-confirm-page .ec-cta-outline:focus-visible,
.ec-quote-confirm-page .ec-cta-quiet:focus-visible {
  outline: 2px solid var(--ec-primary, #444ce7);
  outline-offset: 2px;
}

/* Tighter padding for the small per-row/per-card action buttons (carry
   .button-small) vs the larger header / hero CTAs. */
.ec-my-shipping-addresses .button-small.ec-cta,
.ec-my-shipping-addresses .button-small.ec-cta-outline,
.ec-my-shipping-addresses .button-small.ec-cta-danger,
.ec-my-shipping-addresses .button-small.ec-cta-quiet,
.ec-my-billing-profiles .button-small.ec-cta,
.ec-my-billing-profiles .button-small.ec-cta-outline,
.ec-my-billing-profiles .button-small.ec-cta-danger,
.ec-my-billing-profiles .button-small.ec-cta-quiet,
.ec-my-quotes .button-small.ec-cta,
.ec-my-quotes .button-small.ec-cta-outline,
.ec-my-quotes .button-small.ec-cta-danger,
.ec-my-quotes .button-small.ec-cta-quiet {
  padding: 7px 13px;
  min-height: 34px;
}

/* Larger header / hero CTAs (no .button-small). */
.ec-section-header .ec-cta,
.ec-quote-actions .ec-cta,
.ec-quote-actions .ec-cta-outline,
.ec-rut-card-footer .ec-cta-outline,
.ec-confirm-actions .ec-cta,
.ec-confirm-actions .ec-cta-outline,
.ec-confirm-actions .ec-cta-quiet,
.ec-form-actions .ec-cta,
.ec-form-actions .ec-cta-quiet,
.ec-oc-block .ec-cta,
.ec-oc-block .ec-cta-outline {
  padding: 11px 20px;
  min-height: 44px; /* WCAG 2.5.5 target size */
}

/* ──────────────────────────────────────────────────────────────────────────
   MOBILE STRUCTURAL FIXES  (base = 390px mobile-first; lifts at 768px tablet)
   Benjamin-approved. CSS only; WC menu PHP untouched.
   ────────────────────────────────────────────────────────────────────────── */
@media (max-width: 767.98px) {
  /* (1) Collapse the tall stacked WooCommerce account nav into a single-row
     horizontal scroll chip strip so users reach section content faster.
     Scoped to the WC nav inside the account page only. */
  .woocommerce-account .woocommerce-MyAccount-navigation {
    margin-bottom: 16px;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 2px 8px;
    margin: 0;
    list-style: none;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation ul::-webkit-scrollbar {
    display: none;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li {
    flex: 0 0 auto;
    margin: 0;
    border: 0;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: inline-block;
    white-space: nowrap;
    padding: 8px 14px;
    border-radius: var(--ec-r-pill, 999px);
    border: 1px solid var(--ec-border, #e6e8ea);
    background: var(--ec-surface, #fff);
    color: var(--ec-text-secondary, #44455a);
    font-family: var(--ec-font-label, "Rajdhani", sans-serif);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1.2;
  }
  .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
  .woocommerce-account
    .woocommerce-MyAccount-navigation
    li.woocommerce-MyAccount-navigation-link--active
    a {
    background: var(--ec-black, #060606);
    color: #fff;
    border-color: var(--ec-black, #060606);
  }

  /* (2) Sticky bottom mobile nav (Inicio/Catalogo/Cotizar/Buscar/Mi Cuenta)
     overlaps the last card. Add bottom breathing room to the account content
     so nothing is hidden behind it. 96px ≈ sticky nav height + safe-area. */
  .woocommerce-account .woocommerce-MyAccount-content {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }

  /* (3) Buttons: full-width stacked, compact, never wrap awkwardly. */
  .ec-section-header {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .ec-section-header .ec-cta {
    width: 100%;
  }
  .ec-card-actions,
  .ec-rut-profile-actions,
  .ec-docs-actions,
  .ec-quote-actions,
  .ec-confirm-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .ec-card-actions > .ec-cta,
  .ec-card-actions > .ec-cta-outline,
  .ec-card-actions > .ec-cta-danger,
  .ec-card-actions > .ec-cta-quiet,
  .ec-rut-profile-actions > .ec-cta,
  .ec-rut-profile-actions > .ec-cta-outline,
  .ec-rut-profile-actions > .ec-cta-danger,
  .ec-rut-profile-actions > .ec-cta-quiet,
  .ec-quote-actions > .ec-cta,
  .ec-quote-actions > .ec-cta-outline,
  .ec-confirm-actions > .ec-cta,
  .ec-confirm-actions > .ec-cta-outline,
  .ec-confirm-actions > .ec-cta-quiet {
    width: 100%;
    min-height: 44px;
  }
  .ec-rut-card-footer .ec-cta-outline {
    width: 100%;
  }

  /* (4) PWA install banner at the very top eats space. It is an inert promo,
     not a logic surface — give the account content a touch of top spacing so
     it is not flush against the banner. (Banner logic untouched.) */
  .woocommerce-account .woocommerce-MyAccount-content {
    margin-top: 8px;
  }

  /* ────────────────────────────────────────────────────────────────────────
     (5) v1.19.1 FIX 1 — Mis Cotizaciones: table → stacked cards on mobile.
     The desktop 7-column table pushed the Acciones cell (Pagar/Ver/PDF)
     off-canvas at 390px, leaving the pay action unreachable. On mobile each
     <tr> becomes a self-contained card and each <td> a label/value row driven
     by the data-label attrs added in my-quotes.php. Desktop table is untouched
     (this lives only inside the mobile breakpoint).
     The client-side filter/pager JS toggles row.hidden — `tr[hidden]` keeps
     `display:none` so hidden cards stay hidden. ───────────────────────────── */
  .ec-quotes-table {
    border-collapse: separate;
    border-spacing: 0;
    font-size: 14px; /* override the legacy 12px shrink for table mode */
  }
  .ec-quotes-table thead {
    /* visually hidden but kept for a11y / screen readers */
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .ec-quotes-table tbody tr {
    display: block;
    background: var(--ec-surface, #fff);
    border: 1px solid var(--ec-border, #e6e8ea);
    border-radius: var(--ec-r-lg, 10px);
    padding: 14px 16px;
    margin-bottom: 14px;
    box-shadow: var(--ec-shadow-card, 0 4px 12px rgba(0, 0, 0, 0.08));
  }
  .ec-quotes-table tbody tr[hidden] {
    display: none; /* respect client-side filter/pager row.hidden toggling */
  }
  .ec-quotes-table tbody td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border: 0;
    text-align: right;
  }
  /* Re-show the "Valida hasta" column hidden by the legacy 768px rule —
     in card mode every field is a labelled row, so it belongs back. */
  .ec-quotes-table tbody td:nth-child(4) {
    display: flex;
  }
  .ec-quotes-table tbody td::before {
    content: attr(data-label);
    flex: 0 0 auto;
    text-align: left;
    font-family: var(--ec-font-label, "Rajdhani", sans-serif);
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ec-text-muted, #75768a);
  }
  /* Card title row: the COT id (first cell) reads larger, no label. */
  .ec-quotes-table tbody td:first-child {
    justify-content: flex-start;
    padding-bottom: 10px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--ec-border, #e6e8ea);
  }
  .ec-quotes-table tbody td:first-child::before {
    display: none;
  }
  .ec-quotes-table tbody td:first-child a {
    font-family: var(--ec-font-display, "Exo 2", sans-serif);
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 0.02em;
  }
  /* PDF + Acciones cells: full-width stacked buttons. The buttons are
     self-describing ("PDF", "Ver", "Pagar"), so the data-label is redundant
     here — hide it to avoid "PDF / PDF" and "ACCIONES / VER" double labels. */
  .ec-quotes-table tbody td[data-label="PDF"],
  .ec-quotes-table tbody td.ec-docs-actions {
    flex-direction: column;
    align-items: stretch;
    text-align: left;
    gap: 8px;
    padding-top: 4px;
  }
  .ec-quotes-table tbody td[data-label="PDF"]::before,
  .ec-quotes-table tbody td.ec-docs-actions::before {
    display: none;
  }
  .ec-quotes-table tbody td[data-label="PDF"] .button,
  .ec-quotes-table tbody td.ec-docs-actions .button {
    width: 100%;
    min-height: 40px;
    justify-content: center;
  }
  /* Quiet PDF/Ver get a light border on mobile so they read as tappable rows
     (still no color — quiet tier intact). Pagar/Comprar keep their solid fill. */
  .ec-quotes-table tbody td[data-label="PDF"] .ec-cta-quiet,
  .ec-quotes-table tbody td.ec-docs-actions .ec-cta-quiet {
    border: 1px solid var(--ec-border, #e6e8ea);
  }
  /* Pagar dropdown: full-width primary; menu drops below full-width. */
  .ec-quotes-table tbody td.ec-docs-actions .ec-dropdown {
    display: block;
    width: 100%;
  }
  .ec-quotes-table tbody td.ec-docs-actions .ec-dropdown-toggle {
    width: 100%;
    justify-content: center;
  }
  .ec-quotes-table tbody td.ec-docs-actions .ec-dropdown-menu {
    right: 0;
    left: 0;
    min-width: 0;
  }
  /* Status / OC chips inside the actions cell stay inline, centered. */
  .ec-quotes-table tbody td.ec-docs-actions .ec-badge {
    align-self: flex-start;
  }

  /* ────────────────────────────────────────────────────────────────────────
     (6) v1.19.1 FIX 2 — Mis Datos de Facturacion: the long footer button
     "+ Agregar dato de facturacion a esta empresa" was clipped on the right
     because of the global nowrap, and the fixed WhatsApp FAB (bottom-right)
     overlapped it. Allow THIS long button to wrap to multiple lines with auto
     height; short buttons (Editar/Eliminar/Marcar) keep nowrap. Add right
     padding inside the footer so the FAB never sits over the tap target, and
     a little extra bottom space on the last card. ──────────────────────────── */
  .ec-rut-card-footer {
    padding-right: 64px; /* clear the ~56px WhatsApp FAB at bottom-right */
  }
  .ec-rut-card-footer .ec-cta-outline.ec-add-billing-profile-btn {
    white-space: normal;
    line-height: 1.3;
    min-height: 44px;
    height: auto;
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
  }
  /* Extra breathing room under the last RUT card so the bottom nav + FAB
     never cover the footer button. (content already has 96px; the cards add
     their own clearance here for the FAB which floats higher than the nav.) */
  .ec-rut-cards .ec-rut-card:last-child {
    margin-bottom: 16px;
  }
}