.pm-vp2,
.pm-vp2 *{
    box-sizing:border-box;
}

.pm-vp2{
    display:grid;
    gap:18px;
    width:100%;
}

.pm-vp2-owner-toolbar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    padding:16px 18px;
    background:#fff;
    border:1px solid #dce4ef;
    border-radius:14px;
    box-shadow:0 8px 24px rgba(15,35,65,.05);
}

.pm-vp2-owner-toolbar > div:first-child{
    display:grid;
    gap:3px;
    min-width:0;
}

.pm-vp2-owner-toolbar small{
    color:#77869d;
    font-size:11px;
    font-weight:850;
    letter-spacing:.12em;
}

.pm-vp2-owner-toolbar b{
    overflow:hidden;
    color:#17335f;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.pm-vp2-toolbar-actions{
    display:flex;
    gap:9px;
    flex:0 0 auto;
}

.pm-vp2-toolbar-actions button,
.pm-vp2-add-photo,
.pm-vp2-photo-button,
.pm-vp2-logo-edit{
    cursor:pointer;
}

.pm-vp2-toolbar-actions button{
    padding:10px 15px;
    border:1px solid #d4deeb;
    border-radius:9px;
    background:#fff;
    color:#243653;
    font-weight:800;
}

.pm-vp2-toolbar-actions .primary{
    border-color:#1f4dbd;
    background:#1f4dbd;
    color:#fff;
}

.pm-vp2-error{
    padding:12px 15px;
    border:1px solid #fecdd3;
    border-radius:10px;
    background:#fff1f2;
    color:#b42333;
}

.pm-vp2-edit-handle{
    display:flex;
    align-items:center;
    gap:3px;
    width:min(540px,100%);
    padding:10px 13px;
    border:1px solid #cdd8e6;
    border-radius:10px;
    background:#fff;
}

.pm-vp2-edit-handle span{
    color:#68778e;
}

.pm-vp2-edit-handle input{
    min-width:0;
    flex:1;
    border:0;
    outline:0;
    font:inherit;
    font-weight:750;
    color:#17335f;
}

.pm-vp2-page{
    overflow:hidden;
    border:1px solid #dce4ef;
    border-radius:18px;
    background:#f8fafc;
    box-shadow:0 16px 44px rgba(15,35,65,.08);
}

.pm-vp2-hero{
    position:relative;
    background:#fff;
}

.pm-vp2-cover{
    position:relative;
    min-height:280px;
    background:
        linear-gradient(
            135deg,
            #16284f,
            #244d91
        );
    background-position:center;
    background-size:cover;
}

.pm-vp2-cover::after{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(
            180deg,
            transparent 55%,
            rgba(7,21,45,.55)
        );
    pointer-events:none;
}

.pm-vp2-cover-empty{
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    color:rgba(255,255,255,.72);
    font-weight:800;
}

.pm-vp2-photo-button{
    position:absolute;
    right:18px;
    bottom:18px;
    z-index:2;
    padding:10px 13px;
    border-radius:9px;
    background:rgba(255,255,255,.95);
    color:#17335f;
    font-size:13px;
    font-weight:850;
    box-shadow:0 6px 20px rgba(5,20,40,.18);
}

.pm-vp2-photo-button input,
.pm-vp2-logo-edit input,
.pm-vp2-add-photo input{
    display:none;
}

.pm-vp2-identity{
    display:flex;
    gap:18px;
    align-items:flex-end;
    padding:0 28px 22px;
    background:#fff;
}

.pm-vp2-logo-wrap{
    position:relative;
    flex:0 0 auto;
    margin-top:-56px;
    z-index:3;
}

.pm-vp2-logo{
    display:grid;
    width:116px;
    height:116px;
    object-fit:cover;
    place-items:center;
    overflow:hidden;
    border:5px solid #fff;
    border-radius:24px;
    background:#12284e;
    box-shadow:0 8px 24px rgba(9,25,55,.2);
}

.pm-vp2-logo-fallback{
    color:#fff;
    font-size:28px;
    font-weight:900;
}

.pm-vp2-logo-edit{
    position:absolute;
    right:-5px;
    bottom:-5px;
    display:grid;
    width:36px;
    height:36px;
    place-items:center;
    border:3px solid #fff;
    border-radius:50%;
    background:#1f4dbd;
    color:#fff;
}

.pm-vp2-name{
    min-width:0;
    flex:1;
}

.pm-vp2-name h2{
    margin:0;
    color:#0d2040;
    font-size:30px;
    line-height:1.1;
}

.pm-vp2-name > p{
    margin:7px 0;
    color:#5e708b;
    font-size:16px;
}

.pm-vp2-inline-title{
    width:min(620px,100%);
    margin:8px 0;
    padding:9px 11px;
    border:1px dashed #8da7d8;
    border-radius:8px;
    background:#f6f9ff;
    color:#264773;
    font:inherit;
}

.pm-vp2-meta{
    display:flex;
    flex-wrap:wrap;
    gap:7px 18px;
    color:#69788e;
    font-size:13px;
}

.pm-vp2-tabs{
    display:flex;
    justify-content:center;
    gap:0;
    border-top:1px solid #e3e9f1;
    border-bottom:1px solid #e3e9f1;
    background:#fff;
}

.pm-vp2-tabs button{
    position:relative;
    padding:15px 28px 14px;
    border:0;
    background:transparent;
    color:#586980;
    font-size:14px;
    font-weight:850;
    cursor:pointer;
}

.pm-vp2-tabs button.active{
    color:#173f9f;
}

.pm-vp2-tabs button.active::after{
    content:"";
    position:absolute;
    right:18px;
    bottom:-1px;
    left:18px;
    height:3px;
    border-radius:3px 3px 0 0;
    background:#2353c7;
}

.pm-vp2-content{
    padding:26px;
}

.pm-vp2-card{
    border:1px solid #dce4ef;
    border-radius:14px;
    background:#fff;
    box-shadow:0 8px 22px rgba(15,35,65,.04);
}

.pm-vp2-card h3{
    margin:0;
    color:#102442;
    font-size:18px;
}

.pm-vp2-section-title{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
}

.pm-vp2-edit-pill,
.pm-vp2-system-lock{
    padding:6px 9px;
    border-radius:999px;
    background:#eef3ff;
    color:#3459a7;
    font-size:11px;
    font-weight:800;
}

.pm-vp2-about-grid{
    display:grid;
    grid-template-columns:
        repeat(2,minmax(0,1fr));
    gap:16px;
}

.pm-vp2-about-grid > section{
    padding:20px;
}

.pm-vp2-about-copy,
.pm-vp2-gallery-card,
.pm-vp2-map-card{
    grid-column:1/-1;
}

.pm-vp2-about-text{
    margin:14px 0 0;
    color:#5c6d83;
    line-height:1.75;
}

.pm-vp2 textarea,
.pm-vp2 input{
    font-family:inherit;
}

.pm-vp2-about-copy textarea,
.pm-vp2-contact-edit input,
.pm-vp2-map-card > input,
.pm-vp2-about-grid > section > input,
.pm-vp2-compose textarea,
.pm-vp2-add-amenity input{
    width:100%;
    padding:11px 12px;
    border:1px solid #ccd7e5;
    border-radius:9px;
    background:#fff;
    color:#183152;
    font:inherit;
    outline:0;
}

.pm-vp2-about-copy textarea{
    margin-top:14px;
    resize:vertical;
}

.pm-vp2-amenity-list{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.pm-vp2-amenity-list span{
    padding:8px 10px;
    border-radius:8px;
    background:#f0f5ff;
    color:#2d4d89;
    font-size:13px;
    font-weight:750;
}

.pm-vp2-amenity-editor{
    display:grid;
    gap:12px;
    margin-top:14px;
}

.pm-vp2-amenity-options{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
}

.pm-vp2-amenity-options button{
    padding:8px 10px;
    border:1px solid #d2dbe8;
    border-radius:8px;
    background:#fff;
    color:#5c6b80;
    cursor:pointer;
}

.pm-vp2-amenity-options button.selected{
    border-color:#8ca9e9;
    background:#eef4ff;
    color:#214798;
    font-weight:800;
}

.pm-vp2-add-amenity{
    display:flex;
    gap:8px;
}

.pm-vp2-add-amenity input{
    flex:1;
}

.pm-vp2-add-amenity button{
    padding:0 16px;
    border:0;
    border-radius:8px;
    background:#173f9f;
    color:#fff;
    font-weight:800;
}

.pm-vp2-beginner-toggle{
    display:flex;
    align-items:center;
    gap:8px;
    margin-top:16px;
    color:#334763;
    font-weight:750;
}

.pm-vp2-beginner-toggle input{
    width:auto;
}

.pm-vp2-hidden{
    display:none !important;
}

.pm-vp2-add-photo{
    padding:8px 11px;
    border:1px solid #cbd7e6;
    border-radius:8px;
    color:#2350ad;
    font-size:13px;
    font-weight:800;
}

.pm-vp2-gallery{
    display:grid;
    grid-template-columns:
        repeat(4,minmax(0,1fr));
    gap:10px;
    margin-top:14px;
}

.pm-vp2-gallery figure{
    position:relative;
    aspect-ratio:4/3;
    margin:0;
    overflow:hidden;
    border-radius:10px;
    background:#e8edf4;
}

.pm-vp2-gallery img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.pm-vp2-gallery figure button{
    position:absolute;
    top:7px;
    right:7px;
    display:grid;
    width:28px;
    height:28px;
    place-items:center;
    border:0;
    border-radius:50%;
    background:rgba(16,28,48,.82);
    color:#fff;
    font-size:18px;
    cursor:pointer;
}

.pm-vp2-gallery-empty,
.pm-vp2-map-empty{
    display:grid;
    min-height:150px;
    margin-top:14px;
    place-items:center;
    border:1px dashed #cbd5e3;
    border-radius:10px;
    background:#f7f9fc;
    color:#8190a4;
}

.pm-vp2-contact-edit{
    display:grid;
    gap:8px;
    margin-top:14px;
}

.pm-vp2-contact-list{
    display:grid;
    gap:8px;
    margin-top:14px;
    color:#5d6d82;
}

.pm-vp2-map-card iframe{
    width:100%;
    height:300px;
    margin-top:14px;
    border:0;
    border-radius:10px;
    background:#edf1f6;
}

.pm-vp2-muted{
    color:#8190a4;
}

.pm-vp2-book-layout{
    display:grid;
    grid-template-columns:
        minmax(0,1fr) 310px;
    gap:18px;
    align-items:start;
}

.pm-vp2-book-main{
    padding:20px;
}

.pm-vp2-book-head,
.pm-vp2-openplay-head,
.pm-vp2-feed-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:14px;
}

.pm-vp2-book-head small,
.pm-vp2-openplay-head small,
.pm-vp2-feed-head small{
    color:#8190a4;
    font-size:11px;
    font-weight:850;
    letter-spacing:.11em;
}

.pm-vp2-book-head h3,
.pm-vp2-openplay-head h3,
.pm-vp2-feed-head h3{
    margin:4px 0 0;
    color:#102442;
    font-size:20px;
}

.pm-vp2-date-nav{
    display:grid;
    grid-template-columns:44px minmax(0,1fr) 44px;
    align-items:center;
    gap:9px;
    margin:18px 0;
}

.pm-vp2-date-strip{
    display:flex;
    gap:8px;
    min-width:0;
    width:100%;
    margin:0;
    overflow-x:auto;
    overflow-y:hidden;
    padding:2px 1px 5px;
    scroll-behavior:smooth;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
}

.pm-vp2-date-strip::-webkit-scrollbar{
    display:none;
}

.pm-vp2-date-arrow{
    display:grid;
    width:44px;
    height:44px;
    place-items:center;
    padding:0;
    border:1px solid #d3dce9;
    border-radius:50%;
    background:#fff;
    color:#244fbb;
    font-size:28px;
    line-height:1;
    cursor:pointer;
    transition:
        border-color .15s ease,
        background .15s ease,
        transform .15s ease;
}

.pm-vp2-date-arrow:hover:not(:disabled){
    border-color:#244fbb;
    background:#eef3ff;
    transform:translateY(-1px);
}

.pm-vp2-date-arrow:disabled{
    opacity:.3;
    cursor:not-allowed;
}

.pm-vp2-date-strip button{
    display:grid;
    flex:0 0 68px;
    gap:2px;
    place-items:center;
    padding:8px 6px;
    scroll-snap-align:start;
    border:1px solid #d3dce9;
    border-radius:9px;
    background:#fff;
    color:#63738a;
    cursor:pointer;
}

.pm-vp2-date-strip button.active{
    border-color:#244fbb;
    background:#244fbb;
    color:#fff;
}

.pm-vp2-date-strip small{
    font-size:10px;
    font-weight:800;
}

.pm-vp2-date-strip b{
    font-size:17px;
}

.pm-vp2-date-strip em{
    min-height:11px;
    color:inherit;
    font-size:9px;
    font-style:normal;
    font-weight:800;
    line-height:1;
    opacity:.7;
    text-transform:uppercase;
}

.pm-vp2-table-scroll{
    width:100%;
    overflow-x:auto;
}

.pm-vp2-availability{
    width:100%;
    min-width:650px;
    border-collapse:separate;
    border-spacing:0;
    overflow:hidden;
    border:1px solid #dce3ec;
    border-radius:10px;
}

.pm-vp2-availability th,
.pm-vp2-availability td{
    padding:10px;
    border-right:1px solid #e3e8ef;
    border-bottom:1px solid #e3e8ef;
    text-align:center;
}

.pm-vp2-availability tr:last-child th,
.pm-vp2-availability tr:last-child td{
    border-bottom:0;
}

.pm-vp2-availability th:last-child,
.pm-vp2-availability td:last-child{
    border-right:0;
}

.pm-vp2-availability thead th{
    background:#f6f8fb;
    color:#34465f;
    font-size:12px;
}

.pm-vp2-time-col{
    position:sticky;
    left:0;
    z-index:2;
    min-width:130px;
    background:#f8fafc !important;
    color:#617087;
    text-align:left !important;
}

.pm-vp2-open-slot{
    display:grid;
    width:100%;
    gap:2px;
    padding:8px 4px;
    border:0;
    border-radius:7px;
    background:#edf8f2;
    color:#20834d;
    cursor:pointer;
}

.pm-vp2-open-slot:hover{
    background:#dff2e7;
}

.pm-vp2-open-slot b{
    font-size:12px;
}

.pm-vp2-open-slot small{
    color:#607167;
    font-size:11px;
}

.pm-vp2-unavailable{
    color:#b2bbc7;
}

.pm-vp2-summary{
    position:sticky;
    top:18px;
    padding:20px;
}

.pm-vp2-summary h3{
    margin-bottom:15px;
}

.pm-vp2-summary dl{
    display:grid;
    gap:10px;
    margin:0;
}

.pm-vp2-summary dl > div{
    display:flex;
    justify-content:space-between;
    gap:12px;
    color:#637189;
}

.pm-vp2-summary dt,
.pm-vp2-summary dd{
    margin:0;
}

.pm-vp2-summary dd{
    color:#203650;
    font-weight:800;
    text-align:right;
}

.pm-vp2-summary .total{
    padding-top:10px;
    border-top:1px solid #e3e8ef;
    font-size:16px;
}

.pm-vp2-book-button{
    width:100%;
    margin-top:17px;
    padding:12px;
    border:0;
    border-radius:9px;
    background:#173f9f;
    color:#fff;
    font-weight:850;
}

.pm-vp2-book-button:disabled{
    opacity:.55;
}

.pm-vp2-preview-note{
    display:block;
    margin-top:9px;
    color:#8996a8;
    line-height:1.4;
    text-align:center;
}

.pm-vp2-summary-empty,
.pm-vp2-loading,
.pm-vp2-empty{
    display:grid;
    min-height:150px;
    place-items:center;
    color:#8190a4;
    text-align:center;
}

.pm-vp2-openplay,
.pm-vp2-feed{
    display:grid;
    gap:16px;
}

.pm-vp2-session-grid{
    display:grid;
    grid-template-columns:
        repeat(3,minmax(0,1fr));
    gap:14px;
}

.pm-vp2-session-card{
    padding:18px;
    border:1px solid #dce4ef;
    border-radius:13px;
    background:#fff;
}

.pm-vp2-session-badge{
    display:inline-flex;
    padding:5px 8px;
    border-radius:999px;
    background:#eef4ff;
    color:#2652ae;
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
}

.pm-vp2-session-card h4{
    margin:11px 0;
    color:#142b4b;
    font-size:17px;
}

.pm-vp2-session-card p{
    margin:7px 0;
    color:#69788c;
    font-size:13px;
}

.pm-vp2-session-card button{
    width:100%;
    margin-top:10px;
    padding:10px;
    border:1px solid #ccd7e6;
    border-radius:8px;
    background:#fff;
    color:#294b89;
    font-weight:800;
}

.pm-vp2-openplay-empty{
    gap:6px;
    padding:35px;
    border:1px dashed #ced8e5;
    border-radius:12px;
    background:#fff;
}

.pm-vp2-compose{
    display:grid;
    grid-template-columns:42px 1fr auto;
    gap:10px;
    align-items:start;
    padding:14px;
}

.pm-vp2-compose-avatar{
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    border-radius:50%;
    background:#173f9f;
    color:#fff;
    font-weight:900;
}

.pm-vp2-compose textarea{
    resize:vertical;
}

.pm-vp2-compose button{
    height:42px;
    padding:0 15px;
    border:0;
    border-radius:8px;
    background:#173f9f;
    color:#fff;
    font-weight:800;
}

.pm-vp2-feed-list{
    display:grid;
    gap:12px;
}

.pm-vp2-post{
    padding:18px;
}

.pm-vp2-post header{
    display:flex;
    align-items:center;
    gap:10px;
}

.pm-vp2-post header > div:nth-child(2){
    display:grid;
    gap:2px;
    flex:1;
}

.pm-vp2-post header small{
    color:#8b98a9;
}

.pm-vp2-post header > button{
    border:0;
    background:transparent;
    color:#b42333;
    cursor:pointer;
}

.pm-vp2-post-avatar{
    display:grid;
    width:42px;
    height:42px;
    place-items:center;
    overflow:hidden;
    border-radius:50%;
    background:#edf2f8;
}

.pm-vp2-post-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.pm-vp2-post > p{
    margin:14px 0 0;
    color:#42546d;
    line-height:1.65;
    white-space:pre-wrap;
}

@media(max-width:1050px){

    .pm-vp2-book-layout{
        grid-template-columns:1fr;
    }

    .pm-vp2-summary{
        position:static;
    }

    .pm-vp2-session-grid{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }
}

@media(max-width:760px){

    .pm-vp2-owner-toolbar{
        align-items:flex-start;
        flex-direction:column;
    }

    .pm-vp2-toolbar-actions{
        width:100%;
    }

    .pm-vp2-toolbar-actions button{
        flex:1;
    }

    .pm-vp2-cover{
        min-height:200px;
    }

    .pm-vp2-identity{
        align-items:flex-start;
        padding:0 16px 18px;
    }

    .pm-vp2-logo-wrap{
        margin-top:-42px;
    }

    .pm-vp2-logo{
        width:84px;
        height:84px;
        border-radius:18px;
    }

    .pm-vp2-name h2{
        margin-top:10px;
        font-size:22px;
    }

    .pm-vp2-tabs{
        justify-content:flex-start;
        overflow-x:auto;
    }

    .pm-vp2-tabs button{
        flex:0 0 auto;
        padding:13px 17px;
    }

    .pm-vp2-content{
        padding:14px;
    }

    .pm-vp2-about-grid{
        grid-template-columns:1fr;
    }

    .pm-vp2-about-copy,
    .pm-vp2-gallery-card,
    .pm-vp2-map-card{
        grid-column:auto;
    }

    .pm-vp2-gallery{
        grid-template-columns:
            repeat(2,minmax(0,1fr));
    }

    .pm-vp2-session-grid{
        grid-template-columns:1fr;
    }

    .pm-vp2-compose{
        grid-template-columns:36px 1fr;
    }

    .pm-vp2-compose-avatar{
        width:36px;
        height:36px;
    }

    .pm-vp2-compose button{
        grid-column:2;
        width:100%;
    }
}


/* =========================================================
   VENUE BRAND LOGO — SAME logo_image AS VENUE PAGE
   ========================================================= */

.dp-venue-brand-logo{
    display:grid !important;
    width:126px;
    max-width:100%;
    min-height:82px;
    padding:8px !important;
    place-items:center;
    overflow:hidden;
    border-radius:14px;
    background:rgba(255,255,255,.96);
}

.dp-venue-brand-logo img{
    display:block;
    width:100%;
    height:76px;
    object-fit:contain;
}

.dp-venue-brand-logo > span{
    display:grid;
    width:100%;
    min-height:70px;
    place-items:center;
    color:#7d89a0;
    font-size:12px;
    font-weight:850;
    letter-spacing:.08em;
    text-transform:uppercase;
}


/* =========================================================
   DIRECT BOOKING QR
   ========================================================= */

.pm-vp2-booking-qr{
    display:grid;
    gap:14px;
    margin-top:18px;
    padding-top:18px;
    border-top:1px solid #e1e7ef;
}

.pm-vp2-booking-qr-title small{
    color:#8290a4;
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
}

.pm-vp2-booking-qr-title h4{
    margin:3px 0 0;
    color:#132a49;
    font-size:15px;
}

.pm-vp2-qr-layout{
    display:grid;
    grid-template-columns:132px minmax(0,1fr);
    gap:14px;
    align-items:center;
}

.pm-vp2-qr-frame{
    position:relative;
    width:132px;
    aspect-ratio:1;
    padding:7px;
    overflow:hidden;
    border:1px solid #d8e0ea;
    border-radius:11px;
    background:#fff;
}

.pm-vp2-qr-code{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    image-rendering:pixelated;
}

.pm-vp2-qr-logo{
    position:absolute;
    top:50%;
    left:50%;
    display:grid;
    width:38px;
    height:38px;
    padding:4px;
    place-items:center;
    overflow:hidden;
    border:3px solid #fff;
    border-radius:9px;
    background:#fff;
    transform:translate(-50%,-50%);
    box-shadow:0 2px 7px rgba(15,35,65,.14);
}

.pm-vp2-qr-logo img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
}

.pm-vp2-qr-logo-fallback{
    color:#8090a6;
    font-size:7px;
    font-weight:900;
}

.pm-vp2-qr-fallback{
    display:grid;
    width:100%;
    height:100%;
    place-items:center;
    background:#f5f7fa;
    color:#8794a7;
    font-weight:900;
}

.pm-vp2-qr-copy{
    min-width:0;
}

.pm-vp2-qr-copy p{
    margin:0 0 9px;
    color:#65758b;
    font-size:12px;
    line-height:1.5;
}

.pm-vp2-qr-url{
    overflow:hidden;
    padding:8px 10px;
    border:1px solid #d9e1ec;
    border-radius:8px;
    background:#f6f8fc;
    color:#2451ad;
    font-size:11px;
    font-weight:750;
    text-overflow:ellipsis;
    white-space:nowrap;
}


/* Mobile */

@media(max-width:760px){

    .dp-venue-brand-logo{
        width:72px;
        min-height:58px;
        padding:5px !important;
        border-radius:10px;
    }

    .dp-venue-brand-logo img{
        height:50px;
    }

    .dp-venue-brand-logo > span{
        min-height:48px;
        font-size:9px;
    }

    .pm-vp2-qr-layout{
        grid-template-columns:104px minmax(0,1fr);
        gap:11px;
    }

    .pm-vp2-qr-frame{
        width:104px;
        padding:5px;
    }

    .pm-vp2-qr-logo{
        width:32px;
        height:32px;
    }
}

@media(max-width:420px){

    .pm-vp2-qr-layout{
        grid-template-columns:1fr;
    }

    .pm-vp2-qr-frame{
        width:min(170px,70%);
        margin:auto;
    }

    .pm-vp2-qr-copy{
        text-align:center;
    }
}


/* ==========================================================
   V2.3 — PICKLE MANIA BOOKING VISUAL LANGUAGE
   ========================================================== */

.pm-vp2{
    --pm-book-lime:#9be300;
    --pm-book-lime-dark:#69a900;
    --pm-book-lime-soft:#f0f9dc;
    --pm-book-navy:#071d42;
}


/* Book tab */

.pm-vp2-tabs button.active{
    color:var(--pm-book-lime-dark);
}

.pm-vp2-tabs button.active::after{
    background:var(--pm-book-lime);
}

.pm-vp2-book-head small{
    color:var(--pm-book-lime-dark);
}


/* Date rail */

.pm-vp2-date-strip button.active{
    border-color:var(--pm-book-lime);
    background:var(--pm-book-lime);
    color:#fff;
    box-shadow:
        0 8px 18px rgba(119,181,0,.18);
}

.pm-vp2-date-arrow{
    color:#16428a;
}

.pm-vp2-date-arrow:hover:not(:disabled){
    border-color:var(--pm-book-lime);
    background:#f8fde9;
    color:var(--pm-book-lime-dark);
}


/* Open slots */

.pm-vp2-open-slot{
    min-height:58px;
    border:1px solid #d3e8a6;
    background:var(--pm-book-lime-soft);
    color:var(--pm-book-lime-dark);
    transition:
        background .14s ease,
        border-color .14s ease,
        color .14s ease,
        transform .14s ease;
}

.pm-vp2-open-slot:hover{
    border-color:var(--pm-book-lime);
    background:#e8f7bd;
}

.pm-vp2-open-slot.selected{
    border-color:var(--pm-book-lime-dark);
    background:
        linear-gradient(
            135deg,
            #7fd500,
            #a4eb00
        );
    color:#fff;
    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.28),
        0 6px 15px rgba(94,154,0,.15);
}

.pm-vp2-open-slot.selected small{
    color:#fff;
    font-weight:800;
}

.pm-vp2-slot-check{
    display:block;
    margin-bottom:-1px;
    color:#fff;
    font-size:17px;
    line-height:1;
}


/* Booking summary */

.pm-vp2-book-button{
    background:
        linear-gradient(
            90deg,
            #84d700,
            #a6e600
        );
    color:#fff;
}

.pm-vp2-summary .total dd{
    color:var(--pm-book-navy);
}


/* Empty selection helper */

.pm-vp2-selection-guide{
    display:flex;
    width:100%;
    gap:13px;
    align-items:center;
    margin-top:14px;
    padding:15px 18px;
    border:1px solid #d8d0ff;
    border-radius:12px;
    background:#f1edff;
    color:#4826b3;
}

.pm-vp2-selection-guide > span{
    display:grid;
    flex:0 0 31px;
    width:31px;
    height:31px;
    place-items:center;
    border-radius:50%;
    background:#693cf0;
    color:#fff;
    font-weight:900;
}

.pm-vp2-selection-guide > div{
    display:grid;
    gap:2px;
}

.pm-vp2-selection-guide b{
    font-size:13px;
}

.pm-vp2-selection-guide small{
    color:#6f62a6;
}


/* The balloon */

.pm-vp2-selection-balloon{
    display:grid;
    grid-template-columns:
        auto minmax(0,1fr) auto auto;
    gap:14px;
    align-items:center;
    width:100%;
    margin-top:14px;
    padding:14px 18px;
    border:1px solid #82bf00;
    border-radius:13px;
    background:
        linear-gradient(
            90deg,
            #94dd00,
            #a8e900
        );
    color:#fff;
    box-shadow:
        0 10px 26px rgba(92,143,0,.18);
}

.pm-vp2-balloon-toggle{
    font-size:18px;
    font-weight:900;
}

.pm-vp2-balloon-copy{
    display:grid;
    min-width:0;
    gap:2px;
}

.pm-vp2-balloon-copy b{
    font-size:15px;
}

.pm-vp2-balloon-copy small{
    overflow:hidden;
    color:rgba(255,255,255,.94);
    font-size:11px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.pm-vp2-balloon-clear{
    border:0;
    background:transparent;
    color:#fff;
    font-weight:800;
    cursor:pointer;
}

.pm-vp2-balloon-checkout{
    min-width:150px;
    padding:11px 17px;
    border:1px solid #143360;
    border-radius:10px;
    background:#fff;
    color:#0b2349;
    font-weight:900;
}

.pm-vp2-balloon-checkout:disabled{
    opacity:.85;
    cursor:not-allowed;
}


/* QR download */

.pm-vp2-qr-download{
    width:100%;
    margin-top:9px;
    padding:9px 10px;
    border:1px solid #d6deea;
    border-radius:8px;
    background:#fff;
    color:#1e4ea6;
    font-size:12px;
    font-weight:850;
    cursor:pointer;
}

.pm-vp2-qr-download:hover{
    border-color:#9fb5dc;
    background:#f4f7fd;
}


/* Mobile */

@media(max-width:760px){

    .pm-vp2-selection-balloon{
        grid-template-columns:
            auto minmax(0,1fr);
        gap:9px 11px;
        padding:13px;
    }

    .pm-vp2-balloon-clear{
        grid-column:1;
        width:100%;
        min-height:42px;
        border:1px solid rgba(255,255,255,.45);
        border-radius:8px;
    }

    .pm-vp2-balloon-checkout{
        grid-column:2;
        width:100%;
        min-width:0;
        min-height:42px;
    }

    .pm-vp2-balloon-copy b{
        font-size:13px;
    }

    .pm-vp2-selection-guide{
        align-items:flex-start;
        padding:13px;
    }
}


/* ==========================================================
   FLOATING BOOKING SELECTION BAR
   ========================================================== */

.pm-vp2-selection-balloon{
    position:fixed !important;

    left:
        calc(
            var(--owner-rail-width, 292px) +
            28px
        );

    right:28px;
    bottom:18px;

    z-index:9999;

    width:auto !important;
    max-width:none;

    margin:0 !important;

    border:1px solid #76b800;

    box-shadow:
        0 16px 42px rgba(36,73,0,.28),
        0 3px 8px rgba(13,30,58,.16);

    backdrop-filter:
        blur(10px);
}


/*
 * Add breathing room to the Venue Page whenever
 * the user has scrolled near the bottom.
 *
 * This keeps the floating booking bar from visually
 * sitting on top of the last rows / QR area.
 */
.pm-vp2-content{
    padding-bottom:110px;
}


/* When owner sidebar is collapsed, allow more width. */
body:has(.owner-rail.collapsed)
.pm-vp2-selection-balloon{
    left:28px;
}


/* Desktop shell fallback if rail width token is unavailable. */
@media(min-width:1100px){

    .pm-vp2-selection-balloon{
        left:max(
            320px,
            calc(
                env(safe-area-inset-left) +
                28px
            )
        );
    }
}


/* Tablet / narrow owner shell */
@media(max-width:1099px){

    .pm-vp2-selection-balloon{
        left:18px;
        right:18px;
        bottom:14px;
    }
}


/* Mobile */
@media(max-width:760px){

    .pm-vp2-content{
        padding-bottom:150px;
    }

    .pm-vp2-selection-balloon{
        left:
            calc(
                10px +
                env(safe-area-inset-left)
            );

        right:
            calc(
                10px +
                env(safe-area-inset-right)
            );

        bottom:
            calc(
                10px +
                env(safe-area-inset-bottom)
            );

        grid-template-columns:
            minmax(0,1fr) auto;

        gap:8px 10px;

        padding:12px;

        border-radius:14px;
    }

    .pm-vp2-balloon-toggle{
        display:none;
    }

    .pm-vp2-balloon-copy{
        grid-column:1/-1;
    }

    .pm-vp2-balloon-copy b{
        font-size:14px;
    }

    .pm-vp2-balloon-copy small{
        font-size:11px;
        white-space:normal;
    }

    .pm-vp2-balloon-clear{
        grid-column:1;
        min-height:44px;
    }

    .pm-vp2-balloon-checkout{
        grid-column:2;
        min-width:140px;
        min-height:44px;
    }
}


@media(max-width:420px){

    .pm-vp2-selection-balloon{
        grid-template-columns:1fr 1fr;
    }

    .pm-vp2-balloon-checkout{
        min-width:0;
    }
}


/* ==========================================================
   FLOATING BALLOON — EXPAND / COLLAPSE
   ========================================================== */

.pm-vp2-balloon-toggle{
    display:grid;
    width:38px;
    height:38px;
    padding:0;
    place-items:center;
    border:1px solid rgba(255,255,255,.42);
    border-radius:9px;
    background:rgba(35,76,0,.18);
    color:#fff;
    font-size:17px;
    font-weight:900;
    cursor:pointer;
}

.pm-vp2-balloon-toggle:hover{
    background:rgba(35,76,0,.28);
}

.pm-vp2-balloon-toggle:focus-visible{
    outline:3px solid rgba(255,255,255,.72);
    outline-offset:2px;
}


/*
 * Expanded bar grows UPWARD because bottom remains fixed.
 */
.pm-vp2-selection-balloon.expanded{
    grid-template-columns:
        auto minmax(0,1fr) auto auto;

    max-height:min(520px,72vh);

    overflow:auto;

    align-items:center;
}


/*
 * Selected schedule list occupies entire next row.
 */
.pm-vp2-balloon-details{
    grid-column:1/-1;

    display:grid;
    gap:7px;

    max-height:310px;
    overflow:auto;

    padding:10px;

    border-top:
        1px solid rgba(255,255,255,.34);

    border-bottom:
        1px solid rgba(255,255,255,.34);

    background:
        rgba(255,255,255,.12);

    border-radius:10px;
}


.pm-vp2-balloon-item{
    display:grid;
    grid-template-columns:
        28px minmax(0,1fr) auto 34px;

    gap:9px;
    align-items:center;

    min-height:54px;

    padding:8px 10px;

    border:
        1px solid rgba(255,255,255,.34);

    border-radius:9px;

    background:
        rgba(255,255,255,.16);
}


.pm-vp2-balloon-item-check{
    display:grid;
    width:25px;
    height:25px;
    place-items:center;

    border-radius:50%;

    background:#fff;
    color:#72b500;

    font-size:14px;
    font-weight:900;
}


.pm-vp2-balloon-item-copy{
    display:grid;
    min-width:0;
    gap:2px;
}


.pm-vp2-balloon-item-copy b{
    color:#fff;
    font-size:13px;
}


.pm-vp2-balloon-item-copy small{
    overflow:hidden;

    color:rgba(255,255,255,.9);

    font-size:11px;

    text-overflow:ellipsis;
    white-space:nowrap;
}


.pm-vp2-balloon-item-price{
    color:#fff;
    font-size:13px;
    white-space:nowrap;
}


.pm-vp2-balloon-item-remove{
    display:grid;
    width:32px;
    height:32px;
    padding:0;
    place-items:center;

    border:
        1px solid rgba(255,255,255,.42);

    border-radius:8px;

    background:
        rgba(40,70,0,.16);

    color:#fff;

    font-size:20px;
    line-height:1;

    cursor:pointer;
}


.pm-vp2-balloon-item-remove:hover{
    background:
        rgba(40,70,0,.3);
}


/* Mobile expansion */

@media(max-width:760px){

    /*
     * Earlier mobile rule hid this button;
     * explicitly restore it now.
     */
    .pm-vp2-balloon-toggle{
        display:grid !important;
    }


    .pm-vp2-selection-balloon.expanded{
        grid-template-columns:
            38px minmax(0,1fr);

        max-height:
            calc(
                100vh -
                90px
            );
    }


    .pm-vp2-selection-balloon.expanded
    .pm-vp2-balloon-details{
        grid-column:1/-1;

        max-height:
            min(
                360px,
                48vh
            );
    }


    .pm-vp2-selection-balloon.expanded
    .pm-vp2-balloon-clear{
        grid-column:1;
    }


    .pm-vp2-selection-balloon.expanded
    .pm-vp2-balloon-checkout{
        grid-column:2;
    }


    .pm-vp2-balloon-item{
        grid-template-columns:
            25px minmax(0,1fr) auto 34px;

        padding:8px;
    }


    .pm-vp2-balloon-item-copy small{
        white-space:normal;
    }
}


@media(max-width:420px){

    .pm-vp2-balloon-item{
        grid-template-columns:
            24px minmax(0,1fr) 32px;
    }


    .pm-vp2-balloon-item-price{
        grid-column:2;
        grid-row:2;
    }


    .pm-vp2-balloon-item-remove{
        grid-column:3;
        grid-row:1/3;
    }
}


/* ==========================================================
   CANONICAL COMPACT FLOATING BOOKING BALLOON
   Final sizing authority for Venue Page selection balloon.
   ========================================================== */

.pm-vp2-selection-balloon{
    padding:9px 12px !important;
    gap:8px 10px !important;

    border-radius:11px !important;

    min-height:0 !important;

    box-shadow:
        0 8px 22px rgba(70,110,0,.20) !important;
}


/* Header arrow */

.pm-vp2-balloon-toggle{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;

    border-radius:7px !important;

    font-size:14px !important;
}


/* Header copy */

.pm-vp2-balloon-copy{
    gap:0 !important;
}

.pm-vp2-balloon-copy b{
    font-size:13px !important;
    line-height:1.25 !important;
}

.pm-vp2-balloon-copy small{
    margin-top:2px !important;

    font-size:10px !important;
    line-height:1.3 !important;
}


/* Expanded state */

.pm-vp2-selection-balloon.expanded{
    max-height:min(360px,56vh) !important;

    padding:
        9px 12px !important;

    gap:
        7px 10px !important;
}


/*
 * Compact selected slot list.
 * Scroll only the schedule list if many slots
 * are selected, not the whole balloon.
 */
.pm-vp2-balloon-details{
    gap:4px !important;

    max-height:190px !important;

    padding:6px !important;

    border-radius:8px !important;
}


/* One selected schedule */

.pm-vp2-balloon-item{
    grid-template-columns:
        22px minmax(0,1fr) auto 28px !important;

    gap:6px !important;

    min-height:38px !important;

    padding:
        5px 7px !important;

    border-radius:
        7px !important;
}


.pm-vp2-balloon-item-check{
    width:20px !important;
    height:20px !important;

    font-size:11px !important;
}


.pm-vp2-balloon-item-copy{
    gap:0 !important;
}


.pm-vp2-balloon-item-copy b{
    font-size:11px !important;
    line-height:1.2 !important;
}


.pm-vp2-balloon-item-copy small{
    margin-top:1px !important;

    font-size:9px !important;
    line-height:1.25 !important;
}


.pm-vp2-balloon-item-price{
    font-size:11px !important;
}


.pm-vp2-balloon-item-remove{
    width:26px !important;
    height:26px !important;

    border-radius:6px !important;

    font-size:15px !important;
}


/* Bottom actions */

.pm-vp2-balloon-clear{
    min-height:34px !important;

    padding:
        5px 10px !important;

    border-radius:
        7px !important;

    font-size:
        11px !important;
}


.pm-vp2-balloon-checkout{
    min-width:130px !important;
    min-height:34px !important;

    padding:
        6px 14px !important;

    border-radius:
        8px !important;

    font-size:
        12px !important;
}


/* ------------------------------------------
   Mobile
   ------------------------------------------ */

@media(max-width:760px){

    .pm-vp2-selection-balloon{
        left:
            calc(
                7px +
                env(safe-area-inset-left)
            ) !important;

        right:
            calc(
                7px +
                env(safe-area-inset-right)
            ) !important;

        bottom:
            calc(
                7px +
                env(safe-area-inset-bottom)
            ) !important;

        padding:
            8px 9px !important;
    }


    .pm-vp2-selection-balloon.expanded{
        max-height:
            min(
                330px,
                52vh
            ) !important;
    }


    .pm-vp2-balloon-details{
        max-height:
            170px !important;
    }


    .pm-vp2-balloon-item{
        grid-template-columns:
            20px minmax(0,1fr) auto 26px !important;

        min-height:
            36px !important;

        padding:
            4px 6px !important;
    }


    .pm-vp2-balloon-copy b{
        font-size:
            12px !important;
    }


    .pm-vp2-balloon-copy small{
        font-size:
            9px !important;
    }


    .pm-vp2-balloon-clear,
    .pm-vp2-balloon-checkout{
        min-height:
            36px !important;
    }
}


@media(max-width:420px){

    .pm-vp2-selection-balloon.expanded{
        max-height:
            300px !important;
    }


    .pm-vp2-balloon-details{
        max-height:
            145px !important;
    }


    .pm-vp2-balloon-item{
        grid-template-columns:
            20px minmax(0,1fr) 26px !important;
    }


    .pm-vp2-balloon-item-price{
        grid-column:
            2 !important;

        grid-row:
            2 !important;

        font-size:
            10px !important;
    }
}