.ads-ctsbi-panel{
    border:var(--ads-ctsbi-panel-border-width,1px) solid var(--ads-ctsbi-panel-border,#e2e2e2);
    border-radius:var(--ads-ctsbi-panel-radius,12px);
    padding:var(--ads-ctsbi-panel-padding,18px);
    margin:var(--ads-ctsbi-panel-margin-top,20px) 0 var(--ads-ctsbi-panel-margin-bottom,20px);
    background:var(--ads-ctsbi-panel-bg,#fff);
    color:var(--ads-ctsbi-panel-text,#222);
    box-shadow:var(--ads-ctsbi-panel-shadow,0 2px 10px rgba(0,0,0,.04));
    max-width:var(--ads-ctsbi-panel-max-width,0);
}
.ads-ctsbi-panel[style],.ads-ctsbi-panel{box-sizing:border-box}
.ads-ctsbi-head h3{
    margin:0 0 var(--ads-ctsbi-title-margin-bottom,6px);
    font-size:var(--ads-ctsbi-title-size,20px);
    color:var(--ads-ctsbi-title-color,var(--ads-ctsbi-panel-text,#222));
    font-weight:var(--ads-ctsbi-title-weight,600);
    line-height:var(--ads-ctsbi-title-line-height,1.2);
}
.ads-ctsbi-head p{
    margin:0 0 var(--ads-ctsbi-intro-margin-bottom,14px);
    color:var(--ads-ctsbi-panel-muted,#555);
    font-size:var(--ads-ctsbi-intro-size,14px);
    line-height:var(--ads-ctsbi-intro-line-height,1.5);
}
.ads-ctsbi-items{display:grid;gap:var(--ads-ctsbi-items-gap,12px)}
.ads-ctsbi-item{
    display:grid;
    grid-template-columns:var(--ads-ctsbi-image-size,72px) 1fr auto;
    gap:var(--ads-ctsbi-item-gap,14px);
    align-items:center;
    border:var(--ads-ctsbi-item-border-width,1px) solid var(--ads-ctsbi-item-border,#eee);
    border-radius:var(--ads-ctsbi-item-radius,10px);
    padding:var(--ads-ctsbi-item-padding,12px);
    background:var(--ads-ctsbi-item-bg,#fafafa);
    color:var(--ads-ctsbi-panel-text,#222);
    box-shadow:var(--ads-ctsbi-item-shadow,none);
}
.ads-ctsbi-image img{
    width:var(--ads-ctsbi-image-size,72px);
    height:var(--ads-ctsbi-image-size,72px);
    object-fit:cover;
    border-radius:var(--ads-ctsbi-image-radius,8px);
    border:var(--ads-ctsbi-image-border-width,0) solid var(--ads-ctsbi-image-border,transparent);
    box-sizing:border-box;
}
.ads-ctsbi-copy strong{
    display:block;
    margin-bottom:var(--ads-ctsbi-product-title-margin-bottom,4px);
    color:var(--ads-ctsbi-product-title-color,var(--ads-ctsbi-panel-text,#222));
    font-size:var(--ads-ctsbi-product-title-size,15px);
    font-weight:var(--ads-ctsbi-product-title-weight,700);
    line-height:1.25;
}
.ads-ctsbi-copy p{
    margin:var(--ads-ctsbi-message-margin-y,6px) 0;
    color:var(--ads-ctsbi-message-color,var(--ads-ctsbi-panel-muted,#555));
    font-size:var(--ads-ctsbi-message-size,14px);
    line-height:var(--ads-ctsbi-message-line-height,1.45);
}
.ads-ctsbi-price{
    font-weight:var(--ads-ctsbi-price-weight,600);
    color:var(--ads-ctsbi-price-color,var(--ads-ctsbi-panel-text,#222));
    font-size:var(--ads-ctsbi-price-size,14px);
}
.ads-ctsbi-badge{
    display:inline-block;
    font-size:var(--ads-ctsbi-badge-font-size,11px);
    font-weight:var(--ads-ctsbi-badge-font-weight,600);
    line-height:1;
    border-radius:var(--ads-ctsbi-badge-radius,999px);
    padding:var(--ads-ctsbi-badge-padding-y,5px) var(--ads-ctsbi-badge-padding-x,7px);
    background:var(--ads-ctsbi-badge-useful,#eee);
    color:var(--ads-ctsbi-badge-text,#222);
    text-transform:var(--ads-ctsbi-badge-text-transform,uppercase);
    letter-spacing:var(--ads-ctsbi-badge-letter-spacing,.03em);
}
.ads-ctsbi-severity-useful .ads-ctsbi-badge{background:var(--ads-ctsbi-badge-useful,#eee)}
.ads-ctsbi-severity-essential .ads-ctsbi-badge{background:var(--ads-ctsbi-badge-essential,#fde8e8)}
.ads-ctsbi-severity-important .ads-ctsbi-badge{background:var(--ads-ctsbi-badge-important,#fff3cd)}
.ads-ctsbi-severity-recommended .ads-ctsbi-badge{background:var(--ads-ctsbi-badge-recommended,#e7f1ff)}
.ads-ctsbi-actions{
    display:flex;
    flex-direction:column;
    gap:var(--ads-ctsbi-actions-gap,8px);
    align-items:var(--ads-ctsbi-actions-align,flex-end);
}
.ads-ctsbi-actions .button.ads-ctsbi-add{
    background:var(--ads-ctsbi-button-bg,#2271b1);
    color:var(--ads-ctsbi-button-text,#fff);
    border-color:var(--ads-ctsbi-button-border,var(--ads-ctsbi-button-bg,#2271b1));
    border-radius:var(--ads-ctsbi-button-radius,4px);
    padding:var(--ads-ctsbi-button-padding-y,8px) var(--ads-ctsbi-button-padding-x,14px);
    line-height:1.2;
    transition:all .15s ease;
    font-size:var(--ads-ctsbi-button-font-size,14px);
    font-weight:var(--ads-ctsbi-button-font-weight,600);
    text-transform:var(--ads-ctsbi-button-text-transform,none);
    box-shadow:var(--ads-ctsbi-button-shadow,none);
}
.ads-ctsbi-actions .button.ads-ctsbi-add:hover,.ads-ctsbi-actions .button.ads-ctsbi-add:focus{
    background:var(--ads-ctsbi-button-bg-hover,#135e96);
    border-color:var(--ads-ctsbi-button-border-hover,var(--ads-ctsbi-button-bg-hover,#135e96));
    color:var(--ads-ctsbi-button-text-hover,var(--ads-ctsbi-button-text,#fff));
}
.ads-ctsbi-panel .ads-ctsbi-actions button.ads-ctsbi-dismiss.ads-ctsbi-dismiss{
    -webkit-appearance:none !important;
    appearance:none !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-width:1px !important;
    border-style:solid !important;
    border-color:var(--ads-ctsbi-dismiss-border,transparent) !important;
    background:var(--ads-ctsbi-dismiss-bg,transparent) !important;
    background-color:var(--ads-ctsbi-dismiss-bg,transparent) !important;
    text-decoration:var(--ads-ctsbi-dismiss-decoration,underline) !important;
    cursor:pointer !important;
    color:var(--ads-ctsbi-dismiss-text,#666) !important;
    font-size:var(--ads-ctsbi-dismiss-font-size,12px) !important;
    font-weight:var(--ads-ctsbi-dismiss-font-weight,400) !important;
    padding:var(--ads-ctsbi-dismiss-padding-y,0) var(--ads-ctsbi-dismiss-padding-x,0) !important;
    border-radius:var(--ads-ctsbi-dismiss-radius,0) !important;
    line-height:1.2 !important;
    box-shadow:none !important;
    min-height:auto !important;
    min-width:0 !important;
    margin:0 !important;
}
.ads-ctsbi-panel .ads-ctsbi-actions button.ads-ctsbi-dismiss.ads-ctsbi-dismiss:hover,
.ads-ctsbi-panel .ads-ctsbi-actions button.ads-ctsbi-dismiss.ads-ctsbi-dismiss:focus{
    color:var(--ads-ctsbi-dismiss-text-hover,#222) !important;
    background:var(--ads-ctsbi-dismiss-bg-hover,transparent) !important;
    background-color:var(--ads-ctsbi-dismiss-bg-hover,transparent) !important;
    border-color:var(--ads-ctsbi-dismiss-border-hover,transparent) !important;
    text-decoration:var(--ads-ctsbi-dismiss-decoration-hover,underline) !important;
}

.ads-ctsbi-variation-picker{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:180px;
}
.ads-ctsbi-variation-field{
    display:flex;
    flex-direction:column;
    gap:4px;
    margin:0;
    font-size:12px;
    color:var(--ads-ctsbi-message-color,var(--ads-ctsbi-panel-muted,#555));
}
.ads-ctsbi-variation-field select{
    width:100%;
    max-width:240px;
    min-height:36px;
    border:1px solid var(--ads-ctsbi-item-border,#eee);
    border-radius:var(--ads-ctsbi-button-radius,4px);
    padding:6px 8px;
    background:#fff;
    color:var(--ads-ctsbi-panel-text,#222);
}
.ads-ctsbi-variation-help{
    display:block;
    min-height:1em;
    color:var(--ads-ctsbi-message-color,var(--ads-ctsbi-panel-muted,#555));
    font-size:11px;
    line-height:1.3;
}
.ads-ctsbi-actions .button.ads-ctsbi-add:disabled,
.ads-ctsbi-actions .button.ads-ctsbi-add.disabled{
    opacity:.55;
    cursor:not-allowed;
}
.ads-ctsbi-choose-options{
    text-align:center;
}

.ads-ctsbi-loading{opacity:.6;pointer-events:none}
.ads-ctsbi-layout-compact .ads-ctsbi-item{gap:10px}
.ads-ctsbi-layout-minimal .ads-ctsbi-head p{margin-bottom:10px}
@media(max-width:700px){
    .ads-ctsbi-variation-picker,.ads-ctsbi-variation-field select{max-width:none;width:100%}
    .ads-ctsbi-item{grid-template-columns:var(--ads-ctsbi-mobile-image-size,56px) 1fr}
    .ads-ctsbi-image img{width:var(--ads-ctsbi-mobile-image-size,56px);height:var(--ads-ctsbi-mobile-image-size,56px)}
    .ads-ctsbi-actions{grid-column:1/-1;align-items:stretch}
    .ads-ctsbi-actions .button{width:100%}
}
