/* === AiDo WooCommerce Plus – Cart+ CSS === */

/* -------- Base -------- */
.ewcp { --ewcp-gap: 24px; }
.ewcp .ewcp-section { background:#fff; border:1px solid #e6e6e6; border-radius:12px; padding:20px; margin-bottom:var(--ewcp-gap); }
.ewcp .ewcp-title { font-weight:700; margin:0 0 16px; }

/* Cabeceras / lista (conservador) */
.ewcp .ewcp-head { display:grid; grid-template-columns:1fr 140px 160px 160px; gap:16px; padding:0 8px 10px; border-bottom:1px solid #efefef; color:#6b7280; font-weight:600; }
.ewcp .ewcp-list .ewcp-item { display:grid; grid-template-columns:1fr 140px 160px 160px; gap:16px; align-items:center; padding:14px 8px; border-bottom:1px dashed #f0f0f0; }
.ewcp .ewcp-product { display:flex; align-items:center; gap:12px; }
.ewcp .ewcp-thumb img { width:56px; height:56px; object-fit:contain; }

/* Inputs */
.ewcp .ewcp-input { width:100%; height:40px; border:1px solid #e6e6e6; border-radius:10px; padding:0 12px; outline:none; background:#fff; }
.ewcp .ewcp-row { display:flex; flex-direction:column; gap:8px; margin-bottom:14px; }
.ewcp .ewcp-label { color:#6b7280; }

/* -------- ICONOS: color/tamaño/alineación (SVG fallback + FontAwesome) -------- */
.ewcp .ewcp-qty button,
.ewcp .ewcp-remove,
.ewcp .ewcp-select-icon {
  --ewcp-icon-color: #1f2937;          /* gris oscuro */
  color: var(--ewcp-icon-color);
}

/* SVG fallback */
.ewcp .ewcp-qty button .ewcp-ico,
.ewcp .ewcp-remove .ewcp-ico,
.ewcp .ewcp-select-icon .ewcp-ico {
  width:16px; height:16px; display:inline-block; vertical-align:middle;
}

/* <i> de Font Awesome (si Elementor lo usa) */
.ewcp .ewcp-qty button i,
.ewcp .ewcp-remove i,
.ewcp .ewcp-select-icon i {
  font-size:16px; line-height:1; display:inline-block; vertical-align:middle;
}

/* Botones +/- y eliminar */
.ewcp .ewcp-qty { display:flex; align-items:center; gap:8px; }
.ewcp .ewcp-qty-input { width:64px; height:38px; text-align:center; border:1px solid #e6e6e6; border-radius:10px; }

.ewcp .ewcp-qty button,
.ewcp .ewcp-remove {
  width:44px; height:38px;
  border:1px solid #e6e6e6; border-radius:10px;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  transition: all .15s ease-in-out;
}
.ewcp .ewcp-qty button:hover,
.ewcp .ewcp-remove:hover {
  border-color:#c81d25;
  color:#c81d25;
  background:#fff;
}

/* -------- Select con chevrón -------- */
.ewcp .ewcp-select { position:relative; }
.ewcp .ewcp-select select {
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  padding-right:42px;              /* deja espacio al icono */
  background-color:#fff;
}
.ewcp .ewcp-select .ewcp-select-icon {
  position:absolute; right:12px; top:50%; transform:translateY(-50%);
  display:flex; align-items:center; justify-content:center;
  width:18px; height:18px;
  color:#111;                      /* visible en fondo blanco */
  pointer-events:none;
  z-index:3;                       /* por encima del select */
}

/* Totales y acciones */
.ewcp .ewcp-row-total { border-top:1px dashed #efefef; padding-top:10px; font-weight:700; }
.ewcp .ewcp-actions { display:flex; gap:12px; margin-top:16px; flex-wrap:wrap; }
.ewcp .ewcp-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:44px; padding:10px 16px; background:#111; color:#fff; border-radius:10px; text-decoration:none; }
.ewcp .ewcp-btn.full { width:100%; }
.ewcp .ewcp-btn:hover { filter:brightness(1.05); }

/* -------- Layouts -------- */
.ewcp-layout-one-col { display:grid; gap:var(--ewcp-gap); }

.ewcp-layout-two-col {
  display:grid; gap:var(--ewcp-gap);
  grid-template-columns:3fr 2fr;
  grid-template-areas:
    "order ship"
    "order totals";
}
.ewcp-layout-two-col .ewcp-order  { grid-area:order; }
.ewcp-layout-two-col .ewcp-ship   { grid-area:ship; }
.ewcp-layout-two-col .ewcp-totals { grid-area:totals; }

.ewcp-layout-1c-2r {
  display:grid; gap:var(--ewcp-gap);
  grid-template-columns:1fr 1fr;
  grid-template-areas:
    "order order"
    "ship totals";
}
.ewcp-layout-1c-2r .ewcp-order  { grid-area:order; }
.ewcp-layout-1c-2r .ewcp-ship   { grid-area:ship; }
.ewcp-layout-1c-2r .ewcp-totals { grid-area:totals; }

.ewcp-layout-2r-1c {
  display:grid; gap:var(--ewcp-gap);
  grid-template-columns:3fr 2fr;
  grid-template-areas:
    "order totals"
    "ship totals";
}
.ewcp-layout-2r-1c .ewcp-order  { grid-area:order; }
.ewcp-layout-2r-1c .ewcp-ship   { grid-area:ship; }
.ewcp-layout-2r-1c .ewcp-totals { grid-area:totals; }

/* -------- Responsive -------- */
@media (max-width: 992px) {
  .ewcp .ewcp-head,
  .ewcp .ewcp-list .ewcp-item { grid-template-columns:1fr 120px 150px 150px; }
  .ewcp-layout-two-col,
  .ewcp-layout-1c-2r,
  .ewcp-layout-2r-1c {
    grid-template-columns:1fr; grid-template-areas:"order" "ship" "totals";
  }
}

/* --- AiDo WCP: control de visibilidad y estados del bloque de métodos --- */
.ewcp .ewcp-ship-methods { display: none; }              /* oculto por defecto (evita FOUC) */
.ewcp .ewcp-ship-methods.is-visible { display: flex; }   /* lo muestra cuando hay datos */
.ewcp .ewcp-ship-methods.is-loading { display: flex; }   /* visible durante la búsqueda */
.ewcp .ewcp-ship-methods.is-loading .ewcp-ship-label,
.ewcp .ewcp-ship-methods.is-loading .ewcp-select-icon { display: none; } /* sin label/chevrón */

.ewcp .ewcp-ship-loading {
  width: 100%;
  min-height: 40px;
  border: 1px solid #e6e6e6;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: #6b7280;
  background: #fafafa;
}

/* --- AiDo WCP: disposición de filas en “Resumen” --- */
.ewcp .ewcp-section.ewcp-totals .ewcp-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.ewcp .ewcp-section.ewcp-totals .ewcp-row .ewcp-label { 
  margin: 0; 
}

.ewcp .ewcp-section.ewcp-totals .ewcp-row .ewcp-value { 
  margin: 0; 
}

/* Mantener estilos especiales del total */
.ewcp .ewcp-section.ewcp-totals .ewcp-row.ewcp-row-total {
  border-top: 1px dashed #efefef; 
  padding-top: 10px; 
  font-weight: 700;
}

/* No aplicar layout a los botones de acción */
.ewcp .ewcp-section.ewcp-totals .ewcp-actions {
  display: flex;
  gap: 12px;
  margin-top: 16px;
  flex-wrap: wrap;
}