/* Nur zeigen, wenn Rolle privilegiert – togglen per JS nach Login */
  .hide-admin .admin-col { display: none; }
  .badge-time{ font-size:.75rem; }
  .bg-urlaub { background: #ecfdf5 !important; }   /* green-50 */
  .bg-krank  { background: #eff6ff !important; }   /* sky-50   */
  .bg-pending{ background: #fffbeb !important; }   /* amber-50 */
  .bg-denied { background: #fef2f2 !important; }   /* red-50   */
  .dark #fabLogo { background-color:#1f2937; border-color:#374151; }
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* subtle scale-pop when you check an item */
@keyframes popIn { 0% { transform: scale(.7); opacity:.2 } 80%{ transform:scale(1.05)} 100%{ transform: scale(1); opacity:1 } }
.anim-pop { animation: popIn .18s ease-out; }

  /* Container Toast – funktioniert auch ohne Tailwind */
  #toastContainer{
    position:fixed; top:16px; right:16px;
    /* höchster sinnvoller Z-Index, über allen Overlays/Modals */
    z-index:2147483647; 
    display:flex; flex-direction:column; gap:8px;
    pointer-events:none;
  }
  .toast{
    pointer-events:auto;
    color:#fff; background:#2563eb; /* info */
    padding:12px 14px; border-radius:10px;
    box-shadow:0 8px 24px rgba(0,0,0,.2);
    display:flex; align-items:center; gap:8px; max-width:360px;
    opacity:0; transform:translateY(-8px);
    transition:opacity .18s ease, transform .18s ease;
    font: 14px/1.3 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  }
  .toast.show{ opacity:1; transform:none; }
  .toast.info{ background:#2563eb; }
  .toast.success{ background:#16a34a; }
  .toast.warning{ background:#d97706; }
  .toast.error{ background:#dc2626; }
  .toast .material-icons{ font-size:18px; }


  /* === Tabs (statt @apply) === */
/* Tabs-Container im “Card”-Look */
.tabs-line{
  display:flex; align-items:center; gap: 1.5rem;
  position: relative;
  background:#fff;
}

/* Tab-Buttons: Icon + Label */
.tab-btn{
  appearance:none; background:none; border:0; cursor:pointer;
  display:flex; align-items:center; gap:.5rem;
  color:#374151; /* gray-700 */
  font-size:.95rem;
  padding:.25rem .25rem .5rem .25rem;
  position:relative; white-space:nowrap; opacity:.9;
}
.tab-btn .material-icons{ font-size:20px; line-height:1; }
.tab-btn:hover{ color:#111827; opacity:1; } /* gray-900 */
.tab-btn.active{ color:#1d4ed8; font-weight:600; } /* blue-700 */

/* Unterstreichung (beweglich) */
.tabs-underline{
  position:absolute; left:0; bottom:-2px;
  height:2px; width:0;
  background:#60a5fa; /* blue-400 */
  border-radius:2px;
  transition:left .22s ease, width .22s ease;
}

/* Dark Mode optional */
.dark .tab-btn{ color:#d1d5db; }
.dark .tab-btn:hover{ color:#fff; }
.dark .tab-btn.active{ color:#93c5fd; }
.dark .tabs-underline{ background:#93c5fd; }

/* Responsive etwas enger */
@media (max-width:640px){
  .tabs-line{ gap: .75rem; }
  .tab-btn span:last-child{ font-size:.9rem; }
}


.switch { position: relative; display: inline-flex; height: 1.25rem; width: 2.5rem; align-items: center; border-radius: 9999px; transition: all .2s; }
.switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.track { display: block; height: 100%; width: 100%; border-radius: 9999px; background: #d1d5db; transition: all .2s; }
.knob { position: absolute; height: 1rem; width: 1rem; left: .15rem; border-radius: 9999px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .2s; }
.switch input:checked + .track { background: #22c55e; }
.switch input:checked + .track .knob { transform: translateX(1.2rem); }