/* RECRE-417 — «Вихідний канал: експорт у календар».
   Кнопка експорту ПОТОЧНОГО відфільтрованого списку афіші в один файл
   .ics; живе поруч із чипами періоду на головній.

   Окремий файл, а не main.css: той заблокований паралельним WIP
   (прецедент — home-regions.css / catalog-regions.css). Підключається
   лише на головній, з news_home.html. */

/* Рядок «чипи періоду + експорт»: .home-chips вибудовує прямих дітей
   колонкою, тож без цієї обгортки кнопка з'їхала б в окремий рядок.
   align-items: center, а не stretch — кнопка нижча за групу чипів, що
   переноситься на два ряди, і розтягувати її на всю висоту не треба.
   margin-left: auto притискає експорт до правого краю, відділяючи
   ДІЮ від ФІЛЬТРІВ; на вузькому екрані (нижче) це знімається. */
.home-chips__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

/* Візуально — та сама шавлієва пігулка, що .evcal__btn--ics на картці
   події (main.css): це одна родина дій «покласти в календар», і різний
   вигляд у списку та в картці читався б як різна дія. Значення токенів
   повторюються, бо на файл із main.css спиратися не можна. */
.cal-export {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-left: auto;
    font-family: inherit;
    font-size: 12.5px;
    font-weight: 700;
    line-height: 1;
    padding: 8px 14px;
    border-radius: 30px;
    border: 1px solid #D6DFC4;
    background: var(--chip-amenity-bg);
    color: var(--chip-amenity-fg);
    cursor: pointer;
    text-decoration: none;
    white-space: nowrap;
    transition: background .18s, border-color .18s, transform .18s;
}

.cal-export i,
.cal-export svg { width: 15px; height: 15px; flex: none; }

.cal-export:hover { background: #DCE4CB; transform: translateY(-1px); }

.cal-export:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(126, 148, 102, .38);
}

/* Обов'язкова пара до :hidden у розмітці: display: inline-flex вище —
   правило автора, воно перебиває слабкий UA-дефолт `[hidden]`, і
   прихована кнопка лишилась би видимою. Той самий прийом, що в
   home-regions.css для .feed-bar. */
.cal-export[hidden] { display: none !important; }

/* Дотик: хіт-таргет 44px без зміни десктопної щільності — 1:1 з
   .evcal__btn у main.css. */
@media (pointer: coarse) {
    .cal-export { min-height: 44px; padding: 12px 16px; }
}

@media (prefers-reduced-motion: reduce) {
    .cal-export:hover { transform: none; }
}

/* Вузький екран: притискання вправо втрачає сенс (чипи й так на кілька
   рядів) — кнопка стає повноширинною й центрованою, як решта дій. */
@media (max-width: 560px) {
    .cal-export {
        margin-left: 0;
        width: 100%;
        justify-content: center;
    }
}