/* bs--chips.css — дрібні елементи сторінок політик Bessies1 */

:root {
    --bs-chip-steel: #1e3a5f;
    --bs-chip-main: #3d6fa5;
    --bs-chip-aqua: #35c4d8;
    --bs-chip-ink: #16202b;
    --bs-chip-night: #12283f;
    --bs-chip-tint: #dfeaf4;
    --bs-chip-paper: #f2f7fb;
    --bs-chip-edge: #d2e0ec;
    --bs-chip-mute: #5b6b7c;
}

/* бейдж-рубрика над заголовком документа */
.bs--doc-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 13px 6px;
    border-radius: 999px;
    background: var(--bs-chip-steel);
    color: #ffffff;
    font: 700 11.5px/1.4 Candara, "Segoe UI", sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
}
.bs--doc-tag::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--bs-chip-aqua);
}
.bs--doc-tag.bs--doc-tag-open {
    background: var(--bs-chip-aqua);
    color: var(--bs-chip-night);
}
.bs--doc-tag.bs--doc-tag-open::before { background: var(--bs-chip-night); }

/* довгі переліки у дві колонки */
.bs--split-list {
    columns: 2;
    column-gap: 34px;
}
.bs--split-list li {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
}
@media (max-width: 640px) {
    .bs--split-list { columns: 1; }
}

/* акцентна врізка */
.bs--note-box {
    margin: 16px 0 14px;
    padding: 16px 18px 14px 18px;
    border: 1px solid rgba(53, 196, 216, .5);
    border-left: 4px solid var(--bs-chip-aqua);
    border-radius: 0 4px 4px 0;
    background: #ffffff;
}
.bs--note-box p {
    margin: 0;
    color: var(--bs-chip-ink);
    font-size: 15px;
    line-height: 1.72;
}

/* нумеровані кроки */
.bs--step-list {
    margin: 18px 0 14px;
    display: grid;
    gap: 10px;
}
.bs--step-row {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 14px;
    align-items: start;
    padding: 13px 15px 12px;
    background: #ffffff;
    border: 1px solid var(--bs-chip-edge);
    border-radius: 4px;
}
.bs--step-num {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    display: grid;
    place-items: center;
    font: 700 17px/1 Candara, "Segoe UI", sans-serif;
    color: #ffffff;
    background: linear-gradient(135deg, var(--bs-chip-steel), var(--bs-chip-main));
}
.bs--step-title {
    font: 700 14.5px/1.4 Candara, "Segoe UI", sans-serif;
    color: var(--bs-chip-steel);
    margin-bottom: 2px;
}
.bs--step-text {
    font: 400 14px/1.68 Candara, "Segoe UI", sans-serif;
    color: var(--bs-chip-mute);
}
@media (max-width: 480px) {
    .bs--step-row { grid-template-columns: 32px 1fr; gap: 11px; }
    .bs--step-num { width: 32px; height: 32px; font-size: 15px; }
}

/* рядок службової позначки */
.bs--meta-line {
    font: 400 12.5px/1.7 Candara, "Segoe UI", sans-serif;
    color: var(--bs-chip-mute);
    padding: 10px 0 0;
    border-top: 1px solid var(--bs-chip-edge);
    margin-top: 18px;
}
.bs--meta-line strong { color: var(--bs-chip-steel); }

/* службові обгортки вузької колонки */
.bs--wrap-col { max-width: 860px; margin: 0 auto; padding: 0 20px; }
.bs--wrap-body { max-width: 860px; margin: 0 auto; }

/* нижня смуга повідомлення про cookie */
.bs--cookie-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(18, 40, 63, .97);
    color: #ffffff;
    padding: 16px 22px;
    z-index: 1000;
    border-top: 3px solid var(--bs-chip-aqua);
    backdrop-filter: blur(12px);
}
.bs--cookie-row {
    max-width: 1100px;
    margin: 0 auto;
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}
.bs--cookie-text {
    flex: 1;
    min-width: 220px;
    font: 14px/1.7 Candara, "Segoe UI", sans-serif;
    color: #b9cddf;
}
.bs--cookie-text a { color: var(--bs-chip-aqua); text-decoration: underline; }
.bs--cookie-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.bs--cookie-yes,
.bs--cookie-no {
    padding: 10px 18px;
    border-radius: 4px;
    cursor: pointer;
    border: none;
    font: 700 13px/1 Candara, "Segoe UI", sans-serif;
    text-transform: uppercase;
    letter-spacing: .07em;
}
.bs--cookie-yes { background: linear-gradient(135deg, var(--bs-chip-steel), var(--bs-chip-main)); color: #fff; }
.bs--cookie-no { background: var(--bs-chip-tint); color: var(--bs-chip-ink); border: 1px solid var(--bs-chip-edge); }