/*
 * Safqa presentation ownership layer.
 * Native CS-Cart and add-on markup remains intact; this file is loaded last
 * so UniTheme2 supplies behavior without owning the Safqa visual language.
 */

html body.theme-safqa {
    --safqa-ink: #172434;
    --safqa-ink-strong: #102232;
    --safqa-brand: #165a4c;
    --safqa-brand-hover: #0f493d;
    --safqa-accent: #ffd814;
    --safqa-accent-hover: #f7c900;
    --safqa-link: #007e98;
    --safqa-muted: #667581;
    --safqa-line: #d9e1df;
    --safqa-line-soft: #edf1ef;
    --safqa-surface: #ffffff;
    --safqa-surface-muted: #f7f8f6;
    --safqa-radius-sm: 8px;
    --safqa-radius-md: 14px;
    --safqa-shadow: 0 12px 30px rgba(23, 36, 52, .08);
    background: var(--safqa-surface-muted);
    color: var(--safqa-ink);
}

html body.theme-safqa :where(.tygh-content, .tygh-main, .tygh-container, #tygh_main_container) {
    color: var(--safqa-ink);
}

html body.theme-safqa :where(a, button, input, select, textarea) {
    -webkit-tap-highlight-color: transparent;
}

html body.theme-safqa a { color: var(--safqa-link); }
html body.theme-safqa a:hover { color: var(--safqa-brand); }

/* Shared native form controls and buttons. */
html body.theme-safqa :where(.ty-btn, .ty-btn__primary, .ty-btn__secondary, .buttons-container .ty-btn) {
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid var(--safqa-brand);
    border-radius: var(--safqa-radius-sm);
    background: var(--safqa-brand);
    box-shadow: none;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 36px;
    text-shadow: none;
}

html body.theme-safqa :where(.ty-btn, .ty-btn__primary, .ty-btn__secondary, .buttons-container .ty-btn):hover {
    border-color: var(--safqa-brand-hover);
    background: var(--safqa-brand-hover);
    color: #fff;
}

html body.theme-safqa :where(.ty-btn__add-to-cart, .ty-add-to-cart) {
    border-color: var(--safqa-accent);
    background: var(--safqa-accent);
    color: #172434;
}

html body.theme-safqa :where(.ty-btn__add-to-cart, .ty-add-to-cart):hover {
    border-color: var(--safqa-accent-hover);
    background: var(--safqa-accent-hover);
    color: #172434;
}

html body.theme-safqa :where(.ty-input-text, .ty-input-textarea, .ty-select-block__a, select, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], textarea) {
    min-height: 38px;
    border: 1px solid var(--safqa-line);
    border-radius: var(--safqa-radius-sm);
    background: #fff;
    box-shadow: none;
    color: var(--safqa-ink);
    font-size: 12px;
}

html body.theme-safqa :where(.ty-input-text, .ty-input-textarea, select, input, textarea):focus {
    border-color: var(--safqa-brand);
    box-shadow: 0 0 0 3px rgba(22, 90, 76, .12);
    outline: 0;
}

/* Native panels, tabs, pagination, and sideboxes retain their logic. */
html body.theme-safqa :where(.ty-mainbox-container, .ty-sidebox, .ut2-sidebox, .ty-tabs, .ty-pagination, .ty-cart-content, .ty-checkout__block, .ty-profile-field, .ty-orders-detail) {
    border-color: var(--safqa-line);
    border-radius: var(--safqa-radius-sm);
    box-shadow: none;
}

html body.theme-safqa :where(.ty-mainbox-title, .ty-sidebox__title, .ut2-sidebox__title, .ty-tabs__item) {
    color: var(--safqa-ink-strong);
    font-weight: 800;
}

html body.theme-safqa .ty-tabs__item.active .ty-tabs__a,
html body.theme-safqa .ty-tabs__item .ty-tabs__a:hover {
    border-color: var(--safqa-brand);
    color: var(--safqa-brand);
}

html body.theme-safqa :where(.ty-pagination__item, .ty-pagination__btn) {
    min-width: 36px;
    min-height: 36px;
    border: 1px solid var(--safqa-line);
    border-radius: 7px;
    background: #fff;
    color: var(--safqa-ink);
}

html body.theme-safqa :where(.ty-pagination__item, .ty-pagination__btn).active,
html body.theme-safqa .ty-pagination__item:hover {
    border-color: var(--safqa-brand);
    background: var(--safqa-brand);
    color: #fff;
}

/* Native product pages, cards, cart, checkout, and account content. */
html body.theme-safqa :where(.ut2-pb, .ty-product-block, .ty-cart-content, .ty-checkout__block, .ty-profile-field, .ty-orders-detail) {
    border-color: var(--safqa-line);
    background: var(--safqa-surface);
    color: var(--safqa-ink);
}

html body.theme-safqa :where(.ut2-pb__title-wrap h1, .ty-product-block-title, .ty-cart-content__title, .ty-checkout__block-title) {
    color: var(--safqa-ink-strong);
    font-weight: 900;
    letter-spacing: -.015em;
}

html body.theme-safqa :where(.ty-price, .ut2-price, .ty-cart-content__price, .ty-order-products__price) {
    color: var(--safqa-ink-strong);
    font-family: var(--safqa-theme-font-numbers, "Outfit", sans-serif);
    font-weight: 900;
}

html body.theme-safqa :where(.ty-cart-content__product-title, .ty-order-products__item, .ty-checkout__block) a {
    color: var(--safqa-ink);
}

html body.theme-safqa :where(.ty-cart-content__product-title, .ty-order-products__item, .ty-checkout__block) a:hover {
    color: var(--safqa-link);
}

/* UniTheme2 structural classes remain behavior hooks, not visual ownership. */
html body.theme-safqa :where(.ut2-sidebox, .ut2-pb__main-content-box, .ut2-pb__right-wrapper, .ut2-gl__body) {
    background-color: var(--safqa-surface);
}

html body.theme-safqa :where(.ut2-sidebox__title, .ut2-pb__title-wrap, .ut2-gl__name a) {
    color: var(--safqa-ink-strong);
}

/* Safqa header/footer always own their surfaces even when inherited blocks exist. */
html body.theme-safqa #sqSignatureHeader,
html body.theme-safqa #sqSignatureFooter {
    isolation: isolate;
}

html body.theme-safqa #sqSignatureHeader + .tygh-header,
html body.theme-safqa #sqSignatureHeader ~ .tygh-header {
    margin: 0;
}

/* Undo two legacy bundle selectors that paint the category content tail and
   top-menu containers with UniTheme2's navy surface. */
html body.theme-safqa .tygh-header + .tygh-content,
html body.theme-safqa #tygh_main_container > .tygh-content {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    background: var(--safqa-surface) !important;
}

html body.theme-safqa :where(.ut2-h__menu, .top-menu-grid) {
    background: #172434 !important;
}

/* The legacy shell grows to the viewport on category routes and pushes the
   real Safqa footer below a large empty tail. Category content must size to
   its products, filters, pagination, and description only. */
html body.theme-safqa.dispatch-categories-view #tygh_main_container {
    flex: 0 0 auto !important;
    min-height: 0 !important;
    height: auto !important;
}

/* Responsive shared rhythm. Category-specific grids remain in their own files. */
@media (max-width: 900px) {
    html body.theme-safqa :where(.ty-cart-content, .ty-checkout__block, .ut2-pb, .ty-product-block) {
        border-radius: 0;
    }
}

@media (max-width: 600px) {
    html body.theme-safqa :where(.ty-btn, .ty-btn__primary, .ty-btn__secondary, .buttons-container .ty-btn) {
        min-height: 42px;
        line-height: 40px;
    }
}
