/* ============================================================
   AeroAdmin Account UI - simplified stable stylesheet
   ============================================================ */

:root {
	--aa-bg: #f5f7fb;
	--aa-card: #ffffff;
	--aa-text: #1f2937;
	--aa-muted: #6b7280;
	--aa-border: #d9e0ea;
	--aa-border-soft: #edf1f7;
	--aa-primary: #2563eb;
	--aa-primary-hover: #1d4ed8;
	--aa-primary-soft: #eff6ff;
	--aa-danger: #dc2626;
	--aa-success: #16a34a;
	--aa-shadow: 0 10px 28px rgba(15, 23, 42, 0.07);
	--aa-radius: 14px;
	--aa-shell-width: 980px;
	--aa-gap: 8px;
	--aa-card-pad-x: 18px;
	--aa-card-pad-y: 7px;
}

html,
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
	background: var(--aa-bg);
	color: var(--aa-text);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.35;
}

a {
	color: var(--aa-primary);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

/* ============================================================
   Shell
   ============================================================ */

.aa-shell {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	background: var(--aa-bg);
}

.aa-shell-header {
	background-image: url('../img/header_bg_grad.png');
	background-repeat: repeat-x;
	background-color: #02b8df;
	color: #ffffff;
}

.aa-shell-header-inner,
.aa-shell-content,
.aa-shell-footer-inner {
	box-sizing: border-box;
	width: min(var(--aa-shell-width), calc(100% - 40px));
	max-width: var(--aa-shell-width);
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
}

.aa-shell-header-inner {
	min-height: 92px;
	display: flex;
	align-items: center;
	gap: 18px;
}

.aa-shell-logo {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	line-height: 0;
}

.aa-shell-logo img {
	display: block;
	max-height: 46px;
	width: auto;
	margin: 0;
}

.aa-shell-title-wrap {
	display: flex;
	flex-direction: column;
	justify-content: center;
	flex: 1 1 auto;
	min-width: 0;
}

.aa-shell-title {
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.12;
	text-shadow: 0 1px 2px rgba(0,0,0,0.22);
}

.aa-shell-subtitle {
	margin-top: 5px;
	color: rgba(255,255,255,0.84);
	font-size: 14px;
	line-height: 1.3;
	max-width: 620px;
}

.aa-shell-main {
	flex: 1 0 auto;
	padding: 8px 0 18px 0;
}

.aa-shell-content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0;
}

.aa-shell-footer {
	flex: 0 0 auto;
	background-image: url('../img/header_bg_grad.png');
	background-repeat: repeat-x;
	background-color: #02b8df;
	color: #ffffff;
	min-height: 100px;
	display: flex;
	align-items: flex-end;
}

.aa-shell-footer-inner {
	padding-bottom: 20px;
	color: #ffffff;
	font-size: 14px;
}

.aa-shell-footer-inner a {
	color: #ffffff;
}

/* ============================================================
   Language dropdown
   ============================================================ */

.aa-language-switcher {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: #ffffff;
	white-space: nowrap;
}

.aa-language-switcher label {
	color: rgba(255,255,255,0.9);
	font-weight: 600;
}

.aa-language-switcher select {
	box-sizing: border-box;
	min-height: 31px;
	padding: 5px 28px 5px 10px;
	border: 1px solid rgba(255,255,255,0.55);
	border-radius: 9px;
	background: rgba(255,255,255,0.96);
	color: #1f2937;
	font-size: 14px;
	outline: none;
	cursor: pointer;
}

/* ============================================================
   Common cards
   ============================================================ */

.aa-customizer-form,
.aa-sessionlogs-form,
.aa-account-form,
.aa-auth-form {
	font-family: Arial, Helvetica, sans-serif;
	color: var(--aa-text);
	font-size: 15px;
	line-height: 1.35;
}

.aa-customizer-card,
.aa-account-card,
.aa-sessionlogs-card,
.aa-auth-card,
.aa-addedcomp-table {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--aa-shell-width);
	border: 1px solid var(--aa-border);
	border-radius: var(--aa-radius);
	background: var(--aa-card);
	box-shadow: var(--aa-shadow);
	margin: 0;
	padding: var(--aa-card-pad-y) var(--aa-card-pad-x);
	color: var(--aa-text);
	font-size: 15px;
	border-spacing: 0 2px;
	border-collapse: separate;
}

.aa-customizer-card td,
.aa-account-card td,
.aa-sessionlogs-card td,
.aa-auth-card td {
	vertical-align: middle;
	padding: 2px 6px;
}

.aa-customizer-card h3,
.aa-account-card h3,
.aa-sessionlogs-card h3,
.aa-auth-card h3 {
	margin: 0 0 6px 0;
	padding: 4px 10px;
	border: 1px solid var(--aa-border-soft);
	border-left: 5px solid var(--aa-primary);
	border-radius: 10px;
	background: linear-gradient(90deg, var(--aa-primary-soft), #ffffff);
	color: #0f172a;
	font-size: 17px;
	line-height: 1.18;
}

.aa-customizer-card input[type="text"],
.aa-customizer-card input[type="password"],
.aa-customizer-card select,
.aa-account-card input[type="text"],
.aa-account-card input[type="password"],
.aa-account-card select,
.aa-sessionlogs-card input[type="text"],
.aa-sessionlogs-card input[type="password"],
.aa-sessionlogs-card select,
.aa-auth-card input[type="text"],
.aa-auth-card input[type="password"],
.aa-auth-card select {
	box-sizing: border-box;
	min-height: 30px;
	padding: 5px 9px;
	border: 1px solid var(--aa-border);
	border-radius: 8px;
	background: #ffffff;
	color: var(--aa-text);
	outline: none;
	font-size: 15px;
	vertical-align: middle;
}

.aa-customizer-card input[type="text"]:focus,
.aa-customizer-card input[type="password"]:focus,
.aa-customizer-card select:focus,
.aa-account-card input[type="text"]:focus,
.aa-account-card input[type="password"]:focus,
.aa-account-card select:focus,
.aa-sessionlogs-card input[type="text"]:focus,
.aa-sessionlogs-card input[type="password"]:focus,
.aa-sessionlogs-card select:focus,
.aa-auth-card input[type="text"]:focus,
.aa-auth-card input[type="password"]:focus,
.aa-auth-card select:focus {
	border-color: var(--aa-primary);
	box-shadow: 0 0 0 3px rgba(37,99,235,0.12);
}

.aa-customizer-card input[type="checkbox"],
.aa-customizer-card input[type="radio"],
.aa-account-card input[type="checkbox"],
.aa-account-card input[type="radio"],
.aa-sessionlogs-card input[type="checkbox"],
.aa-sessionlogs-card input[type="radio"],
.aa-auth-card input[type="checkbox"],
.aa-auth-card input[type="radio"] {
	width: 16px;
	height: 16px;
	margin: 0 7px 0 0;
	vertical-align: middle;
	accent-color: var(--aa-primary);
}

.aa-customizer-card input[type="submit"],
.aa-account-card input[type="submit"],
.aa-sessionlogs-card input[type="submit"],
.aa-auth-card input[type="submit"],
.aa-button-primary {
	min-width: 120px;
	height: 38px;
	border: none;
	border-radius: 11px;
	background: var(--aa-primary);
	color: #ffffff !important;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 8px 18px rgba(37,99,235,0.22);
}

.aa-customizer-card input[type="submit"]:hover,
.aa-account-card input[type="submit"]:hover,
.aa-sessionlogs-card input[type="submit"]:hover,
.aa-auth-card input[type="submit"]:hover,
.aa-button-primary:hover {
	background: var(--aa-primary-hover);
	text-decoration: none;
}

/* ============================================================
   Login / restore
   ============================================================ */

.aa-auth-page {
	width: 100%;
	min-height: 390px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	margin: 0 auto;
	padding: 0;
}

.aa-auth-card {
	width: 430px;
	max-width: 100%;
	margin: 0 auto;
	padding-top: 10px;
	padding-bottom: 12px;
}

.aa-auth-card td {
	padding-top: 3px;
	padding-bottom: 3px;
}

.aa-auth-card h3 {
	margin-bottom: 8px;
}

.aa-auth-help {
	margin-top: 10px;
	text-align: center;
	color: var(--aa-muted);
	font-size: 14px;
}

.aa-auth-help-link {
	color: var(--aa-primary);
	font-weight: 600;
	text-decoration: none;
	background: transparent;
	border: 0;
	box-shadow: none;
	padding: 0;
	cursor: pointer;
}

/* If "Can't login" is still rendered as input button, make it look like a text link */
.aa-auth-card input[type="submit"].aa-auth-help-link,
.aa-auth-card input[type="button"].aa-auth-help-link,
.aa-auth-card input[name="cant_login"],
.aa-auth-card input[name="restore_license"],
.aa-auth-card input[value*="login"],
.aa-auth-card input[value*="Login"] {
	min-width: 0 !important;
	width: auto !important;
	height: auto !important;
	padding: 0 !important;
	margin: 8px auto 0 auto !important;
	display: inline !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--aa-primary) !important;
	box-shadow: none !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

.aa-auth-message {
	box-sizing: border-box;
	width: 430px;
	max-width: 100%;
	margin: 10px auto 0 auto;
	padding: 9px 13px;
	border-radius: 11px;
	text-align: center;
	font-size: 14px;
	line-height: 1.35;
}

.aa-auth-message-success {
	border: 1px solid rgba(22,163,74,0.25);
	background: #f0fdf4;
	color: #166534;
}

.aa-auth-message-error {
	border: 1px solid rgba(220,38,38,0.25);
	background: #fef2f2;
	color: #991b1b;
}

/* ============================================================
   Account layout
   ============================================================ */

.aa-account-layout,
.aa-shell-content .aa-account-layout,
.aa-shell-content .aa-customizer-form,
.aa-shell-content .aa-sessionlogs-form {
	width: 100%;
	max-width: var(--aa-shell-width);
	margin: 0;
	padding: 0;
}

.aa-account-layout {
	border-spacing: 8px 0;
	border-collapse: separate;
}

.aa-account-layout > tbody > tr > td,
.aa-account-layout > tr > td {
	padding-top: 0;
	padding-bottom: 0;
	vertical-align: top;
}

.aa-account-layout > tbody > tr > td:nth-child(2),
.aa-account-layout > tr > td:nth-child(2) {
	display: flex;
	flex-direction: column;
	gap: var(--aa-gap);
	align-items: stretch;
}

/* ============================================================
   Added computers
   ============================================================ */

.aa-addedcomp-table {
	border-spacing: 0;
	border-collapse: separate;
	padding-top: 6px;
	padding-bottom: 6px;
}

.aa-addedcomp-table td {
	padding: 3px 8px;
	border-bottom: 1px solid var(--aa-border-soft);
	vertical-align: middle;
	line-height: 1.2;
}

.aa-addedcomp-table tr:first-child td {
	padding-top: 4px;
	padding-bottom: 4px;
	background: #f8fafc;
	font-weight: 700;
	color: #0f172a;
	border-bottom: 1px solid var(--aa-border);
}

.aa-addedcomp-table tr:last-child td {
	border-bottom: 0;
}

.aa-addedcomp-table td[colspan='5'] {
	padding-top: 0;
	padding-bottom: 0;
	border-bottom: 0;
}

.aa-addedcomp-table td[colspan='5'] > div[style*='border-bottom'] {
	display: none !important;
	height: 0 !important;
	line-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.aa-addedcomp-table tr.aa-addedcomp-summary td {
	padding-top: 5px;
	padding-bottom: 0;
	border-bottom: 0;
	color: var(--aa-muted);
	font-weight: 600;
}

/* ============================================================
   Session logs
   ============================================================ */

.aa-sessionlogs-card {
	max-width: var(--aa-shell-width);
}

.aa-sessionlogs-fields {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0 2px;
}

.aa-sessionlogs-fields td {
	padding: 2px 6px !important;
}

.aa-sessionlogs-format {
	padding-top: 4px !important;
	padding-bottom: 5px !important;
	border-bottom: 1px solid var(--aa-border-soft);
}

.aa-sessionlogs-format label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 5px 18px 0 0;
	cursor: pointer;
	color: var(--aa-text);
	font-weight: 600;
}

.aa-sessionlogs-help {
	display: block;
	margin-top: 5px;
	font-size: 13px;
	color: var(--aa-muted);
}

.aa-sessionlogs-card input#CLIENTID,
.aa-sessionlogs-card input#BEGINTIME,
.aa-sessionlogs-card input#ENDTIME {
	width: 170px;
}

/* ============================================================
   Customizer wrapper from index.php
   ============================================================ */

.aa-customizer-section,
.aa-customizer-section > form,
.aa-customizer-form,
.aa-sessionlogs-form {
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
	max-width: var(--aa-shell-width);
}

.aa-customizer-section > form > table,
.aa-customizer-form > table,
.aa-sessionlogs-form > table {
	margin: 0 !important;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 760px) {
	:root {
		--aa-card-pad-x: 14px;
		--aa-card-pad-y: 7px;
	}

	.aa-shell-header-inner,
	.aa-shell-content,
	.aa-shell-footer-inner {
		width: calc(100% - 20px);
	}

	.aa-shell-header-inner {
		min-height: auto;
		padding-top: 16px;
		padding-bottom: 16px;
		flex-wrap: wrap;
	}

	.aa-language-switcher {
		width: 100%;
		margin-left: 0;
	}

	.aa-account-layout,
	.aa-account-layout > tbody,
	.aa-account-layout > tbody > tr,
	.aa-account-layout > tbody > tr > td {
		display: block;
		width: 100%;
	}

	.aa-account-layout > tbody > tr > td:nth-child(2) {
		display: flex;
		margin-top: var(--aa-gap);
	}

	.aa-auth-card,
	.aa-auth-message {
		width: 100%;
	}
}

/* ============================================================
   Slightly larger top padding before main headers and buttons
   ============================================================ */

/* A little more air above main card headers */
.aa-customizer-card,
.aa-account-card,
.aa-sessionlogs-card,
.aa-auth-card,
.aa-addedcomp-table {
	padding-top: 10px !important;
}

/* Header itself remains compact, but not squeezed */
.aa-customizer-card h3,
.aa-account-card h3,
.aa-sessionlogs-card h3,
.aa-auth-card h3 {
	margin-top: 1px !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

/* Main action buttons get a little more top space */
.aa-account-card input[type="submit"],
.aa-sessionlogs-card input[type="submit"],
.aa-auth-card input[type="submit"],
.aa-customizer-card input[type="submit"],
.aa-button-primary {
	margin-top: 6px !important;
}

/* But "Can't login" must remain a text link, not a button */
.aa-auth-card input[type="submit"].aa-auth-help-link,
.aa-auth-card input[type="button"].aa-auth-help-link,
.aa-auth-card input[name="cant_login"],
.aa-auth-card input[name="restore_license"],
.aa-auth-card input[value*="login"],
.aa-auth-card input[value*="Login"] {
	margin-top: 8px !important;
	padding: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	height: auto !important;
	min-width: 0 !important;
	color: var(--aa-primary) !important;
}

/* ============================================================
   Final padding, centered login and auth link fix
   ============================================================ */

/* More visible top padding in account cards */
:root {
	--aa-card-pad-y: 13px;
}

.aa-account-card,
.aa-sessionlogs-card,
.aa-auth-card,
.aa-addedcomp-table {
	padding-top: 15px !important;
	padding-bottom: 12px !important;
}

/* Branding card is styled in customizer_incl.html, but keep this for safety */
.aa-customizer-card {
	padding-top: 15px !important;
	padding-bottom: 12px !important;
}

/* Main card headers: more air above and inside */
.aa-account-card h3,
.aa-sessionlogs-card h3,
.aa-auth-card h3,
.aa-customizer-card h3 {
	margin-top: 3px !important;
	margin-bottom: 8px !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

/* More air before main submit buttons */
.aa-account-card input[type="submit"],
.aa-sessionlogs-card input[type="submit"],
.aa-auth-card input[type="submit"],
.aa-customizer-card input[type="submit"],
.aa-button-primary {
	margin-top: 10px !important;
}

/* Login/restore page: center the login table vertically in the visible area */
.aa-auth-page {
	width: 100% !important;
	min-height: calc(100vh - 230px) !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: center !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

.aa-auth-card {
	width: 430px !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-top: 16px !important;
	padding-bottom: 16px !important;
}

/* Keep Can't login as text link, not as a button */
.aa-auth-help {
	margin-top: 12px !important;
	text-align: center !important;
}

.aa-auth-help-link,
.aa-auth-card .aa-auth-help-link {
	color: var(--aa-primary) !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	cursor: pointer !important;
}

/* If old PHP renders Can't login as input/button, visually convert it to text */
.aa-auth-card input[type="submit"].aa-auth-help-link,
.aa-auth-card input[type="button"].aa-auth-help-link,
.aa-auth-card input[name="cant_login"],
.aa-auth-card input[name="restore_license"],
.aa-auth-card input[value*="Can"],
.aa-auth-card input[value*="login"],
.aa-auth-card input[value*="Login"],
.aa-auth-card input[value*="Restore"] {
	display: inline !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	margin: 10px auto 0 auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--aa-primary) !important;
	box-shadow: none !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* Mobile */
@media (max-width: 760px) {
	.aa-auth-page {
		min-height: calc(100vh - 190px) !important;
	}

	.aa-auth-card {
		width: 100% !important;
	}
}

/* ============================================================
   Final login centering and activation/branding gap alignment
   ============================================================ */

:root {
	--aa-gap: 8px;
	--aa-card-pad-y: 15px;
	--aa-card-pad-x: 18px;
}

/* Main area must be able to center login vertically */
.aa-shell {
	min-height: 100vh !important;
}

.aa-shell-main {
	flex: 1 0 auto !important;
	display: flex !important;
	padding-top: 8px !important;
	padding-bottom: 18px !important;
}

.aa-shell-content {
	flex: 1 1 auto !important;
}

/* Login page: center horizontally and vertically */
.aa-shell-content:has(.aa-auth-page) {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: calc(100vh - 210px) !important;
	width: min(var(--aa-shell-width), calc(100% - 40px)) !important;
	max-width: var(--aa-shell-width) !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding: 0 !important;
}

.aa-auth-page {
	width: 100% !important;
	min-height: calc(100vh - 210px) !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

.aa-auth-card {
	width: 430px !important;
	max-width: 100% !important;
	margin: 0 auto !important;
	padding-top: 18px !important;
	padding-bottom: 18px !important;
}

.aa-auth-message {
	width: 430px !important;
	max-width: 100% !important;
	margin: 10px auto 0 auto !important;
}

/* Fallback if :has is not supported */
@supports not selector(:has(*)) {
	.aa-auth-page {
		min-height: calc(100vh - 210px) !important;
	}
}

/* Account page columns: both columns use the same vertical rhythm */
.aa-account-layout {
	border-spacing: 8px 0 !important;
	border-collapse: separate !important;
}

.aa-account-layout > tbody > tr > td,
.aa-account-layout > tr > td {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	vertical-align: top !important;
}

/* Left column: License -> Activate -> Add computer */
.aa-account-layout > tbody > tr > td:first-child,
.aa-account-layout > tr > td:first-child {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	gap: var(--aa-gap) !important;
	row-gap: var(--aa-gap) !important;
}

/* Right column: Added computers -> Branding -> Sessions */
.aa-account-layout > tbody > tr > td:nth-child(2),
.aa-account-layout > tr > td:nth-child(2) {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	gap: var(--aa-gap) !important;
	row-gap: var(--aa-gap) !important;
}

/* Remove random margins from column children.
   The only external vertical spacing is now gap: 8px. */
.aa-account-layout > tbody > tr > td:first-child > *,
.aa-account-layout > tr > td:first-child > *,
.aa-account-layout > tbody > tr > td:nth-child(2) > *,
.aa-account-layout > tr > td:nth-child(2) > * {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/* Hide scripts from flex layout if any script tags are direct children */
.aa-account-layout > tbody > tr > td > script,
.aa-account-layout > tr > td > script {
	display: none !important;
}

/* Same top padding for Activate card and Branding card */
.aa-account-card,
.aa-sessionlogs-card,
.aa-auth-card,
.aa-addedcomp-table,
.aa-customizer-card {
	padding-top: var(--aa-card-pad-y) !important;
	padding-bottom: 12px !important;
	padding-left: var(--aa-card-pad-x) !important;
	padding-right: var(--aa-card-pad-x) !important;
}

/* Same visual header padding everywhere */
.aa-account-card h3,
.aa-sessionlogs-card h3,
.aa-auth-card h3,
.aa-customizer-card h3 {
	margin-top: 3px !important;
	margin-bottom: 8px !important;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
}

/* Activate card can be a form/table wrapper: remove wrapper margins */
.aa-account-layout form,
.aa-account-layout table {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

/* Keep Can't login as text link */
.aa-auth-help-link,
.aa-auth-card .aa-auth-help-link,
.aa-auth-card input[type="submit"].aa-auth-help-link,
.aa-auth-card input[type="button"].aa-auth-help-link,
.aa-auth-card input[name="cant_login"],
.aa-auth-card input[name="restore_license"],
.aa-auth-card input[value*="Can"],
.aa-auth-card input[value*="login"],
.aa-auth-card input[value*="Login"],
.aa-auth-card input[value*="Restore"] {
	display: inline !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	margin: 10px auto 0 auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--aa-primary) !important;
	box-shadow: none !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* Mobile */
@media (max-width: 760px) {
	.aa-shell-content:has(.aa-auth-page),
	.aa-auth-page {
		min-height: calc(100vh - 190px) !important;
	}

	.aa-auth-card,
	.aa-auth-message {
		width: 100% !important;
	}

	.aa-account-layout,
	.aa-account-layout > tbody,
	.aa-account-layout > tbody > tr,
	.aa-account-layout > tbody > tr > td {
		display: block !important;
		width: 100% !important;
	}

	.aa-account-layout > tbody > tr > td:first-child,
	.aa-account-layout > tbody > tr > td:nth-child(2) {
		display: flex !important;
		flex-direction: column !important;
		gap: var(--aa-gap) !important;
	}

	.aa-account-layout > tbody > tr > td:nth-child(2) {
		margin-top: var(--aa-gap) !important;
	}
}

/* ============================================================
   Session Logs stable final layout
   ============================================================ */

:root {
	--aa-sessionlogs-left-pad: 20px;
	--aa-sessionlogs-download-width: 260px;
}

/* Header stays unchanged. Only content below gets inner left padding. */
.aa-sessionlogs-card .aa-sessionlogs-fields,
.aa-sessionlogs-card .aa-sessionlogs-format,
.aa-sessionlogs-card .aa-sessionlogs-help {
	margin-left: var(--aa-sessionlogs-left-pad) !important;
}

/* Stable edit fields */
.aa-sessionlogs-card input#CLIENTID,
.aa-sessionlogs-card input#BEGINTIME,
.aa-sessionlogs-card input#ENDTIME {
	width: 200px !important;
	max-width: 200px !important;
}

/* Real Download logs button */
#fSessLogs input.aa-sessionlogs-download-btn,
.aa-sessionlogs-card input.aa-sessionlogs-download-btn,
#fSessLogs input[type="submit"] {
	box-sizing: border-box !important;
	display: inline-block !important;
	width: var(--aa-sessionlogs-download-width) !important;
	min-width: var(--aa-sessionlogs-download-width) !important;
	max-width: var(--aa-sessionlogs-download-width) !important;
	height: 38px !important;
	margin-left: 0px !important;
	margin-top: 10px !important;
	padding-left: 0px !important;
	padding-right: 14px !important;
	border-radius: 11px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-align: center !important;
	white-space: nowrap !important;
}

/* Do not center/right-align the button cell */
.aa-sessionlogs-card td[colspan] {
	text-align: left !important;
}

@media (max-width: 760px) {
	:root {
		--aa-sessionlogs-left-pad: 0px;
	}

	.aa-sessionlogs-card .aa-sessionlogs-fields,
	.aa-sessionlogs-card .aa-sessionlogs-format,
	.aa-sessionlogs-card .aa-sessionlogs-help {
		margin-left: 0 !important;
	}

	#fSessLogs input.aa-sessionlogs-download-btn,
	.aa-sessionlogs-card input.aa-sessionlogs-download-btn,
	#fSessLogs input[type="submit"] {
		margin-left: 0 !important;
	}
}

/* ============================================================
   Restore success message centered CSS-only
   ============================================================ */

/*
   CSS-only fix for current index.php restore message:
   <div style='color:green; padding:10px;'>License data has been sent to ...</div>
*/

/* Login page container: form and restore message must be vertical and centered */
.aa-shell-content:has(.aa-auth-page) {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Keep login form centered */
.aa-shell-content:has(.aa-auth-page) > .aa-auth-page {
	width: 100% !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Restore success message printed after showLoginTable() */
.aa-shell-content:has(.aa-auth-page) > div[style*="color:green"],
.aa-shell-content:has(.aa-auth-page) > div[style*="color: green"],
.aa-shell-content:has(.aa-auth-page) div[style*="color:green"][style*="padding"],
.aa-shell-content:has(.aa-auth-page) div[style*="color: green"][style*="padding"] {
	box-sizing: border-box !important;
	display: block !important;
	width: 430px !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	align-self: center !important;
	line-height: 1.35 !important;
	font-size: 14px !important;
	color: green !important;
	float: none !important;
	clear: both !important;
}

/* Fallback: if message is not a direct child */
body div[style*="color:green"][style*="padding:10px"],
body div[style*="color: green"][style*="padding: 10px"],
body div[style*="color:green"][style*="padding"],
body div[style*="color: green"][style*="padding"] {
	box-sizing: border-box !important;
	width: 430px !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
	text-align: center !important;
	float: none !important;
	clear: both !important;
}

/* Mobile */
@media (max-width: 760px) {
	.aa-shell-content:has(.aa-auth-page) > div[style*="color:green"],
	.aa-shell-content:has(.aa-auth-page) > div[style*="color: green"],
	.aa-shell-content:has(.aa-auth-page) div[style*="color:green"][style*="padding"],
	.aa-shell-content:has(.aa-auth-page) div[style*="color: green"][style*="padding"],
	body div[style*="color:green"][style*="padding:10px"],
	body div[style*="color: green"][style*="padding: 10px"],
	body div[style*="color:green"][style*="padding"],
	body div[style*="color: green"][style*="padding"] {
		width: 100% !important;
	}
}

/* ============================================================
   Stable auth restore and language buttons
   ============================================================ */

:root {
	--aa-auth-card-width: 430px;
	--aa-auth-primary-width: 120px;
	--aa-auth-primary-height: 38px;
}

/* Login page stays centered vertically and horizontally */
.aa-auth-page {
	box-sizing: border-box !important;
	width: 100% !important;
	min-height: calc(100vh - 210px) !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

.aa-auth-card {
	box-sizing: border-box !important;
	width: var(--aa-auth-card-width) !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Auth table should not shift on translated labels */
.aa-auth-card table {
	width: 100% !important;
	border-collapse: separate !important;
	border-spacing: 0 7px !important;
}

.aa-auth-card td {
	vertical-align: middle !important;
}

.aa-auth-card td:first-child {
	white-space: nowrap !important;
	padding-right: 10px !important;
}

/* Login button: always a normal primary button, independent of translated value text */
.aa-login-form input[name="Login"],
.aa-login-form input[name="Login"].aa-primary-button {
	box-sizing: border-box !important;
	display: inline-block !important;
	width: var(--aa-auth-primary-width) !important;
	min-width: var(--aa-auth-primary-width) !important;
	max-width: var(--aa-auth-primary-width) !important;
	height: var(--aa-auth-primary-height) !important;
	margin: 8px 0 0 0 !important;
	padding: 0 14px !important;
	border-radius: 11px !important;
	border: 1px solid var(--aa-primary, #2563eb) !important;
	background: var(--aa-primary, #2563eb) !important;
	color: #fff !important;
	box-shadow: none !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-align: center !important;
	text-decoration: none !important;
	cursor: pointer !important;
	white-space: nowrap !important;
}

/* Restore form button remains a normal button too */
.aa-restore-form input[name="Restore"],
.aa-restore-form input[name="Restore"].aa-primary-button {
	box-sizing: border-box !important;
	display: inline-block !important;
	min-width: var(--aa-auth-primary-width) !important;
	height: var(--aa-auth-primary-height) !important;
	padding: 0 14px !important;
	border-radius: 11px !important;
	border: 1px solid var(--aa-primary, #2563eb) !important;
	background: var(--aa-primary, #2563eb) !important;
	color: #fff !important;
	box-shadow: none !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-align: center !important;
	cursor: pointer !important;
	white-space: nowrap !important;
}

/* Can't login: always a text link by name/class, not by English value text */
.aa-login-form input[name="Restore"].aa-link-button,
.aa-login-form input.aa-link-button[name="Restore"] {
	box-sizing: border-box !important;
	display: block !important;
	width: max-content !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: auto !important;
	margin: 11px auto 0 auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--aa-primary, #2563eb) !important;
	box-shadow: none !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	text-align: center !important;
	text-decoration: none !important;
	cursor: pointer !important;
	white-space: normal !important;
	appearance: none !important;
	-webkit-appearance: none !important;
}

/* Neutralize older value-based rules only for the real Login button */
.aa-auth-card input[name="Login"][type="submit"] {
	display: inline-block !important;
	background: var(--aa-primary, #2563eb) !important;
	color: #fff !important;
	border: 1px solid var(--aa-primary, #2563eb) !important;
	border-radius: 11px !important;
	padding: 0 14px !important;
	box-shadow: none !important;
	text-decoration: none !important;
}

/* Restore success message is now inside .aa-auth-page */
.aa-auth-restore-message {
	box-sizing: border-box !important;
	display: block !important;
	width: var(--aa-auth-card-width) !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	align-self: center !important;
	line-height: 1.35 !important;
	font-size: 14px !important;
	float: none !important;
	clear: both !important;
}

.aa-auth-restore-message-success {
	color: green !important;
}

@media (max-width: 760px) {
	.aa-auth-page {
		min-height: calc(100vh - 190px) !important;
	}

	.aa-auth-card,
	.aa-auth-restore-message {
		width: 100% !important;
	}

	.aa-auth-card table,
	.aa-auth-card tbody,
	.aa-auth-card tr,
	.aa-auth-card td {
		display: block !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}

	.aa-auth-card td:first-child {
		padding-right: 0 !important;
	}

	.aa-auth-card input[type="text"],
	.aa-auth-card input[type="password"] {
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* ============================================================
   Login edits right edge aligned with buttons
   ============================================================ */

/*
   Keep previous stable login layout.
   Do not move the Login button.
   Only make email/password edits fill the edit column,
   so their right edge matches the right edge of the Login button.
*/

.aa-login-form table {
	width: 100% !important;
}

.aa-login-form td:first-child {
	white-space: nowrap !important;
	padding-right: 10px !important;
}

.aa-login-form td:nth-child(2) {
	width: 100% !important;
}

.aa-login-form td:nth-child(2) input[type="text"],
.aa-login-form td:nth-child(2) input[type="password"],
.aa-login-form input[name="auth_email"],
.aa-login-form input[name="auth_pw"],
.aa-login-form input[name="auth_password"] {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
}

/* Keep Can't login as text link on every language */
.aa-login-form input[name="Restore"].aa-link-button,
.aa-login-form input.aa-link-button[name="Restore"] {
	display: block !important;
	width: max-content !important;
	max-width: 100% !important;
	min-width: 0 !important;
	height: auto !important;
	margin: 11px auto 0 auto !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--aa-primary, #2563eb) !important;
	box-shadow: none !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	text-align: center !important;
	text-decoration: none !important;
	cursor: pointer !important;
	white-space: normal !important;
	appearance: none !important;
	-webkit-appearance: none !important;
}

/* ============================================================
   Restore email edit right edge aligned with button
   ============================================================ */

/*
   Keep previous stable restore layout.
   Do not move the Restore button.
   Only make the email edit fill the edit column,
   so its right edge matches the right edge of the Restore button.
*/

.aa-restore-form table {
	width: 100% !important;
}

.aa-restore-form td:first-child {
	white-space: nowrap !important;
	padding-right: 10px !important;
}

.aa-restore-form td:nth-child(2) {
	width: 100% !important;
}

.aa-restore-form td:nth-child(2) input[type="text"],
.aa-restore-form input[name="auth_email"] {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
}

/* ============================================================
   Centered auth login error message
   ============================================================ */

.aa-auth-login-message {
	box-sizing: border-box !important;
	display: block !important;
	width: var(--aa-auth-card-width, 430px) !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	align-self: center !important;
	line-height: 1.35 !important;
	font-size: 14px !important;
	float: none !important;
	clear: both !important;
}

.aa-auth-login-message-error {
	color: #b91c1c !important;
}

/* Fallback for old inline red errors if any remain */
.aa-auth-page div[style*="color:red"],
.aa-auth-page div[style*="color: red"],
body div[style*="color:red"][style*="padding"],
body div[style*="color: red"][style*="padding"] {
	box-sizing: border-box !important;
	display: block !important;
	width: var(--aa-auth-card-width, 430px) !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	align-self: center !important;
	float: none !important;
	clear: both !important;
}

@media (max-width: 760px) {
	.aa-auth-login-message,
	.aa-auth-page div[style*="color:red"],
	.aa-auth-page div[style*="color: red"],
	body div[style*="color:red"][style*="padding"],
	body div[style*="color: red"][style*="padding"] {
		width: 100% !important;
	}
}

/* ============================================================
   Centered auth login error message stable
   ============================================================ */

.aa-auth-login-message {
	box-sizing: border-box !important;
	display: block !important;
	width: var(--aa-auth-card-width, 430px) !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	align-self: center !important;
	line-height: 1.35 !important;
	font-size: 14px !important;
	float: none !important;
	clear: both !important;
}

.aa-auth-login-message-error {
	color: #b91c1c !important;
}

/* Fallback for old inline red message if some branch remains unpatched */
body div[style*="color:red"][style*="padding"],
body div[style*="color: red"][style*="padding"] {
	box-sizing: border-box !important;
	display: block !important;
	width: var(--aa-auth-card-width, 430px) !important;
	max-width: 100% !important;
	margin: 12px auto 0 auto !important;
	padding: 10px 14px !important;
	text-align: center !important;
	float: none !important;
	clear: both !important;
}

@media (max-width: 760px) {
	.aa-auth-login-message,
	body div[style*="color:red"][style*="padding"],
	body div[style*="color: red"][style*="padding"] {
		width: 100% !important;
	}
}