/* Boknavet ovanpå Tabler. Bara det Tabler inte har, plus typsnitt och vår gröna färg. */

@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/static/fonts/inter-latin-ext-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: 'Inter Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/static/fonts/inter-latin-wght-normal.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root, [data-bs-theme] {
  --tblr-font-sans-serif: 'Inter Variable', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --tblr-primary: #2f5d50;
  --tblr-primary-rgb: 47, 93, 80;
  --tblr-primary-fg: #fff;
  --tblr-primary-darken: #244a3f;
  --tblr-primary-lt-rgb: 234, 239, 237;
  --tblr-link-color: #2f5d50;
  --tblr-link-color-rgb: 47, 93, 80;
  --tblr-link-hover-color: #1e3d34;
  --tblr-link-hover-color-rgb: 30, 61, 52;
}
body { font-feature-settings: "cv03", "cv04", "cv11"; }

/* Sidomenyn i mörkgrönt */
.sidebar-brand {
  --tblr-navbar-bg: #1d3a32;
  --tblr-navbar-border-color: #1d3a32;
  background: #1d3a32 !important;
}
.sidebar-brand .nav-item.active .nav-link,
.sidebar-brand .nav-link:hover { background: rgba(255, 255, 255, .08); border-radius: var(--tblr-border-radius); }
.sidebar-brand .nav-link { margin: 1px .5rem; }
.sidebar-subtitle { color: rgba(255, 255, 255, .55); font-size: .8rem; padding: 0 1rem .5rem; text-transform: uppercase; letter-spacing: .04em; }
.brand-link { display: inline-flex; align-items: center; gap: .5rem; color: inherit; text-decoration: none; font-weight: 700; }
.brand-icon { width: 1.6rem; height: 1.6rem; }
.auth-page { background: linear-gradient(180deg, #eef3f1 0%, var(--tblr-body-bg) 60%); }

/* Mörka (fyllda) badges får vit text i stället för Tablers grå standardfärg */
.badge[class*="bg-"]:not([class*="-lt"]):not(.bg-light):not(.bg-white):not(.bg-transparent):not(.bg-yellow) {
  --tblr-badge-color: #fff;
  color: #fff;
}

.qr svg { width: 200px; height: 200px; background: #fff; padding: 4px; border-radius: 4px; }
.secret { font-family: var(--tblr-font-monospace); font-size: 1.05rem; letter-spacing: .05em; }
.copy-link { font-family: var(--tblr-font-monospace); word-break: break-all; }
.krav-text { max-width: 48rem; }
.tree-indent-1 { padding-left: 1.5rem !important; }
.tree-indent-2 { padding-left: 3rem !important; }
.tree-indent-3 { padding-left: 4.5rem !important; }
.row-support > td { background: var(--tblr-red-lt) !important; }
.white-space-pre { white-space: pre-line; }

/* Sidan är vit. Kort (formulär, uppgifter) har en tunn ram utan skugga. */
:root, [data-bs-theme] { --tblr-body-bg: #ffffff; }
.card {
  --tblr-card-border-color: #e6e9e8;
  --tblr-card-box-shadow: none;
  --tblr-card-cap-bg: transparent;
}
.card-footer { background: transparent; }
.page-header { margin-bottom: .5rem; }

/* Tabeller ligger direkt på sidan, inte i en box: kort som innehåller en tabell blir osynliga */
.card:has(> .table-responsive > .card-table),
.card:has(> .card-table) {
  background: transparent;
  border: 0;
  box-shadow: none;
}
.card:has(> .table-responsive > .card-table) > .card-header,
.card:has(> .card-table) > .card-header {
  padding: 0 0 .5rem;
  border: 0;
  min-height: 0;
}
.card:has(> .table-responsive > .card-table) > .card-header .card-title { font-size: 1rem; }
.card:has(> .table-responsive > .card-table) > .card-footer { padding-left: 0; padding-right: 0; border: 0; }
.card:has(> .table-responsive > .card-table) > .empty,
.card:has(> .table-responsive > .card-table) > .card-body { padding-left: 0; padding-right: 0; }
.table thead th {
  background: transparent;
  padding-top: .5rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid #dfe3e1;
}
.card-table > :not(caption) > * > * { padding-top: .8rem; padding-bottom: .8rem; }
.card-table tr > :first-child { padding-left: 1rem; }
.card-table tr > :last-child { padding-right: 1rem; }
/* Själva tabellen har en tunn ram med Tablers vanliga rundning */
.card:has(> .table-responsive > .card-table) > .table-responsive,
.card > .card-table {
  border: 1px solid #e6e9e8;
  border-radius: var(--tblr-border-radius-lg);
  background: #fff;
}
.card-table tbody td { border-bottom-color: #eef0ef; }
.table tbody tr:hover > td { background: #f6f8f7; }

/* Fasetter i katalogsökningen: täta rader */
.facet-list { margin-left: -.5rem; margin-right: -.5rem; }
.facet-list .list-group-item { padding: .3rem .5rem; border: 0; border-radius: var(--tblr-border-radius); }
.facet-list .list-group-item.active { background: var(--tblr-primary-lt); color: var(--tblr-primary); font-weight: 600; }
.d-contents { display: contents; }
.marc-editor { font-family: var(--tblr-font-monospace), ui-monospace, Menlo, Consolas, monospace !important; font-size: .82rem; line-height: 1.5; white-space: pre; }

/* Kvitto: smal remsa som passar kvittoskrivare */
.receipt { background: #fff; }
.receipt-paper { max-width: 80mm; margin: 1rem auto; font-size: .85rem; }
@media print { .receipt-paper { margin: 0; } }

/* ---------- Låntagarwebben ---------- */
.skip-link { position: absolute; left: .5rem; top: -3rem; z-index: 2000; padding: .5rem 1rem; background: #fff; color: #1d3a32; border: 2px solid #1d3a32; border-radius: var(--tblr-border-radius); font-weight: 600; }
.skip-link:focus { top: .5rem; }
.public-site main:focus { outline: none; }
.public-navbar { background: #1d3a32 !important; --tblr-navbar-bg: #1d3a32; --tblr-navbar-border-color: #1d3a32; }
.public-navbar .nav-link { color: rgba(255, 255, 255, .85); }
.public-navbar .nav-link:hover, .public-navbar .nav-item.active .nav-link, .public-navbar .nav-link.active { color: #fff; }
.public-navbar .nav-item.active .nav-link { text-decoration: underline; text-underline-offset: .4rem; text-decoration-thickness: 2px; }
.public-navbar .brand-link { color: #fff; }
.public-hero { background: linear-gradient(180deg, #eef3f1 0%, #f7faf9 100%); border-radius: var(--tblr-border-radius-lg); padding: 2.5rem 2rem; }
.public-footer { border-top: 1px solid #e6e9e8; padding: 1.5rem 0; margin-top: 3rem; }
.public-site :focus-visible { outline: 3px solid #1f6feb; outline-offset: 2px; }
.public-site a:not(.btn):not(.nav-link):not(.badge):not(.card):not(.list-group-item):not(.page-link):not(.brand-link) { text-decoration: underline; text-underline-offset: .15em; }
.cover-placeholder { display: flex; align-items: center; justify-content: center; background: #eef3f1; color: #2f5d50; aspect-ratio: 2 / 3; max-height: 11rem; border-radius: var(--tblr-border-radius) var(--tblr-border-radius) 0 0; }
.cover-placeholder .icon { width: 3rem; height: 3rem; stroke-width: 1.25; }
.cover-sm { width: 3.5rem; flex: 0 0 3.5rem; border-radius: var(--tblr-border-radius); }
.cover-sm .icon { width: 1.75rem; height: 1.75rem; }
.title-card .card-title { line-height: 1.3; }
.search-hit { display: flex; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid #eef0ef; }
.search-hit:first-child { padding-top: 0; }
.title-facts dt { font-weight: 600; }
.item-list li + li { border-top: 1px solid #eef0ef; }
.prose { max-width: 46rem; }
.prose h2 { margin-top: 1.75rem; }
/* Tablers gråa hjälptext har för låg kontrast mot vitt för WCAG AA i liten storlek */
.public-site .text-secondary { color: #5b6670 !important; }
/* Grönt med tillräcklig kontrast (AA) på vit och ljusgrön botten */
.public-site .text-success { color: #1b6e30 !important; }
.public-site .badge.bg-green-lt { color: #1b6e30 !important; }
.public-site .badge.bg-secondary-lt { color: #47525c !important; }
.article-item { padding: .9rem 0; border-bottom: 1px solid #eef0ef; }
.article-item:first-child { padding-top: 0; }
.prose .lead { font-size: 1.15rem; }
.prose ul { padding-left: 1.25rem; }
/* Meddelanden och fel med tillräcklig kontrast (AA) */
.public-site .alert-danger, .public-site .invalid-feedback, .public-site .text-danger { --tblr-alert-color: #a61e1e; color: #a61e1e !important; }
.public-site .alert-success { --tblr-alert-color: #1b6e30; color: #1b6e30; }
.public-site .alert-warning { --tblr-alert-color: #7a4500; color: #7a4500; }
.public-site .alert-info { --tblr-alert-color: #0b4f8a; color: #0b4f8a; }
.public-site .alert a, .public-site .alert .alert-link { color: inherit; }
.public-site .badge.bg-red-lt { color: #a61e1e !important; }
.public-site .badge.bg-yellow-lt { color: #6b4400 !important; }
.public-site .alert ul { min-width: 0; }
.public-site .alert-link { white-space: normal; overflow-wrap: anywhere; }

/* API-dokumentationen: innehållsförteckningen följer med när man rullar */
.api-toc { top: 1rem; max-height: calc(100vh - 2rem); overflow-y: auto; }

/* Omslag: bilden ligger ovanpå platshållaren och tas bort av app.js om den saknas */
.cover-placeholder { position: relative; overflow: hidden; }
.cover-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: #eef3f1; }
.cover-record { width: 6rem; border-radius: var(--tblr-border-radius); }
.cover-title-img { width: 9rem; border-radius: var(--tblr-border-radius); }

/* Små sifferfält i tabeller, till exempel antal och pris på beställningsrader */
.input-narrow { min-width: 5rem; }

/* Utskrift av rapporter: bara innehållet */
@media print {
  .navbar-vertical, header.navbar, .page-header .btn-list, .alert-dismissible, footer { display: none !important; }
  .page-wrapper { margin: 0 !important; }
  .card { box-shadow: none; }
}

/* Kvitto: smalt som en kvittoremsa */
.receipt { max-width: 26rem; }

/* Datorbokning: schemat i personalvyn */
.computer-grid td { min-width: 12rem; }

/* Automatläget: stor text och stora knappar */
.kiosk .kiosk-title { font-size: 2.25rem; }
.kiosk .kiosk-input { font-size: 1.75rem; padding: .75rem 1rem; }
.kiosk .kiosk-button { font-size: 1.5rem; padding: 1rem 1.5rem; }
.kiosk .kiosk-list li { font-size: 1.35rem; padding: .35rem 0; }
.kiosk .kiosk-brand { white-space: normal; min-width: 0; }

/* Webbappen: lånekortet och kameran för skanning */
.library-card { border: 2px solid #2f5d50; }
.library-card-code svg { width: 100%; height: auto; max-height: 9rem; }
.scan-overlay { position: fixed; inset: 0; z-index: 2000; background: #000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; }
.scan-overlay[hidden] { display: none; }
.scan-overlay video { width: 100%; max-height: 80vh; object-fit: cover; }

/* Hjälpen: egen layout med grönt sidhuvud och sökfält överst */
.help .page { min-height: 100vh; }
.help-skip { position: absolute; top: .5rem; left: .5rem; z-index: 1050; }
.help-topbar { background: #1d3a32 !important; color: #fff; min-height: 3.5rem; }
.help-topbar .brand-link, .help-topbar .nav-link { color: #fff; }
.help-topbar .nav-link { opacity: .8; }
.help-topbar .nav-item.active .nav-link, .help-topbar .nav-link:hover { opacity: 1; text-decoration: underline; text-underline-offset: .3em; }
.help-hero { background: linear-gradient(180deg, #2f5d50 0%, #3c7465 100%); padding: 1.5rem 0; }
.help-hero-title { color: #fff; font-size: 1.75rem; font-weight: 700; margin: .5rem 0 1rem; }
.help-search { position: relative; max-width: 44rem; }
.help-search .form-control-lg { border: 0; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
.help-suggest { position: absolute; top: calc(100% + .25rem); left: 0; right: 0; z-index: 1040; padding: .25rem 0; box-shadow: 0 8px 24px rgba(0, 0, 0, .18); }
.help-suggest a { display: block; padding: .45rem .9rem; color: inherit; text-decoration: none; }
.help-suggest a:hover, .help-suggest a[aria-selected="true"] { background: var(--tblr-primary-lt, #eaefed); }
.help-suggest .subheader { padding: .4rem .9rem .1rem; }
.help-suggest .help-suggest-all { border-top: 1px solid var(--tblr-border-color); margin-top: .25rem; font-weight: 600; }
.help mark { background: #fff1b8; padding: 0 .05em; border-radius: 2px; }
.help-nav { position: sticky; top: 1rem; }
.help-nav-group { margin-bottom: .25rem; }
.help-nav-title { display: flex; align-items: center; gap: .5rem; padding: .35rem .5rem; border-radius: var(--tblr-border-radius); color: var(--tblr-body-color); font-weight: 500; text-decoration: none; }
.help-nav-title:hover, .help-nav-title.active { background: var(--tblr-primary-lt, #eaefed); text-decoration: none; }
.help-nav ul { margin: .25rem 0 .5rem 2.1rem; }
.help-nav ul a { display: block; padding: .2rem 0; color: var(--tblr-secondary); }
.help-nav ul a.active { color: var(--tblr-primary); font-weight: 600; }
.help-article-list li { padding: .15rem 0; }
.help-toc { position: sticky; top: 1rem; font-size: .875rem; }
.help-toc li { padding: .15rem 0; }
.help-content { font-size: .95rem; line-height: 1.65; max-width: 46rem; }
.help-content h2 { margin-top: 2rem; padding-top: .5rem; scroll-margin-top: 1rem; font-size: 1.25rem; }
.help-content h3 { margin-top: 1.5rem; scroll-margin-top: 1rem; font-size: 1.05rem; }
.help-content h2:target, .help-content h3:target { background: #fff6d6; border-radius: 4px; }
.help-content ol, .help-content ul { padding-left: 1.4rem; }
.help-content li { margin-bottom: .25rem; }
.help-content code { font-size: .85em; }
.help-callout { margin: 1rem 0; }
.help-table { border: 1px solid var(--tblr-border-color); border-radius: var(--tblr-border-radius); }
.help-snippet { font-size: .875rem; }
.help-index { columns: 3 16rem; column-gap: 2rem; }
.help-index-letter { break-inside: avoid; margin-bottom: 1.25rem; }
.help-index-letter h2 { font-size: 1.1rem; color: var(--tblr-primary); border-bottom: 1px solid var(--tblr-border-color); padding-bottom: .25rem; scroll-margin-top: 1rem; }
.help-index li { padding: .15rem 0; }
.help-letters { display: flex; flex-wrap: wrap; gap: .25rem; }
.help-group-card .avatar .icon, .help-nav-title .icon { width: 1.1rem; height: 1.1rem; }
/* Hjälplänken i personalvyns sidhuvud */
.help-link { display: inline-flex; align-items: center; gap: .35rem; }
.help-article h1 { font-size: 1.75rem; font-weight: 700; }
.help-article .alert > div:last-child { color: var(--tblr-body-color); }
.help-content .table-responsive { margin-bottom: 1rem; }
/* Kontrast och understrukna länkar i hjälpen (WCAG 1.4.3 och 1.4.1) */
.help .badge.bg-orange-lt { color: #7a3500 !important; }
.help .badge.bg-green-lt { color: #1d5a2c !important; }
.help .badge.bg-secondary-lt { color: #3d4652 !important; }
.help-content a, .help-article-list a, .help-index a, .help-list-inline a { text-decoration: underline; text-underline-offset: .15em; }

/* Grupper i sidomenyn */
.sidebar-brand .dropdown-menu .dropdown-item { margin: 1px .5rem; padding-top: .35rem; padding-bottom: .35rem; color: rgba(255, 255, 255, .78); }
.sidebar-brand .dropdown-menu .dropdown-item:hover, .sidebar-brand .dropdown-menu .dropdown-item.active { background: rgba(255, 255, 255, .08); color: #fff; }
.sidebar-brand .dropdown-menu .dropdown-header { color: rgba(255, 255, 255, .7); font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; padding: .6rem 1rem .2rem calc(var(--tblr-sidebar-nav-padding-x, .75rem) + 2.5rem); }
.sidebar-brand .nav-group.active > .nav-link { background: transparent; }

/* Startsidan: snabbval */
.quick-tile .card-body { padding: 1.5rem; }
.quick-tile-icon { display: inline-flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; background: #2f5d50; color: #fff; flex: none; }
.quick-tile-icon .icon { width: 1.75rem; height: 1.75rem; }
.quick-tile-label { font-size: 1.25rem; font-weight: 700; color: var(--tblr-body-color); }
.quick-tile:hover .quick-tile-icon { background: #244a3f; }
