/*
==========================================================
VANTI BOXES
Premium UI v1.1
==========================================================
*/

/*=========================================================
ACCORDION
=========================================================*/

.Table-Group{position:relative; width:100%; background:#fff;}
.Table-Group .wp-block-columns{margin:0!important; padding:0!important;} /* Reset Gutenberg */

/*=========================================================
PRODUCT ROW
=========================================================*/

.Table-Group .Table-Row{width:100%; display:grid; grid-template-columns:90px 1fr auto; gap:10px; align-items:center; padding:28px 22px; margin:0!important; background:#fff; cursor:pointer; transition:background .25s ease;}
.Table-Group .Table-Row img{width:90px!important; height:60px!important; object-fit:cover; border-radius:0; display:block;}
.Table-Group .Table-Row em{display:none; margin:0; font-style:normal; font-size:12px!important; color:#777; line-height:1.55;}

.Table-Group .vb-item{margin-top:0;}
.Table-Group .vb-item.vb-open{margin-top:10px!important;}
.Table-Group.vb-open .table-btn{
    margin-bottom:20px;
}

/* Centrado vertical perfecto */
.Table-Group .Table-Row > .wp-block-column{
    display:flex;
    align-items:center; 
}

/* Eliminar márgenes de Gutenberg */
.Table-Group .Table-Row p,
.Table-Group .Table-Row figure{
    margin:0!important;
}

.Table-Group .vb-item{
    border-top:none;
    padding-top:0;
}

.Table-Group.vb-open .vb-item{
    border-top:1px solid #f1f1f1;
    padding-top:16px;
}

.Table-Group .Table-Row{
    cursor:pointer;
    transition:all .25s ease;
}

.Table-Group .Table-Row:hover{
    background:#fafafa;
}

.Table-Group .vb-no-popup{
    cursor:default;
}

.Table-Group .vb-no-popup:hover{
    background:#fff;
}

.Table-Group .vb-no-popup .vb-arrow{
    display:none;
}

/* Filas sin popup (sin imagen) */
.Table-Group .Table-Row.vb-no-popup{
    grid-template-columns:1fr auto;
}

.Table-Group .Table-Row.vb-no-popup strong:first-child{
    white-space:nowrap;
}

/*=========================================================
BUTTONS
=========================================================*/

.Table-Group .wp-block-buttons{display:flex!important; width:100%!important;}
.Table-Group .wp-block-button{flex:1 1 auto!important; width:100%!important; margin:0!important;}
.Table-Group .wp-block-button__link{display:block!important; width:100%!important; max-width:none!important; box-sizing:border-box!important; text-align:center!important; border-radius:3px!important; background:whitesmoke!important; color:#111!important;}

/*=========================================================
HEADER
=========================================================*/

.Table-Group .vb-header{display:block!important;}
.Table-Group .vb-header>.wp-block-column{flex-basis:100%!important; width:100%!important; max-width:100%!important;}
.Table-Group .vb-header .wp-block-buttons{display:block!important; width:100%!important;}
.Table-Group .vb-header .wp-block-button{width:100%!important;}
.Table-Group .vb-header .wp-block-button__link{display:block!important; width:100%!important; max-width:100%!important;}

/*=========================================================
LIGHTBOX
=========================================================*/

.vb-lightbox{position:fixed; inset:0; z-index:999999; visibility:hidden; opacity:0; transition:opacity .28s ease;}
.vb-lightbox.vb-visible{visibility:visible; opacity:1;}
.vb-overlay{position:absolute; inset:0; background:rgba(0,0,0,.70); backdrop-filter:blur(3px);}
.vb-window{position:relative; width:min(800px,92vw); max-height:90vh; margin:5vh auto; background:#fff; border-radius:7px; overflow:auto; box-shadow:0 12px 20px rgba(0,0,0,.18); transform:scale(.96); transition:transform .28s ease;}
.vb-visible .vb-window{transform:scale(1);}
.vb-close{position:absolute; top:16px; right:16px; width:44px; height:44px; padding:0!important; border:1px solid #000; border-radius:50%; background:#fff; color:#000; font-size:24px; font-weight:300; line-height:42px; cursor:pointer;}
.vb-image{display:flex;}
.vb-image img{width:100%!important; min-height:50vh!important; aspect-ratio:2/4; object-fit:cover; border-radius:4px; display:block;}
.vb-title{margin:0 0 14px; font-size:3em; font-weight:200; color:#111; letter-spacing:-2px;}
.vb-description{margin-bottom:24px; font-size:15px; line-height:1.4; color:#666; }
.vb-price{font-size:2em; font-weight:700; color:#111; letter-spacing:-2px;}
body.vb-lock{overflow:hidden;}

.vb-content{
    display:grid;
    grid-template-columns:400px 1fr;
    gap:36px;
    padding:36px;
    align-items:center;
}

.vb-info{
    display:flex;
    flex-direction:column;
    justify-content:center;
    min-height:100%;
}

.vb-no-description .vb-info{
    justify-content:center;
}

/*=========================================================
RESPONSIVE
=========================================================*/

@media (max-width:768px){

.Table-Group>.Table-Row:first-child{min-height:74px; padding:18px 20px;}
.Table-Group>.Table-Row:not(:first-child){grid-template-columns:95px 1fr; gap:18px; padding:18px;}
.Table-Group>.Table-Row:not(:first-child) img{width:95px; height:94px;}
.Table-Group>.Table-Row:not(:first-child) strong:first-of-type{font-size:16px;}
.Table-Group>.Table-Row:not(:first-child) em{font-size:13px;}
.Table-Group>.Table-Row:not(:first-child) strong:last-of-type{font-size:16px;}

.vb-window{width:95vw; margin:2vh auto; max-height:96vh; border-radius:18px;}
.vb-content{grid-template-columns:1fr; gap:24px; padding:24px;}
.vb-image{max-width:340px; margin:0 auto;}
.vb-title{font-size:26px;}
.vb-price{font-size:28px;}

}