/* ═══════════════════════════════════════════════════════════════
   PICOFXBOT — Platform-wide dark theme
   Canonical palette + UIKit overrides. Loaded on every page
   AFTER style.css so it wins on specificity-ties. Per-page
   inline <style> blocks have the same values hard-coded in so
   they're consistent; this file is the fallback for any surface
   that isn't page-specifically styled.
   ═══════════════════════════════════════════════════════════════ */

:root {
	/* surface */
	--pf-bg:          #0a0f1c;
	--pf-bg-2:        #0d1424;
	--pf-bg-3:        #111a2e;
	--pf-card:        rgba(255,255,255,0.045);
	--pf-card-hi:     rgba(255,255,255,0.075);
	--pf-border:      rgba(255,255,255,0.10);
	--pf-border-hi:   rgba(255,255,255,0.18);

	/* accents */
	--pf-gold:        #FCB42D;
	--pf-gold-2:      #ffd36b;
	--pf-gold-soft:   rgba(252,180,45,0.14);
	--pf-green:       #3BD297;
	--pf-green-2:     #6bffc2;
	--pf-green-soft:  rgba(59,210,151,0.14);
	--pf-red:         #ff5a6e;
	--pf-blue:        #6aa6ff;

	/* text */
	--pf-text:        #ffffff;
	--pf-text-2:      #d7dce8;
	--pf-text-dim:    #8c95a8;

	/* shape */
	--pf-radius:      14px;
	--pf-radius-lg:   22px;
	--pf-shadow-sm:   0 4px 18px rgba(0,0,0,0.30);
	--pf-shadow-md:   0 18px 48px rgba(0,0,0,0.45);
	--pf-shadow-gold: 0 18px 60px rgba(252,180,45,0.25);
}

/* ─── Body ─── */
body {
	background: var(--pf-bg) !important;
	color: var(--pf-text-2);
}

/* ─── Typography ─── */
h1, h2, h3, h4, h5, h6 { color: var(--pf-text); }
a { color: var(--pf-gold); transition: color .2s ease; }
a:hover { color: var(--pf-gold-2); }

/* ─── UIKit sections ─── */
.uk-section,
.uk-section-default,
.uk-section-muted,
.uk-section-secondary { background: var(--pf-bg) !important; }

/* ─── UIKit cards ─── */
.uk-card-default {
	background: var(--pf-card) !important;
	border: 1px solid var(--pf-border) !important;
	color: var(--pf-text) !important;
}
.uk-card-default .uk-card-body { background: transparent !important; }

/* ─── Buttons ─── */
.uk-button-primary {
	background: linear-gradient(135deg, var(--pf-gold), var(--pf-gold-2)) !important;
	color: #0a0f1c !important;
	border: 0 !important;
	font-weight: 700;
	box-shadow: 0 8px 24px rgba(252,180,45,0.30);
	transition: transform .2s ease, box-shadow .2s ease;
}
.uk-button-primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 12px 32px rgba(252,180,45,0.40) !important;
	color: #0a0f1c !important;
}
.uk-button-default {
	background: rgba(255,255,255,0.06) !important;
	color: var(--pf-text-2) !important;
	border-color: var(--pf-border) !important;
	transition: all .2s ease;
}
.uk-button-default:hover {
	background: rgba(255,255,255,0.10) !important;
	color: var(--pf-text) !important;
	border-color: var(--pf-border-hi) !important;
}
.uk-button-danger {
	background: rgba(255,90,110,0.18) !important;
	color: var(--pf-red) !important;
	border: 1px solid rgba(255,90,110,0.30) !important;
}
.uk-button-text { color: var(--pf-text-2) !important; }
.uk-button-text:hover { color: var(--pf-gold) !important; }

/* ─── Forms ─── */
.uk-input, .uk-select, .uk-textarea {
	background: rgba(255,255,255,0.05) !important;
	border-color: var(--pf-border) !important;
	color: var(--pf-text) !important;
	border-radius: 10px;
	transition: border-color .2s ease, box-shadow .2s ease;
}
.uk-input:focus, .uk-select:focus, .uk-textarea:focus {
	border-color: rgba(252,180,45,0.45) !important;
	box-shadow: 0 0 0 4px rgba(252,180,45,0.10) !important;
}
.uk-input::placeholder, .uk-textarea::placeholder { color: var(--pf-text-dim) !important; }
.uk-form-label { color: var(--pf-text-dim) !important; font-weight: 600; }
.uk-checkbox:checked, .uk-radio:checked { background-color: var(--pf-gold) !important; }

/* ─── Navigation ─── */
.uk-navbar-container {
	background: rgba(10,15,28,0.80) !important;
	backdrop-filter: saturate(180%) blur(12px);
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--pf-border) !important;
}
.uk-navbar-nav > li > a { color: var(--pf-text-2) !important; font-weight: 500; transition: color .2s ease; }
.uk-navbar-nav > li > a:hover,
.uk-navbar-nav > li.uk-active > a { color: var(--pf-gold) !important; }
.uk-logo img { filter: none; }

/* ─── Tables ─── */
.uk-table th {
	color: var(--pf-text-dim) !important;
	border-bottom-color: var(--pf-border) !important;
	text-transform: uppercase;
	font-size: 11px;
	letter-spacing: 0.10em;
}
.uk-table td { color: var(--pf-text-2); border-bottom-color: rgba(255,255,255,0.06) !important; }
.uk-table-striped tbody tr:nth-of-type(odd) { background: rgba(255,255,255,0.02) !important; }
.uk-table tbody tr:hover { background: rgba(252,180,45,0.04) !important; }

/* ─── Alerts ─── */
.uk-alert-success { background: rgba(59,210,151,0.12) !important; color: var(--pf-green) !important; border: 1px solid rgba(59,210,151,0.25) !important; }
.uk-alert-danger  { background: rgba(255,90,110,0.12) !important; color: var(--pf-red) !important; border: 1px solid rgba(255,90,110,0.25) !important; }
.uk-alert-warning { background: rgba(252,180,45,0.12) !important; color: var(--pf-gold-2) !important; border: 1px solid rgba(252,180,45,0.25) !important; }
.uk-alert-primary { background: rgba(106,166,255,0.12) !important; color: var(--pf-blue) !important; border: 1px solid rgba(106,166,255,0.25) !important; }

/* ─── Utility overrides ─── */
.uk-text-muted { color: var(--pf-text-dim) !important; }
.uk-text-small { color: var(--pf-text-dim) !important; }
.uk-text-meta  { color: var(--pf-text-dim) !important; }
.uk-text-lead  { color: var(--pf-text-2) !important; }
hr { border-color: var(--pf-border) !important; }
.uk-list a, .uk-link-text a { color: var(--pf-text-2) !important; transition: color .2s ease; }
.uk-list a:hover, .uk-link-text a:hover { color: var(--pf-gold) !important; }

/* ─── Modals / Dropdowns ─── */
.uk-modal-dialog { background: var(--pf-bg-3) !important; border: 1px solid var(--pf-border); border-radius: var(--pf-radius); }
.uk-modal-header { border-bottom-color: var(--pf-border) !important; background: transparent !important; }
.uk-modal-footer { border-top-color: var(--pf-border) !important; background: transparent !important; }
.uk-dropdown { background: var(--pf-bg-3) !important; border: 1px solid var(--pf-border); }
.uk-nav-default > li > a { color: var(--pf-text-2) !important; }
.uk-nav-default > li > a:hover, .uk-nav-default > li.uk-active > a { color: var(--pf-gold) !important; }

/* ─── Accordion / Tab ─── */
.uk-accordion-title { color: var(--pf-text-2) !important; }
.uk-accordion-title:hover { color: var(--pf-gold) !important; }
.uk-tab > li > a { color: var(--pf-text-dim) !important; border-bottom-color: transparent !important; }
.uk-tab > li > a:hover, .uk-tab > li.uk-active > a { color: var(--pf-gold) !important; border-bottom-color: var(--pf-gold) !important; }

/* ─── Footer ─── */
footer, footer .uk-section {
	border-top: 1px solid var(--pf-border);
	background: rgba(0,0,0,0.30) !important;
}
footer h5 { color: var(--pf-text) !important; font-weight: 700; }
footer a { color: var(--pf-text-2) !important; }
footer a:hover { color: var(--pf-gold) !important; }
footer hr { border-color: var(--pf-border) !important; opacity: 0.5; }
.copyright-text { color: var(--pf-text-dim) !important; }

/* ─── Scrollbar ─── */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--pf-bg); }
::-webkit-scrollbar-thumb {
	background: rgba(255,255,255,0.12);
	border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.22); }

/* ─── Selection ─── */
::selection { background: rgba(252,180,45,0.30); color: #fff; }

/* ─── Focus ring (keyboard) ─── */
:focus-visible {
	outline: 2px solid var(--pf-gold);
	outline-offset: 2px;
}

/* ─── To-top button ─── */
.to-top {
	background: linear-gradient(135deg, var(--pf-gold), var(--pf-gold-2)) !important;
	color: #0a0f1c !important;
	border-radius: 100px;
	font-weight: 700;
	box-shadow: 0 8px 24px rgba(252,180,45,0.30);
}

/* ─── Mobile auth buttons ─── */
.mobile-auth-btn {
	color: var(--pf-text-2);
	transition: color .2s ease;
}
.mobile-auth-btn:hover { color: var(--pf-gold); }

/* ─── Preloader ─── */
#page-preloader { background: var(--pf-bg) !important; }
#page-preloader div { background: var(--pf-gold) !important; }
