/* =========================================
FORM CART — FLEXBOX
Garantía: fila completa arriba
[- 1 +] [AÑADIR AL CARRITO] abajo
========================================= */
.woocommerce div.product form.cart {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 12px;
justify-content: flex-start !important;
align-items: stretch;
width: 100%;
margin-top: 12px;
padding: 0 !important;
}

/* =========================================
GARANTÍA — fila completa, siempre arriba
========================================= */
.woocommerce div.product form.cart .computron-extended-warranty {
flex: 0 0 100% !important;
width: 100% !important;
margin: 0 !important;
border: 1px solid #e5e5e5 !important;
border-radius: 12px;
padding: 10px 10px 10px 13px !important;
background: #fafafa;
box-sizing: border-box;
}

.woocommerce div.product form.cart .computron-extended-warranty__label {
display: block;
margin: 0 0 8px 0;
font-size: 14px;
font-weight: 700;
color: #333;
}

.woocommerce div.product form.cart .computron-extended-warranty__select {
width: 100% !important;
max-width: 100% !important;
min-height: 46px;
padding: 10px 14px;
border: 1px solid #dcdcdc;
border-radius: 10px;
background: #fff;
box-sizing: border-box;
outline: none;
transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.woocommerce div.product form.cart .computron-extended-warranty__select:hover {
border-color: #bfbfbf;
}

.woocommerce div.product form.cart .computron-extended-warranty__select:focus {
border-color: #0071e3;
box-shadow: 0 0 0 2px rgba(0, 113, 227, 0.15);
}

/* =========================================
MENSAJE / RESUMEN
========================================= */
/* Header: botón único "Garantía Extendida 🛡" */
.computron-extended-warranty__info-btn {
-webkit-appearance: none;
appearance: none;
display: inline-flex;
align-items: center;
gap: 5px;
background: none !important;
border: none !important;
padding: 0 !important;
margin: 0 0 8px 0 !important;
cursor: pointer;
font-size: 17px !important;
font-weight: 700 !important;
color: #333 !important;
text-align: left;
text-transform: none !important;
letter-spacing: normal !important;
line-height: 1.4;
transition: color 0.15s;
box-shadow: none !important;
}

.computron-extended-warranty__info-btn span {
display: inline;
color: #ff1900;
}

.computron-extended-warranty__info-btn:hover span {
color: #ff1900;
}

.computron-extended-warranty__info-btn svg {
display: block;
flex-shrink: 0;
width: 16px;
height: 16px;
color: #0071e3;
position: relative;
top: -1px;
transition: transform 0.12s;
}

.computron-extended-warranty__info-btn {
position: relative;
}

.computron-extended-warranty__info-btn:hover {
color: #0071e3 !important;
}

.computron-extended-warranty__info-btn:hover svg {
transform: scale(1.15);
}

.computron-extended-warranty__info-btn::after {
content: attr(data-tooltip);
position: absolute;
bottom: calc(100% + 6px);
left: 0;
background: #222;
color: #fff;
font-size: 11px !important;
font-weight: 400 !important;
white-space: nowrap;
padding: 4px 8px;
border-radius: 4px;
pointer-events: none;
opacity: 0;
transform: translateY(4px);
transition: opacity 0.15s, transform 0.15s;
z-index: 10;
}

.computron-extended-warranty__info-btn:hover::after {
opacity: 1;
transform: translateY(0);
}

/* =========================================
MENSAJE / RESUMEN
========================================= */
.computron-extended-warranty__message,
.computron-extended-warranty__summary {
margin: 8px 0 0;
font-size: 14px;
}

.computron-extended-warranty__summary {
font-weight: 500;
line-height: 1.5;
}

.computron-extended-warranty__total-line {
display: block;
margin-top: 4px;
font-size: 13px;
color: #333;
line-height: 1.5;
word-break: break-word;
}

.computron-extended-warranty__total-line em {
font-style: normal;
color: #0071e3;
font-weight: 700;
}

.computron-warranty-total-amount {
font-size: 18px;
font-weight: 700;
color: #111;
}

/* =========================================
MODAL DE INFORMACIÓN
========================================= */
#computron-warranty-modal {
display: none;
position: fixed;
inset: 0;
z-index: 99999;
}

#computron-warranty-modal.is-open {
display: block;
}

.computron-warranty-modal__overlay {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.55);
}

.computron-warranty-modal__box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: none;
border-radius: 0;
padding: 0;
width: auto;
max-width: 90vw;
max-height: 92vh;
overflow: visible;
box-shadow: none;
}

.computron-warranty-modal__box img {
display: block;
width: auto;
height: auto;
max-width: 90vw;
max-height: 92vh;
object-fit: contain;
border-radius: 8px;
}

.computron-warranty-modal__close {
position: absolute;
top: 8px;
right: 8px;
background: rgba(0, 0, 0, 0.6);
border: none;
border-radius: 50%;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
line-height: 1;
cursor: pointer;
color: #fff;
padding: 0;
z-index: 1;
}

.computron-warranty-modal__close:hover {
background: rgba(0, 0, 0, 0.85);
}

.computron-warranty-modal__no-image {
padding: 16px;
text-align: center;
color: #666;
font-size: 14px;
line-height: 1.6;
}

.computron-warranty-modal__no-image code {
background: #f3f3f3;
padding: 2px 6px;
border-radius: 4px;
font-size: 12px;
}

/* =========================================
CANTIDAD
========================================= */
.woocommerce div.product form.cart .quantity {
flex: 0 0 auto;
order: 2;
margin: 0 0 0 -12px !important;
padding: 0 !important;
}

.woocommerce div.product form.cart .quantity .number-button {
margin: 0 !important;
padding: 0 !important;
}

.woocommerce div.product form.cart .quantity .qty {
width: 80px;
min-height: 56px;
border: 1px solid #d9d9d9;
border-radius: 10px;
text-align: center;
font-size: 16px;
font-weight: 600;
background: #f8f8f8;
box-sizing: border-box;
padding: 0 8px;
}

/* =========================================
Oculta divs/spans desconocidos del tema que
no son cantidad, garantía ni botón añadir
========================================= */
.woocommerce div.product form.cart > *:not(.computron-extended-warranty):not(.quantity):not(.single_add_to_cart_button):not(input):not(button):not(a) {
display: none !important;
}

/* =========================================
BOTONES +/- del tema (button o a sueltos,
fuera de .quantity)
========================================= */
.woocommerce div.product form.cart > button:not(.single_add_to_cart_button),
.woocommerce div.product form.cart > a:not(.single_add_to_cart_button) {
flex: 0 0 auto;
order: 2;
min-height: 56px;
min-width: 44px;
border: 1px solid #d9d9d9;
border-radius: 10px;
background: #f8f8f8;
font-size: 20px;
font-weight: 600;
cursor: pointer;
display: flex !important;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 0 12px;
margin: 0 !important;
text-decoration: none;
}

/* =========================================
BOTÓN AÑADIR — ocupa el resto de la fila
========================================= */
.woocommerce div.product form.cart .single_add_to_cart_button {
flex: 1 1 0;
min-width: 0;
order: 2;
min-height: 56px;
margin: 0 !important;
border-radius: 10px !important;
font-size: 16px;
font-weight: 700;
text-transform: uppercase;
white-space: nowrap;
display: flex !important;
align-items: center;
justify-content: center;
padding: 12px 20px;
box-sizing: border-box;
}

/* =========================================
RESPONSIVE MÓVIL
========================================= */
@media (max-width: 767px) {
body .woocommerce div.product form.cart .quantity .number-button {
 margin: 0 !important;
 padding: 0 !important;
}
.computron-warranty-total-summary {
 display: block;
 margin-top: 2px;
}
.computron-warranty-arrow {
 display: none;
}
.computron-warranty-modal__box img {
 max-width: 92vw;
 max-height: 92vh;
}
}