/* imagen del artículo */
.card-imagen-articulo {
    width: fit-content;
}



/* ===================== ARTICULO.CSS ===================== */

/* --- Tabla de tallas y cantidades --- */
.tabla-articulo { table-layout: fixed; width: auto; font-size: 14px; margin: 0 auto; }
.tabla-articulo th, .tabla-articulo td { padding: .40rem .50rem; vertical-align: middle; }
.w-talla       { width: 60px; }
.w-cantidad    { width: 170px; }
.w-existencias { width: 90px; }
.col-talla      { text-align: left; white-space: nowrap; }
.col-cantidad   { text-align: center; }
.col-existencias{ display: none; text-align: center; }
.existencia-num {
    display: inline-block;
    min-width: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 13px;
    border: 1px solid #0d6efd;
    border-radius: 3px;
    padding: 2px 4px;
    height: 26px;
    line-height: 20px;
    background-color: #fff;
}
.tabla-articulo .col-cantidad .spinner-container { width: 140px; margin: 0 auto; display: inline-flex; }


 
/* --- Recuadro de cantidad (igual que carrito) --- */
.tabla-articulo .cantidad-text {
    min-width: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 13px;
    background-color: #ffffff;
    border: 1px solid #0d6efd;
    border-radius: 3px;
    padding: 2px 4px;
    height: 26px;
    line-height: 20px;
    display: inline;   /* ← cambiado */
    pointer-events: auto;  /* ← forzar que sea clickeable */
}


/* Quitar flechitas del input number */
.cantidad-text::-webkit-outer-spin-button,
.cantidad-text::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.cantidad-text {
    -moz-appearance: textfield;
}




/* ===== ARTICULO ===== */
.titulo-bordados { font-size: 18px; text-decoration: underline; text-align: center; }
.identificador { font-size: 12px; color: #0033A0; font-weight: bold; }
.ubicacion-bordado { font-size: 8px; font-weight: normal; font-family: Arial, sans-serif !important; }



/* ===== SIDEBAR ===== */
.sidebar { position: sticky; top: 70px; max-height: calc(100vh - 80px); overflow: auto; }
.sidebar-title { background: #1E3A8A; color: #fff; text-align: center; margin: 0; padding: 6px 8px; font-size: 14px; }
.sidebar-pill { background: #a00000; color: #fff; text-align: center; padding: 6px 8px; font-size: 12px; margin: 0; }

/* ===== CONTENEDOR BORDADOS ===== */
#contenedorBordados { display: none; }

/* ===== OVERFLOW ===== */
main, .container-fluid, .contenido, #aside-col { overflow: visible !important; z-index: auto; }



/* --- Contenedor de los botones +/- --- */
.tabla-articulo .col-cantidad .spinner-container {
    width: auto;
    margin: 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;                      /* espacio entre botón e input */
}


/* --- Botones ver/ocultar existencias --- */


.col-btn-existencias {
    width: 110px;
    text-align: center;
    vertical-align: middle;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    background-color: transparent !important;
}

.btn.btn-ver-existencias,
.btn.btn-ocultar-existencias {
  background-color: #1a56c4 !important;
  border-color: #1a56c4 !important;
  color: #fff !important;
  padding-top: 1px !important;
  padding-bottom: 1px !important;
  font-size: 9px !important;
  height: auto !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  width: 45px !important;
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
}

.btn-visible {
  display: flex !important;
}

.btn-oculto {
  display: none !important;
}




.col-btn-existencias,
td.col-btn-existencias {
    border: none !important;
    background-color: white !important;
}


.tabla-articulo {
    table-layout: fixed;
    width: 635px;
}


 
 /* --- Tabla compacta --- */
.table { border-collapse: collapse; margin-bottom: 0; }
.table th, .table td { vertical-align: middle; padding: 4px 8px; font-size: 12px; }
.table thead th { font-size: 12px; padding: 2px 4px; line-height: 1; }
.table tbody td { font-size: 11px; padding: 2px 4px; line-height: 1; }

/* ===== TABLA RESUMEN ===== */
.tabla-resumen {
    width: 100%;
    max-width: none;      /* ← sin límite para que se estire */
    flex: 1;              /* ← ocupa espacio igual a cada lado */
    font-size: 10px;
    margin-top: 4px;
}
.tabla-resumen td { padding: 6px 8px !important; vertical-align: middle; }
.tabla-resumen .label-resumen {
    background-color: #f8f9fa;
    font-weight: 600;
    font-size: 8px;
    width: 100px;
}
.tabla-resumen .valor-resumen {
    font-size: 14px;
    font-weight: bold;
    text-align: right;
}

/* ===== BOTÓN ===== */
.btn-agregar-carrito {
    background-color: #28a745;
    color: white;
    border: none;
    border-radius: 6px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.2s;
    flex-shrink: 0;
}
.btn-agregar-carrito:hover { background-color: #218838; }



/* ===== BORDADOS AREA ===== */
/*
.bordado-container { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; margin-top: 20px; }
.bordado-item img { width: 100%; max-height: 150px; object-fit: contain; border-radius: 5px; }

*/

.bordado-card {
    border: 2px solid #333;
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 15px;
}