/* ============================================ */
/*   ALTERNATOR.GE — DARK BLUE THEME OVERRIDE   */
/*   Перекрашивает существующий шаблон в       */
/*   тёмно-синюю тему. Подключается ПОСЛЕДНИМ. */
/* ============================================ */

:root {
    --brand-red: #00a8ff !important;
    --accent: #00a8ff;
    --accent-hover: #33bbff;
    --accent-glow: rgba(0, 168, 255, 0.4);
    --bg-primary: #0a0a0a;
    --bg-secondary: #121212;
    --bg-card: #1a1a1a;
    --bg-tertiary: #0f0f0f;
    --text-primary: #ffffff;
    --text-secondary: #b8b8b8;
    --text-muted: #6a6a6a;
    --border-dark: #2a2a2a;
}

/* ============================================ */
/*   BASE                                       */
/* ============================================ */
html, body {
    background: var(--bg-primary) !important;
    color: var(--text-primary) !important;
}

body, p, span, div, li, td, th, label {
    color: var(--text-primary);
}

a {
    color: var(--accent);
}
a:hover {
    color: var(--accent-hover);
}

/* ============================================ */
/*   HEADER                                     */
/* ============================================ */
.main__header,
.header__sticky,
.main__header.header__sticky {
    background: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-dark) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}

.main__logo--link img,
.main__logo--img {
    filter: brightness(1.2);
}

.offcanvas__header--menu__open--btn {
    color: var(--text-primary);
}
.offcanvas__header--menu__open--btn svg {
    fill: var(--text-primary);
    stroke: var(--text-primary);
}

/* ============================================ */
/*   MAIN CONTENT BG                            */
/* ============================================ */
.main__content_wrapper,
.shop__section,
.section--padding {
    background: var(--bg-primary) !important;
}

.shop__section .container {
    background: transparent;
}

/* ============================================ */
/*   PRODUCT CARDS — DARK BLUE                  */
/*   (overrides shortstory.tpl inline styles)   */
/* ============================================ */
.product__card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.product__card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--accent), transparent);
    transform: scaleX(0);
    transition: transform 0.3s ease;
    z-index: 2;
}

.product__card:hover {
    border-color: var(--accent) !important;
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px var(--accent);
}

.product__card:hover::before {
    transform: scaleX(1);
}

.product__card--thumbnail {
    background:
        radial-gradient(circle at center, rgba(0, 168, 255, 0.05), transparent 70%),
        var(--bg-tertiary) !important;
    padding: 15px;
}

.product_card--thumbnail_img {
    filter: drop-shadow(0 8px 20px rgba(0, 0, 0, 0.5));
    transition: transform 0.4s ease;
}

.product__card:hover .product_card--thumbnail_img {
    transform: scale(1.05);
}

.product__card--content {
    background: var(--bg-card) !important;
}

.product__card--title {
    color: var(--text-primary) !important;
    font-weight: 700 !important;
}

.product__meta-list {
    background: var(--bg-tertiary) !important;
    border-left: 3px solid var(--accent) !important;
}

.meta__label {
    color: var(--text-muted) !important;
}

.meta__value {
    color: var(--text-primary) !important;
}

.restored-box {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-dark) !important;
}

.restored-usage {
    color: var(--text-secondary) !important;
    border-top: 1px solid var(--border-dark) !important;
}

.restored-usage strong {
    color: var(--text-primary) !important;
}

/* ============================================ */
/*   PRODUCT DETAILS PAGE                       */
/* ============================================ */
.product__details--section,
.product__details--media,
.product__details--info {
    background: transparent !important;
}

.product__details--info__title {
    color: var(--text-primary) !important;
}

.single__product--preview,
.product__media--preview__items,
.swiper-slide {
    background: var(--bg-card) !important;
    border-radius: 12px;
}

.product__media--preview__items--img {
    filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.5));
}

.product__media--nav__items {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
    border-radius: 8px;
}

.swiper-slide-thumb-active .product__media--nav__items {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 2px rgba(0, 168, 255, 0.2);
}

#productPreview .swiper-button-next,
#productPreview .swiper-button-prev {
    color: var(--accent) !important;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    width: 40px;
    height: 40px;
}

/* ============================================ */
/*   SPEC TABLE (ag2-card)                      */
/* ============================================ */
.ag2-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

.ag2-head {
    background:
        linear-gradient(180deg, rgba(0, 168, 255, 0.15), transparent) !important;
    border-bottom: 1px solid var(--border-dark) !important;
}

.ag2-title {
    color: var(--accent) !important;
}

.ag2-sub {
    color: var(--text-muted) !important;
}

.ag2-underline {
    background: var(--accent) !important;
    box-shadow: 0 0 12px var(--accent-glow);
}

.ag2-specs {
    background: var(--bg-tertiary) !important;
    border-color: var(--border-dark) !important;
}

.ag2-key {
    background: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    border-bottom-color: var(--border-dark) !important;
}

.ag2-key::before {
    background: var(--accent) !important;
}

.ag2-val {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
    border-bottom-color: var(--border-dark) !important;
}

.ag2-highlight {
    color: var(--accent) !important;
}

@media (max-width: 700px) {
    .ag2-row {
        background: var(--bg-card) !important;
        border-color: var(--border-dark) !important;
    }
}

/* ============================================ */
/*   ACCORDION (for-car1.tpl)                   */
/* ============================================ */
.ag-acc__toggle {
    background: var(--accent) !important;
    color: #fff !important;
    box-shadow: 0 4px 16px var(--accent-glow);
}

.ag-acc__toggle:hover {
    background: var(--accent-hover) !important;
}

.ag-acc__body {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
}

.ag-acc__link {
    color: var(--text-secondary) !important;
    border-bottom: 1px solid var(--border-dark) !important;
}

.ag-acc__link::before {
    color: var(--accent) !important;
}

.ag-acc__link:hover {
    color: var(--accent) !important;
    border-bottom-color: var(--accent) !important;
}

/* ============================================ */
/*   COMPONENTS WIDGET (alt-menu.tpl)           */
/* ============================================ */
.offcanvas__filter--sidebar__inner .single__widget.widget__bg {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    background-image:
        linear-gradient(180deg, rgba(0, 168, 255, 0.1), transparent) !important;
}

.offcanvas__filter--sidebar__inner .widget__title.h3 {
    color: var(--accent) !important;
}

.offcanvas__filter--sidebar__inner .widget__title.h3::after {
    background: var(--accent) !important;
}

.offcanvas__filter--sidebar__inner .widget__categories--menu > li {
    background: var(--bg-tertiary) !important;
    border: 1px solid var(--border-dark) !important;
}

.offcanvas__filter--sidebar__inner .widget__categories--menu > li:hover {
    border-color: var(--accent) !important;
    box-shadow: 0 4px 12px rgba(0, 168, 255, 0.2);
}

.offcanvas__filter--sidebar__inner .widget__categories--menu a {
    color: var(--text-primary) !important;
}

.offcanvas__filter--sidebar__inner .widget__categories--menu li ul {
    background: var(--bg-secondary) !important;
    border-top-color: var(--border-dark) !important;
}

/* ============================================ */
/*   SEARCH                                     */
/* ============================================ */
.search-form,
.search__input,
input[name="story"],
input[type="search"],
input[type="text"] {
    background: var(--bg-tertiary) !important;
    border: 1px solid var(--border-dark) !important;
    color: var(--text-primary) !important;
}

input[type="text"]:focus,
input[type="search"]:focus,
input[name="story"]:focus {
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 3px rgba(0, 168, 255, 0.15) !important;
}

input::placeholder {
    color: var(--text-muted) !important;
}

/* ============================================ */
/*   TRUST ICONS                                */
/* ============================================ */
.ag-trust-icons {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
}

.ag-trust-item {
    color: var(--text-primary) !important;
}

.ag-trust-item svg {
    color: var(--accent) !important;
}

/* ============================================ */
/*   SECTION HEADINGS                           */
/* ============================================ */
.section__heading--maintitle,
.section__heading h2,
h1, h2, h3, h4, h5, h6 {
    color: var(--text-primary) !important;
}

.section__heading.border-bottom {
    border-bottom-color: var(--border-dark) !important;
}

/* ============================================ */
/*   FOOTER                                     */
/* ============================================ */
.footer__section {
    background: #050505 !important;
    border-top: 1px solid var(--border-dark) !important;
}

.footer__title--mini,
.footer__widget--title {
    color: var(--text-primary) !important;
}

.footer__title--mini span[style*="e31e24"],
.footer__title--mini span[style*="c41212"] {
    color: var(--accent) !important;
}

.footer__pc-info {
    color: var(--text-secondary) !important;
}

.footer__pc-info a {
    color: var(--text-primary) !important;
}

.footer__pc-info a:hover {
    color: var(--accent) !important;
}

.copyright__content {
    color: var(--text-muted) !important;
}

/* Override the inline style "color:#e31e24" in the footer ALTERNATOR GEORGIA */
.footer__title--mini span[style] {
    color: var(--accent) !important;
}

/* ============================================ */
/*   SCROLL TO TOP                              */
/* ============================================ */
#scroll__top {
    background: var(--accent) !important;
    box-shadow: 0 8px 24px var(--accent-glow) !important;
}

#scroll__top:hover {
    background: var(--accent-hover) !important;
}

/* ============================================ */
/*   MOBILE BUTTONS (m-btn)                     */
/* ============================================ */
.m-ph {
    background-color: var(--accent) !important;
}

.m-wa {
    background-color: #25D366 !important;
}

/* ============================================ */
/*   MOBILE CONTACT BLOCK                       */
/* ============================================ */
.mobile-contact-block {
    border-top-color: var(--border-dark) !important;
}

/* ============================================ */
/*   SLIDER / BANNER (.ban)                     */
/* ============================================ */
.ban {
    background: var(--bg-secondary) !important;
}

/* ============================================ */
/*   NEWS / BLOG CARDS                          */
/* ============================================ */
.blog__card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
}

.blog__card--title a,
.blog__card--btn__link {
    color: var(--text-primary) !important;
}

.blog__card--title a:hover {
    color: var(--accent) !important;
}

/* ============================================ */
/*   AG-HERO (Black/Red banner)                 */
/* ============================================ */
.ag-hero {
    background: linear-gradient(135deg, #0a0a0a 0%, #050505 100%) !important;
}

.ag-hero .brand .red {
    color: var(--accent) !important;
}

/* ============================================ */
/*   COMMON UI ELEMENTS                         */
/* ============================================ */

/* Buttons - red brand color → blue */
.btn-primary,
.button--primary,
[class*="btn"][style*="c41212"],
[class*="btn"][style*="d00000"] {
    background-color: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}

.btn-primary:hover {
    background-color: var(--accent-hover) !important;
    border-color: var(--accent-hover) !important;
}

/* Bootstrap form controls */
.form-control,
input.form-control,
select.form-control,
textarea.form-control {
    background: var(--bg-tertiary) !important;
    border: 1px solid var(--border-dark) !important;
    color: var(--text-primary) !important;
}

.form-control:focus {
    background: var(--bg-tertiary) !important;
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 3px rgba(0, 168, 255, 0.15) !important;
    color: var(--text-primary) !important;
}

/* Tables */
table {
    background: var(--bg-card) !important;
    color: var(--text-primary) !important;
}

table th,
table td {
    border-color: var(--border-dark) !important;
    background: var(--bg-card) !important;
}

table thead th {
    background: var(--bg-secondary) !important;
    color: var(--accent) !important;
}

/* Pagination */
.pagination .page-link,
.pagination a,
.pagination span {
    background: var(--bg-card) !important;
    border-color: var(--border-dark) !important;
    color: var(--text-secondary) !important;
}

.pagination a:hover {
    background: var(--bg-secondary) !important;
    border-color: var(--accent) !important;
    color: var(--accent) !important;
}

.pagination .active .page-link,
.pagination .active span {
    background: var(--accent) !important;
    border-color: var(--accent) !important;
    color: #fff !important;
}

/* Breadcrumbs */
.breadcrumb {
    background: var(--bg-card) !important;
    border: 1px solid var(--border-dark) !important;
}

.breadcrumb-item,
.breadcrumb a {
    color: var(--text-secondary) !important;
}

.breadcrumb-item.active,
.breadcrumb-item + .breadcrumb-item::before {
    color: var(--text-muted) !important;
}

/* ============================================ */
/*   OFFCANVAS / DRAWER                         */
/* ============================================ */
.offcanvas__inner,
.offcanvas__header,
.offcanvas__body {
    background: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

.offcanvas__menu--list a {
    color: var(--text-primary) !important;
}

.offcanvas__menu--list a:hover {
    color: var(--accent) !important;
}

/* ============================================ */
/*   CATEGORY/TOP MENUS                         */
/* ============================================ */
.ag-cat-phone,
.lower-cat-phone,
.lower-search-phone,
.top-cat-pc-1,
.top-cat-pc,
.top-cat-phone {
    background: var(--bg-secondary) !important;
}

/* SVG icon colors */
svg[stroke*="c41212"],
svg[fill*="c41212"],
svg[stroke*="#c41212"],
svg[fill*="#c41212"] {
    stroke: var(--accent) !important;
    fill: var(--accent) !important;
}

/* ============================================ */
/*   SCROLLBAR (Webkit)                         */
/* ============================================ */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: var(--bg-primary);
}

::-webkit-scrollbar-thumb {
    background: var(--bg-card);
    border-radius: 5px;
    border: 2px solid var(--bg-primary);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--accent);
}

/* ============================================ */
/*   SELECTION                                  */
/* ============================================ */
::selection {
    background: var(--accent);
    color: #fff;
}

/* ============================================ */
/*   ENSURE BG DARK ON HTML/BODY ROOT           */
/* ============================================ */
html { background: #0a0a0a !important; }
body { background: #0a0a0a !important; }