.flex-container {
	display: flex;
	flex-wrap: nowrap;
}

.desktop {
	display: none;
}

.programme-body-items {
	display: grid;
	align-content: start;
	height: 100%;
}

.subcontainers {
	padding: 2rem 1rem 0 1rem;
	display: grid;
	grid-template-rows: max-content 1fr;
}

.menu-button-container {
	display: grid;
    grid-row: 1;
    justify-items: center;
}

.menu-button-container img {
	max-width: 100%;
}

.menu-button-container span {
	font-weight: bold;
	font-size: .9rem;
}

.input-modal-mobile-body {
	display: grid;
	height: -webkit-fill-available;
	grid-auto-rows: 1fr max-content;
	/* for the menu at the bottom */
}

.input-modal-mobile-menu {
	display: grid;
	grid-template-columns: repeat(auto-fill, 25%);
	height: 4rem;
	width: 100%;
	justify-items: center;
	background: white;
}

.input-modal-mobile-menu img {
	max-height: 100%;
}

.input_modal_container {
	background-color: rgba(0, 0, 0, 0.1);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100dvh;
	z-index: 2;
	align-items: center;
	justify-content: center;
}

.input_modal_field {
	display: grid;
	background-color: white;
	padding: 1rem;
	width: calc(100% - 2rem);
	border-radius: 15px;
	flex-direction: column;
	height: calc(100dvh - 2rem);
}

.hamburger-toggle {
	padding: .7rem;
	position: absolute;
	height: 3rem;
	aspect-ratio: 1;
	left: 100%;
	background: white;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
}

.move-right {
	transform: translateX(0) !important;
}

.row-suggestion:nth-child(even) {
	background-color: rgb(185, 255, 232);
}

.row-suggestion:hover {
	background-color: rgb(119, 255, 210);
}

.modal-menu {
	display: grid;
	overflow: visible;
	grid-auto-flow: column;
	align-items: center;
}

.modal-menu .close-button {
	justify-self: end;
	grid-column: initial;
}

.relation-search-suggestion-container {
	overflow: auto;
	display: grid;
	grid-template-rows: max-content;
}

/* MOBILE INPUT MODAL CLASSES */
.mobile-input-modal-header {
	display: grid;
	grid-template-columns: max-content 1fr max-content;
	/*overflow: visible;*/
	margin-bottom: 1rem;
	height: max-content;
}

.mobile-input-modal-body {
	display: grid;
	height: -webkit-fill-available;
	grid-auto-rows: 1fr max-content;
}

/* Container layout */
.mobile-menu-button {
	display: grid;
	justify-items: center;
	font-weight: bold;
	position: relative;
	padding-bottom: 8px;
}

/* Base selection bar (hidden state) */
.mobile-menu-selection-bar {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 4px;
	border-radius: 9999px;
	background-color: currentColor;
	opacity: 0;
	transition: opacity 0.15s ease;
}

/* Active selection state */
.mobile-menu-underline {
	opacity: 1;
}

.external-order-relation-tab {
    min-height: 100%;
    grid-auto-rows: min-content;
    gap: 1rem;
}

.external-order-catalog-tab {
	height: 100%;
	min-height: 0;
	grid-template-rows: minmax(0, 1fr) max-content;
	gap: 0.5rem;
}

.external-order-catalog-list {
	min-height: 0;
	overflow-y: auto;
}

.external-order-catalog-loading {
	display: grid;
	place-items: center;
	height: 100%;
}

.external-order-catalog-options {
	display: grid;
	gap: 1rem;
}

.external-order-catalog-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) max-content;
	gap: 0.3rem;
}

.external-order-catalog-name {
	overflow-wrap: anywhere;
}

.external-order-catalog-buttons {
	grid-column: 1 / -1;
	display: flex;
	justify-content: end;
	gap: 0.3rem;
}

.external-order-catalog-buttons button:disabled {
	cursor: not-allowed;
}

.external-order-catalog-search {
	display: grid;
	gap: 0.3rem;
}

@media only screen and (min-width: 433px) {
	.desktop {
		display: revert;
	}
	
	.hamburger-toggle {
		display: none;
	}
}