/* LR Kineziterapijos klinika — weekly schedule grid.
   Rebuilt 2026-08-01 (see block.php for the structural reasoning).

   Layout model: ONE grid, `[time gutter] + 7 day columns`. Rows are auto
   sized, so a row is as tall as its busiest day and the hour label can never
   drift away from the row it names. Quiet hours (no classes anywhere that
   week) collapse to a short row, so a 07:00–20:00 range stays scannable
   without scrolling past empty afternoons.

   Colours come from the page, not from this file: the schedule sits on the
   navy brand background, so surfaces are white and rules are white at low
   alpha. Each class keeps its own accent via --lrk-ev, set inline per event
   from the ACF schedule colour. */

.lrk-cal {
    --lrk-cal-ink:        #021A51;                 /* brand navy, card text */
    --lrk-cal-on-navy:    #fff;
    --lrk-cal-muted:      #ADC9D7;                 /* brand light blue */
    --lrk-cal-rule:       rgba(255, 255, 255, .14);
    --lrk-cal-rule-soft:  rgba(255, 255, 255, .07);
    --lrk-cal-gutter:     68px;
    --lrk-cal-col-min:    150px;
    --lrk-cal-radius:     var(--theme-button-border-radius, 16px);
    --lrk-cal-row:        104px;                   /* hour with classes */
    --lrk-cal-row-quiet:  40px;                    /* hour without any */

    width: 100%;
    color: var(--lrk-cal-on-navy);
    /* The grid sits between two section headings ("Užsiėmimų tvarkaraštis"
       above, "Mūsų komanda" below) and used to touch both. */
    padding: 28px 0 40px;
}

/* Horizontal scroll lives on ONE element, so the header and the gutter can
   simply be sticky instead of being kept in step by a scroll-sync script. */
.lrk-cal__scroll {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .3) transparent;
    scroll-snap-type: x proximity;
}
.lrk-cal__scroll:focus-visible { outline: 2px solid var(--lrk-cal-muted); outline-offset: 3px; }
.lrk-cal__scroll::-webkit-scrollbar { height: 8px; }
.lrk-cal__scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .25); border-radius: 99px;
}

.lrk-cal__grid {
    display: grid;
    /* minmax(…,1fr): columns share the full width on desktop instead of
       stopping at a fixed 205px and leaving the right third of the page
       empty, but never squeeze below a readable width — past that the
       container scrolls. */
    grid-template-columns: var(--lrk-cal-gutter) repeat(7, minmax(var(--lrk-cal-col-min), 1fr));
    align-items: stretch;
    min-width: calc(var(--lrk-cal-gutter) + 7 * var(--lrk-cal-col-min));
}
.lrk-cal__grid[data-lrk-day-count="14"] {
    grid-template-columns: var(--lrk-cal-gutter) repeat(14, minmax(var(--lrk-cal-col-min), 1fr));
    min-width: calc(var(--lrk-cal-gutter) + 2100px);
}

/* ── header row ───────────────────────────────────────────────────── */

.lrk-cal__corner,
.lrk-cal__dayhead {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #021A51;
    padding: 12px 8px;
    border-bottom: 1px solid var(--lrk-cal-rule);
}
.lrk-cal__corner {
    z-index: 4;
    left: 0;
    border-bottom-color: transparent;
    background: #0b2b63;
    box-shadow: 1px 0 0 rgba(173, 201, 215, .16);
}

.lrk-cal__dayhead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-align: center;
}
.lrk-cal__dayname { font-weight: 700; font-size: 15px; line-height: 1.2; }
.lrk-cal__daydate { font-size: 12px; opacity: .7; }

/* Today gets the brand lime underline — the one place the eye should land. */
.lrk-cal__dayhead.is-today {
    box-shadow: inset 0 -3px 0 var(--theme-button-background-initial-color, #E8EA81);
}
.lrk-cal__dayhead.is-today .lrk-cal__dayname {
    color: var(--theme-button-background-initial-color, #E8EA81);
}

/* ── hour gutter ──────────────────────────────────────────────────── */

.lrk-cal__hour {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #0b2b63;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;      /* the label marks where the hour STARTS */
    padding: 6px 10px 0 0;
    border-top: 1px solid var(--lrk-cal-rule-soft);
    box-shadow: 1px 0 0 rgba(173, 201, 215, .16);
}
.lrk-cal__hour time {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .03em;
    color: var(--lrk-cal-muted);
    font-variant-numeric: tabular-nums;
    transform: translateY(-9px);   /* sit on the rule, like a real time axis */
}
.lrk-cal__hour.is-quiet time { opacity: .45; }

/* ── cells ────────────────────────────────────────────────────────── */

.lrk-cal__cell {
    min-height: var(--lrk-cal-row);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-top: 1px solid var(--lrk-cal-rule-soft);
    border-left: 1px solid var(--lrk-cal-rule-soft);
}
.lrk-cal__cell.is-quiet { min-height: var(--lrk-cal-row-quiet); }
.lrk-cal__cell.is-today { background: rgba(255, 255, 255, .035); }

/* ── event card ───────────────────────────────────────────────────── */

.lrk-cal__event {
    background: #f6f9fb;
    color: var(--lrk-cal-ink);
    border-radius: var(--lrk-cal-radius);
    border-left: 4px solid var(--lrk-ev, var(--lrk-cal-muted));
    padding: 10px 12px;
    box-shadow: 0 6px 18px rgba(2, 26, 81, .2);
    outline: 1px solid rgba(173, 201, 215, .28);
}
@media (pointer: fine) {
    .lrk-cal__event {
        transition: transform .18s ease, box-shadow .18s ease;
    }
    /* Was scale(1.08), which enlarged a card over its neighbours and made
       the whole grid feel jumpy. A 2px lift reads as interactive without
       disturbing the alignment the grid just gained. */
    .lrk-cal__event:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 24px rgba(2, 26, 81, .3);
    }
}

.lrk-cal__evlink {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    color: inherit;
    text-decoration: none;
}
.lrk-cal__evlink:hover .lrk-cal__evtitle { text-decoration: underline; }

.lrk-cal .lrk-cal__evtitle {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    color: var(--lrk-cal-ink);
    background: none;             /* the old pastel chip is now the left rule */
    padding: 0;
    width: auto;
}

.lrk-cal__evmeta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 5px 8px;
    margin: 7px 0 0;
    font-size: 13px;
    line-height: 1.3;
    color: var(--lrk-cal-ink);
}
.lrk-cal__evtime {
    display: block;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .035em;
    color: #33476f;
    font-variant-numeric: tabular-nums;
}
.lrk-cal__occupancy {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 2px 7px;
    border: 1px solid #c6ddcb;
    border-radius: 99px;
    background: #eaf4ec;
    color: #24583c;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
}
.lrk-cal__occupancy.is-full {
    border-color: #ecc7c7;
    background: #fbebeb;
    color: #8b2f34;
}
/* The trainer name and the "Redaguoti" shortcut are the only two things in a
   card that render as <a>, and that is exactly why they were the only two
   that looked broken. The card sets `color: var(--lrk-cal-ink)`, but the
   theme's link rules outrank a bare `color: inherit`, so both anchors took
   the site link colour — palette-2 #ADC9D7, picked to sit on the NAVY page
   and all but gone on a white card. The opacity fades then finished the job:
   measured on #fff the trainer read 1.50:1 and the edit link 1.26:1, against
   the 4.5:1 WCAG AA asks for. Title and time were fine only because an <h3>
   and a <span> are not links.

   Both now take an explicit tint of the brand navy, scoped tightly enough to
   outrank the theme without !important, and the fades are gone — dimming a
   colour was never a way of choosing one. Trainer #4E5F85 (70% navy) =
   6.36:1, edit #5B6A8E (65% navy) = 5.39:1. The order is unchanged: title
   and time still lead at 16.55:1 and bold 700, the trainer sits under them,
   and the edit link stays quietest on size, weight and tint. */
body .lrk-cal__event .lrk-cal__evtrainer { color: #4E5F85; }
body .lrk-cal__event .lrk-cal__evtrainer a { color: inherit; text-decoration: none; }
body .lrk-cal__event .lrk-cal__evtrainer a:hover {
    color: var(--lrk-cal-ink);
    text-decoration: underline;
}

/* Editor shortcut: present for staff, but it must not compete with the
   class name a customer is trying to read. */
body .lrk-cal__event .lrk-cal__evedit {
    display: inline-block;
    margin-top: 6px;
    font-size: 11px;
    font-weight: 500;
    color: #5B6A8E;
    text-decoration: none;
}
body .lrk-cal__event .lrk-cal__evedit:hover {
    color: var(--lrk-cal-ink);
    text-decoration: underline;
}

/* ── optional next week ──────────────────────────────────────────── */

.lrk-cal-shell { width: 100%; }
.lrk-cal__weeknav[hidden],
.lrk-cal__next-link[hidden] { display: none !important; }

.lrk-cal__weeknav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 0 0 36px;
    text-align: center;
}
body .lrk-cal__next-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 10px 18px;
    border: 1px solid rgba(173, 201, 215, .55);
    border-radius: 999px;
    background: rgba(173, 201, 215, .1);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}
body .lrk-cal__next-link:hover,
body .lrk-cal__next-link:focus-visible {
    border-color: #e8ea81;
    background: rgba(232, 234, 129, .13);
    color: #fff;
}
body .lrk-cal__next-link:hover { transform: translateY(-1px); }
body .lrk-cal__next-link:focus-visible {
    outline: 2px solid #e8ea81;
    outline-offset: 3px;
}
.lrk-cal__next-link.is-loading { pointer-events: none; }
.lrk-cal__next-link.is-loading .lrk-cal__next-icon {
    width: 15px;
    height: 15px;
    border: 2px solid rgba(255, 255, 255, .35);
    border-top-color: #fff;
    border-radius: 50%;
    font-size: 0;
    animation: lrk-cal-spin .7s linear infinite;
}
.lrk-cal__next-icon { font-size: 18px; line-height: 1; }
.lrk-cal__weekstatus {
    min-height: 18px;
    color: var(--lrk-cal-muted, #adc9d7);
    font-size: 12px;
    line-height: 1.35;
}

.lrk-cal__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    max-width: 620px;
    margin: 0 auto;
    padding: 24px;
    border: 1px solid rgba(173, 201, 215, .3);
    border-radius: var(--lrk-cal-radius);
    background: rgba(173, 201, 215, .08);
    color: #fff;
    text-align: center;
}
.lrk-cal__empty strong { font-size: 17px; }
.lrk-cal__empty span { color: var(--lrk-cal-muted); font-size: 14px; }

.lrk-cal__modal[hidden] { display: none !important; }
.lrk-cal__modal { display: none; }

@keyframes lrk-cal-spin { to { transform: rotate(360deg); } }

/* ── narrow screens ───────────────────────────────────────────────── */

@media (max-width: 782px) {
    body.lrk-cal-modal-open { overflow: hidden; }
    .lrk-cal__modal {
        position: fixed;
        z-index: 999999;
        inset: 0;
        display: grid;
        align-items: end;
        color: #021a51;
        opacity: 0;
        transition: opacity .18s ease;
    }
    .lrk-cal__modal.is-open { opacity: 1; }
    .lrk-cal__modal-backdrop {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        border: 0;
        border-radius: 0;
        background: rgba(1, 17, 50, .62);
        cursor: default;
    }
    .lrk-cal__modal-dialog {
        position: relative;
        z-index: 1;
        width: 100%;
        max-height: min(88vh, 620px);
        box-sizing: border-box;
        padding: 26px 20px max(24px, env(safe-area-inset-bottom));
        border-radius: 22px 22px 0 0;
        background: #f8fafb;
        box-shadow: 0 -16px 48px rgba(0, 8, 32, .35);
        transform: translate3d(0, 28px, 0);
        transition: transform .22s cubic-bezier(.2, .8, .2, 1);
        will-change: transform;
    }
    .lrk-cal__modal.is-open .lrk-cal__modal-dialog { transform: translate3d(0, 0, 0); }
    .lrk-cal__modal-close {
        position: absolute;
        top: 13px;
        right: 14px;
        display: grid;
        width: 38px;
        height: 38px;
        place-items: center;
        padding: 0;
        border: 1px solid #c5d2da;
        border-radius: 50%;
        background: #fff;
        color: #021a51;
        font-size: 26px;
        line-height: 1;
    }
    .lrk-cal__modal-kicker {
        margin: 0 48px 6px 0;
        color: #607397;
        font-size: 12px;
        font-weight: 800;
        letter-spacing: .06em;
        text-transform: uppercase;
    }
    .lrk-cal__modal-title-row {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        margin-right: 48px;
    }
    .lrk-cal__modal-dialog h2 {
        margin: 0;
        color: #021a51;
        font-size: 25px;
        line-height: 1.18;
    }
    .lrk-cal__modal-info {
        display: grid;
        width: 29px;
        height: 29px;
        flex: 0 0 29px;
        place-items: center;
        margin-top: 1px;
        border: 1px solid #b9c9d5;
        border-radius: 50%;
        color: #28416e;
    }
    .lrk-cal__modal-info svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; }
    .lrk-cal__modal-details {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin: 22px 0;
    }
    .lrk-cal__modal-details div {
        min-width: 0;
        padding: 12px;
        border: 1px solid #d7e0e6;
        border-radius: 12px;
        background: #fff;
    }
    .lrk-cal__modal-details dt {
        margin: 0 0 3px;
        color: #607397;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .lrk-cal__modal-details dd {
        margin: 0;
        color: #021a51;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }
    .lrk-cal__modal-details .lrk-cal__modal-date { grid-column: 1 / -1; }
    .lrk-cal__modal-seats {
        margin: -8px 0 18px;
        padding: 12px;
        border: 1px solid #d7e0e6;
        border-radius: 12px;
        background: #fff;
    }
    .lrk-cal__modal-seats-head {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        color: #607397;
        font-size: 12px;
        font-weight: 700;
    }
    .lrk-cal__modal-seats-head strong { color: #021a51; font-variant-numeric: tabular-nums; }
    .lrk-cal__modal-progress {
        height: 8px;
        margin-top: 9px;
        overflow: hidden;
        border-radius: 999px;
        background: #e6edf1;
    }
    .lrk-cal__modal-progress span {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: inherit;
        background: #4b926b;
        transform: scaleX(0);
        transform-origin: left center;
        transition: transform .2s ease;
    }
    .lrk-cal__modal-booked[hidden] { display: none !important; }
    .lrk-cal__modal-booked {
        display: flex;
        align-items: center;
        gap: 8px;
        margin: -6px 0 16px;
        color: #24583c;
        font-size: 14px;
        font-weight: 800;
    }
    .lrk-cal__modal-booked svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }
    body .lrk-cal__modal .lrk-cal__modal-cta {
        display: flex;
        width: 100%;
        min-height: 56px;
        box-sizing: border-box;
        align-items: center;
        justify-content: center;
        gap: 9px;
        padding: 13px 18px;
        border: 1px solid #c9cd51;
        border-radius: 14px;
        background: #e8ea81;
        box-shadow: 0 8px 18px rgba(2, 26, 81, .15);
        color: #021a51 !important;
        font-size: 16px;
        font-weight: 800;
        line-height: 1.2;
        text-align: center;
        text-decoration: none;
    }
    body .lrk-cal__modal .lrk-cal__modal-cta::after { content: '→'; font-size: 21px; line-height: 1; }
    body .lrk-cal__modal .lrk-cal__modal-cta:hover,
    body .lrk-cal__modal .lrk-cal__modal-cta:focus-visible {
        border-color: #7e8427;
        background: #f2f39f;
        color: #021a51 !important;
    }
    body .lrk-cal__modal .lrk-cal__modal-cta.is-booked {
        border-color: #a9cdb4;
        background: #eef7f0;
        box-shadow: none;
        color: #1d5036 !important;
    }
    body .lrk-cal__modal .lrk-cal__modal-cta.is-booked::after { content: '›'; }
    body .lrk-cal__modal .lrk-cal__modal-cta:active { transform: translateY(1px); }
    body .lrk-cal__modal .lrk-cal__modal-cta:focus-visible,
    .lrk-cal__modal-close:focus-visible {
        outline: 3px solid #e8ea81;
        outline-offset: 3px;
    }
    body.page-id-24238 article#post-24238,
    body.page-id-28720 article#post-28720 {
        --has-boxed: var(--false) !important;
        --has-wide: var(--true) !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    @media (prefers-reduced-motion: reduce) {
        .lrk-cal__modal,
        .lrk-cal__modal-dialog,
        .lrk-cal__modal-progress span { transition: none; }
    }
    .lrk-schedule--group {
        width: 100%;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #021a51;
    }
    .lrk-cal {
        --lrk-cal-gutter: 40px;
        --lrk-cal-col-min: 124px;
        --lrk-cal-row: 82px;
        --lrk-cal-row-quiet: 24px;
        padding: 8px 0 24px;
    }
    .lrk-cal__grid[data-lrk-day-count="14"] {
        min-width: calc(var(--lrk-cal-gutter) + 1736px);
    }
    .lrk-cal__scroll { scroll-padding-left: var(--lrk-cal-gutter); }
    .lrk-cal__corner,
    .lrk-cal__dayhead { padding: 7px 4px; }
    .lrk-cal__dayname { font-size: 12px; }
    .lrk-cal__daydate { font-size: 10px; }
    .lrk-cal__hour { padding: 5px 6px 0 0; }
    .lrk-cal__hour time { font-size: 10px; }
    .lrk-cal__cell {
        padding: 4px;
        gap: 4px;
        background: rgba(173, 201, 215, .035);
    }
    .lrk-cal__event {
        padding: 7px 8px;
        border-left-width: 3px;
        border-radius: 10px;
        box-shadow: 0 5px 16px rgba(0, 8, 32, .24);
    }
    .lrk-cal__evlink { gap: 4px; }
    .lrk-cal .lrk-cal__evtitle {
        font-size: 13px;
        line-height: 1.2;
    }
    .lrk-cal__evtime { font-size: 11px; }
    .lrk-cal__evmeta {
        gap: 4px 6px;
        margin-top: 5px;
        font-size: 10.5px;
        line-height: 1.25;
    }
    .lrk-cal__occupancy {
        min-height: 19px;
        padding: 2px 6px;
        font-size: 10px;
    }
    .lrk-cal__weeknav { padding: 0 12px 28px; }
    body .lrk-cal__next-link {
        width: min(100%, 280px);
        min-height: 42px;
        padding: 9px 15px;
        font-size: 13px;
    }
    .lrk-cal__empty {
        margin-inline: 12px;
        padding: 20px 16px;
    }
    body .lrk-cal__event .lrk-cal__evedit {
        margin-top: 3px;
        font-size: 10px;
        line-height: 1.2;
    }
    /* Keep every hour visible for a trustworthy time axis. Quiet rows are
       already compact through --lrk-cal-row-quiet, so they preserve context
       without making the week read as a sequence of unexplained jumps. */
    /* One column per swipe stop, so a phone lands on a whole day. */
    .lrk-cal__dayhead, .lrk-cal__cell { scroll-snap-align: start; }
}

@media (prefers-reduced-motion: reduce) {
    .lrk-cal__event,
    body .lrk-cal__next-link { transition: none; }
    body .lrk-cal__next-link:hover { transform: none; }
    .lrk-cal__next-link.is-loading .lrk-cal__next-icon { animation-duration: 1.4s; }
}

/* ── block editor placeholder ─────────────────────────────────────── */

.lrk-cal-editor-note {
    text-align: center;
    padding: 24px;
    border: 2px dashed rgba(2, 26, 81, .3);
    border-radius: 16px;
}
.lrk-cal-editor-note h2 { margin: 0; font-size: 16px; }

/* ── schedule page: let the grid use the full width ───────────────── */

@media (min-width: 1024px) {
    .page-id-28720 article,
    .page-id-24238 article {
        --has-boxed: var(--false) !important;
    }

    .lrk-schedule--group {
        max-width: 95vw !important;
        width: 100% !important;
    }
}