/* v1.5.1 – Contrast fix for native SELECT + dark UI
   Drop-in override: improves readability for placeholder/options on tablet/smartphone + desktop.
*/

/* Ensure native widgets follow dark palette when your UI is dark */
:root { color-scheme: dark; }

/* Generic form controls */
select, select.input, .input select {
  background: #0b1220;
  color: #f8fafc;
  border: 1px solid rgba(255,255,255,.18);
  outline: none;
}

/* Better focus ring (keyboard + accessibility) */
select:focus, select.input:focus, .input select:focus {
  border-color: rgba(99,102,241,.75);
  box-shadow: 0 0 0 3px rgba(99,102,241,.25);
}

/* Options list (browser support varies, but helps on Firefox/Chromium) */
select option, select optgroup {
  background: #0b1220;
  color: #f8fafc;
}

/* Selected option */
select option:checked {
  background: #1f2a44;
  color: #ffffff;
}

/* Disabled placeholder option (if used) */
select option[disabled] {
  color: rgba(248,250,252,.75);
}

/* CEIS-IT mark in sidebar footer */
.sidebar-footer{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ceis-it-mark{display:inline-flex;align-items:center;opacity:.9}
.ceis-it-mark:hover{opacity:1}
.ceis-it-mark img{display:block;height:16px;width:auto}

/* PJAX loading bar */
#pjaxBar{position:fixed;left:0;top:0;height:3px;width:100%;background:transparent;z-index:9999;pointer-events:none}
#pjaxBar::before{content:'';display:block;height:100%;width:0;background:rgba(58,160,255,.85);transition:width .25s ease}
#pjaxBar.on::before{width:85%}
#pjaxBar.on{background:transparent}
#pjaxBar.on::before{animation:pjaxbar 1.1s ease-in-out infinite}
@keyframes pjaxbar{0%{transform:translateX(-20%)}50%{transform:translateX(10%)}100%{transform:translateX(-20%)}}

/* active navigation */
.nav-item.active{background:rgba(58,160,255,.16)}

/* Nachweis-Fotos grid */
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.photo-item{display:block;text-decoration:none;border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.04)}
.photo-item img{display:block;width:100%;height:120px;object-fit:cover}
.photo-item .meta{padding:8px}
.photo-item:hover{border-color:rgba(58,160,255,.35)}