/* ==========================================================
   Página de producto: bloque de compra, descripción y reseñas
   ========================================================== */

/* Precio regular en negro: el rojo queda solo para precios rebajados */
.details__product .details__price .price__black {
    color: #111 !important;
    font-size: 20px !important;
    font-weight: 700 !important;
}
.details__product .details__price .price__regular {
    font-size: 20px !important;
    font-weight: 700 !important;
}

/* Títulos de opciones (Color, Talla, Cantidad) */
.details__product .details__sizes .title,
.details__product .details__buy .title {
    margin-bottom: 8px;
    color: #111 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: .02em;
    text-transform: none !important;
}
.details__product .details__sizes .title strong {
    font-weight: 500;
    color: #4b5563;
}

/* Colores en cuadros, con el color actual marcado */
.op-pdp-colors {
    margin-bottom: 16px;
}
.op-pdp-colors .colors {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.op-pdp-swatch {
    display: inline-flex;
    padding: 3px;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: border-color .2s ease;
}
.op-pdp-swatch:hover {
    border-color: #9ca3af;
}
.op-pdp-swatch.is-active {
    border-color: #111;
}
.op-pdp-swatch .colors-box {
    width: 30px !important;
    height: 30px !important;
    margin: 0 !important;
    border: 1px solid #d1d5db;
    border-radius: 2px !important;
    overflow: hidden;
    cursor: pointer;
}
.op-pdp-swatch .colors-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Tallas */
.details__product .switch-field label {
    border-radius: 4px !important;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.details__product .switch-field label:hover {
    border-color: #111 !important;
}
.details__product .switch-field input:checked + label {
    background: #111 !important;
    border-color: #111 !important;
    color: #fff !important;
}

/* Cantidad + Agregar al carrito: misma altura y botón protagonista */
.details__product .controls__buy {
    align-items: stretch;
    gap: 8px;
    height: auto !important;
}
.details__product .controls__buy .add_button {
    height: 48px !important;
    border-radius: 4px;
}
.details__product .controls__buy .button__less,
.details__product .controls__buy .button__add {
    width: 40px;
    cursor: pointer;
}
.details__product .controls__buy .input__quantity {
    width: 48px !important;
    text-align: center;
}
.details__product .button__add__cart {
    flex: 1 1 auto;
    max-width: 360px;
    height: 48px !important;
    margin-left: 0 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .06em;
    transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.details__product .button__add__cart:hover {
    background: #08182d !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(14, 34, 62, .25);
}
.details__product .button__add__cart:active {
    transform: translateY(0);
    box-shadow: none;
}

/* Beneficios bajo el botón */
.op-pdp-trust {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 460px;
    margin: 20px 0 0;
    padding: 16px 0 0;
    border-top: 1px solid #ececec;
    list-style: none;
}
.op-pdp-trust li {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #374151;
    font-size: 13px;
    line-height: 1.35;
}
.op-pdp-trust strong {
    color: #111;
    font-weight: 600;
}
.op-pdp-trust a {
    color: #111;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.op-pdp-trust svg,
.op-pdp-help svg {
    flex: none;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: #0E223E;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.op-pdp-help {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    padding: 10px 14px;
    border-radius: 6px;
    background: #f4f5f7;
    color: #374151;
    font-size: 13px;
    text-decoration: none;
    transition: background-color .2s ease;
}
.op-pdp-help:hover {
    background: #e9ecf1;
}
.op-pdp-help strong {
    color: #0E223E;
    font-weight: 600;
}

/* ===== Descripción, composición y reseñas ===== */
.acc-prod {
    border-radius: 0 !important;
}
.acc-prod__header {
    padding: 16px 12px !important;
    font-size: 13px;
    letter-spacing: .06em !important;
}
.acc-prod__preview {
    color: #4b5563 !important;
}
.acc-prod__summary {
    font-weight: 500 !important;
}

.comment-card {
    padding: 22px !important;
    border-radius: 8px !important;
    background: #fafafa !important;
}
.comment-card__title {
    margin: 0 0 6px !important;
    font-size: 15px !important;
    letter-spacing: .06em !important;
}
.comment-card__subtitle {
    margin: 0 0 16px;
    color: #4b5563;
    font-size: 13px;
    line-height: 1.5;
}
.comment-form {
    gap: 16px !important;
}
.comment-form__label {
    color: #374151 !important;
    font-size: 12px !important;
    letter-spacing: .06em !important;
}
.comment-form__input,
.comment-form__textarea {
    border-color: #d1d5db !important;
    border-radius: 6px !important;
    background: #fff;
    font-size: 15px !important;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.comment-form__input:focus,
.comment-form__textarea:focus {
    border-color: #0E223E !important;
    box-shadow: 0 0 0 3px rgba(14, 34, 62, .12);
}
.comment-form__textarea {
    min-height: 110px !important;
}
.comment-rating {
    align-self: flex-start;
    gap: 2px !important;
}
.comment-rating label {
    font-size: 30px !important;
    color: #d1d5db !important;
    transition: color .15s ease, transform .15s ease;
}
.comment-rating input:checked ~ label,
.comment-rating label:hover,
.comment-rating label:hover ~ label {
    color: #f5a623 !important;
}
.comment-rating label:hover {
    transform: scale(1.1);
}
.comment-rating input:focus-visible + label {
    outline: 2px solid #0E223E;
    outline-offset: 2px;
    border-radius: 2px;
}
.comment-form__actions {
    padding-right: 0 !important;
}
.comment-form__submit {
    min-width: 180px;
    height: 44px;
    padding: 0 20px !important;
    border-radius: 4px !important;
    background: #0E223E !important;
    font-size: 14px !important;
    font-weight: 600;
    letter-spacing: .04em;
    transition: background-color .2s ease;
}
.comment-form__submit:hover {
    background: #08182d !important;
}

@media (max-width: 767px) {
    .details__product .button__add__cart {
        max-width: none;
    }
    .op-pdp-trust {
        max-width: none;
    }
    .op-pdp-help {
        display: flex;
    }
    .comment-card {
        padding: 18px !important;
    }
    .comment-form__submit {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .details__product .button__add__cart,
    .comment-rating label {
        transition: none;
    }
}
