/*********************************************
	 ** Stylesheet file for default Flux theme. **
	 *********************************************/

.loginbox-admin-menu {
	padding-top: 5px;
	color: #94b4d5;
}

body {
	margin: 0 0 20px 0;
	padding: 0;
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	font-size: 9pt;
	color: #000;
	background-color: #fff;
}

table {
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	font-size: 9pt;
}

tr, td, th {
	vertical-align: top;
}

.horizontal-table tr, .vertical-table tr, .generic-form-table tr,
.horizontal-table td, .vertical-table td, .generic-form-table td {
	vertical-align: middle;
}

.horizontal-table th, .vertical-table th, .generic-form-table th {
	vertical-align: top;
}

h2 {
	color: #444;
	letter-spacing: -1px;
}

h3 {
	/*font-style: italic;*/
	font-weight: normal;
	font-size: 120%;
	color: #444;
	border-bottom: 1px dotted #ddd;
	text-transform: uppercase;
}

h3:first-letter {
	font-weight: bold;
}

p {
	margin: 4px 0 8px 0;
	padding: 0;
}

a img {
	border: 0;
}

a {
	color: #4083c6;
	text-decoration: none;
}

input[type=text], input[type=password], input[type=file], textarea {
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	padding: 4px;
	font-size: 10pt;
	color: #444;
	border: 1px solid #ddd;
	outline-width: 0;
}

label:hover {
	cursor: pointer;
}

/*input[type=text]:hover, input[type=password]:hover, textarea:hover {
	color: #46a;
	background-color: #dee;
	border: 1px solid #8ac;
}*/

.module-name {
	font-weight: bold;
	font-size: 12pt;
}

.message {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #333;
}

.notice {
	display: block;
	padding: 10px;
	font-weight: normal;
	font-size: 120%;
	color: #204a87;
	background-color: #F0FFFF;
	border: 1px solid #87CEEB;
}

.center {
	text-align: center;
}

#admin_sidebar, #sidebar {
	margin-bottom: 10px;
	border-collapse: collapse;
	border-spacing: 0;
}

#admin_sidebar img, #sidebar img {
	display: block;
}

#admin_sidebar td, #sidebar td {
	padding: 0;
}

#admin_sidebar td.menuitem, #admin_sidebar th.menuitem {
	display: block;
	font-size: 10pt;
	border-width: 0 13px 0 11px;
	border-style: solid;
	border-color: #8b8b8b;
}

#admin_sidebar th.menuitem {
	background-color: #303030;
}

#admin_sidebar th.menuitem strong {
	display: block;
	margin: 0 12px;
	padding: 10px 0 2px 0;
	font-size: 100%;
	text-align: center;
	color: #fff;
	border-bottom: 1px solid #555;
}

#admin_sidebar td.menuitem a {
	margin: 0 auto;
	display: block;
	padding: 2px 5px 4px 18px;
	color: #fff;
	background-color: #303030;
	text-align: left;
	text-shadow: #000 1pt 1pt;
	text-decoration: none;
}

#admin_sidebar td.menuitem a:hover {
	color: #fff;
	background-color: #4a5259;
	text-shadow: #4a5259 1pt 1pt;
}

#admin_sidebar td.menuitem a span {
	/*display: block;*/
}

#sidebar td.sidebar-left, #sidebar td.sidebar-right {
	background-color: #e6f0fa;
}

#sidebar td.menuitem, #sidebar th.menuitem {
	display: block;
	font-size: 10pt;
	border-width: 0 13px 0 11px;
	border-style: solid;
	border-color: #c4d9ee;
}


#sidebar th.menuitem {
	background-color: #94b4d5;
}

#sidebar th.menuitem strong {
	display: block;
	margin: 0 12px;
	padding: 10px 0 2px 0;
	font-size: 100%;
	text-align: center;
	color: #fff;
	border-bottom: 1px solid #c4d9ee;
}

#sidebar td.menuitem a {
	margin: 0 auto;
	display: block;
	padding: 2px 5px 4px 18px;
	color: #fff;
	background-color: #94b4d5;
	text-align: left;
	text-shadow: #708fae 1pt 1pt;
	text-decoration: none;
}

#sidebar td.menuitem a:hover {
	color: #fff;
	background-color: #708fae;
	text-shadow: #708fae 1pt 1pt;
}

#sidebar td.menuitem a span {
	display: block;
}

.request, .fs-path {
	display: inline-block;
	padding: 2px;
	font-family: Monaco, "Lucida Console", "Bitsteam Vera Sans Mono", monospace;
	font-size: 8pt;
	background-color: #fff;
	border: 1px solid #eee;
}

.keyword {
	color: #ffba00;
	font-style: italic;
}

.red {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #f00;
}

.green {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #0c0;
}

.note {
	padding: 5px;
	color: #444;
	background-color: #eaeaea;
	font-style: italic;
}

.up {
	font-weight: bold;
	color: #0f0;
	text-transform: uppercase;
}

.down {
	color: #f00;
	text-transform: uppercase;
}

.submit_button {
	display: block;
	margin: 10px;
	padding: 5px;
	background-color: #eee;
	border: 1px solid #ccc;
}

.submit_button:hover {
	color: #fff;
	background-color: #333;
	border: 1px solid #111;
	cursor: pointer;
}

.install_table th, .install_table td {
	padding: 5px 10px;
	border: 1px solid #ddd;
}

.install_table th {
	background-color: #eef;
}

.install_table td {
	width: 180px;
	text-align: center;
}

.created {
	color: green;
	width: 80px;
}

.missing {
	color: red;
	width: 80px;
}

.pages {
	margin-top: 20px;
	padding-top: 10px;
	color: #ccc;
	text-align: center;
	border-top: 1px solid #ddd;
}

.pages .page-prev, .pages .page-next {
	color: #94b4d5;
}

.pages .page-num {
	padding: 0 5px;
}

.pages .current-page {
	color: #000000;
	font-weight: bold;
}

.horizontal-table {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

.horizontal-table th {
	padding: 5px 10px;
	background-color: #eee;
}

.horizontal-table td {
	padding: 5px 10px;
	background-color: #fff;
}

.horizontal-table th, .horizontal-table td {
	font-size: 9pt;
	border: 1px solid #ddd;
}

.vertical-table {
	border-spacing: 0;
	border-collapse: collapse;	
}

.vertical-table th {
	padding: 5px 10px;
	background-color: #eee;
}

.vertical-table td {
	padding: 5px 12px;
	background-color: #fff;
}

.vertical-table th, .vertical-table td {
	font-size: 9pt;
	border: 1px solid #ddd;
}

.vertical-table label {
	display: block;
	padding: 5px;
}

.current-sub-menu {
	font-weight: bold;
}

.td-checkbox {
	text-align: center;
}

.td-action {
	color: #ccc;
	text-align: center;
}

.vertical-table .td-action {
	text-align: right;
}

.vertical-table form {
	margin: 0;
	padding: 0;
}

.not-applicable {
	font-style: italic;
	color: #bbb;
}

.state-pending {
	color: orange;
}

.state-banned {
	color: red;
}

.state-permanently-banned {
	font-weight: bold;
	color: red;
}

.raw-txn-log {
	padding: 10px;
	font-family: "Monaco", "Lucida Console", "Courier New", monospace;
	background-color: #fff;
	border: 1px solid #ddd;
	width: 96%;
	overflow: scroll;
}

.online {
	color: #000;
}

.offline {
	color: #aaa;
}

.info-text-total {
	font-weight: bold;
}

.info-text-results {
	font-weight: bold;
}

.info-text {
	margin-bottom: 6px;
	padding: 5px;
	color: #666;
	background-color: #fff;
	border: 1px solid #ccc;
	text-align: center;
}

.toggler {
	font-weight: bold;
	font-style: italic;
}

.toggler a {
	color: #26a;
}

.search-form, search-form2 {
	display: none;
	margin: 0 0 10px 0;
	padding: 0;
	border-top: 1px solid #ddd;
}

.search-form p, .search-form2 p {
	margin: 0;
	padding: 5px;
	color: #aaa;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

.search-form label, .search-form2 label {
	display: inline-block;
	margin: 0 0 3px 0;
	font-size: 8pt;
	font-style: italic;
	color: #222;
}

.search-form input[type=text], .search-form2 input[type=text] {
	display: inline-block;
	margin: 0 0 2px 0;
	padding: 2px;
	font-size: 8pt;
	width: 80px;
}

.search-form input[type=submit], .search-form2 input[type=submit] {
	display: inline-block;
	margin: 0 0 2px 0;
	font-size: 8pt;
	font-weight: bold;
}

.search-form input[type=button], .search-form input[type=reset],
.search-form2 input[type=button], .search-form2 input[type=reset] {
	display: inline-block;
	margin: 0 0 2px 0;
	font-size: 8pt;
}

.search-form input[type=checkbox], .search-form2 input[type=checkbox] {
	display: inline-block;
	margin: 0 0 2px 0;
}

.search-form select, .search-form2 select {
	display: inline-block;
	margin: 2px 0;
}

#submenu {
	color: #bbb;
}

#pagemenu {
	margin-top: 5px;
	padding: 5px 0;
	font-size: 8pt;
	color: #888;
	border-width: 1px 0;
	border-style: dotted;
	border-color: #ddd;
}

#pagemenu a {
	color: #777974;
	text-decoration: underline;
}

#pagemenu a:hover {
	color: #729fcf;
}

#loginbox {
	margin-bottom: 10px;
	color: #555;
}

#content {
	color: #555;
}

#register_form table td, #login_form table td {
	padding: 1px;
}

#register_form table th label, #login_form table th label {
	display: block;
	padding: 5px;
	text-align: center;
}

#register_form input[type=text], #register_form input[type=password], #login_form input[type=text], #login_form input[type=password] {
	width: 140px;
}

#register_form select, #login_form select {
	width: 147px;
}

#server_status th, #server_status td {
	padding: 8px 12px 8px 12px;
	text-align: left;
	border-bottom: 1px solid #ddd;	
}

#server_status {
	border-spacing: 0;
	border-collapse: collapse;
	background-color: #fff;
	border: 1px solid #ddd;
}

#server_status .server {
	color: #222;
}

#server_status .status {
	text-align: center;
}

#copyright p {
	margin-top: 5px;
	margin-bottom: 0px;
	font-style: italic;
	font-size: 8pt;
	color: #ccc;
	text-align: right;
}

#info p {
	margin-top: 5px;
	margin-bottom: 0px;
	font-style: italic;
	font-size: 8pt;
	color: #aaa;
	text-align: right;
}

.sortable {
	color: #444;
	text-decoration: underline;
}

.sortable:hover {
	color: #000;
}

.character-stats {
	border-spacing: 0;
	border-collapse: collapse;
	color: #ccc;
}

.character-stats td {
	padding: 0px 10px 5px 0;
	border: 0;
	text-align: center;
}

.character-stats .stat-name {
	color: #666;
}

.character-stats .stat-value {
	color: #000;
}

.credit-balance {
	float: right;
	display: inline-block;
	padding: 10px;
	color: #000;
	background-color: #eee;
	border: 1px dotted #ddd;
}

.credit-balance .balance-text {
	display: inline-block;
	margin-right: 5px;
	color: #bbb;
	text-transform: uppercase;
}

.credit-balance .balance-amount {
	font-weight: bold;
}

.emblem-server {
	margin: 0 0 2px 0;
	padding: 0 0 2px 0;
	font-size: 120%;
	border-bottom: 1px solid #ddd;
}

.emblem-server label {
	display: block;
}

.emblem-server label:hover {
	cursor: pointer;
}

.block {
	display: block;
	width: 80%;
	height: 40px;
}

.script-line {
	font-family: Monaco, "Lucida Console", monospace;
}

.script-line-num {
	display: inline-block;
	margin: 0;
	padding: 5px;
	background-color: #eee;
	border-right: 1px solid #ddd;
}

.script-line-code {
	display: inline-block;
	margin: 0;
	padding: 5px;
}

.shop-table {
	width: 100%;
	color: #000;
	border-spacing: 0 10px;
	border-collapse: separate;
}

.shop-table td {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
}

.shop-item-image {
	width: 75px;
	height: 100px;
	text-align: center;
}

.shop-item-name {
	margin: 0 0 5px 0;
	padding: 0 0 2px 0;
	font-size: 140%;
	color: #222;
	border-bottom: 1px solid #eee;
}

.shop-item-cost-qty {
	width: 150px;
	color: #aaa;
	text-align: center;
}

.cost {
	color: #000;
	font-size: 120%;
	font-weight: bold;
	text-transform: uppercase;
}

.qty {
	color: #000;
}

.shop-item-action {
	color: #ddd;
}

.shop-item-action a {
	color: #80a2c8;
	border-bottom: 1px solid #eee;
}

.shop-item-action a:hover {
	border-bottom: 1px solid #80a2c8;
}

.short {
	width: 40px;
}

.shop-server-name {
	color: #333;
}

.shop-item-info {
	text-align: justify;
}

textarea {
	width: 320px;
	height: 120px;
}

.cart-items-text {
	margin: 0 0 5px 0;
	padding: 5px;
	color: #ddd;
	background-color: #888;
	border: 5px solid #777;
}

.cart-info-text {
	margin: 0 0 5px 0;
	padding: 0;
}

.cart-total-text {
	margin: 0;
	padding: 0;
}

.cart-item-name {
	color: #fff;
	border-bottom: 1px dotted #aaa;
}

.cart-item-count {
	font-size: 120%;
	font-weight: bold;
	color: #000;
}

.cart-sub-total {
	color: #000;
}

.cart {
	width: 100%;
}

.cart label {
	display: block;
}

.cart h4 {
	margin: 10px 0 2px 0;
	font-size: 140%;
}

.remove-from-cart {
	width: 100%;
	text-align: right;
}

.checkout-text {
	font-size: 120%;
	font-weight: bold;
}

.checkout-text a {
	border-bottom: 1px dotted #ccc;
}

.checkout-text a:hover {
	color: #000;
	border-bottom: 1px solid #aaa;
}

.enter-donation-amount {
	margin: 0;
	padding: 0 0 5px 0;
	font-size: 120%;
}

.donation-amount-text {
	margin: 0;
	padding: 0;
	font-size: 120%;
	text-align: center;
}

.credit-amount-text {
	font-size: 8pt;
	text-transform: uppercase;
	color: #bbb;
	text-align: center;
	letter-spacing: 1px;
}

.donation-amount {
	font-weight: bold;
	color: #000;
}

.credit-amount {
	color: #555;
}

.reset-amount-text {
	margin: 0;
	padding: 0;
	font-size: 8pt;
	text-align: center;
}

.checkout-info-text {
	margin: 0 0 5px 0;
	padding: 0;
}

.remaining-balance {
	color: #000;
}

.exchange-rate {
	font-size: 120%;
	font-weight: bold;
	color: #000;
}

.important {
	font-size: 120%;
	color: #000;
}

.important .server-name {
	font-weight: bold;
}

.generic-form {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
	width: auto;
}

.generic-form-div {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
	width: auto;
}
.generic-form-table th label {
	display: block;
	padding: 6px;
}

.generic-form-table td div {
	display: block;
	padding: 6px 0;
}

.generic-form-table th {
	text-align: right;
}

.generic-form-table td input[type=checkbox] {
	display: inline-block;
	margin-top: 6px;
}

.generic-form-table td p {
	margin: 6px 5px;
	color: #000;
}

.security-code {
	margin: 5px 0;
	text-align: left;
	width: 145px;
	height: 50px;
}

.action {
	color: #ddd;
}

.action a, .action span.anchor {
	color: #80a2c8;
	border-bottom: 1px solid #eee;
	cursor: pointer;
}

.block-link {
	display: block;
	padding: 3px;
	color: #80a2c8;
	border-bottom: 1px solid #eee;
}

.button-action {
	padding: 5px 0;
	text-align: left;
}

.woe-table {
	border-spacing: 0;
	border-collapse: collapse;
	background-color: #fff;
	border: 1px solid #ddd;
}

.woe-table th, .woe-table td {
	padding: 5px 10px;
}

.woe-table th {
	font-weight: normal;
	border-bottom: 1px solid #ddd;
}

.woe-table td {
	font-size: 120%;
}

.woe-table .server {
	font-weight: bold;
}

.woe-table .time {
	font-style: italic;
	color: #333;
}

.script {
	width: 98%;
}

.multi-select {
	width: 100%;
}

.jump-to-page {
	margin-top: 8px;
	font-size: 8pt;
	text-align: center;
}

.jump-to-page input {
	padding: 2px;
	font-size: 8pt;
}

.top-ranked td {
	font-weight: bold;
	color: #000;
	background-color: #FFF8DC;
}

.top-ranked a {
	color: #000;
	border-bottom: 1px dotted #666;
}

.empty-row {
	display: none;
}

.item-drop-mvp td {
	color: #000;
	background-color: #F8F8FF;
}

.item-drop-card td {
	color: #000;
	background-color: #F0FFFF;
}

.mvp {
	font-size: xx-small;
	font-weight: bold;
	color: #ff0000;
	vertical-align: top;
}

.monster-mode {
	margin: 0;
	padding: 0;
	list-style: square inside;
}

.monster-mode li {
	padding: 1px;
	border-bottom: 1px dotted #eee;
}

.equipped td {
	background-color: #f1ffff;
}

.job-classes {
	border-spacing: 0;
}

.job-classes td {
	padding-right: 10px;
	border-right: 1px solid #eee;
}

.current-shop-category {
	font-weight: bold;
}

.normalslotted .equipped {
	color: #25292b;
}

.overslotted1 {
	color: #32cd32;
}

.overslotted2 {
	color: #00bfff;
}

.overslotted3 {
	color: #ffa500;
}

.overslotted4 {
	color: #9932cc;
}

.hold-hours {
	color: #ffba00;
	font-style: italic;
}

/* ==========================================================================
   Modern dark refresh for the default FluxCP theme
   Keeps the original markup and module behavior intact while updating visuals.
   ========================================================================== */
:root {
	--bg: #0f172a;
	--bg-soft: #111827;
	--panel: #162033;
	--panel-2: #1f2a44;
	--panel-3: #263552;
	--text: #e5e7eb;
	--muted: #9ca3af;
	--muted-2: #64748b;
	--border: #334155;
	--border-soft: rgba(148, 163, 184, .22);
	--accent: #38bdf8;
	--accent-2: #818cf8;
	--success: #22c55e;
	--warning: #f59e0b;
	--danger: #ef4444;
	--shadow: 0 18px 45px rgba(0, 0, 0, .35);
	--radius: 14px;
}

html { background: var(--bg); }

body {
	margin: 0 0 24px 0;
	color: var(--text);
	background:
		radial-gradient(circle at top left, rgba(56, 189, 248, .16), transparent 34rem),
		radial-gradient(circle at top right, rgba(129, 140, 248, .12), transparent 30rem),
		linear-gradient(180deg, #0b1120 0%, var(--bg) 52%, #0b1020 100%);
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	font-size: 10pt;
}

body > table { max-width: 1280px; margin: 0 auto; }
body > table > tbody > tr:first-child td[bgcolor] { background: linear-gradient(135deg, #111827, #1e293b 55%, #0f172a) !important; }
body > table > tbody > tr:first-child td { box-shadow: 0 1px 0 rgba(148, 163, 184, .2); }
#logo { display: block; max-width: 100%; height: auto; padding: 18px 0; filter: drop-shadow(0 10px 22px rgba(0,0,0,.35)); }

table { color: inherit; font-family: inherit; }
h2 { color: #f8fafc; letter-spacing: -.03em; }
h3 { color: #cbd5e1; border-bottom: 1px solid var(--border); letter-spacing: .04em; }
p { line-height: 1.55; }
a { color: var(--accent); transition: color .15s ease, border-color .15s ease, background-color .15s ease, opacity .15s ease; }
a:hover { color: #7dd3fc; }

input[type=text], input[type=password], input[type=file], input[type=email], textarea, select {
	box-sizing: border-box;
	font-family: inherit;
	color: var(--text);
	background: #0b1220;
	border: 1px solid var(--border);
	border-radius: 9px;
	outline: 0;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}
input[type=text], input[type=password], input[type=file], input[type=email], textarea { padding: 7px 9px; }
select { padding: 5px 8px; }
input:focus, textarea:focus, select:focus {
	border-color: var(--accent);
	background: #0f1b2d;
	box-shadow: 0 0 0 3px rgba(56, 189, 248, .16);
}

.message, .red, .green, .notice, .note, .info-text, .generic-form, .generic-form-div, .raw-txn-log,
.credit-balance, .cart-items-text, .woe-table, #server_status, .shop-table td {
	border-radius: var(--radius);
	box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}
.message { color: #e0f2fe; background: linear-gradient(135deg, #075985, #1e3a8a); border: 1px solid rgba(125, 211, 252, .28); }
.notice { color: #dbeafe; background: rgba(30, 64, 175, .28); border: 1px solid rgba(96, 165, 250, .35); }
.red { background: linear-gradient(135deg, #991b1b, #7f1d1d); }
.green { background: linear-gradient(135deg, #166534, #14532d); }
.note { color: #cbd5e1; background: rgba(30, 41, 59, .85); border: 1px solid var(--border-soft); }

/* Sidebar */
#admin_sidebar, #sidebar { width: 198px; filter: drop-shadow(0 16px 28px rgba(0, 0, 0, .25)); }
#admin_sidebar td.sidebar-left, #admin_sidebar td.sidebar-right,
#sidebar td.sidebar-left, #sidebar td.sidebar-right { background: var(--panel) !important; }
#admin_sidebar td.menuitem, #admin_sidebar th.menuitem,
#sidebar td.menuitem, #sidebar th.menuitem {
	border-color: var(--panel) !important;
	background: var(--panel) !important;
}
#admin_sidebar th.menuitem, #sidebar th.menuitem { background: linear-gradient(135deg, #1e293b, #263552) !important; }
#admin_sidebar th.menuitem strong, #sidebar th.menuitem strong {
	color: #f8fafc;
	border-bottom: 1px solid var(--border);
	letter-spacing: .04em;
}
#admin_sidebar td.menuitem a, #sidebar td.menuitem a {
	margin: 1px 8px;
	padding: 7px 10px 8px 16px;
	color: #dbeafe;
	background: transparent;
	border-radius: 10px;
	text-shadow: none;
}
#admin_sidebar td.menuitem a:hover, #sidebar td.menuitem a:hover {
	color: #fff;
	background: linear-gradient(135deg, rgba(56,189,248,.18), rgba(129,140,248,.18));
	text-shadow: none;
}

/* Main content shell */
#content {
	color: var(--text);
	background: rgba(15, 23, 42, .78);
	border: 1px solid var(--border-soft);
	border-radius: 18px;
	box-shadow: var(--shadow);
	overflow: hidden;
	backdrop-filter: blur(10px);
}
#content td[bgcolor] { background: var(--panel) !important; }
#content tr:first-child img, #content tr:last-child img { opacity: 0; }
#loginbox { color: var(--muted); }
#submenu { color: var(--muted-2); }
#pagemenu { color: var(--muted); border-color: var(--border); }
#pagemenu a { color: #cbd5e1; }
#pagemenu a:hover { color: var(--accent); }

/* Tables and forms */
.horizontal-table, .vertical-table, .install_table, .woe-table, #server_status { border-collapse: separate; border-spacing: 0; overflow: hidden; }
	.horizontal-table th, .vertical-table th, .generic-form-table th, .install_table th, .woe-table th {
		color: #f8fafc;
		background: #b1cbe3;
		border-color: var(--border) !important;
	}
.horizontal-table td, .vertical-table td, .generic-form-table td, .install_table td, .woe-table td, #server_status td, #server_status th {
	color: var(--text);
	background: #111827;
	border-color: var(--border) !important;
}
.horizontal-table tr:nth-child(even) td, .vertical-table tr:nth-child(even) td { background: #0f172a; }
.horizontal-table tr:hover td, .vertical-table tr:hover td { background: #172033; }
.generic-form, .generic-form-div, .info-text, .raw-txn-log {
	color: var(--text);
	background: #111827;
	border: 1px solid var(--border);
}
.generic-form-table td p { color: var(--text); }
.search-form, search-form2 { border-top-color: var(--border); }
.search-form p, .search-form2 p { color: var(--muted); border-bottom-color: var(--border); }
.search-form label, .search-form2 label { color: #cbd5e1; }

.submit_button, input[type=submit], input[type=button], button {
	color: #e0f2fe;
	background: linear-gradient(135deg, #0369a1, #4338ca);
	border: 1px solid rgba(125, 211, 252, .28);
	border-radius: 10px;
	font-weight: 700;
	cursor: pointer;
}
.submit_button { padding: 8px 12px; }
.submit_button:hover, input[type=submit]:hover, input[type=button]:hover, button:hover {
	color: #fff;
	background: linear-gradient(135deg, #0284c7, #4f46e5);
	border-color: rgba(125, 211, 252, .55);
}

/* Text states */
.pages { color: var(--muted); border-top-color: var(--border); }
.pages .page-prev, .pages .page-next, .action a, .action span.anchor, .block-link, .shop-item-action a { color: var(--accent); border-bottom-color: rgba(56,189,248,.25); }
.pages .current-page, .online, .character-stats .stat-value, .cost, .qty, .cart-item-count, .cart-sub-total,
.donation-amount, .remaining-balance, .exchange-rate, .important, .top-ranked td, .top-ranked a { color: #f8fafc; }
.offline, .not-applicable, .td-action, .action, .shop-item-action { color: var(--muted-2); }
.up, .created { color: var(--success); }
.down, .missing, .state-banned, .state-permanently-banned, .mvp { color: var(--danger); }
.state-pending, .hold-hours, .keyword { color: var(--warning); }

/* Shop/cart/ranking/details */
.shop-table { color: var(--text); }
.shop-table td { background: #111827; border-color: var(--border); }
.shop-item-name { color: #f8fafc; border-bottom-color: var(--border); }
.shop-item-cost-qty, .credit-amount-text, .balance-text { color: var(--muted); }
.shop-server-name, .credit-amount, .woe-table .time, .character-stats .stat-name { color: #cbd5e1; }
.cart-items-text { color: #e5e7eb; background: #1e293b; border-color: #334155; }
.cart-item-name, .checkout-text a { border-bottom-color: var(--border); }
.checkout-text a:hover { color: #fff; border-bottom-color: var(--accent); }
.credit-balance { color: var(--text); background: #111827; border: 1px solid var(--border); }
.top-ranked td { background-color: rgba(245, 158, 11, .16); }
.item-drop-mvp td { color: #f8fafc; background-color: rgba(129, 140, 248, .16); }
.item-drop-card td, .equipped td { color: #f8fafc; background-color: rgba(56, 189, 248, .12); }
.normalslotted .equipped { color: #cbd5e1; }
.monster-mode li, .job-classes td { border-color: var(--border); }
.script-line-num { background: #1e293b; border-right-color: var(--border); }

#server_status { background: #111827; border-color: var(--border); }
#server_status .server { color: #f8fafc; }
#copyright p, #info p { color: var(--muted); }
#copyright a { color: var(--accent); }
.request, .fs-path { color: #e5e7eb; background: #0b1220; border-color: var(--border); border-radius: 8px; }

/* Legacy image slices are kept for compatibility but visually softened in dark mode. */
#sidebar img[src*="sidebar_"], #admin_sidebar img[src*="sidebar_"] { opacity: .08; }

/* ==========================================================================
   Second pass: darker rounded header/menu with updated Poring logo.
   ========================================================================== */
body > table {
	max-width: 1440px;
	width: calc(100% - 40px);
	margin: 24px auto;
}
.flux-header-cell {
	padding: 0;
	background: transparent !important;
}
.flux-hero {
	min-height: 190px;
	padding: 26px 34px;
	display: flex;
	align-items: center;
	gap: 34px;
	background:
		radial-gradient(circle at 10% 15%, rgba(56, 189, 248, .12), transparent 32rem),
		linear-gradient(135deg, rgba(30, 41, 59, .98), rgba(12, 19, 32, .98) 58%, rgba(8, 13, 24, .98));
	border: 1px solid rgba(148, 163, 184, .26);
	border-radius: 34px;
	box-shadow: 0 28px 70px rgba(0, 0, 0, .46), inset 0 1px 0 rgba(255, 255, 255, .05);
	overflow: hidden;
	position: relative;
}
.flux-hero:before {
	content: "";
	position: absolute;
	inset: 1px;
	border-radius: 32px;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(255,255,255,.06), transparent 42%);
}
.flux-brand {
	min-width: 360px;
	padding-right: 30px;
	border-right: 1px solid rgba(148, 163, 184, .24);
	position: relative;
	z-index: 1;
}
#logo {
	width: 430px;
	max-width: 100%;
	height: auto;
	padding: 0;
	filter: drop-shadow(0 18px 28px rgba(0, 0, 0, .45));
}
.flux-hero-login {
	flex: 1 1 auto;
	position: relative;
	z-index: 1;
}
.flux-hero-login #loginbox {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #cbd5e1;
	background: transparent !important;
}
.flux-hero-login #loginbox td[bgcolor] {
	background: transparent !important;
}
.flux-hero-login #loginbox img[src*="loginbox_"] {
	display: none !important;
}
.flux-hero-login #loginbox strong,
.flux-hero-login .loginbox-admin-menu strong {
	color: #93c5fd;
}
.flux-hero-login #loginbox a {
	color: #60a5fa;
	font-weight: 700;
	text-shadow: 0 0 18px rgba(96, 165, 250, .35);
}
.flux-hero-login #loginbox a:hover {
	color: #bae6fd;
}
.flux-hero-login .loginbox-admin-menu {
	margin-top: 8px;
	padding-top: 0;
	color: #64748b;
	font-size: 14px;
}
.flux-hero-login .loginbox-admin-menu a {
	color: #93c5fd;
	font-weight: 600;
}

#content {
	border-radius: 26px;
	background: linear-gradient(135deg, rgba(17, 24, 39, .96), rgba(11, 18, 32, .96));
	border-color: rgba(148, 163, 184, .22);
}
#content td[bgcolor] {
	background: transparent !important;
}

#admin_sidebar, #sidebar {
	border-radius: 22px;
	overflow: hidden;
	background: rgba(15, 23, 42, .94);
	border: 1px solid rgba(148, 163, 184, .18);
}
#admin_sidebar th.menuitem, #sidebar th.menuitem {
	background: linear-gradient(135deg, #0f172a, #172033) !important;
}
#admin_sidebar td.menuitem, #admin_sidebar th.menuitem,
#sidebar td.menuitem, #sidebar th.menuitem,
#admin_sidebar td.sidebar-left, #admin_sidebar td.sidebar-right,
#sidebar td.sidebar-left, #sidebar td.sidebar-right {
	background: #0b1220 !important;
	border-color: #0b1220 !important;
}
#admin_sidebar td.menuitem a, #sidebar td.menuitem a {
	margin: 3px 8px;
	padding: 8px 12px 9px 16px;
	border-radius: 12px;
	color: #cbd5e1;
}
#admin_sidebar td.menuitem a:hover, #sidebar td.menuitem a:hover {
	background: linear-gradient(135deg, rgba(37, 99, 235, .28), rgba(14, 165, 233, .16));
	color: #fff;
}

@media (max-width: 920px) {
	.flux-hero { flex-direction: column; align-items: flex-start; gap: 18px; padding: 22px; }
	.flux-brand { min-width: 0; width: 100%; padding-right: 0; padding-bottom: 18px; border-right: 0; border-bottom: 1px solid rgba(148, 163, 184, .24); }
	#logo { width: 360px; }
}

/* ==========================================================================
   Hero background integration: replaces the Poring block with the uploaded art.
   Keeps FluxCP navigation and login/admin menus untouched.
   ========================================================================== */
.flux-hero {
	min-height: 250px;
	padding: 34px 46px;
	gap: 28px;
	background:
		linear-gradient(90deg, rgba(2, 8, 23, .96) 0%, rgba(2, 8, 23, .84) 25%, rgba(2, 8, 23, .54) 55%, rgba(2, 8, 23, .72) 100%),
		linear-gradient(180deg, rgba(2, 8, 23, .25), rgba(2, 8, 23, .74)),
		url('../img/hero-bg.jpg') center center / cover no-repeat;
	border-radius: 32px;
	border: 1px solid rgba(148, 163, 184, .28);
	box-shadow: 0 30px 90px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .08);
}
.flux-hero:before {
	inset: 0;
	border-radius: 31px;
	background: linear-gradient(180deg, rgba(255,255,255,.09), transparent 38%, rgba(0,0,0,.18));
}
.flux-brand {
	min-width: 260px;
	padding: 18px 32px 18px 0;
	border-right: 1px solid rgba(203, 213, 225, .25);
}
.flux-brand-link {
	display: inline-flex;
	flex-direction: column;
	gap: 10px;
	text-decoration: none !important;
}
.flux-brand-title {
	font-size: 46px;
	line-height: 1;
	letter-spacing: -1.6px;
	font-weight: 800;
	color: #f8fafc;
	text-shadow: 0 4px 22px rgba(0, 0, 0, .55);
}
.flux-brand-title span {
	color: #60a5fa;
}
.flux-brand-subtitle {
	font-size: 16px;
	font-weight: 500;
	color: #dbeafe;
	text-shadow: 0 2px 16px rgba(0, 0, 0, .6);
}
#logo {
	display: none !important;
}
.flux-hero-login #loginbox {
	padding: 10px 0;
	color: #e2e8f0;
	text-shadow: 0 2px 14px rgba(0,0,0,.65);
}
.flux-hero-login #loginbox,
.flux-hero-login .loginbox-admin-menu {
	font-size: 16px;
}
.flux-hero-login #loginbox a,
.flux-hero-login .loginbox-admin-menu a {
	color: #60a5fa;
}
.flux-hero-login #loginbox a:hover,
.flux-hero-login .loginbox-admin-menu a:hover {
	color: #bfdbfe;
}
@media (max-width: 920px) {
	.flux-hero { min-height: 300px; padding: 28px; background-position: 58% center; }
	.flux-brand { min-width: 0; width: 100%; padding: 0 0 20px 0; }
	.flux-brand-title { font-size: 40px; }
}

/* Admin menu visibility fix for hero header */
.flux-hero-login .loginbox-admin-menu {
	display: table-cell !important;
	visibility: visible !important;
	opacity: 1 !important;
	white-space: normal;
	line-height: 1.75;
}
.flux-hero-login .loginbox-admin-menu strong {
	margin-right: 6px;
}
.flux-hero-login .loginbox-admin-menu a {
	display: inline-block;
	padding: 2px 0;
}


/* ==========================================================================
   Light mode theme variant.
   Keeps the same FluxCP features, login box, admin menu and hero artwork.
   ========================================================================== */
:root {
	--bg: #eef5ff;
	--bg-soft: #f8fafc;
	--panel: #ffffff;
	--panel-2: #f1f5f9;
	--panel-3: #e0f2fe;
	--text: #0f172a;
	--muted: #475569;
	--muted-2: #64748b;
	--border: #cbd5e1;
	--border-soft: rgba(148, 163, 184, .38);
	--accent: #2563eb;
	--accent-2: #0ea5e9;
	--success: #16a34a;
	--warning: #d97706;
	--danger: #dc2626;
	--shadow: 0 20px 50px rgba(15, 23, 42, .14);
	--radius: 16px;
}
html { background: #eef5ff; }
body {
	color: var(--text) !important;
	background:
		radial-gradient(circle at 20% 0%, rgba(59, 130, 246, .18), transparent 30rem),
		linear-gradient(180deg, #f8fbff 0%, #eef5ff 58%, #e6f0ff 100%) !important;
}
h2, h3 { color: #0f172a !important; }
h3 { border-bottom-color: #dbeafe !important; }
a { color: #2563eb; }
a:hover { color: #0f172a; }
input[type=text], input[type=password], input[type=file], textarea, select {
	color: #0f172a !important;
	background: #f8fafc !important;
	border-color: #cbd5e1 !important;
	box-shadow: inset 0 1px 2px rgba(15, 23, 42, .04);
}
input[type=text]:focus, input[type=password]:focus, input[type=file]:focus, textarea:focus, select:focus {
	background: #ffffff !important;
	border-color: #3b82f6 !important;
	box-shadow: 0 0 0 3px rgba(59, 130, 246, .16);
}
.message {
	color: #ffffff !important;
	background: linear-gradient(135deg, #2563eb, #0ea5e9) !important;
	border-radius: 12px;
}
.notice {
	color: #075985 !important;
	background: #e0f2fe !important;
	border-color: #7dd3fc !important;
	border-radius: 12px;
}
body > table {
	max-width: 1440px;
	width: calc(100% - 40px);
	margin: 24px auto;
}
.flux-header-cell { background: transparent !important; }
.flux-hero {
	min-height: 250px;
	padding: 34px 46px;
	gap: 28px;
	background:
		linear-gradient(90deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.84) 28%, rgba(255,255,255,.48) 58%, rgba(255,255,255,.22) 100%),
		linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.80)),
		url('../img/hero-bg.jpg') 78% center / cover no-repeat !important;
	border-radius: 32px;
	border: 1px solid rgba(148, 163, 184, .45);
	box-shadow: 0 30px 90px rgba(15, 23, 42, .18), inset 0 1px 0 rgba(255, 255, 255, .85);
}
.flux-hero:before {
	inset: 0;
	border-radius: 31px;
	background: linear-gradient(180deg, rgba(255,255,255,.45), transparent 40%, rgba(255,255,255,.18));
}
.flux-brand {
	min-width: 260px;
	padding: 18px 32px 18px 0;
	border-right: 1px solid rgba(37, 99, 235, .18);
}
.flux-brand-title {
	color: #0f172a !important;
	text-shadow: 0 4px 22px rgba(255, 255, 255, .9);
}
.flux-brand-title span { color: #2563eb !important; }
.flux-brand-subtitle {
	color: #334155 !important;
	text-shadow: 0 2px 16px rgba(255,255,255,.9);
}
.flux-hero-login #loginbox {
	color: #334155 !important;
	text-shadow: 0 2px 14px rgba(255,255,255,.85) !important;
}
.flux-hero-login #loginbox strong,
.flux-hero-login .loginbox-admin-menu strong { color: #1d4ed8 !important; }
.flux-hero-login #loginbox a,
.flux-hero-login .loginbox-admin-menu a {
	color: #2563eb !important;
	text-shadow: none !important;
}
.flux-hero-login #loginbox a:hover,
.flux-hero-login .loginbox-admin-menu a:hover { color: #0f172a !important; }
.flux-hero-login .loginbox-admin-menu { color: #64748b !important; }
#content {
	border-radius: 26px;
	background: rgba(255, 255, 255, .96) !important;
	border: 1px solid rgba(148, 163, 184, .36) !important;
	box-shadow: var(--shadow);
	overflow: hidden;
}
#content td[bgcolor] { background: #ffffff !important; }
#content img[src*="content_"] { opacity: .08; }
#admin_sidebar, #sidebar {
	border-radius: 22px;
	overflow: hidden;
	background: rgba(255,255,255,.92) !important;
	border: 1px solid rgba(148, 163, 184, .35) !important;
	box-shadow: 0 18px 40px rgba(15, 23, 42, .10);
}
#admin_sidebar th.menuitem, #sidebar th.menuitem {
	background: linear-gradient(135deg, #dbeafe, #bfdbfe) !important;
}
#admin_sidebar td.menuitem, #admin_sidebar th.menuitem,
#sidebar td.menuitem, #sidebar th.menuitem,
#admin_sidebar td.sidebar-left, #admin_sidebar td.sidebar-right,
#sidebar td.sidebar-left, #sidebar td.sidebar-right {
	background: #ffffff !important;
	border-color: #ffffff !important;
}
#admin_sidebar th.menuitem strong, #sidebar th.menuitem strong {
	color: #1e3a8a !important;
	border-bottom-color: #bfdbfe !important;
}
#admin_sidebar td.menuitem a, #sidebar td.menuitem a {
	margin: 3px 8px;
	padding: 8px 12px 9px 16px;
	border-radius: 12px;
	color: #334155 !important;
	background: transparent !important;
	text-shadow: none !important;
}
#admin_sidebar td.menuitem a:hover, #sidebar td.menuitem a:hover {
	background: linear-gradient(135deg, rgba(37, 99, 235, .12), rgba(14, 165, 233, .10)) !important;
	color: #1d4ed8 !important;
}
.horizontal-table, .vertical-table, .generic-form-table, .generic-table,
table.horizontal-table, table.vertical-table, table.generic-form-table, table.generic-table {
	background: #ffffff !important;
	color: #0f172a !important;
	border-color: #dbeafe !important;
}
.horizontal-table th, .vertical-table th, .generic-form-table th, .generic-table th {
	color: #0f172a !important;
	background: #eaf3ff !important;
	border-color: #dbeafe !important;
}
.horizontal-table td, .vertical-table td, .generic-form-table td, .generic-table td {
	color: #0f172a !important;
	background: #ffffff !important;
	border-color: #e2e8f0 !important;
}
.horizontal-table tr:nth-child(even) td, .generic-table tr:nth-child(even) td { background: #f8fafc !important; }
#server_status { background: #ffffff !important; border-color: #dbeafe !important; }
#server_status .server { color: #0f172a !important; }
#copyright p, #info p, .note, #submenu, #pagemenu { color: #475569 !important; }
.request, .fs-path, .script-line-num {
	color: #0f172a !important;
	background: #f8fafc !important;
	border-color: #dbeafe !important;
}
@media (max-width: 920px) {
	.flux-hero { min-height: 300px; padding: 28px; background-position: 58% center !important; }
	.flux-brand { min-width: 0; width: 100%; padding: 0 0 20px 0; border-right: 0; border-bottom: 1px solid rgba(37, 99, 235, .18); }
	.flux-brand-title { font-size: 40px; }
}

/* Login/form block light-mode fix */
.generic-form,
.generic-form-div,
.info-text,
.raw-txn-log {
	color: #0f172a !important;
	background: #ffffff !important;
	border: 1px solid #dbeafe !important;
	box-shadow: 0 12px 30px rgba(15, 23, 42, .08) !important;
}

.generic-form-table th,
.generic-form-table td {
	color: #0f172a !important;
	background: #ffffff !important;
}

.generic-form-table th label,
.generic-form-table td p {
	color: #0f172a !important;
}

/* Online players counter */
.flux-online-counter {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 12px 16px;
	border-radius: 999px;
	background: rgba(15, 23, 42, .58);
	border: 1px solid rgba(147, 197, 253, .32);
	box-shadow: 0 14px 30px rgba(0, 0, 0, .22), inset 0 1px 0 rgba(255, 255, 255, .08);
	color: #e2e8f0;
	white-space: nowrap;
}
.flux-online-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #22c55e;
	box-shadow: 0 0 0 4px rgba(34, 197, 94, .18), 0 0 18px rgba(34, 197, 94, .75);
}
.flux-online-number {
	font-size: 22px;
	line-height: 1;
	font-weight: 800;
	color: #ffffff;
}
.flux-online-label {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: #bfdbfe;
}
@media (max-width: 920px) {
	.flux-online-counter { margin-top: -6px; }
}

/* Light theme online counter */
.flux-online-counter {
	background: rgba(255, 255, 255, .74) !important;
	border-color: rgba(37, 99, 235, .22) !important;
	box-shadow: 0 14px 30px rgba(15, 23, 42, .10), inset 0 1px 0 rgba(255, 255, 255, .90) !important;
	color: #0f172a !important;
}
.flux-online-number { color: #0f172a !important; }
.flux-online-label { color: #2563eb !important; }

/* TinkRO custom logo */
.tinkro-brand-link {
	display: inline-flex !important;
	align-items: center;
	text-decoration: none !important;
}
.tinkro-logo {
	display: block;
	width: 360px;
	max-width: 100%;
	height: auto;
	filter: drop-shadow(0 12px 22px rgba(0,0,0,.28));
}
@media (max-width: 800px) {
	.tinkro-logo { width: 300px; }
}

/* Online counter above TinkRO logo */
.flux-brand {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}
.flux-online-counter-link {
	text-decoration: none !important;
	cursor: pointer;
}
.flux-online-counter-link:hover {
	transform: translateY(-1px);
	filter: brightness(1.05);
}


/* TinkRO banner layout inspired by the provided mockup */
.tinkro-hero {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	min-height: 300px !important;
	padding: 34px 46px !important;
	overflow: hidden !important;
	border-radius: 32px !important;
	background:
		linear-gradient(90deg, rgba(2, 8, 23, .92) 0%, rgba(2, 8, 23, .74) 26%, rgba(2, 8, 23, .30) 58%, rgba(2, 8, 23, .48) 100%),
		linear-gradient(180deg, rgba(2, 8, 23, .12), rgba(2, 8, 23, .80)),
		url('../img/hero-bg.jpg') 78% center / cover no-repeat !important;
	border: 1px solid rgba(148, 163, 184, .28) !important;
	box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.tinkro-hero:before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	border-radius: 31px !important;
	pointer-events: none !important;
	background: linear-gradient(180deg, rgba(255,255,255,.08), transparent 40%, rgba(0,0,0,.20)) !important;
}

.tinkro-brand {
	position: relative !important;
	z-index: 2 !important;
	min-width: 310px !important;
	width: auto !important;
	padding: 20px 36px 20px 0 !important;
	border-right: 1px solid rgba(203, 213, 225, .22) !important;
	border-bottom: 0 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.tinkro-brand-link {
	display: inline-flex !important;
	align-items: center !important;
	text-decoration: none !important;
}

.tinkro-logo {
	display: block !important;
	width: 300px !important;
	max-width: 100% !important;
	height: auto !important;
	filter: drop-shadow(0 12px 24px rgba(0,0,0,.45));
}

.tinkro-online-bottom-right {
	position: absolute !important;
	right: 28px !important;
	bottom: 22px !important;
	z-index: 5 !important;
	margin: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 14px 20px !important;
	border-radius: 999px !important;
	background: rgba(15, 23, 42, .72) !important;
	border: 1px solid rgba(244, 114, 182, .45) !important;
	box-shadow: 0 18px 42px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.12) !important;
	color: #e5e7eb !important;
	text-decoration: none !important;
	backdrop-filter: blur(8px);
}

.tinkro-online-bottom-right .flux-online-number {
	font-size: 26px !important;
	line-height: 1 !important;
	font-weight: 900 !important;
	color: #ffffff !important;
}

.tinkro-online-bottom-right .flux-online-label {
	font-size: 14px !important;
	font-weight: 800 !important;
	letter-spacing: .04em !important;
	text-transform: uppercase !important;
	color: #dbeafe !important;
}

.tinkro-online-bottom-right .flux-online-arrow {
	font-size: 30px !important;
	line-height: 1 !important;
	color: #f9a8d4 !important;
	margin-left: 2px !important;
}

.tinkro-online-bottom-right:hover {
	transform: translateY(-1px);
	filter: brightness(1.08);
}

@media (max-width: 760px) {
	.tinkro-hero {
		min-height: 360px !important;
		padding: 24px !important;
		align-items: flex-start !important;
	}
	.tinkro-brand {
		min-width: 0 !important;
		width: 100% !important;
		padding: 0 0 18px 0 !important;
		border-right: 0 !important;
		border-bottom: 1px solid rgba(203, 213, 225, .22) !important;
		justify-content: flex-start !important;
	}
	.tinkro-logo {
		width: 245px !important;
	}
	.tinkro-online-bottom-right {
		right: 18px !important;
		bottom: 18px !important;
	}
}