.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; --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;
} .twcbook-product-page .twcbook-single {
font-family: var(--twc-font-body);
color: var(--twc-ink);
font-size: 16px;
line-height: 1.6;
} .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;
} #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;
} #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;
} .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; margin: 0 0 4px;
}
.twcbook-title-sprig { flex: 0 0 28px;
width: 28px;
height: 37px;
margin-top: 4px;
background-color: var(--twcbook-green);
-webkit-mask: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/branch.svg) center / contain no-repeat;
mask: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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;
} .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;
} .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);
} .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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/leaf.svg) center / contain no-repeat;
mask: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/leaf.svg) center / contain no-repeat;
} .twcbook-features h4:nth-of-type(5n+1)::after,
.twcbook-features h3:nth-of-type(5n+1)::after {
-webkit-mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/plant.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/heart.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/teapot.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/wheat.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/wheat.svg);
}
.twcbook-features h4:nth-of-type(5n)::after,
.twcbook-features h3:nth-of-type(5n)::after {
-webkit-mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/plant-2.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/plant-2.svg);
}
.twcbook-features > p,
.twcbook-intro > p {
position: relative;
margin: 0 0 14px 58px;
} .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;
} .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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/sun.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/sun.svg);
}
.twcbook-icon-tag {
background-color: var(--twc-camel);
-webkit-mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/tag.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/tag.svg);
}
.twcbook-icon-sprout {
background-color: var(--twcbook-green);
-webkit-mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/growth.svg);
mask-image: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/growth.svg);
}
.twcbook-cost-note {
display: block;
color: var(--twcbook-muted);
} .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;
} .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; 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;
} .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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/calendar.svg) center / contain no-repeat;
mask: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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;
} .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;
} .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;
} .twcbook-product-page form.cart {
width: 100%;
display: flex;
flex-direction: column; }
.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;
} .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(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../resources/icon/calendar.svg) center / contain no-repeat;
mask: url(//thewateringcan.ca/wp-content/plugins/TWC_Bookable/views/../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);
} .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;
} .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);
} .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;
} .twcbook-product-page form.cart .quantity:has(> input.qty[type="hidden"]) {
display: none !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
} .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;
}  .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) { .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;
} .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;
}
}