/**
 * Tenerife Advisor — Travel UI responsive layer
 * Mobile: ≤639px · Tablet: 640–1023px · Desktop: ≥1024px
 */

/* —— Base: no horizontal scroll from full-bleed covers/mastheads —— */
body.ta-listing-archive-page,
body.ta-listing-single-page,
body.ta-guest-dashboard-page {
    overflow-x: clip;
}

body.cms-landing-theme #brief-ai-lp:has(.ta-listing-archive),
body.cms-landing-theme #brief-ai-lp:has(.ta-listing-single-pro) {
    overflow-x: clip;
}

/* Wider shells than default CMS prose (720px) */
body.cms-landing-theme .lp-cms-public-page.ta-listing-archive {
    max-width: min(1240px, 100%);
    padding-left: clamp(12px, 3vw, var(--cms-layout-gutter, 24px));
    padding-right: clamp(12px, 3vw, var(--cms-layout-gutter, 24px));
    padding-top: clamp(0.35rem, 1.2vw, 1rem);
    padding-bottom: clamp(2rem, 4vw, 4rem);
}

body.ta-listing-single-page.cms-landing-theme #brief-ai-lp {
    max-width: min(1180px, 100%);
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(12px, 3vw, 20px);
    padding-right: clamp(12px, 3vw, 20px);
}

body.ta-listing-single-page main.wrap {
    box-sizing: border-box;
    max-width: 1180px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(12px, 3vw, 20px);
    padding-right: clamp(12px, 3vw, 20px);
}

/* Touch-friendly controls */
.ta-dash-btn,
.ta-btn,
.ta-listing-filters__submit,
.ta-listing-mobile-dock__btn,
.ta-dash-fav-remove {
    min-height: 44px;
}

html[data-lp-color-scheme='dark'] body.ta-listing-single-page .ta-listing-mobile-dock {
    background: rgba(15, 23, 42, 0.94);
    border-top-color: rgba(148, 163, 184, 0.2);
}

html[data-lp-color-scheme='dark'] body.ta-listing-single-page .ta-listing-mobile-dock__btn {
    background: hsl(222 40% 12%);
    color: #f1f5f9;
    border-color: rgba(148, 163, 184, 0.25);
}

/* Coarse pointer: skip hover lift (performance + less jank) */
@media (hover: none) {
    .ta-dash-stat:hover,
    .ta-dash-card:hover,
    .ta-listing-archive-cat-card--overlay:hover,
    body.ta-listing-archive-page #brief-ai-lp .ta-cool-card:hover,
    body.ta-listing-single-page .ta-listing-related-section .ta-cool-card:hover {
        transform: none;
    }
}

/* ========== MOBILE (≤639px) ========== */
@media (max-width: 639px) {
    /* Guest dashboard */
    .ta-dash {
        margin: 12px auto calc(32px + env(safe-area-inset-bottom, 0px));
        padding: 0 12px;
    }

    .ta-dash-hero {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 18px 16px;
        gap: 14px;
    }

    .ta-dash-hero__cta {
        flex-direction: column;
        width: 100%;
        align-items: stretch;
    }

    .ta-dash-hero__cta .ta-dash-btn {
        width: 100%;
    }

    .ta-dash-hero__meta {
        justify-content: center;
    }

    .ta-dash-hero__bio {
        max-width: none;
        margin-left: auto;
        margin-right: auto;
    }

    .ta-dash-hero__chips {
        justify-content: center;
    }

    .ta-dash-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .ta-dash-stat {
        padding: 12px 14px;
    }

    .ta-dash-stat strong {
        font-size: 1.35rem;
    }

    .ta-dash-nav {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        border-radius: 14px;
        padding: 5px;
    }

    .ta-dash-nav::-webkit-scrollbar {
        display: none;
    }

    .ta-dash-nav__link {
        flex-shrink: 0;
        padding: 10px 14px;
        font-size: 0.85rem;
    }

    .ta-dash-panel {
        padding: 18px 16px;
        border-radius: 16px;
    }

    .ta-dash-panel__head {
        flex-direction: column;
        align-items: stretch;
    }

    .ta-dash-panel__head .ta-dash-btn {
        width: 100%;
    }

    .ta-dash-cards {
        grid-template-columns: 1fr;
    }

    .ta-dash-form-grid {
        grid-template-columns: 1fr;
    }

    .ta-dash-profile-layout {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .ta-dash-card {
        flex-direction: column;
        align-items: stretch;
    }

    .ta-dash-card__thumb {
        width: 100%;
        height: 140px;
    }

    /* Archive / Entdecken */
    body.ta-listing-archive-page .ta-listing-archive-masthead {
        height: 180px;
    }

    body.ta-listing-archive-page.ta-listing-archive-page--global .ta-listing-archive-masthead {
        height: 220px;
    }

    body.ta-listing-archive-page .ta-listing-filters-panel {
        position: static;
        padding: 0.75rem;
        margin-bottom: 1.25rem;
    }

    body.ta-listing-archive-page .ta-listing-filters {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    body.ta-listing-archive-page .ta-listing-filters input,
    body.ta-listing-archive-page .ta-listing-filters select {
        min-width: 0;
        width: 100%;
    }

    body.ta-listing-archive-page .ta-listing-filters__submit {
        width: 100%;
    }

    body.ta-listing-archive-page .ta-listing-type-tabs {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    body.ta-listing-archive-page .ta-listing-type-tabs::-webkit-scrollbar {
        display: none;
    }

    body.ta-listing-archive-page .ta-listing-type-tab {
        flex-shrink: 0;
    }

    body.ta-listing-archive-page .ta-listing-archive-chip-row {
        gap: 0.4rem;
    }

    body.ta-listing-archive-page .ta-listing-archive-cat-grid,
    body.ta-listing-archive-page .ta-listing-archive-cat-grid--types,
    body.ta-listing-archive-page .ta-listing-archive-cat-grid--categories {
        grid-template-columns: 1fr;
    }

    body.ta-listing-archive-page .ta-listing-archive-cat-card--overlay {
        min-height: 200px;
    }

    body.ta-listing-archive-page #brief-ai-lp .ta-card-img-wrapper {
        height: 180px;
    }

    body.ta-listing-archive-page #brief-ai-lp .ta-card-footer {
        flex-wrap: wrap;
    }

    body.ta-listing-archive-page #brief-ai-lp .ta-card-action-text {
        white-space: normal;
    }

    body.ta-listing-archive-page .ta-listing-archive-hero {
        grid-template-columns: 1fr;
    }

    body.ta-listing-archive-page .ta-listing-archive-hero__media {
        max-height: 200px;
    }

    /* Single listing */
    body.ta-listing-single-page.cms-landing-theme .ta-listing-cover,
    body.ta-listing-single-page main.wrap .ta-listing-cover {
        height: min(38vh, 300px);
        min-height: 180px;
    }

    body.ta-listing-single-page .ta-listing-single-pro__shell {
        margin-top: -2.5rem;
        padding: 0;
    }

    body.ta-listing-single-page .ta-listing-profile-card {
        grid-template-columns: 1fr;
        text-align: center;
        padding: 1rem;
    }

    body.ta-listing-single-page .ta-listing-profile-card__logo {
        margin: 0 auto;
    }

    body.ta-listing-single-page .ta-listing-profile-card__meta {
        justify-content: center;
    }

    body.ta-listing-single-page .ta-listing-action-bar {
        flex-direction: column;
        align-items: stretch;
    }

    body.ta-listing-single-page .ta-listing-action-bar .ta-btn {
        width: 100%;
        justify-content: center;
    }

    body.ta-listing-single-page .ta-listing-tab-nav-wrap {
        top: calc(var(--lp-header-height, 56px) + 4px);
        margin-left: -4px;
        margin-right: -4px;
    }

    body.ta-listing-single-page .ta-listing-tab-nav {
        border-radius: 10px;
    }

    body.ta-listing-single-page .ta-listing-block {
        padding: 1rem;
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside-sticky {
        position: static;
    }

    body.ta-listing-single-page .ta-listing-related-section .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: 1fr;
    }

    body.ta-listing-single-page .ta-listing-hours-table th {
        width: 42%;
        font-size: 0.85rem;
    }

    body.ta-listing-single-page .ta-comment-replies {
        margin-left: 0.75rem;
    }
}

/* ========== TABLET (640px – 1023px) ========== */
@media (min-width: 640px) and (max-width: 1023px) {
    .ta-dash {
        padding: 0 20px;
    }

    .ta-dash-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .ta-dash-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ta-dash-nav {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .ta-dash-profile-layout {
        grid-template-columns: minmax(240px, 300px) 1fr;
        gap: 20px;
    }

    .ta-dash-hero {
        grid-template-columns: auto 1fr;
        grid-template-areas:
            'avatar body'
            'avatar cta';
    }

    .ta-dash-hero .ta-dash-avatar,
    .ta-dash-hero .ta-dash-avatar--fallback {
        grid-area: avatar;
    }

    .ta-dash-hero > div:nth-child(2) {
        grid-area: body;
        text-align: left;
    }

    .ta-dash-hero__cta {
        grid-area: cta;
        flex-direction: row;
        justify-content: flex-end;
    }

    body.ta-listing-archive-page .ta-listing-archive-cat-grid--types {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ta-listing-archive-page .ta-listing-archive-cat-grid--categories {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ta-listing-archive-page .ta-listing-filters {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: end;
    }

    body.ta-listing-archive-page .ta-listing-filters__submit {
        grid-column: 1 / -1;
        justify-self: start;
    }

    body.ta-listing-archive-page #brief-ai-lp .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ta-listing-single-page .ta-listing-single-pro__grid {
        grid-template-columns: 1fr;
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside {
        order: -1;
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside-sticky {
        position: static;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem;
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside-sticky .ta-listing-sidebar-block:last-child {
        grid-column: 1 / -1;
    }

    body.ta-listing-single-page .ta-listing-related-section .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.ta-listing-single-page .ta-listing-cover {
        height: min(42vh, 360px);
    }
}

/* ========== DESKTOP (≥1024px) ========== */
@media (min-width: 1024px) {
    .ta-dash-profile-layout {
        grid-template-columns: minmax(280px, 320px) 1fr;
        gap: 28px;
    }

    .ta-dash-cards {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    body.ta-listing-archive-page .ta-listing-archive-cat-grid--types {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.ta-listing-single-page .ta-listing-single-pro__grid {
        grid-template-columns: 1fr minmax(260px, 320px);
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside {
        order: 0;
    }

    body.ta-listing-single-page .ta-listing-single-pro__aside-sticky {
        display: block;
    }
}

/* Large desktop: 4-column listing grids */
@media (min-width: 1200px) {
    body.ta-listing-archive-page #brief-ai-lp .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    body.ta-listing-single-page .ta-listing-related-section .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Mid desktop: 3 columns (1024–1199 handled by existing 768+ rules; reinforce) */
@media (min-width: 1024px) and (max-width: 1199px) {
    body.ta-listing-archive-page #brief-ai-lp .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.ta-listing-single-page .ta-listing-related-section .ta-listing-explore-grid.ta-cards-grid--quad {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}