/* Grid kafelków logotypów */
.emedia-logo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
}

@media (max-width: 1024px) {
  .emedia-logo-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 650px) {
  .emedia-logo-grid { grid-template-columns: repeat(2, 1fr); }
}

.emedia-logo-tile {
  background: #fff;
  border: 1px solid #BFBFBF;
  border-radius: 8px;
  padding: 30px;
  aspect-ratio: 370 / 205;
  box-sizing: border-box;
  cursor: pointer;
  
  display: flex;
  align-items: center;
  justify-content: center;
	transition: all 0.2s ease;
}

@media screen and (max-width: 500px) {
	.emedia-logo-tile {
		padding: 25px;
	}
}

.emedia-logo-tile:hover {
  border: 1px solid transparent;
  box-shadow: 0px 15px 30px 2px #1D3F791A;
	transition: all 0.2s ease;
}

.emedia-logo-tile-inner {
  width: 100%;
  height: 100%;
  max-width: 250px;
  max-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.emedia-logo-tile img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.emedia-logo-placeholder {
  display: inline-flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  font-size: 48px;
  color: #999;
}

/* Modal */
.emedia-logo-modal {
  position: fixed;
  inset: 0;
  z-index: 999999; /* wyższy stacking, ponad typowe nakładki */
}
.emedia-logo-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
}
.emedia-logo-modal__dialog {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  border-radius: 8px;
  width: 95vw;
  max-width: calc(1650px - 6%);
  height: 90vh;
  max-height: 650px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

@media screen and (max-width: 900px) {
	.emedia-logo-modal__dialog {
		height: 95vh;
		max-height: 95vh; 
	}
}

.emedia-logo-modal__header {
  padding: 30px 3%;
  border-bottom: 1px solid #BFBFBF;
}
.emedia-logo-modal__header-right {
  display: flex;
  gap: 25px;
  align-items: center;
  justify-content: space-between;
}

.emedia-logo-modal__figure {
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  height: 80px;
}
.emedia-logo-modal__logo {
	width: 100%;
	height: 100%;
  object-fit: contain;
  object-position: 0 50%;
}
.emedia-logo-modal__more {
  background: #0073aa;
  color: #fff;
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 4px;
  margin-left: auto;
}
.emedia-logo-modal__close {
  border-radius: 4px;
  width: 20px;
  height: 20px;
  background: unset;
  font-size: 0; /* ikonka SVG, bez tekstu */
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.emedia-logo-modal__close svg {
	width: 20px;
	height: 20px;
	transition: all 0.2s ease;
}

.emedia-logo-modal__close:hover svg {
	filter: brightness(0) saturate(100%) invert(58%) sepia(53%) saturate(6536%) hue-rotate(346deg) brightness(100%) contrast(91%);
	transition: all 0.2s ease;
}

@media screen and (max-width: 700px) {
	.emedia-logo-modal__header {
		padding: 15px 3%;
	}
	
	.emedia-logo-modal__header-right {
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	
	.emedia-logo-modal__header-right figure.emedia-logo-modal__figure {
		order: 1;
		width: 120px;
		height: 60px;
	}
	
	.emedia-logo-modal__header-right a.emedia-logo-modal__more {
		order: 3;
		margin-left: unset;
	}
	
	.emedia-logo-modal__header-right button.emedia-logo-modal__close {
		order: 2;
		margin-left: auto;
	}
}


.emedia-logo-modal__body {
  padding: 20px 5% 30px 3%;
  overflow-y: auto; /* przewijanie w pionie dla długiej treści */
  flex: 1 1 auto;   /* zajmuje całą pozostałą wysokość pod headerem */
  min-height: unset !important;
  position: relative; /* dla overlayowego scrollbara */
  width: unset !important;
}

@media screen and (max-width: 600px) {
	.emedia-logo-modal__body {
		padding-right: 30px;
	}
}

#content.emedia-logo-modal__body ul.wp-block-list {
	margin: 20px auto;
	display: grid;
	grid-auto-columns: 1fr; 
	grid-template-columns: 1fr 1fr; 
	gap: 30px 30px; 
}

@media screen and (max-width: 1000pX) {
	#content.emedia-logo-modal__body ul.wp-block-list {
		grid-template-columns:  1fr 1fr;
	}
	
	#content.emedia-logo-modal__body ul.wp-block-list li {
		width: unset;
		min-width: unset;
	}
}

@media screen and (max-width: 900pX) {
	#content.emedia-logo-modal__body ul.wp-block-list {
		grid-template-columns:  1fr;
	}
}

/* Stylowanie paska przewijania (Chromium/WebKit) */
.emedia-logo-modal__body::-webkit-scrollbar {
  width: 0;
  height: 0; /* ukrycie natywnego scrollbara */
}
.emedia-logo-modal__body::-webkit-scrollbar-track {
  background: #DFDFDF;
  border-radius: 30px;
}
.emedia-logo-modal__body::-webkit-scrollbar-thumb {
  background: #F25E2A;
  border-radius: 30px;
}

.emedia-logo-modal__body::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  display: none; /* bez strzałek */
}

.emedia-logo-modal__body::-webkit-scrollbar-corner {
  background: transparent;
}

/* Stylowanie paska przewijania (Firefox) */
.emedia-logo-modal__body {
  scrollbar-color: #F25E2A #DFDFDF; /* thumb | track */
  scrollbar-width: none;
}

/* Overlayowy custom scrollbar */
.emedia-scrollbar {
  position: absolute !important;
  right: 2%;
  top: 10px;
  bottom: 10px;
  width: 8px;
  background: #DFDFDF;
  border-radius: 30px;
}
.emedia-scrollbar__thumb {
  position: absolute;
  right: 0;
  width: 8px;
  min-height: 20px;
  background: #F25E2A;
  border-radius: 30px;
  cursor: grab;
}
.emedia-scrollbar__thumb:active {
  cursor: grabbing;
}

