/* =========================================================
   VT Estate Single Page — v2
   ========================================================= */

.vt-single-wrap {
    max-width: 1200px;
    margin: 32px auto;
    padding: 0 20px;
    font-family: inherit;
}

/* ---------- Breadcrumb ---------- */
.vt-breadcrumb {
    font-size: .82rem;
    color: #999;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.vt-breadcrumb a { color: #1560bd; text-decoration: none; }
.vt-breadcrumb a:hover { text-decoration: underline; }

/* ---------- Layout ---------- */
.vt-single-layout {
    display: grid;
    grid-template-columns: 30% 1fr;
    gap: 0 32px;
    align-items: start;
}

/* ---------- LEFT column: sticky panel while right column (gallery) scrolls ---------- */
.vt-single-left {
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    overflow-x: hidden;
    /* subtle scrollbar */
    scrollbar-width: thin;
    scrollbar-color: #ddd transparent;
}
.vt-single-left::-webkit-scrollbar { width: 4px; }
.vt-single-left::-webkit-scrollbar-thumb { background: #ddd; border-radius: 2px; }

.vt-single-badge {
    display: inline-block;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
}
.vt-badge-sold     { background: #e74c3c; color: #fff; }
.vt-badge-reserved { background: #f39c12; color: #fff; }
.vt-badge-new      { background: #27ae60; color: #fff; }

.vt-single-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1a1a2e;
    margin: 0 0 8px;
    line-height: 1.35;
}
.vt-single-price {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1560bd;
    margin: 0 0 3px;
}
.vt-single-price-m2 {
    font-size: .85rem;
    color: #888;
    margin: 0 0 14px;
}
.vt-single-address {
    font-size: .88rem;
    color: #555;
    margin: 0 0 18px;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
.vt-single-address svg { flex-shrink: 0; margin-top: 2px; }

/* ---------- Action buttons ---------- */
.vt-single-actions {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.vt-btn-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 16px;
    border: 1.5px solid #d0d0d0;
    border-radius: 6px;
    background: #fff !important;
    color: #444 !important;
    font-size: .87rem;
    cursor: pointer;
    text-decoration: none;
    transition: border-color .2s, color .2s;
    font-family: inherit;
    box-shadow: none !important;
}
.vt-btn-action:hover {
    border-color: #1560bd !important;
    color: #fff !important;
    background: #1560bd !important;
}
.vt-btn-action svg { flex-shrink: 0; }
.vt-btn-action.is-saved { border-color: #e74c3c !important; color: #e74c3c !important; }
.vt-btn-action.is-saved:hover { background: #fff5f5 !important; }

/* ---------- Section blocks ---------- */
.vt-single-section {
    border-top: 1px solid #eee;
    padding-top: 16px;
    margin-bottom: 18px;
}
.vt-single-section-title {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #aaa;
    margin: 0 0 12px;
}

/* ---------- Params grid ---------- */
.vt-params-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 12px;
}
.vt-param-item { display: flex; flex-direction: column; }
.vt-param-label { font-size: .7rem; color: #aaa; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 2px; }
.vt-param-value { font-size: .88rem; font-weight: 600; color: #222; }

/* ---------- Ypatumai ---------- */
.vt-ypatumai-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px 8px;
}
.vt-ypatumai-item {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .84rem;
    color: #bbb;
}
.vt-ypatumai-item.is-active {
    color: #222;
    font-weight: 600;
}
.vt-yp-icon {
    font-size: .9rem;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
    color: inherit;
}
.vt-ypatumai-item.is-active .vt-yp-icon { color: #1560bd; }

/* ---------- Description ---------- */
.vt-single-desc {
    border-top: 1px solid #eee;
    padding-top: 16px;
    margin-bottom: 18px;
}
.vt-desc-text {
    font-size: .88rem;
    line-height: 1.65;
    color: #444;
}
.vt-desc-text.is-collapsed {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.vt-desc-toggle {
    background: none;
    border: none;
    color: #1560bd;
    font-size: .83rem;
    cursor: pointer;
    padding: 6px 0 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: inherit;
}
.vt-desc-toggle:hover { text-decoration: underline; }

/* ---------- Broker card ---------- */
.vt-broker-card {
    border: 1px solid #e8e8e8;
    border-radius: 6px;
    padding: 16px;
    margin-bottom: 18px;
    background: #fafafa;
}
.vt-broker-layout {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    margin-bottom: 12px;
}
.vt-broker-img-wrap {
    flex-shrink: 0;
    width: 150px;
}
.vt-broker-avatar {
    width: 150px;
    height: 150px;
    border-radius: 6px;
    object-fit: cover;
    display: block;
    background: #ddd;
}
.vt-broker-placeholder {
    width: 150px;
    height: 150px;
    border-radius: 6px;
    background: #e8e8e8;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vt-broker-info { flex: 1; min-width: 0; }
.vt-broker-name { font-weight: 700; font-size: .95rem; color: #1a1a2e; margin: 0 0 2px; }
.vt-broker-role { font-size: .76rem; color: #aaa; margin: 0 0 8px; }
.vt-broker-contacts { display: flex; flex-direction: column; gap: 6px; }
.vt-broker-contact-link {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .87rem;
    color: #333;
    text-decoration: none;
}
.vt-broker-contact-link:hover { color: #1560bd; }
.vt-broker-contact-link svg { flex-shrink: 0; color: #1560bd; }
.vt-broker-profile-link {
    display: inline-block;
    margin-top: 10px;
    font-size: .8rem;
    color: #1560bd;
    text-decoration: none;
    border: 1px solid #1560bd;
    border-radius: 4px;
    padding: 4px 12px;
    transition: all .2s;
}
.vt-broker-profile-link:hover { background: #1560bd; color: #fff; }

/* ---------- CF7 form ---------- */
.vt-contact-form-wrap { border-top: 1px solid #eee; padding-top: 16px; margin-bottom: 18px; }
.vt-contact-form-wrap .wpcf7-form { display: flex; flex-direction: column; gap: 10px; }
.vt-contact-form-wrap .wpcf7-form input[type="text"],
.vt-contact-form-wrap .wpcf7-form input[type="email"],
.vt-contact-form-wrap .wpcf7-form input[type="tel"],
.vt-contact-form-wrap .wpcf7-form textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: .87rem;
    box-sizing: border-box;
    font-family: inherit;
    transition: border-color .2s;
}
.vt-contact-form-wrap .wpcf7-form input:focus,
.vt-contact-form-wrap .wpcf7-form textarea:focus { outline: none; border-color: #1560bd; }
.vt-contact-form-wrap .wpcf7-form textarea { min-height: 80px; resize: vertical; }
.vt-contact-form-wrap .wpcf7-submit {
    background: #1560bd !important;
    color: #fff !important;
    border: none;
    padding: 11px 20px;
    border-radius: 5px;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    width: 100%;
    font-family: inherit;
}
.vt-contact-form-wrap .wpcf7-submit:hover { background: #0e4a9a !important; }

/* ---------- RIGHT column: Gallery ---------- */
.vt-gallery-zone {
    margin-bottom: 8px;
}
.vt-gallery-main {
    position: relative;
    background: #111;
    border-radius: 6px;
    overflow: hidden;
    aspect-ratio: 16/10;
    width: 100%;
}
.vt-gallery-main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    cursor: zoom-in;
}
/* Hide main-page arrows — arrows are lightbox-only */
.vt-gallery-arrow { display: none !important; }
.vt-gallery-count-badge {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(0,0,0,.55);
    color: #fff;
    font-size: .78rem;
    padding: 3px 9px;
    border-radius: 6px;
    cursor: pointer;
    user-select: none;
    display: flex;
    align-items: center;
    gap: 4px;
}
.vt-gallery-arrow {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    background: #1560bd;
    color: #fff;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .2s;
    user-select: none;
    line-height: 1;
}
.vt-gallery-arrow:hover { background: #0e4a9a; }
.vt-gallery-arrow:disabled { background: #ccc; cursor: default; }

.vt-gallery-thumbs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    margin-bottom: 16px;
}
.vt-gallery-thumb {
    aspect-ratio: 4/3;
    overflow: hidden;
    border-radius: 4px;
    cursor: pointer;
    border: 2px solid transparent;
    transition: border-color .15s;
}
.vt-gallery-thumb.is-active { border-color: #1560bd; }
.vt-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity .2s;
}
.vt-gallery-thumb:hover img { opacity: .85; }
.vt-gallery-more {
    position: relative;
    cursor: pointer;
    aspect-ratio: 4/3;
    border-radius: 4px;
    overflow: hidden;
}
.vt-gallery-more img {
    width: 100%; height: 100%;
    object-fit: cover;
    filter: brightness(.45);
    display: block;
}
.vt-gallery-more-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 700;
}

/* ---------- Map ---------- */
.vt-single-map {
    margin-top: 8px;
    border-radius: 6px;
    overflow: hidden;
    border: 1px solid #e8e8e8;
}
.vt-single-map iframe {
    display: block;
    width: 100%;
    height: 340px;
    border: none;
}

/* ---------- Related ---------- */
.vt-related-section { margin-top: 40px; border-top: 2px solid #eee; padding-top: 24px; }
.vt-related-title { font-size: 1.1rem; font-weight: 700; color: #1a1a2e; margin: 0 0 20px; }
.vt-related-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}
/* Force uniform card image ratio (matching /nt-paieska) */
.vt-related-grid .vt-card__img-wrap {
    aspect-ratio: 4/3;
}
.vt-related-grid .vt-card__img-wrap img {
    aspect-ratio: 4/3;
    object-fit: cover;
    width: 100%;
    height: 100%;
    display: block;
}

/* ---------- Lightbox ---------- */
.vt-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.92);
    z-index: 99999;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.vt-lightbox.is-open { display: flex; }
.vt-lightbox-img-wrap {
    position: relative;
    max-width: 90vw;
    max-height: 82vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vt-lightbox-img-wrap img {
    max-width: 90vw;
    max-height: 82vh;
    object-fit: contain;
    border-radius: 4px;
    display: block;
}
.vt-lightbox-counter {
    color: rgba(255,255,255,.65);
    font-size: .85rem;
    margin-top: 10px;
    text-align: center;
}
.vt-lightbox-close {
    position: absolute;
    top: 14px;
    right: 18px;
    background: none;
    border: none;
    color: #fff;
    font-size: 2.2rem;
    cursor: pointer;
    line-height: 1;
    padding: 0;
    opacity: .8;
}
.vt-lightbox-close:hover { opacity: 1; }
.vt-lightbox-prev, .vt-lightbox-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255,255,255,.18);
    border: none;
    color: #fff;
    font-size: 2rem;
    width: 52px;
    height: 72px;
    cursor: pointer;
    border-radius: 4px;
    transition: background .2s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vt-lightbox-prev { left: 10px; }
.vt-lightbox-next { right: 10px; }
.vt-lightbox-prev:hover, .vt-lightbox-next:hover { background: rgba(255,255,255,.32); }

/* ---------- Mobile ---------- */
@media (max-width: 900px) {
    .vt-single-layout {
        display: flex;
        flex-direction: column;
    }
    .vt-single-left   { position: static; max-height: none; overflow: visible; }
    .vt-mobile-header { padding-bottom: 4px; }
    .vt-related-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
    /* Mobile: show only first 4 thumbs in a 4-column row */
    .vt-gallery-thumbs { grid-template-columns: repeat(4, 1fr); }
    .vt-gallery-thumb:nth-child(n+5) { display: none; }
}
@media (max-width: 540px) {
    /* Still show only 4 thumbs, 2 per row on very small screens */
    .vt-gallery-thumbs { grid-template-columns: repeat(2, 1fr); }
    .vt-gallery-thumb:nth-child(n+5) { display: none; }
    .vt-related-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .vt-ypatumai-grid { grid-template-columns: 1fr 1fr; }
    .vt-params-grid { grid-template-columns: 1fr 1fr; } /* keep 2 cols on mobile */
}

/* ---------- Print view: hidden on screen ---------- */
.vt-print-view { display: none; }

/* =============================================================
   PRINT STYLESHEET
   Custom brochure-style layout: header → photos → params → broker
   ============================================================= */
@media print {
    /* Hide the entire web UI. The loan calculator is an iframe from an
       outside site, so it printed as a broken block on for-sale listings;
       rentals never showed it, which is why only sales looked wrong. */
    .site-header,
    .site-footer,
    #ast-scroll-top,
    .ast-scroll-top-icon,
    .vt-breadcrumb,
    .vt-single-layout,
    .vt-loan-calc-section,
    .vt-related-section,
    .vt-lightbox { display: none !important; }

    @page { margin: 12mm; }
    html, body { background: #fff !important; }

    /* Show our custom print layout */
    .vt-print-view {
        display: block;
        font-family: Arial, Helvetica, sans-serif;
        font-size: 10pt;
        color: #111;
        padding: 0;
        margin: 0;
        max-width: 100%;
    }

    /* --- Header bar --- */
    .vt-print-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border-bottom: 2pt solid #1560bd;
        padding-bottom: 5pt;
        margin-bottom: 10pt;
    }
    .vt-print-site-name {
        font-size: 14pt;
        font-weight: 700;
        color: #1560bd;
        letter-spacing: .5pt;
    }
    .vt-print-date { font-size: 8pt; color: #888; }

    /* --- Title block --- */
    .vt-print-badge {
        display: inline-block;
        padding: 2pt 7pt;
        border-radius: 2pt;
        font-size: 7.5pt;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .05em;
        color: #fff;
        background: #e07b1a;
        margin-bottom: 5pt;
    }
    .vt-print-badge.vt-badge-reserved { background: #e07b1a; }
    .vt-print-badge.vt-badge-sold     { background: #d63028; }
    .vt-print-badge.vt-badge-new      { background: #22a443; }

    .vt-print-h1 {
        font-size: 17pt;
        font-weight: 700;
        margin: 0 0 6pt;
        color: #1a1a2e;
        line-height: 1.25;
    }
    .vt-print-meta-row {
        display: flex;
        align-items: baseline;
        gap: 14pt;
        flex-wrap: wrap;
        padding-bottom: 8pt;
        border-bottom: 1px solid #e0e0e0;
        margin-bottom: 10pt;
    }
    .vt-print-price {
        font-size: 17pt;
        color: #1560bd;
        font-weight: 700;
    }
    .vt-print-price-m2 { font-size: 10pt; color: #666; }
    .vt-print-address  { font-size: 10pt; color: #444; }

    /* --- Main photo --- */
    .vt-print-main-img { margin-bottom: 5pt; page-break-inside: avoid; }
    .vt-print-main-img img {
        width: 100%;
        height: 230pt;
        object-fit: cover;
        display: block;
        border-radius: 3pt;
    }

    /* --- Additional photos: 2-column grid --- */
    .vt-print-photos-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 4pt;
        margin-bottom: 14pt;
    }
    .vt-print-photo-cell { page-break-inside: avoid; }
    .vt-print-photo-cell img {
        width: 100%;
        height: 120pt;
        object-fit: cover;
        display: block;
        border-radius: 2pt;
    }

    /* --- Info sections --- */
    .vt-print-section {
        margin-bottom: 10pt;
        page-break-inside: avoid;
    }
    .vt-print-section-title {
        font-size: 7pt;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: .1em;
        color: #999;
        margin-bottom: 5pt;
        padding-bottom: 3pt;
        border-bottom: 1px solid #eee;
    }

    /* Params: 3 columns */
    .vt-print-params-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 5pt 10pt;
    }
    .vt-print-param { display: flex; flex-direction: column; }
    .vt-print-param-label {
        font-size: 7pt;
        color: #aaa;
        text-transform: uppercase;
        letter-spacing: .04em;
    }
    .vt-print-param-value {
        font-size: 10pt;
        font-weight: 700;
        color: #111;
    }

    /* Ypatumai: 3 columns */
    .vt-print-ypatumai-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 3pt 8pt;
    }
    .vt-print-yp-item { font-size: 9pt; color: #222; }

    /* Description */
    .vt-print-desc {
        font-size: 9pt;
        line-height: 1.6;
        color: #333;
    }

    /* --- Broker --- */
    .vt-print-broker-block {
        display: flex;
        align-items: flex-start;
        gap: 12pt;
        margin-top: 10pt;
        padding-top: 8pt;
        border-top: 1px solid #e0e0e0;
        page-break-inside: avoid;
    }
    .vt-print-broker-img {
        width: 56pt;
        height: 56pt;
        object-fit: cover;
        border-radius: 5pt;
        flex-shrink: 0;
        display: block;
    }
    .vt-print-broker-details { font-size: 9pt; line-height: 1.65; color: #333; }
    .vt-print-broker-name { font-size: 12pt; font-weight: 700; color: #1a1a2e; }
    .vt-print-broker-role { font-size: 8pt; color: #999; margin-bottom: 3pt; }

    /* --- Footer --- */
    .vt-print-footer {
        margin-top: 14pt;
        padding-top: 6pt;
        border-top: 1px solid #ddd;
        display: flex;
        justify-content: space-between;
        font-size: 8pt;
        color: #aaa;
    }
}
