/* ==========================================================================
   BLDV Design System – Unifying Layer (Public + Admin)
   --------------------------------------------------------------------------
   Idee:
   - Tokens (Farben, Radius, Spacing) an EINEM Ort
   - Konsistente Cards, Tabellen, Buttons, Form-Controls
   - "Weniger Linien, mehr Luft": Abstand statt Rahmenwände
   --------------------------------------------------------------------------
   Hinweis:
   - Läuft als dünne Schicht über Bootstrap 5 + bestehende Themes
   - Sollte nichts "zerstören", sondern nur vereinheitlichen
   ======================================================================= */

:root{
  /* Palette (fallbacks auf theme.css Variablen, falls vorhanden) */
  --bldv-bg: var(--bg-dark, #0c0d11);
  --bldv-surface: var(--bg-dark-soft, #14151c);
  --bldv-surface-2: var(--bg-dark-softer, #1b1c25);
  --bldv-border: var(--border-dark, rgba(148,163,184,0.22));
  --bldv-text: var(--text-light, #e5e6eb);
  --bldv-muted: var(--text-muted, #9ca3af);
  --bldv-accent: var(--color-red, #d62828);
  --bldv-accent-2: var(--color-red-light, #ff4b4b);

  /* Spacing */
  --bldv-space-1: .25rem;
  --bldv-space-2: .5rem;
  --bldv-space-3: .75rem;
  --bldv-space-4: 1rem;
  --bldv-space-5: 1.25rem;
  --bldv-space-6: 1.5rem;
  --bldv-space-7: 2rem;

  /* Radius */
  --bldv-radius-sm: .6rem;
  --bldv-radius-md: .9rem;
  --bldv-radius-lg: 1.15rem;
  --bldv-radius-pill: 999px;

  /* Shadow */
  --bldv-shadow-sm: 0 6px 18px rgba(0,0,0,.45);
  --bldv-shadow-md: 0 14px 40px rgba(0,0,0,.65);
  --bldv-shadow-focus: 0 0 0 .2rem rgba(214,40,40,.28);
}

/* ------------------------------------------------------------
   Typografie & Rhythmus
------------------------------------------------------------- */

body{
  color: var(--bldv-text);
}

:where(h1,h2,h3,h4,h5,h6){
  letter-spacing: .01em;
}

:where(h1){
  font-weight: 800;
  margin-bottom: var(--bldv-space-4);
}

:where(h2){
  font-weight: 750;
  margin-bottom: var(--bldv-space-3);
}

.bldv-page-intro{
  color: var(--bldv-muted);
  margin-top: calc(var(--bldv-space-3) * -1);
  margin-bottom: var(--bldv-space-5);
}

/* ------------------------------------------------------------
   Cards (Bootstrap .card wird vereinheitlicht, ohne Hard-Reset)
------------------------------------------------------------- */

:where(.card){
  border-radius: var(--bldv-radius-lg) !important;
}

:where(.card-header){
  border-top-left-radius: var(--bldv-radius-lg) !important;
  border-top-right-radius: var(--bldv-radius-lg) !important;
}

:where(.card-body){
  padding: var(--bldv-space-5) !important;
}

/* "Weniger Linien": Rahmen dezent, Trennlinien sparsam */
:where(.card){
  border-color: var(--bldv-border) !important;
}

:where(.card-header){
  border-bottom-color: rgba(255,255,255,0.06) !important;
}

/* Optional: Card als klickbares Element */
.bldv-card-link,
.bldv-clickable{
  cursor: pointer;
}
.bldv-card-link:hover,
.bldv-clickable:hover{
  transform: translateY(-2px);
}

/* ------------------------------------------------------------
   Buttons
------------------------------------------------------------- */

:where(.btn){
  border-radius: var(--bldv-radius-md);
}

/* Buttons wirken "kompakter" und einheitlicher */
:where(.btn.btn-sm){
  border-radius: var(--bldv-radius-sm);
}

:where(.btn-primary){
  box-shadow: 0 10px 24px rgba(214,40,40,.22);
}

:where(.btn:focus, .btn:active:focus, .form-control:focus, .form-select:focus){
  box-shadow: var(--bldv-shadow-focus) !important;
}

/* ------------------------------------------------------------
   Form Controls
------------------------------------------------------------- */

:where(.form-control, .form-select){
  border-radius: var(--bldv-radius-md) !important;
}

/* ------------------------------------------------------------
   Chips / Badges (Status)
------------------------------------------------------------- */

.bldv-chip{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .28rem .62rem;
  border-radius: var(--bldv-radius-pill);
  font-size: .78rem;
  line-height: 1.1;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.04);
  color: var(--bldv-text);
}

.bldv-chip--accent{
  border-color: rgba(214,40,40,.45);
  background: rgba(214,40,40,.12);
}

.bldv-chip--muted{
  color: var(--bldv-muted);
}

/* ------------------------------------------------------------
   Tabellen
------------------------------------------------------------- */

/* Tabellen sollen weniger nach "Excel" aussehen */
:where(.table){
  border-color: rgba(255,255,255,0.06) !important;
}

:where(.table thead th){
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: .75rem;
  color: rgba(229,231,235,0.85) !important;
}

:where(.table tbody td, .table tbody th){
  padding-top: .7rem;
  padding-bottom: .7rem;
}

:where(.table-hover tbody tr:hover){
  background: rgba(255,255,255,0.04) !important;
}

/* ------------------------------------------------------------
   Page Layout Helfer
------------------------------------------------------------- */

.bldv-section{
  margin-bottom: var(--bldv-space-7);
}

.bldv-stack > * + *{
  margin-top: var(--bldv-space-4);
}

.bldv-grid-gap{
  row-gap: var(--bldv-space-5);
}

/* ------------------------------------------------------------
   Notifications Dropdown (Navigation)
------------------------------------------------------------- */

.bldv-notif-dd .dropdown-toggle::after{
  display:none;
}

.bldv-notif-menu{
  width:360px;
  max-width:92vw;
  padding:0;
  border:1px solid rgba(255,255,255,0.10);
  box-shadow: 0 12px 30px rgba(0,0,0,0.45);
}

.bldv-notif-item{
  padding:10px 14px;
  white-space: normal;
}

.bldv-notif-title{
  font-size:.92rem;
  line-height:1.2;
}

.bldv-notif-item--unread .bldv-notif-title{
  font-weight:700;
}

.bldv-notif-msg{
  font-size:.80rem;
  opacity: .85;
  margin-top:2px;
}

.bldv-notif-time{
  font-size:.72rem;
  opacity: .65;
  margin-top:4px;
}

.bldv-notif-menu .dropdown-item:hover{
  background: rgba(255,255,255,0.06);
}

.bldv-notif-menu .dropdown-item:active{
  background: rgba(255,255,255,0.10);
}
