/* ======================================================================
 * FamilyOS - Bento Grid Design System (Linear / Notion Calendar / Apple Home)
 * ====================================================================== */

:root {
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --radius-bento: 1.25rem;
}

body {
  font-family: var(--font-sans);
  -webkit-tap-highlight-color: transparent;
}

/* Lucide Icons Thin Stroke */
[data-lucide], svg.lucide {
  stroke-width: 1.75px;
}

/* Feine 1px Bento-Grid Rahmen & Übergänge */
.bento-card {
  transition: border-color 0.15s ease, background-color 0.15s ease;
}

/* Dezenter monochromer Scrollbar */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: #d4d4d8;
  border-radius: 9999px;
}
.dark ::-webkit-scrollbar-thumb {
  background: #3f3f46;
}
::-webkit-scrollbar-thumb:hover {
  background: #a1a1aa;
}

/* TV / Kiosk-Modus Skalierung für 2-3 Meter Betrachtungsabstand */
.kiosk-mode #app-content {
  font-size: 1.15rem;
}
.kiosk-mode h1 {
  font-size: 2.25rem !important;
}
.kiosk-mode h2 {
  font-size: 1.5rem !important;
}
.kiosk-mode .bento-tile {
  padding: 1.75rem !important;
}
.kiosk-mode input, .kiosk-mode select, .kiosk-mode button {
  min-height: 2.75rem;
}

/* Klares Tastatur-/Fernbedienungs-Fokus-Design */
:focus-visible {
  outline: 2px solid #18181b;
  outline-offset: 2px;
}
.dark :focus-visible {
  outline: 2px solid #f4f4f5;
  outline-offset: 2px;
}

/* Schnelle, unaufdringliche Animationen */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
  animation: fadeIn 0.15s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes slideDownAlert {
  from { opacity: 0; transform: translate(-50%, -12px); }
  to { opacity: 1; transform: translate(-50%, 0); }
}

.alarm-popup {
  animation: slideDownAlert 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}