/* ComboDress Combo Size Filter — style.css v5.0.0 */
.cdsf-wrap{font-family:inherit;width:100%}
.cdsf-section{border-bottom:1px solid #e8e8e8}
.cdsf-head{display:flex;align-items:center;justify-content:space-between;padding:16px 0;cursor:pointer;user-select:none;-webkit-user-select:none}
.cdsf-title{font-size:14px;font-weight:600;color:#1a1a1a;letter-spacing:.02em}
.cdsf-icon{font-size:18px;font-weight:300;color:#666;min-width:18px;text-align:center;line-height:1}
.cdsf-body{display:none;padding-bottom:16px}
.cdsf-section.cdsf-open .cdsf-body{display:block}
.cdsf-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 16px}
.cdsf-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:2px 0}
.cdsf-label input[type="checkbox"]{display:none}
.cdsf-dot{width:20px;height:20px;border-radius:50%;border:1.5px solid #c8c8c8;background:#f5f5f5;flex-shrink:0;position:relative;transition:background .15s,border-color .15s,box-shadow .15s}
.cdsf-dot::after{content:'';position:absolute;inset:4px;border-radius:50%;background:#1a1a1a;opacity:0;transition:opacity .15s}
.cdsf-label.cdsf-checked .cdsf-dot{border-color:#1a1a1a;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.08)}
.cdsf-label.cdsf-checked .cdsf-dot::after{opacity:1}
.cdsf-label:hover .cdsf-dot{border-color:#888;background:#fff}
.cdsf-text{font-size:13px;color:#333;line-height:1.3}
.cdsf-label.cdsf-checked .cdsf-text{font-weight:600;color:#1a1a1a}
.cdsf-empty{font-size:12px;color:#999;margin:0;padding:4px 0}
.cdsf-clear{padding:14px 0 4px}
.cdsf-clear-btn{display:inline-block;font-size:12px;color:#666;text-decoration:underline;text-underline-offset:2px;transition:color .15s}
.cdsf-clear-btn:hover{color:#c0392b;text-decoration:none}
.cdsf-wrap.cdsf-loading{opacity:.55;pointer-events:none}
@media(max-width:768px){.cdsf-grid{grid-template-columns:repeat(3,1fr)}}

/* =====================================================
   TOP BAR LAYOUT — horizontal filter row
   ===================================================== */
.cdsf-topbar-wrap { font-family: inherit; width: 100%; margin: 4px 0 20px; }

.cdsf-topbar-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 28px;
    border-bottom: 1px solid #eee;
    padding-bottom: 14px;
}

.cdsf-tb-item { position: relative; }

.cdsf-tb-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
}

.cdsf-tb-label {
    font-size: 14px;
    font-weight: 600;
    color: #1a1a1a;
    letter-spacing: 0.02em;
}

.cdsf-tb-item.cdsf-tb-active .cdsf-tb-label { color: #1a1a1a; }

.cdsf-tb-icon {
    font-size: 15px;
    font-weight: 300;
    color: #888;
    line-height: 1;
}

.cdsf-tb-item.cdsf-tb-open .cdsf-tb-icon::before { content: '\2212'; }

.cdsf-tb-panel {
    display: none;
    position: absolute;
    top: calc(100% + 14px);
    left: 0;
    z-index: 40;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    padding: 16px 18px;
    min-width: 220px;
}

.cdsf-tb-item.cdsf-tb-open .cdsf-tb-panel { display: block; }

.cdsf-tb-panel .cdsf-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 20px;
}

.cdsf-tb-clear {
    margin-left: auto;
    font-size: 12px;
    color: #666;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
}
.cdsf-tb-clear:hover { color: #c0392b; text-decoration: none; }

@media (max-width: 782px) {
    .cdsf-topbar-row { gap: 16px; }
    .cdsf-tb-panel { left: auto; right: 0; min-width: 200px; }
}

/* =====================================================
   TOP BAR — "Check Sizes" master toggle
   ===================================================== */
.cdsf-tb-master-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    padding: 4px 0;
    cursor: pointer;
    font-family: inherit;
}

.cdsf-tb-master-label {
    font-size: 14px;
    font-weight: 600;
    color: #c0392b;
    letter-spacing: 0.02em;
}

.cdsf-tb-master-icon {
    font-size: 12px;
    color: #c0392b;
    line-height: 1;
    transform: rotate(180deg);
    display: inline-block;
    transition: transform 0.15s;
}

.cdsf-tb-row-open .cdsf-tb-master-icon { transform: rotate(0deg); }

/* Row is hidden until the master toggle opens it, or a filter is active */
.cdsf-topbar-row {
    display: none;
    margin-top: 14px;
}

.cdsf-tb-row-open .cdsf-topbar-row { display: flex; }

/* =====================================================
   DESKTOP ONLY — sidebar widget as a single-row,
   responsive accordion bar (>= 993px). Column count
   automatically matches however many sections exist
   (6 on Family Combo, 4 on Dad N Son / Mom N Daughter),
   always filling the full row width evenly.

   Panels expand in NORMAL DOCUMENT FLOW directly below
   their own header (not position:absolute) — this avoids
   any risk of being clipped by a theme's widget wrapper
   that uses overflow:hidden for its own accordion effect.

   Mobile/tablet (<993px) keep the original vertical
   stacked accordion completely untouched.
   ===================================================== */
@media (min-width: 993px) {

    .cdsf-wrap {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 4px 16px;
    }

    .cdsf-wrap .cdsf-section {
        flex: 1 1 0;
        min-width: 110px;
        border-bottom: none;
    }

    .cdsf-wrap .cdsf-head {
        justify-content: center;
        padding: 10px 0;
        text-align: center;
    }

    .cdsf-wrap .cdsf-title {
        font-size: 13px;
        white-space: nowrap;
    }

    /* Panel opens in normal flow, directly below its own header —
       guaranteed visible regardless of any ancestor overflow rules. */
    .cdsf-wrap .cdsf-body {
        display: none;
        margin-top: 6px;
        background: #fff;
        border: 1px solid #e5e5e5;
        border-radius: 8px;
        box-shadow: 0 4px 16px rgba(0,0,0,0.06);
        padding: 14px 16px;
    }

    .cdsf-wrap .cdsf-section.cdsf-open .cdsf-body {
        display: block;
    }

    /* Narrow column — single-column checkbox list reads better than 2-up */
    .cdsf-wrap .cdsf-body .cdsf-grid {
        grid-template-columns: 1fr;
    }

    /* Clear All Filters becomes its own equal-width column */
    .cdsf-wrap .cdsf-clear {
        flex: 1 1 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px 0;
        margin: 0;
    }
}
