/*
 * Баннер согласия на cookie (ТЗ §236).
 *
 * Карточка, а не тёмная плашка во весь экран: спрашиваем о двух
 * необязательных счётчиках, а не требуем подписать договор. На десктопе
 * стоит в левом нижнем углу и ничего не перекрывает, на мобильном —
 * над таб-баром, чтобы не закрывать навигацию.
 */

.consent {
    position: fixed;
    left: var(--space-5);
    bottom: var(--space-5);
    z-index: var(--z-toast);
    width: min(420px, calc(100vw - 32px));
}

.consent__card {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    padding: var(--space-4);
    border: 1px solid var(--border-card);
    border-radius: var(--radius-lg);
    background: var(--bg-card);
    box-shadow: var(--shadow-pop);
}

.consent__head {
    display: flex;
    align-items: flex-start;
    gap: var(--space-3);
}

.consent__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: var(--radius-sm);
    background: var(--bg-violet);
    color: var(--primary);
}

.consent__title {
    margin: 0 0 4px;
    font-size: var(--fs-body);
    font-weight: var(--fw-bold);
    color: var(--text-primary);
}

.consent__text {
    margin: 0;
    font-size: var(--fs-small);
    line-height: 1.5;
    color: var(--text-secondary);
}

.consent__list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.consent__item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-xs);
    color: var(--text-muted);
}

.consent__label {
    font-weight: var(--fw-semibold);
    color: var(--text-primary);
}

.consent__note {
    flex: 1 1 100%;
}

.consent__actions {
    display: flex;
    gap: var(--space-2);
}

.consent__actions .btn {
    flex: 1 1 auto;
}

@media (max-width: 768px) {
    .consent {
        left: var(--space-3);
        right: var(--space-3);
        bottom: calc(var(--tabbar-height, 64px) + var(--space-3));
        width: auto;
    }

    .consent__actions {
        flex-direction: column;
    }

    /* На узком экране баннер не должен занимать половину высоты:
       подписи категорий остаются, пояснения к ним — нет. */
    .consent__note {
        display: none;
    }
}