/* RUESS Hub 2.72.0 - Menue-Pfeil, Knopf-Varianten (Fund 21), Filterleiste (Fund 22), Logo (Fund 24). Nur ergaenzend, alte Klassen bleiben. */
/* Menue-Pfeil: Groesse bleibt klein, die Klickflaeche entsteht unsichtbar rundherum (kein Padding am Pfeil selbst) */
.sidebar-nav-chevron{cursor:pointer;opacity:.72;transition:transform .2s cubic-bezier(.2,.7,.2,1),opacity .15s ease}
.sidebar-nav-parent:hover .sidebar-nav-chevron,.sidebar-nav-parent[aria-expanded="true"] .sidebar-nav-chevron{opacity:1}
.sidebar-nav-chevron::before{content:"";position:absolute;inset:-14px -14px -14px -16px}

/* Knopf-Varianten: .btn + eine Variante; .btn-sm fuer kompakte Leisten. Alte Klassen (secondary/danger) bleiben gueltig. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border-radius:8px;font:inherit;font-weight:600;cursor:pointer;border:1px solid transparent}
.btn-primary{background:#323a3b;color:#fff;border-color:#323a3b}
.btn-secondary{background:transparent;color:#323a3b;border-color:#b9c0c1}
.btn-danger{background:#b3261e;color:#fff;border-color:#b3261e}
.btn-text{background:transparent;color:#323a3b;border-color:transparent;text-decoration:underline}
.btn-sm{min-height:30px;padding:0 10px;font-size:.875rem}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.btn:focus-visible{outline:2px solid #a2bf13;outline-offset:2px}

/* Filterleiste: Raster, Beschriftung oben, "Filter zuruecksetzen" rechts */
.ruess-filterbar{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px 12px;align-items:end;margin:0 0 12px}
.ruess-filterbar label{display:flex;flex-direction:column;gap:4px;font-size:.8125rem;min-width:0}
.ruess-filterbar .ruess-filterbar-reset{grid-column:1/-1;justify-self:end}
.ruess-filterbar input[type=search],.ruess-filterbar input,.ruess-filterbar select{min-width:0}

/* Logo: feste Proportion (1600x498), kein Springen beim Laden */
.logo,.sidebar-logo{aspect-ratio:1600/498;height:auto;max-width:100%}

/* Protokoll-Filter der Rechte-Verwaltung nutzt die gemeinsame Filterleiste (Label oben, Raster) */
#usersView .rt-filters.ruess-filterbar{display:grid;align-items:end}
#usersView .rt-filters.ruess-filterbar select,#usersView .rt-filters.ruess-filterbar input{width:100%}

/* ===== Einheitliche Bewegung und Schatten (gilt fuer jede Oberflaeche gleich) ===== */
:root{
  --rs-dur:.2s; --rs-ease:cubic-bezier(.2,.7,.2,1);
  --rs-shadow-1:0 1px 2px rgba(15,23,20,.16),0 1px 3px rgba(15,23,20,.10);
  --rs-shadow-2:0 4px 14px rgba(15,23,20,.18),0 2px 4px rgba(15,23,20,.10);
  --rs-shadow-3:0 18px 44px rgba(15,23,20,.32),0 4px 12px rgba(15,23,20,.16);
}
/* Fenster (Dialoge): Hintergrund blendet ein/aus, das Fenster gleitet 10 px und skaliert leicht - ueberall gleich */
.modal,.ap-modal,.users-drawer-backdrop,.ruess-dialog-overlay{transition:opacity var(--rs-dur) ease,display var(--rs-dur) allow-discrete}
.modal.hidden,.ap-modal.hidden,.users-drawer-backdrop.hidden{opacity:0}
.modal .modal-content,.modal .kom-modal-card,.ap-modal>*,.ruess-dialog{transition:transform var(--rs-dur) var(--rs-ease),opacity var(--rs-dur) ease;box-shadow:var(--rs-shadow-3)}
.modal.hidden .modal-content,.modal.hidden .kom-modal-card,.ap-modal.hidden>*{transform:translateY(10px) scale(.985);opacity:0}
/* Seitenpanels (Drawer): gleiten von rechts */
.users-drawer{transition:transform .26s var(--rs-ease),opacity var(--rs-dur) ease,display .26s allow-discrete}
.users-drawer.hidden{transform:translateX(32px);opacity:0}
/* Untermenue im Seitenmenue */
.sidebar-subnav{transition:opacity var(--rs-dur) ease,transform var(--rs-dur) var(--rs-ease),display var(--rs-dur) allow-discrete}
.sidebar-subnav.hidden{opacity:0;transform:translateY(-4px)}
@starting-style{
  .modal,.ap-modal,.users-drawer-backdrop,.ruess-dialog-overlay{opacity:0}
  .modal .modal-content,.modal .kom-modal-card,.ap-modal>*,.ruess-dialog{transform:translateY(10px) scale(.985);opacity:0}
  .users-drawer{transform:translateX(32px);opacity:0}
  .sidebar-subnav{opacity:0;transform:translateY(-4px)}
}
/* Karten und Kacheln: dezenter Schatten, klickbare heben sich beim Ueberfahren */
.box,.fleet-record-card,.ip-card,.users-management-card{box-shadow:var(--rs-shadow-1)}
.ip-card,.fleet-record-card-main,[onclick].box{transition:box-shadow var(--rs-dur) ease,transform var(--rs-dur) var(--rs-ease)}
.ip-card:hover{box-shadow:var(--rs-shadow-2);transform:translateY(-1px)}
/* Knoepfe: gleiche Rueckmeldung ueberall */
button{transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .1s ease}
button:not(:disabled):hover{box-shadow:var(--rs-shadow-1)}
button:not(:disabled):active{transform:translateY(1px)}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #a2bf13;outline-offset:2px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* Leerer Kopfblock (Ueberschrift steht schon in der Kopfzeile, der Knopf ist dorthin umgezogen) - kein 54-px-Loch oben im Bereich */
.tickets-heading:not(:has(button)){display:none}
/* Aktivpunkt liegt vor dem Pfeil statt darauf */
.sidebar-nav-parent.active:has(.sidebar-nav-chevron:not(.hidden))::after{right:38px}

/* TIKOS-Auswahl (lookup.js): Liste unter dem Feld, ueber Fenstern; gleiche Optik wie Dialoge */
.ruess-lookup-list{position:fixed;z-index:10050;max-height:280px;overflow-y:auto;padding:4px;border-radius:10px;background:#fff;color:#1f2a24;border:1px solid rgba(20,30,24,.14);box-shadow:var(--rs-shadow-3);transition:opacity var(--rs-dur) ease,display var(--rs-dur) allow-discrete}
.ruess-lookup-list.hidden{opacity:0}
@starting-style{.ruess-lookup-list{opacity:0}}
.ruess-lookup-option{display:flex;gap:10px;align-items:baseline;padding:8px 10px;border-radius:7px;cursor:pointer;font-size:.9rem}
.ruess-lookup-option strong{flex:0 0 auto;font-variant-numeric:tabular-nums}
.ruess-lookup-option span{color:#5b665f;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ruess-lookup-option.is-active,.ruess-lookup-option:hover{background:#eef3d6}
.ruess-lookup-note{padding:10px 12px;font-size:.85rem;color:#5b665f}
.ruess-lookup-hint{display:block;margin-top:4px;font-size:.8rem;color:#5b665f}
.ruess-lookup-hint.hidden{display:none}

/* Dialog und Auswahlliste liegen ueber anderem Inhalt: deckende Flaeche (die Kartenfarbe des Designs ist halbdurchsichtig), hell und dunkel */
.ruess-dialog{background:#fff;color:#1d2a21}
:root[data-theme="dark"] .ruess-dialog{background:#1f2622;color:#e8eee9}
:root[data-theme="dark"] .ruess-lookup-list{background:#1f2622;color:#e8eee9;border-color:rgba(255,255,255,.14)}
:root[data-theme="dark"] .ruess-lookup-option span,:root[data-theme="dark"] .ruess-lookup-note,:root[data-theme="dark"] .ruess-lookup-hint{color:#a9b5ad}
:root[data-theme="dark"] .ruess-lookup-option.is-active,:root[data-theme="dark"] .ruess-lookup-option:hover{background:#2c3a30}

/* ===== Fuhrpark Fahrzeuge/PKW: ruhiger Kopfbereich ===== */
/* beide Kachelreihen auf dasselbe 5er-Raster (vorher 4 gegen 5 Spalten), je Reihe eine kleine Beschriftung */
#fleetView .fleet-vehicle-filterbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;align-items:stretch;margin-bottom:14px}
#fleetView #fleetVehTypeTiles{display:contents}
#fleetView #fleetVehStatusKpis .fleet-vehicle-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
#fleetView .fleet-vehicle-filterbar::before,#fleetView #fleetVehStatusKpis::before{content:"Fahrzeugtyp und Kostenstelle";grid-column:1/-1;display:block;margin:0 0 -2px 2px;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;opacity:.6}
#fleetView #fleetVehStatusKpis::before{content:"Status";margin:0 0 8px 2px}
#fleetView #fleetVehStatusKpis{margin-bottom:16px}
/* Kostenstelle ist ein Filter, keine Kennzahl: Auswahlfeld-Optik mit Pfeil */
#fleetView .fleet-kst-filter summary{box-sizing:border-box;height:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-radius:12px;border:1px solid rgba(127,127,127,.35);font-weight:600;font-size:.95rem;list-style:none;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease}
#fleetView .fleet-kst-filter summary::-webkit-details-marker{display:none}
#fleetView .fleet-kst-filter summary:hover{border-color:#a2bf13;box-shadow:var(--rs-shadow-1)}
#fleetView .fleet-kst-filter summary::after{content:"";flex:0 0 auto;width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.7;transition:transform .2s cubic-bezier(.2,.7,.2,1)}
#fleetView .fleet-kst-filter[open] summary::after{transform:rotate(225deg) translateY(-2px)}
/* Werkzeugzeile: Suche waechst, Standort, Archivierte und die Aktionen stehen in EINER Zeile (Aktionen rechts) */
#fleetView .fleet-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
#fleetView .fleet-toolbar .fleet-toolbar-search{flex:1 1 340px;width:auto;min-width:0}
#fleetView .fleet-toolbar .fleet-toolbar-actions{flex:0 0 auto;width:auto;margin-left:auto;display:flex;gap:8px}
@media (max-width:1100px){#fleetView .fleet-vehicle-filterbar,#fleetView #fleetVehStatusKpis .fleet-vehicle-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){#fleetView .fleet-vehicle-filterbar,#fleetView #fleetVehStatusKpis .fleet-vehicle-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Wissensbank: Bilder direkt im Schritt (Klick vergroessert) */
.kb-prose .kb-figure{margin:12px 0 6px;max-width:760px}
.kb-prose .kb-figure img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(127,127,127,.35);box-shadow:var(--rs-shadow-2);cursor:zoom-in;background:#f4f4f4;min-height:60px}
.kb-prose .kb-figure figcaption{margin-top:6px;font-size:.85rem;opacity:.8}
.kb-prose .kb-figure.kb-figure-zoom{max-width:none}
.kb-prose .kb-figure.kb-figure-zoom img{cursor:zoom-out}
.kb-prose .kb-figure.kb-figure-missing img{display:none}
.kb-prose .kb-figure.kb-figure-missing::before{content:"(Bild nicht verfügbar)";font-size:.85rem;opacity:.7}
@media print{.kb-prose .kb-figure{break-inside:avoid}}