.product-item-photo {
    position: relative;
}

.budoland-product-badges {
    position: absolute;
    z-index: 10;
    top: .5rem;
    left: .5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
    pointer-events: none;
}

.budoland-product-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .25rem .5rem;
    border-radius: 9999px;
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}

.budoland-product-badge--new {
    background: #16a34a;
}

.budoland-product-badge--sale {
    background: #dc2626;
}

.budoland-product-badge--approved {
    background: #1f2937;
}

[x-cloak] {
    display: none !important;
}


.budoland-pdp-brand-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 3rem;
    margin-bottom: .75rem;
}

.budoland-pdp-brand-link {
    display: inline-flex;
    align-items: center;
}

.budoland-pdp-brand-logo {
    display: block;
    width: auto;
    max-width: 10rem;
    max-height: 3rem;
    object-fit: contain;
}

.budoland-pdp-brand-text {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.budoland-pdp-recognition {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin: .75rem 0;
}

.budoland-recognition-logo {
    display: block;
    width: auto;
    max-width: 7rem;
    max-height: 3rem;
    object-fit: contain;
}

.budoland-pdp-gloves-type {
    margin-top: .75rem;
    text-align: center;
}

.budoland-glove-type-image {
    display: block;
    width: auto;
    max-width: min(100%, 20rem);
    max-height: 15rem;
    margin: 0 auto;
    object-fit: contain;
}

.budoland-pdp-extra-details {
    margin-top: .25rem;
}

.budoland-pdp-detail-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: .75rem;
    padding: .5rem 0;
    border-top: 1px solid rgb(229 231 235);
}

.budoland-pdp-notice {
    margin-top: .5rem;
    padding: .625rem .75rem;
    border-radius: .375rem;
    font-size: .875rem;
    line-height: 1.25rem;
}

.budoland-pdp-notice--remnant {
    background: rgb(254 249 195);
}

.budoland-pdp-notice--oversize {
    background: rgb(243 244 246);
}



.budoland-gloves-cut-help {
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    margin-left: .5rem;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    color: currentColor;
}

.budoland-gloves-cut-help:hover {
    opacity: .7;
}

.budoland-pdp-gloves-type {
    margin-top: 1rem;
    text-align: left;
}

.budoland-pdp-glove-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    align-items: center;
}

.budoland-pdp-glove-copy {
    max-width: 48rem;
}

@media (min-width: 768px) {
    .budoland-pdp-glove-content:has(.budoland-glove-type-image:not(.hidden)) {
        grid-template-columns: minmax(0, 14rem) minmax(0, 1fr);
    }
}

.budoland-glove-type-image {
    display: block;
    width: 100%;
    max-width: 14rem;
    max-height: 15rem;
    margin: 0 auto;
    object-fit: contain;
}


.budoland-pdp-origin {
    display: inline-flex;
    margin-left: auto;
    align-items: center;
    justify-content: flex-end;
}

.budoland-pdp-origin-image {
    display: block;
    width: auto;
    max-width: 8rem;
    max-height: 3rem;
    object-fit: contain;
}


/* ProductPresentation PDP 1.5 */

.budoland-pdp-brand-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-height: 2.75rem;
    margin-bottom: .625rem;
}

.budoland-pdp-brand-link {
    display: inline-flex;
    align-items: center;
}

.budoland-pdp-brand-logo {
    display: block;
    width: auto;
    max-width: 10rem;
    max-height: 2.5rem;
    object-fit: contain;
}

.budoland-pdp-brand-text {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.budoland-pdp-origin {
    display: inline-flex;
    margin-left: auto;
    align-items: center;
    justify-content: flex-end;
}

.budoland-pdp-origin-image {
    display: block;
    width: auto;
    max-width: 7rem;
    max-height: 2.5rem;
    object-fit: contain;
}

/* Selection + cart remain visually dominant; lower info starts after actions. */
/* Recognition / approvals are a distinct visual unit. */
.budoland-pdp-recognition-panel {
    margin: 0 0 1rem;
    padding: .875rem 1rem;
    border: 1px solid rgb(209 250 229);
    border-radius: .75rem;
    background: rgb(240 253 244);
}

.budoland-pdp-recognition-label {
    margin-bottom: .625rem;
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: rgb(21 128 61);
}

.budoland-pdp-recognition-items {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .625rem;
}

.budoland-pdp-recognition-item {
    display: inline-flex;
    min-width: 4rem;
    min-height: 3.5rem;
    padding: .375rem .625rem;
    align-items: center;
    justify-content: center;
    border: 1px solid rgb(229 231 235);
    border-radius: .5rem;
    background: #fff;
}

.budoland-recognition-logo {
    display: block;
    width: auto;
    max-width: 6.5rem;
    max-height: 2.75rem;
    object-fit: contain;
}

/* Old Budoland size-chart look: yellow and fully rounded. */
.budoland-pdp-sizechart {
    display: inline-flex;
    margin-left: .5rem;
}

.budoland-pdp-sizechart-button {
    display: inline-flex;
    min-height: 2.5rem;
    padding: .5rem 1rem;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 9999px;
    background: #f59e0b;
    color: #111827;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 700;
    text-decoration: none;
    transition: transform .15s ease, background-color .15s ease;
}

.budoland-pdp-sizechart-button:hover {
    background: #d97706;
    color: #111827;
    transform: translateY(-1px);
}

/* Technical information rows align with Hyvä's own product-details list. */
.budoland-pdp-detail-row {
    display: flex;
    padding: .5rem 0;
    border-top: 1px solid rgb(209 213 219);
}

.budoland-pdp-detail-row .product-detail-label {
    width: 50%;
    color: rgb(55 65 81);
}

.budoland-pdp-detail-row .product-detail-value {
    width: 50%;
    margin-left: .5rem;
    color: rgb(17 24 39);
}

/* Full informational notices restored below the purchase controls. */
.budoland-pdp-notice {
    margin-top: .75rem;
    padding: .875rem 1rem;
    border-radius: .625rem;
    font-size: .875rem;
    line-height: 1.45;
}

.budoland-pdp-notice strong {
    display: block;
    margin-bottom: .25rem;
}

.budoland-pdp-notice p {
    margin: 0;
}

.budoland-pdp-notice--remnant {
    border: 1px solid rgb(253 230 138);
    background: rgb(254 249 195);
    color: rgb(113 63 18);
}

.budoland-pdp-notice--oversize {
    border: 1px solid rgb(253 186 116);
    background: rgb(255 247 237);
    color: rgb(124 45 18);
}

/* Small help icon next to the actual gloves_cut label/legend. */
.budoland-gloves-cut-help {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    margin-left: .375rem;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    color: rgb(75 85 99);
}

.budoland-gloves-cut-help:hover {
    color: rgb(17 24 39);
}



/* Hyvä-native glove cut modal */
.budoland-glove-modal {
    width: min(56rem, calc(100vw - 2rem));
    max-width: 56rem;
    padding: 0;
    border: 0;
    border-radius: 1rem;
    background: #fff;
    color: rgb(17 24 39);
    box-shadow:
        0 24px 48px -12px rgb(0 0 0 / .25),
        0 12px 24px -12px rgb(0 0 0 / .18);
}

.budoland-glove-modal::backdrop {
    background: rgb(17 24 39 / .55);
}

.budoland-glove-modal-inner {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    padding: 1.5rem;
}

.budoland-glove-modal-close {
    position: absolute;
    z-index: 2;
    top: .75rem;
    right: .75rem;
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: rgb(243 244 246);
    color: rgb(31 41 55);
    font-size: 1.75rem;
    line-height: 1;
}

.budoland-glove-modal-close:hover {
    background: rgb(229 231 235);
}

.budoland-glove-modal-media {
    display: flex;
    min-height: 12rem;
    align-items: center;
    justify-content: center;
}

.budoland-glove-modal-image {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 22rem;
    object-fit: contain;
}

.budoland-glove-modal-copy {
    align-self: center;
    padding-right: 1.5rem;
}

.budoland-glove-modal-eyebrow {
    margin-bottom: .375rem;
    color: rgb(107 114 128);
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.budoland-glove-modal-title {
    margin: 0;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
}

.budoland-glove-modal-description {
    margin-top: .75rem;
    color: rgb(55 65 81);
    font-size: .9375rem;
    line-height: 1.65;
}

@media (min-width: 768px) {
    .budoland-glove-modal-inner {
        grid-template-columns: minmax(0, 18rem) minmax(0, 1fr);
        gap: 2rem;
        padding: 2rem;
    }
}


.budoland-glove-modal-hint {
    margin-top: 1rem;
    padding: .75rem 1rem;
    border-radius: .5rem;
    background: rgb(255 251 235);
    color: rgb(146 64 14);
    font-size: .875rem;
    line-height: 1.45;
    font-weight: 600;
}

/* Hyvä-native size chart modal */
.budoland-sizechart-modal {
    width: min(64rem, calc(100vw - 2rem));
    max-width: 64rem;
    padding: 0;
    border: 0;
    border-radius: 1rem;
    background: #fff;
    color: rgb(17 24 39);
    box-shadow:
        0 24px 48px -12px rgb(0 0 0 / .25),
        0 12px 24px -12px rgb(0 0 0 / .18);
}

.budoland-sizechart-modal::backdrop {
    background: rgb(17 24 39 / .55);
}

.budoland-sizechart-modal-inner {
    position: relative;
    padding: 1.5rem;
}

.budoland-sizechart-modal-close {
    position: absolute;
    z-index: 2;
    top: .75rem;
    right: .75rem;
    display: inline-flex;
    width: 2.5rem;
    height: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: rgb(243 244 246);
    color: rgb(31 41 55);
    font-size: 1.75rem;
    line-height: 1;
}

.budoland-sizechart-modal-close:hover {
    background: rgb(229 231 235);
}

.budoland-sizechart-modal-title {
    margin: 0 3rem 1rem 0;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 700;
}

.budoland-sizechart-modal-content {
    display: flex;
    max-height: calc(100vh - 10rem);
    align-items: center;
    justify-content: center;
    overflow: auto;
}

.budoland-sizechart-modal-image {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: calc(100vh - 12rem);
    object-fit: contain;
}


/* ProductPresentation PDP 1.8 recognition sizing */
.budoland-pdp-recognition-items {
    gap: .75rem;
}

.budoland-pdp-recognition-item {
    display: inline-flex;
    flex-direction: column;
    width: 9.5rem;
    min-height: 6.75rem;
    padding: .625rem .75rem;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.budoland-pdp-recognition-visual {
    display: flex;
    width: 100%;
    height: 4.25rem;
    align-items: center;
    justify-content: center;
}

.budoland-recognition-logo {
    display: block;
    width: auto;
    max-width: 8.5rem;
    max-height: 4rem;
    object-fit: contain;
}

.budoland-pdp-recognition-title {
    display: block;
    width: 100%;
    color: rgb(31 41 55);
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 600;
    text-align: center;
}

/* ProductPresentation PDP 1.8 glove modal: visual first, copy below */
.budoland-glove-modal {
    width: min(64rem, calc(100vw - 2rem));
    max-width: 64rem;
}

.budoland-glove-modal-inner {
    display: block;
    padding: 1.5rem;
}

.budoland-glove-modal-media {
    display: flex;
    width: 100%;
    min-height: 18rem;
    margin-bottom: 1.5rem;
    padding: 1rem;
    align-items: center;
    justify-content: center;
    border-radius: .75rem;
    background: rgb(249 250 251);
}

.budoland-glove-modal-image {
    display: block;
    width: auto;
    max-width: min(100%, 48rem);
    max-height: min(60vh, 34rem);
    object-fit: contain;
}

.budoland-glove-modal-copy {
    max-width: 52rem;
    margin: 0 auto;
    padding-right: 0;
}

@media (min-width: 768px) {
    .budoland-glove-modal-inner {
        display: block;
        padding: 2rem;
    }
}


/*
 * Dynamic PDP placeholders must never reserve space or draw separators while
 * empty. Native [hidden] is the source of truth and wins over this module's
 * own display:flex / inline-flex / block declarations.
 */
.budoland-pdp-origin[hidden],
.budoland-pdp-origin-image[hidden],
.budoland-pdp-detail-row[hidden],
.budoland-pdp-notice[hidden],
.budoland-pdp-recognition-panel[hidden],
.budoland-pdp-sizechart[hidden],
.budoland-sizechart-modal-image[hidden],
.budoland-gloves-cut-help[hidden],
.budoland-glove-modal-media[hidden],
.budoland-glove-modal-image[hidden],
.budoland-glove-modal-description[hidden],
.budoland-glove-modal-hint[hidden] {
    display: none !important;
}


/* ProductPresentation PDP 1.8.4 glove modal refinements */
.budoland-glove-modal-media {
    min-height: 0;
    margin-bottom: 1.5rem;
    padding: 0;
    background: transparent;
}

.budoland-glove-modal-media:not([hidden]) {
    display: flex;
}

.budoland-glove-modal-media[hidden] {
    display: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.budoland-glove-modal-image {
    width: min(100%, 52rem);
    height: auto;
    max-width: 100%;
    max-height: min(68vh, 38rem);
    margin: 0 auto;
}


/*
 * Cart-adjacent presentation information.
 * Keep approvals / product notices visually attached to the purchase controls.
 */
.budoland-pdp-cart-info {
    width: 100%;
    margin-top: 1rem;
    padding-top: .875rem;
}

.budoland-pdp-cart-info > :first-child {
    margin-top: 0;
}

.budoland-pdp-cart-info .budoland-pdp-recognition-panel {
    margin-bottom: .75rem;
}

.budoland-pdp-cart-info .budoland-pdp-notice {
    margin-top: .625rem;
}

.budoland-pdp-cart-info .budoland-pdp-detail-row {
    margin-top: .625rem;
}


/* ProductPresentation PDP 1.8.6 cart placement */
.budoland-pdp-cart-info {
    display: block;
    width: 100%;
    flex: 0 0 100%;
    clear: both;
    margin-top: 1rem;
}


/* ProductPresentation PDP 1.8.7: custom info sits below action row */
.budoland-pdp-cart-info {
    margin-top: 1rem;
}


/* ProductPresentation PDP 1.8.9 stable additional placement */
.budoland-pdp-cart-info {
    display: block;
    width: 100%;
    margin: 0 0 1rem;
    padding-top: .875rem;
    clear: both;
}

/*
 * ProductPresentation PDP 1.11.10: keep the Budoland actions as one Alpine
 * component and one visual group. The group gets the same 0.5rem separation
 * from Hyva's preceding action (for example Compare) that its own buttons use
 * internally.
 */
.budoland-pdp-presentation-actions {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-left: .5rem;
}

.budoland-pdp-presentation-actions .budoland-pdp-sizechart,
.budoland-pdp-glove-type-action {
    margin-left: 0;
}


/* ProductPresentation PDP 1.11.8: common glove-cut action and +/- quantity. */
.budoland-pdp-glove-type-button {
    background: #111827;
    color: #fff;
}

.budoland-pdp-glove-type-button:hover,
.budoland-pdp-glove-type-button:focus-visible {
    background: #000;
    color: #fff;
}

.budoland-pdp-qty {
    display: inline-flex;
    min-height: 3rem;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    border-radius: .5rem;
    background: #fff;
    box-shadow: 0 1px 2px rgb(0 0 0 / .06);
}

.budoland-pdp-qty-button {
    display: inline-flex;
    width: 2.5rem;
    flex: 0 0 2.5rem;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #f3f4f6;
    color: #111827;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.budoland-pdp-qty-button:hover:not(:disabled) {
    background: #e5e7eb;
}

.budoland-pdp-qty-button:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid currentColor;
    outline-offset: -2px;
}

.budoland-pdp-qty-button:disabled {
    cursor: not-allowed;
    opacity: .4;
}

.budoland-pdp-qty-input {
    width: 3rem;
    min-width: 3rem;
    border: 0;
    border-right: 1px solid #e5e7eb;
    border-left: 1px solid #e5e7eb;
    border-radius: 0;
    background: #fff;
    padding: .5rem .25rem;
    color: #111827;
    text-align: center;
    box-shadow: none;
    -moz-appearance: textfield;
}

.budoland-pdp-qty-input:focus {
    position: relative;
    z-index: 1;
    outline: 2px solid #111827;
    outline-offset: -2px;
    box-shadow: none;
}

.budoland-pdp-qty-input::-webkit-outer-spin-button,
.budoland-pdp-qty-input::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}
