
@media (max-width: 767px) {

html[data-theme="light"] .analytics-page .kpi-grid > .kpi-card,
body[data-theme="light"] .analytics-page .kpi-grid > .kpi-card,
html.rb-mobile-light .analytics-page .kpi-grid > .kpi-card,
body.rb-mobile-light .analytics-page .kpi-grid > .kpi-card {
    background: #FFFFFF !important;
    border: 1px solid #E1E7F0 !important;
    color: #111827 !important;
    box-shadow:
        0 1px 2px rgba(16,24,40,.03),
        0 10px 30px rgba(15,32,57,.07) !important;
}

/* Заголовки четырёх верхних окон */
html[data-theme="light"] .analytics-page .kpi-label,
body[data-theme="light"] .analytics-page .kpi-label,
html.rb-mobile-light .analytics-page .kpi-label,
body.rb-mobile-light .analytics-page .kpi-label {
    color: #667085 !important;
}

/* Общий результат */
html[data-theme="light"] .analytics-page .kpi-result .kpi-value,
body[data-theme="light"] .analytics-page .kpi-result .kpi-value,
html.rb-mobile-light .analytics-page .kpi-result .kpi-value,
body.rb-mobile-light .analytics-page .kpi-result .kpi-value {
    color: #16C76A !important;
}

html[data-theme="light"] .analytics-page .kpi-result .kpi-sub,
body[data-theme="light"] .analytics-page .kpi-result .kpi-sub,
html.rb-mobile-light .analytics-page .kpi-result .kpi-sub,
body.rb-mobile-light .analytics-page .kpi-result .kpi-sub {
    color: #667085 !important;
}

/* График внутри общего результата */
html[data-theme="light"] .analytics-page .kpi-result .mini-chart .line,
body[data-theme="light"] .analytics-page .kpi-result .mini-chart .line,
html.rb-mobile-light .analytics-page .kpi-result .mini-chart .line,
body.rb-mobile-light .analytics-page .kpi-result .mini-chart .line {
    stroke: #16C76A !important;
}

html[data-theme="light"] .analytics-page .kpi-result .mini-chart .area,
body[data-theme="light"] .analytics-page .kpi-result .mini-chart .area,
html.rb-mobile-light .analytics-page .kpi-result .mini-chart .area,
body.rb-mobile-light .analytics-page .kpi-result .mini-chart .area {
    fill: rgba(22,199,106,.14) !important;
}

/* Кольцо самоконтроля */
html[data-theme="light"] .analytics-page .ring-wrapper .bg,
body[data-theme="light"] .analytics-page .ring-wrapper .bg,
html.rb-mobile-light .analytics-page .ring-wrapper .bg,
body.rb-mobile-light .analytics-page .ring-wrapper .bg {
    stroke: #E7ECF3 !important;
}

html[data-theme="light"] .analytics-page .ring-wrapper .fill,
body[data-theme="light"] .analytics-page .ring-wrapper .fill,
html.rb-mobile-light .analytics-page .ring-wrapper .fill,
body.rb-mobile-light .analytics-page .ring-wrapper .fill {
    stroke: #16C76A !important;
}

html[data-theme="light"] .analytics-page .center-text .score,
body[data-theme="light"] .analytics-page .center-text .score,
html.rb-mobile-light .analytics-page .center-text .score,
body.rb-mobile-light .analytics-page .center-text .score {
    color: #F5A524 !important;
}

html[data-theme="light"] .analytics-page .center-text .of,
body[data-theme="light"] .analytics-page .center-text .of,
html.rb-mobile-light .analytics-page .center-text .of,
body.rb-mobile-light .analytics-page .center-text .of {
    color: #667085 !important;
}

/* Бейджи индекса */
html[data-theme="light"] .analytics-page .control-badges .badge,
body[data-theme="light"] .analytics-page .control-badges .badge,
html.rb-mobile-light .analytics-page .control-badges .badge,
body.rb-mobile-light .analytics-page .control-badges .badge {
    background: #F6F8FC !important;
    border-color: #DCE4EF !important;
    color: #475467 !important;
}

/* Результат и нарушения */
html[data-theme="light"] .analytics-page .kpi-violations .v-label,
body[data-theme="light"] .analytics-page .kpi-violations .v-label,
html.rb-mobile-light .analytics-page .kpi-violations .v-label,
body.rb-mobile-light .analytics-page .kpi-violations .v-label {
    color: #667085 !important;
}

html[data-theme="light"] .analytics-page .kpi-violations .v-value.positive,
body[data-theme="light"] .analytics-page .kpi-violations .v-value.positive,
html.rb-mobile-light .analytics-page .kpi-violations .v-value.positive,
body.rb-mobile-light .analytics-page .kpi-violations .v-value.positive {
    color: #16C76A !important;
}

html[data-theme="light"] .analytics-page .kpi-violations .v-value.big-red,
body[data-theme="light"] .analytics-page .kpi-violations .v-value.big-red,
html.rb-mobile-light .analytics-page .kpi-violations .v-value.big-red,
body.rb-mobile-light .analytics-page .kpi-violations .v-value.big-red {
    color: #EF4D56 !important;
}

html[data-theme="light"] .analytics-page .kpi-violations .v-period,
body[data-theme="light"] .analytics-page .kpi-violations .v-period,
html.rb-mobile-light .analytics-page .kpi-violations .v-period,
body.rb-mobile-light .analytics-page .kpi-violations .v-period {
    color: #98A2B3 !important;
}

/* AI Insight */
html[data-theme="light"] .analytics-page .kpi-ai,
body[data-theme="light"] .analytics-page .kpi-ai,
html.rb-mobile-light .analytics-page .kpi-ai,
body.rb-mobile-light .analytics-page .kpi-ai {
    background: linear-gradient(145deg,#F5F8FF,#EAF1FF) !important;
    border-color: #CFE0FF !important;
}

html[data-theme="light"] .analytics-page .kpi-ai .ai-icon,
body[data-theme="light"] .analytics-page .kpi-ai .ai-icon,
html.rb-mobile-light .analytics-page .kpi-ai .ai-icon,
body.rb-mobile-light .analytics-page .kpi-ai .ai-icon {
    color: #2F6BFF !important;
}

html[data-theme="light"] .analytics-page .kpi-ai .ai-label,
body[data-theme="light"] .analytics-page .kpi-ai .ai-label,
html.rb-mobile-light .analytics-page .kpi-ai .ai-label,
body.rb-mobile-light .analytics-page .kpi-ai .ai-label {
    color: #5672A4 !important;
}

html[data-theme="light"] .analytics-page .kpi-ai .ai-text,
body[data-theme="light"] .analytics-page .kpi-ai .ai-text,
html.rb-mobile-light .analytics-page .kpi-ai .ai-text,
body.rb-mobile-light .analytics-page .kpi-ai .ai-text {
    color: #172033 !important;
}

/* Кнопка «30 дней» */
html[data-theme="light"] .analytics-page .analytics-period-mobile,
body[data-theme="light"] .analytics-page .analytics-period-mobile,
html.rb-mobile-light .analytics-page .analytics-period-mobile,
body.rb-mobile-light .analytics-page .analytics-period-mobile {
    background: #FFFFFF !important;
    border: 1px solid #D8E1ED !important;
    color: #344054 !important;
    box-shadow: 0 4px 12px rgba(15,32,57,.06) !important;
}

/* Общий переключатель периода */
html[data-theme="light"] .analytics-page .period-selector,
body[data-theme="light"] .analytics-page .period-selector,
html.rb-mobile-light .analytics-page .period-selector,
body.rb-mobile-light .analytics-page .period-selector {
    background: #FFFFFF !important;
    border: 1px solid #DDE4EE !important;
}

html[data-theme="light"] .analytics-page .period-selector .period-btn,
body[data-theme="light"] .analytics-page .period-selector .period-btn,
html.rb-mobile-light .analytics-page .period-selector .period-btn,
body.rb-mobile-light .analytics-page .period-selector .period-btn {
    background: transparent !important;
    color: #667085 !important;
}

html[data-theme="light"] .analytics-page .period-selector .period-btn.active,
body[data-theme="light"] .analytics-page .period-selector .period-btn.active,
html.rb-mobile-light .analytics-page .period-selector .period-btn.active,
body.rb-mobile-light .analytics-page .period-selector .period-btn.active {
    background: linear-gradient(135deg,#4381FF,#2764F0) !important;
    color: #FFFFFF !important;
}
}
