﻿@import url('https://fonts.googleapis.com/css2?family=Ysabeau:ital,wght@0,1..1000;1,1..1000&display=swap');

html, body {
  font-family: "Ysabeau", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "Ysabeau", sans-serif;
}

body {
    color: #333;
}

/* Logo i huvudet */
#lay_megawrapper {
	background-image: url("Logo.png");
}


.home-link #imgLogo{
	position:relative;
	width:100px;
}

/*Bakgrundsfärg i huvudet*/
header {
	background-color:#fff;
}


/* meny bar*/
.nav-wrapper {
	background-color:#dbdcbe;
	border-bottom:2px solid #f3f3f3;
	color:#000;
	margin-top:1em;
}


/*egenskap kategori utan underkategori*/
.nav-wrapper a {
	color:#627351;
}


.nav-tree .level1 div.nolink, .nav-tree .level1 > div a, .nav-tree .level1 > a{
	Color:#000;
	font-family:"Ysabeau", sans-serif;
	font-weight:regular;
	text-transform: uppercase;
}

/*egenskap kategori Hover*/
.nav-tree .level1:hover{
	background-color:#627351;
}


/*Aktuell kategori*/
.nav-tree .current{
	background-color:#627351;
}

/*underkategorier*/
.nav-tree .level1 > ul {
	background-color:#627351;
}

/* Hover-effekt på länkar i menyn */
#MainMenu .menu li a:hover {
	background-color: #f7f7f7;
}


/* Hover-effekt för span-taggar (t.ex. Hjälp, Logga in, etc.) */
#MainMenu .menu li span:hover {
	background-color: #f7f7f7;
}


/* För att ändra bakgrundsfärg och textfärg för länkar när de hovras över */
#MainMenu .menu li.title:hover .fw-drawerContent li a:hover {
	background-color: #f7f7f7;
}
  
/* Ta bort ramen från dropdown-menyn */
#MainMenu .menu li.title:hover .fw-drawerContent {
      border: none;  
      box-shadow: none;  
  }
  
/* Ändra bakgrundsfärgen för alla aktiva menyposter */
#MainMenu .menu .active_last>a {
	background-color: #f7f7f7;
}
  
/* Ändra färg för alla aktiva menyposter när underkategori i menyn är vald */
.menu li.active > span.fw-drawerToggle {
	background-color: #f7f7f7;
}
  
/* Ändra färg när för kategorin i huvudmenyn när man hovrar över underkategorierna */
.menu li.title:hover > span.fw-drawerToggle {
	background-color: #f7f7f7;
}

/*Logga in*/
.loginFlyout .login-title {
	color: #000;
	font-family: "Ysabeau",sans-serif;
	font-size: 1.3em;
	font-weight: bold;
	margin-bottom: .3em;
}


/* Neutral stil för vanlig login-text */
.login-form label,
.login-form .hint,
.login-form .forgot-info {
	background-color: transparent !important;
	color: #333 !important; /* Anpassa om du vill ha ljusare eller mÃ¶rkare */
	text-decoration: none;
}

/* "Skapa nytt konto" Återställ rätt färg */
.login-form a[href*="Register"] {
	color: var(--link-color, #627351) !important;
	background-color: transparent !important;
}
  
/* "Skapa nytt konto" Återställ rätt färg vid hover */
.login-form a[href*="Register"]:hover {
	color: var(--link-color, #627351) !important;
	background-color: transparent !important;
}


/*Kundvagn tom*/
.empty .cart-header{
	background-color:#fff;
}


/*Kundvagn fylld*/
.cart-header{
	background-color:#fff;
}


/*Produkt tillagd i varukorg*/
.addedToCart-wrapper{
	background-color: #dbdcbe;
	color:#fff;
}

/*Symbol antal i varukorgen */
.cart-header .cartquantity .quantity {
	background-color: #627351;
}


/*produktbenämning*/
a.itemnamelink{
	color:#171717;
}


/*Header varukorg och kassa */
.table .header {
	background-color: #f7f7f7;
}

/*Varukorg*/
.smallcart{
	border:2px solid #171717;
}

/*varukorgsfot*/
.cart-footer .totalinfo{
	background-color:#f7f7f7;
}

/* Bakgrundsfärg filtermenyerna för alla sidor */
#FilterWrapper.filter-wrapper {
	background-color: #f7f7f7;
}

#Filters.filters {
	background-color: #f7f7f7;
}

/* Sidfot yttre ram */
footer {
	background-color: #f7f7f7;
	border-top: 2px solid #ccc;
}

/* Sidfot inre ram */
footer .footer-inner>div {
	background-color: #fff;
}

/* Knappar – men exkludera plus, minus och bläddringsknappar */
.fw-button:not(.plus):not(.minus):not(.btn-prev):not(.btn-next):not(.btn-first):not(.btn-last) {
    background-color: #627351;
    color: #fff;
    border: none;
}

/* Knappar – men exkludera plus/minus hover */
.fw-button:not(.plus):not(.minus):not(.btn-prev):not(.btn-next):not(.btn-first):not(.btn-last):hover {
    background-color: #515e43;
    color: #fff;
    border: none;
}

/* Bakgrundsfärg formulär kontaktsida */
#ContactFormWrapper {
	background-color: #f7f7f7;
}

/* Bakgrundsfärg formulär skapa konto */
#RegUser.form-wrapper {
	background-color: #f7f7f7;
}

#ProductPrices {
	background-color: #f7f7f7;
}

/* Bakgrundsfärg saldoruta produkt */
#Availability {
	background-color: #f7f7f7;
}

/* Bakgrundsfärg ruta bevakning av produkt */
#Monitor {
	background-color: #f7f7f7;
}

/* Knapp produktfråga frågetecken */
#hlProdAsk .fw-icon-help {
	color: white;
}

/* Kavoritknapp färg hjärta */
#lbtnAddFavorite .fw-icon-heart {
	color: #f44336;
}

/* Kavoritknapp färg hjärta hover */
#lbtnAddFavorite:hover .fw-icon-heart {
	color: #cc0000;
}

/* Bakgrundsfärg rubriker variantlista för ex storlek */
#MainContent_ddlDoubleDim_pnlDataContainer .header {
  background-color: #f7f7f7;
}

/* Bakgrundsfärg varannan rad variantlista för ex storlek */
#MainContent_ddlDoubleDim_pnlDataContainer .row:nth-child(even) {
  background-color: #fbf7f0;
}

/*Header varukorg och kassa */
.table .header {
	background-color: #f7f7f7;
	color: #000;
	font-family: "Ysabeau", sans-serif;
	font-size: 18px;
}

/* Typsnitt rubriker kassa */
.checkout h1, .checkout h2, .checkout h3, .checkout h4, .checkout h5, .checkout h6 {
	font-family: "Ysabeau", sans-serif;
}

/* Bakgrundfärg sida kassa */
.page-Checkout .content-wrapper {
	background-color: #f7f7f7;
}

/* Summeringsruta kassa */
.totalbox {
	background-color: #627351;
	color: #fff;
}

/* Bakgrundsfärg kampanjkod */
#CheckoutCampaign {
	background-color: #fff;
}

/* Bakgrundsfärg kampanjkod bakom ruta */
#ActivateCampaign {
	background-color: #fff;
}

/* Bakgrundsfärg ange tillfällig leveransadress */
#MainContent_MyInfo_DeliveryAddress {
	background-color: #fff;
}

/* Bakgrundsfärg logga in formulär kassa */
#MainContent_MyInfo_login_LoginForm {
	background-color: #f7f7f7;
}

/* Bakgrund formulär kassa */
#MainContent_OtherInfo_ExtraForm {
	background-color: #fff;
}

/* Bakgrundsfärg mitt konto inloggat läge */
#UserInformationWrapper {
	background-color: #f7f7f7;
}

/* Bakgrundsfärg orderöversikt mitt konto */
#SelectWrapper {
	background-color: #f7f7f7;
}

/* Bakgrundsfärg favoriter mitt konto inloggat läge */
#MainContent_FavouritesWrapper {
	background-color: #f7f7f7;
}

/* Länkfärg */
a {
    color: #627351;
    text-decoration: none;
}

/* Länkfärg glömt lösenord */
.forgotten-link .link-image {
    color: #627351;
}

/* Länkfärg skapa nytt konto */
.register-link .fw-button {
    color: #627351;
}

/* Bakgrundsfärg på knapparna för underkategorer när man klickat i menyn */
#MainContent_GroupView .group-title {
  display: block;
  background-color: #627351;
  color: #fff;
}

/* Bakgrundsfärg på knapparna för underkategorer när man klickat i menyn hover */
#MainContent_GroupView .group-title:hover {
  background-color: #515e43;
  color: #fff;
}


/* Anger om språkval ska visas eller ej */
.flags {
	display: none;
}

.startView .prodlist-header .list_info h1:first-child {
  display: none;
}

.prodlist-header .list_info h1:first-child {
  display: none;
}




  /* BakgrundsfÃ¤rg meny header mobillÃ¤ge */
  @media screen and (max-width: 950px) {
      .header-top {
          background-color: #fff;
      }
  }

  /* FÃ¤rg text meny header mobillÃ¤ge */
  @media screen and (max-width: 950px) {
      .menu-open-btn {
          color: #000;
      }
  }

  /* Bakgrundsfärg meny headet när man klickat ut menyn i mobillÃ¤ge */
  @media screen and (max-width: 950px) {
    .nav-menu {
        background-color: #fff;
	color: #000;
        visibility: visible;
        -webkit-transition: visibility 0s ease 0s,max-height 1s ease 0s;
        transition: visibility 0s ease 0s,max-height 1s ease 0s;
    }
  }

  @media screen and (max-width: 950px) {
    .nav-menu,.nav-menu a {
        color: #000;
    }
  }

  @media screen and (max-width: 950px) {
    .nav-menu li a:hover,.nav-menu li span:hover {
        color: #000;
    }
  }

@media screen and (max-width: 950px) {
    .nav-menu .close-btn::before {
        color: #000;
    }
  }


  @media (min-width: 951px) {
      #MainMenu .level1 ul a {
          color: #000;
      }
  }
  
  /* Ikoner kategorimeny mobilläge */
.header-icons,.header-icons a {
    color: #444;
}

.scrolled .header-icons,.scrolled .header-icons a {
    color: #444;
}


.nav-wrapper .close-btn::before {
    color: #000;
}
  
  /* BakgrundsfÃ¤rg header skrollat lÃ¤ge */
  .scrolled .logo {
      background-color: #fff;
  }


/* Varukorg färg på antal i mobilläge */
.cart-open-btn .quantity {
    background-color: #627351;
}

/* Varukorg färg på antal i mobilläge i skrollat läge*/
.scrolled .cart-open-btn .quantity:not(.empty) {
        background-color: #627351;
}


/* Bakgrundsfärg varukorg mobilläge */
.smallcart{
	background-color: #f7f7f7;
	border: none;
}

/* Bakgrundsfärg logga in formulär mobilläge */
@media screen and (max-width: 950px) {
    .form-wrapper {
        background-color: #f7f7f7;
    }
}


/* Centrera loggan skrollat mobilläge */
.scrolled .logo {
    background-color: #fff;
    min-height: 100px;
    padding: 10px 15px;

    left: 0;
    width: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* Hindra själva loggan från att krympas */
.scrolled .logo img,
.scrolled #imgLogo,
.scrolled .PNGLogo {
    height: 100px !important;
    max-height: none !important;
    width: auto !important;
    transform: none !important;
}
