/*
Theme Name: Universal Custom UI Theme
Theme URI: https://example.com/
Author: ChatGPT
Author URI: https://example.com/
Description: Highly customizable classic theme with multi-row header, customizable backgrounds per section or globally, unique CSS classes prefixed with .ucui-.
Version: 0.1.2
Requires at least: 6.3
Tested up to: 6.8
Requires PHP: 8.1
Text Domain: ucui
Tags: custom-background, custom-logo, custom-menu, theme-options, two-columns, custom-colors, featured-images
*/

/* === Подключение локального шрифта === */
@font-face {
    font-family: 'UcuiVariable';
    src: url('assets/fonts/ucui-variable.woff2') format('woff2');
    font-weight: 100 700;
    font-display: swap;
}

/* === Сброс и базовая типографика === */
*, *::before, *::after {
    box-sizing: border-box;
}
body {
    margin: 0;
    font-family: 'UcuiVariable', sans-serif;
}

/* === Шапка === */
.ucui-header {
    width: 100%;
}
.ucui-header-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1rem;
}
.ucui-header-row--breadcrumbs {
    font-size: 0.875rem;
}
.ucui-header-row--title {
    justify-content: center;
    text-align: center;
}
.ucui-header-row--submenu nav {
    display: flex;
    gap: 1rem;
}

/* === Кнопка-гамбургер === */
.ucui-mobile-toggle {
    background: none;
    border: none;
    font-size: 1.5rem;
    display: none;
    cursor: pointer;
    position: relative;
    z-index: 10001;
}

/* === Меню desktop === */
.ucui-desktop-menu {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}

/* === Меню mobile (offcanvas) === */
.ucui-mobile-menu {
    display: none;
    flex-direction: column;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    max-width: 300px;
    height: 100%;
    background: #fff;
    padding: 2rem 1rem;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.1);
    z-index: 999;
}
.ucui-mobile-menu.is-open {
    display: flex;
}
body.ucui-offcanvas-open {
    overflow: hidden;
}

/* === Видимость меню в зависимости от устройства === */
.ucui-desktop-only { display: block; }
.ucui-mobile-only  { display: none; }

@media (max-width: 768px) {
    .ucui-desktop-only { display: none !important; }
    .ucui-mobile-only  { display: block !important; }
    .ucui-mobile-toggle { display: block; }
}

/* === Подменю (shared стили) === */
.ucui-submenu-list {
    display: flex;
    flex-direction: row;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
    align-items: center;
}

/* === Пункты меню === */
.ucui-desktop-menu li,
.ucui-mobile-menu li,
.ucui-submenu-list li {
    margin: 0;
    padding: 0;
}

/* === Ссылки меню === */
.ucui-desktop-menu a,
.ucui-mobile-menu a,
.ucui-submenu-list a {
    text-decoration: none;
    color: #7040b5;
    font-weight: 500;
    padding: 0.25em 0.75em;
    border-radius: 4px;
    transition: background 0.2s, color 0.2s;
}

.ucui-desktop-menu a:hover,
.ucui-mobile-menu a:hover,
.ucui-submenu-list a:hover,
.ucui-submenu-active a {
    background: #eee;
    color: #222;
}

/* === Активные пункты === */
.ucui-submenu-active a {
    font-weight: 700;
    box-shadow: 0 1px 0 #7040b5;
}
.ucui-desktop-menu .current-menu-item > a,
.ucui-desktop-menu .current_page_item > a,
.ucui-desktop-menu .current-menu-ancestor > a,
.ucui-mobile-menu .current-menu-item > a,
.ucui-mobile-menu .current_page_item > a,
.ucui-mobile-menu .current-menu-ancestor > a {
    background: #fff;
    color: #222;
    font-weight: bold;
    box-shadow: 0 2px 0 #7040b5;
}

/* === Кнопки темы === */
.ucui-btn {
    display: inline-block;
    padding: 0.5rem 1rem;
    border-radius: 4px;
    transition: all .3s ease;
}
.ucui-btn:hover {
    transform: translateY(-2px);
}