/* Gallery calendar page: left-aligned intro, square calendar, event actions and the ticket sheet. */
body main .rh-four-dates { margin: 32px 0 40px; padding: 0; border: 0; background: transparent; }
body main .rh-four-dates-copy { max-width: 800px; margin: 0; padding: 0; }
body main .rh-four-dates-copy p { margin: 0 0 20px; }
body main .rh-four-dates-copy a { color:#000!important; }
body main .gallery-visiting-rule,body main .gallery-visiting-rule :is(strong,b) { font-weight:400; }
html:has(main.events-page) { scroll-behavior:smooth; }
@media(prefers-reduced-motion:reduce){html:has(main.events-page){scroll-behavior:auto}}

body main .events-calendar { max-width: 560px; margin: 48px 0 64px; }
body main .events-calendar .calendar-month { margin: 0 0 24px; }
body main .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
body main .calendar-grid > span,
body main .calendar-grid > a { box-sizing: border-box; display: flex; align-items: center; justify-content: center; aspect-ratio: 1; padding: 0; border: 1px solid #e5e3df; color: #171717; text-decoration: none; }
body main .calendar-grid > span:empty { border-color: transparent; }
body main .calendar-grid > .weekday { aspect-ratio: auto; padding: 0 0 6px; border: 0; color: #727269; }
body main .calendar-grid .event-day { background: #171717; border-color: #171717; color: #fff; font-weight: 700; outline: 0; transition: background-color .2s; }
body main .calendar-grid .event-day:hover { background: #000; }
body main .calendar-grid .event-day:focus-visible { outline: 2px solid #245b94; outline-offset: 2px; }

/* Desktop: description beside the calendar; the event list stays full width below. */
@media (min-width: 901px) {
  body main.events-page { margin-top: 96px !important; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: clamp(64px, 7vw, 120px); align-items: start; max-width: 1360px; padding: 0 clamp(28px, 5vw, 72px); }
  body main.events-page > * { grid-column: 1 / -1; }
  body main.events-page > h1 { grid-column: 1; grid-row: 1; }
  body main.events-page > .rh-four-dates { grid-column: 1; grid-row: 2; margin-bottom: 0; }
  body main.events-page > .gallery-visiting-rule { grid-column: 1; grid-row: 3; margin-bottom: 104px !important; }
  body main.events-page > .events-calendar { grid-column: 2; grid-row: 1 / span 3; max-width: none; margin-top: 0; margin-bottom: 104px; }
  /* Same 32px line box as the page title, so both headings share one row. */
  body main.events-page > .events-calendar .calendar-month { display: flex; align-items: center; min-height: 32px; margin-bottom: 32px; }
}

.event-copy h2 { margin-bottom: 14px; }
body main .event-copy > p:not(.event-actions) { margin:0 0 18px!important; }
.event-date b { display:block; margin:4px 0; font-size:32px!important; line-height:1.2; }
/* Room between each event's buttons and the next divider. */
body main .event-card { padding-top: 44px !important; padding-bottom: 56px !important; }
.event-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0 0 !important; }
.event-button { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 20px; border: 1px solid #171717; border-radius: 0; background: transparent; color: #171717 !important; font: inherit; letter-spacing: inherit; text-decoration: none !important; cursor: pointer; transition: background-color .2s, color .2s; }
.event-button:hover { background: #171717; color: #fff !important; }
.event-button--solid { background: #f1f1ef; color: #171717 !important; }
.event-button--solid:hover { background: #e5e5e2; color: #171717 !important; }
.event-button:focus-visible { outline: 2px solid #245b94; outline-offset: 3px; }
/* Event information reads as a paragraph, with the ticket button below. */
.event-actions { flex-direction:column; align-items:flex-start; gap:20px; }
.event-copy > .event-actions { margin:0!important; gap:18px; }
.event-actions > a.event-button { display:block; min-height:0; padding:0; border:0; background:none; text-decoration:underline!important; text-decoration-thickness:1px!important; text-underline-offset:4px; }
.event-actions > a.event-button:hover { background:none; color:#171717!important; }

html:has(.checkout) { scrollbar-gutter: stable; }
html:has(.checkout[open]) { overflow: hidden; }
.checkout { position: fixed; inset: 0 0 0 auto; box-sizing: border-box; width: min(100%, 480px); height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; overflow-y: auto; scrollbar-width: none; background: #fff; color: #111; opacity: 0; transform: translateX(100%); transition: transform .28s cubic-bezier(.2, .8, .2, 1), opacity .28s ease-out; }
.checkout::-webkit-scrollbar { display: none; }
.checkout.is-open { opacity: 1; transform: none; }
.checkout::backdrop { background: rgba(20, 20, 16, .4); opacity: 0; transition: opacity .28s; }
.checkout.is-open::backdrop { opacity: 1; }
@media (max-width: 900px) { .checkout::backdrop { background: transparent; } }
.checkout .co { box-sizing: border-box; min-height: 100%; display: flex; flex-direction: column; gap: 40px; padding: 14px 28px 28px; }
.checkout .co-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.checkout .co-kicker { text-transform: uppercase; color: #727269; }
.checkout .co-close { width: 44px; height: 44px; margin-right: -12px; display: flex; align-items: center; justify-content: center; padding: 0; background: transparent; border: 0; color: #111; cursor: pointer; }
.checkout .co-when { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.checkout .co-when h2 { margin: 0; }
.checkout .co-change { min-height: 32px; padding: 0; background: transparent; border: 0; color: #111; font: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; cursor: pointer; }
.checkout .co-set { margin: 0; padding: 0; border: 0; min-width: 0; }
.checkout .co-set legend { padding: 0 0 12px; }
.checkout .qty { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 6px 0; border-top: 1px solid #e2e2e0; border-bottom: 1px solid #e2e2e0; }
.checkout .qty-ctl { display: flex; align-items: center; }
.checkout .qty-ctl button { width: 44px; height: 44px; background: transparent; border: 0; color: #111; font: inherit; cursor: pointer; }
.checkout .qty-ctl button:disabled { color: #b5b5b5; cursor: default; }
.checkout .qty-ctl output { min-width: 28px; text-align: center; }
.checkout .co-remove { margin-top: 12px; padding: 0; background: transparent; border: 0; color: #727269; font: inherit; text-decoration: underline; text-underline-offset: 4px; cursor: pointer; }
.checkout .fields { display: grid; grid-template-columns: 1fr; gap: 22px; }
.checkout .fields label { display: flex; flex-direction: column; gap: 6px; color: #57574f; }
.checkout .fields input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid #bcbcb6; border-radius: 0; background: transparent; color: #111; font: inherit; }
.checkout .fields input:focus-visible { outline: 2px solid #111; outline-offset: 2px; }
.checkout .co-foot { margin-top: auto; display: flex; flex-direction: column; gap: 14px; padding-top: 24px; border-top: 1px solid #e2e2e0; }
.checkout .co-total { display: flex; justify-content: space-between; align-items: baseline; margin: 0; }
.checkout .co-pay { min-height: 52px; padding: 0 20px; background: #000; color: #fff; border: 0; font: inherit; cursor: pointer; }
.checkout .co-pay:disabled { opacity: .45; cursor: not-allowed; }
.checkout .co-note { margin: 0; color: #727269; text-align: center; }
@media (prefers-reduced-motion: reduce) { .checkout, .checkout::backdrop { transition: none; } }

/* Phones: a short link that fits one row; the date reads "Lapkričio 21" with a larger number and the weekday below. */
.event-link-short { display:none; }
@media (max-width: 600px) {
  .event-link-long { display:none; }
  .event-link-short { display:inline; }
  body main .event-date time { flex-wrap:wrap; align-items:baseline; gap:2px .3em; }
  body main .event-date time b { display:inline; margin:0; font-size:24px!important; font-weight:700; line-height:1.2; }
  body main .event-date time > span:last-child { flex-basis:100%; }
}
