/* Boi_Theme swatch base rules — Configurable Swatches core styling
 * =================================================================
 * Splittato da legacy-swatches.css (#236 L3). Contiene SOLO le regole
 * base per gli swatch vanilla Magento, globalmente applicabili:
 *   - clearfix per layout float legacy
 *   - .swatch-link / .swatch-label base typography & size
 *   - .configurable-swatch-list flex layout
 *   - Select fallback hiding (.product-options select.swatch-select)
 *   - Validation advice (error message red)
 *   - Out-of-stock state
 *
 * Le variants `.has-image` e `.has-color` sono rese dall'editorial
 * style in boi_configurableswatches.css (carica dopo con specificity
 * superiore → cascading wins). Questo file resta necessario perché
 * lo swatch TEXT-ONLY fallback (né image né color hex mapping)
 * consuma la `.swatch-link` base qui sotto.
 *
 * Non contiene più le 2 regole ridondanti:
 * - `.swatch-link.has-image .swatch-label { position: relative }`
 * - `.swatch-link.has-image img { position: absolute }`
 * → boi_configurableswatches.css le include già con selettori più
 * specifici + proprietà aggiuntive (border-radius, object-fit).
 */

/* Clearfix legacy per layout float-based */
.clearfix:after,
.configurable-swatch-list:after,
.product-view .product-options .swatch-attr:after {
    content: "";
    display: table;
    clear: both;
}

/* Swatch link/label base — applicato al text-fallback wide-swatch */
.swatch-link,
.swatch-label {
    display: block;
    font-size: 14px;
    text-align: center;
    color: var(--c-text);
    text-decoration: none;
    box-sizing: border-box;
}
.swatch-link {
    border: 1px solid var(--c-border);
    margin: 0 0 3px;
}
.swatch-link:hover {
    cursor: pointer;
    border-color: var(--c-primary);
}
.swatch-label {
    background: #f4f4f4;
    border: 1px solid #fff;
    white-space: nowrap;
    margin: 0;
}

/* Layout list */
.configurable-swatch-list {
    margin-left: -3px;
    clear: both;
}
.configurable-swatch-list li {
    float: left;
    margin: 0 0 0 3px;
}
.products-grid .configurable-swatch-list li {
    display: inline-block;
    float: none;
    vertical-align: top;
    margin: 0;
}

/* Hover + selected state (sovrascritto dall'editorial per .has-image/.has-color) */
.configurable-swatch-list .selected .swatch-link,
.configurable-swatch-list .hover .swatch-link {
    border-color: var(--c-primary);
}

/* Out-of-stock — sovrascritto dall'editorial per .has-image (opacity 0.4 + diagonal) */
.configurable-swatch-list .not-available .swatch-link {
    opacity: 0.5;
    cursor: default;
}
.swatch-link .x,
.configurable-swatch-list .not-available .x {
    display: none !important;
}

/* Native select fallback: nascondi quando swatches sono renderizzati */
.configurable-swatch-box select,
.swatch-attr select,
.product-options .swatch-attr select,
.product-options select.swatch-select {
    display: none !important;
}

/* Error message rosso (validation advice) */
.configurable-swatch-box .validation-advice {
    margin: 0 0 5px;
    background: #df280a;
    padding: 2px 5px !important;
    font-weight: bold;
    color: #fff !important;
    float: left;
    border-radius: 0;
}
