/* ═══════════════════════════════════════════════════════════
   FTD TOUR SINGLE — CLEANED & THEME-INDEPENDENT CSS
   ▸ All hardcoded colours replaced with CSS custom properties
   ▸ Duplicates removed
   ▸ Media queries consolidated at the bottom
   ═══════════════════════════════════════════════════════════ */


/* ───────────────────────────────────────────────────────────
   1. DESIGN TOKENS  (override these to retheme)
   ─────────────────────────────────────────────────────────── */
:root {
    /* Brand colours */
    --ftd-primary:        #1a56c4;
    --ftd-primary-dk:     #0d2a6e;
    --ftd-primary-lt:     #eff6ff;
    --ftd-red:            #B08D57;
    --ftd-red-lt:         #a37f481c;
    --ftd-red-border:     #B08D57;
    --ftd-green:          #22a74a;
    --ftd-green-dk:       #1b8f3d;
    --ftd-accent:         #f5a623;

    /* Semantic text */
    --ftd-text:           #1f2937;   /* primary body text  */
    --ftd-text-medium:    #374151;   /* labels, captions   */
    --ftd-text-light:     #6b7280;   /* secondary / muted  */
    --ftd-text-xlight:    #9ca3af;   /* placeholders       */

    /* Surfaces */
    --ftd-white:          #ffffff;
    --ftd-bg:             #f9fafb;   /* widget / card bg   */
    --ftd-bg-subtle:      #f3f4f6;   /* step buttons, etc  */

    /* Borders */
    --ftd-border:         #e5e7eb;

    /* Utility */
    /*--ftd-blue:           #3b82f6;*/
    --ftd-blue:           #B08D57;/   /* interactive accent */
    --ftd-blue-lt:        #f0f9ff;
    --ftd-blue-ring:      rgba(59, 130, 246, 0.10);
    --ftd-success:        #10b981;
    --ftd-whatsapp:       #25d366;
    --ftd-whatsapp-dk:    #1da851;

    /* Layout */
    --ftd-radius:         10px;
    --ftd-radius-sm:      8px;
    --ftd-shadow:         0 4px 20px rgba(0, 0, 0, 0.10);
    --ftd-sidebar-width:  380px;

    /* Avatar palette (used for review initials) */
    --ftd-av-orange:      #e67e22;
    --ftd-av-blue:        #2980b9;
    --ftd-av-green:       #27ae60;
    --ftd-av-purple:      #8e44ad;
    --ftd-av-red:         #c0392b;
    --ftd-av-teal:        #16a085;
}


/* ───────────────────────────────────────────────────────────
   2. LAYOUT & CONTAINER
   ─────────────────────────────────────────────────────────── */
.ftd-tour-single {
    padding: 20px 0 80px;
    background: var(--ftd-white);
}

.ftd-container {
    width: 100%;
    max-width: 1200px;
    margin-inline: auto;
    padding-inline: clamp(16px, 3vw, 40px);
    box-sizing: border-box;
}

.ftd-tour-single__title {
    font-size: clamp(1.4rem, 2.5vw, 2rem);
    font-weight: 800;
    color: var(--ftd-text);
    margin-bottom: 10px;
    line-height: 1.2;
}

.ftd-tour-single__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--ftd-sidebar-width);
    gap: 40px;
    align-items: start;
    width: 100%;
}

.ftd-tour-single__inner > * { min-width: 0; }


/* ───────────────────────────────────────────────────────────
   3. GALLERY
   ─────────────────────────────────────────────────────────── */
.ftd-tour-gallery { margin-bottom: 28px; }

.ftd-tour-gallery__grid {
    display: grid;
    grid-template-columns: 60% 40%;
    grid-template-rows: 350px;
    gap: 6px;
    border-radius: var(--ftd-radius);
    overflow: hidden;
}

.ftd-tour-gallery__main {
    cursor: pointer;
    overflow: hidden;
    position: relative;
}

.ftd-tour-gallery__main .ftd-tour-gallery__img,
.ftd-tour-gallery__thumb .ftd-tour-gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.ftd-tour-gallery__main:hover .ftd-tour-gallery__img { transform: scale(1.03); }

.ftd-tour-gallery__side {
    display: grid;
    grid-template-rows: repeat(3, 1fr);
    gap: 6px;
    overflow: hidden;
}

.ftd-tour-gallery__thumb {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.ftd-tour-gallery__thumb:hover .ftd-tour-gallery__img { transform: scale(1.05); }

.ftd-tour-gallery__more-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ftd-white);
    font-size: 1.1rem;
    font-weight: 700;
}


/* ───────────────────────────────────────────────────────────
   4. TABS NAV
   ─────────────────────────────────────────────────────────── */
.ftd-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.22rem;
    border: 1px solid var(--ftd-border);
    margin: 1rem 0;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
    padding: 10px;
    border-radius: 20px;
}

.ftd-tab-btn {
    background: none;
    border: none;
    padding: 0.4rem;
    font-size: 12px;
    font-weight: 600;
    color: var(--ftd-text);
    cursor: pointer;
    transition: color 0.2s, background 0.2s;
    font-family: inherit;
    white-space: nowrap;
}

.ftd-tab-btn:hover {
    color: var(--ftd-blue);
    background: transparent;
}

.ftd-tab-btn.active {
    color: var(--ftd-white);
    background: var(--ftd-text);
    border-radius: 13px;
}

.ftd-tab-pane         { display: none; }
.ftd-tab-pane.active  { display: block; }


/* ───────────────────────────────────────────────────────────
   5. MAIN CONTENT — LEFT COLUMN
   ─────────────────────────────────────────────────────────── */

/* Hero image (single, non-gallery) */
.ftd-tour-single__image {
    border-radius: var(--ftd-radius);
    overflow: hidden;
    margin-bottom: 24px;
}

.ftd-tour-single__img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    display: block;
}

.ftd-tour-single__excerpt {
    font-size: 1rem;
    color: var(--ftd-text);
    line-height: 1.7;
    margin-bottom: 24px;
}

/* Rating bar */
.ftd-tour-rating-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap;
}

.ftd-tour-rating-bar__badge {
    background: var(--ftd-red);
    color: var(--ftd-white);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 4px;
}

.ftd-tour-rating-bar__stars {
    color: var(--ftd-accent);
    font-size: 1.1rem;
    letter-spacing: 2px;
}

.ftd-tour-rating-bar__score {
    font-weight: 700;
    font-size: 0.95rem;
    color: var(--ftd-text);
}

.ftd-tour-rating-bar__count {
    font-size: 0.9rem;
    color: var(--ftd-text-light);
}

/* Sections */
.ftd-section {
    border-top: 1px solid var(--ftd-border);
    padding-top: 28px;
    margin-top: 28px;
}

.ftd-section__title {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--ftd-text);
    margin-bottom: 16px;
}

.ftd-section--two-col {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 0 24px;
    align-items: start;
}

.ftd-section__title--left {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ftd-text);
    padding-top: 2px;
    margin-bottom: 0;
}

/* Highlights */
.ftd-highlights-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ftd-highlights-list__item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.93rem;
    color: var(--ftd-text);
    line-height: 1.5;
}

.ftd-highlights-list__icon {
    color: var(--ftd-primary);
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 2px;
}

/* Description — expandable */
.ftd-description-wrap { position: relative; }

.ftd-description-content {
    max-height: 160px;
    overflow: hidden;
    transition: max-height 0.4s ease;
    font-size: 0.95rem;
    line-height: 1.7;
    color: var(--ftd-text);
}

.ftd-description-content.is-expanded { max-height: 2000px; }

.ftd-see-more {
    background: none;
    border: none;
    color: var(--ftd-primary);
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    padding: 8px 0 0;
    display: block;
    text-decoration: underline;
}

/* About / activity list */
.ftd-about-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ftd-about-list__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 12px;
    border-bottom: 1px solid var(--ftd-border);
    font-size: 0.93rem;
    transition: background 0.2s ease, transform 0.2s ease;
    border-radius: var(--ftd-radius-sm);
}

.ftd-about-list__item:last-child { border-bottom: none; }

.ftd-about-list__item:hover {
    background: var(--ftd-bg);
    transform: translateX(4px);
}

.ftd-about-list__label {
    display: block;
    font-weight: 700;
    color: var(--ftd-text);
    font-size: 0.92rem;
    margin-bottom: 2px;
}

.ftd-about-list__text {
    display: block;
    font-size: 0.85rem;
    color: var(--ftd-text-light);
    line-height: 1.5;
}

/* Activity info grid */

.ftd-activity-info { 
    margin-top: 20px;
}

.ftd-activity-info__title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 24px;
    color: var(--ftd-text);
}

/* GRID - 2 equal columns */
.ftd-activity-info__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px 32px;
    margin-bottom: 16px;
}

/* LIST RESET */
.ftd-activity-info__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* ITEM - Proper alignment */

.ftd-activity-info__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 0;
}

/* ICON CONTAINER - Fully visible */
.ftd-activity-info__icon {
    width: 44px;
    height: 44px;
    min-width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1.5px solid var(--ftd-border, #e2e8f0);
    border-radius: var(--ftd-radius-sm, 12px);
    background: var(--ftd-white, #ffffff);
    flex-shrink: 0;
}

/* SVG inside icon - Full visibility */
.ftd-activity-info__icon svg {
    width: 22px;
    height: 22px;
    display: block;
    color: var(--ftd-red);
}

/* CONTENT ALIGNMENT */
.ftd-activity-info__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    flex: 1;
}

/* LABEL */
.ftd-activity-info__label {
    font-size: 15px;
    font-weight: 700;
    color: var(--ftd-text, #1e293b);
    line-height: 1.3;
}

/* TEXT - Fully visible with proper wrapping */
.ftd-activity-info__text {
    font-size: 13px;
    color: var(--ftd-text-light, #64748b);
    margin-top: 4px;
    line-height: 1.5;
    word-wrap: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

/* FULL WIDTH GROUP (Group 3) */
.ftd-activity-info__list--full {
    margin-top: 8px;
    padding-top: 8px;
}

/* Responsive - Mobile */
@media (max-width: 640px) {
    .ftd-activity-info__grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
    
    .ftd-activity-info__item {
        padding: 10px 0;
    }
    
    .ftd-activity-info__icon {
        width: 40px;
        height: 40px;
        min-width: 40px;
    }
    
    .ftd-activity-info__icon svg {
        width: 22px;
        height: 22px;
    }
}

/* Desktop fine-tuning */
@media (min-width: 768px) {
    .ftd-activity-info__grid {
        gap: 32px;
    }
}

/*====== Includes / Excludes ======*/


.ftd-inc-exc {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.ftd-inc-exc__heading {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--ftd-text);
}

.ftd-inc-exc__group-title {
    font-weight: 600;
    color: var(--ftd-text);
    margin: 10px 0 6px;
    font-size: 0.92rem;
}

.ftd-inc-exc__list {
    list-style: none;
    padding: 0;
    margin: 0 0 10px;
}

.ftd-inc-exc__list li {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 5px 0;
    font-size: 0.9rem;
    color: var(--ftd-text);
    line-height: 1.5;
}

.ftd-inc-exc__list--inc li::before {
    content: '•';
    color: var(--ftd-green);
    font-weight: 700;
    flex-shrink: 0;
}

.ftd-inc-exc__list--exc li::before {
    content: '•';
    color: var(--ftd-red);
    font-weight: 700;
    flex-shrink: 0;
}

/* Itinerary timeline */
.ftd-itinerary-timeline {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ftd-itinerary-timeline__item {
    display: flex;
    gap: 16px;
    position: relative;
    padding-bottom: 28px;
}

.ftd-itinerary-timeline__item:not(.ftd-itinerary-timeline__item--last)::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 26px;
    bottom: 0;
    width: 2px;
    border-left: 2px dashed var(--ftd-accent);
}

.ftd-itinerary-timeline__item--last { padding-bottom: 0; }

.ftd-itinerary-timeline__icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    margin-top: 2px;
    position: relative;
    z-index: 1;
}

.ftd-itinerary-timeline__content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding-top: 1px;
}

.ftd-itinerary-timeline__title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ftd-text);
    line-height: 1.3;
}

.ftd-itinerary-timeline__desc {
    font-size: 0.88rem;
    color: var(--ftd-text-light);
    line-height: 1.5;
}

/* Bullet list */
.ftd-bullet-list {
    list-style: disc;
    padding-left: 20px;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ftd-bullet-list li {
    font-size: 0.92rem;
    color: var(--ftd-text);
    line-height: 1.5;
}

/* Utility */
.ftd-hidden-item { display: none; }

.ftd-see-more-link {
    display: inline-block;
    margin-top: 8px;
    font-size: 0.88rem;
    color: var(--ftd-primary);
    text-decoration: underline;
    cursor: pointer;
}


/* ───────────────────────────────────────────────────────────
   6. BOOKING WIDGET — RIGHT COLUMN
   ─────────────────────────────────────────────────────────── */
.ftd-transport-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.ftd-transport-tab.ftd-transport-tab--active {
    border-color: var(--ftd-red-border);
    /*background: #eff6ff;*/
    background: #a37f481c;
    /*box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);*/
    box-shadow: 0 0 0 3px rgba(176, 141, 87, 0.15);
}

.ftd-transport-tab span {
    font-size: 16px;
    font-weight: 600;
    color: #1f2937;
}

.ftd-transport-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px 10px;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    background: white;
    cursor: pointer;
    transition: all 0.3s ease;
    text-align: center;
}


.ftd-booking-widget {
    background: var(--ftd-white);
    border: 1px solid var(--ftd-border);
    border-radius: var(--ftd-radius);
    box-shadow: var(--ftd-shadow);
    overflow: hidden;
    position: sticky;
    top: 100px;
    align-self: start;
    font-size: 14px;
    line-height: 1.5;
}

.ftd-booking-widget * { box-sizing: border-box; max-width: 100%; }

.ftd-booking-widget button,
.ftd-booking-widget a {
    font-family: inherit;
    box-shadow: none;
    /*color: var(--ftd-text);*/
}

.ftd-booking-widget svg { max-width: 100%; height: auto; }

/* Price header */
.ftd-widget__price-header {
    background: var(--ftd-bg);
    padding: 20px 22px 16px;
    border-bottom: 1px solid var(--ftd-border);
    position: relative;
}

.ftd-widget__badge {
    display: inline-block;
    background: var(--ftd-red-lt);
    color: var(--ftd-text-light);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 20px;
    margin-bottom: 8px;
    border: 1px solid var(--ftd-red-border);
}

.ftd-widget__price-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
    flex-wrap: nowrap;
}

.ftd-widget__from {
    font-size: 0.85rem;
    color: var(--ftd-text-light);
}

/* Price — no-break */
.ftd-widget__price,
.ftd-widget__price .woocommerce-Price-amount {
    display: inline-flex !important;
    align-items: baseline;
    gap: 2px;
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
    word-break: keep-all !important;
}

.ftd-widget__price .woocommerce-Price-amount {
    color: var(--ftd-text);
    font-size: inherit;
    font-weight: inherit;
}

.ftd-widget__price .woocommerce-Price-currencySymbol {
    display: inline !important;
    margin-right: 2px;
}

.ftd-widget__price-row * {
    white-space: nowrap !important;
    word-break: keep-all !important;
}

.ftd-widget__regular-price {
    font-size: 0.95rem;
    color: var(--ftd-text-light);
}

.ftd-widget__regular-price .woocommerce-Price-amount { color: inherit; }

.ftd-widget__price-label {
    font-size: 0.82rem;
    color: var(--ftd-text-light);
}

/* Step progress indicator */
.ftd-widget__steps-indicator {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 24px 0;
    position: relative;
    padding: 0 20px;
}

.ftd-widget__steps-indicator::before {
    content: '';
    position: absolute;
    top: 20px;
    left: 60px;
    right: 60px;
    height: 2px;
    background: var(--ftd-border);
    z-index: 0;
}

.ftd-step-indicator {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    position: relative;
    z-index: 1;
}

.ftd-step-indicator__number {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--ftd-bg-subtle);
    color: var(--ftd-text-xlight);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 16px;
    transition: background 0.3s ease, color 0.3s ease;
}

.ftd-step-indicator.active .ftd-step-indicator__number,
.ftd-step-indicator.completed .ftd-step-indicator__number {
    background: var(--ftd-blue);
    color: var(--ftd-white);
}

.ftd-step-indicator__label {
    font-size: 12px;
    color: var(--ftd-text-light);
    font-weight: 500;
    transition: color 0.3s ease;
}

.ftd-step-indicator.active .ftd-step-indicator__label { color: var(--ftd-text); }

/* Step panes */
@keyframes ftd-fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.ftd-widget__step { display: none; animation: ftd-fadeIn 0.3s ease; }

.ftd-widget__step--active {
    display: block;
    padding: 0 22px 16px;
}

.ftd-widget__step-title {
    font-size: 20px;
    font-weight: 600;
    color: var(--ftd-text);
    margin: 0 0 20px;
}

/* ── FAQ Accordion ──────────────────────────────────────── */
.ftd-faq-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}


.ftd-faq-item:last-child {
    margin-bottom: 0;
}

/* QUESTION */

.ftd-faq-item__question {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    width: 100%;
    padding: 14px 20px;
    background: var(--ftd-text);
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--ftd-white);
    transition:.3s cubic-bezier(0.4, 0, 0.2, 1);
    line-height: 1.4;
    margin: 0;
}


/* ICON */
.ftd-faq-item__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.ftd-faq-item.is-active .ftd-faq-item__icon {
    transform: rotate(45deg);
}

/* ANSWER */
.ftd-faq-item__answer {
    max-height: 0;
    background: #f0f4ff;
    padding: 0px 20px 0px;
    border-radius: 0 0 8px 8px;
    /*border: 1px solid rgba(26, 86, 196, .12);*/
    display: grid;
    border-top: none;
    grid-template-rows: 0fr;
    transition: grid-template-rows .3s ease, padding .3s ease;
    overflow: hidden;
}

.ftd-faq-item__question[aria-expanded="true"]
 {
    background: var(--ftd-text);
    border-radius: 8px 8px 0 0;
}

.ftd-faq-item.is-active .ftd-faq-item__answer {
    padding: 10px 20px 16px;
    border: 1px solid rgba(26, 86, 196, .12);
}

/* REMOVE THEME GAP ISSUES */
#tab-faq.ftd-tab-pane,
.ftd-faq {
    margin: 0;
    padding: 0;
}

/* Transport info box */
.ftd-transport-info {
    background: var(--ftd-bg);
    border: 1px solid var(--ftd-border);
    border-radius: var(--ftd-radius-sm);
    padding: 16px;
    margin-bottom: 24px;
}

.ftd-transport-info__text {
    margin: 0;
    font-size: 12px;
    color: var(--ftd-text-light);
    line-height: 1.6;
}

/* Instant upgrades */
.ftd-instant-upgrades {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.ftd-instant-upgrades .ftd-upgrade-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 16px;
    border: 2px solid var(--ftd-border);
    border-radius: 12px;
    background: var(--ftd-white);
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.ftd-upgrade-item:hover {
    /*border-color: var(--ftd-text-medium);*/
    border-color: var(--ftd-red);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.ftd-upgrade-item__icon {
    width: 40px;
    height: 40px;
    display: flex;
    font-size: 20px !important;
    align-items: center;
    justify-content: center;
    background: var(--ftd-bg-subtle);
    border-radius: 50%;
    color: var(--ftd-text-light);
}

.ftd-upgrade-item__icon svg { width: 28px; height: 28px; }
.ftd-upgrade-item__price    { font-size: 14px; font-weight: 700; color: var(--ftd-blue); }
.ftd-upgrade-item__name     { font-size: 11px; font-weight: 500; color: var(--ftd-text); text-align: center; }
.ftd-upgrade-item__counter  { display: flex; align-items: center; gap: 12px; margin-top: 4px; }

/* Form fields */
.ftd-widget__field { margin-bottom: 20px; }

.ftd-widget__label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--ftd-text-medium);
    margin-bottom: 8px;
}

/* Date input */
.ftd-widget__date-input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--ftd-border);
    border-radius: var(--ftd-radius-sm);
    font-size: 0.9rem;
    color: var(--ftd-text);
    background: var(--ftd-white);
    cursor: pointer;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    font-family: inherit;
}

.ftd-widget__date-input:focus {
    border-color: var(--ftd-primary);
    box-shadow: 0 0 0 3px var(--ftd-blue-ring);
}

.ftd-widget__date-note {
    margin: 8px 0 0;
    font-size: 0.8rem;
    color: var(--ftd-success);
    min-height: 16px;
}

/* Passenger rows */
.ftd-widget__passengers {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.ftd-passenger-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--ftd-bg);
    border: 1px solid var(--ftd-border);
    border-radius: var(--ftd-radius-sm);
}

.ftd-passenger-row__info  { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ftd-passenger-row__type  { font-size: 14px; font-weight: 600; color: var(--ftd-text); }
.ftd-passenger-row__age   { font-size: 12px; color: var(--ftd-text-light); }
.ftd-passenger-row__counter { display: flex; align-items: center; gap: 10px; }

/* Counter button (shared — passengers & upgrades) */
.ftd-counter__btn {
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid var(--ftd-border);
    background: var(--ftd-white);
    font-size: 16px;
    line-height: 1;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.ftd-counter__btn:hover {
    background: var(--ftd-red);
    color: var(--ftd-white);
    border-color: var(--ftd-red-border);
}

.ftd-counter__btn:disabled { opacity: 0.4; cursor: not-allowed; }

.ftd-counter__val {
    min-width: 20px;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    color: var(--ftd-text);
}

/* Time slots */
.ftd-slots {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 8px;
}

.ftd-slot-pill {
    padding: 6px 14px;
    border: 1px solid var(--ftd-primary);
    border-radius: 20px;
    font-size: 0.85rem;
    color: var(--ftd-primary);
    cursor: pointer;
    background: var(--ftd-white);
    transition: background 0.2s, color 0.2s;
}

.ftd-slot-pill:hover,
.ftd-slot-pill.is-selected {
    background: var(--ftd-primary);
    color: var(--ftd-white);
}

.ftd-slot-btn {
    padding: 10px 16px;
    background: var(--ftd-white);
    border: 2px solid var(--ftd-border);
    border-radius: var(--ftd-radius-sm);
    font-size: 14px;
    color: var(--ftd-text-medium);
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
    text-align: center;
}

.ftd-slot-btn:hover    { border-color: var(--ftd-blue); background: var(--ftd-blue-lt); }
.ftd-slot-btn.selected { background: var(--ftd-blue); color: var(--ftd-white); border-color: var(--ftd-blue); }

/* Step nav buttons */
.ftd-widget__step-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
}

.ftd-widget__btn-back,
.ftd-widget__btn-next {
    flex: 1;
    padding: 10px 24px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
    border: none;
}

.ftd-widget__btn-back { background: var(--ftd-bg-subtle); color: var(--ftd-text-medium); }
.ftd-widget__btn-back:hover { background: var(--ftd-border); }

.ftd-widget__btn-next { background: var(--ftd-text); color: var(--ftd-white); }
.ftd-widget__btn-next:hover { background: var(--ftd-red); }

/* ═══════════════════════════════════════════════════════════
   VEHICLE CARDS - MATCH SELECT TRANSPORT DESIGN
   Replaces old .ftd-seat-type-tabs styles
   ═══════════════════════════════════════════════════════════ */

.ftd-seat-type-tabs{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.ftd-seat-tab{
    position:relative;
    flex:1;
    background:#fff;
    border:1px solid #e6e6e6;
    border-radius:12px;
    padding:10px 10px;
    text-align:center;

    display:flex;
    flex-direction:column;
    align-items:center;

    transition:all .3s ease;
}

.ftd-seat-tab.active,
.ftd-seat-tab--active{
    border:2px solid #c89b4b;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.ftd-seat-tab__badge{
    position: absolute;
    top: 5px;
    left: 5px;
    background: #c89b4b;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    padding: 6px 10px;
    border-radius: 30px;
    text-transform: uppercase;
}

.ftd-seat-tab svg{
    width: 38px;
    height: 35px;
    color: var(--ftd-red);
    margin-bottom: 3px;
    border: 1px solid var(--ftd-red-border);
    background: var(--ftd-red-lt);
    border-radius: 50%;
    padding: 6px;
}


.ftd-seat-tab > span:not(.ftd-seat-tab__badge){
    font-size:13px;
    font-weight:700;
    color:#1f2937;
    margin-bottom:8px;
}

.ftd-seat-tab__price{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
}

.ftd-seat-tab__regular{
    color:#999;
    font-size:15;
}

.ftd-seat-tab__sale{
    color:#111827;
    font-size:18px;
    font-weight:800;
    font-style:normal;
}

.ftd-seat-tab small{
    display:block;
    width:100%;
    margin-top:10px;
    padding-top:10px;

    border-top:1px solid #ececec;

    color:#6b7280;
    font-size:12px;
}

.ftd-seat-tab::after{
    content:"";
    width:8px;
    height:8px;
    background:#c89b4b;
    transform:rotate(45deg);

    position:absolute;
    bottom:33px;
    left:50%;
    margin-left:-4px;
}


/* Active state - matches "Self Arrival" blue style */
.ftd-seat-tab.ftd-seat-tab--active {
    background: var(--ftd-red-lt);
    border-color: var(--ftd-blue);
    box-shadow: 0 0 0 1px var(--ftd-blue);
}

.ftd-seat-tab.ftd-seat-tab--active svg {
    color: var(--ftd-red);
}

.ftd-seat-tab.ftd-seat-tab--active span,
.ftd-seat-tab.ftd-seat-tab--active em {
    color: var(--ftd-text);
}

.ftd-seat-tab.ftd-seat-tab--active small {
    color: var(--ftd-text-light);
}

/* Vehicle counter row - match card aesthetic */
.ftd-vehicle-counter-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: var(--ftd-bg);
    border: 1px solid var(--ftd-border);
    border-radius: 12px;
    margin-bottom: 16px;
}

.ftd-vehicle-counter-row .ftd-passenger-row__type {
    font-weight: 600;
    color: var(--ftd-text);
    font-size: 15px;
}

.ftd-vehicle-counter-row .ftd-passenger-row__age {
    display: block;
    font-size: 13px;
    color: var(--ftd-text-light);
    margin-top: 2px;
}

/* Mobile: stack cards vertically */
@media (max-width: 640px) {
    .ftd-seat-type-tabs {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .ftd-seat-tab {
        padding: 16px;
    }
}

}







/* Widget CTA buttons */
.ftd-widget__actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 18px;
}

.ftd-widget__btn-book {
    flex: 1;
    padding: 10px 25px;
    white-space: nowrap;
    background: var(--ftd-text);
    color: var(--ftd-white);
    font-size: 0.82rem;
    font-weight: 700;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
    text-align: center;
}

.ftd-widget__btn-book:hover {
    background: var(--ftd-red);
    transform: translateY(-1px);
}

.ftd-widget__btn-whatsapp {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 10px 8px;
    white-space: nowrap;
    background: var(--ftd-whatsapp);
    color: var(--ftd-white);
    font-size: 0.82rem;
    font-weight: 700;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}

.ftd-widget__btn-whatsapp:hover {
    background: var(--ftd-whatsapp-dk);
    transform: translateY(-1px);
}

.ftd-widget__btn-whatsapp--bottom {
    display: block;
    width: 100%;
    margin-top: 12px;
    padding: 10px 24px;
    background: var(--ftd-whatsapp);
    color: var(--ftd-white);
    text-decoration: none;
    border-radius: var(--ftd-radius-sm);
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    transition: background 0.3s ease, transform 0.3s ease;
}

.ftd-widget__btn-whatsapp--bottom:hover {
    background: var(--ftd-whatsapp-dk);
    transform: translateY(-1px);
}

.ftd-widget__btn-whatsapp--bottom svg { vertical-align: middle; margin-right: 6px; }

/* Price breakdown */
.ftd-widget__breakdown {
    background: var(--ftd-bg);
    border: 1px solid var(--ftd-border);
    border-radius: 12px;
    padding: 20px;
    margin-top: 24px;
}

.ftd-breakdown__title {
    font-size: 16px;
    font-weight: 600;
    color: var(--ftd-text);
    margin: 0 0 16px;
}

.ftd-breakdown__rows {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--ftd-border);
}

.ftd-breakdown__row {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    color: var(--ftd-text-light);
    padding: 4px 0;
}

.ftd-breakdown__row--highlight { color: var(--ftd-blue); font-weight: 500; }

.ftd-breakdown__total {
    display: flex;
    justify-content: space-between;
    font-size: 1rem;
    font-weight: 800;
    color: var(--ftd-white);
    background: var(--ftd-primary-dk);
    padding: 12px 14px;
    border-radius: 6px;
    margin-top: 10px;
}

.ftd-breakdown__note {
    margin: 12px 0 0;
    font-size: 0.78rem;
    color: var(--ftd-text-light);
    text-align: center;
}

/* Empty states */
.ftd-widget__no-dates {
    padding: 20px 22px;
    text-align: center;
    color: var(--ftd-text-light);
}

.ftd-widget__no-upgrades {
    text-align: center;
    padding: 40px 20px;
    color: var(--ftd-text-light);
    font-size: 14px;
}


/* ───────────────────────────────────────────────────────────
   7. REVIEWS SLIDER
   ─────────────────────────────────────────────────────────── */
.ftd-reviews-section {
    border-top: 1px solid var(--ftd-border);
    padding-top: 28px;
    margin-top: 28px;
}

.ftd-reviews-outer {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.ftd-reviews-viewport { flex: 1; overflow: hidden; min-width: 0; }

.ftd-reviews-track {
    display: flex;
    gap: 16px;
    transition: transform 0.4s ease;
}

.ftd-review-card {
    flex: 0 0 calc(50% - 8px);
    min-width: calc(50% - 8px);
    max-width: calc(50% - 8px);
    border: 1px solid var(--ftd-border);
    border-radius: var(--ftd-radius);
    padding: 16px;
    background: var(--ftd-white);
    box-sizing: border-box;
}

/* Slider nav buttons */
.ftd-rev-btn {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--ftd-border);
    background: var(--ftd-white);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ftd-text);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.ftd-rev-btn:hover {
    background: var(--ftd-primary);
    color: var(--ftd-white);
    border-color: var(--ftd-primary);
}

/* Review card */
.ftd-review-card__stars { display: flex; gap: 2px; margin-bottom: 10px; }
.ftd-review-card__star  { font-size: 1rem; color: var(--ftd-border); }
.ftd-review-card__star--filled { color: var(--ftd-accent); }

.ftd-review-card__meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.ftd-review-card__avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ftd-white);
    font-weight: 700;
    font-size: 0.95rem;
    flex-shrink: 0;
    background-color: var(--ftd-av-orange);
}

/* Avatar colour variants — driven by data-color attribute */
.ftd-review-card__avatar[data-color="#e67e22"] { background-color: var(--ftd-av-orange);  }
.ftd-review-card__avatar[data-color="#2980b9"] { background-color: var(--ftd-av-blue);    }
.ftd-review-card__avatar[data-color="#27ae60"] { background-color: var(--ftd-av-green);   }
.ftd-review-card__avatar[data-color="#8e44ad"] { background-color: var(--ftd-av-purple);  }
.ftd-review-card__avatar[data-color="#c0392b"] { background-color: var(--ftd-av-red);     }
.ftd-review-card__avatar[data-color="#16a085"] { background-color: var(--ftd-av-teal);    }

.ftd-review-card__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ftd-review-card__name    { font-size: 0.88rem; font-weight: 600; color: var(--ftd-text); }
.ftd-review-card__country { font-weight: 400; color: var(--ftd-text-light); }
.ftd-review-card__date    { font-size: 0.78rem; color: var(--ftd-text-light); }

.ftd-review-card__text {
    font-size: 0.85rem;
    color: var(--ftd-text);
    line-height: 1.5;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ftd-reviews-links { display: flex; justify-content: flex-end; gap: 20px; margin-top: 8px; }

.ftd-reviews-links__link {
    font-size: 0.85rem;
    color: var(--ftd-text);
    text-decoration: underline;
}

.ftd-reviews-links__link:hover { color: var(--ftd-primary); }


/* ───────────────────────────────────────────────────────────
   8. LIGHTBOX
   ─────────────────────────────────────────────────────────── */
.ftd-lightbox {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
}

.ftd-lightbox.is-open { display: flex; }

.ftd-lightbox__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.92);
    cursor: pointer;
}

.ftd-lightbox__box {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ftd-lightbox__img-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90vw;
    height: 85vh;
}

.ftd-lightbox__img {
    width: 90vw;
    height: 85vh;
    object-fit: contain;
    display: block;
    border-radius: 4px;
}

.ftd-lightbox__close {
    position: fixed;
    top: 20px;
    right: 24px;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: var(--ftd-white);
    font-size: 1.2rem;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ftd-lightbox__close:hover { background: rgba(255, 255, 255, 0.4); }

.ftd-lightbox__prev,
.ftd-lightbox__next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.2);
    border: none;
    color: var(--ftd-white);
    font-size: 2.5rem;
    line-height: 1;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ftd-lightbox__prev { left: 20px; }
.ftd-lightbox__next { right: 20px; }

.ftd-lightbox__counter {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.9rem;
    z-index: 2;
    background: rgba(0, 0, 0, 0.4);
    padding: 4px 14px;
    border-radius: 20px;
}


/* ───────────────────────────────────────────────────────────
   9. MODALS (Review & All-Reviews)
   ─────────────────────────────────────────────────────────── */

/* Shared modal base */
.ftd-review-modal,
.ftd-all-reviews-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 99998;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
}

.ftd-review-modal.is-open,
.ftd-all-reviews-modal.is-open { display: flex; }

.ftd-review-modal__overlay,
.ftd-all-reviews-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    cursor: pointer;
}

.ftd-review-modal__box,
.ftd-all-reviews-box {
    position: relative;
    z-index: 1;
    background: var(--ftd-white);
    border-radius: var(--ftd-radius);
    padding: 28px;
    width: 100%;
    max-width: 520px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}

.ftd-all-reviews-box { max-width: 620px; }

.ftd-review-modal__close {
    position: absolute;
    top: 14px;
    right: 16px;
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: var(--ftd-text-light);
    line-height: 1;
}

.ftd-review-modal__close:hover { color: var(--ftd-text); }
.ftd-review-modal__title { font-size: 1.2rem; font-weight: 700; margin-bottom: 6px; }
.ftd-review-modal__note  { font-size: 0.82rem; color: var(--ftd-text-light); margin-bottom: 20px; }

/* Review form */
.ftd-review-form__field { margin-bottom: 16px; }

.ftd-review-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.ftd-review-form__label {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    margin-bottom: 6px;
}

.ftd-review-form__input,
.ftd-review-form__textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid var(--ftd-border);
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.2s ease;
}

.ftd-review-form__input:focus,
.ftd-review-form__textarea:focus { border-color: var(--ftd-primary); }

.ftd-star-rating { display: flex; gap: 6px; margin-top: 4px; }

.ftd-star {
    font-size: 1.8rem;
    color: var(--ftd-border);
    cursor: pointer;
    transition: color 0.15s ease;
    line-height: 1;
}

.ftd-star.is-active,
.ftd-star.is-hover { color: var(--ftd-accent); }

.ftd-review-form__msg { font-size: 0.88rem; margin-bottom: 12px; min-height: 20px; }
.ftd-review-form__msg.is-success { color: var(--ftd-green); }
.ftd-review-form__msg.is-error   { color: var(--ftd-red); }

.ftd-review-form__submit {
    background: var(--ftd-primary);
    color: var(--ftd-white);
    border: none;
    padding: 10px 24px;
    border-radius: 6px;
    font-size: 0.95rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}

.ftd-review-form__submit:hover    { background: var(--ftd-primary-dk); }
.ftd-review-form__submit:disabled { opacity: 0.6; cursor: not-allowed; }

/* All-reviews modal content */
.ftd-all-reviews__summary {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    margin-bottom: 24px;
    font-size: 1rem;
}

.ftd-all-reviews__stars { font-size: 1.3rem; }
.ftd-all-reviews__avg   { font-weight: 700; color: var(--ftd-text); }
.ftd-all-reviews__count { color: var(--ftd-text-light); font-size: 0.9rem; }

.ftd-all-reviews__list { display: flex; flex-direction: column; gap: 0; }

.ftd-all-reviews__item {
    padding: 20px 0;
    border-bottom: 1px solid var(--ftd-border);
}

.ftd-all-reviews__item:last-child { border-bottom: none; }

.ftd-all-reviews__meta {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.ftd-all-reviews__name     { font-weight: 600; font-size: 0.95rem; color: var(--ftd-text); }
.ftd-all-reviews__date     { font-size: 0.8rem; color: var(--ftd-text-light); margin-top: 2px; }
.ftd-all-reviews__verified { color: var(--ftd-green); font-weight: 600; }
.ftd-all-reviews__item-stars { font-size: 1rem; margin-bottom: 8px; }
.ftd-all-reviews__text     { font-size: 0.9rem; line-height: 1.6; color: var(--ftd-text); margin: 0; }


/* ═══════════════════════════════════════════════
   FIX: Force WooCommerce price styles (theme-safe)
   ═══════════════════════════════════════════════ */

.ftd-booking-widget .ftd-widget__price-row {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
}

/* FORCE main price */
.ftd-booking-widget .ftd-widget__price,
.ftd-booking-widget .ftd-widget__price ins,
.ftd-booking-widget .ftd-widget__price .woocommerce-Price-amount {
    font-size: 28px !important;
    font-weight: 800 !important;
    color: var(--ftd-text) !important;
    text-decoration: none !important;
}

/* FORCE old price */
.ftd-booking-widget .ftd-widget__regular-price,
.ftd-booking-widget .ftd-widget__regular-price del,
.ftd-booking-widget .ftd-widget__regular-price .woocommerce-Price-amount {
    font-size: 16px !important;
    color: var(--ftd-text-light) !important;
    text-decoration: line-through !important;
    opacity: 0.8;
}

/* Remove weird theme styles */
.ftd-booking-widget del {
    opacity: 1 !important;
}

.ftd-booking-widget ins {
    background: none !important;
    padding: 0 !important;
}

/* Fix "From" alignment */
.ftd-widget__from {
    font-size: 14px !important;
    color: var(--ftd-text-light) !important;
}

/* Ensure inline layout */
.ftd-booking-widget .price {
    display: inline-flex !important;
    align-items: baseline;
    gap: 6px;
}

/* ═══════════════════════════════════════════════════════════
   10. RESPONSIVE — CONSOLIDATED MEDIA QUERIES
   ═══════════════════════════════════════════════════════════ */

/* ── Tablet  ≤ 1024px ─────────────────────────────────────── */
@media (max-width: 1024px) {
    .ftd-tour-single__inner {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .ftd-tour-single__sidebar {
        width: 100%;
        max-width: 680px;
        margin: 0 auto;
        order: -1;
    }

    .ftd-booking-widget { position: static; }

    .ftd-tour-single__main { width: 100%; }

    .ftd-tour-gallery__side {
        grid-template-rows: unset;
        grid-template-columns: 1fr;
        max-width: 140px;
    }

    .ftd-activity-info__grid { grid-template-columns: 1fr; }
}

/* ── Large mobile  ≤ 768px ───────────────────────────────── */
@media (max-width: 768px) {
    .ftd-tour-single__title {
        font-size: clamp(1.2rem, 5vw, 1.6rem);
        line-height: 1.3;
        margin-bottom: 8px;
    }

    .ftd-tour-single__sidebar { max-width: 100%; }

    /* Gallery — stacked */
    .ftd-tour-gallery__grid {
        display: flex;
        flex-direction: column;
        gap: 8px;
        height: auto;
        border-radius: var(--ftd-radius);
        overflow: visible;
    }

    .ftd-tour-gallery__main {
        width: 100%;
        height: auto;
        border-radius: var(--ftd-radius);
        overflow: hidden;
    }

    .ftd-tour-gallery__main .ftd-tour-gallery__img {
        height: 240px;
        border-radius: var(--ftd-radius);
    }

    .ftd-tour-gallery__side {
        max-width: 100%;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 90px;
        gap: 6px;
        overflow: visible;
    }

    .ftd-tour-gallery__thumb .ftd-tour-gallery__img { border-radius: 6px; }

    .ftd-tour-gallery__more-overlay {
        border-radius: 6px;
        font-size: 0.85rem;
    }

    /* Tabs — horizontal scroll */
    .ftd-tabs-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        border-radius: 12px;
        gap: 4px;
        padding: 8px;
    }

    .ftd-tabs-nav::-webkit-scrollbar { display: none; }

    .ftd-tab-btn {
        flex: 0 0 auto;
        padding: 7px 12px;
        font-size: 0.8rem;
    }

    /* Activity grid */
    .ftd-activity-info__grid { grid-template-columns: 1fr; gap: 0; }

    .ftd-activity-info__list { padding-left: 0; margin: 0; }

    .ftd-activity-info__item {
        padding: 10px 0;
        border-bottom: 1px solid var(--ftd-border);
    }

    .ftd-activity-info__item:last-child { border-bottom: none; }

    /* Stacked grids */
    .ftd-inc-exc          { grid-template-columns: 1fr; }
    .ftd-section--two-col { grid-template-columns: 1fr; }
    .ftd-section__title--left { margin-bottom: 8px; }
    .ftd-instant-upgrades { grid-template-columns: 1fr; }

    /* Reviews */
    .ftd-review-card {
        flex: 0 0 100%;
        min-width: 100%;
        max-width: 100%;
    }

    .ftd-review-card__text { -webkit-line-clamp: 3; }

    .ftd-reviews-links { justify-content: flex-start; }

    /* Lightbox */
    .ftd-lightbox__img-wrap { width: 100vw; height: 80vh; }

    .ftd-lightbox__img {
        width: 100vw;
        max-width: 100%;
        height: 80vh;
        border-radius: 0;
    }

    .ftd-lightbox__prev { left: 8px;  font-size: 2rem; width: 40px; height: 40px; }
    .ftd-lightbox__next { right: 8px; font-size: 2rem; width: 40px; height: 40px; }

    /* Modals — bottom sheet */
    .ftd-review-modal__box,
    .ftd-all-reviews-box {
        width: 100%;
        max-width: 100%;
        max-height: 90vh;
        overflow-y: auto;
        border-radius: 12px 12px 0 0;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0;
    }

    .ftd-review-form__row    { grid-template-columns: 1fr; }
    .ftd-review-form__input,
    .ftd-review-form__textarea { font-size: 1rem; }

    .ftd-widget__actions { grid-template-columns: 1fr 1fr; }
}

/* ── Small mobile  ≤ 480px ───────────────────────────────── */

@media (max-width: 480px) {
    .ftd-container            { padding-inline: 12px; }
    .ftd-tour-single__title   { font-size: 1.15rem; }

    .ftd-tour-rating-bar__badge { font-size: 0.75rem; padding: 2px 8px; }

    .ftd-tour-gallery__main .ftd-tour-gallery__img { height: 210px; }
    .ftd-tour-gallery__side  { grid-template-columns: repeat(2, 1fr); }

    .ftd-tab-btn { padding: 6px 10px; font-size: 0.75rem; }

    /* Reviews — native scroll carousel */
    .ftd-rev-btn { display: none; }
    .ftd-reviews-outer { gap: 0; }

    .ftd-reviews-viewport {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        -ms-overflow-style: none;
        scroll-snap-type: x mandatory;
    }

    .ftd-reviews-viewport::-webkit-scrollbar { display: none; }
    .ftd-reviews-track { gap: 12px; }

    .ftd-review-card {
        min-width: 88vw;
        flex: 0 0 88vw;
        max-width: 88vw;
        scroll-snap-align: start;
        padding: 14px;
    }

    .ftd-review-card__avatar { width: 32px; height: 32px; font-size: 0.85rem; }
    .ftd-review-card__meta   { gap: 8px; }

    .ftd-reviews-links {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }

    .ftd-highlights-list__item { font-size: 0.9rem; padding: 4px 0; }

    .ftd-widget__actions { grid-template-columns: 1fr; }

    .ftd-review-form__submit { width: 100%; padding: 14px; font-size: 1rem; }
    .ftd-star                { font-size: 1.8rem; padding: 4px; }
    .ftd-review-modal__box   { padding: 20px 16px; }

    .ftd-all-reviews__summary { flex-wrap: wrap; }
    .ftd-itinerary-timeline__item { padding-left: 0; }

    .ftd-lightbox__prev { left: 4px; }
    .ftd-lightbox__next { right: 4px; }
}


/* ═══════════════════════════════════════════════════════════
   EXPLORE ACTIVITIES — HORIZONTAL SCROLL
   (Safe: no conflict with existing FTD styles)
   ═══════════════════════════════════════════════════════════ */

/* Wrapper */
.ftd-activities-scroll {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 10px 4px 20px;
    scroll-behavior: smooth;

    /* Hide scrollbar */
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.ftd-activities-scroll::-webkit-scrollbar {
    display: none;
}

/* Item */
.ftd-activity-cat {
    flex: 0 0 auto;
    width: 110px;
    text-align: center;
    cursor: pointer;
}

/* Circle image */
.ftd-activity-cat__img-wrap {
    width: 88px;
    height: 88px;
    margin: 0 auto 8px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid var(--ftd-border);
    transition: transform 0.3s ease, border-color 0.3s ease;
}

.ftd-activity-cat__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Hover effect */
.ftd-activity-cat:hover .ftd-activity-cat__img-wrap {
    transform: scale(1.05);
    border-color: var(--ftd-primary);
}

/* Title */
.ftd-activity-cat__title {
    font-size: 13px;
    font-weight: 600;
    color: var(--ftd-text);
    line-height: 1.3;
}

/* Subtitle */
.ftd-activity-cat__sub {
    font-size: 11px;
    color: var(--ftd-text-light);
}

/* Optional: snap scrolling (nice UX) */
.ftd-activities-scroll {
    scroll-snap-type: x mandatory;
}

.ftd-activity-cat {
    scroll-snap-align: start;
}

/* Optional fade edges (premium look) */
.ftd-activities-fade {
    position: relative;
}

.ftd-activities-fade::before,
.ftd-activities-fade::after {
    content: '';
    position: absolute;
    top: 0;
    width: 40px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
}

.ftd-activities-fade::before {
    left: 0;
    background: linear-gradient(to right, #fff, transparent);
}

.ftd-activities-fade::after {
    right: 0;
    background: linear-gradient(to left, #fff, transparent);
}

/*for disabling the tour*/
.ftd-seat-tab.is-disabled {
    opacity: 0.4;
    pointer-events: none;
    cursor: not-allowed;
    display: none; /* or just grey it out if you prefer */
}


/*================= Page Class-ftd-tour-dates css======================= */

    .ftd-meta-grid { display:flex; gap:16px; flex-wrap:wrap; margin-top:12px; }
    .ftd-meta-grid > div { flex:1; min-width:140px; }
    .ftd-meta-grid label { display:block; font-weight:600; font-size:12px; margin-bottom:4px; color:#444; }
    .ftd-meta-grid input[type=number], .ftd-meta-grid input[type=text], .ftd-meta-grid select { width:100%; }
    .ftd-panel { display:none; }
    .ftd-panel.is-active { display:block; }
    .ftd-meta-notice { background:#f0f6ff; border-left:4px solid #2271b1; padding:8px 12px; font-size:12px; color:#1d4870; margin:10px 0 14px; border-radius:0 4px 4px 0; line-height:1.6; }
    .ftd-price-table { width:100%; border-collapse:collapse; margin-top:8px; }
    .ftd-price-table th { padding:8px 10px; text-align:left; font-size:12px; font-weight:600; color:#555; border:1px solid #e2e4e7; background:#f6f7f7; }
    .ftd-price-table td { padding:8px 10px; border:1px solid #e2e4e7; vertical-align:middle; }
    .ftd-price-table input[type=number] { width:100%; }
    .ftd-date-discount-row { border:1px solid #ddd; border-radius:4px; padding:14px 14px 10px; margin-bottom:10px; background:#fafafa; }
    .ftd-date-discount-row .ftd-ddr-grid { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
    .ftd-date-discount-row .ftd-ddr-grid > div { flex:1; min-width:120px; }
    .ftd-date-discount-row label { display:block; font-weight:600; font-size:11px; color:#555; margin-bottom:4px; text-transform:uppercase; letter-spacing:.3px; }
    .ftd-date-discount-row input[type=date], .ftd-date-discount-row input[type=number] { width:100%; padding:6px 8px; font-size:13px; border:1px solid #8c8f94; border-radius:3px; }
    .ftd-ddr-remove { background:none; border:1px solid #cc1818; color:#cc1818; padding:5px 12px; border-radius:3px; cursor:pointer; font-size:12px; font-weight:600; white-space:nowrap; align-self:flex-end; transition:background .15s,color .15s; }
    .ftd-ddr-remove:hover { background:#cc1818; color:#fff; }
    #ftd-add-date-discount { display:inline-flex; align-items:center; gap:6px; margin-top:4px; padding:7px 16px; background:#fff; border:1px solid #2271b1; color:#2271b1; border-radius:3px; font-size:12px; font-weight:600; cursor:pointer; transition:background .15s,color .15s; }
    #ftd-add-date-discount:hover { background:#2271b1; color:#fff; }
    .ftd-ddr-hint { font-size:11px; color:#777; margin:8px 0 0; }


    /* Section container */
    .ftd-section-container {
        margin-bottom: 28px;
    }
    
    /* Section heading */
    .ftd-section-heading {
        margin: 0 0 6px;
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 0.4px;
        color: #333;
        border-bottom: 2px solid #eee;
        padding-bottom: 6px;
    }
    
    /* Meta grid layout */
    .ftd-meta-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 16px;
        margin-top: 10px;
    }
    .ftd-meta-grid > div {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }
    .ftd-meta-grid label {
        font-weight: 600;
        font-size: 12px;
        color: #444;
    }
    .ftd-meta-grid input,
    .ftd-meta-grid select {
        width: 100%;
        padding: 6px 10px;
        font-size: 13px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    
    /* Notice box */
    .ftd-meta-notice {
        background: #fafaf5;
        border-left: 4px solid #ffba00;
        padding: 10px 14px;
        margin: 10px 0 15px;
        font-size: 12px;
        color: #555;
        border-radius: 3px;
    }
    
    /* Price table */
    .ftd-price-table {
        width: 100%;
        border-collapse: collapse;
        margin: 10px 0;
    }
    .ftd-price-table th,
    .ftd-price-table td {
        padding: 10px 8px;
        text-align: left;
        border-bottom: 1px solid #eee;
    }
    .ftd-price-table th {
        background: #f9f9f9;
        font-weight: 600;
        font-size: 12px;
        width: 22%;
    }
    .ftd-price-table td input {
        width: 100%;
        max-width: 200px;
        padding: 6px 8px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    
    /* Panel system */
    .ftd-panel {
        display: none;
    }
    .ftd-panel.is-active {
        display: block;
    }
    
    /* Date discount rows */
    .ftd-date-discount-row {
        margin-bottom: 12px;
        padding: 12px;
        background: #fefefe;
        border: 1px solid #e5e5e5;
        border-radius: 6px;
    }
    .ftd-ddr-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 120px auto;
        gap: 12px;
        align-items: end;
    }
    .ftd-ddr-grid > div {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .ftd-ddr-grid label {
        font-size: 11px;
        font-weight: 600;
        color: #555;
        text-transform: uppercase;
    }
    .ftd-ddr-grid input {
        padding: 6px 8px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    .ftd-ddr-grid input[type="date"] {
        font-family: monospace;
    }
    .ftd-ddr-remove {
        background: #f0f0f0;
        border: 1px solid #ccc;
        padding: 6px 12px;
        border-radius: 4px;
        cursor: pointer;
        font-size: 11px;
        height: 32px;
        white-space: nowrap;
    }
    .ftd-ddr-remove:hover {
        background: #e0e0e0;
    }
    .ftd-ddr-hint {
        font-size: 11px;
        color: #888;
        margin-top: 10px;
        font-style: italic;
    }
    
    /* Add button */
    #ftd-add-date-discount {
        margin-top: 6px;
        background: #2271b1;
        color: white;
        border: none;
        padding: 6px 14px;
        border-radius: 4px;
        cursor: pointer;
        font-size: 12px;
    }
    #ftd-add-date-discount:hover {
        background: #135e96;
    }
    
    /* Tour type select */
    .ftd-tour-type-select {
        max-width: 340px;
        margin-top: 10px;
    }
    .ftd-tour-type-select label {
        display: block;
        font-weight: 600;
        font-size: 12px;
        margin-bottom: 6px;
        color: #444;
    }
    .ftd-tour-type-select select {
        width: 100%;
        padding: 6px 10px;
        font-size: 13px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    
    /* Time slots input */
    .ftd-slots-input {
        width: 100%;
        max-width: 420px;
        padding: 6px 10px;
        border: 1px solid #ddd;
        border-radius: 4px;
    }
    .ftd-slots-note {
        color: #666;
        font-size: 12px;
        margin: 8px 0 12px;
    }
    
    /* Helper classes */
    .ftd-mw-120 {
        max-width: 120px;
    }
    .ftd-flex-0 {
        flex: 0;
    }


/* ============================================================
   FTD Booking Widget — Extracted Inline Styles
   Add these rules to your existing ftd-booking-widget.css
   (or whichever external stylesheet you use for the widget).
   ============================================================ */

/* ── Utility: hidden state ───────────────────────────────────
   Replaces all occurrences of style="display:none;"
   JS should toggle visibility via:
     el.classList.remove('ftd-hidden')  → show
     el.classList.add('ftd-hidden')     → hide
   ---------------------------------------------------------- */
.ftd-hidden {
    display: none;
}

/* ── Date discount badge ─────────────────────────────────────
   Replaces the long inline style on #ftd-date-discount-badge-{id}
   JS removes .ftd-hidden and sets textContent to show the badge.
   ---------------------------------------------------------- */
.ftd-discount-badge {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fff3cd;
    border-left: 4px solid #f0a500;
    border-radius: 0 4px 4px 0;
    font-size: 13px;
    color: #6b4c00;
    font-weight: 600;
}

/* ── Transport info spacing variant ──────────────────────────
   Replaces style="margin-top:10px;" on the vehicle-info
   .ftd-transport-info block inside the vehicle/buggy section.
   ---------------------------------------------------------- */
.ftd-transport-info--spaced {
    margin-top: 10px;
}

/* ============================================================
   class-ftd-tour-dates.php — Extracted Inline Styles
   Add to your admin CSS file (e.g. tour-single.css).
   ============================================================ */

/* ── Label hint (muted inline sub-text inside <label>) ───────
   Replaces: style="font-weight:400;color:#888;"
   Used on: "Age 3–11", "(seats per vehicle)", "per vehicle"
   ---------------------------------------------------------- */
.ftd-label-hint {
    font-weight: 400;
    color: #888;
}

/* ── Price table seat label ──────────────────────────────────
   Replaces: style="font-size:12px;" on <strong> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-label {
    font-size: 12px;
}

/* ── Price table seat sub-text ───────────────────────────────
   Replaces: style="font-size:11px;color:#888;" on <span> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-sub {
    font-size: 11px;
    color: #888;
}



/*================= Page ftd-booking widget css======================= */

/* ============================================================
   FTD Booking Widget — Extracted Inline Styles
   Add these rules to your existing ftd-booking-widget.css
   (or whichever external stylesheet you use for the widget).
   ============================================================ */

/* ── Utility: hidden state ───────────────────────────────────
   Replaces all occurrences of style="display:none;"
   JS should toggle visibility via:
     el.classList.remove('ftd-hidden')  → show
     el.classList.add('ftd-hidden')     → hide
   ---------------------------------------------------------- */
.ftd-hidden {
    display: none;
}

/* ── Date discount badge ─────────────────────────────────────
   Replaces the long inline style on #ftd-date-discount-badge-{id}
   JS removes .ftd-hidden and sets textContent to show the badge.
   ---------------------------------------------------------- */
.ftd-discount-badge {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fff3cd;
    border-left: 4px solid #f0a500;
    border-radius: 0 4px 4px 0;
    font-size: 13px;
    color: #6b4c00;
    font-weight: 600;
}

/* ── Transport info spacing variant ──────────────────────────
   Replaces style="margin-top:10px;" on the vehicle-info
   .ftd-transport-info block inside the vehicle/buggy section.
   ---------------------------------------------------------- */
.ftd-transport-info--spaced {
    margin-top: 10px;
}



/*================= Page class-ftd-tour-category-image css======================= */

/* Tour Category Image */

.tour-cat-image-preview-img {
    max-width: 100px;
    height: auto;
    display: block;
}

.tour-cat-hidden {
    display: none;
}

/*====================Class-ftd-tour-meta.php========================*/
/* ============================================================
   FTD Booking Widget — Extracted Inline Styles
   Add these rules to your existing ftd-booking-widget.css
   (or whichever external stylesheet you use for the widget).
   ============================================================ */

/* ── Utility: hidden state ───────────────────────────────────
   Replaces all occurrences of style="display:none;"
   JS should toggle visibility via:
     el.classList.remove('ftd-hidden')  → show
     el.classList.add('ftd-hidden')     → hide
   ---------------------------------------------------------- */
.ftd-hidden {
    display: none;
}

/* ── Date discount badge ─────────────────────────────────────
   Replaces the long inline style on #ftd-date-discount-badge-{id}
   JS removes .ftd-hidden and sets textContent to show the badge.
   ---------------------------------------------------------- */
.ftd-discount-badge {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fff3cd;
    border-left: 4px solid #f0a500;
    border-radius: 0 4px 4px 0;
    font-size: 13px;
    color: #6b4c00;
    font-weight: 600;
}

/* ── Transport info spacing variant ──────────────────────────
   Replaces style="margin-top:10px;" on the vehicle-info
   .ftd-transport-info block inside the vehicle/buggy section.
   ---------------------------------------------------------- */
.ftd-transport-info--spaced {
    margin-top: 10px;
}

/* ============================================================
   class-ftd-tour-dates.php — Extracted Inline Styles
   Add to your admin CSS file (e.g. tour-single.css).
   ============================================================ */

/* ── Label hint (muted inline sub-text inside <label>) ───────
   Replaces: style="font-weight:400;color:#888;"
   Used on: "Age 3–11", "(seats per vehicle)", "per vehicle"
   ---------------------------------------------------------- */
.ftd-label-hint {
    font-weight: 400;
    color: #888;
}

/* ── Price table seat label ──────────────────────────────────
   Replaces: style="font-size:12px;" on <strong> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-label {
    font-size: 12px;
}

/* ── Price table seat sub-text ───────────────────────────────
   Replaces: style="font-size:11px;color:#888;" on <span> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-sub {
    font-size: 11px;
    color: #888;
}

/* ============================================================
   class-ftd-tour-meta.php — Extracted Inline Styles
   Add to your admin stylesheet (tour-single.css).
   ============================================================ */

/* ── Spacing utilities ───────────────────────────────────────── */
.ftd-mb-6  { margin-bottom: 6px; }
.ftd-mb-8  { margin-bottom: 8px; }
.ftd-mb-10 { margin-bottom: 10px; }
.ftd-mb-12 { margin-bottom: 12px; }
.ftd-mt-6  { margin-top: 6px; }
.ftd-mt-8  { margin-top: 8px; }

/* ── Input width helpers ─────────────────────────────────────── */
/* Replaces style="width:100%" on inputs/selects/textareas */
.ftd-input-full {
    width: 100%;
}

/* Replaces style="width:80px" on small number inputs */
.ftd-input-80 {
    width: 80px;
}

/* Replaces style="width:200px" on rating badge input */
.ftd-input-200 {
    width: 200px;
}

/* Replaces style="flex:1" on growing inputs inside flex rows */
.ftd-input-flex {
    flex: 1;
}

/* Replaces style="width:140px;flex-shrink:0" on itinerary time input */
.ftd-input-time {
    width: 140px;
    flex-shrink: 0;
}

/* ── Table utilities ─────────────────────────────────────────── */
/* Replaces style="width:160px" on <th> elements */
.ftd-th-160 {
    width: 160px;
}

/* Replaces style="margin:0" on form-table inside reviews section */
.ftd-table-no-margin {
    margin: 0;
}

/* ── Section headings ────────────────────────────────────────── */
/* Replaces style="margin:0 0 8px" on <h4> elements */
.ftd-section-h4 {
    margin: 0 0 8px;
}

/* ── Horizontal rule ─────────────────────────────────────────── */
/* Replaces style="margin:16px 0" on <hr> elements */
.ftd-hr {
    margin: 16px 0;
}

/* ── Danger / destructive button text ────────────────────────── */
/* Replaces style="color:#c0392b" on Remove buttons */
.ftd-btn-danger {
    color: #c0392b;
}

/* ── Meta label (small muted label above inputs) ─────────────── */
/* Replaces style="display:block;font-size:11px;color:#888;margin-bottom:3px;" */
.ftd-meta-label {
    display: block;
    font-size: 11px;
    color: #888;
    margin-bottom: 3px;
}

/* ── Gallery preview strip ───────────────────────────────────── */
/* Replaces style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px;" */
.ftd-gallery-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

/* Replaces style="position:relative;display:inline-block;" on thumb wrapper */
.ftd-gallery-thumb-wrap {
    position: relative;
    display: inline-block;
}

/* Replaces style="width:80px;height:80px;object-fit:cover;border-radius:4px;border:1px solid #ddd;" */
.ftd-gallery-thumb {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #ddd;
}

/* Replaces style="position:absolute;top:-6px;right:-6px;background:#c0392b;color:#fff;
                   border:none;border-radius:50%;width:20px;height:20px;
                   cursor:pointer;font-size:11px;line-height:1;" */
.ftd-gallery-rm-btn {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #c0392b;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    cursor: pointer;
    font-size: 11px;
    line-height: 1;
}

/* ── Highlight rows ──────────────────────────────────────────── */
/* Replaces style="display:flex;gap:8px;margin-bottom:8px;" */
.ftd-hl-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

/* ── Review rows ─────────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;border-radius:4px;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-review-row {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* Replaces style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px;" on the fields row */
.ftd-review-row__fields {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

/* Individual field columns */
.ftd-review-row__field         { flex: 1; }
.ftd-review-row__field--name   { min-width: 160px; }
.ftd-review-row__field--country{ min-width: 120px; }
.ftd-review-row__field--date   { min-width: 130px; }
.ftd-review-row__field--stars  { width: 80px; flex: none; }

/* Replaces style="display:flex;align-items:flex-end;" on remove button wrapper */
.ftd-review-row__remove {
    display: flex;
    align-items: flex-end;
}

/* ── Include groups ──────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;border-radius:4px;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-group {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* Replaces style="display:flex;gap:8px;margin-bottom:8px;align-items:center;" */
.ftd-group__header {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    align-items: center;
}

/* Replaces style="display:flex;gap:8px;margin-bottom:6px;" on item rows */
.ftd-item-row {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

/* ── Itinerary rows ──────────────────────────────────────────── */
/* Replaces style="display:flex;gap:10px;margin-bottom:10px;" */
.ftd-itin-row {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

/* ── FAQ rows ────────────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-faq-row {
    border: 1px solid #ddd;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* =====================================single ftd .php================ */

/* ============================================================
   FTD Booking Widget — Extracted Inline Styles
   Add these rules to your existing ftd-booking-widget.css
   (or whichever external stylesheet you use for the widget).
   ============================================================ */

/* ── Utility: hidden state ───────────────────────────────────
   Replaces all occurrences of style="display:none;"
   JS should toggle visibility via:
     el.classList.remove('ftd-hidden')  → show
     el.classList.add('ftd-hidden')     → hide
   ---------------------------------------------------------- */
.ftd-hidden {
    display: none;
}

/* ── Date discount badge ─────────────────────────────────────
   Replaces the long inline style on #ftd-date-discount-badge-{id}
   JS removes .ftd-hidden and sets textContent to show the badge.
   ---------------------------------------------------------- */
.ftd-discount-badge {
    margin-top: 8px;
    padding: 8px 12px;
    background: #fff3cd;
    border-left: 4px solid #f0a500;
    border-radius: 0 4px 4px 0;
    font-size: 13px;
    color: #6b4c00;
    font-weight: 600;
}

/* ── Transport info spacing variant ──────────────────────────
   Replaces style="margin-top:10px;" on the vehicle-info
   .ftd-transport-info block inside the vehicle/buggy section.
   ---------------------------------------------------------- */
.ftd-transport-info--spaced {
    margin-top: 10px;
}

/* ============================================================
   class-ftd-tour-dates.php — Extracted Inline Styles
   Add to your admin CSS file (e.g. tour-single.css).
   ============================================================ */

/* ── Label hint (muted inline sub-text inside <label>) ───────
   Replaces: style="font-weight:400;color:#888;"
   Used on: "Age 3–11", "(seats per vehicle)", "per vehicle"
   ---------------------------------------------------------- */
.ftd-label-hint {
    font-weight: 400;
    color: #888;
}

/* ── Price table seat label ──────────────────────────────────
   Replaces: style="font-size:12px;" on <strong> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-label {
    font-size: 12px;
}

/* ── Price table seat sub-text ───────────────────────────────
   Replaces: style="font-size:11px;color:#888;" on <span> in render_price_table()
   ---------------------------------------------------------- */
.ftd-price-table__seat-sub {
    font-size: 11px;
    color: #888;
}

/* ============================================================
   class-ftd-tour-meta.php — Extracted Inline Styles
   Add to your admin stylesheet (tour-single.css).
   ============================================================ */

/* ── Spacing utilities ───────────────────────────────────────── */
.ftd-mb-6  { margin-bottom: 6px; }
.ftd-mb-8  { margin-bottom: 8px; }
.ftd-mb-10 { margin-bottom: 10px; }
.ftd-mb-12 { margin-bottom: 12px; }
.ftd-mt-6  { margin-top: 6px; }
.ftd-mt-8  { margin-top: 8px; }

/* ── Input width helpers ─────────────────────────────────────── */
/* Replaces style="width:100%" on inputs/selects/textareas */
.ftd-input-full {
    width: 100%;
}

/* Replaces style="width:80px" on small number inputs */
.ftd-input-80 {
    width: 80px;
}

/* Replaces style="width:200px" on rating badge input */
.ftd-input-200 {
    width: 200px;
}

/* Replaces style="flex:1" on growing inputs inside flex rows */
.ftd-input-flex {
    flex: 1;
}

/* Replaces style="width:140px;flex-shrink:0" on itinerary time input */
.ftd-input-time {
    width: 140px;
    flex-shrink: 0;
}

/* ── Table utilities ─────────────────────────────────────────── */
/* Replaces style="width:160px" on <th> elements */
.ftd-th-160 {
    width: 160px;
}

/* Replaces style="margin:0" on form-table inside reviews section */
.ftd-table-no-margin {
    margin: 0;
}

/* ── Section headings ────────────────────────────────────────── */
/* Replaces style="margin:0 0 8px" on <h4> elements */
.ftd-section-h4 {
    margin: 0 0 8px;
}

/* ── Horizontal rule ─────────────────────────────────────────── */
/* Replaces style="margin:16px 0" on <hr> elements */
.ftd-hr {
    margin: 16px 0;
}

/* ── Danger / destructive button text ────────────────────────── */
/* Replaces style="color:#c0392b" on Remove buttons */
.ftd-btn-danger {
    color: #c0392b;
}

/* ── Meta label (small muted label above inputs) ─────────────── */
/* Replaces style="display:block;font-size:11px;color:#888;margin-bottom:3px;" */
.ftd-meta-label {
    display: block;
    font-size: 11px;
    color: #888;
    margin-bottom: 3px;
}

/* ── Gallery preview strip ───────────────────────────────────── */
/* Replaces style="display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px;" */
.ftd-gallery-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

/* Replaces style="position:relative;display:inline-block;" on thumb wrapper */
.ftd-gallery-thumb-wrap {
    position: relative;
    display: inline-block;
}

/* Replaces style="width:80px;height:80px;object-fit:cover;border-radius:4px;border:1px solid #ddd;" */
.ftd-gallery-thumb {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #ddd;
}

/* Replaces style="position:absolute;top:-6px;right:-6px;background:#c0392b;color:#fff;
                   border:none;border-radius:50%;width:20px;height:20px;
                   cursor:pointer;font-size:11px;line-height:1;" */
.ftd-gallery-rm-btn {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #c0392b;
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    cursor: pointer;
    font-size: 11px;
    line-height: 1;
}

/* ── Highlight rows ──────────────────────────────────────────── */
/* Replaces style="display:flex;gap:8px;margin-bottom:8px;" */
.ftd-hl-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}

/* ── Review rows ─────────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;border-radius:4px;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-review-row {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* Replaces style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px;" on the fields row */
.ftd-review-row__fields {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

/* Individual field columns */
.ftd-review-row__field         { flex: 1; }
.ftd-review-row__field--name   { min-width: 160px; }
.ftd-review-row__field--country{ min-width: 120px; }
.ftd-review-row__field--date   { min-width: 130px; }
.ftd-review-row__field--stars  { width: 80px; flex: none; }

/* Replaces style="display:flex;align-items:flex-end;" on remove button wrapper */
.ftd-review-row__remove {
    display: flex;
    align-items: flex-end;
}

/* ── Include groups ──────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;border-radius:4px;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-group {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* Replaces style="display:flex;gap:8px;margin-bottom:8px;align-items:center;" */
.ftd-group__header {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    align-items: center;
}

/* Replaces style="display:flex;gap:8px;margin-bottom:6px;" on item rows */
.ftd-item-row {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
}

/* ── Itinerary rows ──────────────────────────────────────────── */
/* Replaces style="display:flex;gap:10px;margin-bottom:10px;" */
.ftd-itin-row {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

/* ── FAQ rows ────────────────────────────────────────────────── */
/* Replaces style="border:1px solid #ddd;padding:12px;margin-bottom:10px;background:#fafafa;" */
.ftd-faq-row {
    border: 1px solid #ddd;
    padding: 12px;
    margin-bottom: 10px;
    background: #fafafa;
}

/* ============================================================
   single-ftd-tour.php — Extracted Inline Styles
   Add to your main frontend stylesheet.
   ============================================================ */

/* ── Gallery data holder (hidden from view) ──────────────────
   Replaces style="display:none;" on #ftd-gallery-data.
   Note: .ftd-hidden is already defined above — no duplicate needed.
   ---------------------------------------------------------- */
/* (uses existing .ftd-hidden rule) */

/* ── Star icon states (reviews modals) ───────────────────────
   Replaces inline style="color: #f5a623 / #ddd" on star <span>s
   inside the All Reviews modal summary and per-item star rows.
   ---------------------------------------------------------- */
.ftd-star-icon--filled {
    color: #f5a623;
}

.ftd-star-icon--empty {
    color: #ddd;
}