/* ==========================================================================
   NOVAROOM Account Components CSS
   Extracted from WP theme + inline styles consolidation
   ========================================================================== */

/* --- Sidebar Desktop Layout (moved from inline <style> blocks) --- */
@media (min-width: 767.98px) {
    .account .account__left {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: static !important;
        width: 240px;
        flex-shrink: 0;
        padding: 30px;
        border: none;
        border-right: 1px solid #e0e0e0;
        background: #fff;
        height: auto;
        max-height: none;
        z-index: 0;
    }
    .account .account__left-content {
        padding: 0;
        height: auto;
        min-height: 1px;
    }
    .account .account__left-close {
        display: none;
    }
    .account .account__data {
        display: flex;
        gap: 0;
        align-items: stretch;
        border: 1px solid #e0e0e0;
        width: 100%;
    }
    .account .account__right {
        flex: 1;
        min-width: 0;
        padding: 30px;
    }
}
@media (min-width: 1279.98px) {
    .account .account__left {
        padding: 40px;
        width: 290px;
    }
    .account .account__left-menu {
        margin-top: 45px;
    }
    .account .account__left-logout {
        margin: 60px 0;
    }
}

/* --- Filter radio dots --- */
.account-orders__filters { display: flex; gap: 20px; align-items: center; }
.account-orders__filter { display: flex; align-items: center; gap: 8px; cursor: pointer; font: 14px/1 var(--text-font); text-transform: uppercase; color: #999; }
.account-orders__filter--is-active { color: var(--dark-color); }
.account-orders__filter-check-dot { width: 18px; height: 18px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.check-dot__svg { width: 18px; height: 18px; display: block; }
.check-dot__circle { stroke: currentColor; }
.account-orders__filter--is-active .check-dot__circle { fill: currentColor; }
.account-orders__filter-title { margin: 0; }

/* --- Order count --- */
.account-orders__count { font: 14px/1 var(--text-font); color: #999; }
.account-orders__header { display: flex; justify-content: space-between; align-items: center; margin: 0 0 30px; }

/* --- Order items --- */
.account-orders__items { display: flex; flex-direction: column; gap: 20px; }
.account-orders__item { position: relative; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 15px; padding: 25px 30px; border: 1px solid #e0e0e0; align-items: start; }
.account-orders__item-link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; }
.account-orders__item-number { font: 700 16px/1.2 var(--heading-font); text-transform: uppercase; }
.account-orders__item-date { font: 14px/1.2 var(--text-font); color: #999; }
.account-orders__item-number-and-date { display: flex; flex-direction: column; gap: 5px; }
.account-orders__item-status-block { display: flex; flex-direction: column; gap: 5px; }
.account-orders__item-info-title { font: 12px/1 var(--text-font); color: #999; text-transform: uppercase; margin: 0 0 5px; }
.account-orders__item-sum-value { font: 700 16px/1.2 var(--heading-font); }

/* --- Status badges --- */
.account-orders__item-status { display: inline-block; padding: 4px 10px; font: 500 12px/1.2 var(--text-font); text-transform: uppercase; border-radius: 2px; }
.order-status--in-progress { background: #fff3e0; color: #e65100; }
.order-status--is-shipped { background: #e8f5e9; color: #2e7d32; }
.order-status--is-cancelled { background: #ffebee; color: #c62828; }
.order-status--on-paused { background: #f5f5f5; color: #757575; }
.order-status--not-payed { background: #ffebee; color: #c62828; }
.order-status--partially-paid { background: #fff3e0; color: #e65100; }
.order-status--has-been-payed { background: #e8f5e9; color: #2e7d32; }

/* --- Empty state --- */
.account-orders--is-empty .account-orders__header,
.account-orders--is-empty .account-orders__items { display: none; }
.account-orders__empty-text { display: none; font: 16px/1.5 var(--text-font); color: #999; }
.account-orders--is-empty .account-orders__empty-text { display: block; }
.account-orders__empty-filter-text { font: 16px/1.5 var(--text-font); color: #999; }
.account-orders__empty-filter-text--is-hidden { display: none; }

/* --- Profile form --- */
.account-profile__fieldset { border: none; padding: 0; margin: 0 0 30px; }
.account-profile__fieldset-title { font: 700 16px/1.3 var(--heading-font); text-transform: uppercase; margin: 0 0 20px; }
.account-profile__field { display: block; margin: 0 0 15px; }
.account-profile__field--is-hidden { display: none; }
.account-profile__input { width: 100%; }
.account-profile__mailing-agreement-field { display: flex; align-items: center; gap: 10px; cursor: pointer; font: 14px/1.4 var(--text-font); }
.account-profile__mailing-agreement-checkbox { display: none; }
.account-profile__mailing-agreement-check { width: 18px; height: 18px; border: 1px solid #ccc; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.account-profile__mailing-agreement-checkbox:checked + .account-profile__mailing-agreement-check { background: var(--dark-color); border-color: var(--dark-color); }
.account-profile__mailing-agreement-checkbox:checked + .account-profile__mailing-agreement-check::after { content: '\2713'; color: #fff; font-size: 12px; }
.account-profile__bottom { display: flex; flex-direction: column; gap: 15px; }
.account-profile__button { align-self: flex-start; }
.account-profile__policy { font: 14px/1.4 var(--text-font); color: #999; }
.account-profile__policy-link { color: var(--dark-color); }
.account-profile__lost-password-button { font: 14px/1.4 var(--text-font); color: #999; cursor: pointer; text-decoration: none; }
.account-profile__delete-account { display: none; font: 14px/1.4 var(--text-font); color: #999; margin: 30px 0 0; }
.account-profile__delete-account-button { background: none; border: none; border-bottom: 1px solid; cursor: pointer; font: inherit; color: inherit; padding: 0; }

/* --- Order detail tracking --- */
.account-order__back { display: flex; align-items: center; gap: 8px; font: 14px/1 var(--text-font); margin: 0 0 20px; text-decoration: none; color: inherit; }
.account-order__title-and-status { display: flex; justify-content: space-between; align-items: center; margin: 0 0 30px; }
.account-order__title { margin: 0; }
.account-order__status-block { display: flex; gap: 8px; }
.account-order__status { display: inline-block; padding: 4px 10px; font: 500 12px/1.2 var(--text-font); text-transform: uppercase; border-radius: 2px; }
.account-order__tracking { display: flex; align-items: flex-start; position: relative; margin: 0 0 40px; padding: 0; }
.account-order__tracking-line { position: absolute; top: 9px; left: 0; right: 0; height: 1px; background: #e0e0e0; z-index: 0; }
.account-order__tracking-colored-line { position: absolute; top: 9px; left: 0; height: 1px; background: var(--dark-color); z-index: 1; transition: width .3s; }
.account-order__tracking-step { flex: 1; display: flex; flex-direction: column; align-items: center; position: relative; z-index: 2; }
.account-order__tracking-step-check-dot { width: 18px; height: 18px; margin: 0 0 8px; }
.account-order__tracking-step-title { font: 12px/1.2 var(--text-font); text-transform: uppercase; color: #999; text-align: center; }
.account-order__tracking-step--is-active .account-order__tracking-step-title { color: var(--dark-color); }
.account-order__tracking-step--is-active .check-dot__circle { fill: var(--dark-color); stroke: var(--dark-color); }
.account-order__tracking-step-description { font: 11px/1.2 var(--text-font); color: #999; text-align: center; margin: 4px 0 0; }

/* --- Tracking step progress --- */
.account-order__tracking--step-1 .account-order__tracking-colored-line { width: 0%; }
.account-order__tracking--step-2 .account-order__tracking-colored-line { width: 16.66%; }
.account-order__tracking--step-3 .account-order__tracking-colored-line { width: 33.33%; }
.account-order__tracking--step-4 .account-order__tracking-colored-line { width: 50%; }
.account-order__tracking--step-5 .account-order__tracking-colored-line { width: 66.66%; }
.account-order__tracking--step-6 .account-order__tracking-colored-line { width: 83.33%; }
.account-order__tracking--step-7 .account-order__tracking-colored-line { width: 100%; }

/* --- Order detail panels --- */
.account-order__body { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.account-order__info { padding: 25px; border: 1px solid #e0e0e0; }
.account-order__info-title { font: 700 14px/1.3 var(--heading-font); text-transform: uppercase; margin: 0 0 15px; }
.account-order__info-description { font: 14px/1.4 var(--text-font); color: #999; }
.account-order__info-table { display: flex; flex-direction: column; gap: 8px; }
.account-order__info-table-row { display: flex; justify-content: space-between; font: 14px/1.4 var(--text-font); }
.account-order__info-totals { display: flex; justify-content: space-between; font: 700 16px/1.3 var(--heading-font); border-top: 1px solid #e0e0e0; padding: 12px 0 0; margin: 12px 0 0; }
.account-order__info-product { display: flex; gap: 15px; padding: 15px 0; border-bottom: 1px solid #f5f5f5; }
.account-order__info-product-img-link { width: 80px; height: 80px; flex-shrink: 0; background-size: cover; background-position: center; background-repeat: no-repeat; }
.account-order__info-product-data { flex: 1; min-width: 0; }
.account-order__info-product-category-and-count { display: flex; justify-content: space-between; margin: 0 0 5px; }
.account-order__info-product-category { font: 12px/1.2 var(--text-font); color: #999; text-transform: uppercase; }
.account-order__info-product-article { font: 12px/1.2 var(--text-font); color: #999; }
.account-order__info-product-count { font: 14px/1.2 var(--text-font); }
.account-order__info-product-count::after { content: ' ' attr(data-units); }
.account-order__info-product-title { font: 14px/1.3 var(--text-font); margin: 0 0 3px; }
.account-order__info-product-brand { font: 12px/1.2 var(--text-font); color: #999; }
.account-order__info-product-price::after { content: attr(data-regular-price); font: 700 14px/1.2 var(--heading-font); }
.account-order__info-product-attributes { display: flex; gap: 8px; margin: 5px 0 0; }
.account-order__info-product-attribute { font: 12px/1.2 var(--text-font); color: #999; padding: 2px 8px; border: 1px solid #e0e0e0; }
.account-order__info-document { display: block; font: 14px/1.4 var(--text-font); color: var(--dark-color); border-bottom: 1px solid; margin: 0 0 8px; }
.account-order__info-delivery-address-title,
.account-order__info-delivery-stock-title,
.account-order__info-delivery-track-number-title { font: 12px/1 var(--text-font); color: #999; text-transform: uppercase; margin: 0 0 5px; }
.account-order__info-delivery-track-number-value { font: 14px/1.4 var(--text-font); cursor: pointer; border-bottom: 1px dashed; }

/* --- Cooperation (placeholder) --- */
.account-cooperation__content { font: 14px/1.6 var(--text-font); }


/* --- Favorites page layout --- */
.account-favorites .account__data {
    display: flex !important;
    gap: 30px !important;
    align-items: flex-start !important;
}
@media (min-width: 767.98px) {
    .account-favorites .account__left {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: static !important;
        width: 240px !important;
        flex-shrink: 0 !important;
        padding: 30px;
        border: none;
        border-right: 1px solid #e0e0e0;
        background: #fff;
        height: auto;
        max-height: none;
    }
}
@media (min-width: 1279.98px) {
    .account-favorites .account__left {
        width: 290px !important;
        padding: 40px;
    }
}
.account-favorites .account__right {
    flex: 1 !important;
    min-width: 0 !important;
    overflow: visible;
}

/* Favorites product grid */
.account-favorites .account-favorites,
.account-favorites .account__right .account-favorites {
    width: 100%;
    box-sizing: border-box;
}
.account-favorites .account__right .products__items,
.account-favorites .account__right .products-catalog__items {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 20px !important;
    width: 100%;
}
@media (max-width: 1279.98px) {
    .account-favorites .account__right .products__items,
    .account-favorites .account__right .products-catalog__items {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 767.98px) {
    .account-favorites .account__right .products__items,
    .account-favorites .account__right .products-catalog__items {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 575.98px) {
    .account-favorites .account__right .products__items,
    .account-favorites .account__right .products-catalog__items {
        grid-template-columns: 1fr !important;
    }
}
.account-favorites .account__right .product-card {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Favorites empty state */
.account-favorites__empty {
    font: 16px/1.5 var(--text-font);
    color: #999;
}
.account-favorites__message {
    font: 16px/1.5 var(--text-font);
}
.account-favorites__link {
    font: 14px/1.4 var(--text-font);
    color: var(--dark-color);
    border-bottom: 1px solid;
    text-decoration: none;
}

/* --- Button styles (from WP global) --- */
.account-profile__button.button.button--style-primary,
.button.button--style-primary {
    padding: 12px 0;
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: lowercase;
    font: 16px/1 var(--text-font);
    transition: background-color .5s, border-color .5s, color .5s;
    color: var(--dark-color);
    border: 1px solid;
    background: transparent;
    cursor: pointer;
}
.account-profile__button.button.button--style-primary {
    width: auto;
    padding: 12px 40px;
}
.button.button--style-primary:hover {
    background-color: var(--dark-color);
    color: #fff;
}
/* --- Sidebar contacts fix (prevent cut-off) --- */
.account__left {
    overflow: visible;
}
.account__left-content {
    overflow: visible;
    display: flex;
    flex-direction: column;
}
.account__left-contacts {
    margin-top: auto;
    padding-top: 20px;
}

/* === FAVORITES PAGE LAYOUT FIX === */
@media (min-width: 767.98px) {
    .account-favorites .account__data {
        display: flex !important;
        gap: 0 !important;
        align-items: stretch !important;
    }
    .account-favorites .account__left {
        width: 240px !important;
        flex-shrink: 0 !important;
        margin-right: -1px;
    }
    .account-favorites .account__right {
        flex: 1 !important;
        min-width: 0 !important;
        border-top: 0;
        border-bottom: 0;
        border-right: 0;
    }
    .account-favorites .account-favorites__empty {
        margin: 20px 0 0 20px;
    }
}
@media (min-width: 1279.98px) {
    .account-favorites .account__left {
        width: 290px !important;
    }
}

/* Favorites product card grid */
.account-favorites .account__right .account-favorites {
    display: flex;
    flex-wrap: wrap;
}
.account-favorites__card {
    margin: 0 -1px -1px 0;
    width: 100%;
    --card-padding: 15px;
    --picture-height: 180px;
    --picture-max-height: var(--picture-height);
    --brand-margin-bottom: 4px;
    --title-margin-bottom: 10px;
}
@media (min-width: 575.98px) {
    .account-favorites__card {
        width: 50%;
    }
}
@media (min-width: 991.98px) {
    .account-favorites__card {
        width: 33.333%;
        --picture-height: 200px;
    }
}
@media (min-width: 1279.98px) {
    .account-favorites__card {
        --picture-height: 230px;
    }
}

/* Prevent section.account-favorites from becoming flex (only inner div should be flex) */
section.account-favorites { display: block !important; }
section.account-favorites > .account__data { display: flex !important; gap: 30px !important; align-items: flex-start !important; }


/* === PROFILE FORM TWO-COLUMN LAYOUT (matches WP original) === */
@media (min-width: 767.98px) {
    .account-profile {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0 40px;
        align-items: start;
    }
    .account-profile__fieldset--contains-user-data {
        grid-column: 1;
        grid-row: 1;
    }
    .account-profile__fieldset--contains-password {
        grid-column: 2;
        grid-row: 1;
    }
    .account-profile__bottom {
        grid-column: 1 / -1;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .account-profile__button {
        order: 2;
    }
    .account-profile__policy {
        order: 1;
    }
}

/* === PROFILE FORM TWO-COLUMN LAYOUT (matches WP original) === */
@media (min-width: 767.98px) {
    form.account-profile {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 0 40px;
        align-items: start;
    }
    form.account-profile .account-profile__fieldset--contains-user-data {
        grid-column: 1;
        grid-row: 1;
    }
    form.account-profile .account-profile__fieldset--contains-password {
        grid-column: 2;
        grid-row: 1;
    }
    form.account-profile .account-profile__bottom {
        grid-column: 1 / -1;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    form.account-profile .account-profile__button {
        order: 2;
    }
    form.account-profile .account-profile__policy {
        order: 1;
    }
}