/* ==========================================================================
   Casa Perfumista — Product name stacked v2
   Jerarquía: [badge categoría] [Inspiración] → nombre perfume (protagonista) → fabricante (secundario) → SKU
   ========================================================================== */

.cp-pname-stacked {
    display: flex !important;
    flex-direction: column !important;
    align-items: inherit;
    gap: 2px;
    line-height: 1.2;
    text-align: inherit;
    width: 100%;
    max-width: 100%;
    text-transform: none !important;
}

/* Cuando el container está centrado, centrar todo */
.text-center .cp-pname-stacked,
.align-items-center > .cp-pname-stacked,
.product__summary.text-center .cp-pname-stacked {
    align-items: center;
    text-align: center;
}

.cp-pname-stacked > span {
    display: block;
    overflow: hidden;
    max-width: 100%;
}

/* Badge categoría — fila propia, arriba de todo */
.cp-pname-cat {
    display: inline-block;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 3px;
    line-height: 1.4;
    margin-bottom: 3px;
}

.cp-pname-cat--c {
    background: #1a3a5c;
    color: #fff;
}

.cp-pname-cat--d {
    background: #7b2d5e;
    color: #fff;
}

.cp-pname-cat--n {
    background: #2d5a3d;
    color: #fff;
}

/* "Inspiración" etiqueta discreta */
.cp-pname-prefix {
    font-size: 9px;
    text-transform: uppercase;
    letter-spacing: 0.7px;
    color: #9a8f80;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* --- Nombre del perfume — PROTAGONISTA --- */
.cp-pname-perfume {
    font-size: 15px;
    font-weight: 700;
    color: #1a1410;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-clamp: 2;
    white-space: normal;
    line-height: 1.25;
    margin-top: 1px;
}

/* --- Fabricante — SECUNDARIO --- */
.cp-pname-maker {
    font-size: 10px;
    color: #8a7e72;
    font-weight: 400;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: 1px;
    letter-spacing: 0.2px;
}

/* --- SKU — discreto --- */
.cp-pname-sku {
    font-size: 9px;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
    color: #c0b4a8;
    letter-spacing: 0.5px;
    margin-top: 1px;
    font-weight: 500;
}

.cp-pname-plain {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Sobrescribir truncate nativo del h6 para que la estructura funcione */
h6.product__title,
h4.product__title,
.product__title { white-space: normal !important; text-overflow: clip !important; overflow: visible !important; }
h6.product__title.text-truncate,
h4.product__title.text-truncate,
.product__title.text-truncate { text-overflow: clip !important; }

/* Asegurar que el container del producto no recorte el nombre */
.product__summary { min-width: 0; }
.product__summary .cp-pname-stacked { word-break: break-word; }

/* Wrapper <a class="cp-pname-link"> NO debe sobrescribir tipografía del partial */
a.cp-pname-link {
    text-decoration: none !important;
    color: inherit !important;
    font-weight: inherit !important;
    font-size: inherit !important;
    text-transform: none !important;
    display: block;
    width: 100%;
}
a.cp-pname-link:hover .cp-pname-perfume { text-decoration: underline; }

/* ============ MOBILE (≤ 768px) — misma estructura, fuentes ajustadas ============ */
@media (max-width: 768px) {
    .cp-pname-stacked { gap: 1px; }
    .cp-pname-cat {
        font-size: 8px;
        padding: 1px 5px;
        letter-spacing: 0.8px;
        margin-bottom: 2px;
    }
    .cp-pname-prefix { font-size: 8px; letter-spacing: 0.5px; }
    .cp-pname-perfume {
        font-size: 13px;
        line-height: 1.2;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
    .cp-pname-maker { font-size: 9px; }
    .cp-pname-sku { font-size: 8px; }
}

/* ============ MOBILE muy pequeño (≤ 480px) ============ */
@media (max-width: 480px) {
    .cp-pname-cat {
        font-size: 7.5px;
        padding: 1px 4px;
        letter-spacing: 0.6px;
        margin-bottom: 2px;
    }
    .cp-pname-prefix { font-size: 7.5px; }
    .cp-pname-perfume { font-size: 12.5px; line-height: 1.18; }
    .cp-pname-maker { font-size: 8.5px; }
    .cp-pname-sku { display: none; }
}

/* ============ MOBILE ultra (≤ 360px) ============ */
@media (max-width: 360px) {
    .cp-pname-perfume { font-size: 12px; }
    .cp-pname-maker { font-size: 8px; }
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
    .cp-pname-prefix { color: #b8ada0; }
    .cp-pname-perfume { color: #f5ebe0; }
    .cp-pname-maker { color: #a09080; }
    .cp-pname-sku { color: #6b6056; }
}
[data-theme="dark"] .cp-pname-prefix { color: #b8ada0; }
[data-theme="dark"] .cp-pname-perfume { color: #f5ebe0; }
[data-theme="dark"] .cp-pname-maker { color: #a09080; }
[data-theme="dark"] .cp-pname-sku { color: #6b6056; }
