﻿@font-face{font-family:Yekan Bakh VF;src:url(../fonts/yekanbakh/YekanBakh-VF.woff2) format("woff2-variations"),url(../fonts/yekanbakh/YekanBakh-VF.woff) format("woff-variations");font-weight:100 900;font-style:normal;font-display:swap}.ryan-hdr2{font-family:Yekan Bakh VF,Tahoma,sans-serif}@media (min-width:992px){.ryan-hdr2{background:#fff;box-shadow:none;margin:0!important;padding:0!important}.ryan-hdr2>.size{display:flex;align-items:center;justify-content:space-between;width:100%!important;max-width:none!important;min-height:82px;margin:0!important;padding:0 56px!important}.ryan-hdr2>.size:after,.ryan-hdr2>.size:before{content:none}.ryan-hdr2 .vp-header-left,.ryan-hdr2 .vp-header-right{display:flex;align-items:center;float:none;width:auto;margin:0;padding:0}.ryan-hdr2 .vp-header-right{flex:0 1 auto;min-width:0}.ryan-hdr2 .vp-header-left{flex:0 0 auto;margin-left:62px}.ryan-hdr2 .vp-logo{display:flex;align-items:center;flex:0 0 120px;float:none!important;width:120px!important;margin:0 0 0 24px!important;padding:0!important}.ryan-hdr2 .vp-logo a{display:block}.ryan-hdr2 .vp-logo img{display:block;width:120px;height:auto;max-width:120px;-o-object-fit:contain;object-fit:contain;margin:0!important}.ryan-hdr2 .vp-search-box{box-sizing:border-box;flex:0 0 674px!important;width:674px!important;max-width:674px!important;min-width:0;float:none!important;margin:0!important;padding:0!important}.ryan-hdr2 .vp-search-box .vp-search-box-inner,.ryan-hdr2 .vp-search-box .vp-search-box-inner .vp-form{width:100%!important;max-width:none!important;height:auto!important;min-height:0;margin:0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}.ryan-hdr2 .vp-search-box form{position:relative;display:flex;align-items:center;box-sizing:border-box;width:100%;height:48px;margin:0;padding:0 19px 0 14px;background:#f0f0f1;border-radius:24px;border:1px solid #ececec;box-shadow:0 1px 3px rgba(0,0,0,.045)}.ryan-hdr2 .vp-search-box form:focus-within{border-color:#dadce0;box-shadow:0 1px 3px rgba(0,0,0,.06)}.ryan-hdr2 .vp-search-box form input[name=q]{flex:1 1 auto;min-width:0;height:100%;margin:0;padding:0;background:transparent;border:0;border-radius:0;outline:0;box-shadow:none;font-family:Yekan Bakh VF,Tahoma,sans-serif;font-size:16px;line-height:46px;color:#202124}.ryan-hdr2 .vp-search-box form input[name=q]::-moz-placeholder{color:#8f8f8f;opacity:1}.ryan-hdr2 .vp-search-box form input[name=q]::placeholder{color:#8f8f8f;opacity:1}.ryan-hdr2 .vp-search-box form input[name=q]::-webkit-search-cancel-button,.ryan-hdr2 .vp-search-box form input[name=q]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}.ryan-hdr2 .vp-search-box .vp-form:after,.ryan-hdr2 .vp-search-box .vp-form:before,.ryan-hdr2 .vp-search-box form:after,.ryan-hdr2 .vp-search-box form:before{content:none!important;display:none!important}.ryan-hdr2 .rh-field-divider,.ryan-hdr2 .vp-search-box .dot-loader,.ryan-hdr2 .vp-search-box .vp-form-place-holder,.ryan-hdr2 .vp-search-box .vp-search-loading,.ryan-hdr2 .vp-search-box form .close-page,.ryan-hdr2 .vp-search-box form .vp-search-box-loading,.ryan-hdr2 .vp-search-box form>.justDesktop:not(.rh-search-actions),.ryan-hdr2 .vp-search-box form>.justMobileTablet{display:none!important}.ryan-hdr2 .vp-search-box form:has(input[name=q]:not(:-moz-placeholder-shown))>.justDesktop:not(.rh-search-actions){display:flex!important}.ryan-hdr2 .vp-search-box form:has(input[name=q]:not(:placeholder-shown))>.justDesktop:not(.rh-search-actions){display:flex!important}.ryan-hdr2 .vp-search-box form:has(input[name=q]:not(:-moz-placeholder-shown)) .rh-field-divider{display:block!important}.ryan-hdr2 .vp-search-box form:has(input[name=q]:not(:placeholder-shown)) .rh-field-divider{display:block!important}.ryan-hdr2 .vp-search-box form>.justDesktop:not(.rh-search-actions){flex:0 0 auto;align-items:center;margin:0 0 0 10px;padding:0}.ryan-hdr2 .vp-search-box form .vp-search-box-clean{position:static!important;display:flex!important;align-items:center;justify-content:center;top:auto!important;inset-inline-start:auto!important;inset-inline-end:auto!important;transform:none!important;width:24px!important;height:24px!important;margin:0!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;color:#474747!important;cursor:pointer;opacity:1}.ryan-hdr2 .vp-search-box-clean i{display:none}.ryan-hdr2 .vp-search-box-clean svg{display:block;width:13px;height:13px}.ryan-hdr2 .rh-field-divider{flex:0 0 auto;width:1px;height:30px;margin:0 0 0 10px;background:#dadce0}.ryan-hdr2 .rh-search-actions{display:flex!important;align-items:center;gap:13px;flex:0 0 auto;margin:0 0 0 13px;padding:0}.ryan-hdr2 .rh-search-action{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin:0;padding:0;background:none;border:0;border-radius:0;color:#474747!important;cursor:pointer}.ryan-hdr2 .rh-search-action svg{display:block}.ryan-hdr2 .rh-search-action--mic svg{width:13px;height:18px}.ryan-hdr2 .rh-search-action--lens svg{width:17px;height:17px}.ryan-hdr2 .vp-search-box form button.vp-btn[type=submit]{position:static!important;display:flex!important;align-items:center;justify-content:center;flex:0 0 auto;top:auto!important;left:auto!important;right:auto!important;transform:none!important;width:24px!important;height:24px!important;min-width:0;margin:0!important;padding:0!important;background:none!important;background-image:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#474747!important;cursor:pointer}.ryan-hdr2 .vp-search-box form button.vp-btn[type=submit] svg{display:block;width:16px!important;height:16px!important;transform:none!important}.ryan-hdr2 .vp-search-box .vp-search-box-result{top:56px}.ryan-hdr2 .vp-login{position:relative;flex:0 0 auto;float:none!important;width:auto!important;margin:0!important;padding:0!important}.ryan-hdr2 .vp-login>.vp-inner{gap:12px;height:auto!important;background:none!important;border:0!important}.ryan-hdr2 .vp-login>.vp-inner,.ryan-hdr2 .vp-login>.vp-inner>a{display:flex!important;align-items:center;margin:0!important;padding:0!important}.ryan-hdr2 .vp-login>.vp-inner>a{justify-content:center;flex:0 0 30px;width:30px!important;height:30px!important;color:#8f8f8f}.ryan-hdr2 .vp-login>.vp-inner>a .rh-account-icon{display:block;width:30px;height:30px;transform:translateX(-2.9px);filter:brightness(.62)}.ryan-hdr2 .vp-login>.vp-inner #vp-title-inner-login{margin:0;padding:0;font-size:13px!important;line-height:1;color:#4a5f73!important;white-space:nowrap}.ryan-hdr2 .vp-login>.vp-inner>.fa-angle-down{display:none}.ryan-hdr2 .rh-block-divider{flex:0 0 auto;width:1px;height:24px;margin:0 15px 0 19px;background:#dadce0}.ryan-hdr2 .vp-mini-cart{position:relative;flex:0 0 auto;float:none!important;width:auto!important;margin:0!important;padding:0!important}.ryan-hdr2 .vp-mini-cart>.vp-inner{display:flex!important;align-items:center;gap:8.5px;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important;background:none!important;border:0!important;border-radius:0!important}.ryan-hdr2 .rh-cart-icon{position:relative;display:flex;align-items:center;justify-content:center;width:27px;height:27px}.ryan-hdr2 .rh-cart-icon .rh-cart-glyph{display:block;width:27px;height:27px;transform:translate(.5px,-1.8px);filter:brightness(.62)}.ryan-hdr2 .rh-cart-label{font-size:13px;line-height:1;color:#4a5f73;white-space:nowrap}.ryan-hdr2 .vp-mini-cart .vp-number{position:absolute;bottom:16px;inset-inline-start:0;display:flex;align-items:center;justify-content:center;min-width:15px;height:15px;margin:0 3px 0 0;padding:0 3px;background:#f05596;border:0;border-radius:999px}.ryan-hdr2 .vp-mini-cart .vp-number,.ryan-hdr2 .vp-mini-cart .vp-number .vp-value{color:#fff;font-size:10px;line-height:1}}.tw-flex{display:flex}.tw-min-w-0{min-width:0}.tw-shrink-0{flex-shrink:0}.tw-items-center{align-items:center}

/* ==========================================================================================
   DESKTOP HEADER SEARCH - ACTION ORDER AND DISABLED STATES
   -------------------------------------------------------
   Physical order, measured left to right at 1440 before this block:
   [ mic ][ lens ][ submit ][ input ]  ->  reading the RTL row from the input outward, the
   magnifier came LAST, behind both of the extras.

   The row is a flex container, so the order is fixed with `order` on the existing elements -
   nothing is moved in the markup, duplicated, or absolutely positioned. The input keeps the
   implicit 0 and stays at the start of the row; the submit is pulled to sit against it, and the
   extras group follows. Inside that group the lens is placed before the mic.

   Final physical order, right to left in the RTL row:
   [ input ][ search ][ image ][ voice ]

   The two extras are switched off here as well: `pointer-events: none` means no click, no
   handler, no getUserMedia prompt, while the markup, the SVGs and the features behind them stay
   exactly where they are. Both buttons already carry `tabindex="-1"` inside an `aria-hidden`
   group, so there is no keyboard or assistive path to them either. The reduced opacity is the
   only visual change - same size, same position, same row rhythm.

   Desktop only: the group is `.justDesktop`, and everything here is inside the same
   (min-width: 992px) query the rest of this file's header work uses. The mobile search header is
   a different component and is untouched.
   ========================================================================================== */
@media (min-width: 992px) {
    .ryan-hdr2 .vp-search-box form > .vp-btn {
        order: 1;
    }

    .ryan-hdr2 .vp-search-box form > .rh-search-actions {
        order: 2;
        /* One rhythm across all three actions. The group already spaced its own two children
           (13px) but nothing sat between the group and the submit, so the magnifier and the lens
           were touching while the lens and the mic were 13px apart. The group's own gap sets the
           first pair and its physical-right margin - the edge that faces the submit in this RTL
           row - sets the second, so both are stated by the same owner. */
        gap: 16px;
        margin-right: 16px;
    }

    .ryan-hdr2 .rh-search-actions .rh-search-action--lens {
        order: 1;
    }

    .ryan-hdr2 .rh-search-actions .rh-search-action--mic {
        order: 2;
    }

    .ryan-hdr2 .rh-search-action--lens,
    .ryan-hdr2 .rh-search-action--mic {
        pointer-events: none;
        cursor: default;
        opacity: .45;
    }
}

/* ==========================================================================================
   SHARED DESKTOP HEADER GRID
   --------------------------
   ONE container for the whole header, on every page. Both header rows use the theme's own
   `.size` grid - `width: 98%; max-width: 1676px; margin: auto` - so at any viewport that can
   hold it the header's content box is exactly 1676px and centred, and below that it stays on
   the same responsive rule the rest of the site uses.

   Two things were in the way. The logo row was pulled off that grid by the `.ryan-hdr2 > .size`
   override at the top of this file (`width: 100% !important; max-width: none !important;
   margin: 0 !important; padding: 0 56px !important`), which made it full-bleed with a 56px
   gutter; and the correction for it previously lived in category.less under
   `body.page-category`, so the header was aligned one way on the listing and another way
   everywhere else. Both are settled here, unscoped: there is no page-specific header geometry
   left anywhere.

   The right inset is cleared so both rows end on the grid's own edge - the same edge the
   listing's breadcrumb rail already uses - and the rightmost menu item gives up its outer
   gutter so the navigation starts flush to it. Horizontal only: no heights, no rows, no
   vertical spacing, and no page content.
   ========================================================================================== */
@media only screen and (min-width: 960px) {
    #vp-header .vp-middle-header > .size {
        width: 98% !important;
        max-width: 1676px !important;
        margin: auto !important;
        /* Flush on BOTH edges: the logo already ends on the grid's right edge, so the utility
           group starts on its left edge. `.size`'s own 20px gutter is what stood between them. */
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* ...and this was the other 62px of the 82px inset. `margin-left: 62px` at the top of this
       file was measured against the old full-bleed header, whose 56px gutter it sat inside. On
       the 1676px grid it is just dead space in front of the cart. */
    #vp-header .vp-middle-header .vp-header-left {
        margin-left: 0;
    }

    #vp-header .vp-top-menu > .size {
        padding-left: 0;
        padding-right: 0;
    }

    #vp-header .vp-top-menu .vp-category-menu.right-menu ul .vp-category-menu-list:first-child .vp-category-list-item {
        padding-right: 0;
    }
}
