/* site/css/calendar.css — FinancialDS preview-only Calendar styles (BEM) */

/* ── Calendar container ── */
.ds-cal {
  display: inline-flex;
  flex-direction: column;
  background: var(--ds-cal-bg);
  width: var(--ds-cal-width-md);
  border-radius: var(--ds-cal-dropdown-r-md);
  box-shadow: var(--ds-cal-shadow);
  overflow: hidden;
}
.ds-cal[data-size="sm"] {
  width: var(--ds-cal-width-sm);
  border-radius: var(--ds-cal-dropdown-r-sm);
}

/* ── Title (standalone mode, no nav) ── */
.ds-cal__title {
  padding: var(--ds-cal-part-py-md) var(--ds-cal-part-px-md);
  font-size: var(--ds-cal-text-size-md);
  font-weight: 600;
  color: var(--ds-text-primary);
  text-align: center;
  border-bottom: 1px solid var(--ds-border);
  text-transform: capitalize;
}
.ds-cal[data-size="sm"] .ds-cal__title {
  padding: var(--ds-cal-part-py-sm) var(--ds-cal-part-px-sm);
  font-size: var(--ds-cal-text-size-sm);
}

/* ── Navigation header ── */
.ds-cal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--ds-cal-part-py-md) var(--ds-cal-part-px-md);
  min-height: var(--ds-cal-part-height-md);
  border-bottom: 1px solid var(--ds-border);
}
.ds-cal[data-size="sm"] .ds-cal__header {
  padding: var(--ds-cal-part-py-sm) var(--ds-cal-part-px-sm);
  min-height: var(--ds-cal-part-height-sm);
}
.ds-cal__nav {
  display: flex;
  gap: 4px;
  align-items: center;
}
.ds-cal__nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--ds-text-secondary);
  font-size: 18px;
  line-height: 1;
  transition: background 0.1s;
}
.ds-cal__nav-btn:hover {
  background: var(--ds-cal-day-bg-hover);
}
.ds-cal__nav-label {
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: var(--ds-cal-text-size-md);
  font-weight: 600;
  color: var(--ds-cal-nav-color);
  padding: 2px 6px;
  border-radius: 4px;
  transition: color 0.1s;
}
.ds-cal__nav-label:hover {
  color: var(--ds-cal-nav-color-hover);
}
.ds-cal[data-size="sm"] .ds-cal__nav-label {
  font-size: var(--ds-cal-text-size-sm);
}

/* ── Day grid ── */
.ds-cal__grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  padding: var(--ds-cal-part-py-md) var(--ds-cal-part-px-md);
}
.ds-cal[data-size="sm"] .ds-cal__grid {
  padding: var(--ds-cal-part-py-sm) var(--ds-cal-part-px-sm);
}
.ds-cal__wlabel {
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--ds-cal-part-height-md);
  font-size: var(--ds-cal-text-size-md);
  font-weight: 500;
  color: var(--ds-text-tertiary);
  border-bottom: 1px solid var(--ds-border);
  margin-bottom: 9px; /* Figma img/33: 9px gap after weekday labels row */
}
.ds-cal[data-size="sm"] .ds-cal__wlabel {
  height: var(--ds-cal-part-height-sm);
  font-size: var(--ds-cal-text-size-sm);
}
.ds-cal__day {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--ds-cal-date-size-md);
  height: var(--ds-cal-date-size-md);
  margin: 2px auto; /* Figma img/33: 4px gap between day rows = 2+2 margin */
  border: none;
  background: transparent;
  cursor: pointer;
  color: var(--ds-cal-day-text);
  border-radius: var(--ds-cal-part-r-md);
  font-size: var(--ds-cal-text-size-md);
  transition: background 0.1s;
}
.ds-cal[data-size="sm"] .ds-cal__day {
  width: var(--ds-cal-date-size-sm);
  height: var(--ds-cal-date-size-sm);
  border-radius: var(--ds-cal-part-r-sm);
  font-size: var(--ds-cal-text-size-sm);
}
.ds-cal__day:hover:not([data-disabled]) {
  background: var(--ds-cal-day-bg-hover);
}
.ds-cal__day[data-state="active"] {
  background: var(--ds-cal-day-bg-active);
  color: var(--ds-cal-day-text-active);
}
.ds-cal__day[data-state="active"]:hover {
  background: var(--ds-cal-day-bg-active-hover);
}
.ds-cal__day[data-state="today"] {
  box-shadow: var(--ds-cal-day-border-today);
}
.ds-cal__day[data-state="in-range"] {
  background: var(--ds-cal-day-bg-in-range);
  border-radius: 0;
}
.ds-cal__day[data-adjacent] {
  color: var(--ds-cal-day-text-adjacent);
}
/* Weekend red: shown for all states except active (Figma img/9: today+weekend = red text + border) */
.ds-cal__day[data-weekend]:not([data-state="active"]):not([data-state="in-range"]) {
  color: var(--ds-cal-day-text-weekend);
}
.ds-cal__day[data-disabled] {
  color: var(--ds-cal-day-text-disabled);
  cursor: default;
  pointer-events: none;
}

/* ── Dark mode overrides ── */
[data-theme="dark"] .ds-cal__day:hover:not([data-disabled]) {
  background: var(--ds-cal-day-bg-hover); /* resolves to nba-40 in dark */
}

/* ── Footer ── */
.ds-cal__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--ds-cal-footer-gap-md);
  padding: var(--ds-cal-part-py-md) var(--ds-cal-part-px-md);
  border-top: 1px solid var(--ds-border);
}
.ds-cal[data-size="sm"] .ds-cal__footer {
  padding: var(--ds-cal-part-py-sm) var(--ds-cal-part-px-sm);
  gap: var(--ds-cal-footer-gap-sm);
}
/* "Сегодня" — outlined button, left side */
.ds-cal__apply {
  height: var(--ds-cal-part-height-md);
  padding: 0 16px;
  background: transparent;
  color: var(--ds-text-primary);
  border: 1px solid var(--ds-nba-border);
  border-radius: var(--ds-cal-part-r-md);
  cursor: pointer;
  font-size: var(--ds-cal-text-size-md);
  font-weight: 500;
  font-family: var(--ds-font);
  transition: background 0.1s;
}
.ds-cal__apply:hover {
  background: var(--ds-cal-day-bg-hover);
}
/* "Очистить" — ghost button, right side (no border per Figma img/1,2,3,4) */
.ds-cal__cancel {
  height: var(--ds-cal-part-height-md);
  padding: 0 16px;
  background: transparent;
  color: var(--ds-text-secondary);
  border: none;
  border-radius: var(--ds-cal-part-r-md);
  cursor: pointer;
  font-size: var(--ds-cal-text-size-md);
  font-family: var(--ds-font);
  transition: background 0.1s;
}
.ds-cal__cancel:hover {
  background: var(--ds-cal-day-bg-hover);
}
.ds-cal[data-size="sm"] .ds-cal__apply,
.ds-cal[data-size="sm"] .ds-cal__cancel {
  height: var(--ds-cal-part-height-sm);
  font-size: var(--ds-cal-text-size-sm);
  border-radius: var(--ds-cal-part-r-sm);
}