* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: Arial, sans-serif;
  margin: 0 auto;
  line-height: 1.5;
  color: white;
}

header {
  background-color: #36013F;
  background-image: url('images/wallpaper.png');
  background-size: cover;
  background-position: center;
  padding: 1rem;
  text-align: center;
  height: 350px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 1);
}

header h1 {
  margin: 0;
  font-size: 60px;
  text-transform: uppercase;
}

nav {
  background-color: black;
  padding: 15px 0;
  border-bottom: 4px solid white;
}

nav ul {
  list-style: none;
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
}

nav a {
  color: white;
  text-decoration: none;
}

nav a:hover {
  text-decoration: underline;
}

.content-wrapper {
  display: flex;
  min-height: calc(100vh - 120px);
}

aside {
  width: 300px;
  background-color: black;
  padding: 30px;
  border-left: 4px solid #ddd;
}

main {
  flex: 1;
  padding: 20px;
  background-color: black;
}

/* Календарь */
.flatpickr-calendar {
  width: 240px !important; /* или нужная вам ширина */
}

.flatpickr-days {
  width: 240px !important;
}

.dayContainer {
  width: 240px !important;
  min-width: 240px !important;
  max-width: 240px !important;
}

/* Стиль для сегодняшнего дня */
.today-highlight {
    background-color: black !important;
    border-radius: 50%;
    color: white !important;
}

/* Стиль для дней рождений */
.birthday-highlight {
    background-image: linear-gradient(in hsl longer hue, red, purple) !important;
    border-radius: 50%;
    color: white !important;
}

/* Если сегодняшний день совпадает с днем рождения */
.today-highlight.birthday-highlight {
    background-color: purple !important;
}

/* Стили для динамического контента */
.message-card {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 20px;
    border-radius: 10px;
    margin: 20px 0;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.default-message .message-card {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

.date-info {
    font-size: 0.9em;
    opacity: 0.9;
    margin-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.3);
    padding-top: 10px;
}

.message-card {
    display: flex;
    align-items: center;
    gap: 20px;
}

.birthday-image {
    max-width: 100px;
    max-height: 100px;
    margin: 0;
    flex-shrink: 0;
}

.birthday-text {
    margin: 0;
    flex: 1;
}

.stamps {
    text-align: center;
    margin-top: 20px;
}

.stamps img {
    max-width: 75px;
}