/* ==========================================================================
   Rentals and Permits Section Styles
   ========================================================================== */

/* ==========================================================================
   AI / DEVELOPER GUIDELINES: STYLING AND RESPONSIVE MEDIA QUERIES
   --------------------------------------------------------------------------
   - ALL media queries are consolidated at the bottom of this stylesheet.
   - When adding responsive styling, check if the target @media query already exists in the bottom section. also make sure if you are adding any styling block then should not already exist and if you think that any kind of styling block is reusable then create 1 common class and then use that class insted of adding new block of css and if need any additional or want to alter any styling then use the sub class in the parent.
   - IF IT EXISTS: Append the new styles inside that same @media block.
   - IF IT DOES NOT EXIST: Append the new @media query at the bottom while
     maintaining proper screen resolution hierarchy.
========================================================================== */

.pdop_container .rp_section_container:not(.rp-faq-with-filters-section) {
  width: 100%;
  margin: 40px auto;
  padding: 40px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.16);
  position: relative;
  z-index: 8;
}

.rp_section_container > div:last-child {
  margin-bottom: 0;
}
.rp-section-header {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 18px;
  margin-bottom: 20px;
}
.rp_section_title {
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  text-transform: uppercase;
  margin: 0 0 0 0;
  line-height: normal;
}

div ~ .pdop_program_detail_data_section {
  margin-top: 30px;
}

.program_note_section:last-child {
  margin-bottom: 0;
}

.program_note_section {
  margin-bottom: 0;
}

.rp_section_subtitle {
  font-size: 16px;
  color: #333333;
  margin: 0 0 0 0;
  font-weight: 400;
}

.location-subheading {
  font-size: 26px;
  font-weight: 700;
  border-radius: 0;
  display: inline-block;
  width: auto;
  padding: 0;
  margin: 0;
  text-transform: capitalize;
  margin-bottom: 15px;
}

.rp-locations-section + .rp-locations-section {
  margin-top: 50px;
}

/* Green Background Outer Box */
.rp_green_box {
  background-color: #5b8123; /* Olive green background matching the screenshot */
  border-radius: 20px;
  padding: 40px;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05);
}

/* Cards Grid */
.rp_cards_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}

.rs-card-footer {
  border: 0 !important;
  justify-content: start !important;
}

.rs-card-tags .rs-status-badge {
  /* position: initial;  */
}

/* Individual Card */
.rp_card {
  padding: 20px 16px;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow:
    0 69px 69px 0 rgba(0, 0, 0, 0.09),
    0 17px 38px 0 rgba(0, 0, 0, 0.1);
  /* transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), box-shadow 0.3s ease; */
  gap: 17px;
}

.rp_card:hover {
  /* transform: translateY(-6px); */
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}

/* Card Title */
.rp_card_title {
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  color: #000000;
  line-height: normal;
  margin: 0 0 0 0;
  min-height: 26px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  /* max-height: 52px;
    height: 52px; */
}

/* Card Meta Details */
.rp_card_meta {
  gap: 3px;
  display: flex;
  flex-direction: column;
  margin-top: auto;
}

.rp_meta_item {
  font-size: 14px;
  color: #000000;
  margin: 0 0 0 0;
  line-height: normal;
  font-weight: 400;
}

.rp_meta_item strong {
  font-weight: 400;
}

/* Card Image Wrapper */
.rp_image_wrapper {
  width: 100%;
  height: 176px;
  border-radius: 10px;
  overflow: hidden;
  background: linear-gradient(135deg, #d3dcbe 0%, #c4cfad 100%);
  position: relative;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.05);
}

/* Card Image */
.rp_card_image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.rp_card:hover .rp_card_image {
  transform: scale(1.05);
}
.rp_cta_button {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.rp_cta_button span {
  margin: 0 auto;
}
.rp_cta_button a {
  width: 100%;
}

.pdop_program_top_navigation_item {
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 16px;
  gap: 10px;
  flex: 1;
  border-radius: 20px;
  background-color: #eaefff;
  color: #3e3e3e;
  font-size: var(--body-base);
  font-weight: var(--fw-semibold);
  border: 1px solid #a9b4d7;
  transition: all 250ms ease-in-out;
  min-width: 225px;
  text-align: center;
}
.rental_top-navigation-bar {
  position: sticky;
  top: 111px;
  z-index: 9;
  scroll-behavior: smooth;
}
.rental_top-navigation-bar .pdop_program_top_navigation_item:hover {
  border-color: var(--color-primary);
}
/* .rental_top-navigation-bar .pdop_program_top_navigation_item:hover svg {
    stroke: #ffffff;

}
.rental_top-navigation-bar .pdop_program_top_navigation_item:hover svg path{
    stroke: #ffffff;

} */
/* .pdop_program_top_navigation_item:is(.mPS2id-highlight.mPS2id-highlight-first) {
  border-color: transparent;
  background-color: var(--color-primary);
  color: var(--color-white);
} */

.pdop_program_top_navigation_item:is(.pdop_nav_active) {
  border-color: transparent;
  background-color: var(--color-primary);
  color: var(--color-white);
}

.pdop_program_top_navigation_item:is(.pdop_nav_active) svg path {
  stroke: #ffffff;
  /* fill: #ffffff; */
}

.pdop_program_top_navigation_item svg path {
  stroke: #000000;
  /* fill: #000000; */
}

.rental_top-navigation-bar .pdop_program_top_navigation {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 11px 13px;
  background-color: #ecf0f8;
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.06);
  margin-bottom: 30px;
  z-index: 999;
  scrollbar-width: thin;
}
.rentals-permits-navigation-grid {
  position: sticky;
  top: 144px;
  z-index: 9;
}
.rentals-permits-section-wrapper {
  background: #ecf0f8;
  padding: 60px 0;
}
.icon-box-size {
  width: 32px;
  height: 32px;
}
.icon-box-size svg {
  width: 100% !important;
  height: 100% !important;
}
.rp-form-section {
  border-radius: 24px;
  background: #e2f8ff;
  display: flex;
  padding: 40px 100px;
  align-items: center;
  justify-content: center;
  gap: 20px;
  max-width: 833px;
  width: 100%;
  flex-direction: column;
  margin: 40px auto;
  box-sizing: border-box;
}

.rp-form-section .rp-form-shortcode-wrapper {
  border-radius: 24px;
  background: #fff;
  padding: 40px;
  box-shadow:
    6px 6px 0px #cbe32d,
    0 8px 30px rgba(0, 0, 0, 0.05);
  width: 100%;
  box-sizing: border-box;
}

/* Form Titles (Gravity Forms title and fallback shortcode heading) */
.rp-form-section .gform_title {
  color: #2b3c73;
  text-align: center;
  font-family: var(--font-family-figtree);
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 16px;
}

.rp-form-heading {
  color: #000;
  text-align: center;
  font-family: var(--font-family-figtree);
  font-size: 32px;
  font-style: normal;
  font-weight: 800;
  line-height: normal;
  text-transform: uppercase;
}

/* Hide labels for placeholders as per reference UI */
.rp-form-section .gfield_label,
.rp-form-section .gfield_required {
  display: none !important;
}

/* Gravity Forms Grid Layout */
.rp-form-section .gform_fields {
  display: grid !important;
  grid-template-columns: repeat(12, 1fr) !important;
  gap: 20px !important;
  row-gap: 20px !important;
}

.rp-form-section .gfield {
  grid-column: span 12 !important;
  margin: 0 !important;
}

.rp-form-section .gfield--width-half {
  grid-column: span 6 !important;
}

/* Field Inputs & Custom SVG Icons */
.rp-form-section input[type="text"],
.rp-form-section input[type="email"],
.rp-form-section input[type="url"],
.rp-form-section input[type="password"],
.rp-form-section input[type="search"],
.rp-form-section input[type="number"],
.rp-form-section input[type="tel"],
.rp-form-section input[type="date"],
.rp-form-section select,
.rp-form-section textarea {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 12px !important;
  border: 1px solid #9fcadc !important;
  background-color: #fff !important;
  color: #333333 !important;
  font-family: var(--font-family-figtree) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: normal !important;
  height: auto !important;
  padding: 13px 16px 13px 48px !important;
  transition: all 0.3s ease !important;
  outline: none !important;
  background-repeat: no-repeat !important;
  background-size: 19px 19px !important;
}

/* First & Last Name Fields (User Icon) */
.rp-form-section input[name*="name"],
.rp-form-section input[id*="name"],
.rp-form-section input[type="text"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M7.5 7C6.5375 7 5.71358 6.65733 5.02825 5.972C4.34275 5.2865 4 4.4625 4 3.5C4 2.5375 4.34275 1.71358 5.02825 1.02825C5.71358 0.34275 6.5375 0 7.5 0C8.4625 0 9.28642 0.34275 9.97175 1.02825C10.6573 1.71358 11 2.5375 11 3.5C11 4.4625 10.6573 5.2865 9.97175 5.972C9.28642 6.65733 8.4625 7 7.5 7ZM0 14.6155V12.3923C0 11.9026 0.133 11.4491 0.399 11.0317C0.665 10.6144 1.0205 10.2936 1.4655 10.0693C2.45383 9.58475 3.45092 9.22133 4.45675 8.979C5.46258 8.73667 6.477 8.6155 7.5 8.6155C8.523 8.6155 9.53742 8.73667 10.5433 8.979C11.5491 9.22133 12.5462 9.58475 13.5345 10.0693C13.9795 10.2936 14.335 10.6144 14.601 11.0317C14.867 11.4491 15 11.9026 15 12.3923V14.6155H0ZM1.5 13.1155H13.5V12.3923C13.5 12.1897 13.4413 12.0022 13.324 11.8298C13.2067 11.6574 13.0474 11.5168 12.8462 11.4078C11.9846 10.9834 11.1061 10.6619 10.2107 10.4433C9.31525 10.2248 8.41167 10.1155 7.5 10.1155C6.58833 10.1155 5.68475 10.2248 4.78925 10.4433C3.89392 10.6619 3.01542 10.9834 2.15375 11.4078C1.95258 11.5168 1.79333 11.6574 1.676 11.8298C1.55867 12.0022 1.5 12.1897 1.5 12.3923V13.1155ZM7.5 5.5C8.05 5.5 8.52083 5.30417 8.9125 4.9125C9.30417 4.52083 9.5 4.05 9.5 3.5C9.5 2.95 9.30417 2.47917 8.9125 2.0875C8.52083 1.69583 8.05 1.5 7.5 1.5C6.95 1.5 6.47917 1.69583 6.0875 2.0875C5.69583 2.47917 5.5 2.95 5.5 3.5C5.5 4.05 5.69583 4.52083 6.0875 4.9125C6.47917 5.30417 6.95 5.5 7.5 5.5Z' fill='%23009AD0'/%3E%3C/svg%3E") !important;
  background-position: left 16px center !important;
}

/* Email Field (Envelope Icon) */
.rp-form-section input[type="email"],
.rp-form-section input[name*="email"],
.rp-form-section input[id*="email"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='15' viewBox='0 0 19 15' fill='none'%3E%3Cpath d='M1.80775 15C1.30258 15 0.875 14.825 0.525 14.475C0.175 14.125 0 13.6974 0 13.1923V1.80775C0 1.30258 0.175 0.875 0.525 0.525C0.875 0.175 1.30258 0 1.80775 0H17.1923C17.6974 0 18.125 0.175 18.475 0.525C18.825 0.875 19 1.30258 19 1.80775V13.1923C19 13.6974 18.825 14.125 18.475 14.475C18.125 14.825 17.6974 15 17.1923 15H1.80775ZM9.5 8.05775L1.5 2.94225V13.1923C1.5 13.2821 1.52883 13.3558 1.5865 13.4135C1.64417 13.4712 1.71792 13.5 1.80775 13.5H17.1923C17.2821 13.5 17.3558 13.4712 17.4135 13.4135C17.4712 13.3558 17.5 13.2821 17.5 13.1923V2.94225L9.5 8.05775ZM9.5 6.5L17.3463 1.5H1.65375L9.5 6.5ZM1.5 2.94225V1.5V13.1923C1.5 13.2821 1.52883 13.3558 1.5865 13.4135C1.64417 13.4712 1.71792 13.5 1.80775 13.5H1.5V2.94225Z' fill='%23009AD0'/%3E%3C/svg%3E") !important;
  background-position: left 16px center !important;
}

/* Select Dropdown (Calendar Star Icon + Custom Right Arrow) */
.rp-form-section select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cg clip-path='url(%23clip0_40005034_53069)'%3E%3Cpath d='M19.2188 5.98309H0.78125V4.46484C0.78125 3.17043 1.83059 2.12109 3.125 2.12109H16.875C18.1694 2.12109 19.2188 3.17043 19.2188 4.46484V5.98309Z' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.88867 1.4375V3.18785' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M7.96289 1.4375V3.18785' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12.0352 1.4375V3.18785' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16.1094 1.4375V3.18785' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M19.2188 12.374V5.98438H0.78125V16.2233C0.78125 17.5177 1.83059 18.5671 3.125 18.5671H16.875C18.1504 18.5671 19.187 17.5483 19.2173 16.2802' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M10.0008 15.085L8.82545 15.5029C8.24822 15.7082 7.6449 15.2698 7.66174 14.6575L7.69604 13.4104L6.93529 12.4217C6.5617 11.9362 6.79217 11.2269 7.37979 11.0537L8.57639 10.701L9.28162 9.67195C9.62795 9.16664 10.3737 9.16664 10.72 9.67195L11.4253 10.701L12.6219 11.0537C13.2095 11.2269 13.4399 11.9362 13.0663 12.4217L12.3056 13.4104L12.3399 14.6575C12.3567 15.2698 11.7534 15.7082 11.1762 15.5029L10.0008 15.085Z' stroke='%23009AD0' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_40005034_53069'%3E%3Crect width='20' height='20' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-position:
    left 16px center,
    right 20px center !important;
  background-size:
    22px 22px,
    16px 16px !important;
  padding-right: 40px !important;
  cursor: pointer;
}

.rp-form-section select::-ms-expand {
  display: none !important;
}

/* Message Textarea (Chat Icon) */
.rp-form-section textarea {
  height: 140px !important;
  padding: 16px 16px 16px 48px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 19 19' fill='none'%3E%3Cpath d='M3.75 11.25H11.25V9.75H3.75V11.25ZM3.75 8.25H15.25V6.75H3.75V8.25ZM3.75 5.25H15.25V3.75H3.75V5.25ZM0 18.5385V1.80775C0 1.30258 0.175 0.875 0.525 0.525C0.875 0.175 1.30258 0 1.80775 0H17.1923C17.6974 0 18.125 0.175 18.475 0.525C18.825 0.875 19 1.30258 19 1.80775V13.1923C19 13.6974 18.825 14.125 18.475 14.475C18.125 14.825 17.6974 15 17.1923 15H3.5385L0 18.5385ZM2.9 13.5H17.1923C17.2693 13.5 17.3398 13.4679 17.4038 13.4038C17.4679 13.3398 17.5 13.2692 17.5 13.1923V1.80775C17.5 1.73075 17.4679 1.66025 17.4038 1.59625C17.3398 1.53208 17.2693 1.5 17.1923 1.5H1.80775C1.73075 1.5 1.66025 1.53208 1.59625 1.59625C1.53208 1.66025 1.5 1.73075 1.5 1.80775V14.8848L2.9 13.5Z' fill='%23009AD0'/%3E%3C/svg%3E") !important;
  background-position: left 16px top 16px !important;
  resize: vertical;
}

/* Fields Interactive States */
.rp-form-section input[type="text"]:focus,
.rp-form-section input[type="email"]:focus,
.rp-form-section input[type="url"]:focus,
.rp-form-section input[type="password"]:focus,
.rp-form-section input[type="search"]:focus,
.rp-form-section input[type="number"]:focus,
.rp-form-section input[type="tel"]:focus,
.rp-form-section input[type="date"]:focus,
.rp-form-section select:focus,
.rp-form-section textarea:focus {
  border-color: #0093d0 !important;
  box-shadow: 0 0 0 4px rgba(0, 147, 208, 0.15) !important;
}

/* Placeholder Colors */
.rp-form-section ::placeholder {
  color: #5a5a5a !important;
  opacity: 1 !important;
}

.rp-form-section :-ms-input-placeholder {
  color: #5a5a5a !important;
}

.rp-form-section ::-ms-input-placeholder {
  color: #5a5a5a !important;
}

/* Submit Button & Centering */
/* .rp-form-section .gform_footer,
.rp-form-section .gform_page_footer {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin-top: 25px !important;
    padding: 0 !important;
} */
.rp-form-heading {
  color: #000;
  text-align: center;
  font-family: var(--font-family-figtree);
  font-size: 32px;
  font-weight: 800;
  line-height: normal;
  text-transform: uppercase;
}
.pdop_program_detail_data_section .accordion-body p {
  line-height: normal;
  font-weight: 400;
  color: #000;
  flex: 1;
}

/* Responsive adjustments for the form */
@media (max-width: 991.98px) {
  .rp-form-section {
    padding: 40px 40px !important;
  }
}
@media (max-width: 767.98px) {
  .rp-form-section .gfield--width-half {
    grid-column: span 12 !important;
  }
}
@media (max-width: 575.98px) {
}

/* ==========================================================================
   Content with Background Component (Splash Pads & general layouts)
   ========================================================================== */
.rp-image-content-bg {
  width: 100%;
  margin-top: 30px;
  /* border-radius: 20px; */
  /* padding: 40px; */
  box-sizing: border-box;
}
.rp-icb-container {
  display: flex;
  gap: 40px;
  /* align-items: center; */
  justify-content: space-between;
}
.rp-image-content-bg.image-left .rp-icb-container {
  flex-direction: row-reverse;
}
.rp-icb-content-col {
  flex: 1;
  /* max-width: 627px; */
}
.rp-icb-image-col {
  flex: 0 0 40%;
  max-width: 450px;
}
.rp-icb-image {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
}
.rp-icb-heading {
  font-size: 28px;
  font-weight: 800;
  text-transform: uppercase;
  color: #000;
  margin: 0 0 20px 0;
  line-height: 1.2;
}
.rp-icb-wysiwyg h1,
.rp-icb-wysiwyg h2,
.rp-icb-wysiwyg h3,
.rp-icb-wysiwyg h4 {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin: 0 0 12px 0;
  font-family: var(--font-family-figtree, sans-serif);
}
.rp-icb-wysiwyg p {
  font-size: 16px;
  color: #334155;
  line-height: 24px;
  margin: 0 0 16px 0;
}
.rp-icb-wysiwyg p:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
   Locations component (Rehm/Ridgeland Pools list & dynamic maps)
   ========================================================================== */
.rp-locations-section {
  /* margin: 40px 0; */
}
.rp-locations-title {
  font-size: 32px;
  font-weight: 800;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 24px;
}
.rp-locations-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}
.rp-facility-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03);
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
  box-sizing: border-box;
}
.pdop_btn_tertiary {
  background-color: var(--color-accent-sky);
  color: white;
  padding-right: 55px;
  border-color: var(--color-accent-sky);
  span {
    margin-inline: auto;
    display: flex;
    align-items: center;
    gap: 8px;
    line-height: normal;
  }
  .pdop_btn_tertiary:hover {
    color: var(--color-primary);
  }
}
.rp-facility-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
}
.rp-facility-card-header {
  margin: 0;
}

.rp-facility-card-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.rp-facility-card-header .facility-tag {
  background: rgba(255, 216, 175, 1);
  color: rgba(191, 109, 21, 1);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: var(--fw-bold);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 4px 10px;
  border-radius: 20px;
  width: fit-content;
}
.rp-facility-title {
  font-size: 24px;
  font-weight: 700;
  color: #000;
  margin: 0;
}
.rp-facility-image-slider {
  height: 280px;
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background-color: #f1f5f9;
}
.rp-facility-image-slider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.rp-facility-single-img-container {
  position: relative;
  width: 100%;
  height: 100%;
}
.rp-facility-single-img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 16px;
}
.rp-swiper-overlay-title {
  position: absolute;
  bottom: 28px;
  left: 0;
  right: 0;
  text-align: center;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  z-index: 10;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
}
.rp-facility-swiper {
  width: 100%;
  height: 100%;
}
.rp-facility-swiper .swiper-pagination {
  bottom: 12px !important;
  z-index: 15;
  display: flex;
  justify-content: center;
  gap: 6px;
  width: 100%;
}
.rp-facility-swiper .swiper-pagination-bullet {
  background: #fff !important;
  opacity: 0.6;
  width: 8px;
  height: 8px;
  margin: 0 !important;
  transition: all 0.3s ease;
  border-radius: 50%;
}
.rp-facility-swiper .swiper-pagination-bullet-active {
  background: #d4fc34 !important; /* Active is green/yellow */
  opacity: 1;
  transform: scale(1.25);
}
.rp-facility-card-body {
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  flex-grow: 1;
}
.rp-facility-info-label {
  background-color: #e6f6fc;
  color: #0079a4;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 16px;
  border-radius: 4px;
  margin: 0;
}
.rp-facility-address {
  /* column-specific overrides only */
}
.rp-facility-court-info {
  /* column-specific overrides only */
}

/* Shared info column inside rp-inforwrap */
.rp-info-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}
.rp-info-col-hdr {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: #334155;
}
.rp-info-col-hdr svg {
  flex-shrink: 0;
}
.rp-info-col-hdr span {
  font-weight: 700;
  color: #475569;
}
.rp-info-col-text {
  font-size: 15px;
  color: #000;
  font-weight: 500;
  padding-left: 24px;
  line-height: 1.4;
}

/* 50/50 Layout when Court Info is present */
.rp-inforwrap.has-court-info {
  display: flex;
  flex-direction: row;
  gap: 24px;
  width: 100%;
}
.rp-inforwrap.has-court-info .rp-info-col {
  flex: 1 1 calc(50% - 12px);
}

@media (max-width: 575.98px) {
  .rp-inforwrap.has-court-info {
    flex-direction: column;
    gap: 16px;
  }
  .rp-inforwrap.has-court-info .rp-info-col {
    flex: 1 1 100%;
  }
}

/* Additional Details Styles */
.rp-facility-additional-details-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 8px;
}
.rp-additional-details-text {
  font-size: 15px;
  color: #000;
  font-weight: 500;
  line-height: 1.5;
  padding-left: 8px;
}

.rp-facility-map {
  width: 100%;
  height: 266px;
  border-radius: 16px;
  overflow: hidden;
  margin: 0;
  border: 1px solid #e2e8f0;
}
.rp-facility-map iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.rp-facility-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: auto;
}
.rp-facility-btn {
  background-color: #00a3d9;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  padding: 10px 16px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
  transition: all 0.25s ease;
  justify-content: flex-start;
  border: 0;
}
.rp-facility-btn:hover {
  background-color: #0082ae;
  transform: translateY(-1px);
}
.rp-facility-btn span:not(.rp-btn-arrow) {
  flex-grow: 1;
}
.rp-btn-arrow {
  width: 28px;
  height: 28px;
  background-color: #c1d82f;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2b3c73;
  flex-shrink: 0;
  transition: transform 0.25s ease;
}
.rp-facility-btn:hover .rp-btn-arrow {
  transform: scale(1.05);
}
.rp-btn-arrow svg {
  width: 12px;
  height: 12px;
  stroke-width: 2;
}

/* ==========================================================================
   Information Cards Section Component Styles (Fix)
   ========================================================================== */
/* .information-section {
  margin: 40px 0;
  width: 100%;
}
.information-section .main-heading {
  font-size: 24px;
  font-weight: 800;
  text-transform: uppercase;
  color: #000;
  margin-bottom: 20px;
}
.information-section .info-header {
  margin-bottom: 24px;
}
.information-section .heading-with-color {
  font-size: 18px;
  font-weight: 700;
  color: #0079a4;
  border-bottom: 2px solid #e2e8f0;
  padding-bottom: 8px;
}
.information-section .info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.information-section .info-grid.info-grid-cols-1 {
  grid-template-columns: 1fr;
}
.information-section .info-grid.info-grid-cols-2 {
  grid-template-columns: repeat(2, 1fr);
}
.information-section .info-grid.info-grid-cols-3 {
  grid-template-columns: repeat(3, 1fr);
}
.information-section .info-grid.info-grid-cols-4 {
  grid-template-columns: repeat(4, 1fr);
}
.information-section .info-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.information-section .info-icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.information-section .info-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.information-section .info-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.information-section .info-heading {
  font-size: 13px;
  font-weight: 700;
  color: #0079a4;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.information-section .info-desc,
.information-section .info-desc p {
  font-size: 16px;
  font-weight: 500;
  color: #000;
  margin: 0;
  line-height: 1.4;
}
.information-section .info-item.info-item-notes {
  grid-column: 1 / -1;
  border-top: 1px solid #e2e8f0;
  padding-top: 20px;
  margin-top: 10px;
} */

/* Google Maps Container & Custom Overlay Markers */
.rp-google-map-container,
.rp-google-map-leaflet {
  width: 100%;
  height: 100%;
}
.rp-google-map-container iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.rp-google-custom-marker,
.rp-custom-map-marker {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: absolute;
}
.rp-marker-pin-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rp-marker-pin {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 3px solid #ffab00; /* Gold/orange border */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  background: #fff;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.rp-marker-pin img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rp-marker-pin-arrow {
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #ffab00; /* Matching gold border */
  margin-top: -1px;
  z-index: 1;
}
.rp-marker-label {
  background-color: #000;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 4px;
  white-space: nowrap;
  margin-top: 6px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  text-transform: capitalize;
  width: max-content;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.leaflet-marker-icon.leaflet-interactive {
  position: relative;
}

.pdop_program_detail_data_section .program_faq_section .accordion {
  margin-top: 20px;
}
.pdop_program_detail_data_section .program_faq_section {
  margin-top: 50px;
}

.info-desc p + p {
  margin-top: 10px;
}

/* ==========================================================================
   Responsive Adaptations */
@media (max-width: 991px) {
  .rp-icb-container,
  .rp-image-content-bg.image-left .rp-icb-container {
    flex-direction: column-reverse;
    gap: 30px;
  }
  .rp-icb-image-col {
    width: 100%;
    max-width: 100%;
  }
  .rp-locations-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  /* .information-section .info-grid.info-grid-cols-3,
  .information-section .info-grid.info-grid-cols-4 {
    grid-template-columns: repeat(2, 1fr);
  } */
}

@media (max-width: 767px) {
  /* .rp-image-content-bg {
    padding: 24px;
  } */
  .rp-icb-heading {
    font-size: 24px;
  }
  .rp-facility-actions {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .rp-facility-image-slider {
    height: 220px;
  }
}

@media (max-width: 575px) {
  .information-section .info-grid {
    grid-template-columns: 1fr !important;
  }
}

.rentals-permits-navigation-grid .information-section + .information-section {
  margin-top: 30px;
}
.pdop-action-buttons-wrapper.buttons-count-1 .pdop_community_cta {
  max-width: 360px;
}

/* ==========================================================================
   Passes & Fees Component Styles
   ========================================================================== */
.rp-passes-alert-bar {
  background-color: #e2f5ff;
  color: #0082b3;
  font-size: 14px;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 30px;
  letter-spacing: 0.5px;
  width: 100%;
  box-sizing: border-box;
}

.rp-passes-tables-wrapper {
  display: flex;
  gap: 40px;
  margin-bottom: 40px;
  align-items: stretch;
  width: 100%;
}

/* Left Table: Annual */
.rp-passes-annual-container {
  display: flex;
  flex: 1;
  align-items: flex-end;
  position: relative;
}

.rp-passes-annual-labels {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
  z-index: 2;
  margin-right: -45px;
}

.rp-passes-annual-label {
  background-color: #e2f5ff;
  color: #000;
  font-weight: 700;
  font-size: 16px;
  padding: 12px 28px;
  border-radius: 30px 0 0 30px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 180px;
  box-sizing: border-box;
}

.rp-passes-annual-table-box {
  flex: 1;
  display: flex;
  flex-direction: column;
  z-index: 1;
}

.rp-passes-annual-header {
  background-color: #fdf6e2;
  color: #000;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  padding: 16px;
  border-radius: 16px 16px 0 0;
  border: 1px solid #e2e8f0;
  border-bottom: none;
  margin-left: 45px; /* Offset alignment to match the values box */
}

.rp-passes-annual-values-box {
  border: 1px solid #e2e8f0;
  border-radius: 0 0 16px 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  margin-left: 45px; /* Offset alignment to match the header */
}

.rp-passes-annual-value-cell {
  /* height: 56px; */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border-bottom: 1px solid #e2e8f0;
  padding: 20px;
  box-sizing: border-box;
  text-align: center;
}

.rp-passes-annual-value-cell > span {
  font-weight: 700;
  color: #000;
}

.rp-passes-annual-value-cell:last-child {
  border-bottom: none;
}

.rp-passes-annual-value-cell > a,
.rp-passes-daily-value > a {
  font-size: var(--body-base, 16px);
  font-weight: var(--fw-bold, 700);
  color: var(--color-accent-sky, #009ad0);
  text-decoration: underline;
  text-underline-position: from-font;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  margin-top: 6px;
}

.rp-passes-annual-value-cell > a svg,
.rp-passes-daily-value > a svg {
  transition: transform 0.2s ease;
}

.rp-passes-annual-value-cell > a:hover svg,
.rp-passes-daily-value > a:hover svg {
  transform: translateX(3px);
}

/* Right Table: Daily */
.rp-passes-daily-container {
  flex: 1.2;
  display: flex;
  z-index: 1;
}

.rp-passes-daily-table-box {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.rp-passes-daily-header {
  background-color: #fdf6e2;
  color: #000;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  padding: 16px;
  border-radius: 16px 16px 0 0;
  border: 1px solid #e2e8f0;
  border-bottom: none;
  padding-bottom: 25px;
  margin-bottom: -12px;
}

.rp-passes-daily-table {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
}

.rp-passes-daily-subheaders {
  display: flex;
  background-color: #2b3c73;
  border-radius: 12px 12px 0 0;
  margin: 4px;
  margin: 0;
}

.rp-passes-daily-subheader {
  flex: 1;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  padding: 12px 8px;
  border-right: 1px solid rgba(255, 255, 255, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1.3;
}

.rp-passes-daily-subheader:last-child {
  border-right: none;
}

.rp-passes-daily-values {
  display: flex;
  background-color: #fff;
}

.rp-passes-daily-value {
  flex: 1;
  color: #000;
  text-align: center;
  padding: 18px 10px;
  border-right: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.rp-passes-daily-value > span {
  flex: 1;
  font-size: 22px;
  font-weight: var(--fw-bold);
}

.rp-passes-daily-value:last-child {
  border-right: none;
}

/* ==========================================================================
   CTA Banner Component Styles
   ========================================================================== */
.rp-cta-banner {
  border-radius: 20px;
  padding: 28px 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 30px;
  color: #fff;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05);
  margin-top: 20px;
  border-left: 6px solid #c5d92d;
  position: relative;
}

.rp-cta-left {
  display: flex;
  align-items: center;
  flex: 1;
}

.rp-cta-text-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.rp-cta-badge-wrapper {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 2px;
}

.rp-cta-badge-icon {
  width: 14px;
  height: 14px;
  object-fit: contain;
}

.rp-cta-badge-text {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1px;
  /* color: #C5D92D; */
  text-transform: uppercase;
}

.rp-cta-title {
  font-size: 22px;
  font-weight: 00;
  margin: 0 0 4px 0;
  color: #fff;
  line-height: normal;
}

.rp-cta-desc {
  font-size: 16px;
  font-weight: 400;
  margin: 0;
  /* opacity: 0.9; */
  line-height: 1.4;
  color: #fff;
}

.rp-cta-right {
  flex-shrink: 0;
}

.rp-cta-right .pdop-action-buttons-wrapper {
  grid-template-columns: 1fr;
}

/* Responsive grid */
@media (max-width: 991px) {
  .rp-passes-tables-wrapper {
    flex-direction: column;
    gap: 30px;
  }
  .rp-passes-annual-container {
    align-items: center;
    justify-content: space-between;
  }
}

@media (max-width: 768px) {
  .rp-passes-annual-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
    display: flex !important;
    align-items: flex-end !important;
    padding-bottom: 8px !important;
  }
  .rp-passes-annual-labels {
    margin-right: -45px !important;
    margin-bottom: 12px !important;
    z-index: 2 !important;
  }
  .rp-passes-annual-label {
    border-radius: 30px 0 0 30px !important;
    justify-content: center !important;
    font-size: 14px;
    padding: 10px 20px;
    min-width: 140px;
  }
  .rp-passes-annual-table-box {
    min-width: 280px !important;
    z-index: 1 !important;
  }
  .rp-passes-annual-header,
  .rp-passes-daily-header {
    font-size: 16px;
    padding: 12px;
  }
  .rp-passes-annual-value-cell,
  .rp-passes-daily-value {
    padding: 12px 10px;
  }

  .rp-passes-annual-value-cell > span,
  .rp-passes-daily-value > span {
    font-size: 16px;
  }

  .rp-passes-annual-value-cell > a,
  .rp-passes-daily-value > a {
    font-size: var(--body-small, 14px);
  }

  .rp-passes-daily-subheader {
    font-size: 11px;
    padding: 8px 4px;
  }

  .rp-passes-daily-container {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    width: 100% !important;
    padding-bottom: 8px !important;
  }
  .rp-passes-daily-table-box {
    min-width: 400px !important;
  }

  .rp-cta-banner {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 20px;
  }
  .rp-cta-right {
    width: 100%;
  }
}

/* ==========================================================================
   Pool Occupancy & Status Component Styles
   ========================================================================== */
.rp-occupancy-section {
  margin-top: 40px;
  /* margin-bottom: 40px; */
}

.rp-occupancy-main-title {
  font-size: 28px;
  font-weight: 800;
  color: #000;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.rp-occupancy-live-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 24px;
  background-color: #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
  margin-bottom: 30px;
}

.rp-live-badge-wrapper {
  margin-bottom: 16px;
}

.rp-live-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #e8f5e9;
  color: #2e7d32;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
}

.rp-live-dot {
  width: 8px;
  height: 8px;
  background-color: #2e7d32;
  border-radius: 50%;
  display: inline-block;
  box-shadow: 0 0 0 0 rgba(46, 125, 50, 0.7);
  animation: rp-pulse-green 2s infinite;
}

@keyframes rp-pulse-green {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(46, 125, 50, 0.7);
  }
  70% {
    transform: scale(1.1);
    box-shadow: 0 0 0 6px rgba(46, 125, 50, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(46, 125, 50, 0);
  }
}

.rp-occupancy-progress-container {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.rp-occupancy-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rp-occupancy-row-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rp-pool-name {
  font-size: 16px;
  font-weight: 700;
  color: #000;
}

.rp-pool-percentage {
  font-size: 16px;
  font-weight: 700;
  color: #000;
}

.rp-progress-bar-track {
  height: 14px;
  background-color: #e2e8f0;
  border-radius: 20px;
  overflow: hidden;
  position: relative;
}

.rp-progress-bar-fill {
  height: 100%;
  background-color: #00a3d9;
  border-radius: 20px;
  transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  width: 0%;
}

.rp-occupancy-description {
  font-size: 15px;
  line-height: 1.6;
  color: #334155;
  margin-bottom: 24px;
}

.rp-occupancy-description h3 {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin-top: 24px;
  margin-bottom: 12px;
}

.rp-occupancy-alert-bar {
  background-color: #e2f5ff;
  color: #0082b3;
  font-size: 14px;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 30px;
  letter-spacing: 0.5px;
  width: 100%;
  box-sizing: border-box;
}

.rp-statusfy-section {
  margin-top: 30px;
}

.rp-statusfy-title {
  font-size: 22px;
  font-weight: 700;
  color: #000;
  margin-bottom: 20px;
}

.rp-statusfy-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-bottom: 40px;
}

.rp-statusfy-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 24px;
  background-color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.02);
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.rp-statusfy-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.04);
}

.rp-statusfy-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.rp-statusfy-tag {
  background-color: #e2f5ff;
  color: #0082b3;
  font-size: 11px;
  font-weight: 800;
  padding: 4px 10px;
  border-radius: 4px;
  letter-spacing: 0.5px;
}

.rp-statusfy-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 20px;
  text-transform: capitalize;
}

.rp-statusfy-status-badge.status-open {
  background-color: #e8f5e9;
  color: #2e7d32;
}

.rp-statusfy-status-badge.status-info {
  background-color: #e2f5ff;
  color: #0288d1;
}

.rp-statusfy-card-title {
  font-size: 18px;
  font-weight: 700;
  color: #000;
  margin: 0;
}

.rp-statusfy-desc-box {
  background-color: #f4f8fa;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px 16px;
  flex: 1;
}

.rp-statusfy-desc-box p {
  font-size: 13.5px;
  color: #475569;
  line-height: 1.5;
  margin: 0 0 8px 0;
}

.rp-statusfy-desc-box p:last-child {
  margin-bottom: 0;
}

.rp-statusfy-desc-box a {
  color: #0082b3;
  text-decoration: underline;
  font-weight: 600;
}

.rp-statusfy-desc-box a:hover {
  color: #005a7d;
}

.rp-statusfy-footer {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #64748b;
  font-size: 13px;
  font-weight: 500;
}

.rp-statusfy-footer svg {
  color: #94a3b8;
}

/* .rp-weather-section {
  margin-top: 40px;
  padding: 24px;
  background-color: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
} */

.rp-weather-title {
  font-size: 20px;
  font-weight: 700;
  color: #000;
  margin-bottom: 16px;
}

/* Responsive grid overrides */
@media (max-width: 768px) {
  .rp-statusfy-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

@media (max-width: 575px) {
  .rp-occupancy-main-title {
    font-size: 22px;
  }
  .rp-occupancy-live-card {
    padding: 16px;
  }
  .rp-statusfy-card {
    padding: 16px;
  }
  .rp-occupancy-alert-bar {
    font-size: 12px;
  }
  .rp-weather-section {
    padding: 16px;
  }
}

/* ==========================================================================
   Event Card Repeater Component Styles
   ========================================================================== */
.rp-event-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
  margin-top: 30px;
  margin-bottom: 40px;
}

.rp-event-card {
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 28px;
  padding: 25px 30px;
  box-shadow: 6px 6px 0px #c5d92d;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.rp-event-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0px #c5d92d;
}

.rp-event-card-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.rp-event-card-subheading {
  font-size: 12px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rp-event-card-title {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
  line-height: normal;
}

.rp-event-card .imgbox {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  overflow: hidden;
  background: #f1f5f9;
  position: relative;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.05);
  margin-top: 4px;
}

.rp-event-card .imgbox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.rp-event-card:hover .imgbox img {
  transform: scale(1.05);
}

.rp-event-card-content {
  font-size: 16px;
  font-weight: 400;
  color: #475569;
  line-height: 24px;
  margin: 0;
}

/* Responsiveness overrides */
@media (max-width: 991px) {
  .rp-event-cards-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
  .rp-event-card {
    padding: 30px;
  }
}

@media (max-width: 768px) {
  .rp-event-cards-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

@media (max-width: 575px) {
  .rp-event-card {
    padding: 24px;
    border-radius: 20px;
    box-shadow: 4px 4px 0px #c5d92d;
  }
  .rp-event-card:hover {
    transform: translate(-1px, -1px);
    box-shadow: 5px 5px 0px #c5d92d;
  }
  .rp-event-card-title {
    font-size: 20px;
  }
  .rp-event-card-content {
    font-size: 15px;
  }
}

/* Specific button overrides for Event Card */
.rp-event-card-btn-wrapper .pdop_btn {
  max-width: 236px !important;
  font-family: "Figtree", sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: normal !important;
}

/* ==========================================================================
   More Info Section Component Styles
   ========================================================================== */
.rp-more-info-section-wrapper {
  /* margin-top: 50px; */
  margin-bottom: 60px;
  display: flex;
  flex-flow: column;
  gap: 40px;
}

.rp-more-info-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 50px;
  align-items: start;
}

.rp-more-info-left {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.rp-more-info-right {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* CTA Download Box */
.rp-more-info-cta-box {
  background-color: #fdfde6;
  border-radius: 24px;
  padding: 10px 32px;
  box-sizing: border-box;
}

.rp-more-info-cta-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  border-bottom: 1px solid #e6e6cc;
  text-decoration: none !important;
  transition: all 0.2s ease;
}

.rp-more-info-cta-row:last-child {
  border-bottom: none;
}

.rp-more-info-cta-text {
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  transition: color 0.2s ease;
}

.rp-more-info-cta-row:hover .rp-more-info-cta-text {
  color: #00a3d9;
}

.rp-more-info-cta-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  background-color: #c5d92d;
  border-radius: 50%;
  color: #2b3c73;
  flex-shrink: 0;
  transition: all 0.2s ease;
}

.rp-more-info-cta-arrow svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  transition: transform 0.2s ease;
}

.rp-more-info-cta-row:hover .rp-more-info-cta-arrow {
  background-color: #b5c91d;
  transform: scale(1.05);
}

.rp-more-info-cta-row:hover .rp-more-info-cta-arrow svg {
  transform: translateX(2px);
}

/* Additional White Content Card */
.rp-more-info-additional-card {
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 32px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}

.rp-more-info-row ul {
  margin-left: 10px;
}
.rp-more-info-row h4,
.program_faq_section h2 {
  font-family: Figtree;
  font-weight: 700;
  font-size: 20px;
  line-height: normal;
}

/* Responsiveness overrides */
@media (max-width: 991px) {
  .rp-more-info-row {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .rp-more-info-cta-box {
    padding: 10px 24px;
  }
  .rp-more-info-cta-text {
    font-size: 16px;
  }
}

@media (max-width: 575px) {
  .rp-more-info-section-wrapper {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .rp-more-info-cta-box {
    padding: 5px 20px;
    border-radius: 16px;
  }
  .rp-more-info-cta-row {
    padding: 16px 0;
  }
  .rp-more-info-cta-arrow {
    width: 34px;
    height: 34px;
  }
  .rp-more-info-cta-arrow svg {
    width: 16px;
    height: 16px;
  }
  .rp-more-info-additional-card {
    padding: 20px;
    border-radius: 16px;
  }
}

/* Centered Button or PDF Section Wrapper */
.rp-button-or-pdf-centered {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  margin-top: 18px;
  /* margin-bottom: 30px; */
}

.rp-button-or-pdf-centered .pdop-action-buttons-wrapper {
  width: max-content !important;
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
}

.crc-main .common-data-secion-box {
  margin-top: 45px;
}

.pdop_heading_black {
  font-size: var(--heading-line-height);
  font-weight: var(--fw-extrabold);
  margin-bottom: 20px;
  color: var(--color-black);
}

.pdop_current_projects_subtitle {
  font-size: var(--body-base);
  font-weight: var(--fw-regular);
  color: var(--color-black);
  font-family: var(--font-family-figtree);
}

/* ==========================================================================
   FAQ with Filters Component Styles
   ========================================================================== */
.rp-faq-filters-container {
  background-color: #ecf0f8;
  border-radius: 16px;
  padding: 24px;
  margin-block: 20px 30px;
  box-sizing: border-box;
}

.rp-faq-filters-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  border-bottom: 1px solid #d2d6e0;
  padding-bottom: 12px;
}

.rp-faq-filters-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 700;
  color: #2b3c73;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.rp-faq-filters-title svg {
  width: 20px;
  height: 20px;
  stroke: currentColor;
}

.rp-faq-clear-all {
  background: none;
  border: none;
  color: #2b3c73;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  padding: 0;
  font-family: "Figtree", sans-serif;
}

.rp-faq-clear-all:hover {
  text-decoration: underline;
}

.rp-faq-filters-body {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 40px;
  align-items: flex-end;
}

.rp-faq-filter-group-tags {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.rp-faq-filter-group-search {
  display: flex;
  align-items: flex-end;
  gap: 12px;
}

.rp-faq-filter-label {
  font-size: 14px;
  font-weight: 500;
  line-height: normal;
}

.rp-faq-tags-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.rp-faq-pill {
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 700;
  color: #475569;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: "Figtree", sans-serif;
}

.rp-faq-pill:hover {
  border-color: #cbd5e1;
  color: #1e293b;
}

.rp-faq-pill.active {
  background-color: #fff;
  border-color: #00a3d9;
  color: #00a3d9;
  box-shadow: 0 0 0 1px #00a3d9;
}

.rp-faq-search-wrapper {
  position: relative;
  flex: 1;
}

.rp-faq-search-wrapper input {
  width: 100%;
  padding: 10px 40px 10px 16px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  font-size: 14px;
  box-sizing: border-box;
  background-color: #fff;
  height: 40px;
  font-family: "Figtree", sans-serif;
}

.rp-faq-search-wrapper input:focus {
  outline: none;
  border-color: #00a3d9;
}

.rp-faq-search-icon {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: #2b3c73;
  display: flex;
  align-items: center;
  pointer-events: none;
}

.rp-faq-search-icon svg {
  width: 16px;
  height: 16px;
}

.rp-faq-apply-btn {
  background-color: #c5d92d;
  color: #2b3c73;
  font-weight: 700;
  font-size: 16px;
  padding: 12px 28px;
  border-radius: 20px;
  border: none;
  cursor: pointer;
  transition: background-color 0.2s ease;
  box-sizing: border-box;
}

.rp-faq-apply-btn:hover {
  background-color: #b5c91d;
}

/* Suggestions Dropdown */
.rp-faq-suggestions {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.1),
    0 2px 4px -2px rgba(0, 0, 0, 0.1);
  max-height: 200px;
  overflow-y: auto;
  z-index: 100;
  margin-top: 4px;
  display: none;
}

.rp-faq-suggestion-item {
  padding: 10px 16px;
  font-size: 14px;
  color: #334155;
  cursor: pointer;
  border-bottom: 1px solid #f1f5f9;
  text-align: left;
  font-family: "Figtree", sans-serif;
}

.rp-faq-suggestion-item:last-child {
  border-bottom: none;
}

.rp-faq-suggestion-item:hover {
  background-color: #f8fafc;
  color: #00a3d9;
}

/* Accordion Grid styling */
.rp-faq-with-filters-section .rp-faqs-section-card {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  align-items: start;
}

.rp-faq-with-filters-section .rp-faqs-section-card.rp-faqs-row {
  grid-template-columns: 1fr;
}

.rp-faqs-section-card .accordion-item.hidden {
  display: none !important;
}

@media (max-width: 991px) {
  .rp-faq-filters-body {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: stretch;
  }
  .rp-faq-filter-group-search {
    flex-direction: column;
    align-items: stretch;
  }
  .rp-faq-apply-btn {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .rp-faqs-section-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* ==========================================================================
   Weather Section Styles (ACF weather_repeater)
   ========================================================================== */
.rp-weather-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 20px;
  width: 100%;
  margin-top: 15px;
}

.rp-weather-card {
  width: 100%;
  overflow: hidden;
  /* border-radius: 8px; */
  padding-top: 92%;
  position: relative;
  /* aspect-ratio: 4 / 5; */
}

.rp-weather-card iframe {
  width: 100%;
  height: auto;
  position: absolute;
  inset: 0;
  border: 0;
}

/* ==========================================================================
   Popup Modal for Location Cards (Right Slide-out Drawer Panel)
   ========================================================================== */

.modal-backdrop {
  z-index: 999998;
}

.pdop_location_modal {
  z-index: 999999;
}

.pdop_location_modal.fade .modal-dialog {
  transform: translate3d(100%, 0, 0);
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.pdop_location_modal.show .modal-dialog {
  transform: translate3d(0, 0, 0);
}

.pdop_location_modal .modal-dialog {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  width: 90%;
  max-width: 1200px;
  height: 100vh;
}

.pdop_location_modal .srec-pdop-modal-content {
  border-radius: 0;
  border-top-left-radius: 24px;
  border-bottom-left-radius: 24px;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: none;
  box-shadow: -10px 0 40px rgba(0, 0, 0, 0.15);
}

.pdop_location_modal .srec-pdop-modal-header {
  padding: 20px 32px;
}

.pdop_location_modal .srec-pdop-modal-title {
  font-family: var(--font-family-figtree, sans-serif);
  font-size: 24px;
  font-weight: 800;
  color: #2b3c73;
}

.pdop_location_modal .modal-divider {
  margin: 0;
  border-top: 1px solid #e2e8f0;
  opacity: 1;
}

.pdop_location_modal .srec-pdop-modal-body {
  padding: 32px;
  /* padding-block: 0; */
  flex: 1;
  overflow-y: auto;
}

/* Side-by-side columns layout on desktop */
.pdop_location_modal .pdop-modal-columns {
  display: flex;
  flex-direction: row;
  gap: 40px;
  margin-bottom: 32px;
}

.pdop_location_modal .pdop-modal-left-col {
  flex: 0 0 48%;
  max-width: 48%;
  position: relative;
  display: flex;
  flex-direction: column;
}

.pdop_location_modal .pdop-modal-right-col {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Swiper Slider inside Modal */
.pdop_location_modal .pdop-modal-slider {
  width: 100%;
  height: 425px;
  border-radius: 24px;
  overflow: hidden;
  position: relative;
  border: 1px solid #e2e8f0;
}

.pdop_location_modal .pdop-modal-slider img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* White circle prev/next buttons overlaying the slider edges */
.pdop_location_modal .pdop-modal-slider .swiper-button-prev,
.pdop_location_modal .pdop-modal-slider .swiper-button-next {
  width: 40px;
  height: 40px;
  background-color: rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  color: #000;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

.pdop_location_modal .pdop-modal-slider .swiper-button-prev:hover,
.pdop_location_modal .pdop-modal-slider .swiper-button-next:hover {
  background-color: #fff;
  transform: scale(1.08);
}

.pdop_location_modal .pdop-modal-slider .swiper-button-prev::after,
.pdop_location_modal .pdop-modal-slider .swiper-button-next::after {
  font-size: 14px;
  font-weight: 900;
}

/* Small thumbnails overlaid on top of the main image */
.pdop_location_modal .pdop-modal-thumbs {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  width: auto;
  max-width: 90%;
  height: 55px;
  background: transparent;
  overflow: visible;
}

.pdop_location_modal .pdop-modal-thumbs .swiper-wrapper {
  justify-content: center;
  gap: 8px;
}

.pdop_location_modal .pdop-modal-thumbs .swiper-slide {
  width: 55px !important;
  height: 50px !important;
  opacity: 0.8;
  cursor: pointer;
  border-radius: 8px;
  overflow: hidden;
  border: 2px solid #fff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  transition: all 0.2s ease;
}

.pdop_location_modal .pdop-modal-thumbs .swiper-slide-thumb-active {
  opacity: 1;
  border-color: #ffb700 !important; /* Rich golden active border */
}

.pdop_location_modal .pdop-modal-thumbs img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Right Column Elements */
.pdop_location_modal .pdop-modal-badge {
  display: inline-block;
  background-color: #d1f3ff;
  color: #006080;
  font-size: 12px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 4px;
  align-self: flex-start;
  margin-bottom: 8px;
  text-transform: uppercase;
}

.pdop_location_modal .pdop-modal-facility-title {
  font-family: var(--font-family-figtree, sans-serif);
  font-size: 28px;
  font-weight: 800;
  color: #000;
  margin-bottom: 20px;
}

.pdop_location_modal .pdop-modal-section-banner {
  background-color: #e6f7ff;
  color: #007099;
  font-size: 14px;
  font-weight: 700;
  padding: 10px 16px;
  border-radius: 4px;
  margin-bottom: 20px;
  letter-spacing: 0.5px;
}

.pdop_location_modal .pdop-modal-amenities-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 24px;
}

.pdop_location_modal .pdop-modal-amenity-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 14px;
  color: #334155;
  line-height: 1.4;
}

.pdop_location_modal .pdop-modal-amenity-item svg {
  flex-shrink: 0;
  margin-top: 2px;
  fill: #00a3d9;
}

/* Bottom Promo Cards Row */
.pdop_location_modal .pdop-modal-bottom-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  border-top: 1px solid #e2e8f0;
  padding-top: 24px;
}

.pdop_location_modal .pdop-modal-promo-card {
  border-radius: 16px;
  border: 3px solid #d2e83e; /* Distinctive yellow/green border from UI */
  padding: 20px 24px;
  background-color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.pdop_location_modal .pdop-modal-promo-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
}

.pdop_location_modal .pdop-modal-promo-card .pdop_btn {
  max-width: 236px;
  width: 100%;
}

.pdop_location_modal .promo-label {
  font-size: 11px;
  font-weight: 800;
  color: #64748b;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.pdop_location_modal .promo-title {
  font-family: var(--font-family-figtree, sans-serif);
  font-size: 18px;
  font-weight: 700;
  color: #000;
  margin: 4px 0 8px 0;
}

.pdop_location_modal .promo-desc {
  font-size: 14px;
  color: #475569;
  line-height: 1.5;
  margin: 0;
}

/* Responsive adjustments for modal */
@media (max-width: 991.98px) {
  .pdop_location_modal .modal-dialog {
    width: 100%;
    max-width: 100%;
  }
  .pdop_location_modal .srec-pdop-modal-content {
    border-radius: 0;
  }
  .pdop_location_modal .pdop-modal-columns {
    flex-direction: column;
    gap: 24px;
  }
  .pdop_location_modal .pdop-modal-left-col,
  .pdop_location_modal .pdop-modal-right-col {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .pdop_location_modal .pdop-modal-slider {
    height: 280px;
  }
  .pdop_location_modal .pdop-modal-thumbs {
    bottom: 10px;
    height: 45px;
  }
  .pdop_location_modal .pdop-modal-thumbs .swiper-slide {
    width: 45px !important;
    height: 40px !important;
  }
  .pdop_location_modal .pdop-modal-bottom-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .rp-weather-card {
    padding-top: 97%;
  }
}

/* Styling for Additional Info / Rules Modal (e.g. pool rules list) */
.pdop_additional_info_modal .srec-pdop-modal-body ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.pdop_additional_info_modal .srec-pdop-modal-body ul li {
  position: relative;
  padding-left: 48px;
  padding-block: 25px;
  font-family: Figtree, var(--font-family-figtree, sans-serif);
  font-weight: 400;
  font-size: 16px;
  color: #334155;
  line-height: 19px;
  border-bottom: 1px solid #f1f5f9;
}

.pdop_additional_info_modal .srec-pdop-modal-body ul li:last-child {
  border-bottom: none;
}

/* Arrow inside the orange circle */
.pdop_additional_info_modal .srec-pdop-modal-body ul li::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  background-image: url("/wp-content/uploads/2026/06/arrow-icon.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  z-index: 2;
}

/* Heading style for Additional Info Modal Title */
.pdop_additional_info_modal .srec-pdop-modal-title {
  font-family: Figtree, var(--font-family-figtree, sans-serif);
  font-weight: 800;
  font-size: 26px;
  line-height: 100%;
  text-transform: uppercase;
}

/* Specific body padding override only for More Info section popups */
.pdop_additional_info_modal .srec-pdop-modal-body {
  padding-block: 0;
}

/* ==========================================================================
   App Check-In Side Drawer Styles
   ========================================================================== */

/* Drawer Container and Backdrop Overlay */
.app-checkin-drawer-container {
  font-family: var(--font-family-figtree, sans-serif);
}

.app-checkin-drawer-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(15, 23, 42, 0.4);
  backdrop-filter: blur(4px);
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease;
  z-index: 99998;
}

.app-checkin-drawer-overlay.active {
  opacity: 1;
  visibility: visible;
}

/* Drawer Sliding Panel */
.app-checkin-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 65%;
  max-width: 100%;
  height: 100vh;
  background: #ffffff;
  z-index: 99999;
  transform: translateX(100%);
  transition: transform 0.35s cubic-bezier(0.25, 0.8, 0.25, 1);
  display: flex;
  flex-direction: column;
  box-shadow: -12px 0 45px rgba(0, 0, 0, 0.15);
}

.app-checkin-drawer.active {
  transform: translateX(0);
}

/* Body Lock when Drawer Open */
body.drawer-open {
  overflow: hidden !important;
}

/* Drawer Header */
.app-checkin-drawer-header {
  padding: 24px 32px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e2e8f0;
  background: #ffffff;
}

.app-checkin-drawer-title {
  font-family: var(--font-family-figtree, sans-serif);
  font-size: 24px;
  font-weight: 800;
  color: #0f172a;
  margin: 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: normal;
}

.app-checkin-drawer-close {
  background: none;
  border: none;
  padding: 8px;
  color: #64748b;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

.app-checkin-drawer-close:hover {
  background-color: #f1f5f9;
  color: #0f172a;
}

/* Drawer Scrollable Body */
.app-checkin-drawer-body {
  padding: 32px;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 32px;
  background: #ffffff;
}

/* Top Intro Bar */
.app-checkin-intro-box {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 0;
  background-color: transparent;
  border: none;
}

.app-checkin-intro-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.app-checkin-intro-text {
  font-size: 15px;
  line-height: 1.6;
  color: #334155;
  font-weight: 500;
}

.app-checkin-intro-text p {
  margin: 0;
}

/* Note Cards (Yellow Highlight box) */
.app-checkin-notes-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.app-checkin-note-card {
  background-color: #fff8eb;
  border: 1px solid #fce8c3;
  border-radius: 16px;
  padding: 20px 24px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
  box-shadow: 0 2px 8px rgba(252, 232, 195, 0.15);
}

.app-checkin-note-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.app-checkin-note-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.app-checkin-note-content strong {
  font-size: 15px;
  color: #8f6411;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.app-checkin-note-content p {
  font-size: 14px;
  line-height: 1.5;
  color: #785207;
  margin: 0;
  font-weight: 500;
}

/* Two-column layout */
.app-checkin-split-section {
  display: flex;
  gap: 40px;
  align-items: flex-start;
}

.app-checkin-instructions-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.app-checkin-phone-col {
  flex: 0 0 270px;
  display: flex;
  justify-content: center;
}

/* Left side header and bands */
.app-checkin-section-title {
  font-size: 20px;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 8px;
}

.app-checkin-blue-banner {
  background-color: #e6f7ff;
  width: 100%;
  color: #007bb8;
  font-size: 13px;
  font-weight: 800;
  padding: 10px 16px;
  border-radius: 8px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  align-self: flex-start;
}

.download-banner {
  margin-top: 15px;
}

/* Steps List */
.app-checkin-steps-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.app-checkin-step-item {
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.app-checkin-step-number {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid #f26b52;
  color: #f26b52;
  font-weight: 800;
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  line-height: 1;
}

.app-checkin-step-details {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.app-checkin-step-title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
}

.app-checkin-step-desc {
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
}

.app-checkin-step-desc ul {
  padding-left: 20px;
  margin: 0;
}

.app-checkin-step-desc li {
  margin-bottom: 6px;
  list-style-type: disc;
}

.app-checkin-step-desc li:last-child {
  margin-bottom: 0;
}

/* App badge row */
.app-checkin-badge-row {
  display: flex;
  gap: 20px;
  margin-top: 10px;
}

.app-checkin-badge-col {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.badge-platform-label {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: 0;
  color: #000000;
  margin-bottom: 8px;
}

.app-store-badge-link,
.google-play-badge-link {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 1);
  padding: 7px 16px;
  border-radius: 8px;
  transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1);
  box-sizing: border-box;
  min-width: 211px;
}

.app-store-badge-link:hover,
.google-play-badge-link:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

.app-store-badge-link img,
.google-play-badge-link img {
  display: block;
  max-height: 26px;
  width: auto;
}

/* ==========================================================================
   CSS Smartphone Mockup
   ========================================================================== */
.amilia-phone-mockup {
  width: 270px;
  height: auto;
  /* border: 10px solid #1e293b; */
  border-radius: 20px;
  /* background: #000000; */
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: content-box;
  box-shadow: 0px 69px 69px 0px rgba(0, 0, 0, 0.09);
}

/* .amilia-phone-notch {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 110px;
  height: 18px;
  background: #1e293b;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  z-index: 100;
} */

.amilia-phone-screen {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: #ffffff;
  overflow: hidden;
  position: relative;
  border-radius: 20px;
}

/* Status Bar */
.amilia-phone-status-bar {
  height: 28px;
  padding: 8px 16px 0;
  background: #0c3b5d;
  color: #ffffff;
  font-size: 9px;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 10;
  box-sizing: border-box;
}

.status-bar-right {
  display: flex;
  align-items: center;
  gap: 5px;
}

.status-icon {
  fill: currentColor;
  opacity: 0.9;
}

.battery-percent {
  margin-right: 1px;
  font-size: 8px;
  font-weight: 700;
}

.battery-icon {
  width: 16px;
  height: 8px;
  border: 1px solid #ffffff;
  border-radius: 2px;
  padding: 1px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
}

.battery-body {
  width: 100%;
  height: 100%;
  background: #ffffff;
  border-radius: 1px;
}

.battery-tip {
  width: 1px;
  height: 4px;
  background: #ffffff;
  margin-left: 1px;
}

/* App Title Header */
.amilia-phone-app-header {
  background: #0c3b5d;
  color: #ffffff;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  z-index: 5;
}

.app-back-btn {
  font-size: 13px;
  cursor: pointer;
}

.app-header-title {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

/* App Body with Card */
.amilia-phone-app-body {
  flex: 1;
  padding: 16px;
  background: #e2f2fc;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}

.amilia-card-container {
  width: 100%;
  background: #ffffff;
  border: 4.5px solid #cae318;
  border-radius: 18px;
  padding: 20px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 4px 15px rgba(12, 59, 93, 0.1);
  box-sizing: border-box;
}

.amilia-profile-photo-circle {
  width: 90px;
  height: 90px;
  border: 2px dashed #cbd5e1;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #f1f5f9;
  padding: 8px;
  text-align: center;
  box-sizing: border-box;
}

.profile-silhouette {
  margin-top: 2px;
  line-height: 0;
}

.profile-silhouette svg {
  display: block;
}

.photo-text-lbl {
  font-size: 8px;
  color: #64748b;
  font-weight: 700;
  margin-top: 3px;
  line-height: 1;
}

.amilia-change-photo {
  font-size: 10px;
  color: #007bb8;
  text-decoration: underline;
  margin-top: 8px;
  font-weight: 700;
}

.amilia-user-name {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  margin: 12px 0 10px;
}

/* Barcode */
.amilia-barcode-section {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  box-sizing: border-box;
}

.amilia-barcode-lines {
  width: 100%;
  height: 42px;
  background: repeating-linear-gradient(
    90deg,
    #000,
    #000 1.5px,
    #fff 1.5px,
    #fff 4px,
    #000 4px,
    #000 5.5px,
    #fff 5.5px,
    #fff 7px,
    #000 7px,
    #000 8px,
    #fff 8px,
    #fff 11px,
    #000 11px,
    #000 13px,
    #fff 13px,
    #fff 15px
  );
}

.amilia-barcode-number {
  font-size: 9px;
  font-weight: 700;
  color: #475569;
  letter-spacing: 2px;
  line-height: 1;
}

/* Tab Bar */
.amilia-phone-tab-bar {
  height: 52px;
  border-top: 1px solid #e2e8f0;
  display: flex;
  background: #ffffff;
  box-sizing: border-box;
}

.tab-item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  color: #94a3b8;
  font-size: 8px;
  font-weight: 700;
  cursor: pointer;
  transition: color 0.2s ease;
}

.tab-item.active {
  color: #007bb8;
}

.tab-icon {
  opacity: 0.7;
}

.tab-item.active .tab-icon {
  opacity: 1;
}

.crc-main {
  padding-block: 60px;
}
.crc-main .icon-box-layout {
  padding: 70px 0;
}
/* .crc-main .icon-box-layout .position-relative {flex: 1;} */
.crc-main .icon-box-layout .common-heaing {
  margin-bottom: 13px;
}

.pdop_feature_cards_grid {
  display: grid;
  width: 100%;
  box-sizing: border-box;
}

.pdop_feature_cards_grid > * {
  min-width: 0;
}

.pdop_feature_cards_grid.two-grid {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 30px;
}

.pdop_feature_cards_grid.three-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 30px;
}

.pdop_feature_card_item.gridrow {
  display: flex;
  flex-flow: row nowrap;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  gap: 20px;
  align-items: stretch;
}

.pdop_feature_card_item.gridrow .pdop_feature_card_content {
  text-align: left;
  gap: 8px;
}

.pdop_feature_card_item.gridrow .pdop_feature_card_image_wrapper {
  flex: 0 0 40%;
  width: 40%;
  max-width: 40%;
  min-width: 0;
  border-radius: 16px;
  overflow: hidden;
}

.pdop_feature_card_item.gridrow .pdop_feature_card_image_wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.pdop_feature_card_item.gridrow .pdop_feature_card_content {
  flex: 1 1 0%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  word-break: break-word;
  overflow-wrap: break-word;
}

.pdop_feature_card_sub_title {
  font-weight: 700;
  font-size: 12px;
  line-height: 16px;
  text-transform: uppercase;
}

.crc-main .rental_top-navigation-bar .pdop_container {
  padding-inline: 0;
}

/* ==========================================================================
   Sidebar Section Styles
========================================================================== */
.pdop_program_container_grid {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 30px;
}

.pdop_contact_sidebar {
  display: grid;
  gap: 20px;
  /* position: sticky; */
  /* top: 120px; */
}

.pdop_contact_sidebar_card {
  background-color: var(--color-accent-green);
  border-radius: 20px;
  padding: 20px;
}

.pdop_contact_sidebar_card hr {
  background-color: #a5af22;
  margin-block: 16px;
  opacity: 1;
}

.pdop_contact_sidebar_card_header img {
  border-radius: 100vw;
  width: 150px;
  height: auto;
  aspect-ratio: 1/1;
  object-fit: cover;
  margin-bottom: 11px;
}

.pdop_contact_sidebar_card_header h5 {
  font-weight: var(--fw-semibold);
}

.pdop_contact_sidebar_card_header span {
  font-size: var(--body-small);
}

.pdop_contact_sidebar_card_body {
  --gap: 19px;
  display: grid;
  gap: var(--gap);
  margin-bottom: var(--gap);
}

.pdop_contact_sidebar_card_body :is(p, a) {
  display: flex;
  gap: 20px;
  color: var(--color-black);
  word-break: break-word;
  text-decoration: none;
  color: #000;
  font-size: 15px;
  font-weight: 400;
  line-height: normal;
}
.pdop_contact_sidebar_card_body :is(p, a) svg {
  flex-shrink: 0;
  margin-top: 4px;
}

.pdop_contact_sidebar_facility_body {
  display: grid;
  gap: 28px;
}

.pdop_contact_sidebar_facility_item h6 {
  margin-bottom: 9px;
  font-weight: var(--fw-semibold);
  color: var(--color-primary);
}

.pdop_contact_sidebar_facility_item p {
  font-size: clamp(14px, 1.1vw, 15px);
  font-weight: var(--fw-medium);
  margin-bottom: 4px;
}

.pdop_contact_sidebar_facility_item svg {
  margin-top: 4px;
}

.pdop_membership_section.program-table-box {
  margin-bottom: 0;
}
.program-note .program_note_section {
  margin-bottom: 0;
}

/* ==========================================================================
   App Check-In Responsive Styles
   ========================================================================== */
@media (max-width: 991.98px) {
  .app-checkin-drawer {
    width: 100%;
  }

  .app-checkin-drawer-header {
    padding: 20px 24px;
  }

  .app-checkin-drawer-body {
    padding: 24px;
    gap: 24px;
  }

  .app-checkin-split-section {
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }

  .app-checkin-instructions-col {
    width: 100%;
  }

  .app-checkin-phone-col {
    width: 100%;
    max-width: 320px;
    margin-top: 10px;
  }
}

@media (max-width: 480px) {
  .app-checkin-badge-row {
    flex-direction: column;
    gap: 16px;
  }

  .app-checkin-badge-col {
    align-items: flex-start;
  }
}

.pdop_program_detail_data_section .program_highlight_section:last-child {
  margin-bottom: 0 !important;
}
.pdop_program_detail_data_section .program_highlight_section > h6 {
  line-height: normal;
}

/* ==========================================================================
   Figma Design Fine-Tuning & Styling Overrides
   ========================================================================== */

/* 1. Page Section Container Overrides */
.pdop_container > .rp_section_container {
  border-radius: 24px;
  box-shadow: 0px 30px 60px 0px rgba(0, 0, 0, 0.04);
  border: 1px solid #f1f5f9;
  padding: 48px;
  background: #ffffff;
}

@media (max-width: 991.98px) {
  .pdop_container > .rp_section_container {
    padding: 32px;
  }
}

@media (max-width: 575.98px) {
  .pdop_container > .rp_section_container {
    padding: 20px;
  }
}

/* 2. Header and Subtitle Typography */
.rp_section_title,
.rp-form-heading,
.rp-locations-title {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #000000;
  text-transform: uppercase;
  line-height: 1.2;
}

.rp-section-header {
  gap: 15px;
  margin-bottom: 20px;
}

.rp_section_subtitle {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #475569;
  line-height: 1.5;
}

/* 3. Check-In Steps (Highlights Section) Styling */
.program_highlight_list {
  display: flex !important;
  gap: 15px !important;
}

.program_highlight_list_item {
  flex: 1;
  display: flex;
  gap: 16px;
  align-items: start;
}

.program_highlight_list_item h6 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 22px;
  color: #000000;
  margin-bottom: 6px;
  margin-top: 0;
}

.program_highlight_list_item p,
.program_highlight_list_item div {
  font-family: "Figtree", sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: #475569;
}

/* Custom CSS Steps circles with background SVG icon */

/* .program_highlight_list_item .numbered_icon img {
  display: none;
} */

.program_highlight_list_item .numbered_icon::after {
  content: attr(data-number);
  top: 3px;
}

/* 4. Lessons & Events (Card Repeater) Border & CTA Styles */
/* .rp_cards_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.rp_cards_grid > .rp_card {
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0px 20px 40px 0px rgba(0, 0, 0, 0.03);
  padding: 24px;
  gap: 16px;
  transition: all 0.3s ease;
}

.rp_cards_grid > .rp_card:hover {
  transform: translateY(-4px);
  box-shadow: 0px 30px 60px 0px rgba(0, 0, 0, 0.06);
} */

/* Dynamic color borders for Lessons & Events cards */
/* .rp_cards_grid > .rp_card:nth-child(1) {
  border: 1.5px solid #00A3D9;
}
.rp_cards_grid > .rp_card:nth-child(2) {
  border: 1.5px solid #5B8123;
}
.rp_cards_grid > .rp_card:nth-child(3) {
  border: 1.5px solid #CAE318;
} */

/* Sub-heading accent coloring */
/* .rp_cards_grid > .rp_card:nth-child(1) .rp_card_sub_heading,
.rp_cards_grid > .rp_card:nth-child(1) .promo-label {
  color: #00A3D9;
}
.rp_cards_grid > .rp_card:nth-child(2) .rp_card_sub_heading,
.rp_cards_grid > .rp_card:nth-child(2) .promo-label {
  color: #5B8123;
}
.rp_cards_grid > .rp_card:nth-child(3) .rp_card_sub_heading,
.rp_cards_grid > .rp_card:nth-child(3) .promo-label {
  color: #007BB8;
} */

/* Card Titles */
.rp_card_title {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: #000000;
}

/* Card CTA Buttons */
/* .rp_card .pdop_btn {
  border-radius: 30px;
  font-family: 'Figtree', sans-serif;
  font-weight: 700;
  padding: 10px 24px;
  text-align: center;
  justify-content: center;
  transition: all 0.2s ease;
  color: #ffffff;
} */

/* .rp_cards_grid > .rp_card:nth-child(1) .pdop_btn {
  background-color: #00A3D9;
  border-color: #00A3D9;
}
.rp_cards_grid > .rp_card:nth-child(1) .pdop_btn:hover {
  background-color: #0082ae;
  border-color: #0082ae;
} */

/* .rp_cards_grid > .rp_card:nth-child(2) .pdop_btn {
  background-color: #5B8123;
  border-color: #5B8123;
}
.rp_cards_grid > .rp_card:nth-child(2) .pdop_btn:hover {
  background-color: #48661c;
  border-color: #48661c;
}

.rp_cards_grid > .rp_card:nth-child(3) .pdop_btn {
  background-color: #007BB8;
  border-color: #007BB8;
}
.rp_cards_grid > .rp_card:nth-child(3) .pdop_btn:hover {
  background-color: #005c8a;
  border-color: #005c8a;
} */

/* 5. Locations Cards Actions */
.rp-facility-btn {
  border-radius: 30px;
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  padding: 12px 20px;
  justify-content: space-between;
}

.rp-facility-btn .rp-btn-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 6. Modal Bottom Cards Fine-Tuning */
.pdop-modal-promo-card {
  border-radius: 16px;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.02);
  padding: 24px;
}
.pdop-modal-promo-card .promo-label {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 13px;
  color: #00a3d9;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.pdop-modal-promo-card .promo-title {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 18px;
  color: #000000;
  margin-top: 6px;
  margin-bottom: 8px;
}
.pdop-modal-promo-card .promo-desc {
  font-family: "Figtree", sans-serif;
  color: #475569;
  line-height: 1.5;
}

/* 3. Check-In Steps (Highlights Section) Styling */
.program_highlight_list {
  display: flex;
  gap: 32px;
}

.program_highlight_list_item {
  flex: 1;
  display: flex;
  gap: 16px;
  align-items: start;
}

.program_highlight_list_item h6 {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 16px;
  /* line-height: 22px; */
  color: #000000;
  margin-bottom: 6px;
  margin-top: 0;
}

.program_highlight_list_item p,
.program_highlight_list_item div {
  font-family: "Figtree", sans-serif;
  font-size: 16px;
  /* line-height: 20px; */
  color: #475569;
  font-weight: 400;
}

/* Custom CSS Steps circles with background SVG icon */

/* .program_highlight_list_item .numbered_icon img {
  display: none;
} */

.program_highlight_list_item .numbered_icon::after {
  content: attr(data-number);
}

/* 4. Lessons & Events (Card Repeater) Styles */
.rp-event-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.rp-event-cards-grid > .rp-event-card {
  border-radius: 20px;
  background: #ffffff;
  border: 1.5px solid #cae318;
  box-shadow: 6px 6px 0px #cae318;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: all 0.3s ease;
  min-height: 220px;
}

.rp-event-cards-grid > .rp-event-card:hover {
  transform: translate(-2px, -2px);
  box-shadow: 8px 8px 0px #cae318;
}

.rp-event-card-subheading {
  font-family: "Figtree", sans-serif;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  color: #000000;
  letter-spacing: 0.05em;
  display: block;
  margin-bottom: 6px;
}

.rp-event-card-title {
  font-family: "Figtree", sans-serif;
  font-weight: 800;
  font-size: 20px;
  color: #000000;
  margin-top: 0;
  margin-bottom: 12px;
}

.rp-event-card .imgbox {
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  overflow: hidden;
  background: #f1f5f9;
  position: relative;
  box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.05);
  margin-bottom: 12px;
}

.rp-event-card .imgbox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.rp-event-cards-grid > .rp-event-card:hover .imgbox img {
  transform: scale(1.05);
}

.rp-event-card-content {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px;
  color: #334155;
  line-height: 1.5;
  margin: 0 0 24px 0;
}

.rp-event-card-btn-wrapper {
  margin-top: auto;
}

@media (max-width: 991.98px) {
  .rp-event-cards-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* 5. Locations Cards Actions */
/* .rp-facility-btn {
  border-radius: 30px !important;
  font-family: 'Figtree', sans-serif !important;
  font-weight: 700 !important;
  padding: 12px 20px !important;
  justify-content: space-between !important;
}

.rp-facility-btn .rp-btn-arrow {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
} */

/* 6. Modal Bottom Cards Fine-Tuning */
.pdop-modal-promo-card {
  border-radius: 16px !important;
  border: 1px solid #e2e8f0 !important;
  background: #ffffff !important;
  box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.02) !important;
  padding: 24px !important;
}
.pdop-modal-promo-card .promo-label {
  font-family: "Figtree", sans-serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  color: #00a3d9 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}
.pdop-modal-promo-card .promo-title {
  font-family: "Figtree", sans-serif !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  color: #000000 !important;
  margin-top: 6px !important;
  margin-bottom: 8px !important;
}
.pdop-modal-promo-card .promo-desc {
  font-family: "Figtree", sans-serif !important;
  font-size: 14px !important;
  line-height: 20px !important;
  color: #475569 !important;
}

/* Responsive Overrides for Step List */
@media (max-width: 991.98px) {
  .program_highlight_list {
    flex-direction: column !important;
    gap: 20px !important;
  }
}

/* Full width layout when there is no image in the text/image section */
.rp-image-content-bg.no-image .rp-icb-content-col {
  max-width: 100%;
  flex: 0 0 100%;
}

/* Responsive Stacking Overrides for image-content-bg (text/image components) */
@media (max-width: 991.98px) {
  .rp-icb-container {
    flex-direction: column;
    gap: 24px;
  }
  .rp-image-content-bg.image-left .rp-icb-container {
    flex-direction: column;
  }
  .rp-icb-content-col,
  .rp-icb-image-col {
    max-width: 100%;
    width: 100%;
    flex: 0 0 100%;
  }
  .rp-icb-image {
    max-width: 100%;
    height: auto;
  }
  .rp-image-content-bg {
    margin-top: 20px;
  }
}

/* Responsive Action Buttons (2 count) Wrapper */
@media (max-width: 768px) {
  .pdop-action-buttons-wrapper.buttons-count-2 {
    grid-template-columns: 1fr;
    display: grid;
    gap: 12px;
  }
}

/* FAQ Columns Responsive Stacking Override */
@media (max-width: 991.98px) {
  .rp-faq-with-filters-section .rp-faqs-section-card {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* Perry Weather Iframe Layout Settings */
.rp-weather-card iframe {
  width: 100%;
  border: 0;
  min-height: 480px;
}

/* Responsive Heading Fonts */
@media (max-width: 768px) {
  .rp_section_title,
  .rp-form-heading,
  .rp-locations-title {
    font-size: 26px;
  }
}
@media (max-width: 480px) {
  .rp_section_title,
  .rp-form-heading,
  .rp-locations-title {
    font-size: 22px;
  }
}

/* Facility Conditions Repeater Grid Layout */
.rp-facility-conditions-shortcodes-grid {
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
}

.rp-facility-conditions-shortcodes-grid .rs-embed-wrap,
.rp-facility-conditions-shortcodes-grid .rs-grid {
  margin: 0;
}

/* Weather Section Margin Override */
.rp-weather-section {
  margin-top: 40px;
}

/* Check-In Drawer Intro Spacings and Typography */
.app-checkin-intro-icon {
  margin-top: 2px;
}

.app-checkin-intro-icon svg {
  filter: drop-shadow(0px 4px 8px rgba(242, 107, 82, 0.22));
}

.app-checkin-intro-heading {
  font-size: 15px;
  font-weight: 700;
  color: #000000;
  margin: 0 0 6px 0;
  line-height: 1.4;
  font-family: "Figtree", sans-serif;
}

.app-checkin-intro-description {
  font-size: 14px;
  font-weight: 500;
  color: #475569;
  margin: 0;
  line-height: 1.5;
  font-family: "Figtree", sans-serif;
}

/* Override Note Component Margin inside Check-In Drawer */
.app-checkin-notes-container .program_note_section {
  margin-bottom: 0;
}

/* WYSIWYG Content Headings spacing */
.wysiwyg_content h3,
.wysiwyg_content h4,
.wysiwyg_content h5,
.wysiwyg_content h6 {
  margin-top: 24px;
  margin-bottom: 12px;
}

.wysiwyg_content h3:first-child,
.wysiwyg_content h4:first-child,
.wysiwyg_content h5:first-child,
.wysiwyg_content h6:first-child {
  margin-top: 0;
}

/* Image-Content-Bg Section Button Wrapper */
.rp-icb-btn-wrapper {
  margin-top: 24px;
  display: flex;
  justify-content: flex-start;
  width: 100%;
}

.rp-icb-btn-wrapper .pdop-action-buttons-wrapper.buttons-count-1 {
  max-width: 320px !important;
}

/* Location Cards Facility & Promo Buttons override */
.rp-facility-card .pdop-action-buttons-wrapper.buttons-count-3 {
  grid-template-columns: repeat(2, 1fr) !important;
}

.rp-facility-card
  .pdop-action-buttons-wrapper.buttons-count-3
  > .pdop_community_cta:first-child {
  grid-column: 1 / -1;
}
.rp-facility-card .pdop-action-buttons-wrapper .pdop_btn {
  width: 100%;
}
.pdop-action-buttons-wrapper {
  margin-top: auto;
}

/* .rp-facility-card .pdop-action-buttons-wrapper.buttons-count-1 {
  max-width: 320px !important;
  margin: 0 auto;
} */

/* ==========================================================================
   Rental Option Section — Sidebar Layout
   Mirrors the pdop_program_container_grid / pdop_component_sidebar pattern
   from components.css, scoped to .rental-option-section
   ========================================================================== */

/* Main container: default single-column 1fr layout when no sidebar/POC is added */
.rental-option-section .contentwrapper {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  align-items: start;
}

/* Two-column grid when POC/sidebar is present: [sidebar 240px] [content 1fr] */
.rental-option-section .contentwrapper.has-sidebar {
  grid-template-columns: 265px 1fr;
}

/* Sidebar column: sticky so it stays visible while main content scrolls */
.rental-option-section .pocsection {
  position: sticky;
  top: 120px;
  align-self: start;
}

/* Prevent sidebar from stretching */
.rental-option-section .pdop_contact_sidebar_main {
  width: 100%;
}

/* Main content column — prevent grid blowout on long content */
.rental-option-section .maincotent {
  min-width: 0;
  flex: 1;
}

/* ==========================================================================
   Exceptions Include Section
   ========================================================================== */

.exceptions-include-section {
  width: 100%;
  padding: 0;
  margin-top: 40px;
  margin-bottom: 40px;
}

/* Main heading — "Exceptions include:" label */
.exceptions-include-main-heading {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 22px;
  color: #1a1a1a;
  margin: 0 0 16px 0;
}

/* 2-column grid, matching the screenshot */
.exceptions-include-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 45px;
}

/* Individual card */

.exceptions-include-card {
  padding: 30px;
  /* min-height: 100px; */
  box-sizing: border-box;
  /* Subtle inner border to lift the card off the page */
  box-shadow:
    6px 6px 0 0 #d0dd28,
    0 69px 69px 0 rgba(0, 0, 0, 0.09),
    0 17px 38px 0 rgba(0, 0, 0, 0.1);
  border-radius: 20px;
  /* border: 1px solid #D0DD28; */
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Card heading — e.g. "Camps", "Preschool" */
.exceptions-card-heading {
  font-family: "Figtree", sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: #1a1a1a;
  margin: 0 0 0 0;
}

/* WYSIWYG description area */
.exceptions-card-description {
  font-family: "Figtree", sans-serif;
  font-size: 18px;
  color: #333333;
  font-weight: 400;
}

/* Bullet list inside wysiwyg */
.exceptions-card-description ul {
  margin: 0;
  padding-left: 18px;
  list-style: disc;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Inline bold text inside descriptions */
.exceptions-card-description strong,
.exceptions-card-description b {
  font-weight: 700;
  color: #1a1a1a;
}

/* Paragraph spacing inside wysiwyg */
.exceptions-card-description p {
  margin: 0 0 8px 0;
}

.exceptions-card-description p:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
   Schedule With Box Section
   ========================================================================== */
.schedule-with-box-section {
  margin: 40px auto;
  width: 100%;
}

.schedule-box-heading {
  background-color: #e2f8ff;
  color: #0093d0;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 8px 10px;
  border-radius: 8px;
  margin: 0 0 20px 0;
}

.schedule-box-content {
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: max-content;
}
.rp-icb-heading-small-title {
  color: #000;
  font-family: var(--font-family-figtree);
  font-size: 22px;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 15px;
}

.schedule-box-row {
  display: flex;
  gap: 30px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.schedule-box-label {
  flex: 0 0 280px;
  font-size: 16px;
  font-weight: 700;
  color: #000;
}

.schedule-box-desc {
  flex: 1;
  font-size: 16px;
  color: #000;
}

.schedule-box-desc p {
  margin: 0;
}

/* Responsive Action Buttons (3 count) — facility card */
@media (max-width: 768px) {
  .rp-facility-card .pdop-action-buttons-wrapper.buttons-count-3 {
    grid-template-columns: 1fr !important;
  }
  .rp-facility-card
    .pdop-action-buttons-wrapper.buttons-count-3
    > .pdop_community_cta:first-child {
    grid-column: auto;
  }
}
/* 992px–1200px: slightly narrower sidebar (same as components.css) */
@media (min-width: 800px) and (max-width: 1200.98px) {
  .rental-option-section .contentwrapper.has-sidebar {
    grid-template-columns: 210px 1fr;
  }

  .pdop_program_container_grid {
    grid-template-columns: 210px 1fr;
    gap: 20px;
    display: flex;
    flex-flow: column-reverse;
  }
}

/* Below 992px: collapse to single column, sidebar slides below content
   (mirrors pdop_program_container_grid.pdop_component_sidebar → column-reverse) */
@media (max-width: 991.98px) {
  .rental-option-section .contentwrapper.has-sidebar {
    display: flex;
    flex-direction: column-reverse;
    gap: 24px;
    align-items: initial;
  }

  .pdop_program_container_grid {
    display: flex;
    flex-direction: column-reverse;
    gap: 24px;
  }

  .pdop_feature_cards_grid.two-grid,
  .pdop_feature_cards_grid.three-grid {
    grid-template-columns: 1fr !important;
    gap: 24px;
  }

  .rental-option-section .pocsection {
    position: static;
  }
}

/* Below 576px: tighter gap */
@media (max-width: 575.98px) {
  .rental-option-section .contentwrapper {
    gap: 16px;
  }

  .pdop_program_container_grid {
    gap: 16px;
  }

  .pdop_contact_sidebar_card {
    padding: 16px;
  }

  .pdop_feature_card_item.gridrow {
    flex-flow: column;
    gap: 16px;
  }

  .pdop_feature_card_item.gridrow .pdop_feature_card_image_wrapper {
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    height: 200px;
  }
  .rental-option-section .amilia-iframe iframe {
    margin-top: -16px;
  }
}

/* Below 768px: keep 2-col but allow scroll if needed */
@media (max-width: 767.98px) {
  .exceptions-include-card {
    padding: 16px 16px;
  }

  .schedule-box-content {
    padding: 24px;
  }
  .schedule-box-row {
    flex-direction: column;
    gap: 8px;
  }
  .schedule-box-label {
    flex: 1 1 auto;
  }
}

/* ==========================================================================
   Responsive Media Queries
   ========================================================================== */

@media (min-width: 320px) and (max-width: 575.98px) {
  .exceptions-card-description {
    font-size: 16px;
  }
  .exceptions-include-grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .schedule-box-content {
    width: auto;
  }
  .rp_cards_grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 15px;
  }
  .rp_green_box {
    padding: 15px;
  }
  .pdop_container > .rp_section_container {
    padding: 20px;
  }
  .rp_card_title {
    font-size: 18px;
    min-height: auto;
    -webkit-line-clamp: inherit;
    -webkit-box-orient: inherit;
    overflow: inherit;
    text-overflow: inherit;
    max-height: max-content;
    height: auto;
  }
  .rp_section_title {
    font-size: 25px;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation {
    justify-content: flex-start;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation_item {
    padding: 10px;
    font-size: 14px;
  }
  .rp-form-section {
    padding: 0 0 !important;
    background: transparent !important;
    margin: 20px auto;
  }
  .rp-form-section .rp-form-shortcode-wrapper {
    padding: 20px 10px !important;
  }
  .rp-form-section {
    margin-bottom: 0 !important;
  }
  .gform_title {
    font-size: 18px !important;
    margin-bottom: 20px !important;
  }
  .rp-form-heading {
    font-size: 20px !important;
    margin-bottom: 0 !important;
  }
  .rp-form-section input[type="text"],
  .rp-form-section input[type="email"],
  .rp-form-section select,
  .rp-form-section textarea {
    font-size: 14px !important;
    height: auto !important;
  }
  .rp-form-section textarea {
    height: auto !important;
  }
  .rp-form-section input[type="text"],
  .rp-form-section input[type="email"],
  .rp-form-section input[type="url"],
  .rp-form-section input[type="password"],
  .rp-form-section input[type="search"],
  .rp-form-section input[type="number"],
  .rp-form-section input[type="tel"],
  .rp-form-section input[type="date"],
  .rp-form-section select,
  .rp-form-section textarea {
    background-size: 15px 15px !important;
    padding: 10px 16px 10px 38px !important;
  }
  .pdop_container > .rp_section_container {
    padding: 30px;
  }
  .rental_top-navigation-bar {
    top: 63px;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .rp_section_title {
    font-size: 25px;
  }
  .rp_green_box {
    padding: 24px;
    border-radius: 20px;
  }
  .rp_cards_grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 25px;
  }
  .rp_card {
    padding: 20px;
    border-radius: 18px;
  }
  .rp_image_wrapper {
    height: 180px;
  }
  .rp_section_title {
    font-size: 25px;
  }
  .pdop_container > .rp_section_container {
    padding: 30px;
  }
  .rental_top-navigation-bar {
    top: 63px;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation {
    justify-content: flex-start;
  }
  .exceptions-include-grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 40px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .rp_cards_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
  }
  .rp_green_box {
    padding: 25px;
  }
  .pdop_container > .rp_section_container {
    padding: 30px;
  }
  .rental_top-navigation-bar {
    top: 63px;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation {
    justify-content: flex-start;
  }
  .exceptions-include-grid {
    grid-template-columns: repeat(1, 1fr);
    gap: 40px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .rp_cards_grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
  }
  .rp_green_box {
    padding: 25px;
  }
  .pdop_container > .rp_section_container {
    padding: 30px;
  }
  .rental_top-navigation-bar {
    top: 63px;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation {
    justify-content: flex-start;
  }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .rp_cards_grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
  }
  .rp_green_box {
    padding: 25px;
  }
  .pdop_container > .rp_section_container {
    padding: 30px;
  }
  .rental_top-navigation-bar {
    top: 102px;
  }
  .rental_top-navigation-bar .pdop_program_top_navigation {
    justify-content: flex-start;
  }
}
@media (min-width: 1400px) and (max-width: 1499.98px) {
  .rp_cards_grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
  }
  .rental_top-navigation-bar {
    top: 102px;
  }
}
@media (min-width: 1500px) and (max-width: 1599.98px) {
  .rental_top-navigation-bar {
    top: 105px;
  }
}

/* ==========================================================================
   Info at a Glance / More Info Section Component
   ========================================================================== */

.pdop-more-info-section {
  width: 100%;
  margin: 40px auto;
  box-sizing: border-box;
}

.pdop-more-info-title {
  color: #000000;
  margin: 0 0 16px 0;
  font-weight: 700;
  font-size: 22px;
  line-height: 24px;
  letter-spacing: 0%;
}

.pdop-more-info-desc {
  font-size: 16px;
  color: #333333;
  margin: 0 0 20px 0;
  line-height: 1.5;
}

.pdop-more-info-banner {
  background-color: #e2f8ff;
  border-radius: 20px;
  padding: 34px;
  box-sizing: border-box;
}

.pdop-more-info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.pdop-more-info-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 20px 20px;
  min-height: 130px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
  box-sizing: border-box;
}

.pdop-more-info-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 154, 208, 0.12);
}

.pdop-more-info-header {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pdop-more-info-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  color: #009ad0;
}

.pdop-more-info-icon img,
.pdop-more-info-icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pdop-more-info-icon svg {
  fill: currentColor;
}

.pdop-more-info-label {
  font-weight: 800;
  font-size: 14px;
  line-height: normal;
  text-transform: uppercase;
  color: #009ad0;
}

.pdop-more-info-main {
  font-weight: 600;
  font-size: 18px;
  line-height: 22px;
  color: #000000;
}

.pdop-more-info-sub {
  font-weight: 400;
  font-size: 14px;
  line-height: 18.13px;
  color: #b4b4b4;
}

.pdop-more-info-sub p {
  margin: 0 0 4px 0;
  color: #4e4e4e;
}

.pdop-more-info-sub p:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
   Consolidated Responsive Media Queries (Info at a Glance Component)
   ========================================================================== */

@media (max-width: 1200.98px) {
  .pdop-more-info-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}

@media (max-width: 767.98px) {
  .pdop-more-info-banner {
    padding: 20px;
    border-radius: 16px;
  }

  .pdop-more-info-title {
    font-size: 24px;
  }
}

@media (max-width: 575.98px) {
  .pdop-more-info-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .pdop-more-info-card {
    padding: 16px 18px;
    min-height: auto;
    border-radius: 16px;
  }
}

/* ==========================================================================
   Page Content with Bullet Points Component (Plan Your Visit Layout)
   ========================================================================== */
.pdop-content-w-point-section {
  /* background: #ffffff; */
  /* border-radius: 24px; */
  /* padding: 40px; */
  /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); */
  /* margin: 40px auto; */
  width: 100%;
  box-sizing: border-box;
}

.pdop-content-w-point-section .main-visit-title {
  font-size: 32px;
  font-weight: 800;
  color: #000000;
  text-transform: uppercase;
  margin: 0 0 30px 0;
  line-height: 1.2;
  font-family: var(--font-family-figtree, sans-serif);
}

.pdop-content-w-point-section .visitwrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  align-items: start;
}

.pdop-content-w-point-section .leftsec {
  width: 100%;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}

.pdop-content-w-point-section .leftsec p {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

.pdop-content-w-point-section .leftsec iframe,
.pdop-content-w-point-section .leftsec img {
  width: 100%;
  height: 100%;
  min-height: 380px;
  border-radius: 20px;
  border: 0;
  display: block;
  object-fit: cover;
}

.pdop-content-w-point-section .rightsec {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pdop-content-w-point-section .rightsec .ra-link-wrapper {
  margin-top: 0;
}

.pdop-content-w-point-section .pointer-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pdop-content-w-point-section .pointer-card-item {
  background-color: #e2f8ff;
  border-radius: 20px;
  padding: 16px 20px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  border: 1px solid #e2f8ff;
  transition: all 0.2s linear;
}

.pdop-content-w-point-section .pointer-card-item:hover {
  /* transform: translateY(-2px); */
  border-color: #009ad0;
  /* box-shadow: 0 6px 16px rgba(0, 154, 208, 0.12); */
}

.pdop-content-w-point-section .headsec {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pdop-content-w-point-section .iconbox {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 0;
}

.pdop-content-w-point-section .iconbox img,
.pdop-content-w-point-section .iconbox svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.pdop-content-w-point-section .iconbox svg path {
  fill: #009ad0;
}

.pdop-content-w-point-section .pointer-title {
  font-weight: 800;
  font-size: 14px;
  text-transform: uppercase;
  color: #009ad0;
}

.pdop-content-w-point-section .descrtiptionsec {
  margin: 0;
}

.pdop-content-w-point-section .descrtiptionsec p {
  font-weight: 400;
  font-size: 14px;
  line-height: 19px;
}

.pdop-content-w-point-section .ra-link-wrapper {
  margin-top: 8px;
}

/* .pointer-list + .ra-link-wrapper .pdop_btn::before{position: inherit;} */

.pdop_program_content.rental_top-navigation-bar {
  position: initial;
}

@media (max-width: 991.98px) {
  .pdop-content-w-point-section .visitwrap {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .rp_section_container .data-section {
    margin-top: 30px;
  }
  .pdop_contact_sidebar {
    position: inherit;
  }
}

@media (max-width: 575.98px) {
  .pdop-content-w-point-section {
    padding: 24px 16px;
    border-radius: 16px;
  }
  .pdop-content-w-point-section .main-visit-title {
    font-size: 24px;
    margin-bottom: 20px;
  }
  .pdop-content-w-point-section .leftsec iframe,
  .pdop-content-w-point-section .leftsec img {
    min-height: 260px;
  }
}

/* ==========================================================================
   Background Note Without Icon Component
   ========================================================================== */
.pdop-bg-note-wo-icon-section {
  width: 100%;
  margin: 30px auto;
  box-sizing: border-box;
}

.pdop-bg-note-wo-icon-section .bg-cards-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}

.pdop-bg-note-wo-icon-section .bg-note-card {
  background-color: #e2f8ff;
  border: 1px solid #009ad0;
  border-radius: 20px;
  padding: 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  box-sizing: border-box;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.pdop-bg-note-wo-icon-section .bg-note-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(0, 154, 208, 0.15);
}

.pdop-bg-note-wo-icon-section .bg-note-heading {
  font-size: 20px;
  font-weight: 600;
  color: #1f2024;
  margin: 0;
  line-height: normal;
}

.pdop-bg-note-wo-icon-section .bg-note-subheading {
  font-size: 12px;
  font-weight: 700;
  color: #2b3c73;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin: 0;
  line-height: normal;
  display: block;
}

.pdop-bg-note-wo-icon-section .bg-note-description {
  margin-top: 4px;
}

.pdop-bg-note-wo-icon-section .bg-note-description p {
  font-size: 15px;
  font-weight: 500;
  color: #333333;
  line-height: 1.5;
  margin: 0 0 8px 0;
}

.pdop-bg-note-wo-icon-section .bg-note-description p:last-child {
  margin-bottom: 0;
}

@media (max-width: 767.98px) {
  .pdop-bg-note-wo-icon-section .bg-note-card {
    padding: 18px 20px;
    border-radius: 16px;
  }
  .pdop-bg-note-wo-icon-section .bg-note-heading {
    font-size: 18px;
  }
}

.crc-membership .rp-button-or-pdf-centered .pdop-action-buttons-wrapper {
  margin-left: 0;
}

/* ==========================================================================
   CRC Membership Table Component (Pricing Cards Grid - High-Res Precision)
   ========================================================================== */
.pdop-crc-membership-section {
  width: 100%;
  margin: 40px auto;
  box-sizing: border-box;
}

.pdop-crc-membership-section .crc-membership-title {
  margin-bottom: 32px;
  text-align: center;
}

.pdop-crc-membership-section .crc-membership-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}

.pdop-crc-membership-section .crc-membership-card {
  /* background: #ffffff; */
  border: 1px solid #e6e6e6;
  border-radius: 24px;
  padding: 20px 10px;
  box-sizing: border-box;
  position: relative;
  width: 100%;
}

.pdop-crc-membership-section .crc-membership-card:hover {
  /* transform: translateY(-4px); */
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
}

/* Pricing Module Wrapper */
.pdop-crc-membership-section .crc-pricing-wrapper {
  position: relative;
  width: 100%;
  max-width: 250px;
  margin: 0 auto 15px auto;
  box-sizing: border-box;
}

/* Right Stack Container (Cream Header + White Price Box) */
.pdop-crc-membership-section .crc-right-stack {
  margin-left: auto;
  width: 54%;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 2; /* Sits ON TOP of left cyan pills */
}

/* Cream Badge Header */
.pdop-crc-membership-section .crc-badge-header {
  background-color: #fff5e1;
  border-radius: 20px 20px 0 0;
  padding: 16px 12px 34px; /* extends down behind white price box */
  text-align: center;
  width: 100%;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.pdop-crc-membership-section .crc-badge-title {
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  text-align: center;
  min-height: 40px;
  display: flex;
  flex-flow: column wrap;
  justify-content: center;
}

/* White Price Box (Overlaps lower portion of cream badge header) */
.pdop-crc-membership-section .crc-price-box {
  background-color: #ffffff;
  border: 1px solid #e2e2e2;
  border-radius: 20px;
  margin-top: -24px; /* overlaps cream header */
  width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
  overflow: hidden;
}

.pdop-crc-membership-section .crc-price-cell {
  padding: 18px 15px;
  font-weight: 400;
  font-size: 20px;
  line-height: 20px;
  text-align: center;
}

.pdop-crc-membership-section .crc-price-cell.res-price {
  border-bottom: 1px solid #e6e6e6;
}

/* Left Floating Cyan Pills (Underneath Right Stack) */
.pdop-crc-membership-section .crc-pills-col {
  position: absolute;
  left: 0;
  bottom: 12px;
  width: 58%; /* extends right so it slides UNDER the white price box */
  /* height: 106px;
  display: flex;
  flex-direction: column;
  justify-content: space-between; */
  z-index: 1; /* Sits UNDER the right stack */
}

.pdop-crc-membership-section .crc-pill-item {
  background-color: #e6faff;
  padding: 22px 15px;
  border-radius: 50px 0 0 50px;
  font-weight: 600;
  font-size: 14px;
  /* line-height: 20px; */
  /* box-shadow: 0 4px 12px rgba(0, 154, 208, 0.12); */
}
.pdop-crc-membership-section .crc-pills-col + .crc-pills-col {
  margin-top: 4px;
}
.pdop-crc-membership-section .res-pill,
.pdop-crc-membership-section .non-res-pill {
  padding: 10px 15px;
}
.pdop-crc-membership-section .non-res-pill {
  margin-top: 4px;
}
.pdop-crc-membership-section .crc-card-cta {
  text-align: center;
}

/* Description Text */
.pdop-crc-membership-section .crc-card-description {
  /* margin-top: 12px; */
  margin-bottom: 18px;
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pdop-crc-membership-section .crc-card-description p {
  font-size: 14px;
  font-weight: 400;
  color: #4e4e4e;
  line-height: 1.45;
  margin: 0;
  text-align: center;
}

/* Sign Up Link with Underline */
.pdop-crc-membership-section .crc-card-cta {
  margin-top: auto;
  width: 100%;
  display: flex;
  justify-content: center;
}

.pdop-crc-membership-section .crc-signup-link {
  font-size: 16px;
  font-weight: 700;
  color: #009ad0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  transition:
    transform 0.2s ease,
    color 0.2s ease;
}

.pdop-crc-membership-section .crc-signup-link:hover {
  color: #0079a4;
  transform: translateX(2px);
}

.pdop-crc-membership-section .crc-signup-link:focus-visible {
  outline: 2px solid #009ad0;
  outline-offset: 3px;
  border-radius: 4px;
}

.pdop-crc-membership-section .crc-signup-link svg path {
  stroke: #009ad0;
}

/* Add-ons Note Subtext */
.pdop-crc-membership-section .crc-addons-note {
  text-align: center;
  margin: 36px auto;
}

.pdop-crc-membership-section .crc-addons-note p {
  font-size: 15px;
  font-weight: 600;
  color: #333333;
  line-height: 1.5;
  margin: 0;
}

/* Bottom CTA Button Container */
.pdop-crc-membership-section .ra-link-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
}

/* Responsive Media Queries */
@media (max-width: 1199.98px) {
  .pdop-crc-membership-section .crc-membership-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    max-width: 640px;
    margin: 0 auto;
  }
}

@media (max-width: 767.98px) {
  .pdop-crc-membership-section {
    margin: 30px auto;
  }

  .pdop-crc-membership-section .crc-membership-title {
    margin-bottom: 24px;
  }

  .pdop-crc-membership-section .crc-membership-grid {
    grid-template-columns: 1fr;
    gap: 20px;
    max-width: 340px;
    margin: 0 auto;
  }

  .pdop-crc-membership-section .crc-membership-card {
    padding: 20px 16px;
    border-radius: 20px;
  }

  .pdop-crc-membership-section .crc-addons-note {
    margin: 24px auto 18px auto;
    padding: 0 12px;
  }

  .pdop-crc-membership-section .crc-addons-note p {
    font-size: 14px;
  }

  .pdop-crc-membership-section .crc-bottom-buttons {
    margin-top: 18px;
  }
}

@media (max-width: 479.98px) {
  .pdop-crc-membership-section .crc-membership-card {
    padding: 18px 12px;
  }

  .pdop-crc-membership-section .crc-pricing-wrapper {
    max-width: 235px;
  }

  .pdop-crc-membership-section .crc-badge-title {
    font-size: 15px;
  }

  .pdop-crc-membership-section .crc-price-cell {
    font-size: 18px;
  }

  .pdop-crc-membership-section .crc-pill-item {
    font-size: 13px;
    padding-left: 12px;
  }

  .pdop-crc-membership-section .crc-card-description p {
    font-size: 13px;
  }
}

/* ==========================================================================
   Content with Margin Component Styles (content-with-margin.php)
   ========================================================================== */
.pdop-content-with-margin-section {
  width: 100%;
  position: relative;
  margin-block: 40px;
}

.content-margin-grid {
  display: flex;
  gap: 36px;
  align-items: flex-start;
  width: 100%;
  box-sizing: border-box;
}

.content-margin-row .content-margin-grid {
  flex-direction: row;
}

.content-margin-col .content-margin-grid {
  flex-direction: column;
}

.content-margin-grid--2 > .content-margin-col-item {
  flex: 1 1 50%;
  min-width: 0;
}

.content-margin-grid--3 > .content-margin-col-item {
  flex: 1 1 33.333%;
  min-width: 0;
}

.content-margin-grid--1 > .content-margin-col-item {
  flex: 1 1 100%;
  width: 100%;
}

.content-margin-col-item {
  display: flex;
  flex-direction: column;
}

.content-margin-text {
  font-size: var(--body-base, 16px);
  line-height: 1.6;
  color: var(--color-black, #222222);
}

.content-margin-text p:last-child {
  margin-bottom: 0;
}

/* Heading with Background Pill Banner */
.content-margin-heading-bg {
  background-color: #e2f8ff;
  color: #009ad0;
  padding: 14px 20px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-top: 20px;
  margin-bottom: 16px;
  display: block;
  width: 100%;
  line-height: 1.4;
  box-sizing: border-box;
}

/* Time Content & List Styling */
.content-margin-time-text {
  font-size: var(--body-small, 14px);
  line-height: 1.5;
  color: #333333;
}

.content-margin-time-text p:last-child {
  margin-bottom: 0;
}

/* UL inside time_content: horizontal inline schedule list with cyan clock icons */
.content-margin-time-text ul {
  list-style: none;
  padding: 0;
  margin: 14px 0 16px 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 28px;
}

.content-margin-time-text ul li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  color: #333333;
  line-height: 1.4;
  position: relative;
  padding-left: 24px;
}

.content-margin-time-text ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 2px;
  /* transform: translateY(-50%); */
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.475 12.525L12.525 11.475L9.75 8.7V5.25H8.25V9.3L11.475 12.525ZM9 16.5C7.9625 16.5 6.9875 16.3031 6.075 15.9094C5.1625 15.5156 4.36875 14.9813 3.69375 14.3063C3.01875 13.6313 2.48438 12.8375 2.09063 11.925C1.69687 11.0125 1.5 10.0375 1.5 9C1.5 7.9625 1.69687 6.9875 2.09063 6.075C2.48438 5.1625 3.01875 4.36875 3.69375 3.69375C4.36875 3.01875 5.1625 2.48438 6.075 2.09063C6.9875 1.69687 7.9625 1.5 9 1.5C10.0375 1.5 11.0125 1.69687 11.925 2.09063C12.8375 2.48438 13.6313 3.01875 14.3063 3.69375C14.9813 4.36875 15.5156 5.1625 15.9094 6.075C16.3031 6.9875 16.5 7.9625 16.5 9C16.5 10.0375 16.3031 11.0125 15.9094 11.925C15.5156 12.8375 14.9813 13.6313 11.925 15.9094C11.0125 16.3031 10.0375 16.5 9 16.5Z' fill='%23009AD0'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media screen and (max-width: 768px) {
  .content-margin-row .content-margin-grid {
    flex-direction: column;
    gap: 24px;
  }
}

/* Dynamic CSS Variable Margin Rules for content-margin-grid */
.content-margin-grid.has-margin-top {
  margin-top: var(--margin-num, 0px);
}

.content-margin-grid.has-margin-bottom {
  margin-bottom: var(--margin-num, 0px);
}

.content-margin-grid.has-margin-left {
  padding-left: var(--margin-num, 0px);
}

.content-margin-grid.has-margin-right {
  padding-right: var(--margin-num, 0px);
}

/* ==========================================================================
   Point of Contact Cards Wrapper Component (poc-card.php)
   ========================================================================== */
.poc_heading {
  font-size: 24px;
  font-weight: 700;
  color: #000000;
  margin-bottom: 16px;
  text-transform: uppercase;
  width: 100%;
}

.poc_cards_wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  width: 100%;
  box-sizing: border-box;
}

.poc_cards_wrapper .pdop_contact_sidebar_card {
  width: calc(50% - 10px);
  max-width: calc(50% - 10px);
  flex: 0 0 calc(50% - 10px);
  box-sizing: border-box;
}

@media screen and (max-width: 991.98px) {
  .poc_cards_wrapper .pdop_contact_sidebar_card {
    width: calc(50% - 10px);
    max-width: calc(50% - 10px);
    flex: 0 0 calc(50% - 10px);
  }
}

@media screen and (max-width: 767.98px) {
  .poc_cards_wrapper {
    gap: 16px;
  }
  .poc_cards_wrapper .pdop_contact_sidebar_card {
    width: 100%;
    max-width: 100%;
    flex: 1 1 100%;
  }
}