/* 1X Store Affiliate frontend — scoped to avoid Hello Elementor / Elementor button overrides. */
.one-x-affiliate-dashboard,
.one-x-affiliate-login{
  --ox-bg:#030916;
  --ox-surface:#09162b;
  --ox-card:#0c1e38;
  --ox-card-2:#102846;
  --ox-border:#1d456b;
  --ox-border-strong:#27628d;
  --ox-text:#f4faff;
  --ox-muted:#a4bfd6;
  --ox-accent:#078cff;
  --ox-accent-hover:#27d8ff;
  --ox-accent-ink:#ffffff;
  --ox-green:#20b56b;
  --ox-green-hover:#27c978;
  --ox-red:#e95045;
  --ox-radius:12px;
  --ox-shadow:0 14px 35px rgba(0,0,0,.18);
  color:var(--ox-text);
  font-family:inherit;
}

.one-x-affiliate-dashboard{
  width:100%;
  max-width:1280px;
  margin:0 auto;
  padding:clamp(14px,2vw,24px);
  background:var(--ox-bg);
  border:1px solid #18456b;
  border-radius:16px;
  box-shadow:0 20px 55px rgba(0,0,0,.18);
  isolation:isolate;
}

.one-x-affiliate-dashboard *,
.one-x-affiliate-login *{box-sizing:border-box}

.one-x-affiliate-dashboard h2,
.one-x-affiliate-dashboard h3,
.one-x-affiliate-dashboard h4,
.one-x-affiliate-login h3{
  color:var(--ox-text);
  font-family:inherit;
  line-height:1.25;
}

.one-x-dashboard-hero,
.one-x-card,
.one-x-affiliate-login{
  background:linear-gradient(180deg,var(--ox-card-2),var(--ox-card));
  border:1px solid var(--ox-border);
  border-radius:var(--ox-radius);
  padding:clamp(18px,2vw,24px);
  margin:0 0 16px;
  box-shadow:var(--ox-shadow);
}

.one-x-dashboard-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:132px;
  background:
    radial-gradient(circle at 90% 15%,rgba(0,200,255,.10),transparent 32%),
    linear-gradient(135deg,#0c1e38,#071224 62%,#06162b);
  border-color:#1d456b;
}

.one-x-dashboard-hero h2{margin:5px 0 7px;font-size:clamp(24px,2.4vw,34px);font-weight:800;letter-spacing:-.02em}
.one-x-dashboard-hero p,.one-x-muted{color:var(--ox-muted);margin:0;line-height:1.55}
.one-x-kicker{display:block;color:var(--ox-accent);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}

.one-x-code-badge{
  flex:0 0 auto;
  min-width:154px;
  background:#071426;
  border:1px solid #087bff;
  border-radius:10px;
  padding:15px 18px;
  text-align:center;
}
.one-x-code-badge small{display:block;color:var(--ox-muted);font-size:11px;margin-bottom:3px}
.one-x-code-badge strong{display:block;font-size:22px;color:var(--ox-accent);letter-spacing:.03em}

.one-x-dashboard-tabs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 16px;
  padding:0;
}
body .one-x-affiliate-dashboard .one-x-dashboard-tabs a{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  color:#e8f5ff!important;
  text-decoration:none!important;
  border:1px solid var(--ox-border)!important;
  background:#09162b!important;
  border-radius:8px!important;
  padding:8px 13px!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1!important;
  box-shadow:none!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease!important;
}
body .one-x-affiliate-dashboard .one-x-dashboard-tabs a:hover,
body .one-x-affiliate-dashboard .one-x-dashboard-tabs a:focus{
  background:#071a31!important;
  border-color:var(--ox-accent)!important;
  color:var(--ox-accent)!important;
  transform:translateY(-1px);
  outline:0!important;
}

.one-x-stats-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  margin:0 0 16px;
}
.one-x-stat{
  position:relative;
  overflow:hidden;
  min-height:96px;
  background:linear-gradient(180deg,#121a20,#09162b);
  border:1px solid var(--ox-border);
  border-radius:10px;
  padding:16px;
}
.one-x-stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ox-accent)}
.one-x-stat span{display:block;color:var(--ox-muted);font-size:12px;line-height:1.3;padding-left:2px}
.one-x-stat strong{display:block;color:var(--ox-text);font-size:20px;line-height:1.2;margin-top:8px;padding-left:2px;font-weight:800}

.one-x-dashboard-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);
  gap:16px;
  align-items:stretch;
  margin-bottom:16px;
}
.one-x-dashboard-grid > *{min-width:0}
.one-x-dashboard-grid .one-x-card{height:100%;margin-bottom:0}
.one-x-dashboard-grid #one-x-referral > .one-x-card{height:100%;margin-bottom:0}

.one-x-card{overflow:hidden}
.one-x-card h3{margin:0 0 14px;font-size:20px;font-weight:800;letter-spacing:-.01em}
.one-x-card h4{margin:20px 0 10px;font-size:16px;font-weight:800}
.one-x-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:8px}
.one-x-referral-tools label{display:block;color:#dce3e9;font-size:12px;font-weight:700;margin:0 0 6px}

.one-x-copy-row{display:flex;align-items:stretch;gap:8px;margin:6px 0 14px;min-width:0}
.one-x-copy-row input{flex:1 1 auto;min-width:0}

body .one-x-affiliate-dashboard .one-x-copy-row input,
body .one-x-affiliate-dashboard .one-x-withdrawal-form input,
body .one-x-affiliate-dashboard .one-x-withdrawal-form select{
  width:100%!important;
  min-height:44px!important;
  height:44px!important;
  background:#080d11!important;
  color:var(--ox-text)!important;
  border:1px solid #303b44!important;
  border-radius:8px!important;
  padding:10px 12px!important;
  font-family:inherit!important;
  font-size:14px!important;
  line-height:1.25!important;
  box-shadow:none!important;
  outline:none!important;
  transition:border-color .18s ease,box-shadow .18s ease!important;
}
body .one-x-affiliate-dashboard .one-x-copy-row input:focus,
body .one-x-affiliate-dashboard .one-x-withdrawal-form input:focus,
body .one-x-affiliate-dashboard .one-x-withdrawal-form select:focus{
  border-color:var(--ox-accent)!important;
  box-shadow:0 0 0 3px rgba(0,200,255,.16)!important;
}

body .one-x-affiliate-dashboard .one-x-btn,
body .one-x-affiliate-dashboard .one-x-copy,
body .one-x-affiliate-login .one-x-btn{
  appearance:none!important;
  -webkit-appearance:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:44px!important;
  background:var(--ox-accent)!important;
  background-image:none!important;
  color:var(--ox-accent-ink)!important;
  border:1px solid var(--ox-accent)!important;
  border-radius:8px!important;
  padding:10px 16px!important;
  font-family:inherit!important;
  font-size:13px!important;
  font-weight:800!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-decoration:none!important;
  text-transform:none!important;
  cursor:pointer!important;
  white-space:nowrap!important;
  box-shadow:none!important;
  outline:none!important;
  transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
body .one-x-affiliate-dashboard .one-x-copy{flex:0 0 auto;min-width:112px!important}

body .one-x-affiliate-dashboard .one-x-btn:hover,
body .one-x-affiliate-dashboard .one-x-copy:hover,
body .one-x-affiliate-login .one-x-btn:hover{
  background:#27d8ff!important;
  background-image:none!important;
  border-color:#27d8ff!important;
  color:#0d120d!important;
  box-shadow:0 8px 18px rgba(0,200,255,.13)!important;
  transform:translateY(-1px)!important;
}
body .one-x-affiliate-dashboard .one-x-btn:focus,
body .one-x-affiliate-dashboard .one-x-copy:focus,
body .one-x-affiliate-login .one-x-btn:focus{
  background:var(--ox-accent)!important;
  border-color:var(--ox-accent)!important;
  color:var(--ox-accent-ink)!important;
  box-shadow:0 0 0 3px rgba(0,200,255,.16)!important;
  outline:0!important;
}
body .one-x-affiliate-dashboard .one-x-btn:active,
body .one-x-affiliate-dashboard .one-x-copy:active{transform:translateY(0)!important}

body .one-x-affiliate-dashboard .one-x-btn-secondary,
body .one-x-affiliate-login .one-x-btn-secondary{
  background:#111820!important;
  color:#f4faff!important;
  border-color:#3a4650!important;
}
body .one-x-affiliate-dashboard .one-x-btn-secondary:hover,
body .one-x-affiliate-login .one-x-btn-secondary:hover{
  background:#071a31!important;
  color:var(--ox-accent)!important;
  border-color:var(--ox-accent)!important;
}
body .one-x-affiliate-dashboard .one-x-whatsapp{
  margin-top:2px!important;
  background:var(--ox-green)!important;
  border-color:var(--ox-green)!important;
  color:#fff!important;
}
body .one-x-affiliate-dashboard .one-x-whatsapp:hover{
  background:var(--ox-green-hover)!important;
  border-color:var(--ox-green-hover)!important;
  color:#fff!important;
  box-shadow:0 8px 18px rgba(32,181,107,.16)!important;
}

.one-x-mini-stats p{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid var(--ox-border);
  padding:12px 0;
  margin:0;
  color:var(--ox-muted);
}
.one-x-mini-stats p:last-child{border-bottom:0;padding-bottom:0}
.one-x-mini-stats strong{color:var(--ox-text);font-weight:800;white-space:nowrap}

.one-x-table-wrap{width:100%;overflow:auto;border:1px solid var(--ox-border);border-radius:9px;background:#071224}
.one-x-table{width:100%;border-collapse:collapse;min-width:680px;margin:0!important;background:transparent!important}
body .one-x-affiliate-dashboard .one-x-table th,
body .one-x-affiliate-dashboard .one-x-table td{
  padding:12px 13px!important;
  border:0!important;
  border-bottom:1px solid #222d35!important;
  text-align:left!important;
  color:#e4f2ff!important;
  font-size:13px!important;
  vertical-align:middle!important;
  background:transparent!important;
}
body .one-x-affiliate-dashboard .one-x-table th{
  color:#aeb8c1!important;
  background:#0c1e38!important;
  font-weight:700!important;
  text-transform:none!important;
}
body .one-x-affiliate-dashboard .one-x-table tbody tr:last-child td{border-bottom:0!important}
body .one-x-affiliate-dashboard .one-x-table tbody tr:hover td{background:#111920!important}

.one-x-status{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;background:#303942;color:#e8f5ff;font-size:11px;font-weight:800}
.one-x-status-available{background:#103b27;color:#8fe6b6}
.one-x-status-pending{background:#40370d;color:#83eaff}
.one-x-status-reversed{background:#441a18;color:#ffaaa3}
.one-x-status-paid{background:#12334a;color:#9ed5ff}

.one-x-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;margin-bottom:14px}
.one-x-form-grid p{margin:0!important;min-width:0}
.one-x-form-grid label{display:block;color:#c5ced5;font-size:12px;font-weight:700;margin:0 0 6px}
.one-x-withdrawal-form > .one-x-btn{margin-top:2px}

.one-x-message{padding:12px 14px;border-radius:8px;margin:0 0 15px;border:1px solid transparent;font-size:13px;font-weight:700}
.one-x-message-success{background:#0d3221;border-color:#195d3c;color:#a8e8c3}
.one-x-message-error{background:#391817;border-color:#74302c;color:#ffb4ae}

.one-x-actions{display:flex;gap:10px;flex-wrap:wrap}
.one-x-affiliate-login{max-width:760px;margin:24px auto;color:#fff;background:linear-gradient(180deg,#0c1e38,#0c1115);border-color:#1d456b}
.one-x-affiliate-login h3{margin:0 0 8px;font-size:24px}
.one-x-affiliate-login p{color:#a4bfd6;margin:0 0 16px}

@media(max-width:1100px){
  .one-x-stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .one-x-dashboard-grid{grid-template-columns:1fr}
  .one-x-dashboard-grid .one-x-card{height:auto}
}
@media(max-width:760px){
  .one-x-affiliate-dashboard{padding:12px;border-radius:12px}
  .one-x-dashboard-hero{align-items:flex-start;flex-direction:column;min-height:0}
  .one-x-code-badge{width:100%;min-width:0;text-align:left}
  .one-x-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .one-x-form-grid{grid-template-columns:1fr}
  .one-x-dashboard-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
}
@media(max-width:520px){
  .one-x-stats-grid{grid-template-columns:1fr}
  .one-x-copy-row{flex-direction:column}
  body .one-x-affiliate-dashboard .one-x-copy{width:100%!important;min-width:0!important}
  body .one-x-affiliate-dashboard .one-x-whatsapp{width:100%!important}
  .one-x-actions{flex-direction:column}
  .one-x-actions .one-x-btn{width:100%!important}
}


/* 1XSTORE 2026 ELECTRIC BLUE / CYAN BRAND REFINEMENTS */
.one-x-affiliate-dashboard,
.one-x-affiliate-login {
  --ox-accent:#078cff;
  --ox-accent-hover:#27d8ff;
  --ox-accent-ink:#ffffff;
  --ox-shadow:0 16px 38px rgba(0,93,190,.17);
}
.one-x-affiliate-dashboard .one-x-dashboard-hero,
.one-x-affiliate-login {
  background-image: radial-gradient(circle at 92% 12%,rgba(0,200,255,.13),transparent 38%), linear-gradient(145deg,#102846,#071224 66%,#06162b);
}
.one-x-affiliate-dashboard a:is(.button,.one-x-button),
.one-x-affiliate-dashboard button,
.one-x-affiliate-dashboard input[type=submit],
.one-x-affiliate-login button,
.one-x-affiliate-login input[type=submit] {
  transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease,filter .22s ease!important;
}
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .one-x-affiliate-dashboard a:is(.button,.one-x-button):hover,
 .one-x-affiliate-dashboard button:hover,
 .one-x-affiliate-dashboard input[type=submit]:hover,
 .one-x-affiliate-login button:hover,
 .one-x-affiliate-login input[type=submit]:hover {
   transform:translateY(-2px) scale(1.025);
   box-shadow:0 8px 24px rgba(0,153,255,.3)!important;
 }
}
@media (prefers-reduced-motion:reduce){
 .one-x-affiliate-dashboard *, .one-x-affiliate-login * {transition:none!important;animation:none!important}
}
