/* eShopKit custom fixes v1.1 — infdim.top (git-tracked) */

/* ===== Variation rows: clean light style (override purple theme labels) ===== */
.woocommerce div.product form.variations_form th.label,
.woocommerce div.product form.variations_form.cart th,
.woocommerce div.product form.variations th {
    background: transparent !important;
    color: #57606a !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    text-align: left !important;
    padding: 6px 12px 6px 0 !important;
    border: none !important;
    width: 72px;
}
.woocommerce div.product form.variations_form td,
.woocommerce div.product form.variations_form.cart td,
.woocommerce div.product form.variations td {
    border: none !important;
    padding: 4px 0 !important;
    vertical-align: middle;
}

/* ===== Selects: compact rounded with custom caret ===== */
.woocommerce div.product form.variations_form select,
.woocommerce div.product form.cart select {
    font-size: 14px !important;
    line-height: 1.4 !important;
    padding: 8px 32px 8px 12px !important;
    width: 260px !important;
    max-width: 100% !important;
    height: 40px !important;
    border: 1px solid #d5d9e0 !important;
    border-radius: 8px !important;
    background-color: #fff !important;
    color: #1f2328 !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23666666'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
}
.woocommerce div.product form.variations_form select:focus {
    border-color: #642afb !important;
    outline: none;
}

/* Variation reset link + availability note */
.woocommerce div.product form.variations .reset_variations {
    font-size: 12.5px;
    color: #8b949e;
    margin-top: 6px;
}

/* ===== Hide rows for attributes with no real choices ===== */
.eshopkit-hide-row { display: none !important; }

/* ===== Inline attribute card: light table, no purple ===== */
.eshopkit-attr-card {
    margin: 16px 0 4px !important;
    border: 1px solid #eceef1 !important;
    border-radius: 10px !important;
    background: #f8f9fa !important;
    padding: 2px 14px !important;
}
.eshopkit-attr-card table { width: 100%; border-collapse: collapse; }
.eshopkit-attr-card th {
    text-align: left !important;
    background: transparent !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    color: #6b7280 !important;
    width: 84px !important;
    padding: 8px 10px 8px 0 !important;
    border: none !important;
    border-bottom: 1px solid #eef0f3 !important;
    vertical-align: top;
}
.eshopkit-attr-card td {
    font-size: 13px !important;
    color: #1f2328 !important;
    background: transparent !important;
    padding: 8px 0 !important;
    border: none !important;
    border-bottom: 1px solid #eef0f3 !important;
}
.eshopkit-attr-card tr:last-child th,
.eshopkit-attr-card tr:last-child td { border-bottom: none !important; }

/* ===== Product images: uniform width ===== */
.woocommerce div.product .woocommerce-Tabs-panel img,
.woocommerce div.product .woocommerce-product-details__description img,
.woocommerce div.product .woocommerce-product-details__short-description img,
.woocommerce div.product div.images img {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
}
.woocommerce div.product div.images .flex-control-thumbs img { object-fit: cover; }
.woocommerce div.product div.images img.woocommerce-main-image { object-fit: contain; background: #f7f7f8; }

/* ===== Buttons row breathing room ===== */
.woocommerce div.product form.cart .quantity input { height: 44px; }
.woocommerce div.product form.cart .single_add_to_cart_button { border-radius: 8px; }

/* Checkout notice spacing */
.wc-block-checkout .wc-block-components-notice-banner { margin-bottom: 16px; }

/* ===== Gallery: uniform framed images (no crop, letterboxed) ===== */
.woocommerce div.product div.images img,
.woocommerce div.product div.images .woocommerce-main-image,
.woocommerce div.product div.images .flex-viewport img {
    width: 100% !important;
    height: auto !important;
}
.woocommerce div.product div.images .woocommerce-main-image,
.woocommerce div.product div.images .flex-viewport img {
    aspect-ratio: 3 / 4 !important;
    object-fit: contain !important;
    background: #fff !important;
    border: 1px solid #f0f0f2 !important;
    border-radius: 10px !important;
}
.woocommerce div.product div.images .flex-control-thumbs li img {
    aspect-ratio: 1 / 1 !important;
    object-fit: contain !important;
    background: #fff !important;
    border: 1px solid #eceef1 !important;
}
CSSEO
sed -i 's/eshopkit-fixes\x27, array(), \x271.1.0\x27/eshopkit-fixes\x27, array(), \x271.2.0\x27/' /home/ubuntu/ecommerce/woocommerce/wp-content/themes/eshopkit/functions.php
docker exec woo_wp php -l /var/www/html/wp-content/themes/eshopkit/functions.php >/dev/null && echo php-ok
docker exec woo_wp wp cache flush --allow-root >/dev/null
cd /home/ubuntu/ecommerce/woocommerce && git add -A && git commit -qm "UI v1.2: attribute card below tabs, gallery fixed-ratio letterbox" && git log --oneline | head -1
