/*!
Theme Name: Readora
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: Readora
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

Readora is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */



/* ============================================================
   WooCommerce — Особистий кабінет (My Account)
   Додати в кінець style.css
   ============================================================ */

/* ── Загальний контейнер сторінки ── */
.woocommerce-account .entry-content,
.woocommerce-account .woocommerce {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 24px var(--container-pad);
    font-family: var(--font-main);
}

/* ── Двоколонковий макет: навігація + контент ── */
.woocommerce-MyAccount-navigation,
.woocommerce-MyAccount-content {
    display: block;
}

.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) 
{
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 32px;
    align-items: start;
}

/* ── Ліва навігація ── */
.woocommerce-MyAccount-navigation {
    background: #f9f9f9;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    overflow: hidden;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 12px 18px;
    font-size: 14px;
    font-weight: 500;
    color: var(--color-text);
    text-decoration: none;
    border-bottom: 1px solid var(--color-border);
    transition: background 0.2s, color 0.2s;
}

.woocommerce-MyAccount-navigation ul li:last-child a {
    border-bottom: none;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background: #f0faf6;
    color: var(--color-primary);
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--active a {
    background: var(--color-primary);
    color: #fff;
    font-weight: 600;
}

/* ── Іконки перед пунктами меню ── */
.woocommerce-MyAccount-navigation-link--dashboard a::before  { content: '🏠 '; }
.woocommerce-MyAccount-navigation-link--orders a::before     { content: '📦 '; }
.woocommerce-MyAccount-navigation-link--downloads a::before  { content: '⬇️ '; }
.woocommerce-MyAccount-navigation-link--edit-address a::before { content: '📍 '; }
.woocommerce-MyAccount-navigation-link--edit-account a::before { content: '👤 '; }
.woocommerce-MyAccount-navigation-link--customer-logout a::before { content: '🚪 '; }

/* ── Правий контент ── */
.woocommerce-MyAccount-content {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    padding: 24px 28px;
    min-height: 300px;
}

/* ── Заголовки всередині кабінету ── */
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-primary);
}

/* ── Таблиця замовлень ── */
.woocommerce-orders-table,
.woocommerce-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.woocommerce-orders-table thead th,
.woocommerce-table thead th {
    background: #f5f5f5;
    padding: 10px 14px;
    text-align: left;
    font-weight: 600;
    color: var(--color-text);
    border-bottom: 2px solid var(--color-border);
}

.woocommerce-orders-table tbody td,
.woocommerce-table tbody td {
    padding: 10px 14px;
    border-bottom: 1px solid var(--color-border);
    color: var(--color-text);
    vertical-align: middle;
}

.woocommerce-orders-table tbody tr:hover td,
.woocommerce-table tbody tr:hover td {
    background: #f9fdf9;
}

/* ── Статуси замовлень ── */
.woocommerce-orders-table .order-status,
mark.order-status {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    background: #e8f5f0;
    color: var(--color-primary);
}

mark.order-status.status-completed  { background: #e8f5f0; color: #2e8a6d; }
mark.order-status.status-processing { background: #fff8e1; color: #f59e0b; }
mark.order-status.status-on-hold    { background: #fff3cd; color: #856404; }
mark.order-status.status-cancelled  { background: #fdecea; color: #c0392b; }
mark.order-status.status-pending    { background: #f0f0f0; color: #666;    }

/* ── Кнопки ── */
.woocommerce-MyAccount-content .button,
.woocommerce-MyAccount-content a.button,
.woocommerce-MyAccount-content button[type="submit"],
.woocommerce-MyAccount-content input[type="submit"] {
    display: inline-block;
    background: var(--color-primary);
    color: #fff !important;
    border: none;
    border-radius: 6px;
    padding: 9px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
    font-family: var(--font-main);
}

.woocommerce-MyAccount-content .button:hover,
.woocommerce-MyAccount-content a.button:hover,
.woocommerce-MyAccount-content button[type="submit"]:hover,
.woocommerce-MyAccount-content input[type="submit"]:hover {
    background: var(--color-primary-hover);
}

/* ── Форми (особисті дані, адреси) ── */
.woocommerce-MyAccount-content .woocommerce-form-row,
.woocommerce-MyAccount-content p.form-row {
    margin-bottom: 16px;
}

.woocommerce-MyAccount-content label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: 5px;
}

.woocommerce-MyAccount-content input[type="text"],
.woocommerce-MyAccount-content input[type="email"],
.woocommerce-MyAccount-content input[type="tel"],
.woocommerce-MyAccount-content input[type="password"],
.woocommerce-MyAccount-content select,
.woocommerce-MyAccount-content textarea {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid var(--color-input-border);
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--font-main);
    color: var(--color-text);
    background: #fff;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.woocommerce-MyAccount-content input:focus,
.woocommerce-MyAccount-content select:focus,
.woocommerce-MyAccount-content textarea:focus {
    outline: none;
    border-color: var(--color-primary);
}

/* ── Повідомлення (успіх, помилка) ── */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    border-radius: 6px;
    padding: 12px 16px;
    margin-bottom: 20px;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    list-style: none;
}

.woocommerce-message {
    background: #e8f5f0!important;
    border-left: 4px solid var(--color-primary);
    color: #2e8a6d;
}

.woocommerce-error {
    background: #fdecea!important;
    border-left: 4px solid #c0392b;
    color: #c0392b;
}

body .woocommerce-info {
    background: #e8f0fd;
    border-left: 4px solid #3b82f6;
    color: #1d4ed8;
}

fieldset .woocommerce-form-row {
    padding: 5px;
}

.woocommerce-EditAccountForm {
        display: flex;
    flex-direction: column;
    gap: 7px;
}

#account_display_name_description {
    font-size: 14px;
}

/* ── Адаптив ── */
@media (max-width: 768px) {
    .woocommerce-account .woocommerce {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
    }

    .woocommerce-MyAccount-navigation ul li {
        flex: 1 1 50%;
    }

    .woocommerce-MyAccount-navigation ul li a {
        border-right: 1px solid var(--color-border);
        text-align: center;
        font-size: 12px;
        padding: 10px 8px;
    }

    .woocommerce-MyAccount-content {
        padding: 16px;
    }

    .woocommerce-orders-table thead {
        display: none;
    }

    .woocommerce-orders-table tbody td {
        display: block;
        padding: 6px 10px;
        border: none;
    }

    .woocommerce-orders-table tbody tr {
        border: 1px solid var(--color-border);
        border-radius: 6px;
        margin-bottom: 12px;
        display: block;
        padding: 8px;
    }
}


/* ============================================================
   WooCommerce — Сторінка "Увійти / Реєстрація" (customer_login)
   Додати в кінець style.css
   ============================================================ */

.woocommerce-account .entry-content #customer_login.u-columns.col2-set {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 24px var(--container-pad);
}

.woocommerce-account #customer_login .u-column1,
.woocommerce-account #customer_login .u-column2 {
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: 8px;
    padding: 24px 28px;
}

.woocommerce-account #customer_login h2 {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-primary);
}

/* Поля форм */
.woocommerce-account #customer_login .woocommerce-form-row,
.woocommerce-account #customer_login p.form-row {
    margin-bottom: 16px;
}

.woocommerce-account #customer_login label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text);
    margin-bottom: 5px;
}

.woocommerce-account #customer_login input[type="text"],
.woocommerce-account #customer_login input[type="email"],
.woocommerce-account #customer_login input[type="password"] {
    width: 100%;
    padding: 9px 12px;
    border: 1px solid var(--color-input-border);
    border-radius: 6px;
    font-size: 14px;
    font-family: var(--font-main);
    color: var(--color-text);
    background: #fff;
    transition: border-color 0.2s;
    box-sizing: border-box;
}

.woocommerce-account #customer_login input:focus {
    outline: none;
    border-color: var(--color-primary);
}

.woocommerce-account #customer_login .password-input {
    position: relative;
    display: block;
    width: 100%;
}

.woocommerce-account #customer_login .show-password-input {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    color: var(--color-text-light);
    padding: 0;
}

/* Запам'ятати мене */
.woocommerce-account #customer_login .woocommerce-form-login__rememberme {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--color-text);
    margin-bottom: 16px;
    cursor: pointer;
}

.woocommerce-account #customer_login .woocommerce-form-login__rememberme input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: var(--color-primary);
    cursor: pointer;
}

/* Кнопки Увійти / Реєстрація */
.woocommerce-account #customer_login button[type="submit"] {
    display: inline-block;
    background: var(--color-primary);
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    font-family: var(--font-main);
}

.woocommerce-account #customer_login button[type="submit"]:hover {
    background: var(--color-primary-hover);
}

/* Забули пароль */
.woocommerce-account #customer_login .woocommerce-LostPassword {
    margin-top: 10px;
    font-size: 13px;
}

.woocommerce-account #customer_login .woocommerce-LostPassword a {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Текст під формою реєстрації */
.woocommerce-account #customer_login .woocommerce-form-register p,
.woocommerce-account #customer_login .woocommerce-privacy-policy-text p {
    font-size: 13px;
    color: var(--color-text-light);
    line-height: 1.6;
    margin-bottom: 14px;
}

.woocommerce-account #customer_login .woocommerce-privacy-policy-link {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Адаптив: на мобільному — одна колонка */
@media (max-width: 768px) {
    .woocommerce-account .entry-content #customer_login.u-columns.col2-set {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 16px;
    }

    .woocommerce-account #customer_login .u-column1,
    .woocommerce-account #customer_login .u-column2 {
        padding: 16px;
    }
}