/* ================================
   Airport Table Styles
   ================================ */

						.page-wrapper-inner-section-icons-div {
							align-items		: center				;
							display			: flex					;
							justify-content	: space-evenly			;
							min-height		: 120px					;
						}

				/* ==============================
					TABLES
				============================== */

					/* Page OUTER wrapper */
						.page-wrapper-outer {
							background-color: #E4E1E0				;
							border			: 10px outset #00A3EE	;	/* Microsoft blue */
							border-radius	: 20px					;
							margin-left		: auto					;
							margin-right	: auto					;
							padding			: 10px					;	/* ← THIS creates the gap between border and table: try 4px, 6px, 8px, etc. */
							width			: fit-content			;
						}

					/* Page INNER wrapper */
						.page-wrapper-inner {
							background-color: #F5F5F5			;	/* WhiteSmoke */
							border-radius	: 15px				;
							margin-left		: auto				;
							margin-right	: auto				;
							padding			: 6px				;	/* ← THIS creates the gap between border and table: try 4px, 6px, 8px, etc. */
							width			: fit-content		;
						}

						.page-wrapper-inner-border-forums {
							border			: 5px outset Orange	;	/* Red */
							min-height: 100px;	/* TEMP */
						}

						.page-wrapper-inner-border-software {
							border			: 5px outset #FF0000	;	/* Red */
							min-height: 100px;	/* TEMP */
						}

						.page-wrapper-inner-border-software-test {
							border			: 1px solid Red	;	/* Red */
							min-height: 100px;	/* TEMP */
						}

						.page-wrapper-inner-border-other {
							border			: 5px outset #BF40BF	;	/* Purplish */
						}

						.page-wrapper-inner-section-icons {
							margin-left		: auto					;
							margin-right	: auto					;
							text-align		: center				;
						}

				/* ====================================================================================================================================
					SOME of the individual TABLES used on these pages:
						class="vaccinationsTable"		- applies to both tables/pages
						class="vaccinationsTableCovid"	- differences from the above shared CSS that applies only to the COVID vaccinations table/page
						class="vaccinationsTableOther"	- differences from the above shared CSS that applies only to the COVID miscellaneous table/page
						class="doctorsTable"			- intial table from another page that I used as a reference for these new vaccination tables
				==================================================================================================================================== */

						.overallTable {
							background-color	: #E4E1E0								;
							border				: none									;
							border-collapse		: collapse								;
							font-family			: Verdana, Arial, Helvetica, sans-serif	;
							font-size			: 11px									;
							margin-left			: auto									;
							margin-right		: auto									;
							white-space			: nowrap								;
						}

						.overallTable th,
						.overallTable td {
							padding: 6px 10px;
							border: 1px solid #ccc;
							text-align: center;
						}

						.headerTable {
							border-collapse: collapse;
							font-family: Arial, sans-serif;
							font-size: 10px;
							margin-left		: auto					;
							margin-right	: auto					;
						}

						.headerTable th,
						.headerTable td {
							padding: 6px 10px;
							text-align: center;
						}

				/* ==============================
					INDIVIDUAL LINKS TABLES
				============================== */

						.linksTableOuter {
							background-color: #F5F5F5			;	/* WhiteSmoke */
							border			: none				:
							border-collapse : collapse			;	/* Keep border-collapse: collapse border-radius requires separate, but causes unwanted double borders. */
							border-radius	: 20px				;
							font-size		: 11px				;
							margin			: 0 auto			;
						}

						.linksTableOuter > tbody > tr > td {
							vertical-align: top;
						}

						.linksTableOuter th,
						.linksTableOuter td {
							padding			: 4px 2px			;
							text-align		: center			;
							vertical-align	: top				;
						}

						.linksTableOuter td {
							border			: 1px solid grey	;
						}

						.linksTableInner {
							background-color: #F5F5F5			;	/* WhiteSmoke */
							border-collapse : separate;
							border          : none;
							font-size       : 11px;
							margin          : 0 5px;
						}

						.linksTableInner td {
    						border: none;
							font-size				: 10.0px	;	//	This is the font size for all items in the table
							padding					: 5px 8px	;
							text-align				: left		;
						}

					/* Zebra-Striping */
						.linksTableInner > tbody > tr:nth-child(odd) {
							background-color: #ffe9a9;
						}

						.linksTableInner > tbody > tr:nth-child(even) {
							background-color: #dedede;
						}

				/* ==============================
					HEADERS
				============================== */

					/* Header */
						.linksTableInner thead th {
							background-color		: grey;
							color					: #ffffff;
							font-size				: 10.0px	;	//	This is the font size for all items in the table
							font-weight				: 600;
							padding					: 5px 10px;
							text-align				: center;
							transition				: background-color 0.2s ease-in-out;
							vertical-align			: top					;
						}

					/* Rounds the top-left corner of the first cell of the actual header (omitting the 1st blank cell) */
						.linksTableInner th:nth-child(2) {
							border-top-left-radius	: 8px; /* or 10px */
						}

					/* Rounds the top-right corner of NOTES, regardless of whether FILENAME is hidden or displayed */
						.linksTableInner th:nth-last-child(2) {
							border-top-right-radius	: 8px; /* or 10px */
						}

					/* Rounds the top-right corner of FILENAME when FILENAME is displayed */
						.linksTableInner th:last-child {
							border-top-right-radius	: 8px; /* or 10px */
						}

				/* ==============================
					ALIGNING
				============================== */

					/* Aligns text to the LEFT */
						.text-left {
							text-align		: left		!important	;
						}

					/* Aligns text to the CENTER */
						.text-center {
							text-align		: center	!important	;
						}

					/* Aligns text to the RIGHT */
						.text-right {
							text-align		: right		!important	;
						}

					/* Aligns text to the TOP */
						.text-top {
							vertical-align	: top					;
						}

					/* Aligns text to the MIDDLE */
						.text-middle {
							vertical-align	: middle					;
						}

					/* Aligns text to the BOTTOM */
						.text-bottom {
							vertical-align	: bottom					;
						}

				/* ==============================
					HOVERING
				============================== */

					/* Hover effect (main rows only) */
						.linksTableInner > tbody > tr:not(.noHover):hover {
							background-color: yellow;
							transition: background-color 0.15s ease-in-out;
						}

				/* ==============================
					ICONS
				============================== */

					/* To use in headers, to indicate that the column is sortable */
						.sort-arrows-up-down::before {
							color		: white	;
							content		: " ▼▲"	;
							font-size	: 11px	;
							opacity		: 0.50	;
						}

						.sort-arrows-down::before {
							color		: white	;
							content		: " ▼"	;
							font-size	: 11px	;
							opacity		: 0.50	;
						}

				/* ==============================
					ICONS for JS SORTING
				============================== */

					/* hidden by default */
						.sort-icon {
							display				: none			;
							width				: 20px			;
							height				: 20px			;
							margin-top			: 2px			;
							background-size		: contain		;
							background-repeat	: no-repeat		;
						}

					/* only show when sorted */
						th.sorted .sort-icon {
							display				: inline-block	;
						}

					/* TEXT sort icon */
						th.sort-text.sorted.sort-a-z .sort-icon {
							background-image	: url("https://www.fusionwings.com/common/_icons/icon-sorted-a2z-white-lettering.png");
						}

					/* TEXT sort icon REVERSED */
						th.sort-text.sorted.sort-z-a .sort-icon {
							background-image	: url("https://www.fusionwings.com/common/_icons/icon-sorted-z2a-white-lettering.png");
						}

					/* NUMBER sort icon (example 1969 at top down to 2026) */
						th.sort-number.sorted.sort-0-9 .sort-icon {
							background-image	: url("https://www.fusionwings.com/common/_icons/icon-sorted-0to9-white-lettering.png");
						}

					/* NUMBER sort icon REVERSED (example 2026 at top down to 1969) */
						th.sort-number.sorted.sort-9-0 .sort-icon {
							background-image	: url("https://www.fusionwings.com/common/_icons/icon-sorted-9to0-white-lettering.png");
						}

					/* Highlight the currently sorted column */
						.linksTableInner th.sorted {
							background-color	: #FF00FF	;	/* magenta for current sort */
						}


						.linksTableInner th.sortable {
							cursor: pointer;
						}

				/* ========================================================
					LABEL COLORS
				======================================================== */

					/* RED label: Software */
						.header-label-software {
background: linear-gradient(
    to bottom,
    #ff8080 0%,
    #ff2020 35%,
    #cc0000 70%,
    #880000 100%
);

box-shadow:
    inset 0 1px 2px rgba(255,255,255,0.6),
    inset 0 -1px 2px rgba(0,0,0,0.25);



							border: 3px outset #cc0000;
							border-radius		: 5px		;
							color				: white		;
							display				: inline-flex	;
							font-size			: 20.0px	;
							font-weight			: bold		;
							margin-left			: auto		;
							margin-right		: auto		;
							margin-bottom		: 10px		;
							padding				: 3px 5px	;
						}

				/* ==============================
					KEYBOARD KBD MONOSPACE FONTS
				============================== */

					/* Used for the PROGRAM and PURCHASED columns, because it's used in a <span>, so it applies only to the right-span of that column */
						.kbd-code-right {
							font-family	: "IBM Plex Mono", monospace	;
							font-size	: 11.0px						;
							text-align	: right							;
						}

					/* Used for the PURCHASED column, because only the date is in that column, so it applies to the entire column */
						.linksTableInner .kbd-code-right {
							font-family	: "IBM Plex Mono", monospace	;
							font-size	: 11.0px						;
							text-align	: right							;
						}

					/* Used for the PURCHASED column, to center text like "free" and "unknown" */
						.free-unknown-center {
							font-style	: italic				;
							opacity		: 0.50					;
							text-align	: center	!important	;
						}

					/* Used for the VERSION/REALEASED column, to center the text "subscription" */
						.version-subscription {
							font-style	: italic				;
							opacity		: 0.50					;
							text-align	: center	!important	;
						}

				/* ==============================
					COLUMNS
				============================== */

					/* Formats the column to allow both left-aligned and right-aligned items on a specific-width column */

						.column-filename {
							margin			: 0 auto		;
							overflow-wrap	: break-word	;
							padding-left    : 15px;
							text-align		: left			;
							white-space		: normal		;
							width			: 200px			;
						}

						.column-version-date {
							margin			: 0 auto		;
							text-align		: center		;
							width			: 200px			;
						}

				/* ==============================
					PSEUDO-HEADER ROWS STYLING
				============================== */

					/* Target the pseudo-header row class */
						.pseudo-header-row {
							background-color: grey;   /* same as main header */
							border-bottom: 2px solid #0a2b4c;
							color: white;
							font-weight: bold;
							text-align: center;
							transition: background-color 0.2s ease-in-out;
						}

					/* Style the <th> inside pseudo-header */

					/* Style the <th> inside pseudo-header */
						.pseudo-header-row-software td {
							background-color	: grey;
							color				: white;
							font-weight			: 600;
							padding				: 5px 10px;
							text-align			: center;
							transition			: background-color 0.2s ease-in-out;
							vertical-align		: top;
						}

					/* Pseudo-header SPACER row, to add a space between the section anove & the current section */
						.spacer-row td {
							border				: none			;
							height				: 20px			;	/* or whatever spacing you want */
						}

					/* Pseudo-header DIVIDER row, to add a space between the section anove & the current section */
						.divider-row td {
							background-color	: grey	;	/* overrides any tbody row coloring */
							border				: none		;
						}


					/* Rounds the top-left corner of the first cell of the actual header (omitting the 1st blank cell) */
						.pseudo-header-row-software td:nth-child(2) {
							border-top-left-radius	: 8px; /* or 10px */
						}

					/* Rounds the top-right corner of NOTES, regardless of whether FILENAME is hidden or displayed */
						.pseudo-header-row-software td:nth-last-child(2) {
							border-top-right-radius	: 8px; /* or 10px */
						}

					/* Rounds the top-right corner of FILENAME when FILENAME is displayed */
						.pseudo-header-row-software td:last-child {
							border-top-right-radius	: 8px; /* or 10px */
						}

					/* Remove right border on last cell */
						.pseudo-header-row th:last-child {
							border-right: none;
						}

					/* Optional: keep pseudo-header from zebra-striping and hover */
						.linksTable tbody tr.pseudo-header-row {
							background-color: grey; /* overrides any tbody row coloring */
						}

					/* Prevent hover from changing pseudo-header background */
						.linksTable tbody tr.pseudo-header-row:hover {
							background-color: grey;
						}

					/* Pseudo-header SPACER row, to add a space between the section anove & the current section */
						.spacer-row th {
							background-color	: #E4E1E0	;	/* overrides any tbody row coloring */
							border				: none		;
							height				: 20px		;	/* or whatever spacing you want */
						}

					/* Pseudo-header DIVIDER row, to add a space between the section anove & the current section */
						.divider-row th {
							background-color	: grey	;	/* overrides any tbody row coloring */
							border				: none		;
						}

					/* Pseudo-header SPACER row, to set the background color of the spacer row*/
						.linksTableInner tbody tr.spacer-row {
							background-color: #F5F5F5;
						}

/* Pseudo-header spacer row */
.linksTableInner .spacer-row td {
    background-color : #F5F5F5;
    border           : none;
    height           : 20px;
}



				/* ==============================
					SEARCHBOX
				============================== */

					.searchBoxWrapper {
						display: inline-block;
						background-color: #f0f0f0;
						border: 2px solid #999;
						border-radius: 8px;
						padding: 10px 15px;
						text-align: center;
					}

				/* ==============================
					SLIDER SWITCH
				============================== */

					/* Slider switch */
						.switch {
							position: relative;
							display: inline-block;
							width: 50px;
							height: 26px;
							vertical-align: middle;
						}

						.switch input {
							opacity: 0;
							width: 0;
							height: 0;
						}

						.slider {
							position: absolute;
							cursor: pointer;
							top: 0; left: 0; right: 0; bottom: 0;
							background-color: #ccc;
							transition: 0.4s;
							border-radius: 26px;
						}

						.slider:before {
							position: absolute;
							content: "";
							height: 22px;
							width: 22px;
							left: 2px;
							bottom: 2px;
							background-color: white;
							transition: 0.4s;
  							border-radius: 50%;
						}

						input:checked + .slider {
							background-color: red;	/* red when toggled ON */
						}

						input:checked + .slider:before {
							transform: translateX(24px);
						}

				/* ==============================
					POPUPS
				============================== */

						#software-popup {
							position			: absolute	;
							display				: none		;
							border				: 4px solid	;
							border-color		: #00A3EE	;	/* Microsoft blue */
							border-radius		: 12px		;
							background			: #000		;
							padding				: 2px		;
							z-index				: 9999		;
						}

						#software-popup img {
							background-color	: #F5F5F5	;	/* WhiteSmoke */
							border-radius		: 6px		;
							max-width			: 700px		;	/* most of the other pages with popups use 600px */
							max-height			: 80vh		;	/* never taller than 80% of viewport */
							width				: auto		;
							height				: auto		;
						}

				/* ==============================
					SUBFOOTER
				============================== */

					/* Inner table */
						.subFooter {
							background-color: white !important; /* always white */
							border: none;
							border-collapse: separate;   /* change this */
							margin: 0 auto;    /* center table */
							width: auto;
						    text-align: center;
							border-radius: 10px;
						}

					/* Inner table cells */
						.subFooter td {
							background-color: white !important; /* keep cells white */
							border: none;
							padding			: 10px					;	/* ← THIS creates the gap between border and table: try 4px, 6px, 8px, etc. */
							background: transparent !important;
						}

					/* Included table override */
						.subfooterTimestamp,
						.subfooterTimestamp tr,
						.subfooterTimestamp td {
							background-color: transparent !important; 
							border: none !important;             
							border-collapse: collapse;
							text-align: center;
						}

						.subfooterTimestamp {
							width: auto;      
							margin: 0 auto;  
						}