/* ================================================
   MONTHLY DASHBOARD STYLING
   ================================================ */
 
.month-grid-wrapper {
  overflow-x: auto;
  margin-bottom: 1.5rem;
}
 
.month-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 4px;
  table-layout: fixed;
}
 
.month-th {
  text-align: center;
  font-weight: 600;
  font-size: 0.85rem;
  padding: 0.4rem 0.25rem;
  color: #495057;
  background: transparent;
  border-bottom: none;
}
.month-th.weekend {
  color: #adb5bd;
}
 
/* WEEK NUMBER COLUMN */
td.month-cell--kw {
  vertical-align: middle;
  text-align: center;
  background: transparent;
  border: none;
  box-shadow: none;
  min-height: auto;
  padding: 0.35rem 0.25rem;
  width: 2.5rem;
}
td.month-cell--kw:hover {
  background: transparent;
  box-shadow: none;
}
.month-kw__link,
.month-kw__link:visited {
  font-size: 0.75rem;
  font-weight: 600;
  color: #6c757d;
  text-decoration: none;
}
.month-kw__link:hover {
  color: #212529;
  text-decoration: none;
}

/* CELL */
.month-cell {
  vertical-align: top;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.4rem;
  padding: 0.35rem 0.45rem;
  min-height: 5.5rem;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04);
  transition: box-shadow 0.15s;
}
.month-cell:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  background: #fdfdfd;
}
 
.month-cell--empty {
  background: transparent;
  border: 1px solid transparent;
  box-shadow: none;
}
.month-cell--empty:hover {
  box-shadow: none;
  background: transparent;
}
 
.month-cell--today {
  background-color: #f1f3f5;
  border-color: #adb5bd;
  box-shadow: inset 0 0 0 2px #dee2e6;
}
.month-cell--today:hover {
  box-shadow: inset 0 0 0 2px #adb5bd;
}
 
.month-cell--holiday {
  background-color: #fffbf0;
}
 
/* CELL HEADER: date number + count badge */
.month-cell__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0.25rem;
}
 
.month-cell__date,
.month-cell__date:visited {
  font-weight: 600;
  font-size: 0.85rem;
  color: #212529;
  text-decoration: none;
}
.month-cell__date:hover {
  color: #495057;
  text-decoration: none;
}

.month-cell--today .month-cell__date,
.month-cell--today .month-cell__date:visited {
  color: #000;
}
.month-cell--today .month-cell__date:hover {
  color: #495057;
}

.month-cell__badges {
  display: flex;
  align-items: center;
  gap: 3px;
}

/* Open spots badge (next to count badge) */
.count-badge--open {
  background: #fff;
}
.count-badge--tight {
  background: #ff9800;
  color: #fff;
  border-color: #ff9800;
}
.count-badge--over {
  background: #dc3545;
  color: #fff;
  border-color: #dc3545;
}

/* HOLIDAY NAME inside cell */
.month-cell__holiday {
  font-size: 0.65rem;
  font-weight: 600;
  color: #8a6d3b;
  background: #fce4b0;
  border-radius: 3px;
  padding: 1px 4px;
  margin-bottom: 0.2rem;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
 
/* FOUR DATA LINES */
.month-cell__lines {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
 
.month-line {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1px 4px;
  border-radius: 3px;
  font-size: 0.7rem;
  line-height: 1.4;
}
 
.month-line__label {
  color: #6c757d;
  font-weight: 500;
}
.month-line__value {
  font-weight: 700;
  color: #212529;
}
 
/* Line color coding */
.month-line--regular {
  background: #e8f4f8;
}
.month-line--extra {
  background: #fff3cd;
}
.month-line--holiday-booking {
  background: #f0e6ff;
}
.month-line--total {
  background: #e9ecef;
  font-weight: 600;
}
.month-line--total .month-line__label {
  color: #495057;
  font-weight: 600;
}
.month-line--total .month-line__value {
  color: #495057;
}

/* ATTENDANT LINE */
.month-line--attendant {
  background: #d4edda;
  font-weight: 600;
  margin-top: 1px;
}
.month-line--attendant .month-line__label {
  color: #155724;
  font-weight: 600;
}
.month-line--attendant .month-line__value {
  color: #155724;
}

/* OVERNIGHT LINE */
.month-line--overnight {
  background: #f5f5f5;
  margin-top: 1px;
}

/* LEGEND */
.month-legend {
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
  font-size: 0.8rem;
  color: #6c757d;
  margin-bottom: 0.75rem;
}
.month-legend__item {
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.month-legend__dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
}
.month-legend__dot--regular    { background: #e8f4f8; border: 1px solid #b8dce8; }
.month-legend__dot--extra      { background: #fff3cd; border: 1px solid #ffeaa7; }
.month-legend__dot--holiday-booking { background: #f0e6ff; border: 1px solid #d4b8ff; }
.month-legend__dot--total      { background: #e9ecef; border: 1px solid #adb5bd; }
 
/* RESPONSIVE */
@media (max-width: 900px) {
  .month-line__label {
    display: none;
  }
  .month-line {
    justify-content: center;
  }
  .month-cell__holiday {
    display: none;
  }
}
 
@media (max-width: 600px) {
  .month-table {
    font-size: 0.75rem;
  }
  .month-cell {
    padding: 0.2rem;
  }
}