@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Roboto:wght@400;500&display=swap');

:root {
  /* Fonts */
  --headings-font-family: 'Poppins', sans-serif;
  --body-font-family: 'Roboto', sans-serif;

  /* Backgrounds */
  --light-background: #efebe9;
  --light-background-micro-variation: #e0e0e0;
  --dark-background: #2a2725;
  --dark-background-micro-variation: #1a1a1a;

  /* Accent colors */
  --accent-color-1: #9b8fbf;
  --accent-color-1-hover: #ffb024;
  --accent-color-2: #6970b9;
  --accent-color-2-hover: #95603b;

  --accent-color-3: #f8d7da;
  --accent-color-4: #e8848d;
  --accent-color-5: #B96970;
  --accent-color-6: #6970b9;

  /* Text colors */
  --text-on-dark: #ffffff;
  --text-on-dark-alternative: #f0f0f0;
  --text-on-light: #1a1a1a;
  --text-on-light-alternative: #333333;
  --text-on-accent-1: #1a1a1a;
  --text-on-accent-2: #ffffff;

  /* Stroke */
  --stroke-color: #a76d3e;
  --stroke-color-on-dark: #ffcc29;

  /* Border radius */
  --button-border-radius: 0.5rem;
  --tile-border-radius: 0.25rem;

  /* Shift zone colors */
  --shift-night-color: var(--accent-color-5);
  --shift-day-color: var(--accent-color-4);
}

/* Общие стили для карточек смен */
.shift-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  z-index: 0;
}
.shift-zone {
  height: 100%;
}
.shift-zone.night {
  background: var(--shift-night-color);
}
.shift-zone.day {
  background: var(--shift-day-color);
}
.shift-content {
  position: relative;
  z-index: 1;
  color: #f0f0f0;
}
.shift-content-emoji {
  margin-left: 24px;
}
.shift-emoji {
  position: absolute;
  left: 4px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  font-size: 18px;
  line-height: 1;
  text-shadow: 0 0 2px #fff, 0 0 8px #fff;
}