/*
Theme Name: Musea Child
Theme URI: https://musea.qodeinteractive.com/
Description: A child theme of Musea Theme
Author: Select Themes
Author URI: https://themeforest.net/user/elated-themes
Version: 1.0.1
Text Domain: musea
Template: musea
*/

/*
 * Header minimal desktop layout
 * - Hamburger button on the left
 * - Logo centered in the real width of the header
 * - Right side reserved for the future sidebar/menu phase
 */
@media only screen and (min-width: 1025px) {
  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-position-left,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-position-left {
    float: left;
    text-align: left;
    z-index: 3;
  }

  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-position-left-inner,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-position-left-inner {
    height: auto;
  }

  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-position-center,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-position-center {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 2;
    pointer-events: none;
  }

  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-position-center-inner,
  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-logo-wrapper,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-position-center-inner,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-logo-wrapper {
    pointer-events: auto;
  }

  .eltdf-header-minimal .eltdf-page-header .eltdf-menu-area .eltdf-position-right,
  .eltdf-header-minimal .eltdf-page-header .eltdf-sticky-header .eltdf-position-right {
    float: right;
    text-align: right;
    z-index: 1;
  }
}

/*
 * Header standard + sticky layout
 * - Side Area Opener / hamburger on the left
 * - Logo centered in the real width of the header
 * - Right side reserved for menu/future sidebar phase
 */
@media only screen and (min-width: 1025px) {
  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-vertical-align-containers,
  .eltdf-page-header .eltdf-sticky-header .eltdf-vertical-align-containers {
    position: relative;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-left,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-left {
    float: left;
    text-align: left;
    z-index: 3;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-left-inner,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-left-inner {
    display: inline-flex;
    align-items: center;
    height: 100%;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-left .widget,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-left .widget {
    display: inline-flex;
    align-items: center;
    margin: 0;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-center,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-center {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 2;
    pointer-events: none;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-center-inner,
  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-center .eltdf-logo-wrapper,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-center-inner,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-center .eltdf-logo-wrapper {
    pointer-events: auto;
  }

  .eltdf-header-standard .eltdf-page-header .eltdf-menu-area .eltdf-position-right,
  .eltdf-page-header .eltdf-sticky-header .eltdf-position-right {
    float: right;
    text-align: right;
    z-index: 1;
  }
}

/*
 * Mobile header inverted layout
 * - Mobile menu opener / hamburger on the left
 * - Mobile logo on the right
 * - Desktop header rules remain untouched
 */
@media only screen and (max-width: 1024px) {
  .eltdf-mobile-header .eltdf-vertical-align-containers .eltdf-position-left {
    float: left;
    text-align: left;
    z-index: 3;
  }

  .eltdf-mobile-header .eltdf-vertical-align-containers .eltdf-position-left-inner {
    display: inline-flex;
    align-items: center;
    height: 100%;
  }

  .eltdf-mobile-header .eltdf-vertical-align-containers .eltdf-position-right {
    float: right;
    text-align: right;
    max-width: 80%;
    z-index: 2;
  }

  .eltdf-mobile-header .eltdf-vertical-align-containers .eltdf-position-right-inner {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
  }

  .eltdf-mobile-header .eltdf-position-right-inner .eltdf-mobile-logo-wrapper {
    display: inline-block;
    vertical-align: middle;
  }

  .eltdf-mobile-header .eltdf-position-right-inner .widget {
    display: inline-flex;
    align-items: center;
    margin: 0 0 0 12px;
  }
}

/* Hide the centered desktop header logo on Home, Posts, normal Pages and Musea Shows. */
@media only screen and (min-width: 1025px) {
  body.home .eltdf-page-header .eltdf-position-center .eltdf-logo-wrapper,
  body.blog .eltdf-page-header .eltdf-position-center .eltdf-logo-wrapper,
  body.single-post .eltdf-page-header .eltdf-position-center .eltdf-logo-wrapper,
  body.page .eltdf-page-header .eltdf-position-center .eltdf-logo-wrapper,
  body.single-show-item .eltdf-page-header .eltdf-position-center .eltdf-logo-wrapper {
    display: none !important;
  }
}


/* Make the desktop fixed/header bar transparent while preserving the hamburger opener. */
@media only screen and (min-width: 1025px) {
  body.gary-transparent-desktop-header .eltdf-page-header,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-fixed-wrapper,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-fixed-wrapper.fixed,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-menu-area,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-fixed-wrapper.fixed .eltdf-menu-area,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-sticky-header,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-sticky-holder {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }

  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-fixed-wrapper,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-fixed-wrapper.fixed,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-sticky-header,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-sticky-holder {
    border-bottom: 0 !important;
  }

  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-position-left,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-position-left-inner,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-side-menu-button-opener {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-side-menu-button-opener,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon,
  body.gary-transparent-desktop-header .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon * {
    color: #3f3f3f !important;
  }
}

/*
 * Gary hamburger opener visual
 * - Larger hamburger icon
 * - Semi-transparent black container
 * - White lines/icon
 */
@media only screen and (min-width: 1025px) {
  body .eltdf-page-header .eltdf-side-menu-button-opener,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    padding: 0 !important;
    background-color: #00000021 !important;
    color: #ffffff !important;
    box-sizing: border-box !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener:hover,
  body .eltdf-page-header .eltdf-side-menu-button-opener.opened,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener:hover,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.opened {
    background-color: #00000021 !important;
    color: #ffffff !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon,
  body .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon *,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon * {
    color: #ffffff !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-icon-pack .eltdf-side-menu-icon,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-icon-pack .eltdf-side-menu-icon {
    font-size: 32px !important;
    line-height: 1 !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-hm-lines,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-hm-lines {
    width: 34px !important;
    height: 24px !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-hm-line,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-hm-line {
    height: 4px !important;
    background-color: #ffffff !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-line-2,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-predefined .eltdf-line-2 {
    top: 10px !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg {
    width: 34px !important;
    height: auto !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg line,
  body .eltdf-page-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg path,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg line,
  body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener.eltdf-side-menu-button-opener-svg-path svg path {
    stroke: #ffffff !important;
    fill: #ffffff !important;
  }
}

@media only screen and (max-width: 1024px) {
  body .eltdf-mobile-header .eltdf-mobile-menu-opener > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    height: 52px !important;
    padding: 0 !important;
    background-color: #00000085 !important;
    color: #ffffff !important;
    box-sizing: border-box !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener > a:hover,
  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opened > a {
    background-color: #00000085 !important;
    color: #ffffff !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener .eltdf-mobile-menu-icon,
  body .eltdf-mobile-header .eltdf-mobile-menu-opener .eltdf-mobile-menu-icon * {
    color: #ffffff !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-icon-pack .eltdf-mobile-menu-icon {
    font-size: 32px !important;
    line-height: 1 !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-predefined .eltdf-hm-lines {
    width: 34px !important;
    height: 24px !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-predefined .eltdf-hm-line {
    height: 4px !important;
    background-color: #ffffff !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-predefined .eltdf-line-2 {
    top: 10px !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-svg-path svg {
    width: 34px !important;
    height: auto !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-svg-path svg line,
  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opener-svg-path svg path {
    stroke: #ffffff !important;
    fill: #ffffff !important;
  }
}

/*
 * Gary GN isotype beside hamburger
 * - Shows the GN isotype to the right of the hamburger only while the menu is closed
 * - Uses a child-theme SVG asset so the ZIP remains portable
 */
@media only screen and (min-width: 1025px) {
  body .eltdf-page-header .eltdf-side-menu-button-opener {
    position: relative !important;
    overflow: visible !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener:not(.opened)::after {
    content: "" !important;
    position: absolute !important;
    left: calc(100% + 12px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 42px !important;
    height: 26px !important;
    background-image: url("assets/img/gary-gn-isotype.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    pointer-events: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body .eltdf-page-header .eltdf-side-menu-button-opener.opened::after,
  body.eltdf-right-side-menu-opened .eltdf-page-header .eltdf-side-menu-button-opener::after,
  body.eltdf-side-menu-open .eltdf-page-header .eltdf-side-menu-button-opener::after {
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

@media only screen and (max-width: 1024px) {
  body .eltdf-mobile-header .eltdf-mobile-menu-opener > a {
    position: relative !important;
    overflow: visible !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener:not(.eltdf-mobile-menu-opened) > a::after {
    content: "" !important;
    position: absolute !important;
    left: calc(100% + 12px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 42px !important;
    height: 26px !important;
    background-image: url("assets/img/gary-gn-isotype.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    pointer-events: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  body .eltdf-mobile-header .eltdf-mobile-menu-opener.eltdf-mobile-menu-opened > a::after {
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

/*
 * Gary hamburger icon_menu color override
 * Force ElegantIcons hamburger glyph to white.
 */
body .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon .eltdf-icon-font-elegant.icon_menu,
body .eltdf-page-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon .eltdf-icon-font-elegant.icon_menu::before,
body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon .eltdf-icon-font-elegant.icon_menu,
body .eltdf-page-header .eltdf-sticky-header .eltdf-side-menu-button-opener .eltdf-side-menu-icon .eltdf-icon-font-elegant.icon_menu::before,
body .eltdf-mobile-header .eltdf-mobile-menu-opener .eltdf-mobile-menu-icon .eltdf-icon-font-elegant.icon_menu,
body .eltdf-mobile-header .eltdf-mobile-menu-opener .eltdf-mobile-menu-icon .eltdf-icon-font-elegant.icon_menu::before {
  color: #fff !important;
}
