/* ==========================================================================
   GoWayanadStay — Property Detail (/stay/{slug}) — Phase 7
   Built on the design-system tokens. Loaded only on the detail page.
   ========================================================================== */

.pdetail__breadcrumb { margin-bottom: var(--ds-space-4); }

/* Header */
.pdetail__head { margin-bottom: var(--ds-space-4); }
.pdetail__badges { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.pdetail__metarow { display: flex; gap: var(--ds-space-4); flex-wrap: wrap; align-items: center; color: var(--ds-muted); margin-top: 6px; }
.pdetail__metarow .pdetail__rating { color: var(--ds-accent-active, #a9791f); font-weight: var(--ds-fw-semibold); }

/* Gallery */
.pgallery { margin-bottom: var(--ds-space-6); }
.pgallery__main { display: block; width: 100%; border: 0; padding: 0; cursor: zoom-in; background: var(--ds-surface-2); border-radius: var(--ds-r-lg); overflow: hidden; aspect-ratio: 16 / 10; }
.pgallery__main img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgallery__thumbs { display: flex; gap: 8px; overflow-x: auto; margin-top: 8px; padding-bottom: 4px; scrollbar-width: thin; }
.pgallery__thumbs::-webkit-scrollbar { height: 6px; }
.pthumb { flex: 0 0 auto; width: 96px; height: 72px; border: 2px solid transparent; border-radius: var(--ds-r-sm); overflow: hidden; padding: 0; background: var(--ds-surface-2); cursor: pointer; }
.pthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pthumb.active, .pthumb:focus-visible { border-color: var(--ds-primary); outline: none; }

/* Layout */
.pdetail__layout { display: grid; grid-template-columns: 1fr; gap: var(--ds-space-6); align-items: start; }
.pdetail__section { margin-bottom: var(--ds-space-6); }
.pdetail__section h2 { margin-bottom: var(--ds-space-3); }
.pdetail__desc { color: var(--ds-ink-soft); line-height: 1.65; white-space: pre-line; }

/* Specs */
.pdetail__specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-3); }
.pspec { display: flex; align-items: center; gap: 10px; background: var(--ds-surface); border: var(--ds-border-style); border-radius: var(--ds-r-md); padding: var(--ds-space-3); }
.pspec__ic { font-size: 1.35rem; line-height: 1; }
.pspec small { display: block; color: var(--ds-muted); font-size: var(--ds-fs-caption); }
@media (min-width: 560px) { .pdetail__specs { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Amenities */
.pamenity-group { margin-bottom: var(--ds-space-4); }
.pamenity-group h3 { font-size: 0.95rem; color: var(--ds-muted); text-transform: uppercase; letter-spacing: 0.04em; margin: 0 0 var(--ds-space-2); }
.pamenity-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ds-space-2) var(--ds-space-4); }
.pamenity { display: flex; align-items: center; gap: 8px; color: var(--ds-ink-soft); min-width: 0; }
@media (min-width: 768px) { .pamenity-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Media wrappers */
.pmedia { border-radius: var(--ds-r-md); overflow: hidden; border: var(--ds-border-style); }
.pvideo { position: relative; aspect-ratio: 16 / 9; background: #0b1a12; cursor: pointer; border-radius: var(--ds-r-md); overflow: hidden; }
.pvideo__poster { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; }
.pvideo__play { width: 68px; height: 68px; border-radius: 50%; background: rgba(255,255,255,0.16); display: grid; place-items: center; font-size: 1.8rem; backdrop-filter: blur(2px); }

/* Price / aside panel */
.pdetail__aside .pprice-card { background: var(--ds-surface); border: var(--ds-border-style); border-radius: var(--ds-r-lg); padding: var(--ds-space-5); box-shadow: var(--ds-shadow-sm); }
.pprice { font-size: 1.6rem; font-weight: var(--ds-fw-bold); color: var(--ds-ink); }
.pprice small { font-size: 0.85rem; font-weight: var(--ds-fw-regular); color: var(--ds-muted); }
.pprice-note { color: var(--ds-muted); font-size: var(--ds-fs-caption); }

/* Related */
.pdetail__related { display: grid; gap: var(--ds-grid-gap); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 560px) { .pdetail__related { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 992px) { .pdetail__related { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Card overlay availability badge (related cards) */
.pc-avail { position: absolute; bottom: var(--ds-space-3); left: var(--ds-space-3); }

/* Desktop */
@media (min-width: 992px) {
    .pdetail__layout { grid-template-columns: 1fr 340px; }
    .pdetail__aside .pprice-card { position: sticky; top: calc(var(--header-h, 68px) + 16px); }
}

/* Keep the in-form submit always visible so the CTA next to the fields is real. */
.enq-submit-inline { display: block; }

/* ---- Enquiry form ---- */
.enq-card { background: var(--ds-surface); border: var(--ds-bw) solid var(--ds-border); border-radius: var(--ds-r-lg); padding: var(--ds-space-5); box-shadow: var(--ds-shadow-sm); scroll-margin-top: calc(var(--header-h, 68px) + 16px); }
.enq-form .ds-field { margin-bottom: var(--ds-space-3); }
.enq-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ds-space-3); }
@media (min-width: 480px) { .enq-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.enq-phone { display: flex; gap: var(--ds-space-2); }
.enq-phone .enq-cc { flex: 0 0 96px; padding-right: 26px; background-position: right 8px center; }
.enq-phone .ds-input { flex: 1 1 auto; min-width: 0; }
.enq-hp { position: absolute; left: -9999px; top: -9999px; width: 1px; height: 1px; overflow: hidden; }
.enq-error { display: block; color: var(--danger, #c0392b); font-size: .8rem; margin-top: 3px; }
.enq-error:empty { display: none; }
.enq-consent { display: flex; gap: 8px; align-items: flex-start; font-size: var(--ds-fs-sm); position: relative; }
.enq-consent .ds-check__box { flex: none; }
.enq-success { text-align: center; padding: var(--ds-space-4) 0; }
#enquiry { scroll-margin-top: calc(var(--header-h, 68px) + 16px); }

/* Gallery stage + chrome (used on mobile; harmless on desktop) */
.pgallery__stage { position: relative; }
.pgallery__chrome {
    position: absolute; z-index: 3; top: 14px;
    display: none; align-items: center; justify-content: center;
    border: 0; cursor: pointer; color: #fff;
    background: rgba(6, 18, 12, .72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.pgallery__chrome--back {
    left: 14px; width: 42px; height: 42px; border-radius: 999px; font-size: 1.45rem; line-height: 1;
}
.pgallery__chrome--share {
    right: 14px; height: 42px; padding: 0 14px; border-radius: 999px;
    gap: 6px; font-size: .86rem; font-weight: 700;
}
.pgallery__dots {
    position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%);
    display: none; gap: 6px; z-index: 2;
}
.pgallery__dots i {
    display: block; width: 7px; height: 7px; border-radius: 999px;
    background: rgba(255,255,255,.45);
}
.pgallery__dots i.is-active { background: #fff; width: 8px; height: 8px; }
.pgallery__count { pointer-events: none; }

.ds-badge--avail {
    background: #54c868; color: #063a1c; border: 0; font-weight: 700;
}

.pcio {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
    border: var(--ds-border-style); border-radius: var(--ds-r-lg); overflow: hidden;
    background: var(--ds-surface);
}
.pcio__col {
    padding: var(--ds-space-4); display: grid; gap: 4px; justify-items: start;
}
.pcio__col + .pcio__col { border-left: var(--ds-border-style); }
.pcio__label { font-size: .72rem; color: var(--ds-muted); text-transform: uppercase; letter-spacing: .04em; font-weight: 700; }
.pcio__ic { color: var(--ds-primary); }
.pcio__time { font-size: 1.05rem; color: var(--ds-ink); }
.pcio__date { font-size: .85rem; color: var(--ds-muted); }

.pamenity-preview {
    display: none;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: var(--ds-space-3);
}
.pamenity-chip {
    display: grid; gap: 6px; justify-items: center; text-align: center;
    padding: 10px 4px; min-width: 0;
    border: var(--ds-border-style); border-radius: 12px; background: var(--ds-surface);
}
.pamenity-chip__ic { font-size: 1.15rem; line-height: 1; color: var(--ds-primary); }
.pamenity-chip__name {
    font-size: .68rem; line-height: 1.2; color: var(--ds-ink-soft);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}

.enq-card__title { display: flex; align-items: center; gap: 8px; }
.enq-card__wa { color: #25D366; }
.enq-card__lead { display: none; }
.enq-card__lead-desktop { display: block; }
.enq-submit-ic { margin-right: 4px; }

/* ---- Mobile property redesign (reference match) ---- */
@media (max-width: 991.98px) {
    .page-property .site-header--inside { display: none; }
    .page-property .pdetail__breadcrumb { display: none; }
    .page-property .ds-section { padding-top: 0; padding-bottom: 36px; }
    .page-property .ds-container { padding-inline: 0; max-width: 100%; }

    .pgallery { margin: 0 0 14px; }
    .pgallery__stage { margin: 0; }
    .pgallery__chrome { display: inline-flex; }
    .pgallery__main {
        border-radius: 0; aspect-ratio: 4 / 3;
        border: 0; box-shadow: none;
    }
    .pgallery__thumbs { display: none; }
    .pgallery__count {
        position: absolute; right: 12px; bottom: 12px; z-index: 2;
        padding: 5px 10px; border-radius: 999px;
        background: rgba(2, 12, 8, .78); color: #fff;
        font-size: .75rem; font-weight: 700;
        border: 1px solid rgba(255,255,255,.14);
    }
    .pgallery__dots { display: flex; bottom: 16px; }

    .pdetail__head {
        margin: 0 16px 12px; padding: 0; border: 0; background: transparent; border-radius: 0;
    }
    .pdetail__title {
        margin: 0 0 10px; font-size: clamp(1.55rem, 7vw, 1.95rem); line-height: 1.15;
    }
    .pdetail__badges { margin-bottom: 10px; gap: 8px; }
    .pdetail__metarow {
        gap: 8px 12px; margin-top: 0; font-size: .86rem; align-items: center;
    }
    .pdetail__metarow .pdetail__code::before {
        content: ""; display: inline-block; width: 1px; height: 12px;
        background: rgba(255,255,255,.25); margin-right: 12px; vertical-align: middle;
    }
    .pdetail__rating {
        margin-top: 8px; font-weight: 700; color: #f0c14a; font-size: .92rem;
    }
    .pdetail__rating span { color: #9fbfa8; font-weight: 600; }

    .pdetail__layout { gap: 12px; padding-inline: 16px; }
    .pdetail__aside { display: none; }
    .pdetail__section {
        margin-bottom: 12px; padding: 14px; border-radius: 16px;
    }
    .pdetail__section h2 { margin-bottom: 10px; font-size: 1.05rem; }
    .pdetail__quick { padding: 0; border: 0; background: transparent; }
    .pdetail__specs--quick {
        grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0;
        border: 1px solid rgba(146, 199, 96, .18);
        border-radius: 16px; overflow: hidden;
        background: rgba(4, 22, 15, .72);
    }
    .pdetail__specs--quick .pspec {
        flex-direction: column; gap: 4px; text-align: center;
        border: 0; border-radius: 0; padding: 12px 4px;
        background: transparent; min-width: 0;
    }
    .pdetail__specs--quick .pspec + .pspec { border-left: 1px solid rgba(146, 199, 96, .12); }
    .pdetail__specs--quick .pspec strong { font-size: .95rem; display: block; }
    .pdetail__specs--quick .pspec small { font-size: .62rem; line-height: 1.2; }

    .pdetail__cio { padding: 0; border: 0; background: transparent; }
    .pcio {
        border-color: rgba(146, 199, 96, .18);
        background: rgba(4, 22, 15, .72);
    }
    .pcio__col { padding: 14px; }
    .pcio__col + .pcio__col { border-left-color: rgba(146, 199, 96, .14); }
    .pcio__label { color: #8fa397; }
    .pcio__time { color: #fff; }
    .pcio__date { color: #9fbfa8; }

    .pdetail__about .pdetail__desc[data-read-more]:not(.is-expanded) {
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
        white-space: normal;
    }
    .pdetail__more { min-height: 40px; font-size: .9rem; }

    .pamenity-preview { display: grid; }
    [data-amenities-list]:not(.is-expanded) { display: none; }
    [data-amenities-list].is-expanded { display: block; margin-top: 12px; }

    .enq-card {
        padding: 16px; border-radius: 18px;
        scroll-margin-top: 12px;
    }
    .enq-card__lead { display: block; margin-top: 6px !important; }
    .enq-card__lead-desktop,
    .enq-progress,
    .enq-card__footnote { display: none; }
    .enq-form .ds-field { margin-bottom: 10px; }
    .enq-row { grid-template-columns: 1fr 1fr; gap: 10px; }
    .enq-phone .enq-cc { flex: 0 0 88px; }
    .enq-submit-inline {
        min-height: 52px; border-radius: 14px; font-weight: 800; font-size: 1rem;
        margin-top: 6px;
    }

    .pdetail__related { padding-inline: 0; }
}

@media (max-width: 359.98px) {
    .pdetail__specs--quick { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pdetail__specs--quick .pspec:nth-child(3) { border-left: 0; border-top: 1px solid rgba(146, 199, 96, .12); }
    .pdetail__specs--quick .pspec:nth-child(4) { border-top: 1px solid rgba(146, 199, 96, .12); }
    .pamenity-preview { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .enq-row { grid-template-columns: 1fr; }
}

@media (min-width: 992px) {
    .pgallery__chrome,
    .pgallery__dots { display: none !important; }
    .pamenity-preview { display: none !important; }
    .enq-card__lead { display: none !important; }
    .enq-card__lead-desktop { display: block; }
}