/* style.css */

/* Beispiel: Abstände, Farben */
body {
    background-color: #f8f9fa; /* Hellgrau von Bootstrap angelehnt */
    padding-left: 80px;
    padding-right: 80px;
}

table th, table td {
    vertical-align: middle;
}

.todosindex {
  --bs-table-bg: none !important;
}

.module-overview-link {
  color: inherit;
}

.todo-add-link {
  color: #000;
}

.todo-add-link:hover,
.todo-add-link:focus {
  color: var(--bs-link-color);
}

.todo-overview-cell {
  cursor: pointer;
}

.module-status-badge {
  cursor: context-menu;
}

.todo-context-target {
  cursor: context-menu;
}

.todo-critical {
  border: 4px solid #ff0000 !important;
}

.module-context-menu {
  position: fixed;
  z-index: 1085;
  min-width: 220px;
  border: 1px solid rgba(45, 75, 116, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(45, 75, 116, 0.18);
  overflow: visible;
  display: none;
}

.module-context-menu.is-visible {
  display: block;
}

.module-context-menu .list-group {
  border-radius: inherit;
  overflow: hidden;
}

.todo-menu-list {
  overflow: visible !important;
}

.module-context-menu .list-group-item {
  cursor: pointer;
  border: 0;
  padding: 0.7rem 0.95rem;
  background: transparent;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.module-context-menu .list-group-item:hover,
.module-context-menu .list-group-item:focus {
  background: #eef4fb;
  color: #1f436e;
}

.todo-submenu-wrap {
  position: relative;
  overflow: visible;
}

.todo-submenu-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.todo-submenu-caret {
  margin-left: 0.75rem;
  color: #6c757d;
  font-size: 1.05rem;
  line-height: 1;
}

.todo-submenu-panel {
  position: absolute;
  top: 0;
  left: calc(100% + 8px);
  min-width: 210px;
  display: none;
  z-index: 1090;
  border: 1px solid rgba(45, 75, 116, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.98);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(45, 75, 116, 0.18);
  overflow: hidden;
}

.todo-submenu-wrap:hover .todo-submenu-panel,
.todo-submenu-wrap.is-open .todo-submenu-panel {
  display: block;
}

/* Kalender */
.calendar-icon {
  /* Größe & Rahmen */
  width:       40px !important;  /* setzt sich gegen .img‑Fluid & Co */
  min-width:   40px !important;
  flex:        0 0 40px !important; /* verhindert flex‑Shrink durch .d‑flex‑Row */
  border:      1px solid #2d4b74;
  border-radius: 6px;
  overflow:    hidden;
  background:  #fff;
  box-shadow:  0 0 3px rgba(0,0,0,.15);
  font-family: system-ui, sans-serif;
  text-align:  center; /* falls .text-center irgendwo fehlt */
}

.calendar-icon .weekday,
.calendar-icon .month {
  font-size:   0.70rem;
  font-weight: 600;
  line-height: 1.05;
  padding:     2px 0;
  display:     block;  /* überschreibt evtl. Bootstrap‑Utility »d‑inline« */
}
.calendar-icon .weekday {
  background:  #2d4b74;
  color:       #fff;
  text-transform: capitalize;
}
.calendar-icon .day {
  font-size:   1.1rem;
  font-weight: 700;
  line-height: 1.05;
  color:       #2d4b74;
  background:  #fff;
  padding:     2px 0 1px;
  display:     block;
}
.calendar-icon .month {
  background:  #2d4b74;
  color:       #fff;
  border-top:  1px solid #e1e5ea;
}
.event-row.bg-danger   { background:#f8d7da !important; }
.event-row.bg-warning  { background:#fff3cd !important; }
.event-row.bg-success  { background:#d1e7dd !important; }


/* ====== Gesamtkalender ====== */
.calendar-grid      { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.daycell            { border:1px solid #dee2e6; padding:.4rem; min-height:140px; position:relative; font-size:.8rem; }
.daycell.today      { border:2px solid var(--bs-primary); }
.daycell.empty      { background:#f8f9fa; }
.date-label         { font-weight:600; margin-bottom:.25rem; }
.evt                { display:block; margin-bottom:.25rem; text-decoration:none!important; }
.evt-time           { color:var(--bs-primary); }
.evt-title          { font-weight:600; color:var(--bs-primary); }
.evt-proj           { color:#45494e; }




@media (min-width: 1200px) {
    .main-content {
      /*padding-left: 80px;
      padding-right: 80px;*/
    }
  }



.event-type {
  color: #212529;
  font-style: italic;
  font-size: 0.85em;
}