/* =========================================================
   Raaurum premium header search + Typeahead 0.9.3
   Loaded after style.css so it always wins over theme defaults
   ========================================================= */

.header-area {
    z-index: 40;
}

.right-block-box ul.shop-element li.side-wrap.search-bar-wrap {
    z-index: 50;
    overflow: visible;
}

.search-rap {
    width: 280px !important;
    position: relative;
    z-index: 50;
}

@media (min-width: 1400px) {
    .search-rap {
        width: 320px !important;
    }
}

.search-rap a.search-crap {
    display: none !important;
}

.search-rap .crap-search.collapse {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
}

.search-rap .crap-search,
.search-rap form {
    width: 100%;
    margin: 0;
}

/* Pill container */
.search-rap .form-search {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 44px;
    position: relative !important;
    background: #ffffff !important;
    border: 1px solid rgba(193, 157, 96, 0.45) !important;
    border-radius: 30px !important;
    box-shadow: 0 6px 18px rgba(51, 51, 51, 0.07);
    overflow: visible !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.search-rap .form-search:focus-within {
    border-color: #c19d60 !important;
    box-shadow: 0 8px 24px rgba(193, 157, 96, 0.22);
}

/* Typeahead wrapper must fill the pill */
.search-rap .form-search .twitter-typeahead {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 auto !important;
    vertical-align: top !important;
}

/* Hide typeahead hint (causes gray ghost box / overlapped letters) */
.search-rap .form-search .tt-hint,
.twitter-typeahead .tt-hint,
input.tt-hint {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    pointer-events: none !important;
}

/* Actual search input fills the pill */
.search-rap .form-search input.input-text,
.search-rap .form-search input.typeahead,
.search-rap .form-search input.tt-query,
.search-rap .form-search .twitter-typeahead input.tt-query {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 48px 0 18px !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 30px !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 44px !important;
    color: #333333 !important;
    -webkit-appearance: none;
    appearance: none;
}

.search-rap .form-search input.input-text::placeholder,
.search-rap .form-search input.tt-query::placeholder,
.search-rap .form-search input.typeahead::placeholder {
    color: #9a9a9a !important;
    opacity: 1;
}

/* Gold circular search button */
.search-rap .form-search button.search-btn,
.search-rap .form-search button[name="btnSearchSubmit"],
.search-rap .form-search button {
    position: absolute !important;
    top: 50% !important;
    right: 4px !important;
    left: auto !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    border-radius: 50% !important;
    background: #c19d60 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 15px !important;
    line-height: 1 !important;
    z-index: 6 !important;
    cursor: pointer;
    box-shadow: none !important;
    transition: background 0.25s ease, transform 0.2s ease;
}

.search-rap .form-search button.search-btn:hover,
.search-rap .form-search button:hover {
    background: #a88445 !important;
    color: #ffffff !important;
}

.search-rap .form-search button i {
    display: block;
    line-height: 1;
    color: inherit;
}

/* ---------- Typeahead dropdown (premium) ---------- */
.search-rap .tt-dropdown-menu,
.search-rap .twitter-typeahead .tt-dropdown-menu,
.header-area .tt-dropdown-menu,
.twitter-typeahead .tt-dropdown-menu,
.tt-dropdown-menu {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    left: 0 !important;
    right: 0 !important;
    margin-top: 10px !important;
    padding: 6px 0 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid rgba(193, 157, 96, 0.35) !important;
    border-radius: 16px !important;
    box-shadow: 0 18px 42px rgba(51, 51, 51, 0.18) !important;
    z-index: 99999 !important;
    overflow: hidden !important;
    text-align: left;
}

.tt-dropdown-menu .tt-dataset-products,
.tt-dropdown-menu .tt-suggestions {
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    display: block !important;
}

.tt-dropdown-menu .tt-suggestion,
.tt-suggestion {
    margin: 0 !important;
    padding: 12px 18px !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    color: #333333 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    cursor: pointer;
    border: none;
    border-top: 1px solid rgba(193, 157, 96, 0.12);
    border-left: 3px solid transparent;
    white-space: normal !important;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.tt-dropdown-menu .tt-suggestion:first-child,
.tt-suggestions .tt-suggestion:first-child {
    border-top: none;
}

.tt-suggestion p,
.tt-suggestion span,
.tt-dropdown-menu .tt-suggestion p {
    margin: 0 !important;
    padding: 0 !important;
    color: #333333 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    background: transparent !important;
    white-space: normal !important;
}

.tt-suggestion strong,
.tt-suggestion b {
    color: #c19d60 !important;
    font-weight: 600 !important;
}

.tt-suggestion.tt-is-under-cursor,
.tt-suggestion:hover,
.tt-suggestion.tt-cursor {
    background: #f8f3ea !important;
    background-color: #f8f3ea !important;
    color: #a88445 !important;
    border-left-color: #c19d60;
}

.tt-suggestion.tt-is-under-cursor p,
.tt-suggestion:hover p,
.tt-suggestion.tt-is-under-cursor span,
.tt-suggestion:hover span {
    color: #a88445 !important;
}

/* Search modal (mobile / popup) */
#seachmodal .crap-search .form-search {
    display: flex !important;
    align-items: center;
    position: relative;
    border-bottom: 1px solid rgba(193, 157, 96, 0.35);
}

#seachmodal .crap-search .form-search input.input-text {
    width: 100% !important;
    padding: 14px 48px 14px 0 !important;
    border: none !important;
    background: transparent !important;
    font-size: 16px !important;
    color: #333 !important;
}

#seachmodal .crap-search .form-search button.search-btn {
    color: #c19d60 !important;
    background: transparent !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    right: 0 !important;
}

@media (max-width: 991px) {
    .search-rap {
        display: none !important;
    }
}

/* =========================================================
   Fixed site header: top bar + main nav always fixed at top
   ========================================================= */
#site-header-spacer {
    display: block;
    width: 100%;
    height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    pointer-events: none;
}

.top-notification-bar.is-fixed-top,
.top-notification-bar.is-sticky-top {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1002 !important;
    margin: 0 !important;
}

.header-area.is-fixed-header,
.header-area.sticky,
.header-area.sticky-up,
.header-area.sticky-down {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 1001 !important;
    margin: 0 !important;
    transform: none !important;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    -moz-transform: none !important;
    -o-transform: none !important;
    transition: none !important;
}

.header-area.is-fixed-header,
.header-area.sticky {
    top: 0; /* JS sets exact offset under the top bar */
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
    background-color: var(--background-color-body, #fff);
}

body.header-is-fixed .header-area,
body.header-is-sticky .header-area {
    z-index: 1001 !important;
}

/*====================================
  Mobile: hide gold top bar (cart/wishlist live in nav)
  Mobile drawer above fixed header; breadcrumb smaller
====================================*/
@media (max-width: 1199px) {
    .top-notification-bar {
        display: none !important;
    }

    /* Cart / wishlist icons in main header (next to hamburger) */
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap,
    .right-block-box ul.shop-element li.side-wrap.mobile-cart-wrap {
        display: block !important;
        margin-left: 14px;
    }
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap .header-icon-btn,
    .right-block-box ul.shop-element li.side-wrap.mobile-cart-wrap .header-icon-btn {
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: #1d1d1d;
        font-size: 20px;
        line-height: 1;
        text-decoration: none;
    }
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap .header-icon-count,
    .right-block-box ul.shop-element li.side-wrap.mobile-cart-wrap .header-icon-count {
        position: absolute;
        top: -8px;
        right: -10px;
        min-width: 16px;
        height: 16px;
        padding: 0 4px;
        border-radius: 999px;
        background: #c19d60;
        color: #fff;
        font-size: 10px;
        font-weight: 600;
        line-height: 16px;
        text-align: center;
    }

    /* Fixed header was covering Home / About Us in the drawer */
    .screen-bg {
        z-index: 1100 !important;
    }
    .mobile-menu {
        z-index: 1105 !important;
    }
    .mobile-menu .main-menu-area .box-header {
        position: sticky;
        top: 0;
        z-index: 2;
        background-color: var(--background-color-body, #fff);
    }
    .mobile-menu .megamenu-content .mainwrap ul.main-menu li.menu-link a.link-title.link-title-lg {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
    }

    /* Smaller breadcrumb text on tablet/mobile */
    ul.breadcrumb-list li a,
    ul.breadcrumb-list li span {
        font-size: 14px !important;
    }
    ul.breadcrumb-list li::after {
        margin: 0 4px;
        font-size: 14px;
    }
    .breadcrumb-area .breadcrumb-index .breadcrumb-title h2 {
        font-size: 20px !important;
    }
}

@media (max-width: 767px) {
    ul.breadcrumb-list li a,
    ul.breadcrumb-list li span {
        font-size: 13px !important;
    }
    .breadcrumb-area .breadcrumb-index .breadcrumb-title h2 {
        font-size: 18px !important;
    }
}

@media (min-width: 1200px) {
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap,
    .right-block-box ul.shop-element li.side-wrap.mobile-cart-wrap {
        display: none !important;
    }
}

/* Theme hides all shop-element icons below 479px — keep cart/wishlist/menu */
@media (max-width: 479px) {
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap,
    .right-block-box ul.shop-element li.side-wrap.mobile-cart-wrap,
    .right-block-box ul.shop-element li.side-wrap.toggle-wrap {
        display: block !important;
        margin-left: 12px;
    }
    .right-block-box ul.shop-element li.side-wrap.mobile-wish-wrap:first-child,
    .right-block-box ul.shop-element li.side-wrap.toggle-wrap:first-child {
        margin-left: 0;
    }
}