/*
Theme Name: Refit Wellness Child
Theme URI: https://refitwellness.com/
Description: Refit Wellness Child Theme
Author: Your Name
Author URI: https://yourwebsite.com/
Template: twentytwentyfour
Version: 1.0.0
*/

/* Root Variables for Consistency */
:root {
    --font-size-nav: 1rem; /* Equivalent to 16px */
    --font-size-title: 2.5rem; /* Site title font size */
    --color-primary: #7A77B9; /* Primary color from logo */
    --color-active: #e77c40; /* Active item color from logo */
    --color-text: #333333; /* General text color */
    --color-background-hover: #eaeaea; /* Background color for hover state */
    --nav-item-vertical-padding: 20px; /* Added for vertical alignment */
    --nav-item-horizontal-padding: 30px; /* Increased for more space */
}
.service-template .service-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}
.service-acf-fields {
    margin-top: 2rem;
    padding: 1rem;
    background-color: #f8f8f8;
    border-radius: 5px;
}

.menu-item:hover {
    color: #ff6600; /* Change text color */
    transition: all 0.3s ease-in-out;
}
.current-menu-item > a {
    color: #0073e6;
    font-weight: bold;
    border-bottom: 2px solid #0073e6;
}

.acf-service-fields {
    margin-top: 2rem;
    padding: 1rem;
    background-color: #f8f8f8;
    border-radius: 5px;
}

.acf-service-fields .service-image {
    margin-bottom: 1rem;
}

.acf-service-fields .service-image img {
    max-width: 100%;
    height: auto;
}

.acf-service-fields .service-category {
    font-size: 1.1em;
    margin-bottom: 1rem;
}

.acf-service-fields .service-description {
    font-size: 1em;
    line-height: 1.6;
}

.home .has-text-align-left.wp-block-post-title, .page-id-2689 .has-text-align-left.wp-block-post-title, .page-id-359 .has-text-align-left.wp-block-post-title, .page-id-2027 .has-text-align-left.wp-block-post-title {
    display: none;
  }

/* Instructor Profile Styles */
.instructor-header {
    margin-bottom: 2rem;
}

.instructor-profile-photo img {
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    width: 100%;
    height: auto;
    object-fit: cover;
}

.instructor-name {
    color: var(--wp--preset--color--custom-primary-purple);
    margin-bottom: 1.5rem;
}

.instructor-specialties,
.instructor-certifications {
    margin-bottom: 2rem;
}

.instructor-specialties h3,
.instructor-certifications h3 {
    font-family: var(--wp--preset--font-family--didot);
    margin-bottom: 1rem;
    color: var(--wp--preset--color--custom-primary-purple);
}

.instructor-specialties ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.instructor-specialties li {
    position: relative;
    padding-left: 1.5rem;
    margin-bottom: 0.5rem;
    color: var(--wp--preset--color--contrast);
}

.instructor-specialties li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: var(--wp--preset--color--custom-primary-purple);
}

.certification-content {
    margin-top: 1rem;
    color: var(--wp--preset--color--contrast);
}

.certification-content p {
    margin-bottom: 0.5rem;
}

.instructor-quote {
    background: var(--wp--preset--color--custom-light-purple);
    border-radius: 8px;
    padding: 2rem;
    margin: 3rem auto;
    max-width: 800px;
    font-style: italic;
    color: var(--wp--preset--color--contrast);
}

.instructor-content {
    max-width: 800px;
    margin: 3rem auto;
}

/* Responsive adjustments */
@media (max-width: 781px) {
    .wp-block-columns {
        flex-wrap: wrap;
    }
    
    .wp-block-column {
        flex-basis: 100% !important;
    }
    
    .instructor-profile-photo {
        max-width: 300px;
        margin: 0 auto 2rem;
    }
}
  
  .cta-button:hover {
    background-color: #C34F2F;
    transition: background-color 0.3s ease;
  }
/* General navigation link hover styling */
.nav-link a,
.wp-block-navigation-item__content {
  color: #333333; /* Default text color */
  text-decoration: none; /* Remove underline */
  transition: color 0.3s ease, text-decoration 0.3s ease; /* Smooth hover transition */
}

.wp-block-navigation-item:hover .wp-block-navigation__submenu-container {
    display: block;
    opacity: 1;
    transition: opacity 0.3s ease;
  }
  
/* Hover state */
.nav-link a:hover,
.wp-block-navigation-item__content:hover {
  color: #D9613D; /* Change text color on hover */
  text-decoration: underline; /* Add underline for emphasis */
}


.service-category {
    font-size: 1.1em;
    margin-bottom: 1rem;
}

.service-description {
    font-size: 1em;
    line-height: 1.6;
}
.service-template .service-title {
    font-size: 2.5em;
    margin-bottom: 20px;
    text-align: center;
}

.service-template .service-image {
    margin-bottom: 20px;
}

.service-template .service-image img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.service-template .service-category {
    font-weight: bold;
    margin-bottom: 10px;
}

.service-template .service-description {
    margin-bottom: 20px;
}

.service-template .service-main-content {
    margin-top: 20px;
}
.wp-block-group.alignwide,
.wp-block-post-content {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

.wp-block-post-title {
    font-size: 2.5em;
    margin-bottom: 20px;
    text-align: center;
}


/* Ensure submenus fly out to the right */
.wp-block-navigation .has-child > .wp-block-navigation__submenu-container {
    left: 100%; /* Move submenu to the right */
    right: auto; /* Reset right positioning */
}

/* Style for nested submenus */
.wp-block-navigation .has-child > .wp-block-navigation__submenu-container .has-child > .wp-block-navigation__submenu-container {
    left: 100%; /* Ensure nested submenus also fly out to the right */
    right: auto; /* Reset right positioning */
}
/* Submenu styling */
.wp-block-navigation__submenu-container {
    background-color: #fff; /* Background color for submenu */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Subtle shadow for submenu */
}

/* Submenu item styling */
.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    padding: 10px 15px; /* Padding for submenu items */
    font-size: 0.9rem; /* Slightly smaller font for submenu items */
}

/* Hover and focus states for submenu items */
.wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.wp-block-navigation__submenu-container .wp-block-navigation-item__content:focus {
    background-color: var(--color-background-hover); /* Background color on hover */
    color: var(--color-primary); /* Text color on hover */
    outline: none; /* Remove default focus outline */
    text-decoration: underline; /* Add underline on hover */
}
.highlight-box {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 2rem;
    border-radius: 10px;
}

.highlight-box h2 {
    font-family: 'Didot', serif;
    position: absolute;
    top: 20px;
    left: 20px;
    background-color: rgba(255, 255, 255, 0.7);
    padding: 0.5rem 1rem;
    border-radius: 5px;
}

.highlight-box img {
    border-radius: 10px;
}
.read-more-btn {
    background-color: #8589bc;
    color: white;
    border: none;
    padding: 5px 10px;
    cursor: pointer;
  }

  .filter-buttons {
    margin-bottom: 20px;
    text-align: center;
  }
  
  .filter-btn {
    background-color: #b0b0fa;
    border: none;
    padding: 10px 20px;
    margin: 0 5px;
    cursor: pointer;
  }

  .hidden {
    display: none;
}
  
  .filter-btn.active {
    background-color: #8589bc;
    color: white;
  }
  
  .instructor-group {
    transition: opacity 0.3s ease;
  }
  
  .instructor-group.hidden {
    display: none;
  }
  .entry-content.alignwide.wp-block-post-content.has-global-padding.is-layout-constrained.wp-container-core-post-content-is-layout-1.wp-block-post-content-is-layout-constrained {padding:0;}
  .wp-block-group.is-position-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: rgba(249, 249, 249, 0.9) !important; /* Adjust the last value (0.9) for transparency */
    transition: background-color 0.3s ease;
}

/* Optional: Change background color on scroll */
.wp-block-group.is-position-sticky.scrolled {
    background-color: rgba(249, 249, 249, 1); /* Fully opaque when scrolled */
}

/* Ensure content doesn't jump when header becomes fixed */
body {
    padding-top: 100px; /* Adjust this value to match your header height */
}

/* Target price cells specifically */
.wp-block-table td.price-cell,
.wp-block-table td:last-child .wp-block-table__cell-content {
    color: #E77C40 !important; /* Use your brand orange */
    font-weight: bold;
    font-size: 1.1em; /* Slightly larger than normal text */
}

/* Ensure other cells aren't affected */
.wp-block-table td:not(.price-cell),
.wp-block-table td:not(:last-child) .wp-block-table__cell-content {
    color: inherit; /* Use the default text color */
}

/* Add some padding and align prices to the right */
.wp-block-table td.price-cell,
.wp-block-table td:last-child {
    padding-right: 15px;
    text-align: right;
}

/* Improve overall table styling */
.wp-block-table table {
    border-collapse: collapse;
    width: 100%;
}

.wp-block-table th {
    background-color: #F0F1F7; /* Light purple background */
    color: #333; /* Dark text for contrast */
    font-weight: bold;
    text-align: left;
    padding: 12px;
}

.wp-block-table td {
    padding: 10px;
    border-bottom: 1px solid #ddd;
}

/* Responsive design for mobile */
@media screen and (max-width: 600px) {
    .wp-block-table table {
        font-size: 14px; /* Slightly smaller font on mobile */
    }
    
    .wp-block-table td, .wp-block-table th {
        padding: 8px;
    }
}

/* General styling for 'cards' */
.wp-block-group.pricing-card {
  transition: all 0.3s ease;
  height: 100%; /* Ensure all cards in a row are the same height */
}

.wp-block-group.pricing-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Responsive adjustments */
@media (max-width: 781px) {
  .wp-block-column {
      margin-bottom: 20px;
  }
}

.wp-block-buttons > .wp-block-button.wp-block-button__width-25 {
    width: 25%; /* Default for desktop */
    max-width: 300px; /* Prevents it from getting too large */
    padding: 10px 20px;
}

@media (max-width: 768px) {
    .wp-block-buttons > .wp-block-button.wp-block-button__width-25 {
        width: 80%; /* Wider button for smaller screens */
        max-width: none; /* Removes size restriction on mobile */
    }
}

.hero-header {
    font-size: clamp(1.5rem, 5vw, 3rem); /* Scales between 1.5rem and 3rem */
    line-height: 1.2;
}

