/* Boi_Theme miscellaneous tweaks — product tables + mobile data tables
 * ===================================================================
 * Estratto da boi/default/css/styles.css sezione "UNIQUE THEME RULES"
 * (issue #236 Level 2). Caricato globalmente via default handle perché
 * il product-attribute-stock-table vive sulla product-view (super
 * products) e mobile-vert-dtable è usato in checkout / order / account
 * tables.
 *
 * TODO: alcuni !important sulle swatch sizes (.configurable-swatch-list
 * .swatch-link) sono in conflitto con boi_configurableswatches.css
 * (mio editorial style 28px). Valutare se rimuoverli in una sessione
 * dedicata con visual regression testing — vengono preservati ora
 * per zero-risk extraction.
 */

/* ============================ UNIQUE THEME RULES ============================ */
/* Improved Product Codes Table */
#product-attribute-stock-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 10px 0 20px;
    border: 1px solid var(--c-border);
    border-radius: var(--r-sm);
    overflow: hidden;
}
#product-attribute-stock-table thead th {
    background-color: var(--c-bg-alt);
    color: var(--c-text);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    padding: 12px 15px;
    border-bottom: 2px solid var(--c-border);
}
#product-attribute-stock-table tbody td {
    padding: 12px 15px;
    border-bottom: 1px solid var(--c-border);
    font-size: 13px;
}
#product-attribute-stock-table .variation-name {
    font-weight: 600;
    color: var(--c-primary);
}
/* Improved Additional Information Table */
.additional-attributes {
    width: 100%;
    border-collapse: collapse;
}
.additional-attributes th.label {
    width: 30%;
    background-color: var(--c-bg-alt);
    font-weight: 600;
    padding: 12px 15px;
    border: 1px solid var(--c-border);
}
.additional-attributes td.data {
    padding: 12px 15px;
    border: 1px solid var(--c-border);
}
/* Larger swatches in all sliders */
.products-grid .configurable-swatch-list li {
    width: 48px !important;
    height: 48px !important;
    margin: 0 5px 5px 0 !important;
    display: inline-block !important;
}
.products-grid .configurable-swatch-list .swatch-link {
    width: 48px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 6px !important;
}
.products-grid .configurable-swatch-list .swatch-link img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

/* Hide mobile labels on desktop */
.mobile-vert-dtable .cell-label { display: none !important; }

/* Show mobile labels only on small screens */
@media only screen and (max-width: 767px) {
    .mobile-vert-dtable .data-table thead { display: none !important; }
    .mobile-vert-dtable .cell-label { display: block !important; padding-bottom: 2px; font-weight: bold; color: #888; font-size: 10px; text-transform: uppercase; }
    .mobile-vert-dtable .data-table td { display: block !important; width: 100% !important; border: none !important; padding: 10px 15px !important; }
    .mobile-vert-dtable .data-table tr { display: block !important; border-bottom: 1px solid #eee !important; padding: 10px 0 !important; }
}
