/* 
 * Custom theme classes for volib.com.ua
 * This file contains custom CSS classes that override or extend UIKit
 * Loaded after all other CSS files
 */

/* ========================================================================
   Custom Fonts - @font-face Declarations
 ========================================================================== */

/* 
 * Пример подключения кастомных шрифтов из папки /fonts/
 * Раскомментируйте и настройте под ваши шрифты
 */

/* 
   Пример 1: Подключение одного шрифта с разными начертаниями
   
   @font-face {
       font-family: 'CustomSans';
       src: url('/fonts/CustomSans-Regular.woff2') format('woff2'),
            url('/fonts/CustomSans-Regular.woff') format('woff');
       font-weight: 400;
       font-style: normal;
       font-display: swap;
   }
   
   @font-face {
       font-family: 'CustomSans';
       src: url('/fonts/CustomSans-Bold.woff2') format('woff2'),
            url('/fonts/CustomSans-Bold.woff') format('woff');
       font-weight: 700;
       font-style: normal;
       font-display: swap;
   }
   
   @font-face {
       font-family: 'CustomSans';
       src: url('/fonts/CustomSans-Italic.woff2') format('woff2'),
            url('/fonts/CustomSans-Italic.woff') format('woff');
       font-weight: 400;
       font-style: italic;
       font-display: swap;
   }
*/

/* 
   Пример 2: Подключение шрифта для заголовков
   
   @font-face {
       font-family: 'DisplayFont';
       src: url('/fonts/DisplayFont-Bold.woff2') format('woff2'),
            url('/fonts/DisplayFont-Bold.woff') format('woff');
       font-weight: 700;
       font-style: normal;
       font-display: swap;
   }
*/

/* 
   Пример 3: Подключение Variable Font (современный формат)
   
   @font-face {
       font-family: 'InterVariable';
       src: url('/fonts/Inter-Variable.woff2') format('woff2-variations');
       font-weight: 100 900;
       font-style: normal;
       font-display: swap;
   }
*/

/* 
   После подключения используйте шрифты в переменных ниже:
   
   :root {
       --theme-font-family-heading: 'DisplayFont', sans-serif;
       --theme-font-family-body: 'CustomSans', -apple-system, sans-serif;
   }
*/

/* cuprum-regular - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: italic;
  font-weight: 400;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-500 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-500italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: italic;
  font-weight: 500;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-600 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-600italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: italic;
  font-weight: 600;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-700 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* cuprum-700italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cuprum';
  font-style: italic;
  font-weight: 700;
  src: url('/fonts/cuprum-v29-cyrillic_cyrillic-ext_latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* geologica-100 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 100;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-100.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-200 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 200;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-300 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-regular - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-500 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-600 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-700 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-800 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 800;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* geologica-900 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Geologica';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/geologica-v5-cyrillic_cyrillic-ext_latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* literata-200 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 200;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-200italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 200;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-200italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-300 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-300italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 300;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-regular - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 400;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-500 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-500italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 500;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-600 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-600italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 600;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-700 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-700italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 700;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-800 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 800;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-800italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 800;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-900 - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: normal;
  font-weight: 900;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* literata-900italic - cyrillic_cyrillic-ext_latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Literata';
  font-style: italic;
  font-weight: 900;
  src: url('/fonts/literata-v40-cyrillic_cyrillic-ext_latin_latin-ext-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* ========================================================================
   CSS Variables - Theme Colors
 ========================================================================== */
:root {
    /* Primary colors */
    --theme-primary: #1e87f0;
    --theme-primary-hover: #0f7ae5;
    --theme-primary-active: #0e6dcd;
    
    /* Success */
    --theme-success: #32d296;
    --theme-success-hover: #2ec487;
    --theme-success-active: #29b378;
    
    /* Warning */
    --theme-warning: #faa05a;
    --theme-warning-hover: #f98f43;
    --theme-warning-active: #f77f2c;
    
    /* Danger */
    --theme-danger: #f0506e;
    --theme-danger-hover: #ee395b;
    --theme-danger-active: #ec2149;
    
    /* Text colors */
    --theme-text-primary: #333;
    --theme-text-secondary: #666;
    --theme-text-muted: #999;
    
    /* Background colors */
    --theme-bg-default: #fff;
    --theme-bg-muted: #f8f8f8;
    --theme-bg-primary: #1e87f0;
    --theme-bg-secondary: #222;
    
    /* Border colors */
    --theme-border-default: #e5e5e5;
    
    /* Link colors */
    --theme-link-color: #1e87f0;
    --theme-link-hover: #0f7ae5;
    --theme-link-heading: #e94539;
    
    /* Header/Navbar colors */
    --theme-header-link-color: var(--theme-text-muted);
    --theme-header-link-hover-color: var(--theme-text-secondary);
    --theme-header-link-active-color: var(--theme-text-primary);
    --theme-header-bg-color: hsl(45, 46%, 90%);
    
    /* ========================================================================
       Typography - Font Families
     ========================================================================== */
    
    /* === Base Font Stacks === */
    
    /* Primary font stack (system fonts for best performance) */
    --theme-font-family: Literata, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    
    /* Monospace font for code */
    --theme-font-family-mono: Consolas, monaco, monospace;
    
    /* === Zone-Specific Font Families === */
    
    /* Header (шапка сайта - navbar, меню, мобильное меню) */
    --theme-font-family-header: Cuprum, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    
    /* Footer (подвал сайта) */
    --theme-font-family-footer: var(--theme-font-family-header);
    
    /* Sidebar (боковая панель, виджеты) */
    --theme-font-family-sidebar: var(--theme-font-family-header);
    
    /* Headings (все заголовки H1-H6) */
    --theme-font-family-heading: Geologica, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    
    /* Body (основной текст контента страницы) */
    --theme-font-family-body: var(--theme-font-family);
    
    /* ========================================================================
       Typography - Zone-Specific Properties
     ========================================================================== */
    
    /* === HEADER ZONE (Шапка: navbar, меню, мобильное меню) === */
    --theme-header-font-size: 1.5rem;
    --theme-header-font-weight: var(--theme-font-weight-normal);
    --theme-header-line-height: 1.5;
    --theme-header-letter-spacing: 0.05em;
    --theme-header-text-transform: none;
    
    /* === FOOTER ZONE (Подвал сайта) === */
    --theme-footer-font-size: 1rem;
    --theme-footer-font-weight: var(--theme-font-weight-normal);
    --theme-footer-line-height: 1.6;
    --theme-footer-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-footer-text-transform: none;
    
    /* Footer headings */
    --theme-footer-heading-font-size: 1rem;          /* 16px */
    --theme-footer-heading-font-weight: var(--theme-font-weight-semibold);
    --theme-footer-heading-text-transform: uppercase;
    --theme-footer-heading-letter-spacing: 0.05em;
    
    /* === SIDEBAR ZONE (Боковая панель, виджеты) === */
    --theme-sidebar-font-size: 0.875rem;             /* 14px */
    --theme-sidebar-font-weight: var(--theme-font-weight-normal);
    --theme-sidebar-line-height: 1.6;
    --theme-sidebar-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-sidebar-text-transform: none;
    
    /* Sidebar headings */
    --theme-sidebar-heading-font-size: 1.125rem;     /* 18px */
    --theme-sidebar-heading-font-weight: var(--theme-font-weight-semibold);
    --theme-sidebar-heading-text-transform: none;
    --theme-sidebar-heading-letter-spacing: var(--theme-letter-spacing-normal);
    
    /* === HEADINGS ZONE (Все заголовки H1-H6 в контенте) === */
    --theme-heading-font-weight: var(--theme-font-weight-bold);
    --theme-heading-letter-spacing: var(--theme-letter-spacing-tight);
    --theme-heading-text-transform: none;
    
    /* === BODY ZONE (Основной текст контента) === */
    --theme-body-font-size: 16px;
    --theme-body-font-weight: var(--theme-font-weight-normal);
    --theme-body-line-height: 1.6;
    --theme-body-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-body-text-transform: none;
    
    /* ========================================================================
       Typography - Font Sizes
     ========================================================================== */
    
    /* Base size */
    --theme-font-size-base: 16px;
    
    /* Headings - Mobile */
    --theme-font-size-h1: 2.4rem !important;  /* ~35.7px */
    --theme-font-size-h2: 2rem !important;      /* ~27.2px */
    --theme-font-size-h3: 1.8rem !important;      /* 24px */
    --theme-font-size-h4: 1.25rem;     /* 20px */
    --theme-font-size-h5: 16px;
    --theme-font-size-h6: 0.875rem;    /* ~14px */
    
    /* Headings - Tablet+ (≥960px) */
    --theme-font-size-h1-large: 2.625rem;  /* 42px */
    --theme-font-size-h2-large: 2rem;      /* 32px */
    
    /* Display sizes */
    --theme-font-size-small: 0.875rem;     /* 14px */
    --theme-font-size-large: 1.25rem;      /* 20px */
    --theme-font-size-xlarge: 2.625rem;    /* 42px */
    --theme-font-size-2xlarge: 3.25rem;    /* 52px */
    --theme-font-size-3xlarge: 4rem;       /* 64px */
    
    /* Hero sizes */
    --theme-font-size-hero: 2.6rem;        /* 41.6px */
    --theme-font-size-hero-medium: 2.8875rem;  /* ~46px */
    --theme-font-size-hero-large: 3.4rem;      /* ~54px */
    --theme-font-size-hero-xlarge: 4rem;       /* 64px */
    --theme-font-size-hero-2xlarge: 6rem;      /* 96px */
    --theme-font-size-hero-3xlarge: 8rem;      /* 128px */
    
    /* ========================================================================
       Typography - Line Heights
     ========================================================================== */
    
    /* Base line height */
    --theme-line-height-base: 1.5;
    
    /* Headings line heights */
    --theme-line-height-h1: 1.2;
    --theme-line-height-h2: 1.3;
    --theme-line-height-h3: 1.4;
    --theme-line-height-h4: 1.4;
    --theme-line-height-h5: 1.4;
    --theme-line-height-h6: 1.4;
    
    /* Display line heights */
    --theme-line-height-small: 1.5;
    --theme-line-height-large: 1.5;
    --theme-line-height-xlarge: 1.4;
    
    /* Hero line heights */
    --theme-line-height-hero: 1.1;
    --theme-line-height-hero-large: 1;
    
    /* ========================================================================
       Typography - Font Weights
     ========================================================================== */
    
    --theme-font-weight-light: 300;
    --theme-font-weight-normal: 400;
    --theme-font-weight-medium: 500;
    --theme-font-weight-semibold: 600;
    --theme-font-weight-bold: 700;
    --theme-font-weight-bolder: bolder;
    
    /* ========================================================================
       Typography - Letter Spacing
     ========================================================================== */
    
    --theme-letter-spacing-tight: -0.02em;
    --theme-letter-spacing-normal: 0;
    --theme-letter-spacing-wide: 0.05em;
    --theme-letter-spacing-wider: 0.1em;
    
    /* ========================================================================
       Typography - Component-Specific (Navbar, Menu, Buttons, etc.)
     ========================================================================== */
    
    /* === NAVBAR (Главное меню сайта) === */
    --theme-navbar-font-family: var(--theme-font-family-header);
    --theme-navbar-font-size: var(--theme-header-font-size);
    --theme-navbar-font-weight: var(--theme-header-font-weight);
    --theme-navbar-letter-spacing: var(--theme-header-letter-spacing);
    --theme-navbar-text-transform: var(--theme-header-text-transform);
    --theme-navbar-line-height: var(--theme-header-line-height);
    
    /* Navbar dropdown (подменю) */
    --theme-navbar-dropdown-font-family: var(--theme-font-family-header);
    --theme-navbar-dropdown-font-size: var(--theme-header-font-size);
    --theme-navbar-dropdown-font-weight: var(--theme-header-font-weight);
    --theme-navbar-dropdown-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-navbar-dropdown-text-transform: none;
    
    /* === NAV (Боковое меню, nav компонент) === */
    --theme-nav-font-family: var(--theme-font-family);
    --theme-nav-font-size: var(--theme-header-font-size);
    --theme-nav-font-weight: var(--theme-font-weight-normal);
    --theme-nav-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-nav-line-height: 1.5;
    
    /* Nav primary (крупное боковое меню) */
    --theme-nav-primary-font-size: 1.5rem;
    --theme-nav-primary-line-height: 1.5;
    
    /* Nav secondary (меню с фоном) */
    --theme-nav-secondary-font-size: 16px;
    --theme-nav-secondary-line-height: 1.5;
    
    /* === BUTTONS === */
    --theme-button-font-family: var(--theme-font-family);
    --theme-button-font-size: 0.875rem;
    --theme-button-font-weight: var(--theme-font-weight-normal);
    --theme-button-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-button-text-transform: uppercase;
    --theme-button-line-height: 1.5;
    
    /* Button small */
    --theme-button-small-font-size: 0.75rem;   /* 12px */
    
    /* Button large */
    --theme-button-large-font-size: 1rem;      /* 16px */
    
    /* === BREADCRUMB === */
    --theme-breadcrumb-font-family: var(--theme-font-family-header);
    --theme-breadcrumb-font-size: 1.3rem;
    --theme-breadcrumb-font-weight: var(--theme-font-weight-normal);
    --theme-breadcrumb-color: var(--theme-text-muted-color);
    
    /* === SUBNAV (подменю / табы) === */
    --theme-subnav-font-family: var(--theme-font-family);
    --theme-subnav-font-size: 0.875rem;
    --theme-subnav-font-weight: var(--theme-font-weight-normal);
    --theme-subnav-letter-spacing: var(--theme-letter-spacing-normal);
    --theme-subnav-text-transform: uppercase;
    
    /* === TAB (вкладки) === */
    --theme-tab-font-family: var(--theme-font-family);
    --theme-tab-font-size: 0.875rem;
    --theme-tab-font-weight: var(--theme-font-weight-normal);
    --theme-tab-letter-spacing: var(--theme-letter-spacing-normal);
    
    /* === LABELS & BADGES === */
    --theme-label-font-family: var(--theme-font-family);
    --theme-label-font-size: 0.6875rem;        /* 11px */
    --theme-label-font-weight: var(--theme-font-weight-normal);
    --theme-label-text-transform: uppercase;
    --theme-label-letter-spacing: var(--theme-letter-spacing-wide);
    
    --theme-badge-font-family: var(--theme-font-family);
    --theme-badge-font-size: 10px;
    --theme-badge-font-weight: var(--theme-font-weight-bold);
    
    /* === FORM ELEMENTS === */
    --theme-input-font-family: var(--theme-font-family);
    --theme-input-font-size: 0.875rem;
    --theme-input-font-weight: var(--theme-font-weight-normal);
    
    /* === TABLE === */
    --theme-table-font-family: var(--theme-font-family);
    --theme-table-font-size: 0.875rem;
    --theme-table-header-font-weight: var(--theme-font-weight-semibold);
    --theme-table-header-text-transform: uppercase;
    
    /* === ARTICLE / BLOG === */
    --theme-article-title-font-family: var(--theme-font-family);
    --theme-article-title-font-weight: var(--theme-font-weight-bold);
    --theme-article-meta-font-size: 0.75rem;   /* 12px */
    --theme-article-meta-font-weight: var(--theme-font-weight-normal);
    
    /* === CARD === */
    --theme-card-title-font-family: var(--theme-font-family);
    --theme-card-title-font-size: 1.25rem;
    --theme-card-title-font-weight: var(--theme-font-weight-semibold);
    
    /* === NOTIFICATION / ALERT === */
    --theme-notification-font-family: var(--theme-font-family);
    --theme-notification-font-size: 0.875rem;
    --theme-notification-font-weight: var(--theme-font-weight-normal);
}

/* ========================================================================
   ANTI-FOUC (Flash of Unstyled Content) - КРИТИЧНО ДЛЯ CLS
 ========================================================================== */

/* 1. Скрываем dropdown меню до инициализации UIKit */
.uk-navbar-dropdown:not(.uk-open) {
    display: none !important;
}

/* 2. Скрываем мобильное меню до клика */
#mobile-menu:not(.uk-open) {
    display: none !important;
}

/* 3. Предотвращаем скачки sticky navbar */
[uk-sticky] {
    transition: none !important;
}

[uk-sticky].uk-sticky-fixed {
    animation: none !important;
}

/* 4. Фиксируем высоту navbar чтобы не прыгал при sticky */
.uk-navbar-container {
    min-height: 80px;
}

/* 5. Скрываем nav до полной загрузки */
.uk-navbar-nav > li > a {
    visibility: visible;
}

/* 6. Предотвращаем показ подменю до hover/click */
.uk-navbar-nav > li > .uk-navbar-dropdown {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.uk-navbar-nav > li:hover > .uk-navbar-dropdown,
.uk-navbar-nav > li > a[aria-expanded="true"] + .uk-navbar-dropdown,
.uk-navbar-dropdown.uk-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: block !important;
}

/* 7. Резервируем пространство для dropdown чтобы не было layout shift */
.uk-navbar-dropdown-grid {
    min-height: 200px;
}

/* 8. Убираем анимацию и отступ сверху у dropdown */
.uk-navbar-dropdown {
    transition: none !important;
    animation: none !important;
    margin-top: 0 !important;
    top: 100% !important;
}

/* 9. Фиксируем мобильное меню */
.uk-dropbar {
    transition: none;
}

/* ========================================================================
   Color Overrides - UIKit Classes
 ========================================================================== */

/* Primary color overrides */
.uk-button-primary,
.uk-label-primary,
.uk-badge-primary,
.uk-alert-primary {
    background-color: var(--theme-primary) !important;
}

.uk-button-primary:hover {
    background-color: var(--theme-primary-hover) !important;
}

.uk-button-primary:active {
    background-color: var(--theme-primary-active) !important;
}

/* Success color overrides */
.uk-button-success,
.uk-label-success,
.uk-alert-success {
    background-color: var(--theme-success) !important;
}

.uk-button-success:hover {
    background-color: var(--theme-success-hover) !important;
}

/* Warning color overrides */
.uk-button-warning,
.uk-label-warning,
.uk-alert-warning {
    background-color: var(--theme-warning) !important;
}

.uk-button-warning:hover {
    background-color: var(--theme-warning-hover) !important;
}

/* Danger color overrides */
.uk-button-danger,
.uk-label-danger,
.uk-alert-danger {
    background-color: var(--theme-danger) !important;
}

.uk-button-danger:hover {
    background-color: var(--theme-danger-hover) !important;
}

/* Text color overrides */
.uk-text-primary {
    color: var(--theme-text-primary) !important;
}

.uk-text-secondary {
    color: var(--theme-text-secondary) !important;
}

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

/* Link color overrides */
a:not([class]),
.uk-link {
    color: var(--theme-link-color);
}

a:not([class]):hover,
.uk-link:hover {
    color: var(--theme-link-hover);
}

.uk-link-heading:hover {
    color: var(--theme-link-heading);
}

/* Border color overrides */
.uk-card-default,
.uk-section-default,
.uk-tile-default,
.uk-navbar-container:not(.uk-navbar-transparent) {
    border-color: var(--theme-border-default);
}

/* Background color overrides */
.uk-background-default {
    background-color: var(--theme-bg-default) !important;
}

.uk-background-muted {
    background-color: var(--theme-bg-muted) !important;
}

.uk-background-primary {
    background-color: var(--theme-bg-primary) !important;
}

.uk-background-secondary {
    background-color: var(--theme-bg-secondary) !important;
}

/* Navbar colors */
.uk-navbar-container:not(.uk-navbar-transparent) {
    background: var(--theme-header-bg-color);
}

.uk-navbar-nav > li > a {
    color: var(--theme-header-link-color);
}

.uk-navbar-nav > li:hover > a,
.uk-navbar-nav > li > a[aria-expanded="true"] {
    color: var(--theme-header-link-hover-color);
}

.uk-navbar-nav > li.uk-active > a {
    color: var(--theme-header-link-active-color);
}

/* Navbar dropdown background */
.uk-navbar-dropdown {
    background: var(--theme-header-bg-color);
}

/* ========================================================================
   Custom Classes
 ========================================================================== */

/* Header Cart Icon Styling */
.cart-icon-large {
    font-size: 1.8em !important;
}

.cart-count-inline {
    display: inline !important;
    font-size: 1.3em !important;
    vertical-align: super !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ========================================================================
   Typography Utility Classes
 ========================================================================== */

/* Font Family Utilities */
.theme-font-primary {
    font-family: var(--theme-font-family) !important;
}

.theme-font-mono {
    font-family: var(--theme-font-family-mono) !important;
}

/* Font Size Utilities */
.theme-text-small {
    font-size: var(--theme-font-size-small) !important;
}

.theme-text-base {
    font-size: var(--theme-font-size-base) !important;
}

.theme-text-large {
    font-size: var(--theme-font-size-large) !important;
}

.theme-text-xlarge {
    font-size: var(--theme-font-size-xlarge) !important;
}

.theme-text-2xlarge {
    font-size: var(--theme-font-size-2xlarge) !important;
}

.theme-text-3xlarge {
    font-size: var(--theme-font-size-3xlarge) !important;
}

/* Font Weight Utilities */
.theme-font-light {
    font-weight: var(--theme-font-weight-light) !important;
}

.theme-font-normal {
    font-weight: var(--theme-font-weight-normal) !important;
}

.theme-font-medium {
    font-weight: var(--theme-font-weight-medium) !important;
}

.theme-font-semibold {
    font-weight: var(--theme-font-weight-semibold) !important;
}

.theme-font-bold {
    font-weight: var(--theme-font-weight-bold) !important;
}

/* Line Height Utilities */
.theme-leading-tight {
    line-height: 1.2 !important;
}

.theme-leading-normal {
    line-height: var(--theme-line-height-base) !important;
}

.theme-leading-relaxed {
    line-height: 1.75 !important;
}

.theme-leading-loose {
    line-height: 2 !important;
}

/* Letter Spacing Utilities */
.theme-tracking-tight {
    letter-spacing: var(--theme-letter-spacing-tight) !important;
}

.theme-tracking-normal {
    letter-spacing: var(--theme-letter-spacing-normal) !important;
}

.theme-tracking-wide {
    letter-spacing: var(--theme-letter-spacing-wide) !important;
}

.theme-tracking-wider {
    letter-spacing: var(--theme-letter-spacing-wider) !important;
}

/* Text Transform Utilities */
.theme-uppercase {
    text-transform: uppercase !important;
}

.theme-lowercase {
    text-transform: lowercase !important;
}

.theme-capitalize {
    text-transform: capitalize !important;
}

.theme-normal-case {
    text-transform: none !important;
}

/* ========================================================================
   Typography Overrides - Apply variables to existing UIKit classes
 ========================================================================== */

/* Override body font */
body {
    font-family: var(--theme-font-family-body);
    font-size: var(--theme-body-font-size);
    line-height: var(--theme-body-line-height);
    font-weight: var(--theme-body-font-weight);
    letter-spacing: var(--theme-body-letter-spacing);
}

/* Override heading fonts */
h1, .uk-h1, .uk-heading-small {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h1);
    line-height: var(--theme-line-height-h1);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

h2, .uk-h2, .uk-heading-medium {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h2);
    line-height: var(--theme-line-height-h2);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

h3, .uk-h3 {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h3);
    line-height: var(--theme-line-height-h3);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

h4, .uk-h4 {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h4);
    line-height: var(--theme-line-height-h4);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

h5, .uk-h5 {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h5);
    line-height: var(--theme-line-height-h5);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

h6, .uk-h6 {
    font-family: var(--theme-font-family-heading);
    font-size: var(--theme-font-size-h6);
    line-height: var(--theme-line-height-h6);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
}

/* Responsive heading sizes - Tablet+ */
@media (min-width: 960px) {
    h1, .uk-h1, .uk-heading-small {
        font-size: var(--theme-font-size-h1-large);
    }
    
    h2, .uk-h2, .uk-heading-medium {
        font-size: var(--theme-font-size-h2-large);
    }
}

/* Override hero sizes */
.uk-heading-hero {
    font-size: var(--theme-font-size-hero);
    line-height: var(--theme-line-height-hero);
}

.uk-heading-xlarge {
    font-size: var(--theme-font-size-hero-xlarge);
    line-height: var(--theme-line-height-hero-large);
}

.uk-heading-2xlarge {
    font-size: var(--theme-font-size-hero-2xlarge);
    line-height: var(--theme-line-height-hero-large);
}

/* Override code fonts */
code,
kbd,
samp,
pre,
.uk-text-code {
    font-family: var(--theme-font-family-mono);
}

/* Override small text */
small,
.uk-text-small {
    font-size: var(--theme-font-size-small);
    line-height: var(--theme-line-height-small);
}

/* Override large text */
.uk-text-large {
    font-size: var(--theme-font-size-large);
    line-height: var(--theme-line-height-large);
}

/* Override lead text */
.uk-text-lead {
    font-size: var(--theme-font-size-large);
    line-height: var(--theme-line-height-large);
}

/* Override meta text */
.uk-text-meta {
    font-size: var(--theme-font-size-small);
    line-height: var(--theme-line-height-small);
}

/* ========================================================================
   Component-Specific Typography Overrides
 ========================================================================== */

/* === NAVBAR (Главное меню) === */
.uk-navbar-nav > li > a {
    font-family: var(--theme-navbar-font-family);
    font-size: var(--theme-navbar-font-size);
    font-weight: var(--theme-navbar-font-weight);
    letter-spacing: var(--theme-navbar-letter-spacing);
    text-transform: var(--theme-navbar-text-transform);
    line-height: var(--theme-navbar-line-height);
}

/* Navbar dropdown (выпадающее подменю) */
.uk-navbar-dropdown-nav,
.uk-navbar-dropdown-nav > li > a {
    font-family: var(--theme-navbar-dropdown-font-family) !important;
    font-size: var(--theme-navbar-dropdown-font-size);
    font-weight: var(--theme-navbar-dropdown-font-weight);
    letter-spacing: var(--theme-navbar-dropdown-letter-spacing);
    text-transform: var(--theme-navbar-dropdown-text-transform);
}

/* Navbar item & toggle */
.uk-navbar-item,
.uk-navbar-toggle {
    font-family: var(--theme-navbar-font-family);
    font-size: var(--theme-navbar-font-size);
}

/* Navbar item colors (user icon, cart, etc.) */
.uk-navbar-item {
    color: var(--theme-header-link-color);
}

.uk-navbar-item:hover {
    color: var(--theme-header-link-hover-color);
}

/* Active states for navbar items */
.uk-navbar-item .icon-cart3.active,
.uk-navbar-item .cart-count-inline.active {
    color: var(--theme-header-link-active-color) !important;
}

/* User icon in navbar */
.uk-navbar-item .icon-user168 {
    color: var(--theme-header-link-color) !important;
}

.uk-navbar-item:hover .icon-user168 {
    color: var(--theme-header-link-hover-color) !important;
}

/* Cart icon and count in navbar */
.uk-navbar-item .icon-cart3,
.uk-navbar-item .cart-count-inline {
    color: var(--theme-header-link-color) !important;
}

.uk-navbar-item:hover .icon-cart3,
.uk-navbar-item:hover .cart-count-inline {
    color: var(--theme-header-link-hover-color) !important;
}

/* Navbar dropdown с картинками (grid) - выравниваем размер текста с обычным dropdown */
.uk-navbar-dropdown-grid .uk-text-small {
    font-family: var(--theme-navbar-dropdown-font-family) !important;
    font-size: var(--theme-navbar-dropdown-font-size) !important;
    font-weight: var(--theme-navbar-dropdown-font-weight);
    letter-spacing: var(--theme-navbar-dropdown-letter-spacing);
}

/* Navbar dropdown - все элементы внутри должны наследовать шрифт header */
.uk-navbar-dropdown,
.uk-navbar-dropdown * {
    font-family: var(--theme-navbar-dropdown-font-family);
}

/* Language switcher in navbar - используем размер navbar */
.uk-navbar-item .uk-iconnav > li > a {
    font-family: var(--theme-navbar-font-family);
    font-size: var(--theme-navbar-font-size) !important;
    font-weight: var(--theme-navbar-font-weight);
    letter-spacing: var(--theme-navbar-letter-spacing);
    text-transform: var(--theme-navbar-text-transform);
    color: var(--theme-header-link-color);
}

.uk-navbar-item .uk-iconnav > li > a:hover {
    color: var(--theme-header-link-hover-color);
}

.uk-navbar-item .uk-iconnav > li.uk-active > a {
    color: var(--theme-header-link-active-color);
}

/* === NAV (Боковое меню) === */
.uk-nav,
.uk-nav > li > a {
    font-family: var(--theme-nav-font-family);
    font-size: var(--theme-nav-font-size);
    font-weight: var(--theme-nav-font-weight);
    letter-spacing: var(--theme-nav-letter-spacing);
    line-height: var(--theme-nav-line-height);
}

/* Nav primary */
.uk-nav-primary,
.uk-nav-primary > li > a {
    font-size: var(--theme-nav-primary-font-size);
    line-height: var(--theme-nav-primary-line-height);
}

/* Nav secondary */
.uk-nav-secondary,
.uk-nav-secondary > li > a {
    font-size: var(--theme-nav-secondary-font-size);
    line-height: var(--theme-nav-secondary-line-height);
}

/* === BUTTONS === */
.uk-button {
    font-family: var(--theme-button-font-family);
    font-size: var(--theme-button-font-size);
    font-weight: var(--theme-button-font-weight);
    letter-spacing: var(--theme-button-letter-spacing);
    text-transform: var(--theme-button-text-transform);
    line-height: var(--theme-button-line-height);
}

.uk-button-small {
    font-size: var(--theme-button-small-font-size);
}

.uk-button-large {
    font-size: var(--theme-button-large-font-size);
}

/* === BREADCRUMB === */
.uk-breadcrumb:not([class*="icon-"]):not([class*="fa-"]):not([class*="glyphicon-"]),
.uk-breadcrumb > * > *:not([class*="icon-"]):not([class*="fa-"]):not([class*="glyphicon-"]) {
    font-family: var(--theme-breadcrumb-font-family) !important;
    font-size: var(--theme-breadcrumb-font-size) !important;
    font-weight: var(--theme-breadcrumb-font-weight) !important;
    color: var(--theme-breadcrumb-color) !important;
}

/* Breadcrumb для мобильных устройств */
@media (max-width: 767px) {
    .breadcrumb:not([class*="icon-"]):not([class*="fa-"]):not([class*="glyphicon-"]),
    .breadcrumb > li > a:not([class*="icon-"]):not([class*="fa-"]):not([class*="glyphicon-"]),
    .breadcrumb > li > span:not([class*="icon-"]):not([class*="fa-"]):not([class*="glyphicon-"]) {
        font-family: var(--theme-breadcrumb-font-family) !important;
        font-size: var(--theme-breadcrumb-font-size) !important;
        font-weight: var(--theme-breadcrumb-font-weight) !important;
        color: var(--theme-breadcrumb-color) !important;
    }
}

/* === SUBNAV === */
.uk-subnav > * > :first-child {
    font-family: var(--theme-subnav-font-family);
    font-size: var(--theme-subnav-font-size);
    font-weight: var(--theme-subnav-font-weight);
    letter-spacing: var(--theme-subnav-letter-spacing);
    text-transform: var(--theme-subnav-text-transform);
}

/* === TAB === */
.uk-tab > * > a {
    font-family: var(--theme-tab-font-family);
    font-size: var(--theme-tab-font-size);
    font-weight: var(--theme-tab-font-weight);
    letter-spacing: var(--theme-tab-letter-spacing);
}

/* === LABELS & BADGES === */
.uk-label {
    font-family: var(--theme-label-font-family);
    font-size: var(--theme-label-font-size);
    font-weight: var(--theme-label-font-weight);
    text-transform: var(--theme-label-text-transform);
    letter-spacing: var(--theme-label-letter-spacing);
}

.uk-badge {
    font-family: var(--theme-badge-font-family);
    font-size: var(--theme-badge-font-size);
    font-weight: var(--theme-badge-font-weight);
}

/* === FORM ELEMENTS === */
.uk-input,
.uk-select,
.uk-textarea {
    font-family: var(--theme-input-font-family);
    font-size: var(--theme-input-font-size);
    font-weight: var(--theme-input-font-weight);
}

/* === TABLE === */
.uk-table {
    font-family: var(--theme-table-font-family);
    font-size: var(--theme-table-font-size);
}

.uk-table th {
    font-weight: var(--theme-table-header-font-weight);
    text-transform: var(--theme-table-header-text-transform);
}

/* === ARTICLE === */
.uk-article-title {
    font-family: var(--theme-article-title-font-family);
    font-weight: var(--theme-article-title-font-weight);
}

.uk-article-meta {
    font-size: var(--theme-article-meta-font-size);
    font-weight: var(--theme-article-meta-font-weight);
}

/* === CARD === */
.uk-card-title {
    font-family: var(--theme-card-title-font-family);
    font-size: var(--theme-card-title-font-size);
    font-weight: var(--theme-card-title-font-weight);
}

/* === NOTIFICATION / ALERT === */
.uk-notification-message,
.uk-alert {
    font-family: var(--theme-notification-font-family);
    font-size: var(--theme-notification-font-size);
    font-weight: var(--theme-notification-font-weight);
}

/* ========================================================================
   Zone-Specific Typography Classes
 ========================================================================== */

/* === HEADER ZONE === */
.theme-header,
.theme-header * {
    font-family: var(--theme-font-family-header) !important;
}

.theme-header-text {
    font-family: var(--theme-font-family-header);
    font-size: var(--theme-header-font-size);
    font-weight: var(--theme-header-font-weight);
    line-height: var(--theme-header-line-height);
    letter-spacing: var(--theme-header-letter-spacing);
    text-transform: var(--theme-header-text-transform);
}

/* === FOOTER ZONE === */
.theme-footer,
.theme-footer * {
    font-family: var(--theme-font-family-footer) !important;
}

.theme-footer-text {
    font-family: var(--theme-font-family-footer);
    font-size: var(--theme-footer-font-size);
    font-weight: var(--theme-footer-font-weight);
    line-height: var(--theme-footer-line-height);
    letter-spacing: var(--theme-footer-letter-spacing);
    text-transform: var(--theme-footer-text-transform);
}

.theme-footer-heading {
    font-family: var(--theme-font-family-footer);
    font-size: var(--theme-footer-heading-font-size);
    font-weight: var(--theme-footer-heading-font-weight);
    letter-spacing: var(--theme-footer-heading-letter-spacing);
    text-transform: var(--theme-footer-heading-text-transform);
}

/* Применяем шрифт footer ко всем элементам в подвале */
footer,
footer *:not([class*="icon-"]),
[class*="footer"] *:not([class*="icon-"]) {
    font-family: var(--theme-font-family-footer) !important;
}

/* === SIDEBAR ZONE === */
.theme-sidebar,
.theme-sidebar * {
    font-family: var(--theme-font-family-sidebar) !important;
}

.theme-sidebar-text {
    font-family: var(--theme-font-family-sidebar);
    font-size: var(--theme-sidebar-font-size);
    font-weight: var(--theme-sidebar-font-weight);
    line-height: var(--theme-sidebar-line-height);
    letter-spacing: var(--theme-sidebar-letter-spacing);
    text-transform: var(--theme-sidebar-text-transform);
}

.theme-sidebar-heading {
    font-family: var(--theme-font-family-sidebar);
    font-size: var(--theme-sidebar-heading-font-size);
    font-weight: var(--theme-sidebar-heading-font-weight);
    letter-spacing: var(--theme-sidebar-heading-letter-spacing);
    text-transform: var(--theme-sidebar-heading-text-transform);
}

/* Применяем шрифт sidebar к правой колонке (типичная структура для sidebar) */
aside,
[class*="uk-width-1-3"],
[class*="uk-width-1-4"],
.uk-section-default aside,
.uk-sidebar {
    font-family: var(--theme-font-family-sidebar) !important;
}

/* Применяем к навигации в sidebar */
aside .uk-nav,
aside .uk-nav > li > a,
[class*="uk-width-1-3"] .uk-nav,
[class*="uk-width-1-3"] .uk-nav > li > a,
[class*="uk-width-1-4"] .uk-nav,
[class*="uk-width-1-4"] .uk-nav > li > a {
    font-family: var(--theme-font-family-sidebar) !important;
}

/* Применяем к блокам статей/виджетов в sidebar */
aside .articles,
aside .article-item,
[class*="uk-width-1-3"] .articles,
[class*="uk-width-1-3"] .article-item,
[class*="uk-width-1-4"] .articles,
[class*="uk-width-1-4"] .article-item {
    font-family: var(--theme-font-family-sidebar) !important;
}

/* Применяем ко всем элементам внутри блоков статей в sidebar */
aside .articles *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]),
aside .article-item *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]),
[class*="uk-width-1-3"] .articles *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]),
[class*="uk-width-1-3"] .article-item *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]),
[class*="uk-width-1-4"] .articles *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]),
[class*="uk-width-1-4"] .article-item *:not([class*="icon-"]):not(.material-icons):not([class*="fa-"]):not([class*="glyphicon-"]) {
    font-family: var(--theme-font-family-sidebar) !important;
}

/* === HEADING ZONE === */
.theme-heading {
    font-family: var(--theme-font-family-heading);
    font-weight: var(--theme-heading-font-weight);
    letter-spacing: var(--theme-heading-letter-spacing);
    text-transform: var(--theme-heading-text-transform);
}

/* === BODY ZONE === */
.theme-body,
.theme-body * {
    font-family: var(--theme-font-family-body) !important;
}

.theme-body-text {
    font-family: var(--theme-font-family-body);
    font-size: var(--theme-body-font-size);
    font-weight: var(--theme-body-font-weight);
    line-height: var(--theme-body-line-height);
    letter-spacing: var(--theme-body-letter-spacing);
    text-transform: var(--theme-body-text-transform);
}

/* ========================================================================
   Mobile Menu Styles
 ========================================================================== */

/* Фон мобильного меню */
#mobile-menu.uk-dropbar {
    background: var(--theme-header-bg-color) !important;
}

/* Мобильное меню - применяем шрифт header */
#mobile-menu .uk-nav > li > a {
    font-family: var(--theme-font-family-header) !important;
    /* font-size: 1rem !important; */
    font-weight: var(--theme-header-font-weight);
    letter-spacing: var(--theme-header-letter-spacing);
    color: var(--theme-header-link-color);
}

#mobile-menu .uk-nav > li > a:hover {
    color: var(--theme-header-link-hover-color);
}

#mobile-menu .uk-nav > li.uk-active > a {
    color: var(--theme-header-link-active-color);
}

/* Подменю в мобильном меню */
#mobile-menu .uk-nav-sub > li > a {
    font-family: var(--theme-font-family-header) !important;
    /* font-size: 0.9rem !important; */
    color: var(--theme-header-link-color);
}

#mobile-menu .uk-nav-sub > li > a:hover {
    color: var(--theme-header-link-hover-color);
}

#mobile-menu .uk-nav-sub > li.uk-active > a {
    color: var(--theme-header-link-active-color);
}

/* Заголовки в мобильном меню (Вход/Регистрация) */
#mobile-menu .uk-nav-header {
    font-family: var(--theme-font-family-header) !important;
    /* font-size: 1rem !important; */
    color: var(--theme-header-link-color) !important;
}

/* Иконки в заголовках мобильного меню */
#mobile-menu .uk-nav-header .icon-user168 {
    color: var(--theme-header-link-color) !important;
}

/* Иконки в мобильном меню (Вход и Корзина) */
#mobile-menu .icon-user168,
#mobile-menu .icon-cart3 {
    font-size: 2em !important;
    color: var(--theme-header-link-color) !important;
}

#mobile-menu .icon-cart3.active {
    color: var(--theme-header-link-active-color) !important;
}

/* Кнопка корзины в мобильном меню */
#mobile-menu .uk-button {
    font-family: var(--theme-font-family-header) !important;
    font-size: 1.1rem !important;
    color: var(--theme-header-link-color);
}

#mobile-menu .uk-button:hover {
    color: var(--theme-header-link-hover-color);
}

#mobile-menu .uk-button.uk-active {
    color: var(--theme-header-link-active-color);
}

/* Переключатель языков в мобильном меню */
#mobile-menu .uk-iconnav > li > a {
    font-family: var(--theme-font-family-header) !important;
    font-size: 1.2rem !important;
    font-weight: var(--theme-header-font-weight);
    color: var(--theme-header-link-color);
}

#mobile-menu .uk-iconnav > li > a:hover {
    color: var(--theme-header-link-hover-color);
}

#mobile-menu .uk-iconnav > li.uk-active > a {
    color: var(--theme-header-link-active-color);
}

.uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before {
    margin: 0 4px 0 0px;
}

.uk-section-default {
    padding-top: 30px !important; 
    background: hsl(39 23% 97% / 1);
}

.item-list-header, .addItem, .btn, .compare-bottom {
    font-family: var(--theme-font-family-header);
}

.item-goods-tile .a-hdr-div a {
        height: auto;
}