/* event.css — 5.2: ивент на главной (event.js): фон, фишка тыкв, кнопка, баннер, меню ивента.
   Оформление конкретного ивента — по классу на <body>: event-<theme> (theme из config/events.json). */

/* ===== Хэллоуин 2026 ===== */
body.event-hw26{
  --bg-image: url("assets/events/hw26/bg_farm.webp?h=eb7655eca9");
  --ev-accent: #ff9a2e;
  --ev-accent-2: #ffc46b;
}

/* ===== фишка тыкв: 4-я в строке денег ===== */
#main-tab .home-chips.has-event{ grid-template-columns: minmax(0, 1fr) minmax(0, .85fr) minmax(0, .85fr) minmax(0, 1.25fr); gap: 5px; }
#main-tab .home-chips.has-event .home-chip{ font-size: 13px; gap: 3px; }
#main-tab .home-chips.has-event .home-chip--income{ font-size: 12px; }
#main-tab .home-chip--event{
  font-family: inherit; padding: 0; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
  background: rgba(255,154,46,.14); border-color: rgba(255,154,46,.4); color: #ffd9a8;
}
#main-tab .home-chip--event:active{ transform: scale(.96); }
#main-tab .home-chip--event .chip-icon{ font-size: 14px; line-height: 1; }

/* ===== кнопка ивента в строке кнопок ===== */
#main-tab .home-ico--event{
  background: linear-gradient(180deg, rgba(255,154,46,.32), rgba(255,154,46,.14));
  border-color: rgba(255,154,46,.6);
  box-shadow: 0 0 12px rgba(255,154,46,.25);
}
#main-tab .home-ico--event .ev-btn__ico{ font-size: 20px; line-height: 1; }

/* ===== баннер под карточкой профиля ===== */
#main-tab > .ev-banner{ flex: 0 0 auto; width: 100%; }
.ev-banner{ position: relative; display: flex; align-items: stretch; margin-top: 8px; border-radius: 16px; overflow: hidden;
  border: 1px solid rgba(255,154,46,.45);
  background: linear-gradient(90deg, rgba(120,52,10,.92), rgba(40,28,70,.9)); box-shadow: 0 6px 18px rgba(0,0,0,.3); }
.ev-banner__main{ flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 8px 6px 8px 10px; border: 0; background: none;
  color: #fff; font-family: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ev-banner__ico{ flex: 0 0 auto; font-size: 26px; line-height: 1; filter: drop-shadow(0 0 8px rgba(255,154,46,.6)); }
.ev-banner__txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ev-banner__txt b{ font-size: 15px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-banner__txt small{ font-size: 12px; font-weight: 800; color: #ffd9a8; font-variant-numeric: tabular-nums; }
.ev-banner__go{ flex: 0 0 auto; height: 32px; padding: 0 14px; border-radius: 10px; display: inline-flex; align-items: center;
  background: linear-gradient(180deg, var(--ev-accent-2, #ffc46b), var(--ev-accent, #ff9a2e)); color: #3a1800; font-size: 13px; font-weight: 900;
  box-shadow: 0 3px 0 #a5520c; }
.ev-banner__main:active .ev-banner__go{ transform: translateY(2px); box-shadow: 0 1px 0 #a5520c; }
.ev-banner__x{ flex: 0 0 34px; border: 0; background: none; color: rgba(255,255,255,.6); font-size: 14px; font-weight: 900; cursor: pointer; }

/* ===== меню ивента (шторка, как у заданий: .q-sheet из quests.css) ===== */
.ev-sheet{ background: linear-gradient(180deg, #2a1d3d 0%, #1c243e 55%); border-color: rgba(255,154,46,.3);
  /* высота постоянная: вкладки разной длины, и шторка не должна прыгать под пальцем (тап мимо = закрыть) */
  height: min(86dvh, 760px); }
.ev-head{ margin-bottom: 2px; }
.ev-bal{ display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px; border-radius: 999px;
  background: rgba(255,154,46,.14); border: 1px solid rgba(255,154,46,.4); font-size: 15px; font-weight: 900; font-variant-numeric: tabular-nums; }
.ev-bal b{ color: #ffd9a8; }
.ev-left{ margin: 0 2px 12px; font-size: 12px; font-weight: 800; color: #c9b8e6; font-variant-numeric: tabular-nums; }
.ev-body{ overflow-y: auto; -webkit-overflow-scrolling: touch; min-height: 0; flex: 1 1 auto; }
.ev-soon{ display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 26px 18px; border-radius: 16px; text-align: center;
  background: rgba(255,255,255,.05); border: 1px dashed rgba(255,255,255,.16); }
.ev-soon__ico{ font-size: 42px; line-height: 1; }
.ev-soon__title{ font-size: 17px; font-weight: 900; }
.ev-soon__text{ margin: 0; max-width: 300px; font-size: 13px; font-weight: 700; color: #b9bdd8; line-height: 1.4; }
.ev-soon__tag{ margin-top: 4px; padding: 4px 12px; border-radius: 999px; background: rgba(255,154,46,.16); color: #ffc46b; font-size: 12px; font-weight: 900; }

@media (prefers-reduced-motion: reduce){
  #main-tab .home-chip--event:active, .ev-banner__main:active .ev-banner__go{ transform: none; }
}

/* ===== карточки ивентовых голубей и яиц (inventory.js: .ev-card.ev-<id>) =====
   Редкость и метка ивента — две одинаковые плашки столбиком; фон карточки — свой у ивента, снизу затемнён под текст,
   рамка и подсветка снизу — цветом редкости. */
.farm-pigeon .card-pills, .farm-egg .card-pills{ display: grid; grid-template-columns: max-content; justify-content: center; row-gap: 5px; margin: 6px auto 8px; }
.farm-pigeon .card-pills > p, .farm-egg .card-pills > p{ margin: 0 !important; width: auto !important; justify-self: stretch; box-sizing: border-box; height: 22px; }
.card-pills > .ev-tag{ display: flex; align-items: center; justify-content: center; gap: 4px; padding: 4px 12px; border-radius: 9999px;
  font-size: 12px; font-weight: 700; line-height: 1; color: #ffb35c; background: rgba(20,12,30,.55); border: 1px solid rgba(255,140,40,.6); }
.card-pills > .ev-tag i{ font-style: normal; font-size: 11px; line-height: 1; }

.ev-card{ box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--rarity-color, #888) 85%, transparent) !important; }
.ev-card h3, .ev-card p, .ev-card .card-pills{ position: relative; z-index: 2; }
.ev-card h3.item-name{ color: #fff !important; text-shadow: 0 2px 6px rgba(0,0,0,.75); }
.ev-card.ev-hw26 .pigeon-card-bg{ background:
  linear-gradient(180deg, rgba(14,8,24,0) 0%, rgba(14,8,24,.15) 32%, rgba(14,8,24,.72) 52%, rgba(14,8,24,.82) 100%),
  radial-gradient(140% 60% at 50% 110%, color-mix(in srgb, var(--rarity-color, #888) 55%, transparent), transparent 60%),
  url("assets/events/hw26/card_bg.webp?h=aa462d1674") center top / cover no-repeat !important; }

/* ===== меню ивента = «пропуск» (event.js passHtml): дорожка уровней слева, награды справа ===== */
.ev-note{ margin: 0 2px 10px; font-size: 11px; font-weight: 700; color: #a9adc9; line-height: 1.35; }
.bp-top{ display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin-bottom: 8px; border-radius: 16px;
  background: linear-gradient(90deg, rgba(255,154,46,.2), rgba(255,154,46,.05)); border: 1px solid rgba(255,154,46,.4); }
.bp-lvl{ flex: 0 0 auto; width: 58px; height: 58px; border-radius: 16px; display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: linear-gradient(180deg, #ffc46b, #ff8a1f); color: #3a1800; box-shadow: 0 3px 0 #a5520c; line-height: 1; }
.bp-lvl b{ font-size: 24px; font-weight: 900; }
.bp-lvl small{ font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; }
.bp-prog{ flex: 1; min-width: 0; }
.bp-prog__lbl{ font-size: 15px; font-weight: 900; margin-bottom: 6px; font-variant-numeric: tabular-nums; }
.bp-prog .q-bar{ height: 8px; }
.bp-prog .q-bar > i{ background: linear-gradient(90deg, #ffc46b, #ff7a1a); }
.bp-prog__sub{ margin-top: 6px; font-size: 12px; font-weight: 800; color: #ffd9a8; }

.bp-list{ display: flex; flex-direction: column; gap: 0; padding-bottom: 8px; }
.bp-step{ position: relative; display: flex; align-items: stretch; gap: 10px; padding: 5px 0; }
/* отрезок дорожки к этому шагу: серый, заливка — сколько собрано (--fill 0..1) */
.bp-step::before{ content: ""; position: absolute; left: 19px; top: -5px; height: calc(50% + 5px); width: 6px; border-radius: 3px;
  background: linear-gradient(180deg, #ff9a2e calc(var(--fill) * 100%), rgba(255,255,255,.1) calc(var(--fill) * 100%)); }
.bp-step:first-child::before{ display: none; }
.bp-step::after{ content: ""; position: absolute; left: 19px; top: 50%; bottom: -5px; width: 6px; border-radius: 3px; background: rgba(255,255,255,.1); }
.bp-step.is-claimed::after, .bp-step.is-ready::after{ background: #ff9a2e; }
.bp-step:last-child::after{ display: none; }
.bp-node{ position: relative; z-index: 1; flex: 0 0 44px; display: flex; align-items: center; justify-content: center; }
.bp-node b{ width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: 14px; font-weight: 900;
  background: #2a2f4d; border: 2px solid rgba(255,255,255,.18); color: #a9adc9; }
.bp-step.is-claimed .bp-node b, .bp-step.is-ready .bp-node b{ background: linear-gradient(180deg, #ffc46b, #ff8a1f); border-color: #ffd9a8; color: #3a1800; }
.bp-card{ flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 14px;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.08); }
.bp-step.is-ready .bp-card{ border-color: rgba(255,154,46,.6); background: rgba(255,154,46,.12); }
.bp-step.is-claimed .bp-card{ opacity: .55; }
.bp-step.is-locked .bp-card{ opacity: .75; }
.bp-ico{ flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px; background: rgba(0,0,0,.22); display: grid; place-items: center; }
.bp-ico img{ width: 36px; height: 36px; object-fit: contain; }
.bp-ico span{ font-size: 22px; line-height: 1; }
.bp-txt{ flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bp-txt b{ font-size: 14px; font-weight: 900; line-height: 1.2; }
.bp-txt small{ font-size: 11px; font-weight: 800; color: #a9adc9; }
.bp-claim{ flex: 0 0 auto; height: 34px; padding: 0 14px; border: 0; border-radius: 11px; font-family: inherit; font-size: 13px; font-weight: 900; cursor: pointer;
  background: linear-gradient(180deg, #ffcf4d, #f5a623); color: #3a1d00; box-shadow: 0 3px 0 #b46f00; animation: qClaim 1.6s ease-in-out infinite; }
.bp-claim:active{ transform: translateY(2px); box-shadow: 0 1px 0 #b46f00; }
.bp-done{ flex: 0 0 auto; font-size: 12px; font-weight: 900; color: #8ff0b4; }
.bp-need{ flex: 0 0 auto; font-size: 12px; font-weight: 900; color: #a9adc9; font-variant-numeric: tabular-nums; }
/* финал — эксклюзивный голубь крупно */
.bp-step--final .bp-card{ padding: 12px 10px; border-color: rgba(63,209,192,.6); background: linear-gradient(90deg, rgba(63,209,192,.2), rgba(63,209,192,.04)); opacity: 1; }
.bp-step--final .bp-ico{ flex-basis: 64px; width: 64px; height: 64px; background: rgba(63,209,192,.15); }
.bp-step--final .bp-ico img{ width: 58px; height: 58px; }
.bp-step--final .bp-txt b{ font-size: 16px; }
.bp-step--final .bp-txt small{ color: #8ff0e2; }

/* ===== Магазин: вкладка ивента (store.js) ===== */
/* три вкладки на узком телефоне: без значков у обычных, мельче шрифт — «Голуби и яйца» в одну строку */
#shop-store .mk-tabs.has-event .mk-tab{ font-size: 12px; padding-left: 4px; padding-right: 4px; white-space: nowrap; }
#shop-store .mk-tabs.has-event .mk-tab .sh-ico, #shop-store .mk-tabs.has-event .mk-tab .mk-emo{ display: none; }
#shop-store .mk-tab--event{ color: #ffc46b; }
#shop-store .mk-tab--event.is-on{ background: linear-gradient(180deg, rgba(255,154,46,.35), rgba(255,154,46,.18)); color: #fff; }
.mk-stock--event{ border-color: rgba(255,154,46,.4) !important; background: rgba(255,154,46,.1) !important; color: #ffd9a8; }
.store-card .mk-left{ font-size: 12px; opacity: .85; }

@media (prefers-reduced-motion: reduce){ .bp-claim{ animation: none; } }
#upgrades-tab .store-list.is-event > .mk-row, #upgrades-tab .store-list.is-event > .mk-stock, #upgrades-tab .store-list.is-event > .store-empty{ grid-column: 1 / -1; }
