/* ===== СПЕЦИАЛЬНЫЕ СТИЛИ ДЛЯ СТРАНИЦЫ ABOUT В ТЁМНОЙ ТЕМЕ ===== */

/* Основные стили для страницы about в тёмной теме */
body.dark.about-page {
    background: #0a0a0a !important;
    background-image: none !important;
    background-color: #0a0a0a !important;
}

/* Контейнер страницы about */
body.dark .about-container {
    background: rgba(30, 41, 59, 0.9) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 1.5px 6px rgba(99, 102, 241, 0.2) !important;
}

/* Все текстовые элементы (КРОМЕ элементов внутри phone-screen) */
body.dark .about-container h1:not(.phone-screen):not(.phone-screen *),
body.dark .about-container h2:not(.phone-screen):not(.phone-screen *),
body.dark .about-container h3:not(.phone-screen):not(.phone-screen *),
body.dark .about-container h4:not(.phone-screen):not(.phone-screen *),
body.dark .about-container p:not(.phone-screen):not(.phone-screen *),
body.dark .about-container li:not(.phone-screen):not(.phone-screen *),
body.dark .about-container span:not(.phone-screen):not(.phone-screen *),
body.dark .about-container div:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

/* FAQ элементы */
body.dark .about-container .faq-item {
    background: rgba(51, 65, 85, 0.8) !important;
    border-left-color: #6366f1 !important;
}

body.dark .about-container .faq-item:hover {
    background: rgba(71, 85, 105, 0.9) !important;
}

body.dark .about-container .faq-q {
    color: #ffffff !important;
}

body.dark .about-container .faq-q:hover {
    background: rgba(71, 85, 105, 0.9) !important;
    color: #ffffff !important;
}

body.dark .about-container .faq-a {
    color: #e5e7eb !important;
}

/* Кнопки */
body.dark .about-container .back-btn {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%) !important;
    color: #ffffff !important;
}

body.dark .about-container .theme-btn {
    background: rgba(99, 102, 241, 0.9) !important;
    color: #ffffff !important;
}

/* Контактный блок */
body.dark .about-container .contact {
    background: rgba(51, 65, 85, 0.8) !important;
    color: #e2e8f0 !important;
}

/* Ссылки */
body.dark .about-container a {
    color: #818cf8 !important;
}

body.dark .about-container a:hover {
    color: #a5b4fc !important;
}

/* Элементы с inline стилями */
body.dark .about-container *[style*="color: #374151"]:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

body.dark .about-container *[style*="color: #4a5568"]:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

body.dark .about-container *[style*="color: #2d3748"]:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

body.dark .about-container *[style*="color: #718096"]:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

body.dark .about-container *[style*="color: #1a202c"]:not(.phone-screen):not(.phone-screen *) {
    color: #ffffff !important;
}

body.dark .about-container *[style*="color: #4338ca"]:not(.phone-screen):not(.phone-screen *) {
    color: #6366f1 !important;
}

body.dark .about-container *[style*="color: #1d4ed8"]:not(.phone-screen):not(.phone-screen *) {
    color: #3b82f6 !important;
}

body.dark .about-container *[style*="color: #15803d"]:not(.phone-screen):not(.phone-screen *) {
    color: #22c55e !important;
}

/* Элементы с inline стилями фона */
body.dark .about-container *[style*="background: rgba(99, 102, 241, 0.1)"] {
    background: rgba(99, 102, 241, 0.2) !important;
}

body.dark .about-container *[style*="background: rgba(59, 130, 246, 0.1)"] {
    background: rgba(59, 130, 246, 0.2) !important;
}

body.dark .about-container *[style*="background: rgba(34, 197, 94, 0.1)"] {
    background: rgba(34, 197, 94, 0.2) !important;
}

body.dark .about-container *[style*="background: rgba(59, 130, 246, 0.05)"] {
    background: rgba(59, 130, 246, 0.15) !important;
}

body.dark .about-container *[style*="background: rgba(34, 197, 94, 0.05)"] {
    background: rgba(34, 197, 94, 0.15) !important;
}

/* Элементы с inline стилями границ */
body.dark .about-container *[style*="border-left: 4px solid #3b82f6"] {
    border-left-color: #3b82f6 !important;
}

body.dark .about-container *[style*="border-left: 4px solid #22c55e"] {
    border-left-color: #22c55e !important;
}

body.dark .about-container *[style*="border-left: 4px solid #6366f1"] {
    border-left-color: #6366f1 !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: #f7fafc"]:not(.phone-screen):not(.phone-screen *) {
    background: rgba(51, 65, 85, 0.8) !important;
}

body.dark .about-container *[style*="background: #edf2f7"]:not(.phone-screen):not(.phone-screen *) {
    background: rgba(71, 85, 105, 0.9) !important;
}

body.dark .about-container *[style*="background: #ffffff"]:not(.phone-screen):not(.phone-screen *) {
    background: rgba(51, 65, 85, 0.8) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета границ */
body.dark .about-container *[style*="border: 1px solid #e2e8f0"] {
    border-color: #4b5563 !important;
}

/* Элементы с inline стилями, которые могут содержать цвета тени */
body.dark .about-container *[style*="box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1)"] {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 1.5px 6px rgba(99, 102, 241, 0.2) !important;
}

body.dark .about-container *[style*="box-shadow: 0 8px 25px rgba(0, 0, 0, 0.05)"] {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 1.5px 6px rgba(99, 102, 241, 0.2) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%)"] {
    background: rgba(51, 65, 85, 0.8) !important;
    background-image: none !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(255, 255, 255, 0.9)"] {
    background: rgba(99, 102, 241, 0.9) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1)"] {
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(102, 126, 234, 0.3)"] {
    background: rgba(99, 102, 241, 0.3) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(102, 126, 234, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(107, 70, 193, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(90, 103, 216, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(107, 70, 193, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(90, 103, 216, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* Элементы с inline стилями, которые могут содержать цвета фона */
body.dark .about-container *[style*="background: rgba(107, 70, 193, 0.4)"] {
    background: rgba(99, 102, 241, 0.4) !important;
}

/* ===== СТИЛИ ДЛЯ БЛОКА ОТЗЫВОВ В ТЁМНОЙ ТЕМЕ ===== */

/* Основной блок отзывов */
body.dark .about-container .testimonials {
    background: rgba(51, 65, 85, 0.9) !important;
    border: 1px solid #4b5563 !important;
    color: #ffffff !important;
}

/* Заголовок отзывов */
body.dark .about-container .testimonials-title {
    color: #ffffff !important;
}

/* Общий рейтинг */
body.dark .about-container .overall-rating {
    background: rgba(71, 85, 105, 0.8) !important;
    border: 1px solid #4b5563 !important;
    color: #ffffff !important;
}

body.dark .about-container .overall-rating-text {
    color: #ffffff !important;
}

/* Форма отзыва */
body.dark .about-container .review-form {
    background: rgba(51, 65, 85, 0.9) !important;
    border: 1px solid #4b5563 !important;
    color: #ffffff !important;
}

/* Текст в форме отзыва */
body.dark .about-container .review-form span {
    color: #ffffff !important;
}

/* Карточки отзывов */
body.dark .about-container .testimonial-card {
    background: rgba(71, 85, 105, 0.8) !important;
    border: 1px solid #4b5563 !important;
    color: #ffffff !important;
}

body.dark .about-container .testimonial-card:hover {
    background: rgba(85, 99, 119, 0.9) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.3) !important;
}

/* Текст отзывов */
body.dark .about-container .testimonial-text {
    color: #e2e8f0 !important;
}

/* Имена авторов */
body.dark .about-container .author-name {
    color: #ffffff !important;
}

/* Роли авторов */
body.dark .about-container .author-role {
    color: #9ca3af !important;
}

/* Звёзды рейтинга */
body.dark .about-container .stars-base {
    color: #4b5563 !important;
}

body.dark .about-container .stars-fill {
    color: #f59e0b !important;
}

/* Поле ввода отзыва */
body.dark .about-container .review-form textarea {
    background: rgba(71, 85, 105, 0.8) !important;
    border: 1px solid #4b5563 !important;
    color: #ffffff !important;
}

body.dark .about-container .review-form textarea::placeholder {
    color: #9ca3af !important;
}

body.dark .about-container .review-form textarea:focus {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1) !important;
}

/* Кнопка отправки отзыва */
body.dark .about-container .review-form .btn-primary {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%) !important;
    color: #ffffff !important;
    border: 1px solid #4b5563 !important;
}

body.dark .about-container .review-form .btn-primary:hover {
    background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%) !important;
}

/* ===== СПЕЦИАЛЬНЫЕ СТИЛИ ДЛЯ СТРАНИЦЫ TELEGRAM_LOGIN В ТЁМНОЙ ТЕМЕ ===== */

/* Основные стили для страницы telegram_login в тёмной теме */
body.dark.telegram-login-page {
    background: #0b1220 !important;
    background-image: none !important;
    background-color: #0b1220 !important;
    color: #ffffff !important;
}

/* Контейнер страницы telegram_login */
body.dark.telegram-login-page .container {
    background: rgba(30, 41, 59, 0.9) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 1.5px 6px rgba(99, 102, 241, 0.2) !important;
}

/* Заголовок */
body.dark.telegram-login-page h2 {
    color: #6366f1 !important;
}

/* Инструкция */
body.dark.telegram-login-page .instruction {
    background: rgba(99, 102, 241, 0.2) !important;
    color: #6366f1 !important;
}

/* Кнопка назад */
body.dark.telegram-login-page .back-btn {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%) !important;
    color: #ffffff !important;
}

body.dark.telegram-login-page .back-btn:hover,
body.dark.telegram-login-page .back-btn:focus {
    background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%) !important;
}

/* Кнопка переключения темы */
body.dark.telegram-login-page .theme-btn {
    background: rgba(99, 102, 241, 0.9) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3) !important;
}

/* Альтернативные ссылки */
body.dark.telegram-login-page .alternative-links {
    border-top-color: #4b5563 !important;
}

body.dark.telegram-login-page .alternative-links p {
    color: #9ca3af !important;
}

body.dark.telegram-login-page .alternative-links a {
    background: rgba(51, 65, 85, 0.8) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3) !important;
}

body.dark.telegram-login-page .alternative-links a:hover {
    background: rgba(71, 85, 105, 0.9) !important;
}

/* Fallback блок */
body.dark.telegram-login-page #fallback-login {
    background: rgba(51, 65, 85, 0.8) !important;
}

body.dark.telegram-login-page #fallback-login p {
    color: #9ca3af !important;
}

/* Кнопка Telegram */
body.dark.telegram-login-page #telegram-login-btn {
    background: #0088cc !important;
    color: #ffffff !important;
}

/* Описание под кнопкой */
body.dark.telegram-login-page #telegram-login-container p {
    color: #9ca3af !important;
}

/* Inline стили для элементов с цветами */
body.dark.telegram-login-page *[style*="color: #6b7280"] {
    color: #9ca3af !important;
}

body.dark.telegram-login-page *[style*="color: #4338ca"] {
    color: #6366f1 !important;
}

body.dark.telegram-login-page *[style*="background: #e8ebf1"] {
    background: rgba(30, 41, 59, 0.9) !important;
}

body.dark.telegram-login-page *[style*="background: #f8f9fa"] {
    background: rgba(51, 65, 85, 0.8) !important;
}

body.dark.telegram-login-page *[style*="background: #28a745"] {
    background: #22c55e !important;
}

body.dark.telegram-login-page *[style*="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%)"] {
    background: rgba(51, 65, 85, 0.8) !important;
    background-image: none !important;
}

body.dark.telegram-login-page *[style*="background: linear-gradient(135deg, #e0e7ff 0%, #f5f7fa 100%)"] {
    background: #0b1220 !important;
    background-image: none !important;
}

/* ===== СПЕЦИАЛЬНЫЕ СТИЛИ ДЛЯ СТРАНИЦЫ MOBILE_TRACKER В ТЁМНОЙ ТЕМЕ ===== */

/* Основные стили для страницы mobile-tracker в тёмной теме */
body.dark.mobile-tracker {
    background: #0b1220 !important;
    background-image: none !important;
    background-color: #0b1220 !important;
    color: #ffffff !important;
}

/* Контейнер страницы mobile-tracker */
body.dark.mobile-tracker .container {
    background: rgba(30, 41, 59, 0.9) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3) !important;
}

/* Заголовок */
body.dark.mobile-tracker h2 {
    color: #6366f1 !important;
}

/* Блок статуса */
body.dark.mobile-tracker .status-block {
    background: rgba(99, 102, 241, 0.2) !important;
    color: #6366f1 !important;
}

body.dark.mobile-tracker .status-block.working {
    background: rgba(34, 197, 94, 0.2) !important;
    color: #22c55e !important;
}

body.dark.mobile-tracker .status-block.error {
    background: rgba(239, 68, 68, 0.2) !important;
    color: #f87171 !important;
}

/* Кнопка обновления */
body.dark.mobile-tracker .btn-refresh {
    background: rgba(99, 102, 241, 0.9) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3) !important;
}

body.dark.mobile-tracker .btn-refresh:active {
    background: rgba(79, 70, 229, 0.9) !important;
    background-image: none !important;
}

/* Кнопка назад */
body.dark.mobile-tracker .back-btn {
    background: rgba(51, 65, 85, 0.8) !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3) !important;
}

body.dark.mobile-tracker .back-btn:hover,
body.dark.mobile-tracker .back-btn:focus {
    background: rgba(71, 85, 105, 0.9) !important;
    background-image: none !important;
}

/* Кнопка переключения темы */
body.dark.mobile-tracker .theme-toggle {
    background: rgba(99, 102, 241, 0.9) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.3) !important;
}

/* Информационный блок */
body.dark.mobile-tracker .info {
    color: #9ca3af !important;
}

/* Footer */
body.dark.mobile-tracker footer {
    color: #9ca3af !important;
}

/* Логотип */
body.dark.mobile-tracker #logo-img {
    filter: drop-shadow(0 2px 8px rgba(99, 102, 241, 0.3)) !important;
}

/* Inline стили для элементов с цветами */
body.dark.mobile-tracker *[style*="color: #222"] {
    color: #ffffff !important;
}

body.dark.mobile-tracker *[style*="color: #2d3a5a"] {
    color: #6366f1 !important;
}

body.dark.mobile-tracker *[style*="color: #00796b"] {
    color: #6366f1 !important;
}

body.dark.mobile-tracker *[style*="color: #2e7d32"] {
    color: #22c55e !important;
}

body.dark.mobile-tracker *[style*="color: #c62828"] {
    color: #f87171 !important;
}

body.dark.mobile-tracker *[style*="color: #64748b"] {
    color: #9ca3af !important;
}

body.dark.mobile-tracker *[style*="color: #888"] {
    color: #9ca3af !important;
}

body.dark.mobile-tracker *[style*="background: #f5f7fa"] {
    background: rgba(30, 41, 59, 0.9) !important;
}

body.dark.mobile-tracker *[style*="background: #e0f7fa"] {
    background: rgba(99, 102, 241, 0.2) !important;
}

body.dark.mobile-tracker *[style*="background: #e8f5e8"] {
    background: rgba(34, 197, 94, 0.2) !important;
}

body.dark.mobile-tracker *[style*="background: #ffebee"] {
    background: rgba(239, 68, 68, 0.2) !important;
}

body.dark.mobile-tracker *[style*="background: linear-gradient(135deg, #e0e7ff 0%, #f5f7fa 100%)"] {
    background: #0b1220 !important;
    background-image: none !important;
}

body.dark.mobile-tracker *[style*="background: linear-gradient(90deg, #6366f1 0%, #818cf8 100%)"] {
    background: rgba(99, 102, 241, 0.9) !important;
    background-image: none !important;
}

body.dark.mobile-tracker *[style*="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%)"] {
    background: rgba(51, 65, 85, 0.8) !important;
    background-image: none !important;
}

/* Стили для кнопки "Назад на главную" в темной теме */
body.dark .back-btn {
    background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 15px rgba(99, 102, 241, 0.4) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    -webkit-transform: translateX(-50%) !important;
}

body.dark .back-btn:hover {
    background: linear-gradient(135deg, #5b21b6 0%, #7c3aed 100%) !important;
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.5) !important;
    color: #ffffff !important;
    transform: translateX(-50%) translateY(-2px) !important;
}

body.dark .back-btn:active {
    box-shadow: 0 2px 10px rgba(99, 102, 241, 0.4) !important;
    transform: translateX(-50%) translateY(0) !important;
}

/* Универсальные современные стили кнопок */
.btn.btn-success,
.btn-success {
    background: linear-gradient(135deg, #10b981, #059669) !important;
    color: #ffffff !important;
    border: 1px solid rgba(16, 185, 129, 0.35) !important;
    box-shadow: none !important;
}

.btn.btn-pill,
.btn-pill {
    border-radius: 999px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 8px !important;
}

/* Стили для плашки рейтинга на главной странице в темной теме */
body.dark .rating-badge-text {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
}

body.dark .rating-badge-text strong {
    color: #ffffff !important;
    font-weight: 700 !important;
}

body.dark .rating-badge-link {
    color: #93c5fd !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) !important;
}

body.dark .rating-badge-link:hover {
    color: #dbeafe !important;
    text-decoration: underline !important;
}

/* Дополнительные стили для всех элементов плашки рейтинга */
body.dark .rating-badge {
    color: #ffffff !important;
}

body.dark .rating-badge * {
    color: #ffffff !important;
}

/* Стили для главной страницы в темной теме */
body.dark .hero-title {
    color: #ffffff !important;
}

body.dark .hero-title .hero-word-animated {
    color: #ffffff !important;
}

body.dark .info-block-title {
    color: #ffffff !important;
}

body.dark .info-block-text {
    color: #e5e7eb !important;
}

body.dark .info-block {
    background: rgba(51, 65, 85, 0.9) !important;
    border: 1px solid #4b5563 !important;
}

body.dark .welcome-block {
    background: rgba(51, 65, 85, 0.9) !important;
}

body.dark .how-it-works {
    background: rgba(51, 65, 85, 0.9) !important;
    border: 1px solid #4b5563 !important;
}

body.dark .feature-card {
    background: rgba(51, 65, 85, 0.9) !important;
    border: 1px solid #4b5563 !important;
}

body.dark .feature-title {
    color: #ffffff !important;
}

body.dark .feature-text {
    color: #e5e7eb !important;
}

body.dark .phone-head h3 {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

body.dark .phone-head p {
    color: #e5e7eb !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

body.dark .phone-mockup {
    color: #ffffff !important;
}

/* Стили для макетов экранов на странице about в темной теме */
body.dark .about-container .phone-head h3 {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

body.dark .about-container .phone-head p {
    color: #e5e7eb !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

body.dark .about-container .phone-mockup {
    color: #ffffff !important;
}

body.dark .about-container .phone-mockup h3 {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

body.dark .about-container .phone-mockup p {
    color: #e5e7eb !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

body.dark .about-container .info-block-title {
    color: #ffffff !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}