/* Changes that must reach returning visitors at once: this file gets a new address with every change.
   Offer cards (#208, mockups docs/requirements/pasiulymu-*.png), the cart (#206),
   and pages that scrolled sideways. */

/* Offer cards: the sizes come from the mockups, measured against today's card (243 in the mockup = 328 px real, ×1.35).
   Mockup photo 337×275, title 15/18 of today's height (24 → 20 px), icons 16/26 of today's (60 → 36 px box; the drawing
   fills 55% of its box's height, which gives the mockup's 21 px).
   The homepage's wide card is the second mockup: same title and icon sizes as today, photo 14:9, same block height. */
.single-pasiulymas .pasiulymas-foto img{
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 337 / 275;
    object-fit: cover;
}
.pasiulymai-home-grid .pasiulymas-foto img{
    aspect-ratio: 14 / 9;
}

/* The pieces of a card carry their own side padding: on the two grids below the wrapper around
   them does not exist as a box. */
.single-pasiulymas > .p-15{
    padding: 0;
}
.single-pasiulymas .pasiulymas-title{
    margin: 0;
    padding: 15px 15px 0;
    font-size: 20px;
    line-height: 1.25;
    text-wrap: balance;
}
.pasiulymai-home-grid .pasiulymas-title{
    font-size: 24px;
}
.pasiulymai-po-event-nuotrauka .single-pasiulymas .pasiulymas-title{
    margin: 0;
    padding: 12px 15px 0;
    font-size: 17px;
}

/* Text: one line, as in the second mockup. A short text stays whole, a long one is cut; „Pirkti“ opens the offer's page with all of it.
   Cut by line count, not with a no-wrap line: a no-wrap line would stretch the concert page's slides to the text's full length.
   The inner paragraphs run inline so the line is counted the same in every browser. */
.single-pasiulymas .pasiulymas-aprasymas{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    overflow: hidden;
    margin: 6px 15px 0;
    font-size: 16px;
    line-height: 1.5;
    max-height: 1.5em;
}
.pasiulymai-po-event-nuotrauka .p-15 .pasiulymas-aprasymas{
    font-size: 13px;
    min-height: 1.5em;
}
.single-pasiulymas .pasiulymas-aprasymas *{
    display: inline;
    margin: 0;
}
.single-pasiulymas .pasiulymas-aprasymas br{
    display: none;
}

/* Icons: two equal columns across the whole card, as in the first mockup (first box 20 px in, second 228 px at a 447 px
   card, rows 45 px apart); a single one sits in the middle. */
.single-pasiulymas .pasiulymas-benefits{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 10px;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 14px 4.5% 0;
    align-content: start;
}
.single-pasiulymas .single-benefit{
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
}
.single-pasiulymas .pasiulymas-benefits:has(> .single-benefit:only-child){
    grid-template-columns: auto;
    justify-content: center;
}
/* Homepage's wide cards: the second mockup keeps today's 60 px box; first box 50 px in at a 683 px card. */
@media screen and (min-width: 1200px){
    .pasiulymai-home-grid .pasiulymas-benefits{
        row-gap: 0;
        padding: 28px 7.3% 0;
    }
    .pasiulymai-home-grid .single-benefit{
        grid-template-columns: 60px minmax(0, 1fr);
    }
    .pasiulymai-home-grid .single-pasiulymas .addtopasiul{
        padding-top: 21px;
    }
}

/* „Pirkti“ on the card's last line. */
.single-pasiulymas .addtopasiul{
    margin-top: auto;
    margin-bottom: 0;
    padding: 13px 15px 15px;
}
/* On the two grids that line is already the same height in every card of a row: start at its top, so the
   „Kviečiame užsukti!“ line of an offer with nothing to buy (1 px lower than a button) stays level with „Pirkti“. */
.pasiulymai-templ .single-pasiulymas .addtopasiul,
.pasiulymai-home-grid .single-pasiulymas .addtopasiul{
    margin-top: 0;
}

/* Offers page and homepage: rows of cards. Each card takes five rows of the page's grid (photo, title,
   text, icons, „Pirkti“), so the same piece starts on the same line across a row of cards.
   Offers page: 3 in a row. The first mockup's card is 337 ÷ 243 = 1.39× wider than today's; going from
   4 to 3 cards makes it 447 ÷ 328 = 1.36× wider (measured at 1440 px). */
.pasiulymai-templ{
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 0;
}
.pasiulymai-home-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    row-gap: 0;
}
.pasiulymai-templ .single-pasiulymas,
.pasiulymai-home-grid .single-pasiulymas{
    display: grid;
    grid-row: span 5;
    grid-template-rows: subgrid;
    row-gap: 0;
    margin-bottom: 20px;
}
.pasiulymai-home-grid .single-pasiulymas{
    margin-bottom: 15px;
}
.pasiulymai-templ .single-pasiulymas > .p-15,
.pasiulymai-home-grid .single-pasiulymas > .p-15{
    display: contents;
}
/* Below the homepage's 24 px title fitting one line: the same 20 px as everywhere else. */
@media screen and (max-width: 1399px){
    .pasiulymai-home-grid .pasiulymas-title{
        font-size: 20px;
    }
}
@media screen and (max-width: 1199px){
    .pasiulymai-templ{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* Tablets upright keep two cards in a row: one card 720 px wide had a 576 px tall photo. */
@media screen and (min-width: 641px) and (max-width: 768px){
    .pasiulymai-templ,
    .pasiulymai-home-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr))!important;
    }
}
@media screen and (max-width: 480px){
    .pasiulymai-templ .pasiulymas-title,
    .pasiulymai-home-grid .pasiulymas-title{
        font-size: 18px;
    }
}

/* Cart. One size for every gap in the right column (15 px), the two big buttons identical, the coupon row one height. */
.woocommerce-cart main h1{
    font-weight: 600;
}
.woocommerce-cart .cart-collaterals{
    margin-top: 40px;
}
.woocommerce-cart .cart_totals h2{
    margin: 0 0 15px;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.25;
}
.woocommerce-cart .cart_totals table.shop_table{
    margin: 0;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout{
    margin: 15px 0 0;
    padding: 0;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .cart_totals a.mvo-continue-shopping{
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 50px;
    margin: 0;
    padding: 5px 20px;
    border-radius: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    text-transform: uppercase;
}
/* „Tęsti apsipirkimą“ next to the checkout button is what „Plačiau“ is next to „Pirkti“: outlined in the same green. */
.woocommerce-cart .cart_totals a.mvo-continue-shopping{
    margin-top: 15px;
    border: 2px solid #3C594C;
    background: #FFFFFF;
    color: #3C594C;
}
.woocommerce-cart .cart_totals a.mvo-continue-shopping:hover,
.woocommerce-cart .cart_totals a.mvo-continue-shopping:focus{
    background: #3C594C;
    color: #FFFFFF;
}
.woocommerce-cart table.cart td.actions .coupon .input-text,
.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce-cart table.cart td.actions > .button{
    box-sizing: border-box;
    height: 44px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 40px;
}
.woocommerce-cart table.cart td.actions .coupon .input-text{
    padding-left: 10px;
    padding-right: 10px;
    margin-right: 8px;
    font-size: 16px;
    line-height: normal;
}
.woocommerce-cart table.cart td.actions .coupon .button,
.woocommerce-cart table.cart td.actions > .button{
    padding-left: 20px;
    padding-right: 20px;
}
/* Phones: field and its button on one row, the update button under them at full width. */
@media screen and (max-width: 768px){
    .woocommerce-cart table.cart td.actions .coupon{
        display: flex;
        gap: 8px;
        padding-bottom: 8px;
    }
    .woocommerce-cart table.cart td.actions .coupon .input-text{
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        margin: 0;
    }
    .woocommerce-cart table.cart td.actions .coupon .button{
        flex: none;
        width: auto;
        padding-left: 14px;
        padding-right: 14px;
    }
    .woocommerce-cart table.cart td.actions > .button{
        width: 100%;
    }
}
@media screen and (max-width: 480px){
    .woocommerce-cart .cart_totals h2{
        font-size: 22px;
    }
}

/* Pages that scrolled sideways (measured 2026-11-04, the same on live). */

/* Homepage, 4 px at 992 and 6 px at 768: the reviews slider's arrow reached past the window. */
.home-google-rev .slick-prev{
    left: -24px;
}
.home-google-rev .slick-next{
    right: -24px;
}
/* Homepage, 9 px between 681 and 767: the page's side margin is 15 px there, not 24. */
@media screen and (max-width: 767px){
    .home-google-rev .slick-prev{
        left: -15px;
    }
    .home-google-rev .slick-next{
        right: -15px;
    }
}
/* /koncertai, up to 136 px between 768 and 1200: the calendar was wider than its column. */
.renginiai-contents .ui-datepicker-inline{
    box-sizing: border-box;
    width: 100%;
    max-width: 396px;
}
.renginiai-contents .ui-datepicker-inline table{
    width: 100%;
    table-layout: fixed;
}
@media screen and (max-width: 991px){
    .renginiai-contents .ui-datepicker-inline{
        padding-left: 8px;
        padding-right: 8px;
        font-size: 15px;
    }
}
/* /koncertai on phones, up to 57 px: a concert's text holding long unbroken lines. */
.renginiai-contents .font-gray{
    overflow-wrap: break-word;
}
/* Concert page at 320 px, 16 px (/pasaga/folk-trio-virsmas-2): the description's words joined by non-breaking
   spaces („seniau? Programa „Virsmas“ kviečia“, 34 characters) make one run wider than the column. */
.konc-description{
    overflow-wrap: break-word;
}
/* Concert page at 320 px, 26 px: an e-mail address cannot wrap by itself. */
a[href^="mailto:"]{
    overflow-wrap: anywhere;
}
/* Concert page ticket list, up to 105 px (seen on /pasaga/muzikiniai-horizontai, the same on live): a ticket's
   name, price and „Pirkti“ need a 340 px row, the column is 195–305 px between 768 and 1199 px and under
   ~370 px on phones. Where the column is narrower than 360 px the name goes above price and „Pirkti“. */
.info-flex-sec{
    min-width: 0;
    flex: 1 1 auto;
    container-type: inline-size;
}
@container (max-width: 360px){
    .single-simple-ticket-block{
        grid-template-columns: minmax(0, 1fr);
        row-gap: 8px;
    }
    .single-simple-ticket-block > div[style*="grid"]{
        display: flex!important;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px 20px;
    }
}
/* Room filter at 320 px, 51 px: the two date fields kept their natural 356 px. */
@media screen and (max-width: 768px){
    .filter-bookings .filter-single-block:nth-child(1) input{
        box-sizing: border-box;
        width: 100%;
    }
}
/* A long English word in a page title at 320 px. */
main h1{
    overflow-wrap: break-word;
}
