/* MONTHLY CALENDAR TABLES */
.cc-monthly-calendar-wrap {
  font-family: "Roboto", Arial, sans-serif;
  font-size: 18px;
}

.cc-monthly-calendar {
  width: 100%;
  border-collapse: collapse;
}

.cc-monthly-calendar th,
.cc-monthly-calendar td {
  text-align: center;
}

.cc-monthly-calendar thead th {
  background: #05599C;
  color: #ffffff;
  font-weight: 600;
  padding: 12px 14px;
}

.cc-monthly-calendar {
  border-radius: 10px;
  overflow: hidden;
}

.cc-monthly-calendar thead th:first-child {
  border-top-left-radius: 10px;
}

.cc-monthly-calendar thead th:last-child {
  border-top-right-radius: 10px;
}

.cc-monthly-calendar tbody td {
  font-weight: 400;
  padding: 12px 14px;
  vertical-align: middle;
}

.cc-monthly-calendar tbody tr:nth-child(odd) {
  background: #f0f0f0;
}

.cc-monthly-calendar tbody tr:nth-child(even) {
  background: #ffffff;
}

.cc-monthly-calendar tbody tr:hover {
  background: #e6f7e6;
  cursor: pointer;
}

.cc-monthly-calendar a {
  color: inherit;
  text-decoration: none;
}

.cc-monthly-calendar a:hover {
  text-decoration: underline;
}

.cc-monthly-calendar td:last-child {
  font-weight: 500;
}

.cc-monthly-calendar {
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.cc-monthly-calendar th:last-child,
.cc-monthly-calendar td:last-child {
  white-space: nowrap;
}

@media (max-width: 767px) {

  /* Slightly smaller text so all columns fit */
  .cc-monthly-calendar-wrap {
    font-size: 16px;
  }

  /* Tighter padding on mobile */
  .cc-monthly-calendar thead th,
  .cc-monthly-calendar tbody td {
    padding: 10px 8px;
  }

  /* Hide the original header text */
  .cc-monthly-calendar thead th {
    font-size: 0;
  }

  /* Replace header labels with shorter versions */
  .cc-monthly-calendar thead th:nth-child(1)::after {
    content: "Month";
    font-size: 16px;
    font-weight: 600;
  }

  .cc-monthly-calendar thead th:nth-child(2)::after {
    content: "Cruises";
    font-size: 16px;
    font-weight: 600;
  }

  .cc-monthly-calendar thead th:nth-child(3)::after {
    content: "Sailings";
    font-size: 16px;
    font-weight: 600;
  }

  .cc-monthly-calendar thead th:nth-child(4)::after {
    content: "From";
    font-size: 16px;
    font-weight: 600;
  }

}