/*
 * Baza wspólna serwisów OPEN (openbadania / opensolab / badaniaopen): wycinek Foundation 6 + desktop.css
 * starych serwisów — tylko to, czego używają strony wyników (siatka .row/.columns, przyciski, pola, nagłówki).
 * Kolory przez zmienne --ow-color-* (theme.yaml → _vars.css). Plik identyczny w trzech motywach OPEN.
 */
:root {
    --ow-color-primary: #004e9d;
    --ow-color-primary-hover: #1583cc;
    --ow-color-text: #000000;
    --ow-color-heading: #004e9d;
    --ow-color-muted: #6b6b6b;
    --ow-color-border: #ebebeb;
    --ow-color-footer-bg: #f4f4f4;
    --ow-color-footer-text: #6b6b6b;
    --ow-color-error: #a20505;
    --ow-color-note: #3e67af;
    --ow-color-warning: #b23b3b;
    --ow-color-green: #258602;
    --ow-color-accent: #cc0000;
    --ow-color-examination: rgba(85, 158, 231, .85);
}

*, *::before, *::after { box-sizing: border-box; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    padding: 0;
    font-family: 'Lato', sans-serif;
    font-size: 1rem;
    font-weight: normal;
    line-height: 1.5;
    color: var(--ow-color-text);
    background: #fefefe;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img { display: inline-block; vertical-align: middle; max-width: 100%; height: auto; }

a, .link { color: var(--ow-color-primary); text-decoration: none; line-height: inherit; cursor: pointer; }
a:hover, a:focus { color: var(--ow-color-primary-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 1.4; margin: 0 0 .5rem; color: inherit; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.25rem; } h3 { font-size: 1.1875rem; }
@media screen and (min-width: 40em) { h1 { font-size: 3rem; } h2 { font-size: 2.5rem; } h3 { font-size: 1.9375rem; } }

p { font-size: inherit; line-height: 1.6; margin: 0 0 1rem; }
ul { list-style-type: none; margin: 0 0 1rem; padding: 0; }

.skip-link { position: absolute; left: -9999px; top: 0; padding: .75rem 1rem; background: #000; color: #fff; z-index: 1000; }
.skip-link:focus { left: 1rem; color: #fff; }

/* Siatka (Foundation: .row max 75rem, odstęp 0.9375rem) */
.row { max-width: 75rem; margin-left: auto; margin-right: auto; display: flex; flex-wrap: wrap; }
.row .row { margin-left: -.9375rem; margin-right: -.9375rem; max-width: none; }
.columns { flex: 1 1 100%; min-width: 0; padding-left: .9375rem; padding-right: .9375rem; }
@media screen and (min-width: 40em) {
    .medium-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
    .medium-5 { flex: 0 0 41.6667%; max-width: 41.6667%; }
    .medium-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
}
@media screen and (min-width: 64em) {
    .large-2 { flex: 0 0 16.6667%; max-width: 16.6667%; }
    .large-4 { flex: 0 0 33.3333%; max-width: 33.3333%; }
    .large-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
    .large-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
    .large-12 { flex: 0 0 100%; max-width: 100%; }
}
.text-center { text-align: center; }

/* Przyciski (Foundation .button + desktop.css) */
.button, button {
    display: inline-block;
    text-align: center;
    line-height: 1;
    cursor: pointer;
    -webkit-appearance: none;
    vertical-align: middle;
    border: 1px solid transparent;
    border-radius: 0;
    padding: .85em 1em;
    margin: 0 0 1rem 0;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    color: #fefefe;
    background-color: var(--ow-color-primary);
    transition: background-color .25s ease-out, color .25s ease-out;
}
.button:hover, .button:focus, button:hover, button:focus { color: #fefefe; background-color: var(--ow-color-primary-hover); }
.button.secondary, button.secondary { font-size: .75rem; color: var(--ow-color-primary); background-color: #fff; border: 1px solid var(--ow-color-border); }
.button.secondary:hover, button.secondary:hover { color: #fff; background-color: var(--ow-color-primary-hover); border-color: var(--ow-color-primary-hover); }
.button.green { background: var(--ow-color-green); }
.button.green:hover { background: rgba(37, 134, 2, .7); }

/* Pola formularzy (Foundation) */
input[type="text"], input[type="password"], input[type="tel"] {
    display: block;
    width: 100%;
    height: 2.4375rem;
    padding: .5rem;
    margin: 0 0 1rem;
    border: 1px solid #cacaca;
    border-radius: 0;
    font-family: inherit;
    font-size: 1rem;
    color: #0a0a0a;
    background-color: #fefefe;
    box-shadow: inset 0 1px 2px rgba(10, 10, 10, .1);
    -webkit-appearance: none;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="tel"]:focus { border: 1px solid #8a8a8a; box-shadow: 0 0 5px #cacaca; }
input:focus:invalid, input[aria-invalid="true"] { border-color: var(--ow-color-error); }
label { display: block; margin: 0 0 .25rem; font-size: .875rem; line-height: 1.8; color: #0a0a0a; }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Komunikaty (flash, błąd formularza) */
.flash, .form-error {
    max-width: 75rem;
    margin: 1rem auto;
    padding: .75rem 1rem;
    border-left: 5px solid var(--ow-color-primary);
    background: #fff;
    font-weight: 600;
}
.flash-error, .flash-warning, .form-error { border-left-color: var(--ow-color-error); color: var(--ow-color-error); }
.flash-success { border-left-color: var(--ow-color-green); color: #1b6700; }

/* Nagłówki sekcji (desktop.css: section header) */
section header { padding-top: 2rem; padding-bottom: 1rem; border-bottom: 1px solid var(--ow-color-border); margin-bottom: 1rem; }
section header.clean { border-bottom: none; }
header h1, header h2 { text-transform: uppercase; font-weight: 500; font-size: 2rem; color: var(--ow-color-heading); }
header > .button, header > form.logout { float: right; }

/* Lista wyników (dashboard.html.twig + desktop.css .results-block) */
.results .note { font-weight: 900; color: var(--ow-color-note); }
.results .note-warning { font-weight: 900; color: var(--ow-color-warning); margin-top: 15px; }
.results .list .results-block { border-bottom: 1px solid var(--ow-color-border); padding: 1rem 0; margin: 0; align-items: center; }
.results-block h2, .results-block h3 { font-size: 1.2rem; line-height: 1.3rem; font-weight: 600; color: #231f20; margin-bottom: .25rem; text-transform: none; }
.results-block .data ul { margin: 0; }
.results-block .data ul li { display: inline-block; font-size: .85rem; }
.results-block .data ul li:not(:last-child) { margin-right: 4rem; }
.results-block .data ul li.date { font-weight: 600; color: #231f20; }
.results-block .button { width: 100%; margin: .5rem 0 0; }
.results-block .text-wrapper { margin-top: 1.2rem; }
.results-block .text-wrapper p:last-child { margin: 0; }

/* Blok logowania (desktop.css .block-index / .examination) */
.block-index { padding: 1rem 2rem; }
.block-index h1, .block-index h2, .block-index h3 { width: 100%; text-transform: uppercase; text-align: center; font-weight: 300; font-size: 1.9375rem; line-height: 1.8rem; color: inherit; }
.block-index h1 > span, .block-index h2 > span, .block-index h3 > span { font-size: .85rem; font-weight: 600; display: block; margin: 1rem 0; text-transform: none; line-height: 1.1rem; }
.block-index .button { width: 100%; text-transform: uppercase; font-size: 1rem; font-weight: 600; }
.examination.block-index { background: var(--ow-color-examination); margin: 2rem 0 1rem 0; color: #fff; }
.examination.block-index form { text-align: center; }
.examination.block-index form p, .examination.block-index .form-hint { color: #fff; font-size: .75rem; line-height: .95rem; margin: .75rem 0; text-align: center; }
.examination.block-index label { color: #fff; text-align: left; font-weight: 600; }
.examination.block-index a:not(.button) { color: #fff; text-decoration: underline; }
.examination.block-index .form-error { margin: 0 0 1rem; text-align: left; }

/* Kontakt (contact.html.twig) */
.address-block { font-style: normal; }
.address-block p { font-weight: 600; color: #231f20; line-height: 1.2rem; }
.address-block .image-wrapper { margin-bottom: 1rem; }
.address-block .image-wrapper img { max-width: 200px; }
.address-block ul { margin: 0 0 1rem; }
/* Stopka kontaktu w 3 kolumnach: ośrodek | telefony | mapa (23.10); na wąskim ekranie jedna pod drugą */
.address-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem 2.5rem; align-items: start; }
@media (min-width: 640px) { .address-grid { grid-template-columns: 1fr 1fr; } .address-col--map { grid-column: 1 / -1; } }
@media (min-width: 1024px) { .address-grid { grid-template-columns: 1.3fr 1fr 1.2fr; } .address-col--map { grid-column: auto; } }
.address-col--phones { padding-top: .25rem; }
.address-col--map .map-link { display: block; font-weight: 600; text-decoration: none; }
.address-col--map .map-thumb { display: block; width: 100%; max-width: 360px; aspect-ratio: 3 / 2; object-fit: cover; border: 1px solid #d6dbe3; border-radius: 4px; margin-bottom: .6rem; transition: box-shadow .15s ease; }
.address-col--map .map-link:hover .map-thumb { box-shadow: 0 2px 10px rgba(0,0,0,.18); }
.address-col--map .map-link span { color: var(--ow-color-primary); }
.address-col--map .map-attribution { display: block; margin-top: .25rem; font-size: .7rem; color: #6b7280; }
a.phone-indicator, span.phone-indicator {
    position: relative;
    display: inline-block;
    color: #fff;
    background-color: var(--ow-color-primary);
    padding: .5rem .5rem .5rem 2rem;
    min-width: 11rem;
    text-align: center;
    margin-bottom: .55rem;
}
a.phone-indicator:hover { color: #fff; background-color: var(--ow-color-primary-hover); }
a.phone-indicator::before {
    content: '';
    position: absolute;
    left: .75rem;
    top: 12px;
    display: block;
    width: 14px;
    height: 14px;
    background: url('../img/ico-phone-indicator.svg') no-repeat center center;
    background-size: contain;
}

/* Domyślne strony modułu PACJENT (templates/patient/*, np. download_error) — gdy motyw ich nie nadpisuje */
.patient { max-width: 75rem; margin: 0 auto; padding: 2rem .9375rem 1rem; }
.patient h1 { text-transform: uppercase; font-weight: 500; font-size: 2rem; color: var(--ow-color-heading); }
.patient .notice { font-weight: 900; color: var(--ow-color-note); }
.patient form.logout { float: right; }
.patient table.results { width: 100%; border-collapse: collapse; }
.patient table.results th, .patient table.results td { text-align: left; padding: .75rem .5rem; border-bottom: 1px solid var(--ow-color-border); }
