/*
 * TWC Bookable — redesigned single product page.
 * Loaded after product_page.css, only on bookable product pages
 * (see views/single_product_template.php).
 * Design reference: docs/before_selection.png + docs/calendar_open.png
 */

.twcbook-product-page {
    --twc-indigo: #2b3e59;
    --twc-camel: #b1955d;
    --twc-bg: #faf7f2;
    --twc-ink: #1a2535;
    --twc-white: #ffffff;
    --twc-radius: 6px;
    --twc-font-display: "Lora", Georgia, serif;
    --twc-font-body: "Inter", sans-serif;
    /* Botanical greens picked from the mockups */
    --twcbook-green: #477047;
    --twcbook-green-dark: #324c3a;
    --twcbook-green-soft: #eef2ec;
    --twcbook-cream-card: #fdf6e7;
    --twcbook-cream-border: #f1e4c5;
    --twcbook-line: #e6e3da;
    --twcbook-muted: #5f6b7a;
}

/* ---------- page chrome ---------- */

.twcbook-product-page .twcbook-single {
    font-family: var(--twc-font-body);
    color: var(--twc-ink);
    font-size: 16px;
    line-height: 1.6;
}

/* ---------- hero: gallery | story ---------- */

.twcbook-single .twcbook-hero {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 56px);
    align-items: start;
    margin-bottom: 40px;
}
/* Avada's JS pins an inline pixel width on the gallery (≈48% of the site
   max-width) and doesn't recalc on window resize between its breakpoints,
   so the gallery overflows the grid column and overlaps the description.
   Clamp everything to the column — ID weight needed to beat Avada/old
   plugin !important rules, max-width to beat the inline style. */
#main .twcbook-hero-media .avada-single-product-gallery-wrapper,
#main .twcbook-hero-media .avada-product-images-global,
#main .twcbook-hero-media .woocommerce-product-gallery,
.twcbook-hero-media .woocommerce-product-gallery {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}
#main .twcbook-hero-media .woocommerce-product-gallery .flex-viewport {
    width: 100% !important;
    max-width: 100% !important;
}
/* .zoomImg is WooCommerce's hover-zoom overlay — intentionally oversized,
   clamping it distorts the photo on hover */
#main .twcbook-hero-media .woocommerce-product-gallery img:not(.zoomImg) {
    max-width: 100% !important;
    height: auto;
}
#main .twcbook-single .summary.entry-summary.twcbook-hero-summary {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}
.twcbook-hero-media img:not(.zoomImg) {
    border-radius: 12px;
}
/* keep the hover-zoom overlay clipped to the same rounded corners */
.twcbook-hero-media .woocommerce-product-gallery .woocommerce-product-gallery__image {
    border-radius: 12px;
    overflow: hidden;
}
.twcbook-hero-media .woocommerce-product-gallery ol.flex-control-thumbs {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}
.twcbook-hero-media .woocommerce-product-gallery ol.flex-control-thumbs li {
    width: auto !important;
    float: none !important;
    margin: 0 !important;
}
.twcbook-hero-media .woocommerce-product-gallery ol.flex-control-thumbs img {
    border-radius: 8px;
    width: 100%;
    height: auto;
}

.twcbook-single .twcbook-hero-summary {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
}

h1.twcbook-title {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-family: var(--twc-font-display);
    font-weight: 500;
    font-size: clamp(32px, 4vw, 44px);
    line-height: 1.15;
    color: var(--twcbook-green-dark) !important; /* beat Avada heading color */
    margin: 0 0 4px;
}
.twcbook-title-sprig {
    /* branch.svg as a tinted mask (portrait ~294x384) */
    flex: 0 0 28px;
    width: 28px;
    height: 37px;
    margin-top: 4px;
    background-color: var(--twcbook-green);
    -webkit-mask: url("../../resources/icon/branch.svg") center / contain no-repeat;
    mask: url("../../resources/icon/branch.svg") center / contain no-repeat;
}
.twcbook-subtitle {
    font-family: var(--twc-font-body);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--twcbook-green);
    margin: 0 0 18px;
}

/* ---------- story / feature blocks ---------- */

.twcbook-intro,
.twcbook-features {
    font-size: 16px;
    line-height: 1.6;
    color: var(--twc-ink);
}
.twcbook-features a {
    color: var(--twcbook-green-dark);
    text-decoration: underline;
}
.twcbook-features h3,
.twcbook-features h4 {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 44px;
    padding-left: 58px;
    font-family: var(--twc-font-body);
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--twcbook-green-dark);
    margin: 26px 0 0;
}
/* the circle… */
.twcbook-features h3::before,
.twcbook-features h4::before,
.twcbook-features > p.twcbook-lead::before,
.twcbook-intro > p:first-child::before {
    content: "";
    position: absolute;
    left: 0;
    top: 75%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border: 1px solid #a9bcae;
    border-radius: 50%;
    background-color: var(--twc-white);
}
/* …and the icon inside it (resources/icon/*.svg use stroke="currentColor",
   so they're applied as masks tinted with the brand green) */
.twcbook-features h3::after,
.twcbook-features h4::after,
.twcbook-features > p.twcbook-lead::after,
.twcbook-intro > p:first-child::after {
    content: "";
    position: absolute;
    left: 10px;
    top: 75%;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-color: var(--twcbook-green);
    -webkit-mask: url("../../resources/icon/leaf.svg") center / contain no-repeat;
    mask: url("../../resources/icon/leaf.svg") center / contain no-repeat;
}
/* icon set cycling per block: plant, heart, teapot, wheat, plant-2 */
.twcbook-features h4:nth-of-type(5n+1)::after,
.twcbook-features h3:nth-of-type(5n+1)::after {
    -webkit-mask-image: url("../../resources/icon/plant.svg");
    mask-image: url("../../resources/icon/plant.svg");
}
.twcbook-features h4:nth-of-type(5n+2)::after,
.twcbook-features h3:nth-of-type(5n+2)::after {
    -webkit-mask-image: url("../../resources/icon/heart.svg");
    mask-image: url("../../resources/icon/heart.svg");
}
.twcbook-features h4:nth-of-type(5n+3)::after,
.twcbook-features h3:nth-of-type(5n+3)::after {
    -webkit-mask-image: url("../../resources/icon/teapot.svg");
    mask-image: url("../../resources/icon/teapot.svg");
}
.twcbook-features h4:nth-of-type(5n+4)::after,
.twcbook-features h3:nth-of-type(5n+4)::after {
    -webkit-mask-image: url("../../resources/icon/wheat.svg");
    mask-image: url("../../resources/icon/wheat.svg");
}
.twcbook-features h4:nth-of-type(5n)::after,
.twcbook-features h3:nth-of-type(5n)::after {
    -webkit-mask-image: url("../../resources/icon/plant-2.svg");
    mask-image: url("../../resources/icon/plant-2.svg");
}
.twcbook-features > p,
.twcbook-intro > p {
    position: relative;
    margin: 0 0 14px 58px;
}
/* the lead paragraph keeps the default circled leaf, like the mockup */
.twcbook-features > p.twcbook-lead::before,
.twcbook-intro > p:first-child::before,
.twcbook-features > p.twcbook-lead::after,
.twcbook-intro > p:first-child::after {
    left: -58px;
    top: 0;
    transform: none;
}
.twcbook-features > p.twcbook-lead::after,
.twcbook-intro > p:first-child::after {
    left: -48px;
    top: 14px;
}

/* ---------- callout strip ---------- */

.twcbook-callouts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
    margin: 8px 0 24px;
}
.twcbook-callout {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: var(--twcbook-cream-card);
    border: 1px solid var(--twcbook-cream-border);
    border-radius: 10px;
    padding: 16px 18px;
    font-size: 15px;
    line-height: 1.5;
}
.twcbook-callout p {
    margin: 0;
}
.twcbook-callout a {
    color: var(--twcbook-green-dark);
    font-weight: 600;
    text-decoration: underline;
}
.twcbook-callout-icon {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}
.twcbook-icon-sun {
    background-color: #c9a04d;
    -webkit-mask-image: url("../../resources/icon/sun.svg");
    mask-image: url("../../resources/icon/sun.svg");
}
.twcbook-icon-tag {
    background-color: var(--twc-camel);
    -webkit-mask-image: url("../../resources/icon/tag.svg");
    mask-image: url("../../resources/icon/tag.svg");
}
.twcbook-icon-sprout {
    background-color: var(--twcbook-green);
    -webkit-mask-image: url("../../resources/icon/growth.svg");
    mask-image: url("../../resources/icon/growth.svg");
}
.twcbook-cost-note {
    display: block;
    color: var(--twcbook-muted);
}

/* ---------- menu buttons ---------- */

.twcbook-menu-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 18px;
    margin: 0 0 16px;
}
a.twcbook-menu-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--twcbook-green);
    color: var(--twc-white) !important;
    font-family: var(--twc-font-body);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 13px 30px;
    border-radius: var(--twc-radius);
    text-decoration: none !important;
    transition: background-color 0.2s ease;
}
a.twcbook-menu-button:hover,
a.twcbook-menu-button:focus {
    background: var(--twcbook-green-dark);
    color: var(--twc-white) !important;
}
.twcbook-menu-button svg {
    width: 18px;
    height: 18px;
}

/* ---------- reserve card ---------- */

.twcbook-reserve {
    margin-top: 32px;
    background: var(--twc-white);
    border: 1px solid var(--twcbook-line);
    border-radius: 14px;
    padding: 32px clamp(16px, 4vw, 48px) 36px;
    box-shadow: 0 1px 2px rgba(26, 37, 53, 0.04);
}
.twcbook-reserve-header {
    text-align: center;
    margin-bottom: 4px;
}
.twcbook-reserve-header h2 {
    font-family: var(--twc-font-display);
    font-size: clamp(26px, 3vw, 34px);
    font-weight: 500;
    color: var(--twcbook-green-dark) !important; /* beat Avada heading color */
    margin: 0 0 6px;
}
.twcbook-reserve-header p {
    color: var(--twcbook-muted);
    font-size: 15px;
    margin: 0;
}
.twcbook-reserve-seedling,
.twcbook-button-icon,
.twcbook-footer-icon {
    display: inline-flex;
    align-items: center;
    vertical-align: -4px;
}
.twcbook-reserve-seedling svg {
    width: 30px;
    height: 30px;
    vertical-align: -3px;
    margin-right: 6px;
}
.twcbook-tip-note-icon {
    color: var(--twc-camel);
}
.twcbook-tip-note-icon svg {
    width: 18px;
    height: 18px;
    vertical-align: -4px;
}
.twcbook-reserve-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 28px 0 0;
    color: var(--twcbook-green-dark);
    font-size: 15px;
    font-weight: 500;
}
.twcbook-reserve-footer svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

/* "Please Pick a Date" heading (text swapped by product_page.js per step) */
.twcbook-product-page .twc-book-info {
    background: transparent !important;
    color: var(--twcbook-green-dark) !important;
    min-height: 0;
    margin: 22px 0 0;
}
.twcbook-product-page #twc-book-info-text {
    font-family: var(--twc-font-display);
    font-size: 26px;
    font-weight: 600;
    color: var(--twcbook-green-dark);
    margin: 0;
}
.twcbook-product-page #twc-book-info-text::before {
    content: "";
    display: inline-block;
    vertical-align: -4px;
    width: 22px;
    height: 22px;
    margin-right: 10px;
    background-color: var(--twcbook-green);
    -webkit-mask: url("../../resources/icon/calendar.svg") center / contain no-repeat;
    mask: url("../../resources/icon/calendar.svg") center / contain no-repeat;
}
.twcbook-calendar-sub {
    text-align: center;
    color: var(--twcbook-muted);
    font-size: 15px;
    margin: 4px 0 16px;
}

/* ---------- calendar restyle ---------- */

.twcbook-product-page #twc-book-calendar-wrap {
    margin-top: 6px;
}
.twcbook-product-page .fc .fc-header-toolbar {
    background: var(--twcbook-green-dark);
    border-radius: 8px 8px 0 0;
    padding: 10px 16px;
    margin-bottom: 0 !important;
    gap: 8px;
}
.twcbook-product-page .fc .fc-toolbar-title {
    color: var(--twc-white);
    font-family: var(--twc-font-display);
    font-size: 22px;
    font-weight: 500;
}
/* !important: both FullCalendar's defaults and Avada's global button color
   (brand indigo) otherwise win and leave the buttons dark blue on dark green */
.twcbook-product-page .fc .fc-button-primary {
    background: var(--twc-white) !important;
    border: none !important;
    color: var(--twcbook-green-dark) !important;
    font-family: var(--twc-font-body);
    font-weight: 600;
    text-transform: capitalize;
    border-radius: var(--twc-radius);
    box-shadow: none !important;
}
.twcbook-product-page .fc .fc-button-primary:not(:disabled):hover,
.twcbook-product-page .fc .fc-button-primary:not(:disabled):active {
    background: var(--twcbook-green-soft) !important;
    color: var(--twcbook-green-dark) !important;
}
.twcbook-product-page .fc .fc-button-primary:disabled {
    background: var(--twc-white) !important;
    color: var(--twcbook-green-dark) !important;
    opacity: 0.55;
}
.twcbook-product-page .fc .fc-col-header-cell {
    background: #f4f1e8;
    padding: 8px 0;
}
.twcbook-product-page .fc .fc-col-header-cell-cushion {
    color: #6c7a6e;
    font-family: var(--twc-font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
}
.twcbook-product-page .fc-theme-standard td,
.twcbook-product-page .fc-theme-standard th,
.twcbook-product-page .fc-theme-standard .fc-scrollgrid {
    border-color: #e7e3d8;
}
.twcbook-product-page .fc .fc-daygrid-day {
    background: #fffdf8;
}
.twcbook-product-page .fc .fc-daygrid-day.fc-day-today {
    background: var(--twcbook-green-soft);
}
.twcbook-product-page .fc .fc-daygrid-day-number {
    color: var(--twcbook-muted);
    font-family: var(--twc-font-body);
    font-size: 13px;
    text-decoration: none;
}
.twcbook-product-page div#twc-book-calendar-overlay {
    top: 0;
    border-radius: 8px;
    background: rgba(250, 247, 242, 0.55);
}
.twcbook-product-page .lds-ring div {
    border-color: var(--twcbook-green) transparent transparent transparent;
}

/* ---------- numbered step layout ---------- */

.twcbook-product-page form.cart {
    width: 100%;
    display: flex;
    flex-direction: column; /* product_page.css assumes this; Avada doesn't set display:flex */
}
.twcbook-steps {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    width: 100%;
    margin-top: 18px;
    counter-reset: twcbook-step;
}
.twcbook-steps-col {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.twcbook-product-page div#date-time-picked,
.twcbook-product-page #twc-book-guest-options,
.twcbook-product-page #twc-book-tip-options,
.twcbook-product-page #twc-book-sms-notification,
.twcbook-product-page #twc-book-waitlist-form {
    border: 1px solid var(--twcbook-line);
    border-radius: 10px;
    background: #fffdf9;
    padding: 18px 20px;
    margin-top: 0;
}
.twcbook-steps .twcbook-step-title {
    counter-increment: twcbook-step;
    font-family: var(--twc-font-body);
    font-size: 16px;
    font-weight: 700;
    color: var(--twc-ink);
    letter-spacing: 0;
    text-transform: none;
    margin: 0 0 12px;
}
.twcbook-steps .twcbook-step-title::before {
    content: counter(twcbook-step) ". ";
    color: var(--twcbook-green-dark);
}
.twcbook-step-title .twcbook-optional {
    font-weight: 400;
    color: var(--twcbook-muted);
    font-size: 14px;
}

/* step 1: date & time card */
.twcbook-product-page div#date-time-picked {
    flex-wrap: wrap;
}
.twcbook-product-page #date-time-picked .twcbook-step-title {
    flex: 0 0 100%;
}
.twcbook-product-page #date-time-picked > span:first-of-type {
    position: relative;
    display: flex;
    flex-direction: column;
    padding-left: 36px;
}
.twcbook-product-page #date-time-picked > span:first-of-type::before {
    content: "";
    position: absolute;
    left: 0;
    top: 4px;
    width: 24px;
    height: 24px;
    background-color: var(--twcbook-green);
    -webkit-mask: url("../../resources/icon/calendar.svg") center / contain no-repeat;
    mask: url("../../resources/icon/calendar.svg") center / contain no-repeat;
}
.twcbook-product-page .twcbook-detail {
    font-family: var(--twc-font-body);
    font-size: 15px;
    font-weight: 600;
    color: var(--twc-ink);
    margin: 2px 0;
}
.twcbook-product-page button#change-date-time {
    background: var(--twc-white);
    border: 1px solid #c9cdd5;
    color: var(--twcbook-green-dark);
    border-radius: var(--twc-radius);
    padding: 8px 20px;
    font-weight: 600;
}
.twcbook-product-page button#change-date-time:hover {
    background: var(--twcbook-green-soft);
}

/* step 2: guests */
.twcbook-product-page .single-guest {
    background: var(--twc-white);
    border: 1px solid var(--twcbook-line);
    border-radius: 8px;
    padding: 10px 12px;
    margin: 0 0 12px;
}
.twcbook-product-page .guest-identifier-tag {
    font-size: 14px;
    font-weight: 600;
    color: var(--twcbook-green-dark);
}
.twcbook-product-page button.button.remove-guest {
    background: transparent;
    color: #8a91a0;
}
.twcbook-product-page button.button.remove-guest:hover {
    color: #c0392b;
}
.twcbook-product-page button.button.add-guest {
    width: 100%;
    background: var(--twc-white);
    border: 1px dashed #a9bcae !important;
    color: var(--twcbook-green-dark);
    border-radius: 8px;
    padding: 12px !important;
    font-weight: 600;
}
.twcbook-product-page button.button.add-guest:hover {
    background: var(--twcbook-green-soft);
}
.twcbook-product-page button.button.add-guest small {
    font-weight: 400;
    color: var(--twcbook-muted);
}
.twcbook-product-page label#twcbook-current-price {
    display: block;
    margin: 12px 0 0;
    padding-top: 12px;
    border-top: 1px solid var(--twcbook-line);
    font-weight: 700;
    color: var(--twc-ink);
}
.twcbook-product-page .guest-choices select,
.twcbook-product-page .waitlist-signup-input,
.twcbook-product-page #sms-phone,
.twcbook-product-page #twcbook-custom-tip,
.twcbook-product-page span.select2-selection.select2-selection--multiple,
.twcbook-product-page span.select2-selection.select2-selection--single {
    background: var(--twc-bg);
    border: 1px solid #c9cdd5;
    border-radius: var(--twc-radius);
    color: var(--twc-ink);
}
.twcbook-product-page .guest-choices select:focus,
.twcbook-product-page .waitlist-signup-input:focus,
.twcbook-product-page #sms-phone:focus,
.twcbook-product-page #twcbook-custom-tip:focus,
.twcbook-product-page span.select2-selection.select2-selection--multiple:focus,
.twcbook-product-page span.select2-selection.select2-selection--single:focus {
    border-color: var(--twcbook-green);
    outline: none;
}
.twcbook-product-page span.select2-selection.select2-selection--single .select2-selection__arrow {
    height: 100%;
    top: 0;
    right: 6px;
    background: none;
    border: 0;
}
.twcbook-product-page .guest-choices .select2-container.select2 {
    z-index: 100 !important;
}
/* steps 3 + 4: tips & text updates */
.twcbook-product-page #twc-book-tip-options p,
.twcbook-product-page #twc-book-sms-notification p {
    font-size: 14px;
    line-height: 1.55;
    color: var(--twcbook-muted);
}
.twcbook-product-page .tip-radio-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 12px 0;
}
.twcbook-product-page .tip-radio-options label,
.twcbook-product-page #twc-book-sms-notification label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--twc-white);
    border: 1px solid #cdd5cd;
    border-radius: 24px;
    padding: 8px 18px;
    font-size: 14px;
    font-weight: 500;
    color: var(--twc-ink);
    cursor: pointer;
    margin-right: 8px;
}
.twcbook-product-page .tip-radio-options label:has(input:checked),
.twcbook-product-page #twc-book-sms-notification label:has(input:checked) {
    border-color: var(--twcbook-green);
    background: var(--twcbook-green-soft);
}
.twcbook-product-page #twc-book-sms-notification label[for="sms-phone"] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 0;
}
.twcbook-product-page input[name="twcbook-tip"],
.twcbook-product-page input[name="twcbook-sms-notify-phone"] {
    accent-color: var(--twcbook-green);
}

/* waitlist */
.twcbook-product-page #twc-book-waitlist-form h2 {
    font-family: var(--twc-font-display);
    font-size: 24px;
    color: var(--twcbook-green-dark);
}
.twcbook-product-page #join-waitlist {
    background: var(--twcbook-green) !important;
    color: var(--twc-white) !important;
    border-radius: var(--twc-radius);
    font-weight: 600;
}
.twcbook-product-page #join-waitlist:hover {
    background: var(--twcbook-green-dark) !important;
}

/* step: number of guests, for products without variable guest prices. The
   WooCommerce quantity stepper is moved in here by product_page.js. */
.twcbook-product-page #twc-book-guests.twcbook-guest-count {
    display: none;
    border: 1px solid var(--twcbook-line);
    border-radius: 10px;
    background: #fffdf9;
    padding: 18px 20px;
}
.twcbook-product-page .twcbook-guest-count-help {
    margin: 0 0 12px;
    color: var(--twcbook-muted);
    font-size: 14px;
}
.twcbook-product-page #twc-book-guests .quantity.buttons_added {
    display: inline-flex !important;
    align-items: stretch;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 1px solid #c9cdd5 !important;
    border-radius: var(--twc-radius);
    background: var(--twc-bg);
    overflow: hidden;
    float: none !important;
}
.twcbook-product-page #twc-book-guests .quantity .minus,
.twcbook-product-page #twc-book-guests .quantity .plus {
    width: 46px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--twcbook-green-dark) !important;
    font-size: 20px !important;
    font-weight: 600;
    line-height: 1 !important;
    cursor: pointer;
}
.twcbook-product-page #twc-book-guests .quantity .minus:hover,
.twcbook-product-page #twc-book-guests .quantity .plus:hover {
    background: var(--twcbook-green-soft) !important;
}
.twcbook-product-page #twc-book-guests .quantity input.qty {
    width: 64px !important;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-left: 1px solid #c9cdd5 !important;
    border-right: 1px solid #c9cdd5 !important;
    border-radius: 0 !important;
    background: var(--twc-white) !important;
    color: var(--twc-ink) !important;
    font-size: 16px !important;
    font-weight: 600;
    text-align: center;
    -moz-appearance: textfield;
}
.twcbook-product-page #twc-book-guests .quantity input.qty::-webkit-inner-spin-button,
.twcbook-product-page #twc-book-guests .quantity input.qty::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.twcbook-product-page #twc-book-guests .quantity input.qty:focus {
    outline: 2px solid var(--twcbook-green);
    outline-offset: -2px;
}

/* WooCommerce renders a .quantity wrapper holding only a hidden input when no
   picker is needed; Avada still gives the empty wrapper a visible border line */
.twcbook-product-page form.cart .quantity:has(> input.qty[type="hidden"]) {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

/* add to cart (revealed by product_page.js after a slot is picked) */
.twcbook-product-page button.single_add_to_cart_button.button.alt {
    width: min(100%, 460px);
    align-self: center;
    margin: 26px auto 0;
    background: var(--twcbook-green) !important;
    color: var(--twc-white) !important;
    border: none;
    border-radius: 8px;
    padding: 16px 30px;
    font-family: var(--twc-font-body);
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: background-color 0.2s ease;
}
.twcbook-product-page button.single_add_to_cart_button.button.alt:hover {
    background: var(--twcbook-green-dark) !important;
}

/* ---------- responsive ---------- */

/* min-width:0 / minmax(0,…) everywhere: a bare 1fr track has an implicit
   `auto` minimum, so the gallery's intrinsic width (flexslider's stale
   inline pixel sizes) blows the column out past the screen edge */
.twcbook-hero-media,
.twcbook-hero-summary {
    min-width: 0;
}
@media only screen and (max-width: 1000px) {
    .twcbook-single .twcbook-hero {
        grid-template-columns: minmax(0, 1fr);
    }
}
@media only screen and (max-width: 900px) {
    .twcbook-steps {
        flex-direction: column;
    }
    .twcbook-steps-col {
        width: 100%;
    }
}
@media only screen and (max-width: 750px) {
    /* the old plugin CSS strips #main's padding below 750px: keep the photo
       full-bleed but give the text sections their side gutters back */
    .twcbook-single .twcbook-hero {
        gap: 20px;
    }
    #main .twcbook-single .summary.entry-summary.twcbook-hero-summary {
        width: auto !important;
        margin: 0 16px !important;
    }
    .twcbook-callouts,
    .twcbook-menu-buttons {
        margin-left: 14px;
        margin-right: 14px;
    }
    .twcbook-reserve {
        padding: 24px 14px 28px;
        border-radius: 0;
        border-left: none;
        border-right: none;
    }
    h1.twcbook-title {
        font-size: 30px;
    }
    .twcbook-product-page #twc-book-info-text {
        font-size: 22px;
    }
    .twcbook-product-page .fc .fc-toolbar-title {
        font-size: 17px;
    }
    a.twcbook-menu-button {
        width: 100%;
        justify-content: center;
    }
    /* calmer calendar grid on small screens */
    .twcbook-product-page .fc-dayGridMonth-view .fc-daygrid-event-harness .fc-event-main {
        min-height: 48px;
        height: min(16vw, 64px);
    }
    .twcbook-product-page .fc .fc-daygrid-day-number {
        font-size: 11px;
        padding: 2px 3px;
    }
    .twcbook-product-page .fc .fc-col-header-cell-cushion {
        font-size: 10px;
        letter-spacing: 0.04em;
    }
    .twcbook-product-page .fc .fc-header-toolbar {
        border-radius: 0;
    }
}