/* 
Theme Name: World Oddities Expo Theme
Author: KDM
Template: hello-elementor
Version: 2.0.0
Text Domain: woe-theme
*/
<style>
		h1 {
				text-align: center;
			}

			.application.failed { background-color: #b74949 }
			.application.failed::after {
				content: 'Failed';
				color: white;
			}

			.application.cancelled { background-color: #616161 }
			.application.cancelled::after {
				content: 'Cancelled';
				color: white;
			}

			.application.processing { background-color: #e2ff7a }
			.application.processing::after {
				content: 'Processing';
				color: black;
			}

			.application.refunded { background-color: #e2ff7a }
			.application.refunded::after {
				content: 'Processing';
				color: black;
			}

			table { 
				width: 80% !important;
				margin: auto !important;
			}

			table, th, td { 
				border: 1px solid #8c8c8c !important;
				text-align: center;
				padding: 10px !important;
			}

			.city { pointer-events: none; }

			.application {
				border: 1px solid black;
				border-radius: 20px;
				width: fit-content;
				padding: 10px;
				margin: auto;
			}

			.application.pending { background-color: #E6E633; }

			.application.pending::after { 
				content: 'Under Review';
				color: #2c2424;
			}

			.application.approved { background-color: #3776CD; }

			.application.approved::after {
				content: 'Payment Due';
				color: white;
			}

			.application.completed {background-color: #008A00; }

			.application.completed::after {
				content: 'Paid in Full';
				color: white;
			}

			.application.waitlisted,
			.application.declined,
			.application.denied { background-color: #4d0f0f; }
			
			.application.waitlisted::after,
			.application.declined::after,
			.application.denied::after{
				content: 'Declined';
				color: white;
			}

			.application.expired { background-color: #4d0f0f }

			.application.expired::after {
				content: 'Expired';
				color: white;
			}

			.application.partially-paid,
			.application.partial { background-color: #41816a }

			.application.partially-paid::after,
			.application.partial::after {
				content: 'Partial Payment';
				color: white;
			}

			.invoice_button {
				display: block;
				width: fit-content !important;
				background-color: #008A00;
				padding: 10px;
				text-decoration: none;
				border: 1px solid black;
				border-radius: 20px;
				color: white !important;
				box-shadow: rgba(0, 0, 0, 0.25) 1.95px 1.95px 2.6px !important;
				margin: auto !important;
			}

			.invoice_button:hover {
				box-shadow: rgba(0, 0, 0, 0.55) 3px 3px 6px 0px inset, rgba(0, 0, 0, 0.25) -3px -3px 6px 1px inset !important;
				color: white;
			}

			.invoice_dropdown_header { text-decoration: underline; }

			.invoice_dropdown {
				position: relative;
				cursor: default;
			}

			.invoice_dropdown:hover .invoice_dropdown_list { display: block; }

			.invoice_dropdown_list {
				display: none;
				position: absolute;
				top: 35px;
				left: 0;
				right: 0;
				z-index: 10;
				background-color: #65759F;
				width: 200px;
				margin: auto;
			}

			.invoice_dropdown_list * {
				border: 1px solid black;
				border-left: 1px solid black;
				border-right: 1px solid black;
				margin-bottom: 0;
				color: white;
				padding: 10px;
			}

			th:has(.application.pending) + th .invoice_button,
			th:has(.application.denied) + th .invoice_button,
			th:has(.application.waitlisted) + th .invoice_button,
			th:has(.application.completed) + th .invoice_button,
			th:has(.application.expired) + th .invoice_button {
				display: none;
			}

			h1 {
				margin: 10px !important;
			}

			@media screen and (max-width: 547px) {
				.invoice_button {
					font-size: 12px !important;
					width: fit-content;
				}
			}
</style>