/*
Theme Name: ИГРОДВОР
Theme URI: https://igro-dvor.ru
Author: ИГРОДВОР
Description: Кастомная тема для магазина настольных игр ИГРОДВОР
Version: 1.0
License: GNU General Public License v2 or later
Text Domain: igrodvor
*/

/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background-color: #0f0e0b;
    color: #f0ede4;
    font-family: 'Georgia', serif;
    font-size: 15px;
    line-height: 1.7;
}

a { color: #c8963e; text-decoration: none; }
a:hover { color: #e0aa50; }
img { max-width: 100%; height: auto; display: block; }

/* ===== HEADER ===== */
#site-header {
    background: #0f0e0b;
    border-bottom: 0.5px solid rgba(240,237,228,0.12);
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
}

.header-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
}

/* Logo */
#site-logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

#site-logo img {
    height: 44px;
    width: auto;
}

#site-logo .logo-text {
    font-size: 22px;
    letter-spacing: 0.04em;
    color: #f0ede4;
    font-family: 'Georgia', serif;
}

#site-logo .logo-text span {
    color: #c8963e;
}

/* Navigation */
#site-nav ul {
    list-style: none;
    display: flex;
    gap: 28px;
    align-items: center;
}

#site-nav ul li a {
    font-size: 13px;
    letter-spacing: 0.06em;
    color: rgba(240,237,228,0.65);
    transition: color 0.2s;
    text-decoration: none;
}

#site-nav ul li a:hover,
#site-nav ul li.current-menu-item > a {
    color: #f0ede4;
}

/* Header Actions */
.header-actions {
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-actions a {
    color: rgba(240,237,228,0.6);
    font-size: 20px;
    transition: color 0.2s;
    text-decoration: none;
}

.header-actions a:hover { color: #f0ede4; }

.cart-btn {
    background: #c8963e;
    color: #0f0e0b !important;
    padding: 8px 20px;
    font-size: 12px;
    letter-spacing: 0.08em;
    border-radius: 2px;
    font-family: 'Georgia', serif;
    transition: background 0.2s;
}

.cart-btn:hover { background: #d4a44a !important; color: #0f0e0b !important; }

/* Mobile menu toggle */
.menu-toggle {
    display: none;
    background: none;
    border: none;
    color: #f0ede4;
    font-size: 24px;
    cursor: pointer;
}

/* ===== MAIN CONTENT ===== */
#main-content {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    min-height: 60vh;
}

/* ===== HERO (главная) ===== */
.hero-section {
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 500px;
    margin: 0 -32px;
    border-bottom: 0.5px solid rgba(240,237,228,0.08);
}

.hero-left {
    padding: 72px 48px 72px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-right: 0.5px solid rgba(240,237,228,0.1);
}

.hero-tag {
    font-size: 11px;
    letter-spacing: 0.14em;
    color: #c8963e;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.hero-tag::before {
    content: '';
    display: block;
    width: 32px;
    height: 1px;
    background: #c8963e;
}

.hero-title {
    font-size: 48px;
    line-height: 1.1;
    font-weight: 400;
    margin-bottom: 24px;
    color: #f0ede4;
}

.hero-title em { color: #c8963e; font-style: normal; }

.hero-desc {
    font-size: 15px;
    color: rgba(240,237,228,0.55);
    line-height: 1.8;
    margin-bottom: 40px;
    max-width: 400px;
}

.hero-btns { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }

.btn-primary {
    background: #c8963e;
    color: #0f0e0b;
    border: none;
    padding: 14px 32px;
    font-size: 13px;
    letter-spacing: 0.08em;
    cursor: pointer;
    border-radius: 2px;
    font-family: 'Georgia', serif;
    text-decoration: none;
    display: inline-block;
    transition: background 0.2s;
}

.btn-primary:hover { background: #d4a44a; color: #0f0e0b; }

.btn-secondary {
    background: transparent;
    color: #f0ede4;
    border: 0.5px solid rgba(240,237,228,0.3);
    padding: 14px 32px;
    font-size: 13px;
    letter-spacing: 0.06em;
    cursor: pointer;
    border-radius: 2px;
    font-family: 'Georgia', serif;
    text-decoration: none;
    display: inline-block;
    transition: border-color 0.2s;
}

.btn-secondary:hover { border-color: rgba(240,237,228,0.6); color: #f0ede4; }

.hero-right {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 1px;
    background-color: rgba(240,237,228,0.08);
}

.hero-cat-cell {
    background: #1a1813;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 28px;
    gap: 12px;
    cursor: pointer;
    transition: background 0.2s;
    text-decoration: none;
}

.hero-cat-cell:hover { background: #201e18; }
.hero-cat-icon { font-size: 36px; }
.hero-cat-label { font-size: 12px; color: rgba(240,237,228,0.5); letter-spacing: 0.08em; }

/* ===== STATS ===== */
.stats-bar {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 0.5px solid rgba(240,237,228,0.1);
    border-bottom: 0.5px solid rgba(240,237,228,0.1);
    margin: 0 -32px;
}

.stat-item {
    padding: 28px 32px;
    border-right: 0.5px solid rgba(240,237,228,0.1);
}

.stat-item:last-child { border-right: none; }
.stat-num { font-size: 30px; color: #c8963e; margin-bottom: 4px; }
.stat-label { font-size: 11px; color: rgba(240,237,228,0.5); letter-spacing: 0.06em; }

/* ===== SECTIONS ===== */
.section { padding: 56px 0; }

.section-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 32px;
}

.section-title { font-size: 26px; font-weight: 400; color: #f0ede4; }
.section-link { font-size: 12px; color: #c8963e; letter-spacing: 0.06em; }

/* ===== CATEGORY GRID ===== */
.categories-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}

.cat-card {
    background: #1a1813;
    border: 0.5px solid rgba(240,237,228,0.08);
    border-radius: 4px;
    padding: 24px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
    text-align: center;
    text-decoration: none;
}

.cat-card:hover { border-color: #c8963e; background: #1e1c16; }
.cat-card-icon { font-size: 28px; }
.cat-card-name { font-size: 13px; color: rgba(240,237,228,0.8); letter-spacing: 0.04em; }
.cat-card-count { font-size: 11px; color: rgba(240,237,228,0.35); }

/* ===== PRODUCT GRID ===== */
.products-grid,
ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.product-card,
ul.products li.product {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.08) !important;
    border-radius: 4px !important;
    overflow: hidden !important;
    transition: border-color 0.2s !important;
    padding: 0 !important;
}

.product-card:hover,
ul.products li.product:hover {
    border-color: rgba(200,150,62,0.5) !important;
}

.product-card .product-img {
    height: 180px;
    background: #211f18;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 0.5px solid rgba(240,237,228,0.06);
    overflow: hidden;
}

ul.products li.product img {
    width: 100% !important;
    height: 180px !important;
    object-fit: cover !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.06) !important;
}

.product-card .product-info,
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product .price,
ul.products li.product .button {
    padding: 0 16px !important;
}

ul.products li.product .woocommerce-loop-product__title {
    font-size: 14px !important;
    color: #f0ede4 !important;
    font-family: 'Georgia', serif !important;
    font-weight: 400 !important;
    margin: 16px 0 4px !important;
    line-height: 1.4 !important;
}

ul.products li.product .price {
    color: #c8963e !important;
    font-size: 18px !important;
    margin-bottom: 12px !important;
    display: block !important;
}

ul.products li.product .price del {
    color: rgba(240,237,228,0.3) !important;
    font-size: 13px !important;
    margin-right: 6px !important;
}

ul.products li.product .button,
ul.products li.product a.add_to_cart_button {
    background: transparent !important;
    border: 0.5px solid rgba(200,150,62,0.4) !important;
    color: #c8963e !important;
    padding: 8px 16px !important;
    font-size: 11px !important;
    cursor: pointer !important;
    border-radius: 2px !important;
    font-family: 'Georgia', serif !important;
    letter-spacing: 0.06em !important;
    margin: 0 16px 16px !important;
    display: inline-block !important;
    transition: background 0.2s !important;
    width: calc(100% - 32px) !important;
    text-align: center !important;
}

ul.products li.product .button:hover,
ul.products li.product a.add_to_cart_button:hover {
    background: rgba(200,150,62,0.1) !important;
    color: #c8963e !important;
}

/* ===== SINGLE PRODUCT ===== */
.woocommerce div.product {
    color: #f0ede4 !important;
}

.woocommerce div.product .product_title {
    font-size: 26px !important;
    color: #f0ede4 !important;
    font-weight: 400 !important;
    margin-bottom: 16px !important;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: #c8963e !important;
    font-size: 32px !important;
}

.woocommerce div.product .woocommerce-product-details__short-description {
    color: rgba(240,237,228,0.65) !important;
    line-height: 1.8 !important;
}

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce button.button.alt,
.woocommerce .single_add_to_cart_button {
    background: #c8963e !important;
    color: #0f0e0b !important;
    border: none !important;
    border-radius: 2px !important;
    font-family: 'Georgia', serif !important;
    letter-spacing: 0.06em !important;
    padding: 14px 32px !important;
    font-size: 13px !important;
    transition: background 0.2s !important;
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce .single_add_to_cart_button:hover {
    background: #d4a44a !important;
    color: #0f0e0b !important;
}

/* ===== BREADCRUMBS ===== */
.woocommerce .woocommerce-breadcrumb,
.breadcrumb {
    font-size: 12px !important;
    color: rgba(240,237,228,0.4) !important;
    padding: 14px 0 !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.08) !important;
    margin-bottom: 32px !important;
}

.woocommerce .woocommerce-breadcrumb a {
    color: rgba(240,237,228,0.4) !important;
}

.woocommerce .woocommerce-breadcrumb a:hover {
    color: #c8963e !important;
}

/* ===== SIDEBAR / FILTERS ===== */
.widget_title,
.widgettitle {
    font-size: 13px !important;
    letter-spacing: 0.08em !important;
    color: rgba(240,237,228,0.5) !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.1) !important;
    padding-bottom: 10px !important;
    margin-bottom: 16px !important;
    font-family: 'Georgia', serif !important;
}

.widget ul li a {
    color: rgba(240,237,228,0.65) !important;
    font-size: 13px !important;
    transition: color 0.2s !important;
}

.widget ul li a:hover { color: #c8963e !important; }

/* ===== CART / CHECKOUT ===== */
.woocommerce-cart table.cart,
.woocommerce-checkout form.checkout {
    color: #f0ede4 !important;
}

.woocommerce table.shop_table {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.1) !important;
    border-radius: 4px !important;
    color: #f0ede4 !important;
}

.woocommerce table.shop_table th {
    background: #211f18 !important;
    color: rgba(240,237,228,0.5) !important;
    font-size: 11px !important;
    letter-spacing: 0.08em !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.1) !important;
}

.woocommerce table.shop_table td {
    border-bottom: 0.5px solid rgba(240,237,228,0.06) !important;
    color: #f0ede4 !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.2) !important;
    color: #f0ede4 !important;
    border-radius: 2px !important;
    padding: 10px 14px !important;
}

.woocommerce form .form-row label {
    color: rgba(240,237,228,0.65) !important;
    font-size: 13px !important;
}

/* ===== DELIVERY STRIP ===== */
.delivery-strip {
    border-top: 0.5px solid rgba(240,237,228,0.1);
    padding: 32px 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.del-item { display: flex; align-items: flex-start; gap: 16px; }
.del-icon { font-size: 22px; color: #c8963e; margin-top: 2px; }
.del-title { font-size: 14px; color: #f0ede4; margin-bottom: 4px; }
.del-desc { font-size: 12px; color: rgba(240,237,228,0.45); line-height: 1.6; }

/* ===== FOOTER ===== */
#site-footer {
    background: #0a0906;
    border-top: 0.5px solid rgba(240,237,228,0.1);
    padding: 48px 0 24px;
}

.footer-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 32px;
    margin-bottom: 40px;
}

.footer-logo { font-size: 20px; color: #f0ede4; margin-bottom: 12px; font-family: 'Georgia', serif; }
.footer-logo span { color: #c8963e; }
.footer-about { font-size: 13px; color: rgba(240,237,228,0.4); line-height: 1.7; }
.footer-col-title { font-size: 11px; letter-spacing: 0.1em; color: rgba(240,237,228,0.5); margin-bottom: 16px; }

.footer-links { display: flex; flex-direction: column; gap: 10px; }
.footer-links a { font-size: 13px; color: rgba(240,237,228,0.4); text-decoration: none; }
.footer-links a:hover { color: #c8963e; }

.footer-bottom {
    border-top: 0.5px solid rgba(240,237,228,0.08);
    padding-top: 20px;
    display: flex;
    justify-content: space-between;
    font-size: 12px;
    color: rgba(240,237,228,0.25);
}

/* ===== WOOCOMMERCE OVERRIDES ===== */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-info {
    background: #1a1813 !important;
    color: #f0ede4 !important;
    border-top-color: #c8963e !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    list-style: none !important;
    padding: 0 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
    color: rgba(240,237,228,0.65) !important;
    padding: 8px 0 !important;
    display: block !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.08) !important;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
    .categories-grid { grid-template-columns: repeat(4, 1fr); }
    .products-grid, ul.products { grid-template-columns: repeat(3, 1fr) !important; }
    .footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
    .header-inner { padding: 0 16px; }
    #site-nav { display: none; }
    #site-nav.open { display: block; position: absolute; top: 68px; left: 0; right: 0; background: #0f0e0b; border-bottom: 0.5px solid rgba(240,237,228,0.1); padding: 16px; }
    #site-nav.open ul { flex-direction: column; gap: 0; }
    #site-nav.open ul li a { display: block; padding: 12px 0; border-bottom: 0.5px solid rgba(240,237,228,0.06); }
    .menu-toggle { display: block; }
    .hero-section { grid-template-columns: 1fr; }
    .hero-right { display: none; }
    .hero-title { font-size: 32px; }
    .stats-bar { grid-template-columns: repeat(2, 1fr); }
    .categories-grid { grid-template-columns: repeat(3, 1fr); }
    .products-grid, ul.products { grid-template-columns: repeat(2, 1fr) !important; }
    #main-content { padding: 0 16px; }
    .delivery-strip { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; gap: 8px; }
}

@media (max-width: 480px) {
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ===== ПОИСК В ШАПКЕ ===== */
.header-search-dropdown {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.15) !important;
    border-radius: 4px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.6) !important;
}

.header-search-dropdown input[type="search"] {
    background: #0f0e0b !important;
    border: 0.5px solid rgba(240,237,228,0.2) !important;
    color: #f0ede4 !important;
    font-family: 'Georgia', serif !important;
    font-size: 14px !important;
    padding: 10px 14px !important;
    border-radius: 2px !important;
    outline: none !important;
}

.header-search-dropdown input[type="search"]:focus {
    border-color: #c8963e !important;
}

.header-search-dropdown button[type="submit"] {
    background: #c8963e !important;
    border: none !important;
    color: #0f0e0b !important;
    border-radius: 2px !important;
    cursor: pointer !important;
    font-size: 18px !important;
    font-weight: bold !important;
    padding: 10px 16px !important;
    transition: background 0.2s !important;
}

.header-search-dropdown button[type="submit"]:hover {
    background: #d4a44a !important;
}

/* ===== ИКОНКИ HERO-БЛОКА НА ГЛАВНОЙ ===== */
.hero-cat-icon {
    font-size: 52px !important;
    line-height: 1 !important;
    margin-bottom: 4px !important;
}

.hero-cat-label {
    font-size: 14px !important;
    letter-spacing: 0.12em !important;
    color: rgba(240,237,228,0.7) !important;
}

.hero-cat-cell {
    padding: 40px 20px !important;
}

/* ===== КАРТОЧКА ТОВАРА — ТАБЫ ===== */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0 !important;
    margin: 0 0 0 !important;
    border-bottom: 0.5px solid rgba(240,237,228,0.1) !important;
    display: flex !important;
    gap: 0 !important;
    list-style: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
    display: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    display: block !important;
    padding: 14px 24px !important;
    font-size: 13px !important;
    letter-spacing: 0.08em !important;
    color: rgba(240,237,228,0.5) !important;
    font-family: 'Georgia', serif !important;
    text-decoration: none !important;
    border-bottom: 2px solid transparent !important;
    transition: all 0.2s !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    color: #c8963e !important;
    border-bottom-color: #c8963e !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
    display: none !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.08) !important;
    border-top: none !important;
    padding: 24px !important;
    margin: 0 !important;
    color: rgba(240,237,228,0.7) !important;
    font-size: 14px !important;
    line-height: 1.8 !important;
    border-radius: 0 0 4px 4px !important;
}

/* ===== КОЛИЧЕСТВО ТОВАРА ===== */
.woocommerce div.product form.cart {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 20px 0 !important;
}

.woocommerce div.product form.cart .qty {
    background: #1a1813 !important;
    border: 0.5px solid rgba(240,237,228,0.2) !important;
    color: #f0ede4 !important;
    padding: 12px 16px !important;
    border-radius: 2px !important;
    font-size: 16px !important;
    width: 70px !important;
    text-align: center !important;
    font-family: 'Georgia', serif !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button {
    flex: 1 !important;
    padding: 14px 24px !important;
    font-size: 14px !important;
    letter-spacing: 0.08em !important;
}

/* Метка количества */
.woocommerce div.product form.cart label {
    display: none !important;
}
