/*Huvudinställning custom-header*/
.custom-header{
	/*Ifall man vill att menyn alltid skall vara synlig*/
	/*width: 100%;position: fixed;top: 0;z-index: 99;*/
	color:black;
}

/*Inställning navbar-toggle*/
.navbar-toggle {
	background-color: black;
	margin: 10px 0px 0px 0px;
}

/*Inställning icon-bar*/
.navbar-toggle .icon-bar {
	background-color: white;
}

/*Inställning header tag*/
header{
	position: absolute;
}

/*Inställning navbar*/
.navbar {
	float: right;
	border: none;
}

/*Huvudmeny container*/
.main-container-navbar{
	position: relative;
	z-index: 40;
}

/*container som innehåller logo*/
.custom-logo-wrapper{
	
}

/*container som innehåller menyknappar*/
.custom-meny{
	
}

/*Dropdown meny*/
.dropdown-menu{
	
}

/*Menyknapp*/
.custom-meny-btn{
	background-color: white;
}

/*Menyknapp hover*/
.custom-meny-btn:hover{
	
}

/*Dropdown menyknapp*/
.custom-meny-dropdown-btn{
	text-decoration: none;
	display: block;
	padding: 2px 0px 2px 10px;
	color: black;
}

/*Dropdown menyknapp hover*/
.custom-meny-dropdown-btn:hover{
	text-decoration: none;
	background-color: whitesmoke;
}

/*Länkar*/
.custom-meny-url{
	text-decoration: none;
	color: black;
}

/* =========================================
   HEADER (drop-in) + shrink + transparent on scroll
   - Ingen ny HTML behövs
   - Kräver header-scroll.js (se nedan)
   ========================================= */

/* VIKTIGT: döda din gamla globala regel "header { position: absolute; }" */
header{
  position: relative; /* gör att sticky kan fungera */
}

/* ===== HEADER WRAPPER ===== */
.main-header{
  position: sticky;
  top: 0;
  z-index: 999;

  background:#ffffff;
  border-bottom:1px solid #eee;

  transition:
    background-color .25s ease,
    backdrop-filter .25s ease,
    border-color .25s ease,
    box-shadow .25s ease;
}

/* ===== INNER LAYOUT ===== */
.menu-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;

  gap:14px;
  padding:18px 40px;

  transition: padding .25s ease, gap .25s ease;
}

/* ===== LOGO ===== */
.custom-logo-wrapper{
  display:flex;
  justify-content:center;
  width:100%;
}

.getheaderlogo{
  max-height:55px;
  width:auto;
  transition: max-height .25s ease, filter .25s ease;
}

/* ===== NAV ===== */
.custom-navbar{ width:100%; }
.navbar-toggler{ margin-left:auto; }
.navbar-collapse{ justify-content:center; }

/* ===== MENU ===== */
.custom-meny{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:35px;

  width:100%;
  padding-left:0;
  margin:0;
}

.custom-meny-btn{
  background:transparent;
}

/* Links */
.custom-meny-url{
  font-size:15px;
  font-weight:500;
  color:#111 !important;

  position:relative;
  padding:10px 0 !important;
  text-decoration:none;

  transition: color .25s ease, opacity .25s ease;
}

/* Hover underline */
.custom-meny-url::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-4px;
  width:0;
  height:2px;
  background:#111;
  transition:width .25s ease;
}

.custom-meny-url:hover::after{ width:100%; }

/* Dropdown */
.dropdown-menu{
  border:none;
  border-radius:10px;
  box-shadow:0 10px 30px rgba(0,0,0,0.08);
  padding:10px 0;
  margin-top:15px;
}

.custom-meny-dropdown-btn{
  font-size:14px;
  padding:10px 20px;
  transition: background-color .2s ease;
}

.custom-meny-dropdown-btn:hover{
  background:#f7f7f7;
}

/* =========================================
   SCROLLED STATE (JS lägger till .is-scrolled)
   ========================================= */
.main-header.is-scrolled{
  background-color: rgba(255,255,255,0.55); /* transparens */
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  border-bottom-color: rgba(0,0,0,0.08);
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
}

/* mindre header */
.main-header.is-scrolled .menu-inner{
  padding: 8px 40px;
  gap: 8px;
}

/* mindre logo */
.main-header.is-scrolled .getheaderlogo{
  max-height:40px;
}

/* =========================================
   MOBILE
   ========================================= */
@media (max-width:991px){
  .menu-inner{
    align-items:stretch;
    padding:14px 20px;
  }

  .custom-logo-wrapper{
    justify-content:flex-start; /* byt till center om du vill */
  }

  .custom-meny{
    flex-direction:column;
    align-items:stretch;
    gap:0;
    margin-top:10px;
  }

  .custom-meny-btn{
    background:#fff;
    border-bottom:1px solid #111;
    padding:4px 0;
  }

  .dropdown-menu{
    box-shadow:none;
    border-radius:0;
    margin-top:0;
  }

  .custom-meny-url::after{ display:none; }

  /* scrolled på mobil */
  .main-header.is-scrolled .menu-inner{
    padding: 8px 20px;
  }
}

/*Inställning för mobil*/
@media (max-width: 767px){
	.navbar {
		float: none;
		width: 100%;
	}

	.navbar-collapse {
		clear: both;
		margin-left: -15px;
		margin-right: -15px;
	}

	.custom-meny-btn{
		background-color: white;
		border-bottom: 1px solid black;
	}
}