/* ======================== HEADER =========================== */

@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&display=swap");

/* --- title */
.header-title{
  display:none !important;
}

/* --- wrapper */
.navigation-wrapper{
  max-width:100% !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* --- header */
.header-navigation{
  height:130px !important;
  background-color:var(--color-primary) !important;
  overflow:visible !important;
}

#header{
  padding-top:130px !important;
}

/* --- grid */
.header-navigation > div{
  max-width:100% !important;
  width:100% !important;

  display:grid !important;
  grid-template-columns:1fr auto !important;
  grid-template-rows:60px 70px !important;
  align-items:center !important;

  height:100% !important;
  column-gap:16px !important;

  padding-left:16px !important;
  padding-right:16px !important;

  overflow:visible !important;
}

/* --- logo */
#header .site-name{
  grid-column:1;
  grid-row:1;

  float:none !important;
  margin:0 !important;

  height:60px !important;
  display:block !important;

  position:relative !important;
  overflow:visible !important;
  z-index:6 !important;
}

#header .site-name a{
  display:block !important;
  height:60px !important;
  line-height:0 !important;
  position:relative !important;
  overflow:visible !important;
}

#header .site-name a img{
  position:absolute !important;
  left:0 !important;
  top:10px !important;

  width:210px !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;

  display:block !important;
  z-index:6 !important;
}

/* --- buttons */
.navigation-buttons{
  grid-column:2;
  grid-row:1;

  float:none !important;

  display:flex !important;
  align-items:center !important;
  gap:10px !important;

  z-index:7 !important;
}

/* --- navrow */
#navigation{
  grid-column:1 / -1;
  grid-row:2;

  clear:none !important;
  position:static !important;
  visibility:visible !important;

  width:100% !important;
  height:auto !important;
  min-height:70px !important;

  display:flex !important;
  align-items:center !important;

  overflow:visible !important;
  z-index:5 !important;
}

/* --- navpos */
.navigation-in{
  position:static !important;
  left:auto !important;
  top:auto !important;
  width:100% !important;
}

/* --- navlist */
.navigation-in > ul{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
}

/* --- navitems */
.navigation-in > ul > li > a{
  height:44px !important;
  padding:0 12px !important;
  display:flex !important;
  align-items:center !important;
  white-space:nowrap !important;
}

/* --- flexlink */
#header #navigation .menu-level-1 > li > a,
#header .menu-helper .menu-level-1 > li > a{
  display:flex !important;
  align-items:center !important;
  width:100% !important;
}

/* --- type */
#header #navigation .navigation-in > ul > li > a{
  font-family:"Libre Baskerville", serif !important;
  font-size:16.5px !important;
  font-weight:bold !important;
  letter-spacing:0.03em !important;
  text-transform:uppercase !important;
  color:#000 !important;

  transform:translateY(8px) !important;
}

/* --- colors */
#header #navigation .navigation-in a,
#header #navigation .navigation-in a b,
#header #navigation .navigation-in a span{
  color:#000 !important;
}

/* --- arrows */
#header #navigation .submenu-arrow,
#header #navigation .submenu-arrow:after{
  color:#000 !important;
}

/* --- icons */
#header .navigation-buttons a,
#header .navigation-buttons button,
#header .navigation-buttons a:before,
#header .navigation-buttons a:after,
#header .navigation-buttons button:before,
#header .navigation-buttons button:after,
#header .navigation-buttons a i{
  color:#000 !important;
}

/* --- spacing */
#header #navigation .navigation-in > ul.menu-level-1{
  justify-content:center !important;
  gap:44px !important;
  flex-wrap:wrap !important;
}

/* --- dropdown */
.navigation-in ul.menu-level-2{
  top:calc(100% + 10px) !important;
}

#header #navigation .navigation-in ul.menu-level-2{
  left:auto !important;
  right:0 !important;
  margin-right:0 !important;

  width:max-content !important;
  min-width:260px !important;
}

#header #navigation .navigation-in ul.menu-level-2 > li > a{
  font-family:"DM Serif Display", serif !important;
  font-size:14px !important;
  letter-spacing:0.03em !important;
  text-transform:uppercase !important;
  color:#000 !important;

  padding:12px 16px !important;
  white-space:nowrap !important;
}

#header #navigation .navigation-in > ul.menu-level-1 > li > a b{
  font-weight: 700 !important;
}


/* --- MOVING THE WIDGETS TO THEIR ICONS*/
.popup-widget.search-widget{
  left: auto;
  right: 88px;
  margin-left: 0;

  width: 640px;
  max-width: calc(100vw - 32px);

  top: 56px;
}

.popup-widget.search-widget:before{
  right: 64px;
}

.popup-widget.search-widget .popup-widget-inner{
  overflow-x: hidden;
}

.popup-widget.login-widget{
  left: auto;
  right: 28px;
  margin-left: 0;

  width: 640px;
  max-width: calc(100vw - 32px);

  top: 56px;
}

.popup-widget.login-widget:before{
  right: 64px;
}

.popup-widget.login-widget .popup-widget-inner{
  overflow-x: hidden;
}


a.toggle-window[data-target="navigation"][data-testid="hamburgerMenu"]{
  display: none !important;
}

/* --- Top INFO Stripe */

#tp-topstripe {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2147483647;
  background: #624219;
  color: #ffffff;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  box-sizing: border-box;
  padding: 3px 8px; 
}

#tp-topstripe .tp-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

#tp-topstripe .tp-left {
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

#tp-topstripe .tp-right {
  text-align: right;
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: flex-end;
  white-space: nowrap;
}

#tp-topstripe .tp-right a {
  color: #ffffff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.55);
  padding-bottom: 1px;
}

#tp-topstripe .tp-right a:hover,
#tp-topstripe .tp-right a:focus {
  border-bottom-color: #ffffff;
}

/* --- Top INFO Stripe - OVERLAPPING PNG*/

#tp-topstripe{
  overflow: visible;
}

#tp-topstripe .tp-inner{
  position: relative;
  z-index: 1;
}

#tp-topstripe::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -14px !important;         /* Uprava pixelu overlapu */
  height: 36px !important;
  width: 100% !important;       
  z-index: 0;
  pointer-events: none;

  background-image: url("https://www.ususeno.cz/user/documents/upload/Styly/brown-line-624219.png");
  background-repeat: repeat-x;
  background-position: center top;
  background-size: 160% 36px !important;
}
/* ======================== END HEADER =========================== */