:root {
    --primary: #1769c2;
    --accent: #57a5ec;
    --primary-dark: color-mix(in srgb, var(--primary) 72%, #000);
    --primary-soft: color-mix(in srgb, var(--primary) 10%, #fff);
    --dark: var(--primary-dark);
    --soft: #edf6ff;
    --text: #26384b;
    --blue: var(--primary);
    --bs-primary: var(--primary);
    --bs-primary-rgb: 23, 105, 194;
    --bs-link-color: var(--primary);
    --bs-link-hover-color: var(--primary-dark);
}

body {
    color: var(--text);
    background: #f3f8fd;
}

.top-strip {
    color: #eaf4ff;
    background: linear-gradient(100deg, var(--primary-dark), var(--primary));
}

.navbar {
    --bs-navbar-hover-color: var(--primary);
}

.navbar-nav .nav-link,
.quick-cats-scroll a {
    font-weight: 700;
}

.compare-icon {
    min-width: 2rem;
    font-size: 1.1rem;
    line-height: 1.2;
}

.compare-table th {
    min-width: 130px;
    background: #f7fbff;
}

.compare-product-image {
    display: block;
    width: 110px;
    height: 110px;
    object-fit: contain;
    margin: 0 auto .5rem;
}

.product-admin-image {
    height: 100%;
    padding: .75rem;
    border: 1px solid #e1ebf5;
    border-radius: 12px;
}

.product-admin-image > img {
    width: 100%;
    height: 160px;
    object-fit: contain;
    background: #f7fbff;
    border-radius: 8px;
}

.brand-logo {
    color: var(--primary) !important;
}

.brand-logo::before {
    background: var(--primary);
    box-shadow: 8px -9px 0 -1px var(--primary), 8px 9px 0 -1px var(--primary);
}

.search-box .form-control:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--primary) 15%, transparent);
}

.btn-primary {
    --bs-btn-bg: var(--primary);
    --bs-btn-border-color: var(--primary);
    --bs-btn-hover-bg: var(--primary-dark);
    --bs-btn-hover-border-color: var(--primary-dark);
    --bs-btn-active-bg: var(--primary-dark);
    --bs-btn-active-border-color: var(--primary-dark);
    --bs-btn-disabled-bg: var(--primary);
    --bs-btn-disabled-border-color: var(--primary);
    --bs-btn-color: #fff;
    --bs-btn-hover-color: #fff;
    font-weight: 700;
}

.btn-outline-primary {
    --bs-btn-color: var(--primary);
    --bs-btn-border-color: var(--primary);
    --bs-btn-hover-bg: var(--primary);
    --bs-btn-hover-border-color: var(--primary);
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: var(--primary-dark);
    --bs-btn-active-border-color: var(--primary-dark);
}

.quick-cats-scroll a {
    color: #234b70;
    background: #edf6ff;
}

.quick-cats-scroll a:hover,
.filter-link.active,
.filter-link:hover,
.account-nav a.active,
.account-nav a:hover {
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-color: color-mix(in srgb, var(--primary) 28%, #fff);
}

.hero-home,
.auth-shell {
    background: radial-gradient(circle at 84% 20%, #d8ebff 0, transparent 31%), linear-gradient(135deg, #eaf5ff, #fff 55%, #f2f8ff);
}

.seller-register-card {
    width: min(100% - 2rem, 760px);
}

.seller-contract {
    max-height: 360px;
    overflow-y: auto;
    padding: 1rem;
    border: 1px solid #dce8f4;
    border-radius: 12px;
    background: #f7fbff;
}

.seller-contract ol {
    padding-right: 1.25rem;
    line-height: 1.9;
}

.hero h1 span,
.section-head span,
.page-heading span,
.admin-head span,
.account-head span,
.section-head > a {
    color: var(--primary);
}

.hero-badge {
    color: var(--primary-dark);
    background: #dceeff;
}

.hero-visual {
    background: linear-gradient(145deg, #fff, #e6f2ff);
}

.hero-circle,
.category-icon {
    background: linear-gradient(145deg, #fff, #dceeff);
}

.category-card,
.product-card,
.filter-box,
.content-card,
.summary-card,
.stat-card {
    border: 1px solid #e1ebf5;
    box-shadow: 0 5px 20px #174b7810;
}

.category-card:hover,
.product-card:hover {
    box-shadow: 0 14px 32px #174b781c;
}

.promo-project,
.promo-retail {
    background: linear-gradient(125deg, var(--primary-dark), var(--primary));
}

.promo-security {
    background: linear-gradient(125deg, var(--primary-dark), var(--accent));
}

.product-card {
    border-radius: 16px;
}

.product-image {
    background: linear-gradient(145deg, #f4f9ff, #fff);
}

.product-title:hover,
.detail-tabs .nav-link.active {
    color: var(--primary);
}

.main-product-image,
.trust-box {
    border-color: #dce8f4;
    background: #f7fbff;
}

.success-icon,
.auth-icon {
    color: #14599c;
    background: #dceeff;
}

.footer {
    background: #10304f;
    border-top: 4px solid var(--accent);
}

.store-about-summary,
.store-about-text {
    white-space: pre-line;
}

.enamad-placeholder > span,
.enamad-mark {
    color: #14599c !important;
    border-color: #9bc7ef !important;
}

.info-hero {
    background: linear-gradient(125deg, var(--primary-dark), var(--accent));
    border-bottom: 4px solid var(--accent);
}

.pagination {
    --bs-pagination-color: var(--primary);
    --bs-pagination-hover-color: var(--primary-dark);
    --bs-pagination-hover-bg: #eaf4ff;
    --bs-pagination-focus-box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--primary) 15%, transparent);
    --bs-pagination-active-bg: var(--primary);
    --bs-pagination-active-border-color: var(--primary);
    --bs-pagination-active-color: #fff;
}

.catalog-card {
    border-color: #dce8f4;
    box-shadow: 0 5px 20px #174b7810;
}

.catalog-card > span {
    color: var(--primary);
}

.checkout-note,
.order-status-note,
.operation-note {
    border-color: #b9d8f5;
    background: #edf6ff;
    color: #244766;
}

.home-color-panel {
    background: linear-gradient(125deg, var(--primary-dark), var(--accent));
    box-shadow: 0 24px 55px color-mix(in srgb, var(--primary) 18%, transparent);
}

.home-color-panel h1 {
    text-wrap: balance;
}

.home-color-blocks span:nth-child(3) {
    background: var(--primary-dark);
}

.home-hero-actions .btn-light {
    color: var(--primary-dark);
}

.product-pricing .badge.bg-danger {
    background-color: var(--primary) !important;
}

.site-version {
    position: fixed;
    left: 8px;
    bottom: 8px;
    z-index: 1030;
    padding: 2px 5px;
    border: 1px solid rgba(38, 56, 75, .15);
    border-radius: 4px;
    background: rgba(255, 255, 255, .8);
    color: #526477;
    font: 10px/1.2 sans-serif;
    opacity: .7;
}

.inventory-product-selector {
    position: sticky;
    top: 1rem;
}

.inventory-product-selector-list {
    display: grid;
    gap: .5rem;
    max-height: 70vh;
    overflow-y: auto;
}

.inventory-product-selector-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .5rem;
    border: 1px solid #e1ebf5;
    border-radius: 10px;
    color: var(--text);
    text-decoration: none;
}

.inventory-product-selector-item:hover,
.inventory-product-selector-item.is-current {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.inventory-product-selector-item img,
.inventory-product-selector-placeholder {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    border-radius: 7px;
    object-fit: contain;
    background: #fff;
}

.inventory-product-selector-placeholder {
    display: grid;
    place-items: center;
    color: #657789;
    font-size: .6rem;
    text-align: center;
}

.inventory-product-selector-details {
    display: grid;
    min-width: 0;
    gap: .12rem;
}

.inventory-product-selector-details strong,
.inventory-product-selector-details small {
    overflow: hidden;
    text-overflow: ellipsis;
}

.inventory-product-selector-details strong {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.inventory-product-selector-details small {
    color: #657789;
}

:focus-visible {
    outline: 3px solid var(--accent) !important;
    outline-offset: 3px;
}

@media (max-width: 767px) {
    .home-color-panel {
        box-shadow: 0 12px 32px color-mix(in srgb, var(--primary) 12%, transparent);
    }
}
