body { background: #f8f9fa; color: #222; }
footer { position: relative; bottom: 0; width: 100%; background: #fff; color: #222; border-top: 1px solid #eee; }
#announcements li { margin-bottom: 0.5em; font-size: 1.1em; }
#due-soon { min-height: 2em; }
#due-soon ul.list-group { margin-top: 1em; }
.list-group-item-warning { background-color: #fffbe6 !important; border-color: #ffeeba !important; color: #222 !important; }
.list-group-item-info { background-color: #e3f2fd !important; border-color: #b3e5fc !important; color: #222 !important; }
#calendar-ui { margin-top: 2em; background: #fff; border-radius: 1em; box-shadow: 0 2px 12px rgba(0,0,0,0.04); padding: 1em; }

/* Home page hero section */
.hero {
  background: #fff;
  color: #222;
  border: 1px solid #eee;
  box-shadow: 0 4px 24px rgba(0,0,0,0.04);
  padding: 2.5em 1em 2em 1em;
  border-radius: 1em;
  margin-bottom: 2em;
}
.hero h1 { font-size: 2.5em; font-weight: 700; }
.hero p { font-size: 1.3em; }

/* Announcements styling */
#announcements li { margin-bottom: 0.5em; font-size: 1.1em; }

/* Placement tips */
.placement-tips { background: #e3f2fd; border-left: 5px solid #1976d2; padding: 1em; border-radius: 0.5em; margin-top: 2em; }

/* Calendar styles */
.calendar-table { box-shadow: 0 4px 24px rgba(0,0,0,0.07); border-radius: 1em; overflow: hidden; }
.calendar-table th, .calendar-table td { text-align: left; padding: 0.5em 0.4em; border: 1px solid #f0f0f0; }
.calendar-table .bg-danger { background: #e53935 !important; color: #fff !important; }
.calendar-table .bg-light { background: #f8f9fa !important; color: #bbb !important; }
.calendar-table .bg-warning { background: #fffde7 !important; color: #222 !important; }
.calendar-table .bg-success { background: #43a047 !important; color: #fff !important; }
.calendar-table .bg-primary { background: #1976d2 !important; color: #fff !important; }
.calendar-table .bg-info { background: #0288d1 !important; color: #fff !important; }
.calendar-table .bg-secondary { background: #757575 !important; color: #fff !important; }
.calendar-table .text-dark { color: #222 !important; }
.calendar-table .badge { border-radius: 0.4em; font-weight: 500; }

/* Resource tiles */
.resource-tile {
  background: #f5f8fd;
  color: #1976d2;
  border: 1px solid #e3eafc;
  font-weight: 500;
  transition: all 0.15s;
}
.resource-tile:hover, .resource-tile:focus {
  background: #e3eafc;
  color: #0d47a1;
  text-decoration: none;
  box-shadow: 0 2px 12px rgba(25, 118, 210, 0.08);
}

/* Responsive tweaks */
@media (max-width: 600px) {
  .calendar-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100vw;
    max-width: 100vw;
    margin-left: -16px;
    padding-left: 0;
  }
  .calendar-table {
    min-width: 700px;
    width: 700px;
    table-layout: fixed;
  }
  .calendar-table th, .calendar-table td {
    width: 14.2857%;
    min-width: 100px;
    max-width: 100px;
    font-size: 0.95em;
    padding: 0.3em 0.2em;
    text-align: center;
    box-sizing: border-box;
  }
  .calendar-table tr, .calendar-table thead, .calendar-table tbody {
    display: table-row;
    width: 100%;
  }
  .calendar-table .badge {
    font-size: 0.85em;
    padding: 0.2em 0.5em;
  }
}
@media (max-width: 400px) {
  .calendar-badge {
    display: block;
    margin-bottom: 2px;
  }
}