/* =========================================
   Single listing page (Directories Pro)
   Desktop > 980px, mobile/tablet <= 980px (Divi tablet breakpoint)
   ========================================= */

/* Palette: swap these for Divi global color variables once they exist */
.drts-display--detailed {
    --plb-primary: #c5a56d;
    --plb-secondary: #adadad;
    --plb-accent: #fbc846;
    --plb-bg: #fffafa;
    --plb-text: #07071d;
    --plb-text-muted: #55555f;
    --plb-gutter: 16px;
    --plb-content-max: 1100px; /* slider and header width on desktop */
    --plb-frame-bg: #f2efea;
}

/* -----------------------------------------
   1. Header: business name + categories
   ----------------------------------------- */
.drts-display--detailed .plb-listing-header {
    max-width: var(--plb-content-max);
    margin: 0 auto !important;
    padding: 32px 0 20px;
}
.drts-display--detailed .plb-listing-header .business-name {
    margin: 0 !important;
}
.drts-display--detailed .plb-listing-title {
    margin: 0;
    padding: 0;
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 46px;
    font-weight: 500;
    line-height: 1.15;
    color: var(--plb-text);
}

/* Summary line: rating · City, ST · price */
/* Dot separators: every item gets a leading dot, and the one starting each line is
   clipped (negative margin + clip-path), so wrapped lines never start or end with a dot */
.drts-display--detailed .plb-listing-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 10px 0 0 -20px;
    padding: 0;
    clip-path: inset(0 0 0 20px);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    color: var(--plb-text);
}
.drts-display--detailed .plb-listing-meta > * {
    white-space: nowrap;
}
.drts-display--detailed .plb-listing-meta > *::before {
    content: "\00B7";
    display: inline-block;
    width: 20px;
    text-align: center;
    color: var(--plb-secondary);
}
.drts-display--detailed .plb-listing-rating {
    color: var(--plb-text);
    font-weight: 600;
    text-decoration: none;
}
.drts-display--detailed .plb-listing-rating:hover .plb-listing-rating-count,
.drts-display--detailed .plb-listing-rating:focus-visible .plb-listing-rating-count {
    text-decoration: underline;
}
.drts-display--detailed .plb-listing-star {
    color: #d9a21b; /* accent gold, darkened to read on white */
}
.drts-display--detailed .plb-listing-rating-count {
    font-weight: 400;
    color: var(--plb-text-muted);
}

/* Categories: plain text separated by dots, no folder icons */
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] {
    margin: 8px 0 0 -20px !important; /* same dot clipping as the summary line */
    clip-path: inset(0 0 0 20px);
    font-size: 0; /* hides the &nbsp; Directories Pro puts between links */
    line-height: 1.5;
}
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] a {
    display: inline-block;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 500;
    color: var(--plb-text-muted);
    text-decoration: none;
}
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] a:hover,
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] a:focus-visible {
    color: var(--plb-text);
    text-decoration: underline;
}
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] a::before {
    content: "\00B7";
    display: inline-block; /* keeps the dot out of the link underline */
    width: 20px;
    text-align: center;
    color: var(--plb-secondary);
}
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] .drts-icon {
    display: none !important; /* beats Directories Pro's .fas {display: inline-block !important} */
}
.drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] .drts-icon + span {
    margin-left: 0; /* spacing meant for the hidden icon */
}

/* -----------------------------------------
   2. Slider frame: 16:9 desktop, 4:3 mobile
   ----------------------------------------- */
.drts-display--detailed .drts-display-listing-hero {
    max-width: var(--plb-content-max);
    margin: 0 auto 32px;
}
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos {
    background: transparent; /* DP paints the whole wrapper (incl. thumbnail strip) black */
}
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main {
    background: var(--plb-frame-bg);
}
/* Each slide (photo figure or video wrapper) sets the ratio, replacing the fixed 480px height.
   Targets data-type, not .slick-slide, so the frame holds its size before slick starts. */
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="image"] figure,
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="plb-video"],
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="youtube"],
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="vimeo"] {
    position: relative;
    height: auto !important; /* DP JS sets inline heights */
    max-height: none;
    aspect-ratio: 16 / 9;
}
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="image"] figure img {
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: cover;
    object-position: center;
    pointer-events: none; /* keeps click-to-zoom disabled, as before */
}
.drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type] iframe {
    position: absolute;
    inset: 0;
    width: 100% !important; /* DP JS sets inline sizes */
    height: 100% !important;
    transform: none;
}

@media (max-width: 980px) {
    .drts-display--detailed .plb-listing-header {
        padding: 20px var(--plb-gutter) 14px;
    }
    .drts-display--detailed .drts-display-listing-hero {
        margin-bottom: 24px;
    }
    .drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="image"] figure,
    .drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="plb-video"],
    .drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="youtube"],
    .drts-display--detailed .drts-display-listing-hero .drts-slider-photos-main [data-type="vimeo"] {
        aspect-ratio: 4 / 3;
        max-height: 75vh; /* landscape phones: keep the photo within the screen */
        max-height: 75svh;
    }
    .drts-display--detailed .plb-listing-title {
        font-size: 32px;
        line-height: 1.2;
    }
    .drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] {
        margin-top: 6px !important;
    }
    .drts-display--detailed .plb-listing-meta {
        margin-top: 8px;
        font-size: 15px;
    }
    .drts-display--detailed .plb-listing-header [data-name="entity_field_directory_category"] a {
        font-size: 14px;
    }
}

/* -----------------------------------------
   3. Navigation: arrows, thumbnails, counter
   ----------------------------------------- */
/* Main arrows: white circles stay visible on dark and light photos */
.drts-display--detailed .plb-slider .drts-slider-photos-main .slick-arrow {
    width: 48px;
    height: 48px;
    padding: 0;
}
.drts-display--detailed .plb-slider .drts-slider-photos-main .slick-prev { left: 16px; }
.drts-display--detailed .plb-slider .drts-slider-photos-main .slick-next { right: 16px; }
.drts-display--detailed .plb-slider .drts-slider-photos-main .slick-arrow::before {
    width: 48px;
    height: 48px;
    line-height: 48px;
    font-size: 18px;
    color: var(--plb-text);
    background-color: rgba(255, 255, 255, 0.92);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    opacity: 1;
    transition: background-color 0.2s, color 0.2s;
}
@media (hover: hover) { /* touch screens keep :hover after a tap */
    .drts-display--detailed .plb-slider .drts-slider-photos-main .slick-arrow:hover::before {
        color: var(--plb-primary);
        background-color: #fff;
    }
}
.drts-display--detailed .plb-slider .slick-arrow:focus-visible::before {
    outline: 2px solid var(--plb-accent);
    outline-offset: 2px;
}
/* No looping, so hide the arrow at the first and last photo */
.drts-display--detailed .plb-slider .slick-arrow.slick-disabled {
    display: none !important;
}

/* Thumbnail strip below the photo */
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails {
    margin-top: 12px;
    padding: 0 40px; /* room for the strip's arrows */
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-track {
    margin-left: auto; /* centers strips shorter than the row */
    margin-right: auto;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-slide {
    padding: 0 4px;
    opacity: 0.6;
    cursor: pointer;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-slide:hover,
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-slide.slick-current {
    opacity: 1;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-current img {
    outline: 3px solid var(--plb-accent);
    outline-offset: -3px;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-arrow {
    width: 32px;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails .slick-arrow::before {
    width: 32px;
    height: 32px;
    line-height: 32px;
    font-size: 13px;
    color: var(--plb-text);
    background-color: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}

/* Photo counter, mobile only */
.drts-display--detailed .plb-slider-counter {
    display: none;
}

/* -----------------------------------------
   4. Loading state
   DP hides the slider (opacity: 0) until slick starts. Show the first photo
   right away instead, with the thumbnails already laid out as a row, so
   nothing shifts when slick initializes.
   ----------------------------------------- */
.drts-display--detailed .plb-slider {
    opacity: 1;
}
.drts-display--detailed .plb-slider .drts-slider-photos-main {
    position: relative;
}
/* Spinner sits behind the first photo, so it only shows until the photo paints */
.drts-display--detailed .plb-slider .drts-slider-photos-main::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px;
    border: 4px solid rgba(0, 0, 0, 0.08);
    border-top-color: var(--plb-accent);
    border-radius: 50%;
    animation: plb-spin 0.9s linear infinite;
}
.drts-display--detailed .plb-slider .slick-loading .slick-list {
    background: none; /* slick's ajax-loader.gif; the spinner above replaces it */
}
.drts-display--detailed .plb-slider--loaded .drts-slider-photos-main::before {
    display: none; /* also covers transparent images */
}
.drts-display--detailed .plb-slider .drts-slider-photos-main > div,
.drts-display--detailed .plb-slider .drts-slider-photos-main .slick-list {
    position: relative;
    z-index: 1;
}
@keyframes plb-spin {
    to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
    .drts-display--detailed .plb-slider .drts-slider-photos-main::before {
        animation-duration: 2.5s;
    }
}
/* Thumbnails before slick starts: same row it will become */
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails:not(.slick-initialized) {
    display: flex;
    justify-content: center;
    overflow: hidden;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails:not(.slick-initialized) > div {
    flex: 0 0 12.5%; /* 8 per row */
    box-sizing: border-box;
    padding: 0 4px;
    opacity: 0.6;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails:not(.slick-initialized) > div:first-child {
    opacity: 1;
}

/* -----------------------------------------
   5. Videos: poster + play button, player opens in a lightbox
   ----------------------------------------- */
.drts-display--detailed .plb-slider .plb-video {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: #000;
    cursor: pointer;
}
.drts-display--detailed .plb-slider .plb-video img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.drts-display--detailed .plb-slider .plb-video-play {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 72px;
    height: 72px;
    margin: -36px 0 0 -36px;
    border-radius: 50%;
    background: var(--plb-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%2307071d'/%3E%3C/svg%3E") 55% 50% / 30px no-repeat;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35);
    transition: transform 0.2s;
}
@media (hover: hover) {
    .drts-display--detailed .plb-slider .plb-video:hover .plb-video-play {
        transform: scale(1.08);
    }
}
.drts-display--detailed .plb-slider .plb-video:focus-visible {
    outline: 3px solid var(--plb-accent);
    outline-offset: -3px;
}
/* Play icon on video thumbnails */
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails [data-type="youtube"],
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails [data-type="vimeo"] {
    position: relative;
}
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails [data-type="youtube"]::after,
.drts-display--detailed .plb-slider .drts-slider-photos-thumbnails [data-type="vimeo"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin: -15px 0 0 -15px;
    border-radius: 50%;
    background: rgba(7, 7, 29, 0.7) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%23fff'/%3E%3C/svg%3E") 55% 50% / 14px no-repeat;
    pointer-events: none;
}

/* Lightbox (appended to <body>, so it sits outside the listing's color variables) */
.plb-video-dialog {
    /* 16:9 player that leaves 128px of height for the close button above it (short/landscape phones) */
    width: min(92vw, 1100px, (100vh - 128px) * 16 / 9);
    width: min(92vw, 1100px, (100dvh - 128px) * 16 / 9);
    max-width: none;
    max-height: none;
    margin: auto;
    padding: 0;
    overflow: visible;
    border: 0;
    background: transparent;
}
.plb-video-dialog::backdrop {
    background: rgba(7, 7, 29, 0.88);
}
html:has(.plb-video-dialog[open]) {
    overflow: hidden; /* no page scrolling behind the player */
}
.plb-video-dialog-frame {
    aspect-ratio: 16 / 9;
    background: #000;
}
.plb-video-dialog-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}
.plb-video-dialog-close {
    position: absolute;
    top: -52px;
    right: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: #07071d;
    font: 400 30px/44px sans-serif;
    text-align: center;
    cursor: pointer;
}
.plb-video-dialog-close:focus-visible {
    outline: 3px solid #fbc846;
    outline-offset: 2px;
}

/* -----------------------------------------
   6. Body: content column + contact card
   Desktop: card stays in view below Divi's fixed header (--plb-header-offset, set by listing-slider.js).
   ----------------------------------------- */
.drts-display--detailed .plb-listing-body {
    max-width: var(--plb-content-max);
    margin: 0 auto !important;
}
.drts-display--detailed .plb-listing-body > .drts-row > [data-name="column"] {
    max-width: none;
}
.drts-display--detailed .plb-listing-body > .drts-row > .plb-listing-main {
    padding: 0;
    overflow: visible; /* DP sets overflow: hidden on columns, which stops the section links pinning */
}
@media (min-width: 981px) {
    .drts-display--detailed .plb-listing-body > .drts-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 360px;
        gap: 48px;
        align-items: start;
        margin: 0;
    }
    .drts-display--detailed .plb-listing-aside {
        position: sticky;
        top: calc(var(--plb-header-offset, 96px) + 24px);
    }
}

/* -----------------------------------------
   7. Content sections: links, headings, About
   ----------------------------------------- */
/* The description wrapper (nav + About heading + text) takes no box of its own,
   so the section links can stay pinned for the whole content column */
.drts-display--detailed .plb-listing-main > [data-name="entity_field_post_content"] {
    display: contents;
}
.drts-display--detailed .plb-section-nav {
    display: flex;
    gap: 28px;
    margin: 0 0 8px;
    border-bottom: 1px solid #eee9e0;
    background: #fff;
    overflow-x: auto;
    scrollbar-width: none;
}
.drts-display--detailed .plb-section-nav::-webkit-scrollbar {
    display: none;
}
.drts-display--detailed .plb-section-nav a {
    flex: none;
    padding: 14px 0 12px;
    border-bottom: 3px solid transparent;
    color: var(--plb-text-muted);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
}
.drts-display--detailed .plb-section-nav a:hover,
.drts-display--detailed .plb-section-nav a[aria-current="true"] {
    color: var(--plb-text);
}
.drts-display--detailed .plb-section-nav a[aria-current="true"] {
    border-bottom-color: var(--plb-accent);
}
@media (min-width: 981px) {
    .drts-display--detailed .plb-section-nav {
        position: sticky;
        top: var(--plb-header-offset, 80px);
        z-index: 5;
    }
}
/* Section links scroll smoothly (this stylesheet only loads on listing pages) */
@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}
/* Anchored sections land below the fixed header and pinned links */
.drts-display--detailed [id^="plb-"] {
    scroll-margin-top: calc(var(--plb-header-offset, 80px) + 72px);
}

/* Section headings: our About heading and DP element headers in the content column */
.drts-display--detailed .plb-section-title,
.drts-display--detailed .plb-listing-main > .drts-display-element > .drts-display-element-header {
    margin: 0 0 16px;
    padding: 0;
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 28px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--plb-text);
}
.drts-display--detailed .plb-listing-main > .drts-display-element > .drts-display-element-header .drts-icon {
    display: none !important;
}
.drts-display--detailed .plb-section-title {
    padding-top: 24px;
}
/* Sections after About are separated by a rule */
.drts-display--detailed .plb-listing-main > #plb-details,
.drts-display--detailed .plb-listing-main > #plb-location,
.drts-display--detailed .plb-listing-main > #plb-reviews {
    margin: 40px 0 0 !important;
    padding-top: 40px;
    border-top: 1px solid #eee9e0;
}

/* -----------------------------------------
   8. Details and Venue: fact cards
   ----------------------------------------- */
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-bs-list-group,
.drts-display--detailed .plb-listing-main > .plb-venue-info {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info {
    margin: 28px 0 0 !important;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .drts-display-element-header {
    grid-column: 1 / -1;
    margin: 0 0 4px;
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 600;
    color: var(--plb-text);
}
/* One card per field */
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-bs-list-group-item,
.drts-display--detailed .plb-listing-main > .plb-venue-info > .drts-display-element:not(.drts-display-element-header) {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0 !important;
    padding: 14px 16px !important;
    border: 1px solid #eee9e0 !important;
    border-radius: 10px;
    background: #fcfbf8;
}
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-entity-field {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
}
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-entity-field-label,
.drts-display--detailed .plb-listing-main > .plb-venue-info .drts-entity-field-label,
.drts-display--detailed .plb-listing-main > .plb-venue-info [data-name="text"] strong {
    margin: 0;
    padding: 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--plb-text-muted);
}
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-entity-field-label .drts-icon,
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-entity-field-label i {
    display: none !important;
}
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-entity-field-value,
.drts-display--detailed .plb-listing-main > .plb-venue-info .drts-entity-field-value,
.drts-display--detailed .plb-listing-main > .plb-venue-info time {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
    text-align: left;
    color: var(--plb-text);
}
/* Ranges: DP writes " to " for prices and " - " for counts; show one dash style, as in the header */
.drts-display--detailed .plb-listing-main .drts-field-range-separator {
    font-size: 0;
}
.drts-display--detailed .plb-listing-main .drts-field-range-separator::before {
    content: "\2013";
    padding: 0 0.3em;
    font-size: 16px;
}
/* Opening hours and seasonal dates are lists; give them the full row */
.drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-bs-list-group-item:has(.directory-listing-opening-hours),
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability {
    grid-column: 1 / -1;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability .drts-row {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 24px;
    margin: 0;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability [data-name="column"] {
    flex: none;
    max-width: none;
    padding: 0;
    text-align: left !important;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability [data-name="column"]:first-child {
    flex-basis: 100%;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability p {
    margin: 0;
    padding: 0;
}
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability [data-name^="entity_field_"] {
    font-size: 16px;
    font-weight: 600;
    color: var(--plb-text);
}
/* The end date's element is empty when the start date shows the whole season */
.drts-display--detailed .plb-listing-main > .plb-venue-info > .col-seasonal-availability [data-name="column"]:has(> [data-name^="entity_field_"]:empty) {
    display: none;
}

/* Location: address, then the map (venues and shops only) at full width */
.drts-display--detailed .plb-listing-main > #plb-location > .drts-row {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 0;
}
.drts-display--detailed .plb-listing-main > #plb-location > .drts-row > [data-name="column"] {
    flex: none;
    width: 100%;
    max-width: none;
    padding: 0;
}
.drts-display--detailed .plb-listing-main > #plb-location .drts-bs-list-group-item {
    padding: 0 !important;
    border: 0;
}
.drts-display--detailed .plb-listing-main > #plb-location .drts-entity-field-label-type-none {
    display: none;
}
.drts-display--detailed .plb-listing-main > #plb-location .listing-address {
    font-size: 17px !important; /* DP sets 1.2rem inline */
    line-height: 1.5;
    color: var(--plb-text);
}
.drts-display--detailed .plb-listing-main > #plb-location .drts-map-container {
    overflow: hidden;
    border: 1px solid #eee9e0;
    border-radius: 12px;
}
.drts-display--detailed .plb-listing-main > #plb-location .drts-map-map {
    height: 320px !important;
}

@media (max-width: 980px) {
    .drts-display--detailed .plb-listing-main .directory-listing-extra-info .drts-bs-list-group,
    .drts-display--detailed .plb-listing-main > .plb-venue-info {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }
    .drts-display--detailed .plb-listing-main > #plb-location .drts-map-map {
        height: 240px !important;
    }
}

/* About text: vendors' own headings sit one level below the section heading */
.drts-display--detailed .plb-about-body {
    position: relative;
    font-size: 16px;
    line-height: 1.7;
    color: var(--plb-text);
}
.drts-display--detailed .plb-about-body h1,
.drts-display--detailed .plb-about-body h2,
.drts-display--detailed .plb-about-body h3,
.drts-display--detailed .plb-about-body h4 {
    margin: 28px 0 8px;
    padding: 0;
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--plb-text);
}
.drts-display--detailed .plb-about-body > :first-child,
.drts-display--detailed .plb-about-body > :first-child > :first-child {
    margin-top: 0;
}
.drts-display--detailed .plb-about-body p {
    margin: 0 0 14px;
    padding: 0;
}
/* Read more (class added by listing-slider.js only when the text is long) */
.drts-display--detailed .plb-about-body.plb-collapsed {
    max-height: 17em; /* about 10 lines */
    overflow: hidden;
    -webkit-mask-image: linear-gradient(#000 70%, transparent);
    mask-image: linear-gradient(#000 70%, transparent);
}
.drts-display--detailed .plb-read-more {
    margin: 8px 0 0;
    padding: 0;
    border: 0;
    background: none;
    color: var(--plb-text);
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.drts-display--detailed .plb-read-more:focus-visible {
    outline: 2px solid var(--plb-accent);
    outline-offset: 2px;
}

/* -----------------------------------------
   9. Reviews: summary + button, invitation when empty, review cards
   Layout: heading / [summary or invitation | button] / list
   ----------------------------------------- */
.drts-display--detailed .plb-reviews-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px 24px;
}
.drts-display--detailed .plb-reviews-section > * {
    margin: 0 !important;
}
.drts-display--detailed .plb-reviews-section > .drts-display-element-header,
.drts-display--detailed .plb-reviews-section > .plb-reviews-list {
    flex: 0 0 100%;
}
.drts-display--detailed .plb-reviews-section > .plb-reviews-summary,
.drts-display--detailed .plb-reviews-section > .plb-reviews-invite {
    flex: 1 1 auto;
}
/* Plans without reviews: no list and no button, so nothing to show */
.drts-display--detailed .plb-reviews-section:not(:has(> .plb-reviews-list, > .plb-reviews-cta)) {
    display: none !important;
}
/* The invitation only applies before the first review */
.drts-display--detailed .plb-reviews-section:has(> .plb-reviews-list) > .plb-reviews-invite {
    display: none;
}
.drts-display--detailed .plb-reviews-invite p {
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: var(--plb-text-muted);
}

/* Summary: big average, stars, count */
.drts-display--detailed .plb-reviews-summary .drts-voting-rating {
    display: flex;
    align-items: center;
    gap: 10px;
}
.drts-display--detailed .plb-reviews-summary .drts-voting-rating-stars {
    order: 2;
    font-size: 20px;
    color: #d9a21b !important;
}
.drts-display--detailed .plb-reviews-summary .drts-voting-rating-average {
    order: 1;
    margin: 0 !important;
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    color: var(--plb-text);
}
.drts-display--detailed .plb-reviews-summary .drts-voting-rating-count {
    order: 3;
    margin: 0 !important;
    font-size: 15px;
    color: var(--plb-text-muted);
}
.drts-display--detailed .plb-reviews-summary .drts-voting-rating-count::before {
    content: "(";
}
.drts-display--detailed .plb-reviews-summary .drts-voting-rating-count::after {
    content: ")";
}

/* Write a Review: an active-looking outline button (DP's secondary grey reads as disabled) */
.drts-display--detailed .plb-reviews-cta .drts-bs-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 18px;
    border: 1.5px solid var(--plb-text) !important;
    border-radius: 8px;
    background: #fff !important;
    color: var(--plb-text) !important;
    font-size: 15px;
    font-weight: 600;
    opacity: 1 !important;
    cursor: pointer;
    box-shadow: none;
}
@media (hover: hover) {
    .drts-display--detailed .plb-reviews-cta .drts-bs-btn:hover {
        background: var(--plb-text) !important;
        color: #fff !important;
    }
}
.drts-display--detailed .plb-reviews-cta .drts-bs-btn:focus-visible {
    outline: 3px solid var(--plb-accent);
    outline-offset: 2px;
}

/* Review cards: two columns in the content column, one on phones */
.drts-display--detailed .plb-reviews-list .drts-view-entities-header:empty {
    display: none;
}
.drts-display--detailed .plb-reviews-list .dw {
    column-count: 2 !important;
    margin: -6px;
}
.drts-display--detailed .plb-reviews-list .dw-panel {
    padding: 6px;
}
.drts-display--detailed .plb-reviews-list .drts-display--summary {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px !important;
    border: 1px solid #eee9e0 !important;
    border-radius: 12px;
    background: #fff;
}
.drts-display--detailed .plb-reviews-list .drts-display--summary > * {
    margin: 0 !important;
}
.drts-display--detailed .plb-reviews-list .review-title {
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 19px !important;
    font-weight: 600;
    line-height: 1.3;
}
.drts-display--detailed .plb-reviews-list .review-title a {
    color: var(--plb-text);
    text-decoration: none;
}
.drts-display--detailed .plb-reviews-list .review-title a:hover {
    text-decoration: underline;
}
.drts-display--detailed .plb-reviews-list .review-rating .drts-voting-rating-stars {
    color: #d9a21b !important;
}
.drts-display--detailed .plb-reviews-list .review-rating .drts-voting-rating-average {
    display: none; /* the stars say it */
}
.drts-display--detailed .plb-reviews-list .review-author-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 6px;
    font-size: 14px;
    color: var(--plb-text-muted);
}
.drts-display--detailed .plb-reviews-list .review-author-container > * {
    margin: 0 !important;
}
.drts-display--detailed .plb-reviews-list .review-author a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--plb-text);
    font-weight: 600;
    text-decoration: none;
}
.drts-display--detailed .plb-reviews-list .review-date .drts-entity-field-label {
    display: none;
}
.drts-display--detailed .plb-reviews-list .review-body {
    font-size: 15.5px;
    line-height: 1.6;
    color: var(--plb-text);
}
@media (max-width: 980px) {
    .drts-display--detailed .plb-reviews-list .dw {
        column-count: 1 !important;
    }
    .drts-display--detailed .plb-reviews-summary .drts-voting-rating-average {
        font-size: 28px;
    }
}

/* Contact card */
.drts-display--detailed .plb-listing-aside {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px !important; /* DP column gutters */
    border: 1px solid #e7e2d8;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 24px rgba(7, 7, 29, 0.06);
}
.drts-display--detailed .plb-listing-aside > .drts-display-element {
    margin: 0 !important;
}
.drts-display--detailed .plb-listing-aside [data-name="entity_field_field_logo"] img {
    display: block;
    width: auto;
    max-width: 180px;
    max-height: 64px;
    object-fit: contain;
}
.drts-display--detailed .plb-listing-aside .drts-listing-contact-form > .drts-display-element-header {
    margin: 0 0 16px;
    font-family: var(--et_global_heading_font, "EB Garamond"), Georgia, "Times New Roman", serif;
    font-size: 25px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--plb-text);
}

/* Form: labels always visible above each field (replaces the old animated placeholders) */
.drts-display--detailed .plb-listing-aside .wpcf7-form p {
    margin: 0 0 14px;
    padding: 0;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form br {
    display: none;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form label,
.drts-display--detailed .plb-listing-aside .wpcf7-form-control-wrap {
    display: block;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form label > span[style] {
    display: block !important; /* CF7 markup has inline padding/width */
    width: auto !important;
    padding-top: 0 !important;
}
.drts-display--detailed .plb-listing-aside .drts-contact-animated-placeholder {
    display: block;
    position: static;
    width: auto;
    margin: 0 0 6px;
    opacity: 1;
    transform: none;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--plb-text);
}
.drts-display--detailed .plb-listing-aside .plb-required {
    color: #a3361b;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form input:not([type="radio"]):not([type="submit"]),
.drts-display--detailed .plb-listing-aside .wpcf7-form select,
.drts-display--detailed .plb-listing-aside .wpcf7-form textarea {
    display: block;
    box-sizing: border-box;
    width: 100% !important; /* theme styles cap date, select and number widths */
    max-width: none !important;
    height: 44px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #d6d1c8;
    border-radius: 8px;
    background: #fff;
    color: var(--plb-text);
    font: inherit;
    font-size: 16px; /* 16px stops iOS zooming into the field */
    line-height: 1.3;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form textarea {
    height: 112px;
    resize: vertical;
}
.drts-display--detailed .plb-listing-aside .wpcf7-form input:focus,
.drts-display--detailed .plb-listing-aside .wpcf7-form select:focus,
.drts-display--detailed .plb-listing-aside .wpcf7-form textarea:focus {
    border-color: var(--plb-primary) !important;
    outline: none;
    box-shadow: 0 0 0 3px rgba(197, 165, 109, 0.3);
}
.drts-display--detailed .plb-listing-aside .wpcf7-radio {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
}
.drts-display--detailed .plb-listing-aside .wpcf7-list-item {
    margin: 0;
}
.drts-display--detailed .plb-listing-aside .wpcf7-list-item label {
    display: inline-flex !important; /* overrides the block label rule above */
    align-items: center;
    gap: 6px;
    font-size: 15px;
    cursor: pointer;
}
.drts-display--detailed .plb-listing-aside .wpcf7-list-item input {
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--plb-primary);
}
.drts-display--detailed .plb-listing-aside .wpcf7-submit {
    display: block;
    width: 100%;
    height: 48px;
    margin: 4px 0 0;
    border: 0;
    border-radius: 8px;
    background: var(--plb-primary);
    color: var(--plb-text);
    font: inherit;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background-color 0.2s;
}
@media (hover: hover) {
    .drts-display--detailed .plb-listing-aside .wpcf7-submit:hover {
        background: #b8955a;
    }
}
.drts-display--detailed .plb-listing-aside .wpcf7-submit:focus-visible {
    outline: 3px solid var(--plb-text);
    outline-offset: 2px;
}
.drts-display--detailed .plb-listing-aside .wpcf7-not-valid-tip {
    margin-top: 4px;
    font-size: 13px;
}
.drts-display--detailed .plb-listing-aside .wpcf7-response-output {
    margin: 12px 0 0 !important;
    padding: 10px 12px !important;
    border-radius: 8px;
    font-size: 14px;
}

/* Socials at the foot of the card */
.drts-display--detailed .plb-listing-aside [data-name="entity_field_field_social_accounts"] {
    padding-top: 16px;
    border-top: 1px solid #eee9e0;
}

@media (max-width: 980px) {
    .drts-display--detailed .plb-listing-body > .drts-row {
        display: block;
        margin: 0;
    }
    .drts-display--detailed .plb-listing-main {
        padding: 0 var(--plb-gutter) !important;
    }
    .drts-display--detailed .plb-listing-aside {
        width: auto !important; /* DP columns are width: 100%, which plus the margins overflowed */
        margin: 32px var(--plb-gutter) 0 !important;
    }
}

/* -----------------------------------------
   10. Phones/tablets: bottom bar + contact panel
   ----------------------------------------- */
.plb-mobile-cta {
    display: none;
}
/* listing-slider.js moves the bar to <body> (Divi's page wrappers form their own stacking
   context, so later footer elements drew over it), hence no listing-page ancestor in these
   selectors and literal colours */
@media (max-width: 980px) {
    .plb-mobile-cta {
        position: fixed;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 99990;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
        border-top: 1px solid #e7e2d8;
        background: #fff;
        box-shadow: 0 -4px 16px rgba(7, 7, 29, 0.08);
    }
    .plb-mobile-cta-price {
        font-size: 15px;
        font-weight: 700;
        color: #07071d;
        white-space: nowrap;
    }
    .plb-mobile-cta .plb-mobile-cta-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 48px;
        margin-left: auto;
        padding: 0 22px;
        border-radius: 8px;
        background: #c5a56d;
        color: #07071d;
        font-size: 16px;
        font-weight: 700;
        text-decoration: none;
        white-space: nowrap;
    }
    .plb-mobile-cta .plb-mobile-cta-button:focus-visible {
        outline: 3px solid #07071d;
        outline-offset: 2px;
    }
    /* Room for the bar at the end of the page */
    body {
        padding-bottom: calc(70px + env(safe-area-inset-bottom, 0px));
    }
    /* With the panel available, the card lives in it instead of at the end of the page */
    html.plb-has-contact-sheet .drts-display--detailed .plb-listing-body .plb-listing-aside {
        display: none !important;
    }
}

/* The panel: a <dialog> appended to <body>, carrying the listing classes so the card styles apply */
.plb-contact-sheet {
    position: fixed;
    inset: auto 0 0 0;
    width: 100%;
    max-width: 100%;
    max-height: 92vh;
    max-height: 92dvh;
    margin: 0;
    padding: 0 0 env(safe-area-inset-bottom, 0px);
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0;
    border-radius: 16px 16px 0 0;
    background: #fff;
}
.plb-contact-sheet[open] {
    animation: plb-sheet-in 0.25s ease-out;
}
@keyframes plb-sheet-in {
    from { transform: translateY(100%); }
}
@media (prefers-reduced-motion: reduce) {
    .plb-contact-sheet[open] {
        animation: none;
    }
}
.plb-contact-sheet::backdrop {
    background: rgba(7, 7, 29, 0.55);
}
html:has(.plb-contact-sheet[open]) {
    overflow: hidden;
}
.plb-contact-sheet .plb-listing-aside {
    position: static;
    flex: none;
    width: auto !important;
    max-width: none !important; /* the card's DP column class caps it at a third */
    margin: 0 !important;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
/* Doubled class: the panel carries .drts, whose button styles would otherwise win */
.plb-contact-sheet .plb-contact-sheet-close {
    position: sticky;
    top: 8px;
    z-index: 2;
    display: block;
    width: 44px !important;
    height: 44px !important;
    margin: 8px 8px -52px auto !important; /* overlaps the card's top padding */
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #f2efea !important;
    color: #07071d !important;
    font: 400 28px/44px sans-serif !important;
    text-align: center;
    cursor: pointer;
}
.plb-contact-sheet .plb-contact-sheet-close:focus-visible {
    outline: 3px solid #fbc846;
    outline-offset: 2px;
}

/* Single photo: nothing to navigate */
.drts-display--detailed .plb-slider--single .drts-slider-photos-thumbnails,
.drts-display--detailed .plb-slider--single .slick-arrow {
    display: none !important;
}

@media (max-width: 980px) {
    /* 44px tap target around a 36px circle */
    .drts-display--detailed .plb-slider .drts-slider-photos-main .slick-arrow {
        width: 44px;
        height: 44px;
    }
    .drts-display--detailed .plb-slider .drts-slider-photos-main .slick-prev { left: 6px; }
    .drts-display--detailed .plb-slider .drts-slider-photos-main .slick-next { right: 6px; }
    .drts-display--detailed .plb-slider .drts-slider-photos-main .slick-arrow::before {
        width: 36px;
        height: 36px;
        line-height: 36px;
        font-size: 14px;
        background-color: rgba(255, 255, 255, 0.85);
    }
    .drts-display--detailed .plb-slider .drts-slider-photos-thumbnails {
        display: none !important;
    }
    .drts-display--detailed .plb-slider .plb-video-play {
        width: 60px;
        height: 60px;
        margin: -30px 0 0 -30px;
        background-size: 26px;
    }
    /* YouTube's standard poster is 4:3 with black bars around a 16:9 frame; zoom past the bars */
    .drts-display--detailed .plb-slider .plb-video[data-provider="youtube"]:not(.plb-video--hd) img {
        transform: scale(1.34);
    }
    .drts-display--detailed .plb-slider-counter {
        display: block;
        position: absolute;
        right: 12px;
        bottom: 12px;
        z-index: 11;
        padding: 4px 10px;
        border-radius: 999px;
        background: rgba(7, 7, 29, 0.65);
        color: #fff;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.4;
        font-variant-numeric: tabular-nums;
        pointer-events: none;
    }
}
