/* ==========================================================================
   🎃 ЛАВКА ТЫКВЕННОГО ЖНЕЦА — виджет трофея Хэллоуина в ленте
   Логика — js/halloween_trophy.js, превью трофея и скин — css/trophies.css
   XP-окно в ночных цветах: фиолетовая полночь, тыквенный огонь, летучие мыши.
   Движение — только transform/opacity, при prefers-reduced-motion — без него.
   ========================================================================== */
.hw-widget {
    margin: 0 0 10px;
    border: 3px solid #4a2860; border-top: 0;
    background: #fbf1e4;
    font: 11px Tahoma, sans-serif; color: #2a1a10;
    box-shadow: 2px 3px 8px rgba(30, 10, 40, 0.35);
    border-radius: 0 !important;
    position: relative;
}
.hw-head {
    position: relative; overflow: hidden;
    display: flex; align-items: center; gap: 6px;
    min-height: 26px; padding: 3px 4px 3px 6px;
    cursor: pointer; user-select: none;
    color: #fff; font-weight: bold; font-size: 12px;
    text-shadow: 1px 1px 0 #000;
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='18' viewBox='0 0 46 18'%3E%3Cg fill='%23ff9a2e' fill-opacity='.22'%3E%3Cpath d='M2 7 C4 4 6 4 7 6 C7.6 5 8.4 5 9 6 C10 4 12 4 14 7 C12 6.4 11 7 10.4 8.4 C9.6 7.6 8.6 7.6 8 9 C7.4 7.6 6.4 7.6 5.6 8.4 C5 7 4 6.4 2 7 Z'/%3E%3Cpath d='M26 13 C27.4 11 28.8 11 29.5 12.4 C29.9 11.7 30.5 11.7 30.9 12.4 C31.6 11 33 11 34.4 13 C33 12.6 32.4 13 32 14 C31.4 13.4 30.8 13.4 30.2 14.4 C29.8 13.4 29.2 13.4 28.6 14 C28.2 13 27.4 12.6 26 13 Z'/%3E%3C/g%3E%3C/svg%3E"),
        linear-gradient(180deg, #5a3270 0%, #2a1438 12%, #170b20 55%, #2a1438 90%, #ff8a1e 95%, #8a3a04 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
/* Тыквенный огонь пробегает по заголовку */
.hw-head::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(100deg, transparent 35%, rgba(255, 160, 50, 0.35) 48%, rgba(255, 230, 150, 0.45) 50%, rgba(255, 160, 50, 0.35) 52%, transparent 65%);
    transform: translateX(-120%);
    animation: hw-glint 8s ease-in-out infinite;
}
.hw-head > * { position: relative; z-index: 1; }
.hw-head-ico {
    width: 20px; height: 20px; flex-shrink: 0;
    background: url("/static/trophies/s2_hw.svg") no-repeat center / 20px 20px;
    filter: drop-shadow(0 0 3px rgba(255, 140, 20, 0.8));
    animation: hw-flicker 3.2s ease-in-out infinite;
}
.hw-title { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hw-short { display: none; }
.hw-head-timer {
    flex-shrink: 0;
    padding: 1px 6px;
    font: bold 11px Tahoma, sans-serif; color: #ffb347; letter-spacing: 0.3px;
    background: rgba(0, 0, 0, 0.45); border: 1px solid #8a3a04;
    border-radius: 0 !important;
}
.hw-head-timer.is-off { color: #c9b6d6; border-color: #5a3270; font-weight: normal; }
.hw-toggle {
    width: 21px; height: 21px; flex-shrink: 0;
    border: 1px solid #fff; border-radius: 0 !important;
    background: linear-gradient(180deg, #ffa640 0%, #d8620e 55%, #8a3a04 100%);
    color: #fff; font-size: 9px; cursor: pointer; padding: 0;
}
.hw-widget:not(.collapsed) .hw-head-timer { display: none; }
.hw-widget.collapsed .hw-body { display: none; }

.hw-body { position: relative; overflow: hidden; padding: 10px; }
.hw-body::before {   /* лунная дымка в углу */
    content: ""; position: absolute; right: -40px; top: -40px; width: 140px; height: 140px; pointer-events: none;
    background: radial-gradient(circle, rgba(255, 210, 120, 0.45) 0%, rgba(255, 170, 60, 0.12) 45%, transparent 70%);
}
.hw-bats { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.hw-bats i {
    position: absolute; top: 10px; left: -24px; width: 18px; height: 8px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 7'%3E%3Cpath d='M0 3 C2 0 4 0 5 2 C5.6 1 6.4 1 7 2 C8 0 10 0 12 3 C10 2.4 9 3 8.4 4.4 C7.6 3.6 6.6 3.6 6 5 C5.4 3.6 4.4 3.6 3.6 4.4 C3 3 2 2.4 0 3 Z' fill='%232a1438'/%3E%3C/svg%3E") no-repeat center / contain;
    opacity: 0.55;
    animation: hw-bat 14s linear infinite;
}
.hw-bats i:nth-child(2) { top: 34px; width: 13px; animation-duration: 19s; animation-delay: -7s; }
.hw-bats i:nth-child(3) { top: 58px; width: 10px; animation-duration: 23s; animation-delay: -13s; opacity: 0.4; }

.hw-hero { position: relative; display: flex; gap: 10px; align-items: flex-start; }
.hw-tile { width: 112px !important; height: 74px !important; flex-shrink: 0; box-shadow: 0 0 10px rgba(255, 138, 30, 0.45), 2px 2px 4px rgba(0, 0, 0, 0.35) !important; }
.hw-tile .tt-bar { height: 14px !important; }
.hw-tile .tt-body { top: 14px !important; bottom: 12px !important; }
.hw-tile .tt-task { height: 12px !important; }
.hw-tile .tt-chev { width: 36px !important; height: 36px !important; background-size: 36px 36px !important; animation: hw-flicker 3.2s ease-in-out infinite; }
.hw-info { flex: 1; min-width: 0; }
.hw-name { font-size: 14px; font-weight: bold; color: #6a2a00; }
.hw-name small { display: block; font-size: 10px; font-weight: bold; color: #5a3270; letter-spacing: 0.4px; text-transform: uppercase; margin-top: 1px; }
.hw-about { margin: 4px 0 3px; line-height: 1.35; color: #3a2a20; }
.hw-sold { color: #6b5a4a; }

.hw-row { position: relative; margin-top: 8px; padding: 5px 8px; background: #fff7ec; border: 1px solid #e0c09a; line-height: 1.4; }
.hw-lbl { color: #5a4a3a; margin-right: 6px; }
.hw-timer {
    display: inline-block; padding: 1px 6px;
    font: bold 12px Tahoma, sans-serif; letter-spacing: 0.4px;
    color: #ffb347; background: #170b20; border: 1px solid #8a3a04;
}
.hw-widget.hw-hot .hw-timer,
.hw-widget.hw-hot .hw-head-timer { color: #ff5a3a; animation: hw-pulse 1s ease-in-out infinite; }
.hw-price { font-size: 14px; color: #a83c00; }
.hw-have { margin-left: 8px; color: #6b5a4a; }
.hw-mine { background: #f3ead9; border-color: #c9a26a; color: #4a2a10; }
.hw-mine-ico { display: inline-block; width: 16px; height: 16px; margin-right: 5px; vertical-align: -3px; background: url("/static/trophies/s2_hw.svg") no-repeat center / 16px 16px; }

.hw-actions { position: relative; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; align-items: center; }
.hw-btn {
    padding: 5px 12px; cursor: pointer;
    font: 11px Tahoma, sans-serif; color: #000;
    background: linear-gradient(#fff, #ecebe5); border: 1px solid #7d6a5a;
    border-radius: 0 !important;
}
.hw-btn:hover { background: linear-gradient(#fff8ee, #f3dfc4); }
.hw-btn.hw-buy {
    font-weight: bold; color: #fff; text-shadow: 1px 1px 0 #5a2200;
    background: linear-gradient(180deg, #ffa640 0%, #e0670e 55%, #a84406 100%);
    border-color: #6a2a00;
    box-shadow: 0 0 8px rgba(255, 138, 30, 0.55);
}
.hw-btn.hw-buy:hover { background: linear-gradient(180deg, #ffb860 0%, #ef7a1e 55%, #b85010 100%); }
.hw-btn.hw-buy.is-confirm { background: linear-gradient(180deg, #8a3cc0 0%, #5a2088 55%, #3a1060 100%); border-color: #2a0848; box-shadow: 0 0 8px rgba(140, 60, 200, 0.6); }
.hw-btn[disabled] { opacity: 0.6; cursor: wait; }
.hw-note { color: #6b5a4a; }

.hw-widget.hw-closed .hw-head::after,
.hw-widget.hw-closed .hw-bats i { animation: none; opacity: 0; }

@keyframes hw-glint { 0%, 70% { transform: translateX(-120%); } 88%, 100% { transform: translateX(120%); } }
@keyframes hw-flicker { 0%, 100% { opacity: 1; } 45% { opacity: 0.82; } 50% { opacity: 1; } 62% { opacity: 0.9; } }
@keyframes hw-bat {
    0% { transform: translate(0, 0) scaleY(1); }
    25% { transform: translate(25vw, -6px) scaleY(0.6); }
    50% { transform: translate(50vw, 4px) scaleY(1); }
    75% { transform: translate(75vw, -4px) scaleY(0.6); }
    100% { transform: translate(110vw, 0) scaleY(1); }
}
@keyframes hw-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } }
@media (prefers-reduced-motion: reduce) {
    .hw-head::after, .hw-head-ico, .hw-bats i, .hw-tile .tt-chev, .hw-timer, .hw-head-timer { animation: none !important; }
    .hw-bats { display: none; }
}
@media (max-width: 600px) {
    .hw-long { display: none; }
    .hw-short { display: inline; }
    .hw-hero { flex-direction: column; }
    .hw-btn { flex: 1 1 auto; }
}