
.operator-popup-tlo {
	position: fixed;
	top: -30%;
	left: -10%;
	width: 120%;
	height: 160%;
	z-index: 1001;
	display: flex;
	align-content: center;
	background-color: rgba(127, 127, 127, 0.5);
}

.operator-popup {
    min-width: min(50rem, 95vw);
    max-width: min(105.5rem, 95vw);
	margin: auto;
	box-sizing: border-box;

	padding: 3rem 1rem 1.5rem;
	background-color: white;
	box-shadow: 0 0 20px #333;
	border: 1px solid #333;
    position: relative;
}

.operator-popup > div {
	max-height: calc(95vh - 10rem);
	overflow-y: auto;
	overflow-x: hidden;
}

.operator-popup .krzyzyk {
    right: 0.25rem;
    top: -0.5rem;
    position: absolute;
    font-size: 2.5em;
}

.operator-popup .krzyzyk:hover {
    color: var(--maincolor);
    cursor: pointer;
    user-select: none;
}

/***************************************** Zawartość **************************************************/
@media screen and (min-width: 901px) {
	.operator-popup .kolumny {
		display: grid;
		display: flex;
		flex-wrap: wrap;
		gap: 0.5rem;
	}

	.operator-popup .kolumny > p {
		margin: 0;
		min-width: 25rem;
		max-width: 101.5rem;
	}
}

.operator-popup .kolumny > p input:not(:disabled) {
	background-color: #47a9d72f;
}

.operator-popup .kolumny > p input:disabled {
	background-color: white;
	border-color: #444;
}

.operator-popup .szeroki_header {
	margin: 0;
	display: flex;
}

.operator-popup .szeroki_header:not(:first-child) {
	margin-top: 2rem;
}

.operator-popup .wszystkie-pola {
	font-size: 0.8rem;
	width: 8rem;
	padding: 0.1rem;
	margin-left: 1rem;
	align-self: baseline;
	background-color: white;
	color: #444;
	border-color: #444;
}

.operator-popup .wszystkie-pola.klikniety {
	background-color: #444;
	color: white;
}

/***************************************** Tabelka ****************************************************/
.operator-popup table {
	width: calc(100% - 0.5rem);
}

.operator-popup table thead td {
	background-color: #444;
	color: white;
	border: 1px solid #666;
}

.operator-popup table td {
	text-align: left;
	border: 1px solid #444;
	padding: 0.5rem 1rem;
	white-space: break-spaces;
}

.operator-popup table td.podglad {
	padding: 0;
	width: 6rem;
}

.operator-popup table td.podglad .obrazek {
	border: none;
}

/***************************************** Przyciski **************************************************/
.operator-popup .przyciski {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
	justify-content: center;
	margin: 2rem 0 0;
}

.operator-popup .przyciski.drugi {
	margin: 0.5rem 0 0;
}

.operator-popup button, .panel .operator-popup input[type=submit] {
	text-transform: uppercase;
	max-width: 30rem;
}

.operator-popup .przyciski.krotkie button {
	max-width: 20rem;
}

/***************************************** Select **************************************************/
.operator-popup select {
	width: 100%;
 	width: -webkit-fill-available;
  	width: -moz-available;
	background-color: #47a9d72f;
}

.operator-popup select option {
	background-color: white;
}
