/* FOOTBALLERS — власні стилі сайту (перенесено з Налаштування → Скрипти 02.10.2026) */
    /* ПРИХОВУЄМО СТАНДАРТНУ СТРІЛКУ ВГОРУ */
    .upButton-btn, .up-btn, .btn-top, #back-to-top, .j-back-to-top { display: none !important; }

    .mess-wrapper {
        position: fixed;
        bottom: 25px;
        right: 25px;
        z-index: 999; 
        display: flex;
        flex-direction: column-reverse;
        align-items: flex-end;
        font-family: 'Segoe UI', Roboto, sans-serif;
        /* ТЕПЕР БІЛЬШ НАСИЧЕНА ПРОЗОРІСТЬ */
        opacity: 0.9; 
        transition: all 0.3s ease;
    }

    /* Стає на 100% чіткою при наведенні або відкритті */
    .mess-wrapper:hover, .mess-wrapper.is-open {
        opacity: 1;
        z-index: 10001; 
    }

    @media (max-width: 768px) {
        .mess-wrapper { 
            bottom: 15px; 
            right: 15px; 
            opacity: 0.85; /* На мобільних теж досить чітка */
        }
        .mess-main-btn { 
            transform: scale(0.9); 
            min-width: 150px !important; 
        }
    }

    .mess-main-btn {
        background: #ff4d4d; 
        color: #fff;
        padding: 10px 18px;
        border-radius: 50px;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 10px;
        box-shadow: 0 4px 15px rgba(255, 77, 77, 0.3);
        transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        min-width: 170px;
        justify-content: center;
    }

    .mess-icon-box { width: 24px; height: 24px; position: relative; }
    .mess-icon-box svg {
        position: absolute;
        transition: all 0.3s ease;
        fill: none;
        stroke: #fff;
        stroke-width: 2.5;
        shape-rendering: geometricPrecision;
        left: 0; top: 0; width: 100%; height: 100%;
    }
    .icon-close { opacity: 0; transform: rotate(-90deg); }
    .is-open .icon-chat { opacity: 0; transform: rotate(90deg); }
    .is-open .icon-close { opacity: 1; transform: rotate(0); }

    #messText { font-size: 14px; font-weight: 700; color: #fff; transition: opacity 0.3s; }

    .mess-options {
        display: none;
        flex-direction: column;
        gap: 10px;
        margin-bottom: 12px;
        align-items: flex-end;
        animation: mess-slideUp 0.3s ease forwards;
    }

    @keyframes mess-slideUp {
        from { opacity: 0; transform: translateY(15px); }
        to { opacity: 1; transform: translateY(0); }
    }

    .mess-link {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 16px;
        border-radius: 50px;
        text-decoration: none;
        color: #fff;
        font-weight: 600;
        font-size: 14px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
        transition: 0.3s;
        width: fit-content;
        white-space: nowrap;
    }

    .mess-viber { background: #7360f2; } 
    .mess-tg { background: #0088cc; }
    .mess-link svg { width: 18px; height: 18px; stroke: #fff; fill: none; stroke-width: 2; }
    .mess-link.mess-tg svg { fill: white; stroke: none; }
    .mess-link:hover { transform: scale(1.05); filter: brightness(1.1); }

/* ── Плашка «Гарантія» на фото товару (src/warranty.js) ── */
.ws-warranty {
    position: absolute; top: 12px; right: 12px; z-index: 6;
    display: flex; align-items: center; gap: 8px;
    padding: 6px 14px 6px 6px; border-radius: 999px;
    background: #17b260; color: #fff;
    box-shadow: 0 6px 18px rgba(0,0,0,.22);
    font-family: inherit; line-height: 1.15; pointer-events: none;
    animation: ws-w-in .4s ease both;
}
.ws-warranty__icon {
    flex: 0 0 30px; width: 30px; height: 30px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center; background: #fff;
}
.ws-warranty__icon svg { width: 18px; height: 18px; fill: none; stroke: #17b260; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.ws-warranty__text { display: flex; flex-direction: column; }
.ws-warranty__title { font-size: 14px; font-weight: 600; white-space: nowrap; }
.ws-warranty__title b { font-weight: 800; }
.ws-warranty__sub { font-size: 11px; opacity: .9; white-space: nowrap; }
@keyframes ws-w-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (max-width: 768px) {
    .ws-warranty { top: 8px; right: 8px; gap: 6px; padding: 4px 10px 4px 4px; }
    .ws-warranty__icon { flex-basis: 24px; width: 24px; height: 24px; }
    .ws-warranty__icon svg { width: 14px; height: 14px; }
    .ws-warranty__title { font-size: 12px; }
    .ws-warranty__sub { font-size: 10px; }
}

/* ── Таймер акції (src/promo-timer.js) ── */
.ftb-promo{margin:16px 0 4px;max-width:420px;padding:14px 16px;border-radius:12px;
  background:linear-gradient(135deg,rgba(232,65,44,.16),rgba(232,65,44,.04) 60%);
  border:1px solid rgba(232,65,44,.55);color:#fff;font-family:inherit;box-sizing:border-box}
.ftb-promo__head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ftb-promo__pct{flex:none;background:#e8412c;color:#fff;font-weight:800;font-size:17px;line-height:1;
  padding:9px 10px;border-radius:8px;letter-spacing:.3px;box-shadow:0 4px 14px rgba(232,65,44,.35)}
.ftb-promo__txt{font-size:14px;line-height:1.35;color:rgba(255,255,255,.85)}
.ftb-promo__txt b{color:#fff}
.ftb-promo__save{color:#e6e28a!important}
.ftb-promo__label{font-size:12px;text-transform:uppercase;letter-spacing:1.2px;color:rgba(255,255,255,.55);margin-bottom:6px}
.ftb-promo__clock{display:flex;gap:6px}
.ftb-promo__u{flex:1;min-width:0;text-align:center;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:7px 2px 5px}
.ftb-promo__n{display:block;font-size:22px;font-weight:700;line-height:1.1;font-variant-numeric:tabular-nums;color:#fff}
.ftb-promo__w{display:block;font-size:11px;color:rgba(255,255,255,.55);margin-top:2px}
.ftb-promo__bar{height:4px;border-radius:2px;background:rgba(255,255,255,.1);margin-top:12px;overflow:hidden}
.ftb-promo__fill{height:100%;background:linear-gradient(90deg,#e6e28a,#e8412c);border-radius:2px;transition:width 1s linear}
.ftb-chip{display:inline-flex;align-items:center;gap:5px;margin-top:6px;padding:3px 8px;border-radius:999px;
  background:rgba(232,65,44,.14);border:1px solid rgba(232,65,44,.45);color:#ff8a6b;font-size:12px;line-height:1.4;
  font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.ftb-chip i{font-style:normal}
@media (max-width:768px){.ftb-promo{max-width:none;margin:12px 0}.ftb-promo__n{font-size:20px}.ftb-chip{font-size:11px;padding:2px 7px}}
