:root {
  --primary-color: #3498db;
  --secondary-color: #2c3e50;
  --accent-color: #28a745;
  --text-color: #ffffff;
  --bg-color: #2c3e50;
  --header-bg: #34495e;
  --today-bg: rgba(52, 152, 219, 0.3);
  --event-bg: #28a745;
  --completed-event-bg: #6c757d;
}

body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
  background-color: var(--bg-color);
  color: var(--text-color);
}

#calendar {
  padding: 5px;
}

/* Оптимизация для мобильных устройств */
.fc .fc-toolbar.fc-header-toolbar {
  margin-bottom: 0.5em;
  flex-wrap: wrap;
}

.fc .fc-toolbar-title {
  font-size: 1.2em;
  margin: 0.5em 0;
}

.fc .fc-button {
  padding: 0.3em 0.6em;
  font-size: 0.9em;
}

/* Стили для событий */
.fc-event {
  cursor: pointer;
  border: none !important;
  margin: 1px 2px;
  padding: 1px 3px;
  font-size: 0.85em;
  color: var(--text-color) !important;
}

.fc-event-main {
  display: flex;
  align-items: center;
}

/* Стили для заголовков и дат */
.fc-col-header-cell-cushion,
.fc-daygrid-day-number,
.fc-timegrid-slot-label-cushion,
.fc-toolbar-title {
  color: var(--text-color) !important;
  text-decoration: none !important;
}

/* Стили для кнопок навигации */
.fc-button {
  color: var(--text-color) !important;
  background-color: rgba(255, 255, 255, 0.2) !important;
  border: none !important;
  transition: background-color 0.2s;
}

.fc-button:hover {
  background-color: rgba(255, 255, 255, 0.3) !important;
}

.fc-button-active {
  background-color: var(--primary-color) !important;
}

/* Текущая дата */
.fc-day-today {
  background-color: var(--today-bg) !important;
}

.fc-day-today .fc-daygrid-day-number {
  font-weight: bold;
}

/* Общие стили для календаря */
.fc {
  background-color: var(--bg-color);
}

.fc-col-header {
  background-color: var(--header-bg);
}

.fc-daygrid-day {
  background-color: var(--bg-color);
  border-color: var(--header-bg) !important;
}

/* Адаптивные стили для разных размеров экрана */
@media (max-width: 600px) {
  .fc .fc-toolbar.fc-header-toolbar {
    flex-direction: column;
    align-items: flex-start;
  }
  
  .fc .fc-toolbar-title {
    font-size: 1em;
    margin: 0.3em 0;
  }
  
  .fc .fc-button {
    padding: 0.2em 0.4em;
    font-size: 0.8em;
    margin: 2px;
  }
  
  .fc .fc-view-harness {
    min-height: 60vh;
  }
  
  .fc-event {
    font-size: 0.75em;
    padding: 0 2px;
  }
}

/* Стили для модальных окон */
.modal {
  display: none;
  position: fixed;
  z-index: 1001;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.7);
  overflow-y: auto;
}

.modal-content {
  background-color: var(--bg-color);
  margin: 20px auto;
  padding: 20px;
  border: 1px solid var(--header-bg);
  width: 90%;
  max-width: 500px;
  border-radius: 10px;
  color: var(--text-color);
  text-align: center;
}

.close {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
}

.close:hover {
  color: var(--text-color);
}

/* Стили для формы */
input, button, select {
  width: 100%;
  padding: 10px;
  margin: 8px 0;
  box-sizing: border-box;
  border: 1px solid var(--header-bg);
  border-radius: 5px;
  background-color: var(--header-bg);
  color: var(--text-color);
}

button {
  background-color: var(--accent-color) !important;
  color: white;
  border: none;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.2s;
}

button:hover {
  background-color: #218838 !important;
}

label {
  display: block;
  margin-top: 10px;
  text-align: left;
}

/* Анимации */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.modal {
  animation: fadeIn 0.3s;
}

.fc-addEvent-button {
  background-color: var(--accent-color) !important;
  border: none !important;
  margin-right: 10px !important;
}

.fc-addEvent-button:hover {
  background-color: #218838 !important;
}

/* Стили для панели инструментов */
.fc-header-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 10px 5px;
}

.fc-toolbar-chunk {
  display: flex;
  align-items: center;
  gap: 8px;
}

.fc-toolbar-title {
  font-size: 1.2em;
  margin: 0 15px;
  flex-grow: 1;
  text-align: center;
}

/* Для мобильных устройств */
@media (max-width: 600px) {
  .fc-header-toolbar {
    flex-direction: column;
    gap: 8px;
  }
  
  .fc-toolbar-chunk {
    width: 100%;
    justify-content: center;
  }
  
  .fc-toolbar-title {
    order: -1;
    margin: 5px 0;
  }
}

/* Стили для событий по приоритетам */
.fc-event.priority-1 {
  background-color: #ff6b6b;
  border-color: #d64545;
}

.fc-event.priority-2 {
  background-color: #ffd166;
  border-color: #e6b422;
}

.fc-event.priority-3 {
  background-color: #06d6a0;
  border-color: #049c7a;
}

/* Стили для выбора приоритета */
#taskPriority {
  margin-top: 10px;
  padding: 8px;
  border-radius: 4px;
}

#taskPriority option {
  padding: 5px;
}

/* Стили для окна редактирования */
.task-info {
  background-color: var(--header-bg);
  padding: 10px;
  border-radius: 5px;
  margin-bottom: 15px;
}

.task-info p {
  margin: 5px 0;
}

.modal-buttons {
  display: flex;
  gap: 10px;
  margin-top: 20px;
}

.btn-update {
  background-color: #28a745 !important;
  flex: 1;
}

.btn-delete {
  background-color: #dc3545 !important;
  flex: 1;
}

.btn-cancel {
  background-color: #6c757d !important;
  flex: 1;
}

.form-group {
  margin-bottom: 15px;
}

.form-group label {
  display: block;
  margin-bottom: 5px;
  font-weight: bold;
}