/* Public site styles — uses tokens from theme.css */
/* San Francisco шрифт */
        @font-face {
            font-family: 'SF UI Display';
            src: local('SF UI Display Regular'),
                url('/fonts/san_francisco_ios9/SF-UI-Display-Regular.otf') format('opentype');
            font-weight: 400;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Display';
            src: local('SF UI Display Medium'),
                url('/fonts/san_francisco_ios9/SF-UI-Display-Medium.otf') format('opentype');
            font-weight: 500;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Display';
            src: local('SF UI Display Semibold'),
                url('/fonts/san_francisco_ios9/SF-UI-Display-Semibold.otf') format('opentype');
            font-weight: 600;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Display';
            src: local('SF UI Display Bold'),
                url('/fonts/san_francisco_ios9/SF-UI-Display-Bold.otf') format('opentype');
            font-weight: 700;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Text';
            src: local('SF UI Text Regular'),
                url('/fonts/san_francisco_ios9/SF-UI-Text-Regular.otf') format('opentype');
            font-weight: 400;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Text';
            src: local('SF UI Text Medium'),
                url('/fonts/san_francisco_ios9/SF-UI-Text-Medium.otf') format('opentype');
            font-weight: 500;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Text';
            src: local('SF UI Text Semibold'),
                url('/fonts/san_francisco_ios9/SF-UI-Text-Semibold.otf') format('opentype');
            font-weight: 600;
            font-style: normal;
            font-display: swap;
        }

        @font-face {
            font-family: 'SF UI Text';
            src: local('SF UI Text Bold'),
                url('/fonts/san_francisco_ios9/SF-UI-Text-Bold.otf') format('opentype');
            font-weight: 700;
            font-style: normal;
            font-display: swap;
        }

        body {
            font-family: var(--font-body);
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        .btn {
            font-family: var(--font-heading);
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }

        /* macOS-стильная полоса прокрутки */
        ::-webkit-scrollbar {
            width: 14px;
            height: 14px;
        }

        ::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.05);
            border-radius: 0;
        }

        ::-webkit-scrollbar-thumb {
            background: linear-gradient(to bottom, var(--color-brand-light), var(--color-brand));
            border-radius: 7px;
            border: 3px solid rgba(0, 0, 0, 0);
            background-clip: padding-box;
        }

        ::-webkit-scrollbar-thumb:hover {
            background: linear-gradient(to bottom, var(--color-brand-lighter), var(--color-brand-light));
            background-clip: padding-box;
        }

        ::-webkit-scrollbar-thumb:active {
            background: var(--color-brand-dark);
        }

        /* Скрытие полосы прокрутки при бездействии (только для macOS-подобных браузеров) */
        body {
            scrollbar-gutter: stable;
        }

        /* Плавное появление/исчезновение полосы прокрутки */
        * {
            scrollbar-width: thin;
            scrollbar-color: var(--color-brand) rgba(0, 0, 0, 0.05);
        }

        /* Класс для скрытия полосы прокрутки */
        .hide-scrollbar::-webkit-scrollbar {
            width: 0px;
            background: transparent;
        }

        .hide-scrollbar {
            scrollbar-width: none;
            /* Firefox */
        }

        /* Дополнительные стили для Firefox */
        html {
            scroll-behavior: smooth;
            height: 100%;
        }

        body {
            padding-top: 50px;
            background-color: var(--color-bg);
            min-height: 100vh;
            min-height: 100dvh;
            display: flex;
            flex-direction: column;
        }

        .site-main {
            flex: 1 0 auto;
        }

        @media (min-width: 1200px) {
            .sticky {
                position: sticky;
                top: 70px;
                align-self: flex-start;
            }
        }

        /* Скрытие полосы прокрутки для мобильных устройств */
        @media (max-width: 768px) {
            ::-webkit-scrollbar {
                display: none;
            }

            * {
                scrollbar-width: none;
            }

            /* Верхнее меню прижато к верхнему краю на мобильных. */
            .navbar.navbar-fixed-top {
                top: 0;
                margin-top: 0;
                /* Расширяем фон под островок/челку. */
                padding-top: constant(safe-area-inset-top);
                padding-top: env(safe-area-inset-top);
            }

            /* Компенсируем высоту фиксированного меню с учетом safe-area. */
            body {
                padding-top: calc(50px + constant(safe-area-inset-top));
                padding-top: calc(50px + env(safe-area-inset-top));
            }
        }

        .jumbotron {
            background: var(--gradient-jumbotron);
            color: #fff;
            padding: 48px 0;
            margin-bottom: 24px;
        }

        .jumbotron h1 {
            font-size: var(--font-size-h1, 2.25rem);
            line-height: 1.25;
            margin-bottom: 16px;
        }

        .jumbotron .lead {
            font-size: 18px;
            line-height: var(--line-height-body, 1.6);
            opacity: 0.92;
        }

        /* Сдвиг контента jumbotron вправо на больших экранах */
        @media (min-width: 992px) {
            .jumbotron-content {
                margin-left: 50px;
            }
        }

        .feature-box {
            text-align: center;
            padding: 30px;
            background: var(--color-surface);
            border: 1px solid var(--color-border);
            border-radius: var(--radius-md);
            box-shadow: var(--shadow-sm);
            margin-bottom: 30px;
            transition: box-shadow 0.2s ease;
            height: 260px;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }

        .feature-box:hover {
            transform: none;
            box-shadow: var(--shadow-md);
        }

        .feature-box i {
            font-size: 40px;
            color: var(--color-accent);
            margin-bottom: 20px;
            display: block;
        }

        .feature-box h3 {
            color: var(--color-text);
            margin-bottom: 15px;
            min-height: 60px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .feature-box p {
            flex-grow: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--color-text-muted);
        }

        .navbar,
        .navbar.navbar-inverse {
            background: var(--gradient-nav);
            border: none;
            box-shadow: var(--shadow-sm);
        }

        .navbar .navbar-brand {
            color: #fff !important;
            font-weight: bold;
            font-size: 22px;
            letter-spacing: 1px;
            text-transform: uppercase;
            display: inline-flex;
            align-items: center;
            min-height: 50px;
            line-height: 1;
        }

        .navbar .navbar-brand,
        .navbar .navbar-brand:hover,
        .navbar .navbar-brand:focus,
        .navbar .navbar-brand:active {
            outline: none !important;
            box-shadow: none !important;
            background-color: transparent !important;
            border: none !important;
            -webkit-tap-highlight-color: transparent;
        }

        .navbar .navbar-brand:focus-visible {
            outline: 2px solid rgba(var(--color-accent-rgb, 232, 148, 58), 0.55) !important;
            outline-offset: 3px;
        }

        .navbar .navbar-brand img,
        .navbar .navbar-brand .itc-nav-logo {
            display: inline-block;
            height: 35px;
            max-width: 40px;
            width: auto;
            margin: 0 12px 0 0;
            transform-origin: center center;
            transition: transform 0.4s cubic-bezier(0.34, 1.45, 0.64, 1),
                        filter 0.35s ease;
            filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
        }

        .navbar .navbar-brand:hover {
            transform: none;
        }

        .navbar .navbar-brand:hover img,
        .navbar .navbar-brand:hover .itc-nav-logo,
        .navbar .navbar-brand:focus img,
        .navbar .navbar-brand:focus .itc-nav-logo {
            transform: scale(1.12) rotate(-7deg);
            filter: drop-shadow(0 0 10px rgba(var(--color-accent-rgb, 232, 148, 58), 0.55))
                    drop-shadow(0 3px 8px rgba(0, 0, 0, 0.25));
        }

        .navbar .navbar-nav>li>a {
            color: var(--color-nav-text) !important;
            position: relative;
            transition: background-color 0.2s ease, color 0.2s ease;
            padding: 15px 20px;
            font-weight: 500;
        }

        .navbar .navbar-nav>li>a:hover {
            background-color: rgba(255, 255, 255, 0.08);
            transform: none;
        }

        .navbar .navbar-nav>li.active>a {
            background-color: transparent !important;
            box-shadow: none;
            position: relative;
            color: var(--color-nav-text) !important;
        }

        .navbar .navbar-nav>li.active>a::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 16px;
            right: 16px;
            width: auto;
            height: 3px;
            background: var(--color-accent);
            border: none;
            border-radius: 2px 2px 0 0;
            transform: none;
            animation: none;
        }

        .navbar .navbar-nav>li>a i {
            margin-right: 5px;
            transition: none;
        }

        .navbar .navbar-nav>li>a:hover i {
            transform: none;
        }

        .navbar .navbar-nav>li.active>a:hover {
            background-color: rgba(255, 255, 255, 0.06) !important;
        }

        footer {
            background: var(--gradient-footer);
            color: var(--color-nav-text);
            padding: 30px 0;
            margin-top: 50px;
            box-shadow: none;
            flex-shrink: 0;
        }

        footer a {
            color: var(--color-nav-text);
        }

        footer a:hover {
            color: var(--color-accent);
            text-decoration: none;
        }

        .logo-section {
            text-align: center;
            padding: 30px 0;
            margin-bottom: 20px;
        }

        .logo-section img {
            max-width: 200px;
            height: auto;
            filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
            animation: none;
        }

        /* Карусель (legacy, если используется) */
        #logo-services-carousel {
            margin-bottom: 24px;
            animation: none;
        }

        #logo-services-carousel .carousel-inner {
            background: rgba(255, 255, 255, 0.08);
            border-radius: var(--radius-lg);
            box-shadow: none;
            backdrop-filter: none;
            border: 1px solid rgba(255, 255, 255, 0.12);
            height: auto;
            min-height: 280px;
            overflow: hidden;
        }

        #logo-services-carousel .logo-section {
            background: transparent;
            box-shadow: none;
            border-radius: 0;
            border: none;
        }

        #logo-services-carousel .carousel-indicators li {
            background-color: rgba(255, 255, 255, 0.5);
            border: 2px solid var(--color-accent);
        }

        #logo-services-carousel .carousel-indicators .active {
            background-color: var(--color-accent);
        }

        #logo-services-carousel .carousel-control {
            display: none;
        }

        #logo-services-carousel .item i {
            animation: none;
        }

        .email-image,
        .phone-image,
        .telegram-image {
            display: inline-block;
            background: transparent;
            color: inherit;
            padding: 0;
            font-family: inherit;
            font-size: inherit;
            letter-spacing: normal;
            cursor: pointer;
            user-select: none;
            -webkit-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
        }

        .email-image:hover,
        .phone-image:hover,
        .telegram-image:hover {
            text-decoration: underline;
        }

        .marketplace-box {
            background: var(--color-surface);
            padding: 24px;
            margin-bottom: 24px;
            border: 1px solid var(--color-border);
            border-radius: var(--radius-md);
            box-shadow: var(--shadow-sm);
            transition: box-shadow 0.2s ease;
        }

        /* Фиксированная высота для карточек в сетке */
        #features .marketplace-box {
            height: 240px;
        }

        .marketplace-box:hover {
            transform: none;
            box-shadow: var(--shadow-md);
        }

        .marketplace-box h2,
        .marketplace-box h3 {
            color: var(--color-text);
            margin-top: 0;
        }

        .marketplace-box h2 i,
        .marketplace-box h3 i {
            color: var(--color-accent);
            margin-right: 8px;
        }


        .marketplace-logo {
            display: inline-block;
            padding: 10px 15px;
            margin: 5px;
            background: linear-gradient(135deg, var(--color-brand), var(--color-brand-light));
            color: white;
            border-radius: 5px;
            font-weight: bold;
            font-size: 14px;
        }

        .config-badge {
            display: inline-block;
            padding: 5px 10px;
            margin: 3px;
            background-color: var(--color-accent);
            color: white;
            border-radius: 3px;
            font-size: 12px;
        }

        .feature-icon {
            font-size: 24px;
            color: var(--color-accent);
            margin-right: 10px;
        }

        .price-box {
            background: linear-gradient(135deg, var(--color-accent), var(--color-accent-deep));
            color: white;
            padding: 30px;
            border-radius: 8px;
            text-align: center;
            margin-bottom: 30px;
        }

        .contact-button {
            background-color: var(--color-brand);
            color: #fff;
            border: none;
            padding: 12px 24px;
            font-size: 18px;
            border-radius: var(--radius-sm);
            transition: background-color 0.2s ease, box-shadow 0.2s ease;
        }

        .contact-button:hover {
            background-color: var(--color-accent);
            transform: none;
        }

        .support-time {
            background: var(--color-surface);
            padding: 20px;
            border-left: 4px solid var(--color-accent);
            margin-top: 20px;
            border-radius: var(--radius-sm);
        }

        .animated-progress {
            transition: width 0.1s ease-out;
        }

        .progress-text {
            display: block;
            width: 100%;
            text-align: left;
            padding-left: 10px;
        }

        .progress {
            position: relative;
            overflow: visible;
        }

        /* Cookie Notice */
        #cookie-notice {
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
            background: var(--gradient-cookie);
            color: white;
            padding: 20px;
            box-shadow: var(--shadow-md);
            z-index: 9999;
            display: none;
            animation: slideUp 0.5s ease-out;
        }

        @keyframes slideUp {
            from {
                transform: translateY(100%);
                opacity: 0;
            }

            to {
                transform: translateY(0);
                opacity: 1;
            }
        }

        #cookie-notice p {
            margin: 0;
            font-size: 15px;
            line-height: 1.6;
        }

        #cookie-notice a {
            color: var(--color-accent);
            text-decoration: underline;
        }

        #cookie-notice a:hover {
            color: var(--color-accent-deep);
        }

        #cookie-notice .btn-accept {
            background-color: var(--color-accent);
            color: white;
            border: none;
            padding: 10px 30px;
            border-radius: var(--radius-sm);
            font-size: 15px;
            cursor: pointer;
            transition: background-color 0.2s ease;
            margin-left: 15px;
        }

        #cookie-notice .btn-accept:hover {
            background-color: var(--color-accent-hover);
            transform: none;
        }

        @media (max-width: 768px) {
            #cookie-notice .container {
                flex-direction: column;
                text-align: center;
            }

            #cookie-notice .btn-accept {
                margin-left: 0;
                margin-top: 15px;
                width: 100%;
            }
        }

/* === Theme utility classes === */
.text-accent { color: var(--color-accent) !important; }
.text-brand { color: var(--color-brand) !important; }
.text-accent-hover { color: var(--color-accent-hover) !important; }
.icon-accent { color: var(--color-accent); }
.heading-accent { color: var(--color-accent); margin-top: 0; }
.heading-accent-spaced { color: var(--color-accent); margin-top: 15px; }
.heading-accent-sm { color: var(--color-accent); margin-top: 10px; font-size: 15px; }
.heading-accent-md { color: var(--color-accent); margin-top: 15px; font-size: 18px; }

.btn-accent,
.btn.btn-accent {
    background-color: var(--color-accent);
    color: var(--color-text-on-accent);
    border: none;
}
.btn-accent:hover,
.btn-accent:focus,
.btn.btn-accent:hover,
.btn.btn-accent:focus {
    background-color: var(--color-accent-hover);
    color: var(--color-text-on-accent);
}
.btn-accent-alt {
    background-color: var(--color-accent-hover);
    color: var(--color-text-on-accent);
    border: none;
}
.btn-brand {
    background-color: var(--color-brand);
    color: var(--color-text-on-accent);
    border: none;
}
.btn-brand:hover,
.btn-brand:focus {
    background-color: var(--color-brand-dark);
    color: var(--color-text-on-accent);
}

.table-head-brand {
    background-color: var(--color-brand-dark);
    color: #fff;
}

.box-accent {
    background: var(--gradient-box-accent);
    border-left: 5px solid var(--color-accent);
}
.box-accent-light {
    background: var(--gradient-box-accent-light);
    border-left: 5px solid var(--color-accent);
}
.box-highlight {
    margin-top: 20px;
    padding: 15px;
    background: rgba(var(--color-accent-deep-rgb), 0.1);
    border-radius: 5px;
    border-left: 3px solid var(--color-accent);
}

.icon-lg-accent {
    font-size: 40px;
    color: var(--color-accent);
    margin-bottom: 15px;
}
.icon-xl-accent {
    font-size: 64px;
    color: var(--color-accent);
    margin-bottom: 20px;
    display: block;
}
.icon-xxl-accent {
    font-size: 80px;
    color: var(--color-accent);
}

.list-check-accent li i.fa-check,
.list-check-accent li i.fa-angle-right {
    color: var(--color-accent);
}

.panel-brand {
    border-color: var(--color-brand);
}
.panel-brand > .panel-heading {
    background-color: var(--color-brand);
    border-color: var(--color-brand);
}

.link-accent { color: var(--color-accent); }
.link-accent:hover { color: var(--color-accent-hover); }

.field-accent-border { border: 2px solid var(--color-accent) !important; }

.jumbotron-compact { padding: 40px 0; }

/* === Shared page patterns (все публичные страницы) === */
body {
    color: var(--color-text);
}

h1 { font-size: var(--font-size-h1, 2.25rem); line-height: 1.25; }
h2 { font-size: var(--font-size-h2, 1.75rem); line-height: 1.3; color: var(--color-text); }

.page-header {
    border-bottom: 1px solid var(--color-border);
    margin-bottom: 24px;
    padding-bottom: 12px;
}

.page-header h2 {
    margin-top: 0;
    color: var(--color-text);
}

.page-header h2 i {
    color: var(--color-accent);
    margin-right: 8px;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.hero-actions .btn {
    margin: 0;
    border-radius: var(--radius-sm);
    padding: 12px 24px;
    white-space: normal;
    line-height: 1.3;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.hero-actions .btn:nth-child(odd),
.hero-actions .btn:nth-child(even) {
    background-color: transparent;
    border: 2px solid rgba(255, 255, 255, 0.5);
    color: #fff;
}

.hero-actions .btn:first-child,
.hero-actions .btn.btn-accent,
.hero-actions .btn.btn-accent-alt {
    background: var(--gradient-accent);
    border-color: transparent;
    color: var(--color-text-on-accent);
}

.hero-actions .btn:first-child:hover,
.hero-actions .btn.btn-accent:hover,
.hero-actions .btn.btn-accent-alt:hover {
    background: var(--color-accent-hover);
    color: var(--color-text-on-accent);
}

.hero-actions .btn.btn-brand {
    background: var(--color-brand);
    border-color: transparent;
    color: #fff;
}

.hero-actions .btn.btn-brand:hover {
    background: var(--color-brand-dark);
    color: #fff;
}

.hero-actions .mvp-btn-telegram,
.hero-actions a[href="/marketplace/tickets"],
.hero-actions a[href*="/marketplace/tickets"] {
    background-color: #0088cc !important;
    border-color: transparent !important;
    color: #fff !important;
}

.hero-actions .mvp-btn-muted {
    background-color: var(--color-brand) !important;
    border-color: transparent !important;
    color: #fff !important;
}

.hero-actions .btn:hover,
.hero-actions .btn:focus {
    transform: none;
    text-decoration: none;
}

.hero-home {
    text-align: center;
    padding: 20px 0 10px;
}

.hero-home .hero-logo {
    max-width: 200px;
    margin-bottom: 24px;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.2));
}

.hero-home h1 {
    font-size: var(--font-size-h1, 2.25rem);
    margin-bottom: 12px;
}

.hero-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin: 24px 0 8px;
}

.hero-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 999px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.hero-pill i {
    color: var(--color-accent);
}

.jumbotron .hero-note {
    margin-top: 12px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.5;
}

.btn-accent,
.btn.btn-accent,
.btn-accent-alt,
.btn-brand {
    border-radius: var(--radius-sm);
    padding: 12px 24px;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.btn-accent:hover,
.btn.btn-accent:hover {
    transform: none;
    box-shadow: var(--shadow-sm);
}

.contact-button:hover,
#cookie-notice .btn-accept:hover {
    transform: none;
}

.price-box {
    background: var(--gradient-accent);
    border-radius: var(--radius-md);
}

.box-highlight {
    border-radius: var(--radius-sm);
}

.text-muted-inline {
    color: var(--color-text-muted);
    font-size: 14px;
}

@media (max-width: 767px) {
    .jumbotron h1,
    .hero-home h1 {
        font-size: 1.75rem;
    }

    .jumbotron .lead {
        font-size: 16px;
    }

    .hero-pills,
    .hero-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .hero-actions .btn {
        width: 100%;
        text-align: center;
    }
}

/* === Bootstrap 3 — переопределение под тему ITC === */

/* Ссылки в контенте */
.site-main a:not(.btn):not(.hero-actions a):not(.label):not(.badge):not(.anchor-link):not(.version-line-tab):not(.nav-link) {
    color: var(--color-link);
    text-decoration: none;
    transition: color 0.2s ease;
}

.site-main a:not(.btn):not(.label):not(.badge):not(.anchor-link):not(.version-line-tab):hover,
.site-main a:not(.btn):not(.label):not(.badge):not(.anchor-link):not(.version-line-tab):focus {
    color: var(--color-link-hover);
    text-decoration: underline;
}

/* Кнопки */
.btn {
    border-radius: var(--radius-sm);
    font-weight: 500;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
    background-image: none;
    box-shadow: none;
    text-shadow: none;
}

.btn:focus,
.btn:active:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(var(--color-accent-rgb), 0.25);
}

.btn-default {
    background-color: var(--color-surface);
    border: 1px solid var(--color-border);
    color: var(--color-text);
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active {
    background-color: var(--color-bg);
    border-color: var(--color-border-accent);
    color: var(--color-text);
}

.btn-primary {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
    color: var(--color-text-on-accent);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--color-accent-hover);
    border-color: var(--color-accent-hover);
    color: var(--color-text-on-accent);
}

.btn-success {
    background-color: var(--color-success);
    border-color: var(--color-success);
    color: #fff;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active {
    background-color: var(--color-success-hover);
    border-color: var(--color-success-hover);
    color: #fff;
}

.btn-info {
    background-color: var(--color-info);
    border-color: var(--color-info);
    color: #fff;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active {
    background-color: var(--color-info-hover);
    border-color: var(--color-info-hover);
    color: #fff;
}

.btn-warning {
    background-color: var(--color-warning);
    border-color: var(--color-warning);
    color: #fff;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active {
    background-color: var(--color-warning-hover);
    border-color: var(--color-warning-hover);
    color: #fff;
}

.btn-danger {
    background-color: var(--color-danger);
    border-color: var(--color-danger);
    color: #fff;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active {
    background-color: var(--color-danger-hover);
    border-color: var(--color-danger-hover);
    color: #fff;
}

.btn-link {
    color: var(--color-link);
}

.btn-link:hover,
.btn-link:focus {
    color: var(--color-link-hover);
    text-decoration: underline;
}

.open > .dropdown-toggle.btn-default,
.open > .dropdown-toggle.btn-primary,
.open > .dropdown-toggle.btn-success,
.open > .dropdown-toggle.btn-info,
.open > .dropdown-toggle.btn-warning,
.open > .dropdown-toggle.btn-danger {
    background-image: none;
}

/* Формы */
.form-control {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    color: var(--color-text);
    background-color: var(--color-surface);
    box-shadow: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.form-control:focus {
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px rgba(var(--color-accent-rgb), 0.15);
}

.form-control::placeholder {
    color: var(--color-text-muted);
    opacity: 1;
}

.input-group-addon {
    background-color: var(--color-bg);
    border: 1px solid var(--color-border);
    color: var(--color-text-muted);
    border-radius: var(--radius-sm);
}

/* Панели */
.panel {
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-sm);
    background: var(--color-surface);
}

.panel-default > .panel-heading {
    background: var(--color-bg);
    border-color: var(--color-border);
    color: var(--color-text);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}

.panel-default {
    border-color: var(--color-border);
}

.panel-primary,
.panel-brand {
    border-color: var(--color-brand);
}

.panel-primary > .panel-heading,
.panel-brand > .panel-heading {
    background: var(--color-brand-dark);
    border-color: var(--color-brand-dark);
    color: #fff;
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}

.panel-primary > .panel-heading .panel-title,
.panel-brand > .panel-heading .panel-title {
    color: #fff;
}

.panel-body {
    color: var(--color-text);
}

.panel-title {
    font-weight: 600;
}

/* Алерты */
.alert {
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    box-shadow: none;
}

.alert-success {
    background-color: var(--color-success-bg);
    border-color: var(--color-success-border);
    color: var(--color-success-hover);
}

.alert-info {
    background-color: var(--color-info-bg);
    border-color: var(--color-info-border);
    color: var(--color-info-hover);
}

.alert-warning {
    background-color: var(--color-warning-bg);
    border-color: var(--color-warning-border);
    color: #8A6A2A;
}

.alert-danger {
    background-color: var(--color-danger-bg);
    border-color: var(--color-danger-border);
    color: var(--color-danger-hover);
}

/* Метки и бейджи */
.label-default,
.badge {
    background-color: var(--color-brand);
    border-radius: 999px;
    font-weight: 600;
}

.label-primary { background-color: var(--color-accent); }
.label-success { background-color: var(--color-success); }
.label-info { background-color: var(--color-info); }
.label-warning { background-color: var(--color-warning); }
.label-danger { background-color: var(--color-danger); }

.badge {
    background-color: var(--color-accent);
}

/* Текстовые утилиты */
.text-primary { color: var(--color-accent) !important; }
.text-success { color: var(--color-success) !important; }
.text-info { color: var(--color-info) !important; }
.text-warning { color: var(--color-warning-hover) !important; }
.text-danger { color: var(--color-danger) !important; }
.text-muted { color: var(--color-text-muted) !important; }

.bg-primary { background-color: var(--color-brand-dark) !important; }
.bg-success { background-color: var(--color-success) !important; }
.bg-info { background-color: var(--color-info) !important; }
.bg-warning { background-color: var(--color-warning) !important; }
.bg-danger { background-color: var(--color-danger) !important; }

/* Таблицы */
.table {
    color: var(--color-text);
}

.table > thead > tr > th {
    border-bottom-color: var(--color-border);
    color: var(--color-text);
    font-weight: 600;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th {
    border-top-color: var(--color-border);
}

.table-bordered {
    border-color: var(--color-border);
}

.table-bordered > thead > tr > th,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > tbody > tr > td,
.table-bordered > tfoot > tr > td {
    border-color: var(--color-border);
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #FAFAF8;
}

.table-hover > tbody > tr:hover {
    background-color: rgba(var(--color-accent-rgb), 0.06);
}

/* Прогресс */
.progress {
    background-color: var(--color-bg);
    border-radius: var(--radius-sm);
    box-shadow: none;
    height: 22px;
}

.progress-bar {
    background-color: var(--color-accent);
    box-shadow: none;
    line-height: 22px;
}

.progress-bar-success { background-color: var(--color-success); }
.progress-bar-info { background-color: var(--color-info); }
.progress-bar-warning { background-color: var(--color-warning); }
.progress-bar-danger { background-color: var(--color-danger); }

/* Списки */
.list-group {
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
}

.list-group-item {
    border-color: var(--color-border);
    color: var(--color-text);
    background: var(--color-surface);
}

.list-group-item:first-child {
    border-top-left-radius: var(--radius-md);
    border-top-right-radius: var(--radius-md);
}

.list-group-item:last-child {
    border-bottom-left-radius: var(--radius-md);
    border-bottom-right-radius: var(--radius-md);
}

/* Wells */
.well {
    background: var(--color-surface);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    box-shadow: var(--shadow-sm);
    color: var(--color-text);
}

/* Модальные окна Bootstrap */
.modal-content {
    border-radius: var(--radius-md);
    border: 1px solid var(--color-border);
    box-shadow: var(--shadow-md);
}

.modal-header {
    background: var(--color-bg);
    border-bottom: 1px solid var(--color-border);
    border-radius: var(--radius-md) var(--radius-md) 0 0;
}

.modal-title {
    color: var(--color-text);
    font-weight: 600;
}

.modal-footer {
    background: var(--color-bg);
    border-top: 1px solid var(--color-border);
    border-radius: 0 0 var(--radius-md) var(--radius-md);
}

.modal-body {
    color: var(--color-text);
}

.close {
    color: var(--color-text-muted);
    opacity: 0.7;
    text-shadow: none;
}

.close:hover,
.close:focus {
    color: var(--color-text);
    opacity: 1;
}

/* Navbar toggle */
.navbar-inverse .navbar-toggle {
    border-color: rgba(255, 255, 255, 0.25);
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
    background-color: rgba(255, 255, 255, 0.1);
}

.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
    border-color: rgba(255, 255, 255, 0.12);
}

.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover,
.navbar-inverse .navbar-nav > .open > a:focus {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--color-nav-text);
}

/* Pagination */
.pagination > li > a,
.pagination > li > span {
    color: var(--color-text);
    border-color: var(--color-border);
    background: var(--color-surface);
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    color: var(--color-accent);
    border-color: var(--color-border-accent);
    background: var(--color-bg);
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
    color: #fff;
}

/* Dropdown */
.dropdown-menu {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-md);
}

.dropdown-menu > li > a {
    color: var(--color-text);
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: rgba(var(--color-accent-rgb), 0.08);
    color: var(--color-text);
}

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
    background-color: var(--color-accent);
    color: #fff;
}