body{
    --ssq-test: red;
}

.ssq-message{
    margin-top:18px;
    padding:16px;
    background:#f7f9fb;
    border-left:4px solid #f39c12;
    border-radius:8px;
    font-size:.95rem;
}

.ssq-message strong{
    display:block;
    margin-bottom:8px;
}

.ssq-message p{
    margin:0;
    color:#555;
}

/* Tarjeta de producto */
.woocommerce ul.products li.product{
    background:#fff;
    border:1px solid #e5e7eb;
    border-radius:16px;
    overflow:hidden;
    padding:18px;
    transition:.25s ease;
    box-shadow:0 8px 24px rgba(0,0,0,.04);
}

.woocommerce ul.products li.product:hover{
    transform:translateY(-5px);
    box-shadow:0 18px 38px rgba(0,0,0,.10);
}

/* Imagen */
.woocommerce ul.products li.product img{
    border-radius:12px;
    margin-bottom:16px;
}

/* Título */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
    font-size:18px;
    font-weight:700;
    margin-bottom:12px;
}

/* Botón Ver detalles */
.woocommerce ul.products li.product .ssq-view-details{
    display:block;
    width:100%;
    text-align:center;
    background:#fff;
    color:#1f2937;
    border:1px solid #1f2937;
    border-radius:8px;
    padding:12px 14px;
    margin-bottom:10px;
    font-weight:600;
}

/* Botón Añadir a cotización */
.woocommerce ul.products li.product .add_to_cart_button{
    display:block;
    width:100%;
    text-align:center;
    background:#f5a400;
    color:#111;
    border-radius:8px;
    padding:12px 14px;
    font-weight:700;
}

.woocommerce ul.products li.product .add_to_cart_button:hover{
    opacity:.9;
}

/* Oculta el botón Ver carrito */
.added_to_cart{
    display:none !important;
}

.woocommerce ul.products li.product .ssq-add-quote{
    display:block;
    width:100%;
    text-align:center;
    background:#f5a400;
    color:#111;
    border:0;
    border-radius:8px;
    padding:12px 14px;
    font-weight:700;
    cursor:pointer;
}

/* Oculta el botón automático de Blocksy/WooCommerce en tarjetas */
.woocommerce ul.products li.product .ct-woo-card-actions{
    display:none !important;
}

.woocommerce ul.products li.product .ssq-add-quote{
    display:block;
    width:100%;
    text-align:center;
    background:#f5a400;
    color:#111;
    border:0;
    border-radius:8px;
    padding:12px 14px;
    font-weight:700;
    cursor:pointer;
}

.ssq-floating-counter{
    position:fixed;
    right:24px;
    bottom:24px;
    z-index:99999;
    display:flex;
    align-items:center;
    gap:8px;
    background:#111827;
    color:#fff;
    padding:14px 18px;
    border-radius:999px;
    box-shadow:0 12px 30px rgba(0,0,0,.25);
    cursor:pointer;
    font-weight:700;
}

.ssq-floating-icon{
    width:24px;
    height:24px;
    object-fit:contain;
}

.ssq-floating-count{
    background:#f5a400;
    color:#111;
    min-width:24px;
    height:24px;
    padding:0 7px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
}

.ssq-widget{
    position:fixed;
    right:24px;
    bottom:90px;
    width:360px;
    max-width:calc(100vw - 32px);
    background:#fff;
    border-radius:16px;
    box-shadow:0 18px 45px rgba(0,0,0,.22);
    z-index:99999;
    overflow:hidden;
    display:none;
}

.ssq-widget.is-open{
    display:block;
}

.ssq-widget-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 18px;
    background:#111827;
    color:#fff;
}

.ssq-widget-close{
    background:transparent;
    border:0;
    color:#fff;
    font-size:24px;
    cursor:pointer;
}

.ssq-widget-body{
    padding:16px;
    max-height:320px;
    overflow:auto;
}

.ssq-empty{
    margin:0;
    color:#666;
}

.ssq-widget-footer{
    padding:16px;
    border-top:1px solid #eee;
}

/*.ssq-whatsapp-btn{
    width:100%;
    border:0;
    border-radius:10px;
    padding:14px;
    background:#25D366;
    color:#fff;
    font-weight:700;
    cursor:pointer;
}*/




.ssq-whatsapp-btn{

    width:100%;
    height:54px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    border:none;
    border-radius:12px;

    background:#25D366;
    color:#fff;

    font-size:16px;
    font-weight:700;

    cursor:pointer;

    transition:.25s;

}

.ssq-whatsapp-btn:hover{

    background:#20b957;

}

.ssq-whatsapp-btn img{

    width:24px;
    height:24px;

}


/* -------------- SSQ ITEM ------------- */

.ssq-item{
    display:grid;
    grid-template-columns:86px 1fr 40px;
    gap:18px;
    align-items:center;
    padding:24px 0;
    border-bottom:1px solid #e5e7eb;
}

.ssq-item-image{
    display:flex;
    align-items:center;
    justify-content:center;
}

.ssq-item-image img{
    width:82px;
    height:82px;
    object-fit:contain;
}

.ssq-item-content{
    min-width:0;
}

.ssq-item-content strong{
    display:block;
    font-size:16px;
    line-height:1.35;
    font-weight:800;
    color:#111;
    margin-bottom:14px;
}

.ssq-qty-controls{
    display:grid;
    grid-template-columns:44px 54px 44px;
    width:max-content;
    height:46px;
    border:1px solid #d9dde3;
    border-radius:11px;
    overflow:hidden;
    background:#fff;
}

.ssq-qty-controls button{
    width:44px;
    height:46px;
    border:0;
    background:#fff;
    color:#111;
    font-size:22px;
    font-weight:700;
    cursor:pointer;
}

.ssq-qty-controls span{
    display:flex;
    align-items:center;
    justify-content:center;
    border-left:1px solid #d9dde3;
    border-right:1px solid #d9dde3;
    font-size:21px;
    font-weight:700;
    color:#111;
}

.ssq-remove{

    width:32px;
    height:32px;

    border:none;
    background:transparent;

    background-image:url("https://segurstep.com/wp-content/uploads/2026/07/botebasurapng.png");
    background-repeat:no-repeat;
    background-position:center;
    background-size:24px;

    cursor:pointer;

    transition:.25s;

}

.ssq-remove:hover{

    transform:scale(1.08);
    opacity:.85;

}

.ssq-remove::before{

    content:"";

}


.ssq-widget-title{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:18px;
    font-weight:700;

}

.ssq-widget-title img{

    width:26px;
    height:26px;
    object-fit:contain;

}

.ssq-whatsapp-btn{

    width:100%;
    height:54px;

    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;

    border:none;
    border-radius:12px;

    background:#25D366;
    color:#fff;

    font-size:16px;
    font-weight:700;

    cursor:pointer;

    transition:.25s;

}

.ssq-whatsapp-btn:hover{

    background:#20b957;

}

.ssq-whatsapp-btn img{

    width:24px;
    height:24px;

}

/* ----------------------------------------------------------- */
/* ------------------------- MOVILES ------------------------- */
/* ----------------------------------------------------------- */

@media (max-width: 480px){

    .ssq-widget{
        right:12px;
        left:12px;
        width:auto;
        bottom:86px;
    }

    .ssq-item{
        grid-template-columns:90px 1fr 34px;
        gap:14px;
        padding:22px 0;
    }

    .ssq-item-image{
        width:90px;
        min-width:90px;
    }

    .ssq-item-image img{
        display:block;
        width:90px;
        height:90px;
        object-fit:contain;
        max-width:90px;
    }

    .ssq-item-content strong{
        font-size:18px;
        line-height:1.25;
        margin-bottom:14px;
    }

    .ssq-qty-controls{
        grid-template-columns:42px 52px 42px;
        height:44px;
    }

    .ssq-remove{
        align-self:center;
    }
}