/*
Theme Name: Beaver Builder Child Theme
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: An example child theme that can be used as a starting point for custom development.
Author: The Beaver Builder Team
Author URI: http://www.fastlinemedia.com
template: bb-theme
*/

/* Add your custom styles here... */ 


/*MEDIASCREEN DATOR*/
@media only screen and (min-width: 993px) {
	
}

/*MEDIASCREEN PLATTA*/
@media only screen and (min-width: 769px) and (max-width: 992px) {
	
}

/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {

}

/* =======================================================================================================================================================================
                                                                          Fonter - inläsning 
======================================================================================================================================================================= */




/* =======================================================================================================================================================================
                                                                          Fonter - Anpassning 
======================================================================================================================================================================= */


body {
	font-family: "Inter", sans-serif;
}


h1 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	letter-spacing: 3px;
	font-style: bold;
}

h2 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-style: bold;
}

h3 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-style: bold;
}

h4 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-style: bold;
}

h5 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-style: bold;
}

h6 {
	font-family: "Inter", sans-serif;
	font-weight: 700;
	font-style: bold;
}

p, li, ul {
	font-family: "Inter", sans-serif;
	font-weight: 400;
	font-style: normal;
	margin-bottom: 20px;
}

.fl-main-content a span {
	font-family: "Inter", sans-serif;
	font-weight: 400;
	line-height:120%;
	
}

button, span {
	font-family: "Inter", sans-serif;
	line-height:120%;
}

.menu-item a { 
	font-family: "Inter", sans-serif;
	line-height:120%;
}


.vit-text, .vit-text h1, .vit-text h2, .vit-text h3, .vit-text h4, .vit-text h5, .vit-text h6, .vit-text p, .vit-text a, .vit-text span {
	color: #fff !important;
}

.svart-text, .svart-text h1, .svart-text h2, .svart-text h3, .svart-text h4, .svart-text h5, .svart-text h6, .svart-text p, .svart-text a, .svart-text span {
	color: #000 !important;
}

/*MEDIASCREEN DATOR*/
@media only screen and (min-width: 993px) {
	
	h1 {
		font-size:40px;
		margin-top:0px;
		margin-bottom:20px;
	}
	
	h2 {
		font-size:40px;
		margin-top:0px;
		margin-bottom:20px;
		
	}
	
	h3 {
		font-size:30px;
	}
	
	h4 {
		font-size:20px;
		margin-bottom:10px;
	}
	
	h4 a {
		font-size:20px !important;
		margin-bottom:10px;
	}
	
	
	h5 {
		font-size:20px;
	}
	
	h6 {
		font-size:17px;
	}
	
	p, li, ul	{
		font-size:16px;
	}
	
	a	{
		font-size:16px;
	}
	
}

/*MEDIASCREEN PLATTA*/
@media only screen and (min-width: 769px) and (max-width: 992px) {
	
	h1 {
		font-size:30px;
		margin-top:10px;
	}
	
	h2 {
		font-size:30px;
		margin-top:10px;
	}
	
	h3 {
		font-size:25px;
	}
	
	h4 {
		font-size:20px;
		margin-bottom:0px;
	}
	
	h4 a {
		font-size:20px !important;
		margin-bottom:10px;
	}
	
	h5 {
		font-size:15px;
	}
	
	h6 {
		font-size:15px;
	}
	
	p	{
		font-size:16px;
	}
	
	a	{
		font-size:15px;
	}
}

/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {

	h1 {
		font-size:30px;
		margin-top:10px;
	}
	
	h2 {
		font-size:30px;
		margin-top:10px;
	}
	
	h3 {
		font-size:25px;
	}
	
	h4 {
		font-size:20px;
		margin-bottom:0px;
	}
	
	h4 a {
		font-size:20px !important;
		margin-bottom:10px;
	}

	h5 {
		font-size:18px;
	}
	
	h6 {
		font-size:18px;
	}
	
	p	{
		font-size:16px;
	}
	
	a	{
		font-size:16px;
	}
	
	
}



/* =======================================================================================================================================================================
                                                                          Header
======================================================================================================================================================================= */

.fl-builder-content[data-type="header"].fl-theme-builder-header-sticky {
	z-index: 300;
}


.header-logo {
	width: inherit !important;
	margin: auto;
	transition:  ease-in-out .5s;
}

.header-logo img {
	max-height: unset !important;
	transition:  ease-in-out .5s;
}

.fl-theme-builder-header-shrink .header-logo {
	width: 200px !important;
	transition:  ease-in-out 1s;
	margin: auto;
	margin-bottom: 10px;
}

.kolumn-logo div,
.pp-photo-content-inner a {
	height: 100%;
	transition:  ease-in-out .5s;
}


.kolumn-logo .fl-col-content {
    margin-right: 0px;
    display: block;
}

/* --- Responsiva SoMe-ikoner i header - Styling --- */

header .fl-icon-group {
		flex-wrap: nowrap !important;
		gap: 2 !important;
	}

/*MEDIASCREEN PLATTA*/
@media only screen and (min-width: 769px) and (max-width: 1445px) {

	header .fl-icon-group {
		flex-wrap: nowrap !important;
		gap: 2 !important;
	}
	
	#menu-huvudmeny-uppdelad-1 a,
	#menu-huvudmeny-uppdelad-1 .menu-item-text,
	#menu-huvudmeny-uppdelad-2 a,
	#menu-huvudmeny-uppdelad-2 .menu-item-text{
		font-size: 12px !important;
	}
		
}

/* ----- LOGGA IN-IKON I HEADER STYLING ------ */

/* Gör länken rund och matchar Beaver Builders ikonstil */
.fl-icon.custom-account-icon a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 35px;            /* Justera storlek om det behövs */
    height: 35px;           /* Justera storlek om det behövs */
    background-color: #19233F;
    border-radius: 50%;     /* Gör den rund */
    color: #ffffff;         /* Vit ikon */
    text-decoration: none;
    transition: background-color 0.2s ease;
}

/* Ändra ikonens storlek inuti cirkeln */
.fl-icon.custom-account-icon a i {
    font-size: 16px;
    color: #ffffff;
}

/* Hover-effekt (valfritt) */
.fl-icon.custom-account-icon a:hover {
	background-color: #273764;
}

.fl-icon.custom-account-icon .fa-user-alt::before {
	color: #fff !important;
}



/* ----- FORUM MENYVAL UNIK STYLING ------ */


#menu-huvudmeny-uppdelad-2 .monark-forum a {
	background: #19233F !important;
	color: #ffffff !important;
	padding: 12px 24px;
	transition: ease .2s;
	border: 2px solid #fff;
	border-radius: 10px;
}

#menu-huvudmeny-uppdelad-2 .monark-forum a:hover {
	background: #273764 !important;
}

/*OFF CANVAS CYKLAR*/ 

.pp-offcanvas-header {
	padding-top:0px;
}

/*Sök*/
.fl-search-post-title a {
	font-size:16px;
	color:black !important;
	padding-left:20px;
}

.fl-search-post-title {
	padding-top:30px !important;
}

.fl-search-post-image {
	width:100px !important;
	height:100px !important;
}

.fl-search-post-image img{
	width:100px !important;
	height:100px !important;
	border-radius:50%;
	object-fit:cover;
}


.logo-meny {
	max-width:170px !important; 
	margin-top:150px;
}

.sub-menu {
  
    margin-left: auto !important;
    margin-right: auto !important;
}

.sub-menu a {
  
	font-size:90% !important;
}

/*Om oss-meny*/
/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {


.om-oss-meny a {
	font-size:13px;
}
	}

/* =======================================================================================================================================================================
                                                                Undermenu (sub-menu) Styling
======================================================================================================================================================================= */

/* Gör undermenyn tydligare med skugga, kant och avstånd */
.pp-advanced-menu .sub-menu {
  background-color: #ffffff !important;
  border-radius: 8px !important;
  padding: 10px 0 !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important; /* Tydlig skugga som lyfter menyn */
  border: 1px solid #e1e8ed !important;                  /* Subtil kantlinje */
  min-width: 180px !important;
  z-index: 9999 !important;
}

/* Styling för länkarna i undermenyn */
.pp-advanced-menu .sub-menu li a {
  padding: 10px 20px !important;
  display: block !important;
  color: #19233F !important;                             /* Matchar din mörka tema-färg */
  transition: background-color 0.2s ease, color 0.2s ease !important;
}

/* Hover-effekt på menyvalen i undermenyn */
.pp-advanced-menu .sub-menu li a:hover,
.pp-advanced-menu .sub-menu li a:focus-visible {
  background-color: #f4f6fa !important;                  /* Mjuk ljus grå/blå bakgrund vid hover */
  color: #273764 !important;
}

/* Tillgänglighet: Tydlig fokusram när man tabbar i undermenyn */
.pp-advanced-menu .sub-menu li a:focus-visible {
  outline: 2px solid #005a9c !important;
  outline-offset: -2px !important;
}

.pp-accordion-button-icon .dashicons-before:before {
	position: relative;
	right: 10px;
}


/* =======================================================================================================================================================================
                                                                           Generella ändringar  
======================================================================================================================================================================= */

.fl-post-grid-post {
	border:none !important; 
}

.tre-kolumn-padding-text, .femti-femti-kolumner  {
	padding-top:3%;
	padding-bottom:3%;
	padding-left:3%;
	padding-right:3%;
}


/* =======================================================================================================================================================================
                                                                           Grid-bilder startsida - Styling
======================================================================================================================================================================= */

.grid-bild {
    background-color: #000;
    height: 300px;
    position: relative; /* Krävs för att absolutpositionera h3 korrekt */
    overflow: hidden;   /* Klipper bilden så den inte sticker ut vid hover (scale) */
}

.grid-bild h3 {
    position: absolute;
    top: 0;             /* Låser rubriken i överkanten så den inte tar plats i flödet */
    left: 0;
    padding: 10px 20px;
    font-size: 24px;
    font-weight: 500;
    color: white;
    z-index: 100;
    text-shadow: rgba(0, 0, 0, 1) 0px 0px 10px;
    margin: 0;          /* Tar bort standard-marginaler som kan trycka ner saker */
}

.grid-bild img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;     /* Tar bort det osynliga tomrummet under bilder (inline-gap) */
    filter: grayscale(1);
    opacity: 0.5;
    transition: transform .5s ease-in-out, filter .5s ease-in-out, opacity .5s ease-in-out;
}

.grid-bild img:hover {
    filter: grayscale(0);
    opacity: 0.8;
    transform: scale(1.15);
}


/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	.tre-kolumn-padding-text, .femti-femti-kolumner  {
	padding-top:7%;
	padding-bottom:7%;
	padding-left:7%;
	padding-right:7%;
}
}

a:hover, a:visited {
	text-decoration:none;
}


.rund-bild img {
	border-radius:50%;
}


.vit-text, .vit-text li a, .vit-text h2 {
	color:white !important;
}



/* =======================================================================================================================================================================
                                                                          Knappar
======================================================================================================================================================================= */


/******** KNAPP MOT MÖRK ********/
.knapp-mot-mork a.fl-button {
	background: rgba(38, 38, 38, 0.5);
	border:solid white 1px;
	border-radius: 10px;
	transition: ease-in-out .2s;
	padding: 20px 40px;
}

.knapp-mot-mork a.fl-button:hover {
	background:white;
	border:solid white 1px;
	transition: ease-in-out .2s;
}

/*knapptexten*/
.knapp-mot-mork a.fl-button span {
  	color:white;
	transition: ease-in-out .2s;
	text-transform: uppercase;
}

.knapp-mot-mork a.fl-button:hover span {
  	color: #262626 !important;
	transition: ease-in-out .2s;
}


/******** KNAPP MOT LJUS ********/

.knapp-mot-ljus a.fl-button, .knapp-mot-ljus button, .knapp-mot-ljus input {
	background: #19233F;
	border:solid white 1px;
	border-radius: 10px;
	transition: ease-in-out .2s;
	padding: 20px 40px;
}

.knapp-mot-ljus a.fl-button:hover, .knapp-mot-ljus button:hover, .knapp-mot-ljus input:hover {
	background: #273764 !important;
	border:solid white 1px;
	transition: ease-in-out .2s;

}


/*knapptexten*/
.knapp-mot-ljus a.fl-button span, .knapp-mot-ljus button, .knapp-mot-ljus button a, .knapp-mot-ljus input {
  	color: #fff;
	text-transform: uppercase;
}

.knapp-mot-ljus a.fl-button:hover span, .knapp-mot-ljus button:hover, .knapp-mot-ljus button:hover a, .knapp-mot-ljus input:hover {
	text-decoration:none;
}


/* =======================================================================================================================================================================
                                                                          Butik
======================================================================================================================================================================= */

.dolj-kat-tillbehor-aldre-prod .cat-item-32, .dolj-kat-tillbehor-aldre-prod .cat-item-57 {
	display:none;
}

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
	transition: ease .2s;
}

.fl-post-module-woo-ordering {
	margin-bottom: 40px;
}

.woocommerce .woocommerce-ordering select,
.woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count {
	padding: 10px;
}

.woocommerce ul.products li.product a:hover img, .woocommerce-page ul.products li.product a:hover img {
	border: none !important;
}

.product-categories li a {
	color:black;
	font-weight:400;
	font-size:110%;
}

.kolumn-produktkategorier-butik {
	position:sticky;
	top:0;
	padding-top:150px;
	z-index:10;
}

.kategorier-butik a {
	font-size:20px !important;
}

.kategorier-butik h2 {
	font-size:25px !important;
}


/* 3D-bildgalleri - Unik styling */

.row2-bildgalleri .pp-3d-slider {
	height: 550px;
}

.row2-bildgalleri .pp-slider-img {
	background: #fff;
}

.row2-bildgalleri .pp-slider-nav {
	bottom: 0 !important;
}

.row2-bildgalleri .pp-3d-slider .pp-slider-nav .pp-slider-nav-button svg {
	padding: 5px;
}


/* Gör hela texten till små bokstäver */
.kolumn-produktkategorier-butik .widget_product_categories ul.product-categories li a {
    text-transform: lowercase !important;
    display: inline-block;
}

/* Gör endast den allra första bokstaven i länken stor */
.kolumn-produktkategorier-butik .widget_product_categories ul.product-categories li a::first-letter {
    text-transform: uppercase !important;
}


/*Döljer "okategoriserad"-kategorin*/
.cat-item-28, .cat-item-29 {
	display:none !important;
}

.woocommerce ul.products li.product a img {
	border:none;
}

.widget_product_categories .widgettitle {
	display: none;
}

/* Tillgänglighets-styling för karusell-knappar på startsidan */

.owl-nav button:focus {
	outline-color: blue;
}


/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	
.kolumn-produktkategorier-butik {		
	padding-top:73px;
	}


}





/* =======================================================================================================================================================================
                                                                          Produkt Singel
======================================================================================================================================================================= */

.pswp__caption__center {
	display:none;
}

/*HUVUD-BILD*/
.woocommerce-product-gallery__image--placeholder {
	max-height:400px;
	max-width:400px;
	margin-left:auto;
	margin-right:auto;
	
	border:none !important;
}

.woocommerce div.product div.images img, .woocommerce-page div.product div.images img {
	border:none;
}

/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
.woocommerce-product-gallery__image--placeholder {
	max-height:200px;
	max-width:200px;
	margin-top:20px;
	}
}


.woocommerce-product-gallery__image--placeholder img {
	
	border:none !important;
}


/*FÄRGER*/

/* .product_cat-medical .rad-manualer-produktblad .fl-row-content-wrap,
.product_cat-medical-en .rad-manualer-produktblad .fl-row-content-wrap {
	background-color: #F2F2F2;
} */

/* .product_cat-medical .rad-bildgalleri .fl-row-content-wrap,
.product_cat-medical-en .rad-bildgalleri .fl-row-content-wrap{
	background-color: #212121;
} */ 

.pp-slider-nav-button span {
	line-height: unset !important;
}

.pp-3d-slider .pp-slider-nav {
	z-index: 10 !important;
}

/*VIDEO*/

.produkt-video {
	display:block; 
	float:left; 
	text-align:center;
}


.produkt-manualer-huvuddiv {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start ;
}

.produkt-manualer-produktblad {
	display:inline-block;
	text-align:center; 
	padding:10px;
	width:25%;
	vertical-align:top;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}

.produkt-manualer-produktblad p {
	display:block; 

	margin-left:auto;
	margin-right:auto;
}

/*MEDIASCREEN DATOR*/
@media screen and (min-width: 992px) {

	
.produkt-video {
		width:50%; 
}
	
.produkt-video iframe {
	width:450px; 
	height:300px;
}
}

/*MEDIASCREEN PLATTA*/
@media  screen and (min-width: 769px) and (max-width: 992px) {
	
	.produkt-video {
		width:50%; 
}
.produkt-video iframe {
	width:330px; 
	height:200px;
}
	.produkt-manualer-produktblad {
	width:50%; 
}
}
	
/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {

.produkt-video {
		width:100%; 
}
.produkt-video iframe {
	width:500px; 
	height:300px;
}
	.produkt-manualer-produktblad {
	width:50%; 
}
}

	
/*Slider*/

.pp-slider-img {
	margin-left:auto ;
	margin-right:auto ;
	display:block ;
	height:auto;
	text-align: center;
}

.pp-slider-center img {
	margin-left:auto ;
	margin-right:auto ;
	display:block ;
	text-align: center;
	height:auto;


}

.pp-slider-center img, .pp-slider-img {
	transition: 0.5s;
}

/*MEDIASCREEN DATOR*/
@media screen and (min-width: 992px) {

.pp-slider-img {
	max-width:280px !important;
	margin-top:70px;
}

.pp-slider-center img {
		max-width:420px !important;
		margin-top:0px !important;

}

}




/*MEDIASCREEN PLATTA*/
@media  screen and (min-width: 769px) and (max-width: 992px) {
	.pp-slider-img {
	max-width:200px !important;
	margin-top:70px;
}

.pp-slider-center img {
		max-width:320px !important;
		margin-top:0px !important;

}

}



/*Relaterade produkter*/

.relaterade-produkter-slider .input-text {

    margin-left: auto !important;
    margin-right: auto !important;
	margin-bottom:10px;
}


/* EXTRA FÄLT */


.produkt-extra-falt img {
	width: 100%;
	border: 5px;
}


/*MEDIASCREEN DATOR*/
@media only screen and (min-width: 993px) {
	
	.produkt-extra-falt {
	width:50% !important;
	display: inline-block;
	float:left;
	padding:20px;
}
	
}

/*MEDIASCREEN PLATTA*/
@media only screen and (min-width: 769px) and (max-width: 992px) {
		.produkt-extra-falt {
	width:50% !important;
	display: inline-block;
	float:left;
	padding:20px;
}
}

/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	.produkt-extra-falt {
	
	padding:20px;
}
}


/* =======================================================================================================================================================================
                                                                          Singellayouter
======================================================================================================================================================================= */

.sok-singlar h5 {
	color:white;
}

/* =======================================================================================================================================================================
                                                                          Distributörer
======================================================================================================================================================================= */

.dist-huvud-div h4 {
	text-transform:uppercase;
}

.rad-dist .fl-post-grid {
	margin-left:0px;
}

.rad-dist h2 {
	font-size:180%;
}

.rad-dist {
	border-bottom: 1px solid rgba(0,0,0, .25);
}

/* Dölj hela raden om den innehåller Beaver Builders "inga inlägg-meddelande"  */
.rad-dist:has(.fl-post-grid-empty),
.rad-dist:has(.fl-post-module-no-results) {
  display: none !important;
}


/* =======================================================================================================================================================================
                                                                Chattforum - Tabell
======================================================================================================================================================================= */


.pp-post-filter:before {
	content: "";
	border: solid 2px #136c75; /* Petrolium */
	border-radius: 50%;
    display: inline-block;
    padding: 5px;
	margin-right: 7.5px;
	transition: ease-in-out .25s;
}

.pp-filter-active:before {
	background: #136c75; /* Petrolium */
}

.pp-post-filters {
	border-bottom: solid 1px #136c75; /* Petrolium */
}

.forum-tabel .gridtabell-mot-vit {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 20px;
	padding-bottom: 20px;
	border-bottom: rgba(30, 150, 163, .4) solid 1px; /* Petrolium */
}

.forum-tabel .pp-content-grid-separator {
	border-bottom: solid 1ps #136c75; /* Petrolium */
}

.forum-tabel .pp-content-grid-post-title {
	flex-grow: 2;
}

.forum-tabel .pp-content-grid-post-title a {
	font-size: 18px;
	font-weight: 500;
}

.forum-tabel .post-meta {
	flex-grow: 1;
	max-width: 150px;
	margin-right: 20px;
}

.forum-tabel .post-meta a {
	font-size: 16px;
	font-weight: 500;
}

.forum-tabel .pp-content-grid-post-comments,
.forum-tabel .pp-content-grid-post-excerpt {
	display: flex;
	justify-content: center;
	align-items: center;
    min-height: 20px;
}

.forum-tabel .pp-content-grid-post-comments img {
	height: 20px;
}

.forum-tabel .pp-content-grid-post-excerpt button.wp_ulike_btn {
	border-radius: 0;
	background-color: none;
	width: 25px; 
    height: 0;
}

.forum-tabel .pp-content-grid-post-comments a, 
.forum-tabel .pp-content-grid-post-excerpt span.wp_ulike_counter_up {
	font-size: 18px !important;
	font-weight: 600 !important;
	margin: 0 15px;
}

.forum-tabel .pp-content-grid-post-excerpt p {
	display: none;
}

.forum-tabel .wpulike {
	padding: 0;
}

.forum-tabel .pp-content-grid-post-title a {
	transition: ease-in-out .25s;
}

.fl-comments-list-title {
	font-size: 20px !important;
}

.comment-reply-title {
	font-weight: 600 !important;
}


.new-topic .fl-rich-text p:nth-of-type(3),
.new-topic .fl-rich-text p:nth-of-type(4) {
	display: none !important;
}

	.new-topic input#submit_topic {
		text-transform: normal !important;
	    width: auto !important;
    	padding: 10px 20px !important;
	}

.new-topic input#submit_topic:hover {
	background: #136c75; /* Petrolium */
	border: none !important;
}


/* Dölj alla svar tills vi listar ut ett alternativt pluggin */
 .comment-reply-link {
	display: none !important;
} 

/* =======================================================================================================================================================================
                                                                Chattforum - Foruminlägg som väntar på svar
======================================================================================================================================================================= */


/* Styling för alla väntande foruminlägg och ämnen */
.bbp-topic-pending,
.bbp-reply-pending,
.status-pending {
    background-color: #fff9e6 !important;
    border-left: 4px solid #ffb900 !important;
    padding: 10px !important;
    opacity: 0.85;
}

/* Textbricka ovanför väntande inlägg */
.bbp-topic-pending::before,
.bbp-reply-pending::before,
.status-pending::before {
    content: "⏳ Väntar på godkännande (Syns bara för Admin/Författaren)";
    display: block;
    background: #ffb900;
    color: #000;
    font-size: 11px;
    font-weight: bold;
    padding: 4px 10px;
    margin-bottom: 8px;
    border-radius: 3px;
    width: fit-content;
}


/*MEDIASCREEN PLATTA & MOBIL*/
@media only screen and (max-width: 992px) {
	
	
	.forum-tabel  .pp-post-filters {
		display: none;
	}
	
	.forum-tabel .pp-content-grid-post-title {
		margin-right: 20px;
	}
	
	.forum-tabel .pp-content-grid-post-title a {
		font-weight: 500;
	}
	
	.forum-tabel .post-meta {
		display: none;
	}
	
}

.forum-categories .menu > li {
	display: inline-flex;
}

.forum-categories nav ul li a {
	border-radius: 5px;
	font-size: 16px !important;
}


/* --- bbPress Monark Modern Styling --- */

/* Huvudbehållare */
#bbpress-forums {
    font-family: inherit;
    color: #1d1d1b;
}

/* Sökfält & knapp */
#bbp-search-form {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 25px;
}

#bbp-search-form div {
    display: flex;
    gap: 10px;
    width: 100%;
    max-width: 400px;
}

#bbp_search {
    flex: 1;
    padding: 10px 20px !important;
    border: 1px solid #e1e1e1 !important;
    border-radius: 5px !important;
    outline: none;
    font-size: 14px;
    transition: border-color 0.2s ease;
}

#bbp_search:focus {
    border-color: #218380 !important;
}

#bbp_search_submit {
    background-color: #273764 !important; /* Matchar den turkosa forumknappen */
    color: #ffffff !important;
    border: 1px solid #ffffff !important;
    padding: 10px 20px !important;
    border-radius: 5px !important;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

#bbp_search_submit:hover {
    background-color: #19233F !important;
}


  

/* Rubrikraden i forumet */
#bbpress-forums ul.bbp-lead-topic, 
#bbpress-forums ul.bbp-topics, 
#bbpress-forums ul.bbp-forums {
    border: none !important;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    background: #ffffff;
}

li.bbp-header {
    background-color: #f8f9fa !important;
    border-bottom: 2px solid #eef2f5 !important;
    padding: 12px 20px !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    color: #6c757d;
}

li.bbp-header ul.forum-titles {
    margin: 0;
    padding: 0;
}

/* Forum-rader (Ämnen) */
#bbpress-forums li.bbp-body ul.topic,
#bbpress-forums li.bbp-body ul.forum {
    padding: 16px 20px !important;
    align-items: center;
    transition: background-color 0.2s ease;
}

#bbpress-forums li.bbp-body ul.topic:hover {
    background-color: #f8fcfc !important; /* Mjuk turkos toning vid hover */
}

/* Länkar och titlar */
a.bbp-topic-permalink {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #1d1d1b !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

a.bbp-topic-permalink:hover {
    color: #218380 !important;
}

/* Metainformation (Startat av, etc) */
.bbp-topic-meta, .bbp-topic-meta a {
    color: #8c8c8c !important;
    font-size: 13px !important;
    text-decoration: none !important;
}

.bbp-topic-meta a:hover {
    color: #273764 !important;
}

/* Avatar-cirklar */
#bbpress-forums .bbp-author-avatar {
	display: none !important;
}

/* Sidnumrering & Antal */
.bbp-pagination-count {
    color: #8c8c8c;
    font-size: 13px;
    margin-bottom: 12px;
}

/* Dölj tom footer-rad i bbPress */
#bbpress-forums li.bbp-footer {
    display: none !important;
}


/* =======================================================================================================================================================================
                                                                Chattforum - Kommentarer
======================================================================================================================================================================= */
/*
label[for="fl-email"], label[for="fl-url"] {
	/*display: none !important;
}
*/


.fl-comments {
	display: flex !important;
	flex-direction: column;
	margin-top: 0 !important;
}

.podd-comment .fl-comments-list, .comment-respond {
	padding: 0 !important;
}

.fl-comments-list, .comment-respond {
	flex: 50%;
	padding: 20px;
}


.comment-respond input[name=author]::placeholder {
	content: Lämna fältet tomt för att kommentera anonymt. !important;
}

/*
.comment-respond .comment-form-cookies-consent {
	display: none;
} */



.fl-comments-list .comment-body {
	border: 2px solid rgba(30,150,163,0.25);
	margin-bottom: 20px;
	padding: 10px 20px;
}

.fl-comments-list .comment-content {
	border: none !important;
}

.fl-comments-list .comment-author-link {
	font-size: 20px;
	margin-left: 0 !important;
}

.form-submit input {
	border: none !important;
	padding: 10px 20px;
	width: auto;
	transition: .2s;
}

.form-submit input:hover {
	background: #87d9f5 !important; /* Ljusblå */
}

/*.comment-respond form label[for="fl-email"], */
.comment-respond form label[for="fl-url"],
/* .comment-respond input[name="email"], */
.comment-respond input[name="url"] {
	display: none !important;
}

/*MEDIASCREEN PLATTA*/
@media only screen and (max-width: 992px) {
	
	.fl-comments-list, .comment-respond {
		flex: 100%;
	}
	
}


/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	button, input[type=button], input[type=submit] {
	font-size: 16px;
}

}

/* --- bbPress Single Topic & Reply View (Monark Modern) --- */

/* Meddelanderutor / Notiser (Sätter mjuk grå/mörkblå profil) */
div.bbp-template-notice, 
div.indicator-hint {
    background-color: #f4f6fa !important;
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid #273764 !important;
    border-radius: 8px !important;
    color: #1d1d1b !important;
    padding: 12px 18px !important;
    margin-bottom: 25px !important;
}

div.bbp-template-notice a {
    color: #273764 !important;
    font-weight: 600;
}

/* Favorit & Prenumerera-länkar */
#subscription-toggle, 
#favorite-toggle {
    font-size: 13px;
}

#subscription-toggle a, 
#favorite-toggle a {
    color: #273764 !important;
    text-decoration: none !important;
    font-weight: 600;
    transition: opacity 0.2s;
}

#subscription-toggle a:hover, 
#favorite-toggle a:hover {
    opacity: 0.8;
}

/* --- Inlägg & Svars-kort --- */

/* Rubrikbalken för varje inlägg (Datum & Admin-länkar) */
div.bbp-reply-header {
    background-color: #f8f9fa !important;
    border: 1px solid #eef2f5 !important;
    border-bottom: none !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 10px 18px !important;
    font-size: 13px !important;
    color: #6c757d !important;
    margin-top: 20px;
}

.bbp-reply-post-date {
    font-weight: 600;
    color: #1d1d1b;
}

/* Admin-länkar i inläggs-headern */
span.bbp-admin-links a, 
a.bbp-reply-permalink {
    color: #8c8c8c !important;
    text-decoration: none !important;
    font-size: 12px !important;
    transition: color 0.2s ease;
}

span.bbp-admin-links a:hover, 
a.bbp-reply-permalink:hover {
    color: #273764 !important;
}

/* Inläggsboxen (Själva innehållet) */
div.reply, 
div.topic {
    border: 1px solid #eef2f5 !important;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: #ffffff !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03);
}

/* Författarkolumnen till vänster */
.bbp-reply-author {
    font-size: 14px;
}

.bbp-reply-author a.bbp-author-name {
    color: #273764 !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    text-decoration: none !important;
    display: block;
    margin-top: 5px;
}

.bbp-reply-author img.avatar {
	display: none;
    border-radius: 50% !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.bbp-author-role {
    font-size: 11px !important;
    text-transform: uppercase;
    background: #eef2f5;
    color: #6c757d;
    padding: 2px 8px;
    border-radius: 12px;
    display: inline-block;
    margin-top: 4px;
}

.bbp-reply-ip {
    color: #b0b0b0 !important;
    font-size: 11px !important;
}

/* Innehåll i svar */
.bbp-reply-content {
    font-size: 15px;
    line-height: 1.6;
    color: #1d1d1b;
}

/* --- Svarsformuläret i botten --- */

#new-reply-11660, 
.bbp-reply-form {
    margin-top: 40px;
}

#new-post fieldset.bbp-form {
    border: 1px solid #eef2f5 !important;
    border-radius: 12px !important;
    padding: 25px !important;
    background: #ffffff !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

#new-post fieldset.bbp-form legend {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #273764 !important;
    padding: 0 10px !important;
}

/* Textredigeraren & Fält */
#bbp_reply_content, 
#bbp_topic_tags {
    border: 1px solid #e1e1e1 !important;
    border-radius: 8px !important;
    padding: 12px !important;
    outline: none;
    font-family: inherit;
}

#bbp_reply_content:focus, 
#bbp_topic_tags:focus {
    border-color: #273764 !important;
}

/* Textredigerarens verktygsfält (Quicktags) */
.quicktags-toolbar {
    background: #f8f9fa !important;
    border: 1px solid #e1e1e1 !important;
    border-bottom: none !important;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    padding: 8px !important;
}

.quicktags-toolbar input.button {
    background: #ffffff !important;
    border: 1px solid #d1d1d1 !important;
    border-radius: 4px !important;
    color: #1d1d1b !important;
    font-weight: 600;
}

.quicktags-toolbar input.button:hover {
    background: #273764 !important;
    color: #ffffff !important;
    border-color: #273764 !important;
}

/* Skicka-knappen */
button#bbp_reply_submit {
    background-color: #273764 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 12px 30px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

button#bbp_reply_submit:hover {
    background-color: #1d2a4d !important;
}

/* =======================================================================================================================================================================
                                                                Chattforum - Tabell
======================================================================================================================================================================= */

.pp-post-filter:before {
	content: "";
	border: solid 2px #136c75; /* Petrolium */
	border-radius: 50%;
    display: inline-block;
    padding: 5px;
	margin-right: 7.5px;
	transition: ease-in-out .25s;
}

.pp-filter-active:before {
	background: #136c75; /* Petrolium */
}

.pp-post-filters {
	border-bottom: solid 1px #136c75; /* Petrolium */
}

.forum-tabel .gridtabell-mot-vit {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 20px;
	padding-bottom: 20px;
	border-bottom: rgba(30, 150, 163, .4) solid 1px; /* Petrolium */
}

.forum-tabel .pp-content-grid-separator {
	border-bottom: solid 1ps #136c75; /* Petrolium */
}

.forum-tabel .pp-content-grid-post-title {
	flex-grow: 2;
}

.forum-tabel .pp-content-grid-post-title a {
	font-size: 18px;
	font-weight: 500;
}

.forum-tabel .post-meta {
	flex-grow: 1;
	max-width: 150px;
	margin-right: 20px;
}

.forum-tabel .post-meta a {
	font-size: 16px;
	font-weight: 500;
}

.forum-tabel .pp-content-grid-post-comments,
.forum-tabel .pp-content-grid-post-excerpt {
	display: flex;
	justify-content: center;
	align-items: center;
    min-height: 20px;
}

.forum-tabel .pp-content-grid-post-comments img {
	height: 20px;
}

.forum-tabel .pp-content-grid-post-excerpt button.wp_ulike_btn {
	border-radius: 0;
	background-color: none;
	width: 25px; 
    height: 0;
}

.forum-tabel .pp-content-grid-post-comments a, 
.forum-tabel .pp-content-grid-post-excerpt span.wp_ulike_counter_up {
	font-size: 18px !important;
	font-weight: 600 !important;
	margin: 0 15px;
}

.forum-tabel .pp-content-grid-post-excerpt p {
	display: none;
}

.forum-tabel .wpulike {
	padding: 0;
}

.forum-tabel .pp-content-grid-post-title a {
	transition: ease-in-out .25s;
}

.fl-comments-list-title {
	font-size: 20px !important;
}

.comment-reply-title {
	font-weight: 600 !important;
}


.new-topic .fl-rich-text p:nth-of-type(3),
.new-topic .fl-rich-text p:nth-of-type(4) {
	display: none !important;
}

	.new-topic input#submit_topic {
		text-transform: normal !important;
	    width: auto !important;
    	padding: 10px 20px !important;
	}

.new-topic input#submit_topic:hover {
	background: #136c75; /* Petrolium */
	border: none !important;
}


/* Dölj alla svar tills vi listar ut ett alternativt pluggin */
 .comment-reply-link {
	display: none !important;
} 

/*MEDIASCREEN PLATTA & MOBIL*/
@media only screen and (max-width: 992px) {
	
	
	.forum-tabel  .pp-post-filters {
		display: none;
	}
	
	.forum-tabel .pp-content-grid-post-title {
		margin-right: 20px;
	}
	
	.forum-tabel .pp-content-grid-post-title a {
		font-weight: 500;
	}
	
	.forum-tabel .post-meta {
		display: none;
	}
	
}

.forum-categories .menu > li {
	display: inline-flex;
}

.forum-categories nav ul li a {
	border-radius: 5px;
	font-size: 16px !important;
}



/* =======================================================================================================================================================================
                                                                Chattforum - Kommentarer
======================================================================================================================================================================= */
/*
label[for="fl-email"], label[for="fl-url"] {
	/*display: none !important;
}
*/

form input, .contact-form textarea {
	margin-bottom: 10px;
}


.fl-comments {
	display: flex !important;
	flex-direction: column;
	margin-top: 0 !important;
}

.podd-comment .fl-comments-list, .comment-respond {
	padding: 0 !important;
}

.fl-comments-list, .comment-respond {
	flex: 50%;
	padding: 20px;
}


.comment-respond input[name=author]::placeholder {
	content: Lämna fältet tomt för att kommentera anonymt. !important;
}

/*
.comment-respond .comment-form-cookies-consent {
	display: none;
} */



.fl-comments-list .comment-body {
	border: 2px solid rgba(30,150,163,0.25);
	margin-bottom: 20px;
	padding: 10px 20px;
}

.fl-comments-list .comment-content {
	border: none !important;
}

.fl-comments-list .comment-author-link {
	font-size: 20px;
	margin-left: 0 !important;
}

.form-submit input {
	border: none !important;
	padding: 10px 20px;
	width: auto;
	transition: .2s;
}

.form-submit input:hover {
	background: #87d9f5 !important; /* Ljusblå */
}

/*.comment-respond form label[for="fl-email"], */
.comment-respond form label[for="fl-url"],
/* .comment-respond input[name="email"], */
.comment-respond input[name="url"] {
	display: none !important;
}

/*MEDIASCREEN PLATTA*/
@media only screen and (max-width: 992px) {
	
	.fl-comments-list, .comment-respond {
		flex: 100%;
	}
	
}


/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	button, input[type=button], input[type=submit] {
	font-size: 16px;
}

}

/* =======================================================================================================================================================================
                                                                bbPress - Plugin för forum
======================================================================================================================================================================= */

.bbp-template-notice, .bbp_topic_status, .bbp_stick_topic, label[for=bbp_topic_tags], input[name=bbp_topic_tags], label[for=bbp_anonymous_website], input[name=bbp_anonymous_website]  {

}

div.bbp-template-notice.info {
	border: #87d9f5 1px solid; /* Ljusblå */
    background-color: rgba(135, 217, 245, .5); /* Ljusblå */
}

div.bbp-template-notice, div.indicator-hint {
	
}

/* Forum ------------------------------- */

.bbp-topics .bbp-body ul {
	border-bottom: rgba(0, 0, 0, .5) solid 1px;
}

#bbpress-forums li.bbp-header {
	background: transparent;
	border-bottom: rgb(30, 150, 163) solid 1px;
}

#bbpress-forums div.bbp-forum-header, #bbpress-forums div.bbp-reply-header, #bbpress-forums div.bbp-topic-header {
	background: ;
	background: rgba(135, 217, 245, .5); /* Petrolium */
}

.bbp-replies .bbp-header, .bbp-pagination, .bbp-footer {
	display: none;
}

.bbp-topic-description a {
	font-size: inherit;
}

#bbpress-forums .bbp-body div.bbp-reply-author, #bbpress-forums .bbp-body div.bbp-topic-author {
	padding: 0;
	min-height: unset;
}

div.bbp-forum-header, div.bbp-reply-header, div.bbp-topic-header, li.bbp-body div.hentry {
	
}

#bbpress-forums fieldset.bbp-form {
	border: none;
	padding: 0;
}

#bbpress-forums fieldset.bbp-form input[type=password], #bbpress-forums fieldset.bbp-form input[type=text], #bbpress-forums fieldset.bbp-form select {
	min-height: 30px;
	height: fit-content !important;
}

#bbpress-forums ul.bbp-forums, #bbpress-forums ul.bbp-lead-topic, #bbpress-forums ul.bbp-replies, #bbpress-forums ul.bbp-search-results, #bbpress-forums ul.bbp-topics {
	border: none;
}

.bbp-topic-title a.bbp-topic-permalink {
	font-size: 22px;
	color: #333 !important;
}

.bbp-topic-title a.bbp-topic-permalink:hover {
	color: #136c75 !important; /* Petrolium */
}

#bbpress-forums li.bbp-body ul.forum, #bbpress-forums li.bbp-body ul.topic {
	padding: 20px 0px 20px 20px !important;
}

#bbpress-forums div.odd, #bbpress-forums ul.odd {
	background: none;
}

#bbpress-forums .bbp-forum-info .bbp-forum-content, #bbpress-forums p.bbp-topic-meta {
	font-size: inherit;
}

#bbpress-forums ul.bbp-topics ul.status-pending, #bbpress-forums ul.bbp-replies div.status-pending {
	background: rgb(255,221,141);
}

#bbpress-forums .status-pending.even, #bbpress-forums .status-pending.odd, #bbpress-forums ul.status-pending a {
	background: none;
}

/* Ämne ----------------------------------------------- */

.bbp-reply-author .bbp-author-name {
	font-size: 18px;
	font-weight: bold;
}

.bbp-replies .bbp-body ul li {
	border: rgba(30, 150, 163, .5) solid 1px;
	margin: 15px 0 !important;
}

.bbp-replies div.bbp-reply-header {
	border-top: 0;
}

.bbp-replies span.bbp-admin-links {
	float: right;
    clear: inline-end;
}

.bbp-replies #bbpress-forums div.even, #bbpress-forums ul.even {
	background: transparent;
}

.bbp-replies span.bbp-admin-links a {
	font-size: 12px;
}

#bbpress-forums div.bbp-reply-author {
	width: 200px;
}

#bbpress-forums div.bbp-forum-author .bbp-author-name, #bbpress-forums div.bbp-reply-author .bbp-author-name, #bbpress-forums div.bbp-topic-author .bbp-author-name {
	margin-top: 10px;
}

.bbp-replies .bbp-reply-permalink, .bbp-replies .bbp-author-role {
	display: none;
}

.bbp-replies #bbpress-forums div.bbp-reply-content {
	margin-left: 0;
	padding: 10px !important;
}

.bbp-replies .bbp-topic-revision-log-item {
	padding: 10px;
}

#bbpress-forums ul.bbp-threaded-replies {
		margin-left: 40px;
		margin-right: 10px;
	}

.bbp-form #bbp_topic_submit, .bbp-reply-form #bbp_reply_submit {
	padding: 10px 20px;
}



/* Hide posts that await moderation on frontend view for non-logged in users */

.status-pending {
	display: none;
}

.logged-in .status-pending {
	display: block;
}

.bbp-replies .bbp-body:first-child {
	display: none;
}

.logged-in .bbp-replies:first-child{
	display: block;
}

.bbp-form p:last-of-type {
	
}

/*MEDIASCREEN MOBILE*/
@media only screen and (max-width: 768px) {
	
	#bbpress-forums ul.forum-titles .bbp-topic-title {
		margin-right: auto;
	}
	

	#bbpress-forums ul.forum-titles li {
		margin-right: 20px;
	}
	
	#bbpress-forums ul.forum-titles .bbp-topic-freshness {
		margin-right: 0;
	}
	
	#bbpress-forums li.bbp-header .forum-titles {
		display: flex;
		justify-content: space-between;
	}
	
	#bbpress-forums li.bbp-header .forum-titles li {
		font-size: 12px;
		width: auto;
	}
	
	.bbp-topic-title a.bbp-topic-permalink {
		font-size: 18px;
		font-weight: 600;
	}
	
	#bbpress-forums li.bbp-body ul.forum, #bbpress-forums li.bbp-body ul.topic {
		padding: 10px 0px 10px 10px !important;
	}
	
	.bbp-replies #bbpress-forums div.bbp-reply-author .bbp-author-name {
		margin: 0;
	}
	
	.bbp-replies #bbpress-forums div.bbp-reply-author {
		width: 100%;
		text-align: left;
	}
	
	.bbp-replies #bbpress-forums li {
		margin: 0 12px;
	}
	
}

/* 1. Ta bort ramar och skuggor från listelement i foruminlägg */
.bbp-reply-content ul li,
.bbp-reply-content ol li {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  background: transparent !important;
  padding: 0 0 0.5rem 0; /* Ger lite lagom avstånd mellan punkterna */
  margin: 0;
}

/* Ta bort eventuell marginal på sista punkten */
.bbp-reply-content ul li:last-child {
  padding-bottom: 0;
}

/* 2. Layoutjustering så att texten inte hamnar "vid sidan" av författaren */

/* Gör hela inlägget till en flex-box som staplas vertikalt (alt. två kolumner) */
.hentry.type-topic, 
.hentry.type-reply {
  display: flex;
  flex-direction: column; /* Gör att textinnehållet hamnar under författarinformationen */
}

/* Om du vill ha författaren till vänster och texten till höger som två rena kolumner istället: */
@media (min-width: 768px) {
  .hentry.type-topic, 
  .hentry.type-reply {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
  }

  .bbp-reply-author {
    width: 140px; /* Eller önskad bredd på författarkolumnen */
    flex-shrink: 0;
    margin-right: 20px;
  }

  .bbp-reply-content {
    flex-grow: 1;
  }
}

/* Rensa upp styckesmarginaler i texten */
.bbp-reply-content p {
  margin-top: 0;
  margin-bottom: 1rem;
}

/* =======================================================================================================================================================================
                                                                Tillgänglighetsanpassningar
======================================================================================================================================================================= */

.fl-screen-reader-text {
	background: white;
    border: blue 2px solid;
    padding: 20px;
    z-index: 9000;
    position: absolute;
    top: 0;
}

.logotyp-header:focus {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.pp-advanced-menu .menu > li > a:focus,
.pp-advanced-menu .menu > li > a:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.pp-advanced-menu-mobile button:focus,
.pp-advanced-menu-mobile button:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.pp-advanced-menu .menu > li > a:focus,
.pp-advanced-menu .menu > li > a:focus-within,

.pp-advanced-menu .menu .pp-has-submenu-container > a:focus,
.pp-advanced-menu .menu .pp-has-submenu-container > a:focus-within,

.pp-advanced-menu .menu .pp-has-submenu-container > .sub-menu > a:focus,
.pp-advanced-menu .menu .pp-has-submenu-container > .sub-menu > a:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.pp-photo-content a:focus,
.pp-photo-content a:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.pp-content-post:focus,
.pp-content-post:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

ul.pp-post-filters li:focus,
ul.pp-post-filters li:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

form input[type=submit]:focus, form input[type=submit]:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

.fl-icon:focus, .fl-icon:focus-within {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}

textarea {
	color: #333;
}

/* --- WooCommerce --- */


.woocommerce .woocommerce-message, .woocommerce-page .woocommerce-message, .woocommerce .woocommerce-info, .woocommerce-page .woocommerce-info, .woocommerce .woocommerce-error, .woocommerce-page .woocommerce-error, input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], input[type=month], input[type=week], input[type=time], input[type=number], input[type=search], input[type=url], textarea {
	color: #333 !important;
}

#add_payment_method .cart-collaterals .cart_totals table small, .woocommerce-cart .cart-collaterals .cart_totals table small, .woocommerce-checkout .cart-collaterals .cart_totals table small {
	color: #707070;
}

body {
	color: #333;
}

.category-inner a:focus,
.category-inner a:focus-within,
.category-inner a:focus-visible {
	border: 2px solid blue;
	border-radius: 5px;
	outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px;
}
/* --- Sidunika anpassningar --- */


/* --- Om du vill gömma ett objekt för tillgänglighetssyften --- */


.visually-hidden {
	position: absolute;
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0,0,0,0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}


.pp-toggle-label {
	position: absolute;
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0,0,0,0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Dölj menyvalet "Logga in" */
#menu-item-11892 {
    display: none !important;
}


/* =======================================================================================================================================================================
                                                                Cookies styling
======================================================================================================================================================================= */

.modal-cacsp-box-content a {
	font-size: inherit !important;
}



/* =======================================================================================================================================================================
                                                                Banner pause button - styling
======================================================================================================================================================================= */

.fl-node-23uvfhl5cy9p .fl-bg-video-play-pause {
	top: 40px !important;
    right: 40px !important;
    left: auto;
    bottom: auto;
    color: #fff;
}

/* =======================================================================================================================================================================
                                                                Dropdown-bilder startsida - Styling
======================================================================================================================================================================= */

/* .dropdown-bilder .fl-col-content,
.dropdown-bilder .fl-col-content .fl-module-pp-advanced-accordion,
.dropdown-bilder .fl-col-content .fl-module-pp-advanced-accordion .fl-module-content,
.dropdown-bilder .fl-col-content .fl-module-pp-advanced-accordion .fl-module-content .pp-accordion, 
.dropdown-bilder .fl-col-content .fl-module-pp-advanced-accordion .fl-module-content .pp-accordion .pp-accordion-item-active,
.dropdown-bilder .fl-col-content .fl-module-pp-advanced-accordion .fl-module-content .pp-accordion .pp-accordion-item-active .pp-accordion-content {
	height: 100% !important;
} *


/* Gör kolumnen till flex-container */
.dropdown-bilder .fl-col-content {
    display: flex !important;
    flex-direction: column;
	transition: ease-in-out .2s;
	height: 100%;
}

/* Gör accordionen flexibel */
.dropdown-bilder .pp-accordion {
    display: flex !important;
    flex-direction: column;
    flex: 1;
	position: relative;
	height: 100%;
	transition: ease-in-out .2s;
	min-height: 400px;
}

/* Varje item */
.dropdown-bilder .pp-accordion-item {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
	margin-bottom: 0;
	flex: 1;
    overflow: hidden;
    transition: flex 0.35s ease, background-color 0.35s ease;
}

.dropdown-bilder .pp-accordion-button {
	flex: 0 0 auto;
}

/* Aktiv item ska expandera */
.dropdown-bilder .pp-accordion-item.pp-accordion-item-active {
    flex: 2;
	position: absolute;
    inset: 0;
    z-index: 10;
	transition: ease-in-out .2s;
	background-size: cover;
    background-position: center;
}

/* Innehållet fyller resten */
.dropdown-bilder .pp-accordion-content {
    min-height: 0;
    overflow: hidden;
    transition: opacity 0.3s ease;
	opacity: 1;
	height: 100%;
}

.dropdown-bilder .pp-accordion-item:not(.pp-accordion-item-active) .pp-accordion-content {
    opacity: 0;
}

/* Länkar innanför Tekniska frågor/Övriga frågor på support-sidan - Styling */

.pp-accordion-content p a {
	text-decoration: underline;
    color: #273764;
}

/* Styling när knappen har fokus via tangentbord */
.pp-accordion-button:focus-visible {
  outline: 3px solid #005a9c !important;
  outline-offset: -3px !important; /* Flyttar in ramen så den inte klipps av overflow: hidden */
  box-shadow: 0 0 0 4px rgba(0, 90, 156, 0.4) !important; /* Extra tydlig skugga/glöd */
  border-radius: 4px;
  position: relative;
  z-index: 20; /* Lyfter knappen ovanför angränsande element */
}

/* Föräldern behöver tillåta att fokus visas om box-shadow används */
.dropdown-bilder .pp-accordion-item:focus-within {
  z-index: 15;
}

/* =======================================================================================================================================================================
                                                                Historia tidslinje - styling
======================================================================================================================================================================= */

.history-slider .fl-post-slider-navigation svg {
	padding: 13px;
}


/* =======================================================================================================================================================================
                                                                Bildgalleri startsida - Styling
======================================================================================================================================================================= */

/* 1. Mjuk övergång för bilden */
.pp-image-carousel img {
  transition: transform 0.5s ease-in-out !important;
}

/* 2. Inzoomning vid BÅDE mus-hover och tangentbordsfokus */
.pp-image-carousel a:hover img {
  transform: scale(1.15) !important;
}

/* 3. Tydlig fokusram runt länken/bilden när man tabbar */
.pp-image-carousel a:focus-visible {
  outline: 3px solid #005a9c !important;
  outline-offset: -3px !important; /* Flyttar in ramen så att Swiper:s overflow:hidden inte klipper bort den */
  box-shadow: 0 0 0 4px rgba(0, 90, 156, 0.4) !important;
  position: relative;
  z-index: 10;
  border-radius: 4px;
}

.pp-image-carousel a:focus-visible .pp-carousel-image-container {
	border: 3px solid blue !important;
}


/* =======================================================================================================================================================================
                                                                Produkter accordion startsida - Styling
======================================================================================================================================================================= */


.produkter-accordion-startsida .pp-accordion-button {
	display: flex;
	flex-direction: column;
}


/* =======================================================================================================================================================================
                                                                Inspiration - Styling
======================================================================================================================================================================= */

.search-form-inspiration .fl-search-text {
	margin-bottom: 0;
}

/* =======================================================================================================================================================================
                                                                Nyhetsbrev Funnelbud - Styling 
======================================================================================================================================================================= */

iframe.warning-cacsp-iframe-content, 
iframe[src*="funnelbud"] {
    background-color: #212121 !important;
}


iframe.white-background-iframe.warning-cacsp-iframe-content, 
iframe.white-background-iframe[src*="funnelbud"]{
	background: rgba(0,0,0,0) !important;
}


.warning-cacsp-iframe-content {
    display: none !important;
}




/* =======================================================================================================================================================================
                                                                Kontaktformulär på produktsidor - Styling
======================================================================================================================================================================= */

/* Grundläggande styling för CF7-formuläret */
.wpcf7 {
  color: #1d353d;
  font-family: inherit;
}

.wpcf7 h2 {
  color: #1d353d;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 8px;
}

.wpcf7 h3 {
  color: #556b73;
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 24px;
}

.wpcf7 label {
  display: block;
  font-weight: 600;
  color: #1d353d;
  margin-bottom: 16px;
  font-size: 15px;
  margin-top: 10px;
}

.wpcf7 .description {
  display: block;
  font-weight: 400;
  color: #61737d;
  font-size: 13px;
  margin-top: 4px;
  margin-bottom: 8px;
}

/* Inmatningsfält & Textareas */
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #b0bec5;
  border-radius: 6px;
  background-color: #ffffff;
  color: #1d353d;
  font-size: 14px;
  box-sizing: border-box;
}

.wpcf7 textarea {
  min-height: 120px;
  resize: vertical;
}

.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: #90a4ae;
}

/* Radio-knappar */
.wpcf7 .wpcf7-list-item {
  display: block;
  margin: 8px 0;
}

.wpcf7 .wpcf7-list-item label {
  font-weight: 400;
  cursor: pointer;
}

/* Kolumnlayouter (Namn/E-post & Land/Företag/Telefon) */
/* Rad- och flexbox-layout för kontaktfält */
.wpcf7 .cf7-row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
  margin-bottom: 16px;
}

.wpcf7 .cf7-col {
  padding-left: 10px;
  padding-right: 10px;
  box-sizing: border-box;
}

/* Kolumnbredder för stationära skärmar / dator */
.wpcf7 .cf7-col-50 {
  width: 50%;
}

.wpcf7 .cf7-col-33 {
  width: 33.333%;
}

/* Säkerställ att etiketter och fält tar hela bredden i sin kolumn */
.wpcf7 .cf7-col label {
  display: block;
  width: 100%;
  margin-bottom: 0;
}

.wpcf7 .cf7-col input {
  width: 100%;
}

/* Responsiv anpassning för mobilskärmar */
@media (max-width: 768px) {
  .wpcf7 .cf7-col-50,
  .wpcf7 .cf7-col-33 {
    width: 100%;
    margin-bottom: 16px;
  }
  
  .wpcf7 .cf7-row {
    margin-bottom: 0;
  }
}

/* Skicka-knapp */
.wpcf7 input[type="submit"] {
  background-color: #21434e;
  color: #ffffff;
  border: none;
  border-radius: 6px;
  padding: 14px 28px;
  font-size: 16px;
  font-weight: 600;
  width: 100%;
  cursor: pointer;
  transition: background-color 0.2s ease;
  margin-top: 10px;
}

.wpcf7 input[type="submit"]:hover {
  background-color: #162f37;
}



/* Styling för radioknapparna */
/* Återställ och anpassa radioknappens utseende */
.wpcf7 input[type="radio"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  
  width: 20px;
  height: 20px;
  border: 1.5px solid #61737d;
  border-radius: 50%;
  outline: none;
  background-color: #fff;
  cursor: pointer;
  
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  margin-top: -2px;
  position: relative;
  transition: all 0.2s ease;
}

/* Skapa den lilla inre pricken */
.wpcf7 input[type="radio"]::before {
  content: "";
  display: block;
  width: 8px;         /* Justera storlek på pricken här */
  height: 8px;        /* Justera storlek på pricken här */
  border-radius: 50%;
  background-color: #21434e;
  
  /* Centrera pricken i cirkeln */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0);
  transition: transform 0.2s ease;
}

/* När knappen är ikryssad: visa den lilla pricken och ändra ramfärg */
.wpcf7 input[type="radio"]:checked {
  border-color: #21434e;
}

.wpcf7 input[type="radio"]:checked::before {
  transform: translate(-50%, -50%) scale(1);
}

/* Text och placering för alternativen */
.wpcf7 .wpcf7-list-item {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}

.wpcf7 .wpcf7-list-item-label {
  font-weight: 400;
  color: #1d353d;
  font-size: 15px;
  cursor: pointer;
}

/* Nollställ onödiga radbrytningar som CF7 skapar */
.wpcf7 br {
  display: none;
}

/* Minska marginalen på paragrafer i formuläret */
.wpcf7 p {
  margin-top: 0;
  margin-bottom: 12px;
}

/* Ta bort extra marginaler inuti kolumnerna */
.wpcf7 .cf7-col p {
  margin-bottom: 0;
}

/* Se till att dolda grupper inte lämnar efter sig tomrum */
.wpcf7 .wpcf7cf-hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Strama åt avståndet mellan raderna */
.wpcf7 .cf7-row {
  margin-bottom: 12px;
}

/* Justera avståndet ovanför skicka-knappen */
.wpcf7 input[type="submit"] {
  margin-top: 16px;
}



/* =======================================================================================================================================================================
                                                                Variabelgrupper i kontaktformulär - Styling
======================================================================================================================================================================= */

/* Rubrik och beskrivning ovanför kortet */
.wpcf7 .group-title {
  color: #1d353d;
  font-size: 18px;
  font-weight: 700;
  margin-top: 24px;
  margin-bottom: 6px;
}

.wpcf7 .group-desc {
  color: #61737d;
  font-size: 14px;
  margin-bottom: 16px;
  line-height: 1.4;
}

/* Kort-rutan med grå bakgrund och mörkblå vänsterkant */
.wpcf7 .cf7-card-box {
  background-color: #f6f9fa;
  border: 1px solid #dbe3e6;
  border-left: 4px solid #21434e;
  border-radius: 8px;
  padding: 24px;
  margin-top: 12px;
  margin-bottom: 24px;
}

/* Inre avstånd och layout i kortet */
.wpcf7 .cf7-card-box label {
  display: block;
  margin-bottom: 20px;
}

.wpcf7 .cf7-card-box label:last-child {
  margin-bottom: 0;
}

.wpcf7 .field-label {
  font-weight: 600;
  color: #1d353d;
  font-size: 15px;
  margin-bottom: 8px;
}



/* =======================================================================================================================================================================
                                                                Hamburgermeny Off-canvas - Styling
======================================================================================================================================================================= */

/* För laptop / ipad-skärmar */
@media only screen and (min-width: 769px) and (max-width: 1200px) {
  
  /* Tvinga den sista/högra box-modulen att växa och inte låsa sig vid 50% */
  .fl-node-7o0bfwyvjlzk {
    flex-basis: auto !important;
    flex-grow: 1 !important;
    max-width: none !important;
    width: auto !important;
  }

  /* Gör att elementen inuti (Kontakta oss, FAQ, Hamburgermeny) lägger sig på en rak rad */
  .fl-node-7o0bfwyvjlzk .fl-module-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 15px !important; /* Avstånd mellan knapparna och hamburgermenyn */
  }
}

/* För laptop / ipad-skärmar */
@media only screen and (min-width: 769px) and (max-width: 1270px) {

  /* Dölj textmenyn (Kontakta oss, FAQ, Forum) så att loggan får plats i mitten */
  .fl-node-q2kv0yg4d3rb {
    display: none !important;
  }

  /* Justera högerboxen så att ikoner + hamburgare ligger snyggt längst till höger */
  .fl-node-c7ufyoiwj3p8 > .fl-module-content {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 15px !important;
  }
}


/* =======================================================================================================================================================================
                                                                multiselect__placeholder - Styling
======================================================================================================================================================================= */

.multiselect__placeholder {
	color: #717171 !important;
}

/* =======================================================================================================================================================================
                                                                XXXXXXXXXXXXXXXXXXXXXXXXX
======================================================================================================================================================================= */