:root {
    color-scheme: light dark;
    --grp-bg: #f5f7fa;
    --grp-surface: #ffffff;
    --grp-text: #1f252e;
    --grp-muted: #5d6774;
    --grp-border: #d8dde6;
    --grp-accent: #8bc53e;
    --grp-accent-strong: #6aa12a;
    --grp-radius: 12px;
}

@media (prefers-color-scheme: dark) {
    :root {
        --grp-bg: #10161d;
        --grp-surface: #17202a;
        --grp-text: #e8eef5;
        --grp-muted: #b8c4d1;
        --grp-border: #2f3a47;
        --grp-accent: #9fd44e;
        --grp-accent-strong: #b0df68;
    }
}

html[data-theme="light"] {
    --grp-bg: #f5f7fa;
    --grp-surface: #ffffff;
    --grp-text: #1f252e;
    --grp-muted: #5d6774;
    --grp-border: #d8dde6;
    --grp-accent: #8bc53e;
    --grp-accent-strong: #6aa12a;
}

html[data-theme="dark"] {
    --grp-bg: #10161d;
    --grp-surface: #17202a;
    --grp-text: #e8eef5;
    --grp-muted: #b8c4d1;
    --grp-border: #2f3a47;
    --grp-accent: #9fd44e;
    --grp-accent-strong: #b0df68;
}

body {
    background: var(--grp-bg);
    color: var(--grp-text);
}

a {
    color: var(--grp-accent-strong);
}

img,
video {
    max-width: 100%;
    height: auto;
}

input,
select,
textarea,
button {
    font: inherit;
}

@media screen and (max-width: 768px) {
    .m-rb-container,
    .rb-subscription,
    .rb-form-container {
        width: 100% !important;
        box-sizing: border-box;
    }
}

/* Breadcrumbs — chevron separator + home icon */
.breadcrumbs {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 10px 12px 0;
    font-size: 13px;
    color: #6b6b6b;
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.breadcrumbs::-webkit-scrollbar { display: none; }
.breadcrumbs a { color: #555; text-decoration: none; }
.breadcrumbs a:hover { color: #129ead; }
.breadcrumbs .current { color: #999; font-weight: 400; }
.breadcrumbs .separator { display: none; }

/* Chevron between items */
.breadcrumbs a + a::before,
.breadcrumbs a + .current::before {
    content: '\203A';
    color: #bbb;
    font-size: 16px;
    font-weight: 300;
    margin: 0 6px;
}

/* Home icon */
.breadcrumbs .bc-home {
    display: inline-flex;
    align-items: center;
}
.breadcrumbs .bc-home::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}
