/**
 * Tudor PDP (Hyvä) — load AFTER tudor.css on catalog_product_view_attribute_set_11.
 */
body.tudor-productdetails-body .page-main,
body.tudor-productdetails-body #maincontent.page-main {
    margin-block: 0;
    max-width: none !important;
    padding-inline: 0 !important;
}

body.tudor-productdetails-body .page-wrapper #maincontent > .columns {
    display: block !important;
    width: 100%;
    max-width: none !important;
    padding-inline: 0 !important;
    margin-inline: 0;
    gap: 0;
}

/* Hide native <select>; custom braceletSizeSelector is the visible control (deploy-safe — do not rely on tudor.css rebuild) */
body.tudor-productdetails-body
    .tudor-productDetails-productTop-infoPanel-braceletSize
    .control
    > select,
body.tudor-productdetails-body
    .tudor-productDetails-productTop-infoPanel-braceletSize
    .braceletSize-nativeSelect {
    display: none !important;
}

/* If options render twice (stale layout / duplicate DB option), keep first bracelet UI only */
body.tudor-productdetails-body
    .tudor-product-custom-options
    .tudor-productDetails-productTop-infoPanel-braceletSize
    ~ .tudor-productDetails-productTop-infoPanel-braceletSize {
    display: none !important;
}

body.tudor-productdetails-body
    .tudor-product-custom-options
    .tudor-productDetails-productTop-infoPanel-braceletSizeError
    ~ .tudor-productDetails-productTop-infoPanel-braceletSizeError {
    display: none !important;
}

/* --- Bracelet selector + ATC (PDP); keep here so deploy does not depend on tailwind rebuild --- */
.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-braceletSize
    .braceletSizeSelector-button {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 10px 44px 10px 12px !important;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-braceletSize
    .braceletSizeSelector-label {
    flex: 1 1 auto;
    text-align: left !important;
    width: 100%;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-braceletSize
    .braceletSizeSelector-arrow {
    display: block !important;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-left: auto;
    pointer-events: none;
}

/* Unselected: grey disabled ATC only */
.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-purchase
    form[data-tudor-bracelet-form]
    .tudor-productDetails-productTop-infoPanel-addtocartBtn {
    display: none !important;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-purchase
    form[data-tudor-bracelet-form]
    .tudor-productDetails-productTop-infoPanel-addtocartBtn.is-visible {
    display: block !important;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-purchase
    form[data-tudor-bracelet-form]
    .tudor-productDetails-productTop-infoPanel-disabledBtn {
    display: none !important;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-purchase
    form[data-tudor-bracelet-form]
    .tudor-productDetails-productTop-infoPanel-disabledBtn.is-visible {
    display: block !important;
    background-color: #727272 !important;
}

.tudor-productDetails-productTop
    .tudor-productDetails-productTop-infoPanel-purchase
    form[data-tudor-bracelet-form]
    .tudor-productDetails-productTop-infoPanel-disabledBtn.is-visible:hover {
    background-color: rgba(114, 114, 114, 0.8) !important;
}