/* Avroramu theme overrides - keep Bootstrap/forms consistent with theme */
:root {
	--bg-panel: #1e1238;
	--panel-border: rgba(157, 77, 255, 0.4);
	--accent-purple: #6a00ff;
	--text-main: #e6dcff;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
	border-top: none !important;
}

a:focus,
a:hover {
	text-decoration: none !important;
}

.form-control {
	background: rgba(30, 18, 56, 0.9);
	border: 1px solid var(--panel-border);
	color: var(--text-main);
}
.form-control:focus {
	border-color: var(--accent-purple);
	box-shadow: 0 0 12px rgba(106, 0, 255, 0.35);
	outline: none;
}

/* Referral System (usercp/referral) readability + theme alignment */
.referral-system-page .referral-link-input {
	background: rgba(22, 12, 46, 0.96) !important;
	border: 1px solid rgba(157, 77, 255, 0.55) !important;
	color: #f3ecff !important;
	-webkit-text-fill-color: #f3ecff !important;
	font-weight: 600;
}

.referral-system-page .referral-link-input[readonly] {
	opacity: 1 !important;
	cursor: text;
}

.referral-system-page .referral-link-input:focus {
	border-color: rgba(182, 118, 255, 0.95) !important;
	box-shadow: 0 0 0 3px rgba(157, 77, 255, 0.2) !important;
}

.referral-system-page .referral-list-table {
	background: rgba(18, 11, 39, 0.66);
	border: 1px solid rgba(157, 77, 255, 0.3);
	border-radius: 10px;
	overflow: hidden;
}

.referral-system-page .referral-list-table > thead > tr > th,
.referral-system-page .referral-list-table > tbody > tr > td {
	color: #e8dcff !important;
}

.referral-system-page .alert-warning {
	background: rgba(255, 219, 120, 0.12) !important;
	border: 1px solid rgba(255, 194, 89, 0.5) !important;
	color: #ffe2a8 !important;
}

.nopadding {
	padding: 0 !important;
	margin: 0 !important;
}

.vcenter {
	display: inline-block;
	vertical-align: middle;
	float: none;
}

.thumbnail {
	background: var(--bg-panel);
	border: 1px solid var(--panel-border);
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
	border-color: var(--accent-purple);
}

.form-horizontal .control-label {
	text-align: left !important;
}

/* Force theme over Bootstrap panel defaults */
.panel-default > .panel-heading {
	background: rgba(26, 16, 51, 0.92) !important;
	border-color: var(--panel-border) !important;
	color: var(--text-heading) !important;
}

.panel-default > .panel-body {
	background: transparent !important;
	color: var(--text-main) !important;
	border-color: var(--panel-border) !important;
}

.panel-default {
	background: rgba(20, 12, 42, 0.72) !important;
	border-color: var(--panel-border) !important;
	border-radius: 10px !important;
}

/* Home layout: keep Bootstrap/default container flow (no flex forcing) */
.home-page-mode .site-main-shell {
	width: calc(100% - 120px);
	max-width: 1360px;
	margin: 350px auto 100px;
	border: 1px solid rgba(157, 77, 255, 0.45);
	border-radius: 10px;
	background: rgba(22, 14, 44, 0.66);
	box-shadow: 0 0 32px rgba(157, 77, 255, 0.2), 0 8px 32px rgba(15, 10, 31, 0.45);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	overflow: hidden;
}

.home-page-mode #container {
	width: 100%;
	max-width: none;
	margin: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	background: transparent !important;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

.home-page-mode .footer {
	width: 100%;
	max-width: none;
	margin: 0;
	border: 0;
	border-top: 1px solid rgba(157, 77, 255, 0.35);
	border-radius: 0;
	box-shadow: none;
	background: transparent !important;
}

/* Keep footer width aligned with wide rankings container (character/guilds/weekly). */
body.rankings-wide-footer-mode .footer {
	width: calc(100% - 80px) !important;
	max-width: 1520px !important;
}

.home-page-mode .home-top-row,
.home-page-mode .home-three-panels {
	display: block !important;
}

.home-page-mode .home-top-row::before,
.home-page-mode .home-top-row::after,
.home-page-mode .home-three-panels::before,
.home-page-mode .home-three-panels::after {
	content: " ";
	display: table;
}

.home-page-mode .home-top-row::after,
.home-page-mode .home-three-panels::after {
	clear: both;
}

.home-page-mode .home-top-row > [class*="col-"],
.home-page-mode .home-three-panels > [class*="col-"] {
	display: block !important;
	float: left;
}

.home-page-mode .home-top-row .home-top-primary-panel,
.home-page-mode .home-three-panels .panel-sidebar,
.home-page-mode .home-three-panels .panel-sidebar .panel-body {
	min-height: 0 !important;
	height: auto !important;
	flex: initial !important;
}

/* Make the lower castle panel border align with footer/container width */
.home-page-mode .home-castle-widget-wrap {
	margin-left: -20px;
	margin-right: -20px;
}

.home-page-mode .home-castle-widget-wrap > .col-xs-12 {
	padding-left: 0;
	padding-right: 0;
}

/* Home countdown card */
.home-page-mode #content {
	overflow: visible;
	position: relative;
}

.home-countdown-wrap {
	position: absolute;
	top: -146px;
	left: 0;
	right: 0;
	margin: 0;
	z-index: 60;
	pointer-events: none;
}

.home-countdown-card {
	position: relative;
	width: min(560px, calc(100% - 40px));
	margin: 0 auto;
	border-radius: 12px;
	border: 1px solid rgba(157, 77, 255, 0.4);
	background: rgba(24, 15, 46, 0.62);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.34);
	color: var(--text-main);
	text-align: center;
	padding: 10px 14px;
	pointer-events: auto;
}

.home-countdown-card:before {
	display: none;
}

.home-countdown-title {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin: 0 0 8px;
	color: rgba(233, 223, 255, 0.9);
}

.home-countdown-title:after {
	display: none;
}

.home-countdown-metrics {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 0 0 8px;
}

.home-countdown-unit {
	min-width: 68px;
	padding-right: 12px;
	border-right: 1px solid rgba(196, 160, 255, 0.25);
}

.home-countdown-unit:not(:last-child):after {
	display: none;
}

.home-countdown-unit:last-child {
	padding-right: 0;
	border-right: 0;
}

.home-countdown-value {
	font-size: 26px;
	line-height: 1;
	font-weight: 800;
	letter-spacing: 0.02em;
	color: #f5efff;
}

.home-countdown-label {
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.08em;
	color: rgba(225, 206, 255, 0.78);
	margin-top: 2px;
}

.home-countdown-subtext {
	display: block;
	margin-top: 2px;
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(227, 209, 255, 0.72);
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

@media (max-width: 991px) {
	.home-page-mode .site-main-shell {
		width: 100%;
		max-width: 100%;
		margin: 0 0 32px;
		border-left: 0;
		border-right: 0;
		border-radius: 0;
	}

	.home-countdown-wrap {
		top: -134px;
	}

	.home-countdown-card {
		width: min(500px, calc(100% - 24px));
	}

	.home-countdown-title {
		font-size: 10px;
	}

	.home-countdown-value {
		font-size: 22px;
	}

	.home-countdown-label {
		font-size: 9px;
	}

	.home-countdown-subtext {
		font-size: 9px;
	}
}

@media (max-width: 640px) {
	.home-countdown-wrap {
		top: -120px;
	}

	.home-countdown-card {
		width: calc(100% - 12px);
		padding: 9px 10px;
	}

	.home-countdown-title {
		font-size: 9px;
		margin-bottom: 6px;
	}

	.home-countdown-metrics {
		gap: 8px;
		flex-wrap: wrap;
	}

	.home-countdown-unit {
		min-width: 58px;
		padding-right: 8px;
	}

	.home-countdown-value {
		font-size: 20px;
	}

	.home-countdown-label {
		font-size: 8px;
	}

	.home-countdown-subtext {
		font-size: 8px;
	}
}