/* Timber Wharf Flooring Calculator - product page (v2.0.7 — green stock text) */

.twbc-calculator,
.twbc-meter-price-wrap {
    --twbc-brand: #9a6f45;
    --twbc-brand-dark: #7d5637;
    --twbc-brand-soft: #f4ece3;
    --twbc-cream: #fbf8f4;
    --twbc-line: #e8e0d6;
    --twbc-line-strong: #d6ccc0;
    --twbc-ink: #1f2124;
    --twbc-muted: #625c56;
    --twbc-radius: 6px;
    --twbc-radius-sm: 6px;
}

/* ---------- Product title & price ---------- */

body.single-product .product_title,
body.single-product .summary .elementor-heading-title {
    color: #25272b !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 1.16 !important;
    letter-spacing: 0 !important;
    margin-bottom: 16px !important;
}

.single-product .summary .price.twbc-meter-price-wrap,
.twbc-meter-price-wrap {
    display: block !important;
    margin: 6px 0 12px !important;
    padding: 0 !important;
    border: 0 !important;
    text-align: left !important;
}

.twbc-price {
    display: flex;
    align-items: baseline;
    margin: 0;
    line-height: 1;
}

.twbc-price-main {
    display: inline-flex;
    align-items: baseline;
    gap: 8px;
    color: var(--twbc-brand, #9a6f45) !important;
    font-weight: 600;
    line-height: 1;
}

.twbc-price-main .woocommerce-Price-amount {
    font-size: 24px;
    letter-spacing: -0.5px;
}

.twbc-price-main small {
    color: #4f555f;
    font-size: 13px;
    font-weight: 400;
    white-space: nowrap;
}

.twbc-price-note {
    display: none !important;
}

/* Native stock remains in place for WooCommerce; its display sits by the price. */
.single-product .twbc-stock-source-hidden { display: none !important; }
.single-product .twbc-price.twbc-has-inline-stock {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    max-width: 520px;
    min-width: 0;
}
.twbc-has-inline-stock .twbc-price-main { flex: 0 1 auto; flex-wrap: wrap; min-width: 0; }
.single-product .twbc-inline-stock {
    flex: 0 1 auto;
    max-width: 48%;
    margin: 0 !important;
    padding: 0 !important;
    color: #276343;
    font-family: inherit;
    font-size: 12px !important;
    font-weight: 500;
    line-height: 1.35;
    text-align: right;
    overflow-wrap: anywhere;
}
.single-product .twbc-inline-stock.out-of-stock { color: #963c32; }
.single-product .twbc-inline-stock.available-on-backorder { color: #7d5637; }

/* Keep available stock visibly green, including nested availability markup. */
body.single-product .twbc-price.twbc-has-inline-stock .twbc-inline-stock.in-stock,
body.single-product .twbc-price.twbc-has-inline-stock .twbc-inline-stock.in-stock * {
    color: #237a3b !important;
}

/* ---------- Calculator shell ---------- */

.single-product form.cart.twbc-has-calculator {
    container: twbc / inline-size;
    display: block !important;
    box-sizing: border-box;
    width: 100%;
    max-width: 520px !important;
    min-width: 0;
    gap: 0 !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
}

.single-product form.cart.twbc-has-calculator .quantity {
    display: none !important;
}

.single-product form.cart.twbc-has-calculator:after {
    display: none !important;
}

.twbc-calculator {
    display: grid;
    gap: 8px;
    width: 100%;
    max-width: 520px;
    min-width: 0;
    margin: 0 0 8px !important;
    padding: 0;
    border: 0;
    color: var(--twbc-ink);
    font-style: normal;
    font-weight: 400;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    line-height: 1.4;
    text-align: left;
}

.twbc-calculator *,
.twbc-calculator *:before,
.twbc-calculator *:after {
    box-sizing: border-box;
}

/* Themes style label/input/em with their own (often serif or italic) fonts.
   Everything in the calculator uses the one font the calculator inherits. */
.twbc-calculator * {
    font-family: inherit !important;
    font-style: normal !important;
}

.twbc-calculator [hidden] {
    display: none !important;
}

.twbc-waiting-message,
.twbc-choose-size {
    margin: 0;
    color: var(--twbc-muted);
    font-size: 15px;
    font-weight: 600;
}

.twbc-calculator:not(.is-waiting) .twbc-waiting-message,
.twbc-choose-size:empty {
    display: none !important;
}

body.single-product .twbc-calculator.is-waiting .twbc-calculator-box-info,
body.single-product .twbc-calculator.is-waiting .twbc-round-note,
body.single-product .twbc-calculator.is-waiting .twbc-buy-row,
body.single-product .twbc-calculator.is-waiting .twbc-room-toggle,
body.single-product .twbc-calculator.is-waiting .twbc-room-size,
body.single-product .twbc-calculator.is-waiting .twbc-summary {
    display: none !important;
}

/* ---------- Compact box information with horizontal dividers ---------- */
.twbc-calculator-box-info {
    display: flex;
    margin: 0;
    padding: 0;
    border-top: 1px solid var(--twbc-line);
    border-bottom: 1px solid var(--twbc-line);
    background: transparent;
}
.twbc-calculator-box-info > span {
    display: grid;
    flex: 1 1 0;
    align-content: start;
    gap: 2px;
    min-width: 0;
    padding: 6px 8px;
}
.twbc-calculator-box-info > span:first-child { padding-left: 0; }
.twbc-calculator-box-info > span:empty { display: none; }
.twbc-calculator-box-info .twbc-price-label {
    color: var(--twbc-muted);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none;
    overflow-wrap: anywhere;
}
.twbc-calculator-box-info strong {
    color: var(--twbc-ink);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}

/* ---------- Boxes / area inputs ---------- */

body.single-product .twbc-calculator .twbc-inputs {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 18px minmax(0, 1fr);
    align-items: end;
    gap: 6px;
}

body.single-product .twbc-calculator .twbc-field {
    display: grid !important;
    gap: 3px !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
}

/* Regular-weight labels on every screen, including mobile theme overrides. */
body.single-product .twbc-calculator .twbc-field-label {
    color: var(--twbc-ink);
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    line-height: 16px !important;
    text-transform: none !important;
}

body.single-product .twbc-calculator .twbc-stepper,
body.single-product .twbc-calculator .twbc-unit-input {
    position: relative;
    display: flex;
    align-items: stretch;
    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--twbc-line-strong);
    border-radius: var(--twbc-radius-sm);
    background: #fff;
    min-width: 0;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.twbc-stepper:focus-within,
.twbc-unit-input:focus-within {
    border-color: var(--twbc-brand);
    box-shadow: 0 0 0 3px rgba(154, 111, 69, .16);
}

.twbc-calculator .twbc-stepper input,
.twbc-calculator .twbc-unit-input input {
    flex: 1 1 auto;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--twbc-ink) !important;
    font-family: inherit !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: normal !important;
    font-variant-numeric: tabular-nums;
    -moz-appearance: textfield;
    appearance: textfield;
}

.twbc-calculator input[type=number]::-webkit-outer-spin-button,
.twbc-calculator input[type=number]::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

.twbc-calculator .twbc-stepper input {
    padding: 0 4px !important;
    text-align: center !important;
}

.twbc-calculator .twbc-step {
    flex: 0 0 44px;
    display: grid !important;
    place-items: center;
    width: 44px;
    min-width: 44px !important;
    height: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: var(--twbc-cream) !important;
    color: var(--twbc-brand-dark) !important;
    cursor: pointer;
    font-family: inherit !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    transition: background .15s ease;
}

.twbc-calculator .twbc-step:hover {
    background: var(--twbc-brand-soft) !important;
}

.twbc-calculator .twbc-step:disabled {
    background: #fff !important;
    color: var(--twbc-line-strong) !important;
    cursor: default;
}

.twbc-step-down {
    border-right: 1px solid var(--twbc-line) !important;
}

.twbc-step-up {
    border-left: 1px solid var(--twbc-line) !important;
}

/* Area needed: centre the number like the boxes stepper, unit pinned right */
.twbc-calculator .twbc-inputs .twbc-unit-input input {
    padding: 0 28px 0 8px !important;
    text-align: center !important;
}

.twbc-inputs .twbc-unit-input em {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
}

.twbc-unit-input em {
    display: flex;
    align-items: center;
    padding: 0 12px 0 0;
    color: var(--twbc-muted);
    font-size: 14px;
    font-weight: 400;
    pointer-events: none;
}

.twbc-or {
    display: grid;
    place-items: center;
    width: 18px;
    height: 46px;
    margin: 0;
    color: var(--twbc-muted);
    font-size: 12px;
    font-weight: 500;
    text-transform: none;
}

/* ---------- Stock message ---------- */

.twbc-stock-message {
    margin: 0 !important;
    padding: 10px 14px;
    border: 1px solid #ecd9c3;
    border-radius: var(--twbc-radius-sm);
    background: #fff7ee;
    color: #6f4b2d;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

/* ---------- One compact disclosure design and weight for desktop and mobile ---------- */
body.single-product .twbc-calculator .twbc-room-toggle,
body.single-product .twbc-calculator .twbc-room-toggle:visited {
    position: relative;
    display: flex !important;
    box-sizing: border-box !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    border: 1px solid var(--twbc-line) !important;
    border-radius: var(--twbc-radius) !important;
    box-shadow: none !important;
    background: #fff !important;
    color: var(--twbc-ink) !important;
    cursor: pointer;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 16px !important;
    text-align: left !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-transform: none !important;
    transition: border-color .15s ease, background .15s ease;
}
body.single-product .twbc-calculator .twbc-room-toggle:hover,
body.single-product .twbc-calculator .twbc-room-toggle[aria-expanded=true] {
    border-color: var(--twbc-line-strong) !important;
    background: var(--twbc-cream) !important;
}
body.single-product .twbc-calculator .twbc-room-toggle[aria-expanded=true] {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}
/* The visible row is slimmer; its hit area still fills 44px of vertical space. */
body.single-product .twbc-calculator .twbc-room-toggle::after { content: ""; position: absolute; inset: -5px 0; }
body.single-product .twbc-calculator .twbc-grid-icon { position: relative; flex: 0 0 12px !important; width: 12px !important; height: 12px !important; margin: 0 !important; padding: 0 !important; }
.twbc-grid-icon::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(var(--twbc-brand),var(--twbc-brand)) 0 0 / 5px 5px no-repeat,
        linear-gradient(var(--twbc-brand),var(--twbc-brand)) 7px 0 / 5px 5px no-repeat,
        linear-gradient(var(--twbc-brand),var(--twbc-brand)) 0 7px / 5px 5px no-repeat,
        linear-gradient(var(--twbc-brand),var(--twbc-brand)) 7px 7px / 5px 5px no-repeat;
}
body.single-product .twbc-calculator .twbc-toggle-text { display: block !important; flex: 1 1 auto; min-width: 0; margin: 0 !important; padding: 0 !important; font-size: 12px !important; line-height: 16px !important; }
body.single-product .twbc-calculator .twbc-toggle-text strong { display: block !important; margin: 0 !important; padding: 0 !important; color: var(--twbc-ink); font-size: 12px !important; font-weight: 400 !important; line-height: 16px !important; }
.twbc-chevron { flex: 0 0 6px; width: 6px; height: 6px; margin: -3px 2px 0 0; border-right: 2px solid var(--twbc-brand); border-bottom: 2px solid var(--twbc-brand); transform: rotate(45deg); transition: transform .15s ease; }
.twbc-room-toggle[aria-expanded=true] .twbc-chevron { margin-top: 4px; transform: rotate(-135deg); }

/* ---------- Room size panel ---------- */

.twbc-room-size {
    display: grid;
    gap: 8px;
    margin: -8px 0 0;
    padding: 10px 12px;
    border: 1px solid var(--twbc-line-strong);
    border-top: 0;
    border-radius: 0 0 var(--twbc-radius) var(--twbc-radius);
    background: var(--twbc-cream);
    animation: twbc-reveal .2s ease;
}

@keyframes twbc-reveal {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: none; }
}

.twbc-room-areas {
    display: grid;
    gap: 10px;
}

.twbc-room-area {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 12px minmax(0, 1fr);
    align-items: end;
    gap: 4px 8px;
}

.twbc-room-area-title {
    grid-column: 1 / 3;
    grid-row: 1;
    align-self: center;
    color: var(--twbc-brand-dark);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.3;
}

.twbc-room-area label {
    display: grid !important;
    gap: 4px;
    min-width: 0;
    margin: 0 !important;
}

.twbc-room-area label > span:first-child {
    font-size: 12px;
    font-weight: 400;
    color: var(--twbc-muted);
}

.twbc-room-area .twbc-unit-input {
    height: 46px;
}

.twbc-calculator .twbc-room-area .twbc-unit-input input {
    font-size: 16px !important;
}

.twbc-room-x {
    grid-column: 2;
    grid-row: 2;
    margin: 0 0 12px;
    color: var(--twbc-muted);
    font-size: 14px;
    text-align: center;
}

.twbc-calculator .twbc-remove-area {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    display: grid !important;
    place-items: center;
    width: 44px;
    height: 44px;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--twbc-line) !important;
    border-radius: 6px !important;
    background: #fff !important;
    box-shadow: none !important;
    color: var(--twbc-muted) !important;
    cursor: pointer;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

.twbc-calculator .twbc-remove-area:hover {
    border-color: #c9a27c !important;
    color: var(--twbc-brand-dark) !important;
}

.twbc-room-actions {
    display: flex;
    margin: 0;
}

.twbc-calculator .twbc-add-area {
    min-height: 44px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--twbc-brand-dark) !important;
    cursor: pointer;
    font-family: inherit !important;
    font-size: 13.5px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    text-transform: none !important;
}

.twbc-calculator .twbc-add-area:hover {
    color: var(--twbc-ink) !important;
}

/* Wastage switch */

.twbc-wastage-row {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 !important;
    min-height: 44px;
    padding: 8px 10px;
    border: 1px solid var(--twbc-line);
    border-radius: var(--twbc-radius-sm);
    background: #fff;
    cursor: pointer;
}

.twbc-wastage-text {
    display: grid;
    gap: 2px;
}

.twbc-wastage-text strong {
    color: var(--twbc-ink);
    font-size: 13.5px;
    font-weight: 500;
    line-height: 1.25;
}

.twbc-wastage-text small {
    color: var(--twbc-muted);
    font-size: 12px;
    line-height: 1.3;
}

.twbc-wastage {
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
}

.twbc-wastage input {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    opacity: 0;
    cursor: pointer;
}

.twbc-wastage i {
    position: absolute;
    inset: 10px 1px;
    border-radius: 24px;
    background: #d9d2c9;
    transition: background .2s ease;
    pointer-events: none;
}

.twbc-wastage i:after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    transition: transform .2s ease;
}

.twbc-wastage input:checked + i {
    background: var(--twbc-brand);
}

.twbc-wastage input:checked + i:after {
    transform: translateX(18px);
}

.twbc-wastage input:focus-visible + i {
    box-shadow: 0 0 0 3px rgba(154, 111, 69, .25);
}

.twbc-room-result {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 8px;
    color: var(--twbc-muted);
    font-size: 13.5px;
    font-weight: 400;
}

.twbc-room-result strong {
    color: var(--twbc-ink);
    font-size: 15px;
    font-weight: 600;
}

.twbc-room-result small {
    flex-basis: 100%;
    color: var(--twbc-muted);
    font-size: 12px;
    font-weight: 500;
}

/* ---------- Compact two-line summary; identical scale on mobile ---------- */
.twbc-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 4px 12px;
    min-width: 0;
    padding: 8px 12px;
    border: 1px solid var(--twbc-line);
    border-radius: var(--twbc-radius);
    background: var(--twbc-cream);
}
.twbc-extra { display: grid; gap: 2px; min-width: 0; margin: 0; }
.twbc-get-line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 4px; min-width: 0; }
.twbc-extra b { color: var(--twbc-ink); font-size: 14px; font-weight: 400; line-height: 1.3; }
.twbc-extra strong { color: var(--twbc-ink); font-size: 16px; font-weight: 600; line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.twbc-extra small { color: var(--twbc-muted); font-size: 12px; font-weight: 400; line-height: 1.35; overflow-wrap: anywhere; }
.twbc-total { display: grid; gap: 2px; min-width: 0; margin: 0; padding-left: 12px; border-left: 1px solid var(--twbc-line); text-align: right; }
.twbc-total span { color: var(--twbc-muted); font-size: 11px; font-weight: 500; line-height: 1.2; }
.twbc-total strong { color: var(--twbc-ink); font-size: 22px; font-weight: 600; line-height: 1.15; letter-spacing: -.2px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.twbc-round-note { grid-column: 1 / -1; margin: 0 !important; padding: 0; color: var(--twbc-muted); font-size: 11px; font-weight: 400; line-height: 1.35; }

/* ---------- Add to basket ---------- */

.single-product form.cart.twbc-has-calculator .single_add_to_cart_button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 520px !important;
    min-height: 46px !important;
    margin: 0 !important;
    box-sizing: border-box;
    padding: 10px 16px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: #363e43 !important;
    box-shadow: none !important;
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    letter-spacing: .5px !important;
    text-transform: uppercase !important;
    transition: background .15s ease;
}

.single-product form.cart.twbc-has-calculator .single_add_to_cart_button:hover {
    background: #252d32 !important;
}

.single-product form.cart.twbc-has-calculator .single_add_to_cart_button:before {
    display: none !important;
    content: none !important;
}

.single-product form.cart.twbc-has-calculator .single_add_to_cart_button.twbc-disabled,
.single-product form.cart.twbc-has-calculator .single_add_to_cart_button:disabled {
    opacity: .5 !important;
    cursor: not-allowed !important;
}

/* ---------- Live theme compatibility ----------
   Older Additional CSS and Elementor mobile rules centre the price, hide
   coverage, split fonts and force 900-weight figures. Keep these corrections
   scoped to the main product calculator; catalogue cards remain untouched. */
body.single-product form.cart.twbc-has-calculator .twbc-calculator,
body.single-product form.cart.twbc-has-calculator .twbc-calculator *,
body.single-product form.cart.twbc-has-calculator .single_add_to_cart_button {
    font-family: Arial, Helvetica, sans-serif !important;
    font-style: normal !important;
}
body.single-product form.cart.twbc-has-calculator .twbc-calculator {
    font-size: 14px;
    font-weight: 400;
}
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info {
    border-top: 1px solid #b5a798 !important;
    border-bottom: 1px solid #b5a798 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    justify-self: stretch !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    white-space: normal !important;
}
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info > span {
    display: grid !important;
    flex: 1 1 0 !important;
    align-items: start !important;
    align-content: start !important;
    justify-content: stretch !important;
    gap: 2px !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    border: 0 !important;
    line-height: 1.3 !important;
    text-align: left !important;
    white-space: normal !important;
}
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info > span:first-child { padding-left: 0 !important; }
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info > span:empty { display: none !important; }
body.single-product form.cart.twbc-has-calculator .twbc-calculator.is-waiting .twbc-calculator-box-info { display: none !important; }
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info .twbc-price-label {
    display: block !important;
    color: var(--twbc-muted) !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
}
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info strong,
body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info strong * {
    display: inline !important;
    color: var(--twbc-ink) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Give Elementor's price widget the same available width as the cart form. */
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price),
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) > .elementor-widget-container,
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .price,
body.single-product .summary > .price:has(.twbc-price) {
    display: block !important;
    width: 100% !important;
    max-width: 520px !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
}
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price),
body.single-product .summary > .price:has(.twbc-price) { margin-bottom: 8px !important; }
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .twbc-price,
body.single-product .summary > .price .twbc-price.twbc-has-inline-stock {
    display: flex !important;
    width: 100% !important;
    max-width: 520px !important;
    min-width: 0 !important;
    align-items: baseline !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .twbc-price-main,
body.single-product .summary > .price .twbc-price-main {
    display: inline-flex !important;
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
    align-items: baseline !important;
    gap: 8px !important;
    text-align: left !important;
}
body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .twbc-price *,
body.single-product .summary > .price .twbc-price * { font-family: Arial, Helvetica, sans-serif !important; }
body.single-product .elementor-widget-woocommerce-product-add-to-cart:has(.twbc-calculator) {
    width: 100% !important;
    max-width: 520px !important;
    min-width: 0 !important;
}
@media (max-width: 767px) {
    /* Recover space lost to nested Elementor column padding on small phones. */
    body.single-product .elementor-widget-wrap.elementor-element-populated:has(> .elementor-widget-woocommerce-product-add-to-cart .twbc-calculator) {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

/* ---------- Responsive layout; compact dimensions stay the same ---------- */
.single-product form.cart.twbc-has-calculator .woocommerce-variation-add-to-cart { display: block !important; gap: 0 !important; }
.twbc-calculator button, .twbc-room-toggle, .single-product form.cart.twbc-has-calculator .single_add_to_cart_button { touch-action: manipulation; }
.twbc-calculator button:focus-visible, .twbc-room-toggle:focus-visible,
.single-product form.cart.twbc-has-calculator .single_add_to_cart_button:focus-visible { outline: 2px solid var(--twbc-brand,#9a6f45) !important; outline-offset: 2px; }
.twbc-calculator .twbc-step-down { border-radius: 5px 0 0 5px !important; }
.twbc-calculator .twbc-step-up { border-radius: 0 5px 5px 0 !important; }
.twbc-room-area label:first-of-type { grid-column: 1; grid-row: 2; }
.twbc-room-area label:last-of-type { grid-column: 3; grid-row: 2; }
@media (max-width: 480px) {
    body.single-product .product_title, body.single-product .summary .elementor-heading-title { font-size: 21px !important; }
    .twbc-price-main .woocommerce-Price-amount { font-size: 22px; }
    .twbc-summary { padding: 8px 12px; }
    .twbc-extra strong { font-size: 16px; }
    .twbc-total strong { font-size: 22px; }
    .single-product form.cart.twbc-has-calculator .single_add_to_cart_button { min-height: 46px !important; padding: 10px 16px !important; }
}
/* Keep both purchase fields side by side on a 320px phone. The boxes field
   reserves room for two 44px buttons and a readable four-digit quantity. */
@container twbc (max-width: 360px) {
    body.single-product .twbc-calculator .twbc-inputs { grid-template-columns: minmax(138px,1.1fr) 16px minmax(0,.9fr); gap: 6px; }
    .twbc-or { width: 16px; }
}
/* Only genuinely narrow columns need the stacked layout. */
@container twbc (max-width: 269px) {
    body.single-product .twbc-calculator .twbc-inputs { grid-template-columns: minmax(0,1fr); gap: 4px; }
    .twbc-or { display: flex; gap: 8px; width: 100%; height: 18px; }
    .twbc-or::before, .twbc-or::after { content: ""; flex: 1; height: 1px; background: var(--twbc-line); }
}
@supports not (container-type: inline-size) {
    @media (max-width: 400px) {
        body.single-product .twbc-calculator .twbc-inputs { grid-template-columns: minmax(138px,1.1fr) 16px minmax(0,.9fr); gap: 6px; }
        .twbc-or { width: 16px; }
    }
    @media (max-width: 300px) {
        body.single-product .twbc-calculator .twbc-inputs { grid-template-columns: minmax(0,1fr); gap: 4px; }
        .twbc-or { justify-self: center; height: 18px; }
    }
}
@media (prefers-reduced-motion: reduce) {
    .twbc-calculator *, .single-product form.cart.twbc-has-calculator .single_add_to_cart_button { transition: none !important; animation: none !important; }
}

/* More room on desktop; tablet and mobile retain their compact dimensions. */
@media (min-width: 1025px) {
    body.single-product .elementor-widget-wrap.elementor-element-populated:has(> .elementor-widget-woocommerce-product-add-to-cart .twbc-calculator) {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    body.single-product form.cart.twbc-has-calculator,
    body.single-product form.cart.twbc-has-calculator .twbc-calculator,
    body.single-product form.cart.twbc-has-calculator .single_add_to_cart_button,
    body.single-product .elementor-widget-woocommerce-product-add-to-cart:has(.twbc-calculator),
    body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price),
    body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) > .elementor-widget-container,
    body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .price,
    body.single-product .elementor-widget-woocommerce-product-price:has(.twbc-price) .twbc-price,
    body.single-product .summary > .price:has(.twbc-price),
    body.single-product .summary > .price .twbc-price.twbc-has-inline-stock {
        max-width: 580px !important;
    }
    body.single-product form.cart.twbc-has-calculator .twbc-calculator { gap: 10px; }
    body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info > span { padding-top: 8px !important; padding-bottom: 8px !important; }
    body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info .twbc-price-label { font-size: 12px !important; }
    body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info strong,
    body.single-product form.cart.twbc-has-calculator .twbc-calculator-box-info strong * { font-size: 15px !important; }
    body.single-product .twbc-calculator .twbc-field-label { font-size: 13px !important; line-height: 18px !important; }
    body.single-product .twbc-calculator .twbc-stepper,
    body.single-product .twbc-calculator .twbc-unit-input { height: 48px !important; min-height: 48px !important; }
    body.single-product .twbc-calculator .twbc-or { height: 48px; }
    body.single-product .twbc-calculator .twbc-summary { padding-top: 10px; padding-bottom: 10px; }
    body.single-product .twbc-calculator .twbc-room-size { margin-top: -10px; }
    body.single-product form.cart.twbc-has-calculator .single_add_to_cart_button { min-height: 48px !important; }
}