/* public/css/site-widgets.css: плавающая кнопка связи и плашка cookie */

/* ---- Плавающая кнопка связи ---- */
.float-contact {
    position: fixed; z-index: 60;
    right: max(16px, env(safe-area-inset-right)); bottom: max(16px, env(safe-area-inset-bottom));
    display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.float-list { display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0; padding: 0; list-style: none; }
.float-list li {
    opacity: 0; visibility: hidden; transform: translateY(12px) scale(.8);
    transition: opacity .2s, transform .2s, visibility 0s .2s;
}
.float-contact.is-open .float-list li {
    opacity: 1; visibility: visible; transform: none;
    transition: opacity .25s, transform .25s; transition-delay: calc(var(--i, 1) * .04s);
}

.float-item {
    position: relative; display: grid; place-items: center; width: 50px; height: 50px;
    border-radius: 50%; background: #000; color: #fff; text-decoration: none;
    transition: transform .2s;
}
.float-item:hover, .float-item:focus-visible { transform: scale(1.06); }
.float-item svg { width: 24px; height: 24px; }
.float-item--max { background: #64b5ff; }
.float-item--telegram { background: #4a96d8; }

.float-tip {
    position: absolute; top: 50%; right: calc(100% + 12px); transform: translate(6px, -50%);
    padding: 8px 14px; border-radius: 6px; background: rgba(30, 30, 30, .92); color: #e6e6e6;
    font-size: 14px; font-weight: 500; line-height: 1.2; white-space: nowrap;
    opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s;
}
.float-tip::after {
    content: ""; position: absolute; left: 100%; top: 50%; margin-top: -6px;
    border: 6px solid transparent; border-left-color: rgba(30, 30, 30, .92);
}
.float-item:hover .float-tip, .float-item:focus-visible .float-tip { opacity: 1; transform: translate(0, -50%); }

.float-toggle {
    display: grid; place-items: center; width: 60px; height: 60px; padding: 0;
    border: 0; border-radius: 50%; background: var(--accent, #94a0bb); color: #fff; cursor: pointer;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .25); transition: background .2s, color .2s;
}
.float-ico { grid-area: 1 / 1; display: grid; transition: opacity .2s, transform .2s; }
.float-ico svg { width: 30px; height: 30px; }
.float-ico--close { opacity: 0; transform: rotate(-45deg) scale(.7); }
.float-contact.is-open .float-toggle { background: #fff; color: #111; }
.float-contact.is-open .float-ico--chat { opacity: 0; transform: rotate(45deg) scale(.7); }
.float-contact.is-open .float-ico--close { opacity: 1; transform: none; }

/* ---- Плашка cookie ---- */
.cookie-notice {
    position: fixed; z-index: 60;
    left: max(16px, env(safe-area-inset-left)); bottom: max(16px, env(safe-area-inset-bottom));
    width: min(360px, calc(100vw - 112px)); padding: 20px; border-radius: 16px;
    background: var(--c-bg, #fff); color: var(--c-text, #111); border: 1px solid var(--c-line, rgba(0, 0, 0, .18));
    box-shadow: 0 8px 32px rgba(0, 0, 0, .25); font-size: 13px; line-height: 1.5;
    transition: opacity .25s, transform .25s;
}
.cookie-notice.is-hiding { opacity: 0; transform: translateY(12px); pointer-events: none; }
.cookie-title { margin: 0 0 8px; font-size: 14px; font-weight: 600; }
.cookie-body p { margin: 0 0 .6em; }
.cookie-body p:last-child { margin-bottom: 0; }
.cookie-body ul, .cookie-body ol { margin: 0 0 .6em; padding-left: 1.4em; }
.cookie-body a { text-decoration: underline; text-underline-offset: 2px; }
.cookie-btn { margin-top: 14px; padding: 10px 24px; font-size: 12px; text-transform: uppercase; }

@media (prefers-reduced-motion: reduce) {
    .float-list li, .float-ico, .cookie-notice { transition: none; }
}

/* ---- акционная цена в избранном ---- */
.fav-price .price-old { margin-right: 6px; opacity: .55; text-decoration: line-through; }
.fav-price.is-sale .price-now { color: #e5383b; }