/* === Dropdown base === */
#wcag .dropdown {
  position: relative;
}

#wcag .dropdown-menu {
  position: absolute;
  z-index: 1000;
  display: none;
  min-width: 17rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 18px;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}
#wcag .dropdown-menu li {display:block;}

/* Pokazywanie dropdowna (JS doda klasę .show) */
#wcag .dropdown-menu.show {
  display: block;
}

/* === Elementy menu === */
.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  text-decoration: none;
  background-color: transparent;
  border: 0;
  cursor: pointer;
  transition: background-color 0.15s ease-in-out;
}

.dropdown-item:hover,
.dropdown-item:focus {
  color: #1e2125;
  background-color: #f8f9fa;
}

.dropdown-item.active,
.dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #0d6efd;
}

.dropdown-item.disabled,
.dropdown-item:disabled {
  color: #6c757d;
  pointer-events: none;
  background-color: transparent;
}

/* === Separator === */
.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  overflow: hidden;
  border-top: 1px solid rgba(0, 0, 0, 0.15);
}

/* === Kolor dla opcji niebezpiecznych === */
.dropdown-item.text-danger {
  color: #dc3545;
}

.dropdown-item.text-danger:hover {
  background-color: #f8d7da;
  color: #a71d2a;
}






#wcag {
				position:fixed;
				width: 40px;
				right:22px;
				bottom:5rem;
				z-index:1000;
			}
			
			.fontsize, .btn-wcag-settings {
				    border-radius: 100px ;
				padding-left: .9375rem;
				padding-right: .9375rem;
				position: relative;
				background-color: #fafbfa;
				text-align: center;
				width: 36px;
				padding: 2px 0 8px;
				border: 2px solid #e2e9e0;
				list-style-type:none !important;
				margin-bottom: .5rem;
			}
			.btn-wcag-settings {height:36px; padding-left:5px;}
			.btn-wcag-settings::after {margin-left:-5px;}
			.btn-wcag-settings svg {width:22px !important; height:22px !important;}
			.accessibility-dropdown .dropdown-menu {border-radius:16px; overflow:hidden; padding-top:0; padding-bottom:0;}
			.accessibility-dropdown .dropdown-menu li:first-child a{padding-top: .5rem;}
			.accessibility-dropdown .dropdown-menu li:last-child a{padding-bottom: .5rem;}
			.accessibility-dropdown .dropdown-menu li a {font-size:18px;}
			
			.fontsize li {
				padding: 0;
				margin-left: 0
			}

		 
.fontsize li button {
    font-weight: 500;
    width: 32px;
    height: 32px;
    display: block;
    border-radius: 50% !important;
    color: #000;
	line-height:32px;
	border:none;
	padding:0 !important;
	background:transparent;
	text-align:center;
	letter-spacing:0 !important;
}

			.fontsize li button[data-size="1"] {
				font-size: 14px !important;
				
			}

			.fontsize li button[data-size="2"] {
				font-size: 22px !important;
			}

			


			.color-switcher {
			  z-index: 10;
			  cursor: pointer;
			}

			.color-switcher .switcher {
			  background-color: #fafbfa;
			  text-align: center;
			  width: 36px;
			  padding: 2px 0 8px;
			  border: 2px solid #e2e9e0;
			}

			body.dark-theme .color-switcher .switcher, body.dark-theme .fontsize,
			body.dark-theme .btn-wcag-settings{
			  background-color: #232323;
			  border-color:#484848;
			}
			body.dark-theme .btn-wcag-settings svg {fill:#fff;}
			body.dark-theme .accessibility-dropdown .dropdown-menu {
				background-color: #232323;
				border-color:#484848;
			}
			.accessibility-dropdown .dropdown-menu a:hover {}
			.accessibility-dropdown .dropdown-menu a:focus {background:#232323;}
			
			body.dark-theme .accessibility-dropdown .dropdown-menu  a {color:#fff;}
			body.dark-theme .accessibility-dropdown .dropdown-menu a:hover {background:#484848;}
			
			body.dark-theme .fontsize li a {color:#fff;}
			
			body.dark-theme tbody tr:nth-child(even), body.high-contrast tbody tr:nth-child(even){
				background-color: #222;
			}	
			
			body.dark-theme tbody tr:nth-child(even):hover, body.high-contrast tbody tr:nth-child(even):hover{
				background-color: #111;
			}

			body.dark-theme {
				--body-color: #646464;
				--heading-color: #ccc;
				--white-color: #ffffff;
				--black-color: #ccc;
				--dark-color: #111111;
				--light-blue-color: #f5f7fb;
				--default-color-rgb: 26,25,29;
				--primary-color-rgb: 28,44,52;
				--second-color-rgb: 170,153,138;
				--body-color-rgb: 100,100,100;
				--heading-color-rgb: 17,17,17;
				--white-color-rgb: 255,255,255;
				--black-color-rgb: 0,0,0;
				--dark-color-rgb: 17,17,17;
				--light-blue-color-rgb: 245,247,251;
				
			}


			.fontsize li button.active, body.dark-theme .fontsize li a.active {
				color: #fff;
				background:#000;
			}

			.color-switcher .switcher:first-child {
			  border-radius: 100px 100px 0 0;
			  position: relative;
			  border-bottom: none;
			}

			.color-switcher .switcher:first-child:before {
			  content: "";
			  position: absolute;
			  display: block;
			  top: -2px;
			  bottom: 0;
			  left: -4px;
			  width: 40px;
			  background-color: #000;
			  z-index: 0;
			  border-radius: 10px !important;
			  box-shadow: 1px 1px 6px rgba(17, 16, 19, 0.1);
			  transition: ease 0.3s;
			  transform: translateY(100%);
			}

			body.dark-theme .color-switcher .switcher {
			  border-color: #484848;
			}

			body.dark-theme .color-switcher .switcher:first-child:before {
			  transform: translateY(0);
			  background-color: #484848;
			}

			.color-switcher .switcher:last-child {
			  border-radius: 0 0 100px 100px;
			  border-top: none;
			}

			
			.color-switcher .switcher svg {
			  position: relative;
			  z-index: 1;
			}

			.color-switcher .switcher svg path {
			  fill: #010921 !important;
			}
			.color-switcher .switcher:last-child  svg path{ fill: #fff !important;}

			body.dark-theme .color-switcher .switcher svg path {
			  fill: #fff !important;
			}



			/* wcag */
			body.size-1 {
				font-size: 100%;
			}
			body.size-2 {
				font-size: 125%;
			}
			
			body.size-2 h1, body.size-2 .h1 {    font-size: 65px !important;}
			body.size-2 h2, body.size-2 .h2 {    font-size: 55px !important;}
			body.size-2 h3, body.size-2 .h3 {    font-size: 45px !important;}
			body.size-2 h4, body.size-2 .h4 {    font-size: 40px !important;}
			body.size-2 h5, body.size-2 .h5 {    font-size: 35px !important;}
			body.size-2 h6, body.size-2 .h6 {    font-size: 30px !important;}
			
			body.size-2 .heading-subtitle {font-size: 19px !important;}
			
			
			body.size-2 .btn, body.size-2 button, body.size-2 .button, body.size-2 input[type="submit"], body.size-2 input[type="button"], 
			body.size-2 .added_to_cart, body.size-2 .pxl-btn {
				font-size: 18px !important;
			}
	

			/* Jasna kolorystyka (standardowa) */
			body.light-theme {
				background-color: #fff;
				color: #000;
			}

			/* Jaskrawa kolorystyka (kontrastowa) */
			body.dark-theme {
				background-color: #000;
				color: #efefef;
			}
			
			body.grayscale *{
    filter: grayscale(100%);
}

body.high-contrast {
    background-color: #000 !important;
    color: #ff0 !important;
}

body.readable-font main *{
    font-family: Arial, sans-serif !important;
    letter-spacing: 0.5px;
}

body.underline-links a {
    text-decoration: underline !important;
}


/* koniec wcag */


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


.diets-grid .button-secondary {background:#fff;}

			
			.white-popup {
			  position: relative;
			  background: #FFF;
			  padding: 20px;
			  width: auto;
			  max-width: 80vw;
			  margin: 20px auto;
			}