text/css turf-booking-modern-final.css ( ASCII text )

text/css turf-booking-modern-final.css ( ASCII text )

/*
 * =========================================================
 * THE TURF STATION
 * MODERN BOOKING UI
 *
 * CSS ONLY
 * No Drupal / JS / booking logic changes.
 *
 * Booking states are intentionally preserved.
 * =========================================================
 */


/* =========================================================
   1. PAGE
   ========================================================= */

body.path-frontpage {
  background: #f2f1f6 !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;

  min-height: 100vh !important;
}


/* =========================================================
   2. PAGE STRUCTURE
   ========================================================= */

/*
 * Keep the overall page as a vertical layout.
 *
 * Header
 * Main content
 * Footer
 *
 * The main area gets the available space.
 */

body.path-frontpage #page {
  min-height: 100vh !important;

  display: flex !important;

  flex-direction: column !important;
}


/*
 * Main wrapper occupies the available space.
 */

body.path-frontpage #main-wrapper {
  background: #ffffff !important;

  flex: 1 1 auto !important;

  min-height: 0 !important;

  display: flex !important;

  flex-direction: column !important;
}


/* =========================================================
   3. MAIN TITLE
   ========================================================= */

body.path-frontpage h1 {
  color: #27213f !important;

  font-size: 32px !important;

  font-weight: 700 !important;

  letter-spacing: -0.7px !important;

  line-height: 1.15 !important;

  margin-top: 24px !important;

  margin-bottom: 28px !important;

  position: relative;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* Online booking label */

body.path-frontpage h1::before {
  content: "ONLINE BOOKING";

  display: block;

  color: #50487f;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;

  font-size: 9px;

  font-weight: 700;

  letter-spacing: 1.8px;

  margin-bottom: 7px;
}


/* Purple underline */

body.path-frontpage h1::after {
  content: "";

  display: block;

  width: 42px;

  height: 3px;

  margin-top: 10px;

  border-radius: 10px;

  background: #50487f;
}


/* =========================================================
   4. DATE NAVIGATION
   ========================================================= */

body.path-frontpage .day-navigation {
  position: relative;

  margin-bottom: 26px !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* Date cards */

body.path-frontpage .day-navigation .date-button {
  border-radius: 15px !important;

  border: 1px solid #f0eef4 !important;

  background: #ffffff !important;

  box-shadow:
    0 4px 12px rgba(45, 39, 70, .08) !important;

  transition:
    transform .18s ease,
    box-shadow .18s ease !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* Date card hover */

body.path-frontpage .day-navigation .date-button:hover {
  transform: translateY(-3px) !important;

  box-shadow:
    0 9px 20px rgba(45, 39, 70, .13) !important;
}


/* Selected date */

body.path-frontpage .day-navigation .date-button.selected {
  background: #50487f !important;

  border-color: #50487f !important;

  border-radius: 15px !important;

  box-shadow:
    0 9px 20px rgba(80, 72, 127, .30) !important;

  transform: translateY(-2px);
}


/* Selected date text */

body.path-frontpage .day-navigation .date-button.selected * {
  color: #ffffff !important;
}


/* =========================================================
   5. PREVIOUS / NEXT ARROWS
   ========================================================= */

body.path-frontpage .day-navigation > button {
  color: #50487f !important;

  font-size: 20px !important;

  transition:
    transform .15s ease,
    opacity .15s ease !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


body.path-frontpage .day-navigation > button:hover {
  transform: scale(1.15);

  opacity: .75;
}


/* =========================================================
   6. ORIGINAL SLOT ROW
   ========================================================= */

body.path-frontpage .time-slot-row {
  margin-bottom: 0 !important;
}


/* =========================================================
   7. SLOT BUTTON
   ========================================================= */

body.path-frontpage button.time-slot {
  border-radius: 12px !important;

  box-shadow:
    0 2px 7px rgba(35, 35, 35, .07) !important;

  transition:
    transform .16s ease,
    box-shadow .16s ease !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* Slot hover */

body.path-frontpage button.time-slot:hover {
  transform: translateY(-2px) !important;

  box-shadow:
    0 6px 14px rgba(35, 35, 35, .12) !important;
}


/* Don't lift disabled buttons */

body.path-frontpage button.time-slot:disabled:hover {
  transform: none !important;
}


/* =========================================================
   8. SLOT CONTENT
   ========================================================= */

body.path-frontpage .slot {
  line-height: 1.2;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* Price */

body.path-frontpage .aboveBtn {
  font-size: 11px !important;

  font-weight: 700 !important;

  line-height: 1.15 !important;
}


/* Start time */

body.path-frontpage .stTime {
  font-size: 11px !important;

  font-weight: 600 !important;

  line-height: 1.25 !important;
}


/* End time */

body.path-frontpage .enTime {
  font-size: 10px !important;

  opacity: .72;
}


/* =========================================================
   9. CART
   ========================================================= */

body.path-frontpage #cartIcon {
  border-radius: 12px 0 0 12px !important;

  box-shadow:
    0 7px 18px rgba(0, 0, 0, .16) !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* =========================================================
   10. BOOK BUTTON
   ========================================================= */

body.path-frontpage #bookSlotsButton {
  border-radius: 13px 13px 0 0 !important;

  box-shadow:
    0 -5px 18px rgba(40, 34, 70, .16) !important;

  font-weight: 700 !important;

  font-family:
    zohopuvi-regular,
    Arial,
    sans-serif !important;
}


/* =========================================================
   FINAL BOOKING GRID + FIXED FOOTER
   ========================================================= */


/* ---------------------------------------------------------
   BOOKING GRID
   --------------------------------------------------------- */

body.path-frontpage .turf-booking-grid {
    display: grid !important;

    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;

    column-gap: 10px !important;

    /*
     * Rows are distributed inside the available
     * booking area.
     */
    row-gap: 0 !important;

    width: 100% !important;

    /*
     * Space between date selector and fixed footer.
     *
     * This is the only vertical area we allocate
     * dynamically to the booking grid.
     */
    min-height: calc(100vh - 540px) !important;

    max-height: calc(100vh - 540px) !important;

    margin: 0 auto !important;

    padding: 0 !important;

    box-sizing: border-box !important;

    align-content: space-between !important;

    align-items: start !important;

    font-family:
        zohopuvi-regular,
        Arial,
        sans-serif !important;
}


/* ---------------------------------------------------------
   ORIGINAL SLOT BUTTONS
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid > .time-slot {
    position: static !important;

    left: auto !important;

    top: auto !important;

    float: none !important;

    width: 100% !important;

    min-width: 0 !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/*
 * IMPORTANT:
 *
 * Do NOT set display:block here.
 *
 * Drupal's display:none on past slots must remain intact.
 */


/* ---------------------------------------------------------
   REMOVE OLD PRICE PSEUDO ELEMENTS
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid > .time-slot::before,

body.path-frontpage
.turf-booking-grid > .time-slot::after {
    content: none !important;

    display: none !important;
}


/* ---------------------------------------------------------
   SLOT TEXT
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid .slot {
    line-height: 1.05 !important;

    font-family:
        zohopuvi-regular,
        Arial,
        sans-serif !important;
}


body.path-frontpage
.turf-booking-grid .aboveBtn {
    font-size: 9px !important;

    line-height: 1.05 !important;

    margin: 0 !important;

    padding: 0 !important;
}


body.path-frontpage
.turf-booking-grid .stTime {
    font-size: 9px !important;

    line-height: 1.05 !important;

    margin: 0 !important;
}


body.path-frontpage
.turf-booking-grid .enTime {
    font-size: 8px !important;

    line-height: 1 !important;

    margin: 0 !important;
}


/* ---------------------------------------------------------
   HIDE ORIGINAL PERIOD HEADINGS
   --------------------------------------------------------- */

body.path-frontpage
.time-slot-period {
    display: none !important;
}


body.path-frontpage
.no-slots {
    display: none !important;
}


/* =========================================================
   FIXED COMPACT FOOTER
   ========================================================= */

body.path-frontpage .site-footer {
    position: fixed !important;

    /*
     * Red Total / Continue bar occupies the bottom.
     * Footer sits immediately above it.
     */
    bottom: 58px !important;

    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 600px !important;

    max-width: 100% !important;

    height: 43px !important;

    min-height: 43px !important;

    margin: 0 !important;

    padding: 0 !important;

    z-index: 900 !important;

    box-sizing: border-box !important;
}


/* Footer container */

body.path-frontpage
.site-footer .container,

body.path-frontpage
.site-footer .container-fluid {
    padding: 0 !important;

    margin: 0 !important;

    min-height: 0 !important;

    height: 100% !important;
}


/* Footer bottom */

body.path-frontpage
.site-footer__bottom {
    padding: 2px 5px !important;

    margin: 0 !important;

    height: 100% !important;

    min-height: 0 !important;

    box-sizing: border-box !important;
}


/* Footer region */

body.path-frontpage
.region-footer-fifth {
    padding: 0 !important;

    margin: 0 !important;

    height: 100% !important;
}


/* Copyright */

body.path-frontpage
#block-turf-subtheme-copyright,

body.path-frontpage
#block-turf-subtheme-copyright .content,

body.path-frontpage
#block-turf-subtheme-copyright .field__item {
    margin: 0 !important;

    padding: 0 !important;
}


/* Footer text */

body.path-frontpage
#block-turf-subtheme-copyright p {
    margin: 0 !important;

    padding: 0 !important;

    font-size: 9px !important;

    line-height: 10px !important;

    text-align: center !important;
}


/* First line = address */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(1) {
    display: block !important;
}


/* Second/third breaks removed */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(2),

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(3) {
    display: none !important;
}


/* Social icons */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(4) {
    display: block !important;
}


body.path-frontpage
#block-turf-subtheme-copyright a {
    font-size: 9px !important;

    line-height: 10px !important;

    margin: 0 2px !important;

    padding: 0 !important;

    white-space: nowrap !important;
}


body.path-frontpage
#block-turf-subtheme-copyright img {
    width: 16px !important;

    height: 16px !important;

    margin: 0 2px !important;

    vertical-align: middle !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    body.path-frontpage
    .turf-booking-grid {

        column-gap: 5px !important;

        min-height: calc(100vh - 500px) !important;

        max-height: calc(100vh - 500px) !important;

        row-gap: 0 !important;

        align-content: space-between !important;
    }


    body.path-frontpage
    .site-footer {

        bottom: 58px !important;

        width: 100% !important;

        height: 40px !important;

        min-height: 40px !important;
    }


    body.path-frontpage
    #block-turf-subtheme-copyright p {

        font-size: 8px !important;

        line-height: 9px !important;
    }


    body.path-frontpage
    #block-turf-subtheme-copyright a {

        font-size: 8px !important;
    }


    body.path-frontpage
    #block-turf-subtheme-copyright img {

        width: 15px !important;

        height: 15px !important;
    }

}

/* =========================================================
   FINAL OVERRIDE
   NORMAL BOOKING FLOW
   ========================================================= */


/* ---------------------------------------------------------
   PAGE - NORMAL FLOW
   --------------------------------------------------------- */

body.path-frontpage #page {
    display: block !important;
    min-height: 0 !important;
}


body.path-frontpage #main-wrapper {
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
    flex: none !important;
}


/* ---------------------------------------------------------
   BOOKING GRID
   --------------------------------------------------------- */

body.path-frontpage .turf-booking-grid {
    display: grid !important;

    grid-template-columns:
        repeat(6, minmax(0, 1fr)) !important;

    column-gap: 10px !important;

    /* Normal compact row spacing */
    row-gap: 36px !important;

    width: 100% !important;

    /* REMOVE ALL VIEWPORT HEIGHT BEHAVIOUR */
    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    margin: 0 auto !important;

    padding: 0 !important;

    box-sizing: border-box !important;

    /* DO NOT stretch rows */
    align-content: normal !important;

    align-items: start !important;
}


/* ---------------------------------------------------------
   SLOT BUTTONS
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid > .time-slot {
    position: static !important;

    width: 100% !important;

    min-width: 0 !important;

    margin: 0 !important;

    float: none !important;

    box-sizing: border-box !important;
}


/*
 * VERY IMPORTANT:
 *
 * Do NOT force display here.
 *
 * Drupal's display:none for past slots
 * must continue working.
 */


/* ---------------------------------------------------------
   REMOVE OLD PSEUDO PRICE
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid > .time-slot::before,

body.path-frontpage
.turf-booking-grid > .time-slot::after {
    content: none !important;

    display: none !important;
}


/* ---------------------------------------------------------
   SLOT FONT / SIZE
   --------------------------------------------------------- */

body.path-frontpage
.turf-booking-grid .slot {
    font-family:
        zohopuvi-regular,
        Arial,
        sans-serif !important;

    line-height: 1.05 !important;
}


body.path-frontpage
.turf-booking-grid .aboveBtn {
    font-size: 9px !important;

    line-height: 1.05 !important;

    margin: 0 !important;

    padding: 0 !important;
}


body.path-frontpage
.turf-booking-grid .stTime {
    font-size: 9px !important;

    line-height: 1.05 !important;

    margin: 0 !important;
}


body.path-frontpage
.turf-booking-grid .enTime {
    font-size: 8px !important;

    line-height: 1 !important;
}


/* ---------------------------------------------------------
   FOOTER - STATIC
   --------------------------------------------------------- */

body.path-frontpage .site-footer {
    position: static !important;

    display: block !important;

    transform: none !important;

    left: auto !important;

    right: auto !important;

    bottom: auto !important;

    top: auto !important;

    width: 100% !important;

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    margin: 4px 0 0 !important;

    padding: 0 !important;

    clear: both !important;

    float: none !important;

    box-sizing: border-box !important;
}


/* ---------------------------------------------------------
   FOOTER CONTAINER
   --------------------------------------------------------- */

body.path-frontpage
.site-footer .container,

body.path-frontpage
.site-footer .container-fluid {
    margin: 0 !important;

    padding-top: 0 !important;

    padding-bottom: 0 !important;

    min-height: 0 !important;

    height: auto !important;
}


body.path-frontpage
.site-footer__bottom {
    margin: 0 !important;

    padding: 2px 5px 3px !important;

    min-height: 0 !important;

    height: auto !important;
}


body.path-frontpage
.region-footer-fifth {
    margin: 0 !important;

    padding: 0 !important;
}


/* ---------------------------------------------------------
   FOOTER CONTENT
   --------------------------------------------------------- */

body.path-frontpage
#block-turf-subtheme-copyright,

body.path-frontpage
#block-turf-subtheme-copyright .content,

body.path-frontpage
#block-turf-subtheme-copyright .field__item {
    margin: 0 !important;

    padding: 0 !important;

    min-height: 0 !important;
}


body.path-frontpage
#block-turf-subtheme-copyright p {
    margin: 0 !important;

    padding: 0 !important;

    font-size: 9px !important;

    line-height: 10px !important;

    text-align: center !important;
}


/* Address line */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(1) {
    display: block !important;
}


/* Phone + Terms + Privacy */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(2),

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(3) {
    display: none !important;
}


/* Social icons */

body.path-frontpage
#block-turf-subtheme-copyright p br:nth-of-type(4) {
    display: block !important;
}


body.path-frontpage
#block-turf-subtheme-copyright a {
    font-size: 9px !important;

    line-height: 10px !important;

    margin: 0 2px !important;

    padding: 0 !important;

    white-space: nowrap !important;
}


body.path-frontpage
#block-turf-subtheme-copyright img {
    width: 16px !important;

    height: 16px !important;

    margin: 0 2px !important;

    padding: 0 !important;

    vertical-align: middle !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media (max-width: 600px) {

    body.path-frontpage
    .turf-booking-grid {
        column-gap: 5px !important;

        row-gap: 28px !important;

        height: auto !important;

        min-height: 0 !important;

        max-height: none !important;

        align-content: normal !important;
    }


    body.path-frontpage
    .site-footer {
        position: static !important;

        width: 100% !important;

        height: auto !important;

        margin: 3px 0 0 !important;
    }

}

/* =========================================================
   FINAL SLOT SPACING
   Footer remains completely untouched
   ========================================================= */

body.path-frontpage .turf-booking-grid {
    row-gap: clamp(
        36px,
        calc((100vh - 650px) / 2),
        65px
    ) !important;

    height: auto !important;

    min-height: 0 !important;

    max-height: none !important;

    align-content: normal !important;
}


/* Mobile */

@media (max-width: 600px) {

    body.path-frontpage .turf-booking-grid {
        row-gap: clamp(
            28px,
            calc((100vh - 500px) / 3),
            45px
        ) !important;
    }

}



/* =========================================================
   THE TURF STATION - MATERIAL BOOKING LAYOUT
   - Fixed-height slot area
   - More visible logo watermark
   - Compact, integrated rounded account navigation
   ========================================================= */

/* Keep the site header clean and let the account menu lead the page. */
body.path-frontpage #header {
  position: relative !important;
  z-index: 30 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

body.path-frontpage #navbar-main {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Hide only the original logo placement; reuse the same image as a watermark. */
body.path-frontpage #navbar-main > .navbar-brand {
  display: none !important;
}

/* The account menu becomes the compact top navigation surface. */
body.path-frontpage #block-turf-subtheme-account-menu {
  order: -10 !important;
  position: relative !important;
  z-index: 35 !important;
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav {
  display: flex !important;
  width: calc(100% - 20px) !important;
  min-height: 58px !important;
  align-items: center !important;
  background: linear-gradient(135deg, #514981 0%, #625895 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 0 0 22px 22px !important;
  box-shadow: 0 5px 16px rgba(45, 39, 70, 0.17) !important;
  padding: 7px 12px !important;
  margin: 0 auto 10px !important;
  box-sizing: border-box !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav > .container-fluid {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  gap: 8px !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav .navbar-brand {
  display: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav .navbar-toggler {
  flex: 0 0 auto !important;
  border: 1px solid rgba(255, 255, 255, 0.48) !important;
  border-radius: 12px !important;
  padding: 7px 10px !important;
  box-shadow: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav .navbar-toggler-icon {
  filter: brightness(0) invert(1) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav .navbar-collapse {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-item {
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  padding: 8px 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.26) !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  font-family: zohopuvi-regular, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: normal !important;
  box-shadow: 0 2px 5px rgba(25, 20, 55, 0.10) !important;
  transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link:hover,
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link:focus-visible {
  background: #ffffff !important;
  color: #50487f !important;
  border-color: #ffffff !important;
  box-shadow: 0 4px 10px rgba(25, 20, 55, 0.18) !important;
  transform: translateY(-1px);
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link[aria-current="page"] {
  background: #ffffff !important;
  color: #50487f !important;
  border-color: #ffffff !important;
  box-shadow: 0 2px 7px rgba(25, 20, 55, 0.12) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-submenu {
  margin-top: 8px !important;
  padding: 7px !important;
  border: 1px solid #eeeaf6 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(35, 28, 70, 0.18) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-submenu-link {
  display: block !important;
  padding: 9px 12px !important;
  border-radius: 9px !important;
  color: #30294d !important;
  text-decoration: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-submenu-link:hover {
  background: #f2f0fa !important;
  color: #50487f !important;
}

/* Keep Locate Us / Feedback from visually colliding with the booking heading. */
body.path-frontpage #block-turf-subtheme-map {
  position: relative !important;
  z-index: 2 !important;
}

/* Fixed-height slot display area, regardless of the number of slots available. */
body.path-frontpage .time-slots {
  position: relative !important;
  isolation: isolate !important;
  height: 286px !important;
  min-height: 286px !important;
  max-height: 286px !important;
  overflow: visible !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* More visible logo watermark, kept behind every real booking button. */
body.path-frontpage .time-slots::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image: url("/sites/default/files/small-Logo.jpeg") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: auto 74% !important;
  opacity: 0.24 !important;
}

/* Preserve original buttons and all Drupal-controlled slot states. */
body.path-frontpage .time-slots > .turf-booking-grid {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(4, 44px) !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  align-content: space-between !important;
  align-items: start !important;
  overflow: visible !important;
}

body.path-frontpage .time-slots > .turf-booking-grid > .time-slot {
  position: static !important;
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Tablet and mobile: prevent the nav from becoming cramped. */
@media (max-width: 600px) {
  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav {
    width: calc(100% - 12px) !important;
    min-height: 54px !important;
    padding: 7px 8px !important;
    border-radius: 0 0 18px 18px !important;
    margin-bottom: 8px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav > .container-fluid {
    justify-content: flex-start !important;
    gap: 5px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list {
    justify-content: flex-start !important;
    gap: 5px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
  }

  body.path-frontpage .time-slots {
    height: 270px !important;
    min-height: 270px !important;
    max-height: 270px !important;
  }

  body.path-frontpage .time-slots::before {
    background-size: auto 68% !important;
    opacity: 0.19 !important;
  }

  body.path-frontpage .time-slots > .turf-booking-grid {
    grid-template-rows: repeat(4, 42px) !important;
    column-gap: 5px !important;
  }
}


/* =========================================================
   V4 CORRECTION: RESTORE HEADER NAV + TIDY UTILITY LINKS
   Full stylesheet override; no booking JavaScript/state changes.
   ========================================================= */

/* Ensure the account navigation is visible and not clipped by a parent. */
body.path-frontpage #header,
body.path-frontpage #navbar-main,
body.path-frontpage #block-turf-subtheme-account-menu,
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav {
  visibility: visible !important;
  opacity: 1 !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu {
  display: block !important;
  position: relative !important;
  z-index: 40 !important;
  width: 100% !important;
  height: auto !important;
  flex: 0 0 auto !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav {
  display: flex !important;
  position: relative !important;
  width: calc(100% - 20px) !important;
  min-height: 58px !important;
  height: auto !important;
  margin: 0 auto 14px !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #514981 0%, #625895 100%) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  border-radius: 0 0 22px 22px !important;
  box-shadow: 0 5px 16px rgba(45,39,70,.17) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav > .container-fluid {
  display: flex !important;
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  gap: 8px !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .navbar-collapse,
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  flex: 1 1 auto !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list {
  flex-wrap: wrap !important;
  gap: 7px !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-item {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link {
  display: inline-flex !important;
  visibility: visible !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  padding: 8px 14px !important;
  border: 1px solid rgba(255,255,255,.26) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-family: zohopuvi-regular, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 5px rgba(25,20,55,.10) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link:hover,
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link:focus-visible {
  background: #fff !important;
  color: #50487f !important;
  border-color: #fff !important;
}

/* Give Locate Us and Feedback a clear utility row without forcing unknown
   inner wrappers into a new layout. */
body.path-frontpage #block-turf-subtheme-map {
  display: block !important;
  position: relative !important;
  clear: both !important;
  z-index: 2 !important;
  width: 100% !important;
  min-height: 48px !important;
  height: auto !important;
  margin: 0 0 10px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

body.path-frontpage #block-turf-subtheme-map a {
  line-height: 1.35 !important;
}

body.path-frontpage #block-turf-subtheme-map img {
  max-width: 28px !important;
  max-height: 28px !important;
  object-fit: contain !important;
}

/* The booking heading should follow the utility row, not overlap it. */
body.path-frontpage #block-turf-subtheme-map + .block,
body.path-frontpage #block-turf-subtheme-map + h1,
body.path-frontpage #block-turf-subtheme-map + .block h1 {
  margin-top: 0 !important;
}

/* Keep the watermark visible but subordinate to the actual slot buttons. */
body.path-frontpage .time-slots::before {
  opacity: .22 !important;
  background-size: auto 70% !important;
}

/* Keep grid rows and the area height independent of the number of available slots. */
body.path-frontpage .time-slots {
  height: 286px !important;
  min-height: 286px !important;
  max-height: 286px !important;
}

body.path-frontpage .time-slots > .turf-booking-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(4, 44px) !important;
  align-content: space-between !important;
}

@media (max-width: 600px) {
  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav {
    width: calc(100% - 12px) !important;
    min-height: 54px !important;
    margin-bottom: 10px !important;
    padding: 7px 8px !important;
    border-radius: 0 0 18px 18px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav > .container-fluid,
  body.path-frontpage #block-turf-subtheme-account-menu .navbar-collapse,
  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list {
    justify-content: flex-start !important;
    gap: 5px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
  }

  body.path-frontpage #block-turf-subtheme-map {
    min-height: 42px !important;
    margin-bottom: 8px !important;
    padding: 0 10px !important;
  }

  body.path-frontpage .time-slots {
    height: 270px !important;
    min-height: 270px !important;
    max-height: 270px !important;
  }

  body.path-frontpage .time-slots::before {
    background-size: auto 64% !important;
    opacity: .18 !important;
  }

  body.path-frontpage .time-slots > .turf-booking-grid {
    grid-template-rows: repeat(4, 42px) !important;
    column-gap: 5px !important;
  }
}


/* =========================================================
   V5: LOGGED-IN + LOGGED-OUT HEADER CONSISTENCY
   This is a complete stylesheet based on V4.
   No booking JavaScript, selection logic, or state classes changed.
   ========================================================= */

/* Keep the site header in document flow below Drupal's admin toolbar. */
body.path-frontpage #header,
body.path-frontpage header#header,
body.path-frontpage .site-header {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  z-index: 25 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  transform: none !important;
}

/* Normalize likely Barrio navigation wrappers in both authentication states. */
body.path-frontpage #header nav,
body.path-frontpage #header .navbar,
body.path-frontpage #navbar-main,
body.path-frontpage .region-primary-menu,
body.path-frontpage .region-nav-main,
body.path-frontpage .region-secondary-menu {
  position: relative !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
}

/* Style the account menu by its block ID when present, but also style its
   own class if Drupal renders it in a different block while logged in. */
body.path-frontpage #block-turf-subtheme-account-menu,
body.path-frontpage .block .account-menu-nav,
body.path-frontpage nav.account-menu-nav {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
  transform: none !important;
  z-index: 35 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav,
body.path-frontpage .block .account-menu-nav,
body.path-frontpage nav.account-menu-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(100% - 20px) !important;
  min-height: 58px !important;
  height: auto !important;
  margin: 0 auto 14px !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  background: linear-gradient(135deg, #514981 0%, #625895 100%) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  border-radius: 0 0 22px 22px !important;
  box-shadow: 0 5px 16px rgba(45,39,70,.17) !important;
}

/* Support the actual menu list whether it uses custom classes or Bootstrap. */
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list,
body.path-frontpage .account-menu-nav ul,
body.path-frontpage .account-menu-nav .navbar-nav {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-item,
body.path-frontpage .account-menu-nav li {
  display: block !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link,
body.path-frontpage .account-menu-nav a,
body.path-frontpage .region-primary-menu a,
body.path-frontpage .region-nav-main a {
  text-decoration: none !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link,
body.path-frontpage .account-menu-nav .nav-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 36px !important;
  max-width: 100% !important;
  padding: 8px 14px !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
  font-family: zohopuvi-regular, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  white-space: normal !important;
  box-shadow: 0 2px 5px rgba(25,20,55,.10) !important;
}

body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link:hover,
body.path-frontpage .account-menu-nav .nav-link:hover,
body.path-frontpage .account-menu-nav .nav-link:focus-visible {
  background: #fff !important;
  color: #50487f !important;
  border-color: #fff !important;
}

/* If the logged-in menu is output as a standard Drupal/Bootstrap nav instead
   of .account-menu-nav, give the menu container the same material surface. */
body.path-frontpage #header .region-primary-menu nav,
body.path-frontpage #header .region-nav-main nav,
body.path-frontpage #header nav[aria-label*="menu" i] {
  display: block !important;
  width: calc(100% - 20px) !important;
  margin: 0 auto 14px !important;
  padding: 8px 12px !important;
  background: linear-gradient(135deg, #514981 0%, #625895 100%) !important;
  border-radius: 0 0 22px 22px !important;
  box-shadow: 0 5px 16px rgba(45,39,70,.17) !important;
}

/* Locate Us / Feedback: render as a clean, balanced utility row. */
body.path-frontpage #block-turf-subtheme-map {
  display: block !important;
  clear: both !important;
  width: 100% !important;
  min-height: 42px !important;
  height: auto !important;
  margin: 0 0 12px !important;
  padding: 0 12px !important;
  box-sizing: border-box !important;
  position: relative !important;
  z-index: 3 !important;
}

body.path-frontpage #block-turf-subtheme-map a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: 5px 10px !important;
  border: 1px solid #e8e5f1 !important;
  border-radius: 999px !important;
  background: #f7f6fb !important;
  color: #514981 !important;
  font-family: zohopuvi-regular, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(45,39,70,.06) !important;
}

body.path-frontpage #block-turf-subtheme-map a:hover {
  background: #efedf8 !important;
  border-color: #d5cfee !important;
}

/* The watermark should support the slots, not occupy the empty lower half. */
body.path-frontpage .time-slots::before {
  background-position: center 44% !important;
  background-size: auto 62% !important;
  opacity: .19 !important;
}

@media (max-width: 600px) {
  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav,
  body.path-frontpage .block .account-menu-nav,
  body.path-frontpage nav.account-menu-nav {
    width: calc(100% - 12px) !important;
    min-height: 54px !important;
    margin-bottom: 10px !important;
    padding: 7px 8px !important;
    border-radius: 0 0 18px 18px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list,
  body.path-frontpage .account-menu-nav ul,
  body.path-frontpage .account-menu-nav .navbar-nav {
    justify-content: flex-start !important;
    gap: 5px !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-link,
  body.path-frontpage .account-menu-nav .nav-link {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
  }

  body.path-frontpage #block-turf-subtheme-map {
    min-height: 38px !important;
    margin-bottom: 8px !important;
    padding: 0 8px !important;
  }

  body.path-frontpage .time-slots::before {
    background-size: auto 58% !important;
    opacity: .17 !important;
  }
}


/* =========================================================
   V6 HOTFIX: KEEP REPORT / DROPDOWN MENUS CLOSED BY DEFAULT
   Root cause addressed: broad "nav ul" flex rules were also
   applying to nested dropdown lists, overriding Bootstrap's
   default hidden dropdown state.
   ========================================================= */

/* Only the primary navigation list should use the horizontal pill layout. */
body.path-frontpage #block-turf-subtheme-account-menu > nav.account-menu-nav ul.account-menu-list,
body.path-frontpage #block-turf-subtheme-account-menu nav.account-menu-nav > .container-fluid > ul,
body.path-frontpage nav.account-menu-nav > .container-fluid > ul,
body.path-frontpage .account-menu-nav > ul.navbar-nav {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
}

/* Nested dropdowns must not inherit the top-level flex display. */
body.path-frontpage .account-menu-nav ul.dropdown-menu,
body.path-frontpage .account-menu-nav .dropdown-menu,
body.path-frontpage #block-turf-subtheme-account-menu ul.dropdown-menu,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu,
body.path-frontpage .region-primary-menu ul.dropdown-menu,
body.path-frontpage .region-nav-main ul.dropdown-menu {
  display: none !important;
  position: absolute !important;
  flex-direction: column !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 2px !important;
  min-width: 190px !important;
  width: max-content !important;
  max-width: min(320px, calc(100vw - 24px)) !important;
  height: auto !important;
  max-height: min(70vh, 480px) !important;
  overflow-y: auto !important;
  margin: 6px 0 0 !important;
  padding: 8px !important;
  list-style: none !important;
  background: #ffffff !important;
  border: 1px solid #e7e3f2 !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 28px rgba(35, 28, 70, .20) !important;
  z-index: 1000 !important;
}

/* Bootstrap/Drupal opens dropdowns using .show or aria-expanded="true".
   These states remain controlled by the existing menu JavaScript. */
body.path-frontpage .account-menu-nav .dropdown-menu.show,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu.show,
body.path-frontpage .region-primary-menu .dropdown-menu.show,
body.path-frontpage .region-nav-main .dropdown-menu.show,
body.path-frontpage .account-menu-nav .dropdown.show > .dropdown-menu,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown.show > .dropdown-menu,
body.path-frontpage .account-menu-nav [aria-expanded="true"] + .dropdown-menu,
body.path-frontpage #block-turf-subtheme-account-menu [aria-expanded="true"] + .dropdown-menu {
  display: block !important;
}

/* Dropdown links are vertical, full-width, and do not look like top-level pills. */
body.path-frontpage .account-menu-nav .dropdown-menu > li,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu > li,
body.path-frontpage .region-primary-menu .dropdown-menu > li,
body.path-frontpage .region-nav-main .dropdown-menu > li {
  display: block !important;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.path-frontpage .account-menu-nav .dropdown-menu a,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu a,
body.path-frontpage .region-primary-menu .dropdown-menu a,
body.path-frontpage .region-nav-main .dropdown-menu a {
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 10px 12px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #30294d !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  text-align: left !important;
  white-space: normal !important;
  box-shadow: none !important;
  transform: none !important;
}

body.path-frontpage .account-menu-nav .dropdown-menu a:hover,
body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu a:hover,
body.path-frontpage .region-primary-menu .dropdown-menu a:hover,
body.path-frontpage .region-nav-main .dropdown-menu a:hover {
  background: #f2f0fa !important;
  color: #50487f !important;
}

/* Do not force Bootstrap's responsive collapse wrapper to stay open.
   At desktop widths, show it normally; on mobile, Bootstrap's .show
   class controls visibility when the toggler is used. */
body.path-frontpage #block-turf-subtheme-account-menu .navbar-collapse,
body.path-frontpage .account-menu-nav .navbar-collapse {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

@media (max-width: 767.98px) {
  body.path-frontpage #block-turf-subtheme-account-menu .navbar-collapse:not(.show):not(.collapsing),
  body.path-frontpage .account-menu-nav .navbar-collapse:not(.show):not(.collapsing) {
    display: none !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .navbar-collapse.show,
  body.path-frontpage .account-menu-nav .navbar-collapse.show {
    display: block !important;
  }

  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-list,
  body.path-frontpage .account-menu-nav > .container-fluid > ul.navbar-nav {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  body.path-frontpage .account-menu-nav .dropdown-menu,
  body.path-frontpage #block-turf-subtheme-account-menu .dropdown-menu {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 4px 0 0 !important;
    box-shadow: none !important;
  }
}


/* =========================================================
   V7 DESIGN POLISH
   - Rounded outer header corners and rounded surfaces
   - Refined footer typography and spacing
   - Remove redundant ONLINE BOOKING eyebrow
   NOTE: Moving Locate Us / Feedback into the footer requires
   moving their Drupal block to the footer region; CSS cannot
   re-parent those links into a different DOM container.
   ========================================================= */

/* Rounded header surface on all four corners. */
body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav,
body.path-frontpage .account-menu-nav {
  border-radius: 22px !important;
}

/* Consistent Material-style rounded corners for main page surfaces. */
body.path-frontpage #main-wrapper,
body.path-frontpage .region-content,
body.path-frontpage .block-page-title-block,
body.path-frontpage .time-slots,
body.path-frontpage .date-navigation,
body.path-frontpage .date-selector,
body.path-frontpage .site-footer,
body.path-frontpage .site-footer__bottom {
  border-radius: 18px !important;
}

/* Keep the page canvas and slot area unclipped so all four grid rows remain visible. */
body.path-frontpage #main-wrapper,
body.path-frontpage .region-content,
body.path-frontpage .time-slots {
  overflow: visible !important;
}

/* Remove the small ONLINE BOOKING eyebrow: the main heading already explains the page. */
body.path-frontpage .block-page-title-block .field--name-field-subtitle,
body.path-frontpage .block-page-title-block .page-subtitle,
body.path-frontpage .block-page-title-block .eyebrow,
body.path-frontpage .block-page-title-block .booking-eyebrow,
body.path-frontpage .block-page-title-block .online-booking-label {
  display: none !important;
}

/* Fallback for the visual eyebrow shown above the heading when generated by CSS. */
body.path-frontpage .block-page-title-block h1::before,
body.path-frontpage .page-title::before {
  content: none !important;
  display: none !important;
}

/* Footer: readable modern typography and better spacing. */
body.path-frontpage .site-footer,
body.path-frontpage .site-footer__bottom,
body.path-frontpage .region-footer-fifth,
body.path-frontpage #block-turf-subtheme-copyright {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
  letter-spacing: 0.1px !important;
}

body.path-frontpage .site-footer,
body.path-frontpage .site-footer__bottom {
  border-radius: 18px 18px 0 0 !important;
}

body.path-frontpage #block-turf-subtheme-copyright p {
  margin: 0 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  text-align: center !important;
}

body.path-frontpage #block-turf-subtheme-copyright a {
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-underline-offset: 2px !important;
}

body.path-frontpage #block-turf-subtheme-copyright img {
  width: 20px !important;
  height: 20px !important;
  object-fit: contain !important;
  vertical-align: middle !important;
  margin: 3px 4px 0 !important;
}

/* Footer links should look like part of one clean footer row. */
body.path-frontpage #block-turf-subtheme-copyright a[href*="terms-conditions"],
body.path-frontpage #block-turf-subtheme-copyright a[href*="privacy-policy"] {
  display: inline-block !important;
  margin: 0 3px !important;
  white-space: nowrap !important;
}

/* Utility links remain styled as compact pills until their Drupal block
   is moved into the footer region via Structure > Block layout. */
body.path-frontpage #block-turf-subtheme-map a {
  border-radius: 999px !important;
}

/* Responsive corner radius and footer type scale. */
@media (max-width: 600px) {
  body.path-frontpage #block-turf-subtheme-account-menu .account-menu-nav,
  body.path-frontpage .account-menu-nav {
    border-radius: 18px !important;
  }

  body.path-frontpage #main-wrapper,
  body.path-frontpage .region-content,
  body.path-frontpage .time-slots,
  body.path-frontpage .date-navigation,
  body.path-frontpage .date-selector {
    border-radius: 14px !important;
  }

  body.path-frontpage .site-footer,
  body.path-frontpage .site-footer__bottom {
    border-radius: 14px 14px 0 0 !important;
  }

  body.path-frontpage #block-turf-subtheme-copyright,
  body.path-frontpage #block-turf-subtheme-copyright p,
  body.path-frontpage #block-turf-subtheme-copyright a {
    font-size: 10px !important;
  }
}