/* assets/layout.css – dunkles, navy-blaues Theme (Bootstrap 5 ergänzend) */
:root{
  --brand:#3358d4;      /* Akzentblau */
  --brand-strong:#2a49ad;
  --bg:#0b1b3a;         /* dunkles Blau als Seitenhintergrund */
  --card:#14274e;       /* dunkle Kartenfläche */
  --card-soft:#19315f;  /* leicht hellere Variante (z. B. Kalenderzellen) */
  --muted:#9fb1d1;      /* bläulich-grau für Sekundärtexte */
  --text:#e9f0ff;       /* Primärtext auf Dunkel */
  --border:#24407d;     /* dezente, blaue Rahmenfarbe */
  --chip:#0f2550;       /* Pills/KPIs-Hintergrund */
  --chip-border:#2a468e;
  --hover:#1a3770;      /* Hover */
}

html,body{
  background:var(--bg);
  color:var(--text);
}

/* Navbar */
.navbar{
  background:linear-gradient(180deg, #0f2250, #0b1f48);
  border-bottom:1px solid var(--border);
}
.navbar-brand{
  font-weight:600; letter-spacing:.2px; color:var(--text);
}
.navbar .btn,
.navbar a.btn{
  color:var(--text);
}

/* Cards / Tabellen */
.card{
  border:1px solid var(--border);
  box-shadow:0 6px 22px rgba(0,0,0,.25);
  background:var(--card);
  border-radius:12px;
  color:var(--text);
}
.card-title{font-weight:600;}
.table{
  color:var(--text);
}
.table thead th{
  background:#10244e;
  color:var(--text);
  border-color:var(--border);
}
.table td, .table th{
  border-color:var(--border);
}

/* Kopfbereich & KPIs */
.calendar-head{
  display:flex;align-items:center;gap:8px;margin:16px 0;
}
.calendar-head h1{
  margin:0;font-size:1.4rem;color:#dfe8ff
}
.kpi{
  display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap;
}
.kpi .pill{
  background:var(--chip);
  border:1px solid var(--chip-border);
  padding:6px 10px;
  border-radius:999px;
  font-size:.9rem;
  color:#d7e3ff;
}

/* Buttons */
.btn-outline-secondary{color:#d7e3ff;border-color:var(--chip-border);}
.btn-outline-secondary:hover{background:var(--hover);border-color:var(--brand);}
.btn-outline-danger{color:#ffb3b3;border-color:#8a2a2a;}
.btn-outline-danger:hover{background:#6b1f1f;border-color:#ff6b6b;}
.btn-primary{background:var(--brand);border-color:var(--brand-strong);}
.btn-primary:hover{background:var(--brand-strong);border-color:var(--brand-strong);}

/* Kalenderraster */
.calendar-grid{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap:10px;
}
.calendar-cell{
  background:var(--card-soft);
  border:1px solid var(--border);
  min-height:120px;
  padding:10px;
  border-radius:12px;
  transition:box-shadow .15s ease, transform .05s ease;
}
.calendar-cell:hover{
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  transform:translateY(-1px);
}
.calendar-cell .date{
  font-weight:700;
  color:#f0f4ff;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;        /* <— Datum anklickbar */
}
.date .wk{
  color:#b9c9ff;
  font-weight:700;
}
.badge-today{
  background:rgba(51,88,212,.18);
  border:1px solid var(--brand);
  color:#dbe6ff;
  font-weight:600;
  padding:.15rem .4rem;
  border-radius:.4rem;
}

/* Event-Badges / -Mini */
.event-badge{
  display:block;
  margin-top:6px;
  padding:4px 6px;
  border-radius:8px;
  background:rgba(51,88,212,.12);
  border:1px solid rgba(51,88,212,.35);
  font-size:.9rem;
  color:#e8eeff;
}
.event-badge.series::after{content:" ⟳";}

.event-mini{
  display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:10px;
  border:1px solid rgba(51,88,212,.35);
  background:rgba(20,39,78,.85);
  margin-top:6px;font-size:.9rem;cursor:pointer;
  transition:transform .05s ease, box-shadow .15s ease, background .15s ease;
  color:#e8eeff;
}
.event-mini:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
  background:rgba(26,55,112,.92);
}
.event-mini .dot{
  width:8px;height:8px;border-radius:50%;background:var(--brand);display:inline-block
}

/* Monatsliste */
.month-list .item{
  padding:10px 12px;
  border-bottom:1px solid var(--border);
  display:flex;gap:12px;align-items:center;
  color:var(--text);
}
.month-list .item:last-child{border-bottom:none}
.month-list .time{min-width:160px;color:#c9d6ff;font-weight:700}
.month-list .title{flex:1;color:#e9f0ff}
.month-list .loc{color:var(--muted)}

/* Links, Footer, Kleinteile */
a, .link, .btn-link{color:#c9d6ff;}
a:hover{color:#9fb6ff;}
.footer-muted{color:var(--muted); font-size:.9rem;}

/* Formularfelder (Dark) */
.form-control, .form-select, textarea{
  background:#0d213f;
  border:1px solid var(--border);
  color:var(--text);
}
.form-control:focus, .form-select:focus, textarea:focus{
  background:#0f2550;
  color:var(--text);
  border-color:var(--brand);
  box-shadow:0 0 0 .2rem rgba(51,88,212,.25);
}
.form-text{color:var(--muted);}

/* Modals */
.modal-content{
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border);
  box-shadow:0 20px 50px rgba(0,0,0,.45);
}
.modal-header, .modal-footer{
  border-color:var(--border);
}

/* Badges/Helper */
.text-muted{color:var(--muted) !important;}