/*
 * Модуль «Повторяющиеся мероприятия».
 *
 * Подключается после redesign.css, но конфликта нет: все селекторы под
 * префиксом .rep-. Цвета берутся из переменных ре-скина, чтобы модуль не
 * выпадал из общей палитры при её правке.
 */

.rep-card {
    background: #fff;
    border: 1px solid #e6e8ee;
    border-radius: 12px;
    overflow: hidden;
}

.rep-table {
    margin: 0;
    font-size: .9rem;
}

.rep-table > thead th {
    background: #f7f8fb;
    border-bottom: 1px solid #e6e8ee;
    font-weight: 600;
    font-size: .8rem;
    color: #5a6274;
    padding: .6rem .9rem;
}

.rep-table > tbody td {
    padding: .65rem .9rem;
    vertical-align: middle;
    border-bottom: 1px solid #f0f1f5;
}

.rep-src-name { font-weight: 500; }

.rep-src-meta {
    font-size: .78rem;
    color: #8a90a0;
}

.rep-src-row--modular .rep-src-meta { color: #b8860b; }

.rep-badge {
    display: inline-block;
    min-width: 1.6rem;
    padding: .1rem .45rem;
    border-radius: 999px;
    background: #e8f0fe;
    color: #1a56c4;
    font-size: .8rem;
    font-weight: 600;
}

.rep-badge--warn {
    background: #fdf3d7;
    color: #96690a;
}

/* Структура образца читается до открытия планировщика. */
.rep-badge--slots {
    background: #e6f6ee;
    color: #12704a;
    font-size: .72rem;
    vertical-align: middle;
}

.rep-badge--three {
    background: #eee8ff;
    color: #6541b2;
    font-size: .72rem;
    vertical-align: middle;
}

.rep-empty {
    text-align: center;
    padding: 3.5rem 1rem;
    color: #6b7280;
}

.rep-empty i {
    font-size: 2.5rem;
    color: #c3c8d4;
    display: block;
    margin-bottom: .75rem;
}

.rep-empty p { max-width: 32rem; margin: .5rem auto 0; }

/* Два результата одного планировщика: обычные повторы или дни контейнера.
   Переключатель находится в потоке страницы, а не уводит в отдельную модалку. */
.rep-plan-kind {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem .9rem;
    margin-bottom: .75rem;
    background: #eef4ff;
    border: 1px solid #d5e2ff;
    border-radius: 12px;
}

.rep-plan-kind-copy {
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.rep-plan-kind .btn-group > .btn { border-radius: 0; }
.rep-plan-kind .btn-group > .btn:first-child {
    border-top-left-radius: .75rem;
    border-bottom-left-radius: .75rem;
}
.rep-plan-kind .btn-group > .btn:last-child {
    border-top-right-radius: .75rem;
    border-bottom-right-radius: .75rem;
}

.rep-planner-workspace--container {
    display: grid;
    grid-template-columns: minmax(20rem, 1fr) minmax(22rem, 30rem);
    gap: 1rem;
    align-items: start;
}

.rep-container-panel {
    min-width: 0;
    max-height: 48rem;
    overflow: auto;
    overscroll-behavior: contain;
    padding: 1rem;
    background: #fff;
    border: 1px solid #e6e8ee;
    border-radius: 12px;
}

.rep-container-panel-head,
.rep-container-template-head,
.rep-container-selected-head,
.rep-container-day-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.rep-container-panel-title {
    font-size: .95rem;
    font-weight: 700;
    color: #343b4a;
}

.rep-container-existing {
    margin-top: .8rem;
    padding: .65rem .75rem;
    background: #f3faf5;
    border: 1px solid #cfe8d7;
    border-radius: 10px;
}

.rep-container-existing-list {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.rep-container-existing-list span {
    padding: .18rem .45rem;
    color: #2f6b43;
    background: #fff;
    border: 1px solid #cfe8d7;
    border-radius: 999px;
    font-size: .74rem;
    font-variant-numeric: tabular-nums;
}

.rep-container-template {
    margin-top: .8rem;
    padding: .75rem;
    background: #f7f8fb;
    border: 1px solid #e6e8ee;
    border-radius: 10px;
}

.rep-container-template .form-label,
.rep-container-day .form-label {
    margin-bottom: .2rem;
    font-size: .76rem;
    font-weight: 600;
    color: #5a6274;
}

.rep-container-selected-head {
    margin: .9rem 0 .45rem;
    font-size: .82rem;
    font-weight: 600;
    color: #5a6274;
}

.rep-container-selected-head b {
    min-width: 1.55rem;
    padding: .05rem .4rem;
    text-align: center;
    color: #1a56c4;
    background: #e8f0fe;
    border-radius: 999px;
}

.rep-container-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    min-height: 5rem;
    padding: .75rem;
    text-align: center;
    color: #8a90a0;
    background: #fbfbfd;
    border: 1px dashed #cfd4df;
    border-radius: 10px;
    font-size: .82rem;
}

.rep-container-empty i { font-size: 1.35rem; color: #7896d8; }

.rep-container-day {
    margin-bottom: .45rem;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e0e4ec;
    border-radius: 10px;
}

.rep-container-day--open {
    border-color: #9db9f5;
    box-shadow: 0 2px 8px rgba(43, 108, 246, .08);
}

.rep-container-day-head { padding: .45rem .5rem .45rem .7rem; }

.rep-container-day-toggle {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    align-items: baseline;
    gap: .55rem;
    padding: 0;
    color: inherit;
    text-align: left;
    background: transparent;
    border: 0;
}

.rep-container-day-date {
    flex: 0 0 auto;
    font-size: .85rem;
    font-weight: 700;
}

.rep-container-day-summary {
    min-width: 0;
    overflow: hidden;
    color: #6b7280;
    font-size: .75rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rep-container-day-body {
    padding: .75rem;
    background: #fbfcff;
    border-top: 1px solid #edf0f5;
}

.rep-container-slot-row { margin-bottom: .3rem; }

.rep-container-result-note {
    display: flex;
    align-items: center;
    gap: .5rem;
    max-width: 40rem;
    color: #5a6274;
    font-size: .82rem;
}

.rep-container-result-note i { color: #2b6cf6; font-size: 1.1rem; }

/* --- Шапка планировщика --- */

.rep-plan-head {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.rep-plan-title { font-size: 1.05rem; font-weight: 600; }

.rep-plan-sub {
    font-size: .82rem;
    color: #6b7280;
}

.rep-plan-nav { display: flex; align-items: center; flex-wrap: wrap; }

#repPeriod {
    min-width: 8.5rem;
    color: #333 !important;
    opacity: 1 !important;
    font-weight: 500;
}

/* mira.css задаёт кнопкам без класса .btn-sm/.btn-lg собственный
   border-radius на всех четырёх углах; кнопки внутри .btn-group-sm его
   не получают (размер там только через CSS-переменные), и это правило
   той же специфичности, но позже в каскаде — перебивает «сшивку» углов
   соседних кнопок из Bootstrap. Возвращаем сшивку явно, для этих трёх
   групп переключателей периода. */
.rep-plan-nav .btn-group > .btn {
    border-radius: 0;
}

.rep-plan-nav .btn-group > .btn:first-child {
    border-top-left-radius: .75rem;
    border-bottom-left-radius: .75rem;
}

.rep-plan-nav .btn-group > .btn:last-child {
    border-top-right-radius: .75rem;
    border-bottom-right-radius: .75rem;
}

/* Bootstrap гасит disabled-кнопку целиком через opacity, поэтому у стрелок
   граница становилась светлее соседней кнопки периода. Недоступность оставляем
   нативной, но рамку держим того же цвета; приглушается только пиктограмма. */
.rep-plan-nav .btn-group > .btn.btn-outline-secondary:disabled,
.rep-chain-pager .btn.btn-outline-secondary:disabled {
    opacity: 1;
    border-color: var(--bs-btn-border-color);
    color: #a6acb7;
}

/* --- Массовые операции --- */

.rep-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem 1.25rem;
    padding: .75rem .9rem;
    background: #f7f8fb;
    border: 1px solid #e6e8ee;
    border-radius: 10px;
    margin-bottom: .75rem;
}

.rep-actions-group {
    display: flex;
    align-items: center;
    gap: .35rem;
}

.rep-actions-label {
    font-size: .78rem;
    color: #5a6274;
    font-weight: 600;
    margin-right: .15rem;
}

.rep-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    font-size: .78rem;
    color: #6b7280;
    margin-bottom: .75rem;
}

.rep-legend span { display: inline-flex; align-items: center; gap: .35rem; }

.rep-legend-hint { margin-left: auto; color: #8a90a0; font-style: italic; }

.rep-dot {
    width: .85rem;
    height: .85rem;
    border-radius: 4px;
    display: inline-block;
    border: 1px solid #d7dae3;
}

.rep-dot--sel { background: #2b6cf6; border-color: #2b6cf6; }
.rep-dot--hol { background: #ffe3e3; border-color: #f5b5b5; }
.rep-dot--exist { background: #e3f4e8; border-color: #a8d8b9; }
.rep-dot--lock {
    background: repeating-linear-gradient(45deg, #ffe9a8, #ffe9a8 3px, #f5cf6a 3px, #f5cf6a 6px);
    border-color: #e0b849;
}

/* --- Сетка календаря --- */

.rep-calendar { margin-bottom: 1rem; }

/* Одиночный месяц — компактная карточка, а не растянутая на всю ширину
   экрана: без ограничения ширина колонок росла вместе с контейнером, и
   квадратные (aspect-ratio) ячейки раздувались до ~260px, из-за чего сетка
   не влезала по высоте. */
.rep-calendar:not(.rep-calendar--year) .rep-month {
    max-width: 26rem;
}

.rep-calendar--year {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 1rem;
}

.rep-month {
    background: #fff;
    border: 1px solid #e6e8ee;
    border-radius: 12px;
    padding: .75rem;
}

.rep-month-title {
    font-weight: 600;
    font-size: .9rem;
    margin-bottom: .5rem;
    text-align: center;
}

.rep-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
}

.rep-dow {
    text-align: center;
    font-size: .72rem;
    color: #8a90a0;
    font-weight: 600;
    padding-bottom: .25rem;
}

.rep-day {
    /* Без min-width: 0 у ячейки был intrinsic-минимум от aspect-ratio,
       больше честной доли колонки 1fr — в узкой карточке года (~15rem)
       колонки отказывались сжиматься, и сетка месяца вылезала за карточку,
       наезжая на соседний месяц («съехали даты»). aspect-ratio убран
       совсем — квадратные ячейки в широком одиночном месяце и были
       источником чрезмерной высоты; вместо него — диапазон высоты. */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    position: relative;
    border-radius: 8px;
    font-size: .82rem;
    border: 1px solid transparent;
    user-select: none;
    min-width: 0;
    min-height: 2.6rem;
    max-height: 3.2rem;
}

.rep-day-num { line-height: 1.1; }

/* Время запланированного мероприятия — читаемой строкой под числом, а не
   иконкой: по нему сверяют расписание, пробегая глазами всю сетку. */
.rep-day-time {
    font-size: .62rem;
    line-height: 1;
    font-weight: 600;
    opacity: .9;
    letter-spacing: -.02em;
}

/* Метка «Слоты» в ячейке дня: занимает третью строку ячейки, поэтому
   намеренно мельче времени — число и время остаются главными. */
.rep-day-slots {
    font-size: .52rem;
    line-height: 1;
    font-weight: 700;
    letter-spacing: -.02em;
    color: #12704a;
    background: #e6f6ee;
    border-radius: 999px;
    padding: 0 .25rem;
}

.rep-day--void { visibility: hidden; }

.rep-day--pick {
    cursor: pointer;
    background: #f4f5f9;
    border-color: #e6e8ee;
}

.rep-day--pick:hover {
    background: #e8ecf5;
    border-color: #b9c3d8;
}

.rep-day--weekend { background: #eef0f6; color: #6b7280; }

.rep-day--hol {
    background: #ffe3e3;
    border-color: #f5b5b5;
    color: #a33a3a;
}

/* Выбранный день — главный акцент сетки: по нему видно будущую серию. */
.rep-day--sel,
.rep-day--sel.rep-day--hol,
.rep-day--sel.rep-day--weekend {
    background: #2b6cf6;
    border-color: #1e51c9;
    color: #fff;
    font-weight: 700;
    box-shadow: 0 1px 4px rgba(43, 108, 246, .35);
}

.rep-day--sel .rep-day-num { font-size: .95rem; }

/* Уже созданный повтор — тоже полноценная заливка, а не бледная пометка. */
.rep-day--exist .rep-day-num,
.rep-day--locked .rep-day-num { font-weight: 600; }

.rep-day--past {
    background: transparent;
    color: #c3c8d4;
    cursor: not-allowed;
}

.rep-day--exist {
    background: #e3f4e8;
    border-color: #a8d8b9;
    color: #2f6b43;
    cursor: not-allowed;
}

.rep-day--manage {
    cursor: pointer;
}

.rep-day--manage:hover {
    border-color: #56a873;
    box-shadow: 0 1px 5px rgba(47, 107, 67, .22);
}

/* День, который уже нельзя трогать (есть участники) — жёлтая диагональная
   штриховка: по ТЗ отличается от обычного «уже создано». */
.rep-day--locked {
    background: repeating-linear-gradient(45deg, #ffe9a8, #ffe9a8 4px, #f5cf6a 4px, #f5cf6a 8px);
    border-color: #e0b849;
    color: #6b5411;
    cursor: not-allowed;
}


/* --- Подвал: дата-ограничитель и запуск --- */

.rep-footer {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    align-items: flex-end;
    justify-content: space-between;
    padding: .9rem;
    background: #fff;
    border: 1px solid #e6e8ee;
    border-radius: 12px;
}

.rep-footer-until { display: flex; flex-direction: column; gap: .25rem; }

.rep-footer-until label {
    font-size: .8rem;
    font-weight: 600;
    color: #5a6274;
}

.rep-footer-until input { max-width: 12rem; }

.rep-hint { font-size: .74rem; color: #8a90a0; }

.rep-footer-right {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.rep-count { font-size: .85rem; color: #5a6274; }

/* --- Прогресс --- */

.rep-progress {
    max-width: 42rem;
    margin: 1rem auto;
    background: #fff;
    border: 1px solid #e6e8ee;
    border-radius: 12px;
    padding: 1.5rem;
}

.rep-progress-title { font-weight: 600; font-size: 1.05rem; }

.rep-progress-sub {
    color: #6b7280;
    font-size: .85rem;
    margin-bottom: .9rem;
}

.rep-progress-bar { height: 1.4rem; }

.rep-progress-stats {
    display: flex;
    gap: 1.25rem;
    margin-top: .75rem;
    font-size: .88rem;
    color: #5a6274;
}

.rep-progress-failed {
    margin-top: .5rem;
    font-size: .85rem;
    color: #a33a3a;
}

.rep-progress-hint {
    margin-top: 1rem;
    font-size: .8rem;
    color: #8a90a0;
}

.rep-progress-actions { margin-top: 1.25rem; }

.rep-failed-box {
    margin-top: 1rem;
    border: 1px solid #f0d0d0;
    border-radius: 10px;
    overflow: hidden;
}

.rep-failed-title {
    background: #fdf0f0;
    padding: .5rem .75rem;
    font-size: .82rem;
    font-weight: 600;
    color: #a33a3a;
}

.rep-failed-box table { font-size: .8rem; }

/* --- Статистика (админ) --- */

.rep-stats-toggle { margin-top: 1rem; }
.rep-stats { margin-top: .75rem; }

/* --- Цепочка --- */

.rep-chain { margin-top: 1.5rem; }

.rep-chain-title {
    font-size: .9rem;
    font-weight: 600;
    color: #5a6274;
    margin-bottom: .5rem;
}

.rep-chain-row--archived { opacity: .55; }

.rep-chain-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .5rem;
}

.rep-chain-head-actions,
.rep-chain-pager {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.rep-chain-pager {
    color: #6b7280;
    font-size: .82rem;
    font-variant-numeric: tabular-nums;
}

/* --- История действий --- */

.rep-history { margin-top: .75rem; }

.rep-hist-act {
    font-size: .78rem;
    padding: .1rem .4rem;
    border-radius: 999px;
    background: #eef0f6;
    color: #5a6274;
    white-space: nowrap;
}

.rep-hist-act--create { background: #e3f4e8; color: #2f6b43; }
.rep-hist-act--delete { background: #fdecec; color: #a33a3a; }

/* Удаление — единственное необратимое действие, помечаем строку. */
.rep-hist-row--delete td { background: #fffafa; }

/* --- Цепочка повторов: ID-ссылки и дерево компонентов --- */

.rep-meid-link {
    font-variant-numeric: tabular-nums;
    text-decoration: none;
    border-bottom: 1px dashed currentColor;
}
.rep-meid-link:hover { text-decoration: none; opacity: .8; }

.rep-chain-id { font-size: .82rem; }

.rep-chain-count {
    margin-left: .4rem;
    font-size: .72rem;
    color: #5a6274;
    background: #eef0f6;
    border-radius: 999px;
    padding: .05rem .4rem;
    white-space: nowrap;
}

/* Компоненты повтора — вложенной строкой: приглушены, чтобы взгляд читал
   сначала сами повторы, а состав раскрывался вторым слоем. */
.rep-chain-row--child td {
    background: #fbfbfd;
    color: #5a6274;
    font-size: .84rem;
    padding-top: .2rem;
    padding-bottom: .2rem;
}
.rep-tree-branch { color: #b9c3d8; margin-right: .25rem; }
.rep-chain-child-time { font-variant-numeric: tabular-nums; }
.rep-chain-child-name { padding-left: .25rem; }

/* --- Диалог тайм-слотов --- */

.rep-slots-lead { font-size: .9rem; color: #5a6274; }

.rep-slots-subtitle {
    font-size: .8rem;
    font-weight: 600;
    color: #5a6274;
    margin: .5rem 0 .35rem;
}

.rep-slots-existing {
    background: #f6f7fb;
    border-radius: .5rem;
    padding: .4rem .6rem;
}

.rep-slot-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-bottom: .35rem;
}

/* Поле времени — текстовое со списком кратных 15 минутам значений:
   input[type=time] шагает стрелками по одной минуте, а нужна именно сетка. */
.rep-slot-input {
    max-width: 6.5rem;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

/* Уже заведённые слоты: время и название неизменяемы, вместимость правится
   точечно прямо в планировщике. */
.rep-slot-row--old { flex-wrap: wrap; font-size: .85rem; color: #5a6274; }
.rep-slot-row--archived { opacity: .65; background: #f3f4f6; border-radius: .35rem; padding: .15rem .35rem; }
.rep-container-day--archived { opacity: .75; background: #f9fafb; }
.rep-badge--archived { background: #e5e7eb; color: #4b5563; font-size: .72rem; vertical-align: middle; }
.rep-slot-time { font-weight: 600; font-variant-numeric: tabular-nums; }
.rep-slot-time-edit { display: inline-flex; align-items: center; gap: .25rem; }
.rep-slot-time-edit .rep-slot-input { max-width: 4.6rem; padding: .15rem .3rem; }
.rep-slot-time-edit .btn { padding: .15rem .4rem; line-height: 1.1; }
.rep-slot-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.rep-slots-note { font-size: .82rem; }

/* ID слота и кнопка удаления прижаты вправо: строка читается как
   «время — название — что с ним можно сделать». */
.rep-slot-meid { margin-left: auto; font-size: .78rem; }
.rep-slot-row--old .rep-slot-drop,
.rep-slot-row--old .rep-slot-arch { padding: .15rem .35rem; line-height: 1.1; }
.rep-slot-row--old .rep-slot-name { flex: 0 1 auto; }
.rep-slot-capacity { display: inline-flex; align-items: center; gap: .3rem; margin-left: auto; white-space: nowrap; }
.rep-slot-capacity > span { font-size: .75rem; color: #6b7280; }
.rep-slot-capacity input { width: 5.4rem; text-align: right; font-variant-numeric: tabular-nums; }
.rep-slot-capacity .btn { padding: .2rem .42rem; line-height: 1.1; }
.rep-slot-capacity + .rep-slot-meid { margin-left: 0; }
.rep-slot-actions { display: inline-flex; align-items: center; gap: .25rem; }
.rep-day--manage { cursor: pointer; }
.rep-day--manage:hover { outline: 2px solid #0d6efd; outline-offset: -2px; }

.rep-chain-row--add td {
    padding-top: .15rem;
    padding-bottom: .45rem;
    background: #fbfbfd;
}
.rep-chain-add-slot-link {
    font-size: .8rem;
    color: #0d6efd;
    font-weight: 500;
}
.rep-chain-add-slot-link:hover {
    color: #0a58ca;
    text-decoration: underline !important;
}
.rep-add-slot-card {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    padding: .75rem;
}

@media (max-width: 980px) {
    .rep-planner-workspace--container { grid-template-columns: 1fr; }
    .rep-container-panel { max-height: none; }
}

@media (max-width: 640px) {
    .rep-plan-kind { align-items: stretch; flex-direction: column; }
    .rep-plan-kind .btn-group { display: grid; grid-template-columns: 1fr; }
    .rep-plan-kind .btn-group > .btn {
        border-radius: .75rem !important;
        margin-top: .35rem;
    }
    .rep-planner-workspace--container { display: block; }
    .rep-container-panel { margin-bottom: 1rem; }
    .rep-container-day-toggle { align-items: flex-start; flex-direction: column; gap: .1rem; }
    .rep-container-day-summary { white-space: normal; }
    .rep-actions { gap: .5rem .75rem; }
    .rep-actions-group { flex: 1 1 100%; }
    .rep-footer { flex-direction: column; align-items: stretch; }
    .rep-footer-right { justify-content: space-between; }
    .rep-chain-head { align-items: flex-start; flex-direction: column; }
    .rep-chain-head-actions { width: 100%; justify-content: space-between; }
}