.gdl-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	/* Filled in by frontend.js from the page's actual computed fonts, so the
	   modal matches the theme instead of carrying its own typography. */
	--gdl-body-font: inherit;
	--gdl-heading-font: inherit;
	--gdl-heading-weight: inherit;
	font-family: var(--gdl-body-font);
}
.gdl-modal-open { overflow: hidden; }

/* Browsers don't inherit font-family into form controls by default, so without
   this the CF7 inputs/buttons would show the OS UI font instead of the theme's. */
.gdl-modal input,
.gdl-modal textarea,
.gdl-modal select,
.gdl-modal button {
	font-family: inherit;
}

.gdl-modal__overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.6);
}

.gdl-modal__box {
	position: relative;
	max-width: 560px;
	width: calc(100% - 40px);
	margin: 8vh auto 0;
	background: #fff;
	border-radius: 6px;
	padding: 32px 28px 28px;
	max-height: 82vh;
	overflow-y: auto;
}

.gdl-modal__close {
	position: absolute;
	top: 10px;
	right: 14px;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	cursor: pointer;
	color: #555;
}

.gdl-modal__title {
	margin: 0 0 16px;
	font-size: 20px;
	font-family: var(--gdl-heading-font);
	font-weight: var(--gdl-heading-weight);
}
.gdl-modal__loading { color: #777; }

.gdl-modal__success-msg { font-size: 16px; margin-bottom: 16px; }
.gdl-modal__download-link { display: none; }

/* Default look for any anchor tagged with the #gdl-{id} convention; overridden
   inline per-site from Settings (see GDL_Frontend::print_button_style). */
a.gdl-trigger {
	background: #2271b1;
	color: #fff;
	padding: 10px 20px;
	border-radius: 4px;
	text-decoration: none;
	display: inline-block;
}
a.gdl-trigger:hover { opacity: 0.9; }