/* Tom Photography Suite — responsive system layer.
   Uses container queries so elements respond to the Avada column/container they
   actually occupy, not only to the browser viewport. */

.tpb-v4,
.tpa-availability,
.pgp-avada-gallery,
.tpscg-login,
.tpscg-gallery,
.tps220-element,
.tps220-unavailable{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    container-type:inline-size;
}
.tpb-v4 *,
.tpa-availability *,
.pgp-avada-gallery *,
.tpscg-login *,
.tpscg-gallery *,
.tps220-element *,
.tps220-unavailable *{
    min-width:0;
    box-sizing:border-box;
}
.tpb-v4 img,
.tpa-availability img,
.pgp-avada-gallery img,
.tpscg-gallery img,
.tps220-element img{
    max-width:100%;
    height:auto;
}

/* Booking element */
@container (max-width: 820px){
    .tpb-v4{
        --tpb-padding:clamp(18px,4cqw,28px);
        margin:clamp(16px,3cqw,28px) 0;
    }
    .tpb-v4 .tpb-form-grid,
    .tpb-v4 .tpb-duration-wrap,
    .tpb-v4 .tpb-confirmation-details{
        grid-template-columns:1fr;
    }
    .tpb-v4 .tpb-form-grid label.full{grid-column:auto}
    .tpb-v4 .tpb-booking-action{
        grid-template-columns:minmax(0,1fr) minmax(190px,260px);
        justify-content:stretch;
    }
    .tpb-v4 .tpb-booking-action .tpb-estimate{
        width:100%;
        max-width:none;
        min-width:0;
    }
    .tpb-v4 .tpb-booking-action .tpb-submit{
        width:100%;
        max-width:none;
        min-width:0;
    }
}
@container (max-width: 560px){
    .tpb-v4{
        --tpb-padding:16px;
        --tpb-heading-size:clamp(25px,8cqw,32px);
        border-radius:min(var(--tpb-panel-radius),14px);
    }
    .tpb-v4 .tpb-calendar{padding:12px}
    .tpb-v4 .tpb-week,
    .tpb-v4 .tpb-days{gap:3px}
    .tpb-v4 .tpb-day{
        padding:9px 1px;
        font-size:13px;
    }
    .tpb-v4 .tpb-times{gap:7px}
    .tpb-v4 .tpb-time{
        flex:1 1 calc(50% - 7px);
        padding:10px 8px;
        text-align:center;
    }
    .tpb-v4 .tpb-booking-action{
        grid-template-columns:1fr;
    }
    .tpb-v4 .tpb-booking-action .tpb-estimate,
    .tpb-v4 .tpb-booking-action .tpb-submit{
        grid-column:1;
        width:100%;
        justify-self:stretch;
    }
    .tpb-v4 .tpb-confirmation h2{font-size:clamp(25px,8cqw,30px)}
}
@container (max-width: 380px){
    .tpb-v4 .tpb-cal-top{grid-template-columns:36px 1fr 36px}
    .tpb-v4 .tpb-week{font-size:10px}
    .tpb-v4 .tpb-day{font-size:12px}
    .tpb-v4 .tpb-time{flex-basis:100%}
}

/* Availability element */
@container (max-width: 700px){
    .tpa-availability{
        padding:clamp(14px,4cqw,22px);
    }
    .tpa-availability .tpa-head{
        gap:12px;
        flex-wrap:wrap;
    }
    .tpa-availability .tpa-calendar{padding:12px}
    .tpa-availability .tpa-week,
    .tpa-availability .tpa-days{gap:3px}
    .tpa-availability .tpa-day{
        min-width:0;
        padding:9px 1px;
        font-size:13px;
    }
    .tpa-availability .tpa-legend{
        flex-wrap:wrap;
        gap:8px 14px;
    }
}
@container (max-width: 420px){
    .tpa-availability .tpa-cal-top{grid-template-columns:36px 1fr 36px}
    .tpa-availability .tpa-week{font-size:10px}
    .tpa-availability .tpa-day{font-size:12px}
}

/* Existing WooCommerce photo purchase gallery */
@container (max-width: 1180px){
    .pgp-avada-gallery{
        grid-template-columns:minmax(0,1fr) minmax(280px,36%);
        gap:clamp(16px,3cqw,28px);
    }
    .pgp-avada-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}
@container (max-width: 860px){
    .pgp-avada-gallery{
        display:block;
        overflow:visible;
    }
    /* Keep the cart off-canvas on phones/tablets. Do not let it reserve
       vertical space inside the gallery when it is closed. */
    .pgp-avada-cart{
        position:fixed!important;
        right:12px!important;
        left:auto!important;
        top:12px!important;
        width:min(var(--pgp-cart-width,480px),calc(100vw - 24px))!important;
        max-width:calc(100vw - 24px)!important;
        min-height:0!important;
        height:auto!important;
        max-height:calc(100dvh - 24px)!important;
        margin:0!important;
        transform:translateX(calc(100% + 36px))!important;
        transition:transform .2s ease!important;
        overflow:auto;
    }
    .pgp-avada-cart.is-open{
        transform:translateX(0)!important;
    }
    .pgp-avada-mobile-cart-toggle{
        display:inline-flex!important;
        margin:0 0 12px!important;
    }
    .pgp-avada-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .pgp-avada-toolbar{
        flex-wrap:wrap;
        gap:12px;
        margin-bottom:16px;
    }
    .pgp-avada-actions{
        width:100%;
        flex-wrap:wrap;
    }
    .pgp-avada-licence-warning{
        align-items:flex-start;
        flex-wrap:wrap;
    }
}
@container (max-width: 520px){
    .pgp-avada-grid{grid-template-columns:1fr!important}
    .pgp-avada-actions{
        display:grid!important;
        grid-template-columns:1fr 1fr!important;
    }
    .pgp-avada-buy{grid-column:1/-1}
    .pgp-avada-licence-warning-link{
        width:100%;
        margin-left:40px;
        white-space:normal;
    }
}

/* Private client gallery */
@container (max-width: 1000px){
    .tpscg-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@container (max-width: 760px){
    .tpscg-head{
        align-items:flex-start!important;
        flex-direction:column!important;
    }
    .tpscg-download-all{
        width:100%!important;
    }
    .tpscg-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .tpscg-toolbar{
        align-items:flex-start!important;
        flex-wrap:wrap;
    }
}
@container (max-width: 500px){
    .tpscg-login{padding:22px!important}
    .tpscg-code-form{grid-template-columns:1fr!important}
    .tpscg-code-form button{width:100%}
    .tpscg-grid{grid-template-columns:1fr!important}
    .tpscg-photo-foot{flex-wrap:wrap}
}

/* v2.2+ Avada elements */
.tps220-element{
    overflow-wrap:anywhere;
}
.tps220-element > h2{
    font-size:clamp(22px,5cqw,36px);
}
@container (max-width: 880px){
    .tps220-cards > div{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .tps220-responsive-grid,
    .tps220-stats{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
}
@container (max-width: 560px){
    .tps220-cards > div,
    .tps220-responsive-grid,
    .tps220-stats{
        grid-template-columns:1fr!important;
    }
    .tps220-cards article{
        padding:18px!important;
    }
    .tps220-find-date{
        padding:18px!important;
    }
    .tps220-find-date > div{
        align-items:stretch!important;
        flex-direction:column;
    }
    .tps220-find-date label{
        width:100%!important;
        min-width:0!important;
    }
    .tps220-find-date input,
    .tps220-find-date button{
        width:100%!important;
    }
    .tps220-exif > div{
        gap:12px!important;
    }
    .tps220-count{
        font-size:clamp(30px,12cqw,38px)!important;
    }
}

/* Fallbacks for browsers without container-query support. */
@media(max-width:820px){
    .tpb-v4 .tpb-form-grid,.tpb-v4 .tpb-duration-wrap,.tpb-v4 .tpb-confirmation-details{grid-template-columns:1fr}
}
@media(max-width:760px){
    .pgp-avada-gallery{display:block}
    .tpscg-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:520px){
    .pgp-avada-grid,.tpscg-grid,.tps220-cards>div,.tps220-responsive-grid,.tps220-stats{grid-template-columns:1fr!important}
}

/* Prevent long dynamic values, URLs and buttons from forcing overflow. */
.tpb-v4 a,.tpa-availability a,.pgp-avada-gallery a,.tpscg-gallery a,.tps220-element a,
.tpb-v4 button,.tpa-availability button,.pgp-avada-gallery button,.tpscg-gallery button,.tps220-element button{
    max-width:100%;
}


/* Client Gallery access card typography must not inherit oversized Avada H1 styles. */
.tpscg-login h1{
    max-width:100%;
    font-size:clamp(32px,7vw,58px)!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
}
@container (max-width: 520px){
    .tpscg-login h1{
        font-size:clamp(28px,10cqw,40px)!important;
        line-height:1.04!important;
    }
    .tpscg-login p{font-size:clamp(14px,4.3cqw,16px)!important}
    .tpscg-code-form label{font-size:clamp(14px,4.2cqw,16px)!important}
    .tpscg-code-form input{font-size:clamp(18px,6cqw,22px)!important}
    .tpscg-code-form button{font-size:clamp(15px,4.5cqw,17px)!important}
}
@container (max-width: 360px){
    .tpscg-login{padding:16px 14px!important}
    .tpscg-login h1{font-size:clamp(27px,9.5cqw,34px)!important}
    .tpscg-kicker{letter-spacing:.06em}
}


@container (max-width: 520px){
    .pgp-avada-gallery{font-size:14px}
    .pgp-avada-heading{margin-bottom:14px!important}
    .pgp-avada-quality-notice,
    .pgp-avada-licence-warning{
        margin-bottom:12px!important;
        padding:12px 13px!important;
    }
    .pgp-avada-mobile-cart-toggle{margin-bottom:10px!important}
    .pgp-avada-toolbar{
        margin-bottom:12px!important;
        padding:12px!important;
    }
    .pgp-avada-grid{gap:12px!important}
    .pgp-avada-message{margin-top:10px!important}
    .pgp-avada-licence-footer{margin-top:12px!important}
}