/* ============================================================
   TrivalRO Clean UI Guardrail
   Removes decorative hairline borders and repetitive pale top bars.
   Keep functional form-control borders and meaningful 3-4px game bevels.
   ============================================================ */

/* Full-width sections should blend into the page, not be boxed by hairlines. */
.trival-features-section,
.feature-page-section,
.trival-store-section,
.vendor-section,
.server-center-section,
.ms-section,
.pvp-section,
.battlearena-section,
.info-summary-section {
	border-top: 0 !important;
	border-bottom: 0 !important;
}

/* Raised game surfaces: remove decorative 1px outlines, preserve their thicker bottom bevels. */
.feature-card,
.feature-support-card,
.feature-visual-card,
.quest-small-card,
.quest-type-card,
.pvp-feature-hero,
.pvp-mode-card,
.donation-home-panel,
.donation-home-card,
.store-stat-card,
.store-panel,
.store-item-card,
.store-cart-item,
.store-checkout-card,
.vendor-toolbar,
.vendor-card,
.vendor-shop-card,
.vendor-item-card,
.server-overview-panel,
.server-status-panel,
.server-class-panel,
.server-info-card,
.server-class-row,
.server-world-card,
.server-node,
.server-world-stat,
.ms-section .ro-window,
.ms-section .ms-stat-card,
.ms-section .map-card,
.ms-section .map-stat,
.ms-section .map-monsters,
.cms-fallback-page {
	border-top-width: 0 !important;
	border-left-width: 0 !important;
	border-right-width: 0 !important;
}

/* Remove decorative internal hairline separators from the components we added. */
.server-panel-head,
.server-world-head,
.ms-section .ro-window-titlebar,
.ms-section .map-card-head,
.ms-section .map-image-wrap,
.ms-section .map-stats,
.vendor-card-head,
.vendor-shop-head,
.store-panel-head {
	border-bottom: 0 !important;
}

/* Large panel title bars should not all use the same pale-blue strip. */
.server-panel-head,
.ms-section .ro-window-titlebar,
.vendor-panel-head,
.store-panel-head {
	background: transparent !important;
	box-shadow: none !important;
}

/* Keep hierarchy through spacing and type rather than a fake window chrome strip. */
.server-panel-head,
.ms-section .ro-window-titlebar {
	padding-top: 15px !important;
	padding-bottom: 8px !important;
}

/* Remove tiny decorative top rules inside stat cards. */
.server-info-card::before,
.store-stat-card::before,
.feature-card::before {
	display: none !important;
}

/* Softer surface depth: no dark outline illusion. */
.feature-card,
.feature-support-card,
.feature-visual-card,
.quest-small-card,
.quest-type-card,
.pvp-feature-hero,
.pvp-mode-card,
.donation-home-panel,
.donation-home-card,
.server-overview-panel,
.server-status-panel,
.server-class-panel,
.server-world-card,
.store-panel,
.vendor-card,
.vendor-shop-card,
.ms-section .ro-window,
.ms-section .map-card {
	box-shadow: 0 12px 28px rgba(48, 104, 145, .10) !important;
}

/* Functional controls intentionally keep their stronger borders for usability. */
input,
select,
textarea,
.trival-custom-select,
.ranking-custom-select {
	/* no global override here */
}

/* ============================================================
   Shared 1200px content rail
   Keep the major public game pages aligned with the same desktop
   content width used by the top header and navigation.
   ============================================================ */
body.content-sync-page #main-wrapper {
	width: 100% !important;
	max-width: 1360px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	padding-left: 20px !important;
	padding-right: 20px !important;
}

body.content-sync-page #content-col {
	width: 100%;
	min-width: 0;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.content-sync-page #content-box,
body.content-sync-page #content-box .content-inner {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
}

body.content-sync-page #content-box .content-inner {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.server-center-inner,
.vendor-inner,
.online-players-inner,
.feature-page-inner,
.trival-features-inner,
.trival-store-inner,
.shop-manager-inner {
	width: min(1320px, calc(100% - 40px)) !important;
	max-width: 1320px !important;
}

.ms-inner {
	width: 100% !important;
	max-width: 1320px !important;
	padding-left: 20px !important;
	padding-right: 20px !important;
}

.pvp-section .pvp-inner,
.ranking-page-section .ranking-inner,
.legacy-ranking-section .ranking-inner {
	width: 100% !important;
	max-width: 1320px !important;
}

.ranking-legacy-table {
	width: min(1320px, calc(100% - 40px)) !important;
}

/* Ranking table headings are always white, with a restrained shadow so the
   labels remain readable over the light ranking artwork. */
.pvp-row.pvp-head,
.ranking-legacy-table th,
.ranking-legacy-table th a {
	color: #fff !important;
	text-shadow: 0 2px 3px rgba(27, 69, 100, .72) !important;
}

/* Donation and purchase screens use the same rail even when their templates
   do not have a dedicated full-width section wrapper. */
body.content-sync-page .donation-home-panel,
body.content-sync-page .store-panel,
body.content-sync-page .store-checkout-card,
body.content-sync-page .store-cart,
body.content-sync-page .purchase-container {
	width: 100%;
	max-width: 1320px;
	margin-left: auto;
	margin-right: auto;
}

/* Server Information must match the VISUAL width of the desktop header.
   The header rail is 1200px and #top-navbar is scaled to 1.10, giving a
   1320px visual rail. Keep the server cards on that exact same rail instead
   of expanding them to the viewport edges. */
body.server-info-page .server-center-inner {
	width: min(1130px, calc(100% - 40px)) !important;
	max-width: 1130px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	left: 25px !important;
}

body.server-info-page .server-overview-panel,
body.server-info-page .server-class-panel {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

@media (max-width: 1200px) {
	body.server-info-page .server-center-inner {
		width: calc(100% - 24px) !important;
		left: 0 !important;
	}
}

@media (max-width: 700px) {
	body.content-sync-page #main-wrapper {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}

	.server-center-inner,
	.vendor-inner,
	.online-players-inner,
	.feature-page-inner,
	.trival-features-inner,
	.trival-store-inner,
	.shop-manager-inner {
		width: calc(100% - 20px) !important;
	}

	.ms-inner {
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
}
