.fooevents-license-management-group {
	border: 1px solid #e1e1e1;
	border-radius:10px;
	margin-bottom:1.5rem;
}

.fooevents-license-management-group-header h3 {
	margin: 0;
	font-size:1.2em
}

.fooevents-license-management-group-header {
	padding: 1.5rem;
	border-bottom: 1px solid #eee;
}

.fooevents-license-management-slot {
	align-items: flex-end;
	border-top: 1px solid #eee;
	display: flex;
	gap: 1.5rem;
	justify-content: space-between;
	padding: 1.5rem;
}


.fooevents-license-management-slot:first-child {
	border-top: 0;
}

.fooevents-license-management-slot-details {
	flex: 1;
	min-width: 0;
}

.fooevents-license-management-slot p {
	margin: 0
}

.fooevents-license-management-subscription-row {
	align-items: baseline;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	padding-bottom: 1em;
}

.fooevents-license-management-subscription-action {
	margin: 0 0 0 auto;
}

.fooevents-license-management-connection {
	align-items: center;
	background: #f9f9f9;
	border: solid 1px #eee;
	border-radius: 3px;
	display: inline-flex;
	font-size: 0.9em;
	gap: 0.4rem;
	padding: .45rem 1.5rem;
}

.fooevents-license-management-slot-details > p.fooevents-license-management-connection {
	padding: .8rem 1.5rem;
}

.entry-content p.fooevents-license-management-license-key,
.fooevents-license-management-license-key {
	align-items: center;
	border: 1px solid #eee;
	border-radius: 5px;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin: 0;
	width: 100%;
	padding: 0;
}

.entry-content .fooevents-license-management-sites p.fooevents-license-management-license-key,
.fooevents-license-management-sites .fooevents-license-management-license-key {
	width: fit-content;
	max-width:100%;
}

.fooevents-license-management-license-key .fooevents-license-management-connection {
	background: transparent;
	border: 0;
	padding: 0 1rem 0 .5em;
}

.fooevents-license-management-license-key-pill {
	align-items: center;
	background: #f9f9f9;
	border-right: solid 1px #eee;
	border-radius: 3px;
	display: inline-flex;
	gap: 0.4rem;
	padding: .7rem 1.5rem;
}

.fooevents-license-management-license-key-pill code {
	background: transparent;
	color: #333;
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
	font-size: 0.82rem;
	overflow-wrap: anywhere;
	padding: 0;
}

.fooevents-license-management-site-license-key .fooevents-license-management-license-key-pill {
	padding: .5rem 1rem;
}

.fooevents-license-management-copy-key {
	align-items: center;
	color: #555;
	cursor: pointer;
	display: inline-flex;
	height: 1.25rem;
	justify-content: center;
	width: 1.25rem;
}

.fooevents-license-management-copy-key svg {
	fill: none;
	height: 1rem;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
	width: 1rem;
}

.fooevents-license-management-copy-key:hover,
.fooevents-license-management-copy-key:focus {
	color: #111;
}

.fooevents-license-management-copy-key.is-copied {
	color: #000;
}

.fooevents-license-management-validity {
	color: #777;
	font-size: 0.9em;
}

.fooevents-license-management-slot-action button.button {
	background: #111;
	border: 1px solid #111;
	border-radius: 5px;
	color: #fff;
	min-width: 135px;
	padding: 0.7rem 1rem;
	white-space: nowrap;
}

.fooevents-license-management-license-disconnect-link {
	align-items: center;
	display: inline-flex;
	gap: 0.4rem;
	white-space: nowrap;
}

.fooevents-license-management-license-disconnect-link svg {
	fill: none;
	height: 1.15rem;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
	width: 1.15rem;
}

.fooevents-license-management-slot-action button.button:hover,
.fooevents-license-management-slot-action button.button:focus,
.fooevents-license-management-new-site button.button:hover,
.fooevents-license-management-new-site button.button:focus {
	background: #333;
	border-color: #333;
	color: #fff;
}

.fooevents-license-management-past {
	padding-top: 2rem;
}

.fooevents-license-management-past .fooevents-license-management-groups {
}

.fooevents-license-management-site {
	padding: 1.5rem 1.5rem 0; 
	border: 1px solid #e1e1e1;
	border-radius:10px;
	margin-bottom:1.5rem;
}

.fooevents-license-management-site-header {
	align-items: center;
	display: flex;
	gap: 0.5rem;
}

.fooevents-license-management-site-header h3 {
	margin: 0;
	overflow-wrap: anywhere;
	font-size:1.4em
}

.fooevents-license-management-site-remove {
	flex: 0 0 auto;
	margin: 0;
}

.fooevents-license-management-site-remove-link {
	align-items: center;
	color: #bbb;
	display: inline-flex;
	height: 1.25rem;
	justify-content: center;
	position: relative;
	left: 0;
	top: 5px;
	text-decoration: none;
	width: 1.25rem;
}

.fooevents-license-management-site-remove-link:hover,
.fooevents-license-management-site-remove-link:focus {
	color: #c00;
}

.fooevents-license-management-site-remove-link svg {
	fill: none;
	height: 1rem;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
	width: 1rem;
}

.fooevents-license-management-product-disconnect-link {
	flex: 0 0 auto;
}

.entry-content p.fooevents-license-management-site-license-key,
.fooevents-license-management-site-license-key {
	margin: 1rem 0;
}

.fooevents-license-management-site-license-key .fooevents-license-management-license-key-pill {
	border-right: 0;
}

.fooevents-license-management-site-products {
	border-top: 1px solid #eee;
	margin: 1rem 0;
}

.fooevents-license-management-site-product {
	align-items: center;
	border-bottom: 1px solid #eee;
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	margin: 0;
	padding: 0.75rem 0;
}

.fooevents-license-management-site-product:last-child {
	border-bottom: 0;
}

.fooevents-license-management-site-product-details {
	min-width: 0;
}


.fooevents-license-management-site-product-details a {
	font-weight: bold;
}

.fooevents-license-management-site-product-validity {
	color: #777;
	display: block;
	font-size: 0.9em;
	margin-top: 0.2rem;
}

.fooevents-license-management-modal[hidden] {
	display: none;
}

.fooevents-license-management-modal {
	align-items: center;
	display: flex;
	inset: 0;
	justify-content: center;
	padding: 1rem;
	position: fixed;
	z-index: 99999;
}

.fooevents-license-management-modal-overlay {
	background: rgba( 0, 0, 0, 0.55 );
	inset: 0;
	position: absolute;
}

.fooevents-license-management-modal-dialog {
	background: #fff;
	border-radius: 8px;
	box-shadow: 0 20px 60px rgba( 0, 0, 0, 0.25 );
	max-height: calc( 100vh - 2rem );
	max-width: 560px;
	overflow-y: auto;
	padding: 2rem;
	position: relative;
	width: 100%;
	z-index: 1;
}

.fooevents-license-management-modal-busy-overlay {
	align-items: center;
	background: rgba( 255, 255, 255, 0.94 );
	border-radius: 8px;
	display: none;
	inset: 0;
	justify-content: center;
	position: absolute;
	z-index: 3;
}

.fooevents-license-management-modal.is-busy .fooevents-license-management-modal-busy-overlay {
	display: flex;
}

.fooevents-license-management-spinner {
	animation: fooevents-license-management-spin 0.75s linear infinite;
	border: 3px solid #ddd;
	border-radius: 50%;
	border-top-color: #111;
	display: block;
	height: 2rem;
	width: 2rem;
}

@keyframes fooevents-license-management-spin {
	to {
		transform: rotate( 360deg );
	}
}

.fooevents-license-management-modal-dialog h2 {
	margin: 0 2rem 0.25rem 0;
}

.fooevents-license-management-modal-dialog h3 {
	font-size: 1rem;
	margin: 1.5rem 0 0.75rem;
}

.fooevents-license-management-modal-product {
	color: #666;
	margin: 0;
}

.fooevents-license-management-modal-close {
	color: #000;
	cursor: pointer;
	display: block;
	font-size: 1.75rem;
	line-height: 1;
	position: absolute;
	right: 1rem;
	text-decoration: none;
	top: 1rem;
}

.fooevents-license-management-modal-close:hover,
.fooevents-license-management-modal-close:focus {
	color: #000;
	text-decoration: none;
}

.fooevents-license-management-existing-sites form {
	margin: 0;
}

.fooevents-license-management-site-option {
	align-items: center;
	background: #fff;
	border: 1px solid #eee;
	border-bottom: 0;
	color: #111;
	cursor: pointer;
	display: flex;
	font: inherit;
	gap: 1rem;
	justify-content: space-between;
	padding: 1rem;
	text-align: left;
	text-decoration: none;
	width: 100%;
}

.fooevents-license-management-existing-sites form:first-of-type .fooevents-license-management-site-option {
	border-radius: 5px 5px 0 0;
}

.fooevents-license-management-existing-sites form:last-of-type .fooevents-license-management-site-option {
	border-bottom: 1px solid #eee;
	border-radius: 0 0 5px 5px;
}

.fooevents-license-management-site-option:hover,
.fooevents-license-management-site-option:focus {
	background: #f5f5f5;
	color: #111;
	text-decoration: none;
}

.fooevents-license-management-new-site {
	border-top: 1px solid #eee;
	margin-top: 1.5rem;
	padding-top: 0.25rem;
}

.fooevents-license-management-new-site label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.4rem;
}

.fooevents-license-management-new-site-fields {
	align-items: stretch;
	display: flex;
	gap: 0.6rem;
}

.fooevents-license-management-new-site input[type='text'] {
	border: 1px solid #ccc;
	border-radius: 5px;
	box-sizing: border-box;
	max-width: 360px;
	min-height: 46px;
	padding: 0.7rem 0.8rem;
	width: 100%;
}

.fooevents-license-management-new-site button.button {
	background: #111;
	border: 1px solid #111;
	border-radius: 5px;
	color: #fff;
	min-height: 46px;
	padding: 0.7rem 1rem;
	white-space: nowrap;
}

.fooevents-license-management-modal-open {
	overflow: hidden;
}

@media screen and (max-width: 600px) {
	.fooevents-license-management-slot {
		align-items: flex-start;
		flex-direction: column;
		gap: 0.75rem;
	}

	.fooevents-license-management-slot-details {
		width: 100%;
	}

	.fooevents-license-management-license-key {
		box-sizing: border-box;
		gap: 0;
		width: 100%;
	}

	.fooevents-license-management-license-key-pill {
		border-bottom: 1px solid #eee;
		border-radius: 3px 3px 0 0;
		border-right: 0;
		box-sizing: border-box;
		padding: 1rem 1.5rem;
		width: 100%;
	}


	.fooevents-license-management-license-key .fooevents-license-management-connection {
		box-sizing: border-box;
		padding: 1rem 1.5rem;
		width: 100%;
	}

	.fooevents-license-management-site-header {
		align-items: flex-start;
	}

	.fooevents-license-management-new-site-fields {
		align-items: stretch;
		flex-direction: column;
	}

	.fooevents-license-management-new-site input[type='text'] {
		max-width: none;
	}
}