/*
Theme Name: BlankSlate
Theme URI: https://opencollective.com/blankslate
Author: Web Guy
Author URI: https://opencollective.com/blankslate#section-contributors
Description: Donate: https://opencollective.com/blankslate. Learn: https://blankslate.me/. BlankSlate is the definitive WordPress boilerplate starter theme. I've carefully constructed the most clean and minimalist theme possible for designers and developers to use as a base to build websites for clients or to build completely custom themes from scratch. Clean, simple, unstyled, semi-minified, unformatted, and valid code, SEO-friendly, jQuery-enabled, no programmer comments, standardized and as white label as possible, and most importantly, the CSS is reset for cross-browser-compatability, with no intrusive visual CSS styles added whatsoever. A perfect skeleton theme. For support and suggestions, go to: https://github.com/webguyio/blankslate/issues. Thank you.
Tags: accessibility-ready, one-column, two-columns, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
Version: 2026
Requires at least: 5.2
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v3 or Later
License URI: https://www.gnu.org/licenses/gpl.html
Text Domain: blankslate

BlankSlate WordPress Theme 2011-2026
BlankSlate is distributed under the terms of the GNU GPL
*/

body {
  margin: 0px;
  font-family: Inter, Helvetica, sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Libre Baskerville', Times, serif;
}

.homepage-cover h1 {
  font-size: 3.5em !important;
}

.product-card .wp-block-group.is-vertical {
  margin: 1em !important;
}

#quotation-mark {
  max-height: 50px !important;
  max-width: 50px !important;
}

/* 1. Kill the default list margins and set the background */
.splide__track {
    background-color: #445D4A !important;
    min-height: 450px !important;
    padding: 0 !important; /* This removes the weird left margin */
    margin: 0 !important;
}

.splide__list {
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important; /* Ensures no bullet points or offsets */
}

/* 2. Force absolute vertical and horizontal centering */
.splide__slide {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* Horizontal center */
    align-items: center !important;    /* Vertical center */
    text-align: center !important;
    min-height: 450px !important;      /* Match the track height */
    padding: 40px !important;
}

/* 3. Text styling */
.splide__slide p {
    color: #ffffff !important;
    font-size: 1.8rem !important;
    max-width: 800px;
    margin: 0 auto !important;
}

/* 4. Mobile adjustment */
@media (max-width: 768px) {
    .splide__slide p {
        font-size: 1.2rem !important;
    }
}

.review-slider > figure {
  margin-bottom: 0 !important;
}

.wc-block-checkout {
  max-width: 90%;
}

@media (max-width: 600px) {
  .homepage-cover {
    max-height: 400px !important;
    min-height: 400px !important;
  }
  .homepage-cover h1 {
    font-size: 2.5em !important;
  }
  .product-card {
    flex-direction: column !important;
  }
}

.our-medical-approach {
  max-width: 1280px;
  margin: auto;
}

.get-started-btn a {
  background-color: transparent;
  color: white;
  border: 1px solid white;
  transition: background-color 0.5s, color 0.5s, border-color 0.5s;
}

.get-started-btn a:hover {
  background-color: white;
  color: black !important;
  border-color: white; /* stays white */
}

.why-choose-us-row {
    flex-wrap: wrap;
    justify-content: center;
}

.why-choose-us-row > * {
    flex-basis: 400px;
}

.why-choose-us-row svg {
    max-width: 150px;
    fill: #445D4A !important;
}

.why-choose-us-row path {
    fill: #445D4A !important;
}

/* HEADER BASE */
.site-header {
  background: #FFFAF1;
  border-bottom: 1px solid #e5e0d8;
}

.header-inner {
  max-width: 90%;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* LOGO */
.logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  text-decoration: none;
  color: #0b3d2e;
}

.logo-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #0b3d2e;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

/* NAV */
.main-nav {
  flex: 1;
  display: flex;
  justify-content: center;
}

.nav-links {
  list-style: none;
  display: flex;
  gap: 32px;
  margin: 0;
  padding: 0;
}

.nav-links a {
  text-decoration: none;
  color: #3d3d3d;
  font-weight: 500;
}

/* ACTIONS */
.header-actions {
  display: flex;
  align-items: center;
  gap: 16px;
}

.cart-icon {
  position: relative;
  text-decoration: none;
  font-size: 18px;
}

.cart-count {
  position: absolute;
  top: -6px;
  right: -10px;
  background: #0b3d2e;
  color: #fff;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 999px;
}

/* --- 1. Header & Desktop Defaults --- */
.site-header {
    position: relative !important;
    z-index: 9999 !important;
}

.hamburger {
    display: none; /* Hidden on desktop */
    font-size: 28px;
    background: none;
    border: none;
    cursor: pointer;
    color: #333;
    padding: 0;
    line-height: 1;
    position: relative;
    z-index: 10001 !important; /* Always stays above the mobile menu */
    pointer-events: auto !important;
}

/* --- 2. Mobile Styles --- */
@media (max-width: 768px) {
    
    .hamburger {
        display: block !important;
    }

    /* Full-Screen Mobile Nav Tray */
    #main-nav {
        display: none !important; /* Hidden by default */
        visibility: hidden;
        position: fixed !important; /* Fixed to cover whole screen */
        top: 0 !important;
        left: 0 !important;
        width: 100vw !important;
        height: 100vh !important; /* Full viewport height */
        background: #fbf7ef !important; /* Brand cream */
        z-index: 10000 !important;
        padding-top: 80px; /* Space for logo/header area */
        box-sizing: border-box;
    }

    /* Open State Triggered by JS */
    #main-nav.open {
        display: block !important;
        visibility: visible !important;
    }

    /* Menu List Structure */
    .nav-links {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important; /* Stretch for full-width rows */
        padding: 0 !important;
        margin: 0 !important;
        list-style: none !important;
    }

    /* List Item Row Styling */
    .nav-links li {
        width: 100%;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05); /* Subtle row separator */
    }

    /* Individual Link Styling */
    .nav-links li a {
        display: block;
        padding: 20px 40px;
        text-decoration: none;
        color: #333;
        font-size: 1.4rem;
        font-weight: 500;
        transition: all 0.3s ease;
    }

    /* Hover & Darker Shade Effect */
    .nav-links li a:hover,
    .nav-links li a:active {
        background-color: rgba(0, 0, 0, 0.05); /* Darker shade on hover */
        text-decoration: underline;
        padding-left: 50px; /* Slight horizontal shift */
        color: #4A5D51; /* Brand green highlight */
    }
}

/* FOOTER BASE */
.site-footer {
  background: #FFFAF1;
  border-top: 1px solid #e5e0d8;
  padding: 64px 24px 24px;
  color: #0b3d2e;
}

.footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 2fr 1fr;
  gap: 48px;
}

/* BRAND */
.footer-title {
  margin: 0 0 8px;
}

.footer-tagline {
  margin-bottom: 24px;
}

.footer-contact p {
  margin: 4px 0;
}

.footer-contact a {
  color: inherit;
  text-decoration: none;
}

.footer-socials {
  margin-top: 24px;
  display: flex;
  gap: 12px;
}

.footer-socials a {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #0b3d2e;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 12px;
}

/* NEWSLETTER */
.footer-newsletter h3 {
  margin-bottom: 16px;
}

.newsletter-form label {
  display: block;
  margin-bottom: 16px;
  font-size: 14px;
}

.newsletter-form input[type="email"] {
  width: 100%;
  padding: 10px;
  margin-top: 6px;
  border: 1px solid #0b3d2e;
  background: transparent;
}

.newsletter-form .checkbox {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  font-size: 13px;
}

.newsletter-form button {
  margin-top: 16px;
  padding: 12px;
  width: 100%;
  background: #1f5b2a;
  color: white;
  border: none;
  cursor: pointer;
}

/* LEGAL */
.footer-legal {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-legal a {
  color: #0b3d2e;
  text-decoration: underline;
  font-size: 14px;
}

/* BOTTOM */
.footer-bottom {
  margin-top: 48px;
  text-align: center;
  font-size: 13px;
  opacity: 0.8;
}

/* MOBILE */
@media (max-width: 768px) {
  .footer-inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* === BOOK ONLINE === */

/* 1. Main Container */
.home-featured-products {
    max-width: 960px;
    margin: 0 auto;
}

.home-featured-products .woocommerce ul.products {
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 0;
    margin: 0;
}

/* 2. The Card Structure */
.home-featured-products .woocommerce ul.products li.product {
    display: flex !important;
    flex-direction: row;
    width: 100% !important;
    margin: 0 0 40px 0 !important;
    padding: 0 !important;
    background-color: #FDF9F3 !important;
    border: 1px solid #E8E4DE;
    overflow: hidden;
    align-items: stretch;
}

/* 3. Left Side: Image */
.home-featured-products .woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    display: block;
    flex: 0 0 50%;
    margin: 0 !important;
    padding: 0 !important;
}

.home-featured-products .woocommerce ul.products li.product img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    display: block;
    margin: 0 !important;
}

/* 4. Right Side: Content Wrapper */
.home-featured-products .product-card-content {
    flex: 0 0 50%;
    padding: 60px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    box-sizing: border-box;
}

/* 5. Title & Separator */
.home-featured-products .woocommerce-loop-product__title {
    font-family: "Times New Roman", serif !important;
    font-size: 2rem !important;
    font-weight: 400 !important;
    color: #333 !important;
    width: 100%;
    margin: 0 0 15px 0 !important;
    padding: 0 0 15px 0 !important;
    border-bottom: 1px solid #D1D1D1 !important;
}

/* 6. Price & Duration Styling */
.home-featured-products .price-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 20px 0 40px 0;
}

.home-featured-products .product-duration {
    font-size: 0.95rem;
    color: #666;
    font-family: sans-serif;
}

.home-featured-products .woocommerce ul.products li.product .price {
    position: static !important;
    display: block !important;
    font-size: 1.1rem !important;
    color: #333 !important;
    font-weight: 400 !important;
    margin: 0 !important;
}

/* 7. "Book Now" Button */
.home-featured-products .woocommerce ul.products li.product .button {
    background-color: #4A5D51 !important;
    color: #fff !important;
    padding: 14px 35px !important;
    border-radius: 30px !important;
    font-size: 0.9rem !important;
    letter-spacing: 0.5px;
    text-decoration: none;
    text-transform: none;
    transition: background 0.3s ease;
}

.home-featured-products .woocommerce ul.products li.product .button:hover {
    background-color: #3e4e44 !important;
}

/* 8. Mobile Responsiveness */
@media (max-width: 800px) {
    .home-featured-products .woocommerce ul.products li.product {
        flex-direction: column;
    }
    
    .home-featured-products .woocommerce-LoopProduct-link,
    .home-featured-products .product-card-content {
        flex: 0 0 100%;
        width: 100%;
    }
    
    .home-featured-products .product-card-content {
        padding: 40px 30px;
    }
}

.wc-block-cart, .woocommerce-breadcrumb, .woocommerce-notices-wrapper, .product, .woocommerce-order {
  margin: 2em !important;
}

#sidebar {
  display: none;
}

/* 1. Target the button and its container */
.wc-block-cart__submit-button,
.wc-block-components-button.wp-element-button {
    background-color: #4A5D51 !important; /* Your brand forest green */
    color: #ffffff !important;
    padding: 18px 32px !important;
    border-radius: 50px !important; /* Fully rounded pill shape */
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, transform 0.2s ease !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(74, 93, 81, 0.2); /* Soft shadow for depth */
}

/* 2. Text inside the button */
.wc-block-components-button__text {
    color: #ffffff !important;
}

/* 3. Hover State */
.wc-block-cart__submit-button:hover,
.wc-block-components-button.wp-element-button:hover {
    background-color: #3e4e44 !important; /* Slightly darker green */
    transform: translateY(-1px); /* Subtle lift effect */
    box-shadow: 0 6px 20px rgba(74, 93, 81, 0.3);
}

/* 4. Active (Click) State */
.wc-block-cart__submit-button:active,
.wc-block-components-button.wp-element-button:active {
    transform: translateY(0);
}

/* Fix for WooCommerce Block wrapper alignment */
.wc-block-cart__submit-container {
    margin-top: 20px;
    display: flex;
    justify-content: flex-end; /* Aligns button to the right */
}

/* 1. Size and Position the Cart Button */
#cart-btn {
    display: inline-block;
    width: 28px; /* Adjust this to make it smaller/larger */
    height: auto;
    text-decoration: none;
    transition: transform 0.2s ease;
    vertical-align: middle;
}

/* 2. Color the SVG paths Green */
#cart-btn svg path {
    fill: #4A5D51 !important; /* Your brand forest green */
    transition: fill 0.3s ease;
}

/* 3. Style the Number (0) inside the bag */
#cart-btn svg text {
    display: none;
}

/* 4. Hover effect */
#cart-btn:hover {
    transform: scale(1.1); /* Slight pop on hover */
}

#cart-btn:hover svg path {
    fill: #3e4e44 !important; /* Slightly darker on hover */
}

/* 1. Base Button Style */
.single_add_to_cart_button.button.alt {
    background-color: #4A5D51 !important; /* Your brand forest green */
    color: #ffffff !important;
    padding: 15px 35px !important;
    border-radius: 50px !important; /* Pill shape to match your design */
    font-weight: 600 !important;
    font-size: 1rem !important;
    text-transform: none !important; /* Prevents forced uppercase */
    border: none !important;
    transition: background-color 0.3s ease, transform 0.2s ease !important;
}

/* 2. Hover State */
.single_add_to_cart_button.button.alt:hover {
    background-color: #3e4e44 !important; /* Darker green shade */
    transform: translateY(-1px); /* Subtle lift */
}

/* 3. Active/Click State */
.single_add_to_cart_button.button.alt:active {
    transform: translateY(0);
}

/* 4. Quantity Input Spacing (Optional) */
/* This gives the quantity box next to the button some breathing room */
.woocommerce .quantity {
    margin-right: 15px !important;
}

/* 1. Reset the Related Products container to use Flexbox */
.related.products ul.products {
    display: flex !important;
    flex-wrap: wrap !important; /* This allows items to drop to the next line */
    gap: 20px; /* Adjust spacing between cards */
    padding: 0;
    margin: 0;
}

/* 2. Reset the individual product items */
.related.products ul.products li.product {
    float: none !important; /* Kills the broken float logic */
    display: flex !important;
    flex-direction: column !important; /* Keeps the image on top of text */
    margin: 0 !important; /* We use 'gap' above for spacing instead */
    width: calc(25% - 15px) !important; /* Default 4 columns for desktop */
}

/* 3. Responsive Breakpoints */

/* Tablet: 2 columns */
@media (max-width: 950px) {
    .related.products ul.products li.product {
        width: calc(50% - 10px) !important;
    }
}

/* Mobile: 1 column (Full Width) */
@media (max-width: 480px) {
    .related.products ul.products li.product {
        width: 100% !important;
    }
    
    /* Ensure the image scales nicely when full width */
    .related.products ul.products li.product img {
        width: 100% !important;
        height: auto !important;
    }
}

/* --- Related Products Section --- */

/* 1. Container Reset */
.related.products ul.products {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 20px !important;
}

/* 2. Remove WooCommerce default margins/pseudo-elements */
.related.products ul.products::before,
.related.products ul.products::after {
    display: none !important;
    content: none !important;
}

.related.products ul.products li.product.first, 
.related.products ul.products li.product.last {
    margin: 0 !important;
    padding: 0 !important;
    clear: none !important;
}

/* 3. Individual Product Item Logic */
.related.products ul.products li.product {
    /* Change: Use a fixed width instead of 50% flex-basis */
    width: 300px !important; 
    flex: 0 0 auto !important; /* Prevents stretching */
    max-width: 100% !important;

    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
}

/* 4. Mobile: Stack them perfectly flush */
@media (max-width: 600px) {
    .related.products ul.products li.product {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* ===== Booking Engine ===== */

.booking-engine {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  padding: 28px;
  border: 1px solid #ddd;
  border-radius: 14px;
  background: #fff;
}

.booking-title {
  font-size: 1.7rem;
  margin-bottom: 24px;
}

/* ---- Time Slots ---- */

.time-slots {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 28px;
}

.time-slot {
  flex: 1 1 220px;
  padding: 20px;
  font-size: 1.1rem;
  border-radius: 12px;
  border: 2px solid #bbb;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
}

.time-slot:hover {
  border-color: #000;
}

.time-slot.active {
  background: #111;
  color: #fff;
  border-color: #111;
  box-shadow:
    0 0 0 3px rgba(0,0,0,0.15),
    0 0 20px rgba(0,0,0,0.25);
}

/* ---- Calendar ---- */

.calendar-section {
  margin-bottom: 24px;
}

.calendar-placeholder {
  padding: 18px;
  text-align: center;
  color: #666;
  background: #f4f4f4;
  border-radius: 12px;
  margin-bottom: 10px;
}

#booking-date {
  width: 100%;
  border: none;
}

/* Hide inline calendar initially */
.flatpickr-calendar {
  display: none;
  font-size: 0.9rem;
  transform: scale(0.95);
  transform-origin: top left;
}

/* ---- Availability Box ---- */

.booking-info {
  margin-bottom: 22px;
  padding: 16px;
  border-radius: 12px;
  font-size: 1.05rem;
}

.booking-info.blue   { background: #e6f0ff; border: 2px solid #4a7cff; }
.booking-info.green  { background: #e7f6e7; border: 2px solid #4caf50; }
.booking-info.yellow { background: #fff4d6; border: 2px solid #e0b000; }
.booking-info.orange { background: #ffe8d6; border: 2px solid #ff9800; }
.booking-info.red    { background: #fde7e7; border: 2px solid #f44336; }

.hidden {
  display: none;
}

/* ---- CTA ---- */

#book-now {
  width: 100%;
  padding: 20px;
  font-size: 1.15rem;
  border-radius: 14px;
  border: none;
  background: #000;
  color: #fff;
  cursor: pointer;
}

#book-now:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Hide calendar and date input until time slot is selected */
#booking-date {
  display: none;
}

.calendar-section .flatpickr-calendar {
  display: none;
}

/* ===== Mobile booking engine fixes ===== */
@media (max-width: 768px) {

  .booking-engine {
    padding: 18px;
    border-radius: 12px;
  }

  .booking-title {
    font-size: 1.4rem;
    margin-bottom: 16px;
    text-align: center;
  }

  /* Time slots */
  .time-slots {
    gap: 10px;
    margin-bottom: 18px;
  }

  .time-slot {
    flex: 1 1 100%;
    padding: 14px;
    font-size: 1rem;
    border-radius: 10px;
  }

  .time-slot.active {
    box-shadow:
      0 0 0 2px rgba(0,0,0,0.15),
      0 0 12px rgba(0,0,0,0.25);
  }

  /* Calendar section */
  .calendar-placeholder {
    padding: 14px;
    font-size: 0.95rem;
    margin-bottom: 8px;
  }

  /* Flatpickr sizing */
  .flatpickr-calendar {
    transform: scale(0.9);
    transform-origin: top center;
    margin: 0 auto;
  }

  .flatpickr-day {
    width: 34px;
    height: 34px;
    line-height: 34px;
    font-size: 0.85rem;
  }

  .flatpickr-weekday {
    font-size: 0.75rem;
  }

  /* Availability info */
  .booking-info {
    font-size: 0.95rem;
    padding: 12px;
    border-radius: 10px;
  }

  /* CTA */
  #book-now {
    padding: 16px;
    font-size: 1.05rem;
    border-radius: 12px;
  }
}
@media (max-width: 768px) {
  .wp-block-group.alignfull.is-layout-flex .booking-engine {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}

