@charset "UTF-8";
/* CSS Document */

			#program {
				box-sizing: border-box;
				height: 100vh;
				height: 100dvh;
				height: 100svh;
			}
			#program .mirror {
				height: 100%;
				color: white;
			}
			#program .titles {
				position: relative;
				height: var(--copies);
				outline: 1px solid orange;
				outline: none;
			}
			#program .titles h2 {
				position: absolute;
				bottom: 15px;
				color: white;
			}
			#program .copies {
				position: relative;
				height: calc(100% - var(--copies));
				outline: 1px solid orange;
				outline: none;
			}
			#program .background {
				background-color: var(--brand_darkblue);
			}

			.program-table-wrap {
				margin-top: 20px;
				overflow-x: auto;
				-webkit-overflow-scrolling: touch;
			}
			.program-table {
				width: 100%;
				border-collapse: collapse;
				min-width: 760px;
				background: var(--brand_blue);
				border-radius: 14px;
				overflow: hidden;
				table-layout: fixed;
			}
			.program-table th,
			.program-table td {
				padding: 12px 14px;
				vertical-align: middle;
				text-align: left;
				border-bottom: 2px solid var(--brand_darkblue);
				color: white;
				hyphens: none;
				word-break: normal;
				overflow-wrap: normal;
			}
			.program-table tbody tr:last-child td {
				border-bottom: none;
			}
			.program-table tbody tr {
				height: 74px;
			}
			.program-table tbody tr.program-break-row {
				height: 37px;
			}
			.program-table thead th {
				font-size: var(--copy_size_smaller);
				text-transform: uppercase;
				letter-spacing: 0.03em;
				font-weight: 700;
				background: var(--brand_purple);
				padding-top: 30px;
				padding-bottom: 30px;
			}
			.program-table thead th:nth-child(1),
			.program-table tbody td:first-child {
				width: 130px;
				padding-left: 22px;
			}
			.program-table tbody td:first-child {
				white-space: nowrap;
				font-weight: 700;
				font-size: var(--copy_size);
			}
			.program-table thead th:nth-child(2),
			.program-table tbody td:nth-child(2) {
				width: 120px;
			}
			.program-table thead th:nth-child(2) {
				padding-right: 24px;
			}
			.program-table tbody td:nth-child(2) {
				white-space: nowrap;
				font-size: var(--copy_size_small);
				opacity: 0.9;
				margin: 0 0 0 25px;
			}
			.program-duration-cell {
				position: relative;
				padding-left: 42px;
			}
			.program-duration-icon {
				position: relative;
				left: 10px;
				top: 50%;
				transform: translate(-50%, -5%);
				width: 25px;
				height: 25px;
				display: inline-block;
				vertical-align: middle;
			}
			.program-duration-text {
				display: inline-block;
			}
			.program-table tbody td:nth-child(3) {
				width: 32%;
				font-size: var(--copy_size);
				line-height: 1.2;
				font-weight: 400;
			}
			.program-table thead th:nth-child(4),
			.program-table tbody td:nth-child(4) {
				width: 32%;
			}
			.program-table tbody td:nth-child(4) {
				font-size: var(--copy_size_small);
				line-height: 1.35;
				opacity: 0.9;
			}
			.program-table thead th:nth-child(5),
			.program-table tbody td:nth-child(5) {
				width: 46px;
				padding-left: 6px;
				padding-right: 10px;
				text-align: center;
			}
			.program-toggle-head {
				font-size: 0;
			}
			.program-toggle-cell {
				vertical-align: middle;
				padding: 0 !important;
				position: static;
			}
			.program-table tbody tr.program-has-description {
				position: relative;
			}
			.program-row-toggle {
				display: flex;
				align-items: center;
				justify-content: flex-end;
				position: absolute;
				inset: 0;
				width: 100%;
				height: 100%;
				min-height: 100%;
				border: 0;
				background: transparent;
				color: white;
				font-size: 0;
				line-height: 1;
				padding: 0 10px 0 0;
				cursor: pointer;
				opacity: 1;
				transition: color 0.2s ease;
				z-index: 2;
				overflow: hidden;
			}
			.program-row-toggle:before {
				content: "";
				position: absolute;
				inset: 0;
				background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%);
				opacity: 0;
				transition: opacity 0.3s ease;
				pointer-events: none;
				z-index: 0;
			}
			.program-row-toggle:hover {
			}
			.program-row-toggle:hover:before {
				opacity: 1;
			}
			.program-row-toggle .material-symbols-outlined {
				font-size: 30px;
				line-height: 1;
				font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
				transition: transform 0.2s ease;
				position: relative;
				z-index: 1;
			}
			.program-has-description.is-open .program-row-toggle .material-symbols-outlined {
				transform: rotate(90deg);
			}
			.program-has-description.is-open > td {
				border-bottom: none;
			}
			.program-description-row[data-hidden="1"] {
				display: none;
			}
			.program-description-row td {
				padding-top: 0;
				background: var(--brand_blue);
			}
			.program-description-content {
				padding: 0 25px 10px 0;
				font-size: var(--copy_size);
				line-height: 1.45;
				color: #ffffffba;
				white-space: normal;
				font-weight: 400;
			}
			.program-description-body {
				display: flex;
				align-items: flex-start;
				gap: 14px;
				margin-left: 25px;
			}
			.program-description-speaker-photo {
				position: relative;
				flex: 0 0 85px;
				width: 85px;
				height: 85px;
				border-radius: 999px;
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				overflow: hidden;
				background-color: white;
			}
			.program-description-speaker-photo.has-image:before {
				display: none;
			}
			.program-description-text {
				flex: 1 1 auto;
				min-width: 0;
			}
			.program-description-speaker-photo:before {
				content: "";
				display: block;
				position: absolute;
				inset: 0;
				background-image: url(../../images/icon/black/profile.svg);
				background-repeat: no-repeat;
				background-position: center;
				background-size: 50%;
				background-color: #ddd;
				opacity: 0.5;
				z-index: 0;
			}
			.program-table tbody tr.program-break-row td {
				color: var(--brand_yellow);
			}
			.program-table tbody tr.program-break-row td:nth-child(3) {
				color: var(--brand_yellow);
				font-weight: 700;
			}

			@media screen and (max-width: 959.8px) {
				.program-table-wrap {
					margin-top: 14px;
					overflow-x: visible;
				}
				.program-table {
					min-width: 0;
					border-radius: 12px;
					display: block;
				}
				.program-table thead {
					display: block;
					border-bottom: 2px solid var(--brand_darkblue);
				}
				.program-table thead tr {
					display: flex;
					flex-direction: column;
				}
				.program-table thead th {
					display: block;
					width: 100%;
					flex: 0 0 auto;
					padding: 10px 15px 10px 22px;
					border-bottom: 1px solid rgba(255,255,255,0.25);
					font-size: var(--copy_size_small);
					box-sizing: border-box;
				}
				.program-table thead th:nth-child(1),
				.program-table thead th:nth-child(2),
				.program-table thead th:nth-child(3),
				.program-table thead th:nth-child(4),
				.program-table thead th:nth-child(5) {
					width: 100%;
					padding-left: 22px;
					padding-right: 15px;
				}
				.program-table thead th.program-toggle-head {
					display: none;
				}
				.program-table thead th:last-child {
					border-bottom: none;
					padding-top: 6px;
					padding-bottom: 6px;
				}
				.program-table,
				.program-table tbody,
				.program-table tbody tr,
				.program-table td {
					display: block;
					width: 100%;
				}
				.program-table tbody tr {
					border-bottom: 2px solid var(--brand_darkblue);
					height: auto;
				}
				.program-table tbody tr:last-child {
					border-bottom: none;
				}
				.program-table td {
					border-right: none;
					border-bottom: 2px solid var(--brand_darkblue);
					padding: 10px 12px;
				}
				.program-table td:last-child {
					border-bottom: none;
				}
				.program-table td::before {
					display: block;
					font-size: var(--copy_size_small);
					font-weight: 700;
					opacity: 0.9;
					margin-bottom: 4px;
					text-transform: uppercase;
					letter-spacing: 0.03em;
				}
				.program-table td:nth-child(1)::before {content: "Idősáv";display: none;}
				.program-table td:nth-child(2)::before {content: "Időtartam";display: none;}
				.program-table td:nth-child(3)::before {content: "Programelem";display: none;}
				.program-table td:nth-child(4)::before {content: "Műfaj / közreműködő";display: none;}
				.program-table td:nth-child(5)::before {content: "";display: none;}
				.program-description-row td::before { content: none !important; display: none !important; }

				.program-table tbody td:first-child,
				.program-table tbody td:nth-child(2),
				.program-table tbody td:nth-child(3),
				.program-table tbody td:nth-child(4),
				.program-table tbody td:nth-child(5) {
					width: auto;
					white-space: normal;
					font-size: var(--copy_size);
					line-height: var(--copy_line_height);
					opacity: 1;
					font-weight: 400;
				}
				.program-table tbody td:nth-child(5) {
					text-align: left;
					padding-top: 2px;
				}
				.program-duration-cell {
					position: relative;
					padding-left: 36px;
				}
				.program-table tbody td:nth-child(3) {
					font-size: var(--copy_size);
					font-weight: 400;
					line-height: var(--copy_line_height);
				}
				.program-table tbody tr.program-break-row td:nth-child(3) {
					color: var(--brand_yellow);
				}
				.program-description-row td {
					border-bottom: none;
				}
				.program-description-body {
					align-items: flex-start;
					margin-left: 0;
				}
				.program-description-speaker-photo {
					display: none;
				}
				.program-table tbody td:nth-child(1) {
					display: inline-block;
					width: calc(30% - 10px);
					padding:5px 0 5px 15px;
					margin:0;
					border-bottom:none;
				}
				.program-table tbody td:nth-child(2) {
					display: inline-block;
					width: calc(70% - 10px);
					padding:5px 0 5px 0;
					margin:0;
					border-bottom:none;
				}
				.program-table tbody td:nth-child(3) {
					display: inline-block;
					width: calc(100% - 10px);
					padding:0 0 0 15px;
					margin:0;
					border-bottom:none;
				}
				.program-table tbody td:nth-child(4) {
					display: inline-block;
					width: calc(100% - 20px);
					padding: 0 10px 5px 15px;
					margin:0;
					border-bottom:none;
					opacity: 0.6;
				}
				.program-table tbody tr.program-has-description hidden {
					display:none;
				}
				.program-table tbody tr.program-has-description td {
					border-bottom:none;
				}
				.program-table tbody tr.program-description-row td {
					display:block;
					width: calc(100% - 20px);
					padding: 5px 5px 5px 15px;
					border-top:none;
				}
				.program-table tbody tr.program-description-content td {
					border-bottom:none;
				}
				.program-table tbody tr.program-break-row {
					height:auto;
				}
				.program-table tbody tr.program-break-row td:nth-child(1) { width:calc(30% - 10px); }
				.program-table tbody tr.program-break-row td:nth-child(2) { width:calc(30% - 10px); }
				.program-table tbody tr.program-break-row td:nth-child(3) { width:calc(30% - 10px); }
				.program-table tbody tr.program-break-row td:nth-child(4) { display:none; }
				.program-table tbody tr.program-break-row td:nth-child(5) { display:none; }

			}