/* Skrit vsebini, viden bralcem zaslona */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Minimalna velikost dotikalnega cilja (dostopnost) */
button.touch-target,
a.touch-target {
    min-height: 44px;
    min-width: 44px;
}

/* Mobile-first styles */
body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* Prevent zoom on input focus (iOS) */
input[type="text"],
input[type="number"],
input[type="url"],
textarea,
select {
    font-size: 16px !important;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Tekoče pomikanje: momentum na iOS, manj preoblikovanj */
body {
    -webkit-overflow-scrolling: touch;
}

/* Seznam: vrstice izven zaslona se ne risanje takoj (hitrejši scroll) */
.list-item-row {
    content-visibility: auto;
    contain-intrinsic-size: auto 60px;
    contain: layout style paint;
}

.list-scroll-wrap {
    -webkit-overflow-scrolling: touch;
}

/* QR ikona v iskalniku: vedno temno siva (Lucide zamenja <i> z SVG) */
.search-bar-qr-btn,
.search-bar-qr-btn svg {
    color: #374151 !important;
    stroke: #374151 !important;
}

/* Okvir QR: vedno na sredini ekrana, velikost v vmin (kvadrat) */
#qr-scan-frame {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50vmin;
    height: 50vmin;
}
#qr-scan-frame.qr-frame-small { width: 24vmin; height: 24vmin; }
#qr-scan-frame.qr-frame-medium { width: 50vmin; height: 50vmin; }
#qr-scan-frame.qr-frame-large { width: 76vmin; height: 76vmin; }

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Dostopnost: vidna fokusna obroba pri tipkovnici (ne pri miški) */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}

/* Skip link: skrit, na fokus prikaži */
a[href="#root"] {
    position: absolute;
    left: 0.5rem;
    top: -5rem;
    padding: 0.5rem 1rem;
    background: #fff;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    z-index: 100;
    transition: top 0.15s ease;
}
a[href="#root"]:focus {
    top: 0.5rem;
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}
