
/* =========================================================
   Arcendium Plain Button System
   - no gradients
   - no glow
   - no mixed colors
   - clean premium flat colors
========================================================= */

:root{
  --btn-primary:#00d4a9;
  --btn-primary-hover:#00b894;
  --btn-secondary:#eef4f8;
  --btn-secondary-hover:#e2edf4;
  --btn-text:#ffffff;
  --btn-dark-text:#0f172a;
}

html[data-theme="dark"]{
  --btn-primary:#00d4a9;
  --btn-primary-hover:#00b894;
  --btn-secondary:#172032;
  --btn-secondary-hover:#1e293b;
  --btn-text:#041016;
  --btn-dark-text:#f8fafc;
}

/* global button reset */
button,
.btn,
a.btn,
.nav-actions a,
.nav-actions button,
.auth-theme-toggle,
.theme-toggle,
.arc-theme-toggle,
.arc-mobile-menu-button,
.arc-mobile-menu-close,
.arc-mobile-menu-cta,
.arc-password-toggle,
input[type="submit"],
input[type="button"],
input[type="reset"]{
  background-image:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  filter:none !important;
}

/* primary buttons */
.btn-primary,
a.btn-primary,
button.btn-primary,
.cta-primary,
.hero-cta,
.arc-mobile-menu-cta,
input[type="submit"]{
  background:var(--btn-primary) !important;
  color:var(--btn-text) !important;
  border:1px solid var(--btn-primary) !important;
  box-shadow:none !important;
}

.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
.cta-primary:hover,
.hero-cta:hover,
.arc-mobile-menu-cta:hover,
input[type="submit"]:hover{
  background:var(--btn-primary-hover) !important;
  border-color:var(--btn-primary-hover) !important;
  color:var(--btn-text) !important;
  box-shadow:none !important;
  transform:translateY(-1px);
}

/* secondary / neutral buttons */
.btn-secondary,
.btn-outline,
.btn-ghost,
a.btn-secondary,
a.btn-outline,
a.btn-ghost,
button.btn-secondary,
button.btn-outline,
button.btn-ghost{
  background:var(--btn-secondary) !important;
  color:var(--btn-dark-text) !important;
  border:1px solid var(--border2, rgba(15,23,42,.14)) !important;
  box-shadow:none !important;
}

.btn-secondary:hover,
.btn-outline:hover,
.btn-ghost:hover,
a.btn-secondary:hover,
a.btn-outline:hover,
a.btn-ghost:hover,
button.btn-secondary:hover,
button.btn-outline:hover,
button.btn-ghost:hover{
  background:var(--btn-secondary-hover) !important;
  color:var(--btn-dark-text) !important;
  border-color:var(--border2, rgba(15,23,42,.18)) !important;
  box-shadow:none !important;
  transform:translateY(-1px);
}

/* nav/header buttons */
.nav-actions .btn,
.nav-actions a.btn,
.nav-actions button{
  box-shadow:none !important;
  background-image:none !important;
}

.nav-actions .btn-primary,
.nav-actions a[href="/register"],
.nav-actions a[href*="register"]{
  background:var(--btn-primary) !important;
  border-color:var(--btn-primary) !important;
  color:var(--btn-text) !important;
}

.nav-actions .btn-primary:hover,
.nav-actions a[href="/register"]:hover,
.nav-actions a[href*="register"]:hover{
  background:var(--btn-primary-hover) !important;
  border-color:var(--btn-primary-hover) !important;
}

/* icon buttons: theme toggle, mobile menu, close */
.arc-theme-toggle,
.theme-toggle,
.auth-theme-toggle,
.arc-mobile-menu-button,
.arc-mobile-menu-close{
  background:var(--btn-secondary) !important;
  color:var(--btn-dark-text) !important;
  border:1px solid var(--border2, rgba(15,23,42,.14)) !important;
  box-shadow:none !important;
}

.arc-theme-toggle:hover,
.theme-toggle:hover,
.auth-theme-toggle:hover,
.arc-mobile-menu-button:hover,
.arc-mobile-menu-close:hover{
  background:var(--btn-secondary-hover) !important;
  border-color:var(--btn-primary) !important;
  color:var(--btn-dark-text) !important;
  box-shadow:none !important;
}

/* password eye button should stay plain transparent */
.arc-password-toggle,
.arc-password-toggle:hover{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* mobile dropdown links */
.arc-mobile-menu-links a{
  background:var(--btn-secondary) !important;
  color:var(--btn-dark-text) !important;
  border:1px solid var(--border2, rgba(15,23,42,.12)) !important;
  box-shadow:none !important;
}

.arc-mobile-menu-links a:hover{
  background:var(--btn-secondary-hover) !important;
  border-color:var(--btn-primary) !important;
  box-shadow:none !important;
}

.arc-mobile-menu-links a.arc-mobile-menu-cta{
  background:var(--btn-primary) !important;
  color:var(--btn-text) !important;
  border-color:var(--btn-primary) !important;
}

.arc-mobile-menu-links a.arc-mobile-menu-cta:hover{
  background:var(--btn-primary-hover) !important;
  border-color:var(--btn-primary-hover) !important;
}

/* remove old gradient utility effects */
[class*="gradient"],
[class*="glow"],
[class*="shine"]{
  box-shadow:none !important;
}

/* specific old inline-gradient surfaces commonly used on buttons/cards */
button[style*="gradient"],
a[style*="gradient"],
.btn[style*="gradient"]{
  background:var(--btn-primary) !important;
  color:var(--btn-text) !important;
  box-shadow:none !important;
}

/* disabled buttons */
button:disabled,
.btn:disabled,
.btn.disabled,
input[type="submit"]:disabled{
  opacity:.55 !important;
  cursor:not-allowed !important;
  transform:none !important;
  box-shadow:none !important;
}


/* =========================================================
   Final landing mobile menu premium row + fit override
   plain_buttons loads after mobile_landing_header, so keep
   the no-box mobile menu styling here too.
========================================================= */
@media(max-width:820px){
  body[data-arc-page="landing"] .arc-mobile-menu-panel{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    min-width:0 !important;
    left:10px !important;
    right:auto !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }

  body[data-arc-page="landing"] .arc-mobile-menu-links{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    gap:0 !important;
    box-sizing:border-box !important;
  }

  body[data-arc-page="landing"] .arc-mobile-menu-links a:not(.arc-mobile-menu-cta){
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    padding:13px 2px !important;
    border-top:0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-bottom:1px solid rgba(15,23,42,.08) !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--btn-dark-text) !important;
  }

  html[data-theme="dark"] body[data-arc-page="landing"] .arc-mobile-menu-links a:not(.arc-mobile-menu-cta){
    border-bottom-color:rgba(255,255,255,.08) !important;
    background:transparent !important;
  }

  body[data-arc-page="landing"] .arc-mobile-menu-links a.arc-mobile-menu-cta{
    display:inline-flex !important;
    width:auto !important;
    min-width:0 !important;
    max-width:max-content !important;
    align-self:flex-start !important;
    justify-content:center !important;
    min-height:38px !important;
    height:38px !important;
    padding:0 16px !important;
    margin-top:12px !important;
    border-radius:999px !important;
    flex:0 0 auto !important;
  }
}

@media(max-width:360px){
  body[data-arc-page="landing"] .arc-mobile-menu-panel{
    width:calc(100vw - 12px) !important;
    max-width:calc(100vw - 12px) !important;
    left:6px !important;
  }
}


/* =========================================================
   V22.27 Receipt-style typography + text action system
   ---------------------------------------------------------
   Arcendium operational UI now uses a restrained receipt-like
   mono rhythm for labels, values, metadata and actions. Large
   display headings remain Inter for hierarchy and readability.
   Buttons are intentionally unboxed: color + SVG + motion is
   the affordance instead of filled rectangles and borders.
========================================================= */
:root{
  --arc-receipt-font:var(--font-m,'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,'Liberation Mono',monospace);
  --arc-action-muted:var(--text2,#5a6478);
  --arc-action-strong:var(--text,#0d1117);
  --arc-action-accent:var(--accent,#00d4a9);
  --arc-action-danger:var(--red,#ff4d6d);
}

/* Receipt-like information typography, without turning large marketing
   headings into a POS printout. */
body{
  font-family:var(--arc-receipt-font)!important;
  font-variant-numeric:tabular-nums slashed-zero;
  font-feature-settings:"tnum" 1,"zero" 1;
}
body .page-content,
body .modal,
body .sidebar-nav,
body .topbar,
body .filter-bar,
body table,
body .form-group,
body .empty-state,
body .badge,
body .toast,
body .arc-account-live-state,
body .arc-account-status-badge{
  font-family:var(--arc-receipt-font)!important;
  font-variant-numeric:tabular-nums slashed-zero;
  font-feature-settings:"tnum" 1,"zero" 1;
}

/* Preserve strong display hierarchy while tightening it visually. */
body .modal-title,
body .page-title,
body .card-title,
body .empty-title,
body .hero-title,
body .section-title,
body .brand-name,
body h1,
body h2,
body h3,
body h4,
body h5,
body h6{
  font-family:var(--font-b,'Inter',system-ui,sans-serif)!important;
  letter-spacing:-.025em;
}

body .modal-sub,
body .empty-sub,
body .form-help,
body .field-help,
body small{
  font-family:var(--arc-receipt-font)!important;
  letter-spacing:.005em;
}

body .form-label,
body label.arc-floating-label,
body th,
body .sidebar-section-label{
  font-family:var(--arc-receipt-font)!important;
  font-size:10px!important;
  font-weight:600!important;
  letter-spacing:.10em!important;
  text-transform:uppercase!important;
}

body .form-input,
body .form-select,
body .form-textarea,
body .search-input,
body .filter-select,
body .arc-floating-field input,
body .arc-floating-field select,
body .arc-floating-field textarea{
  font-family:var(--arc-receipt-font)!important;
  font-variant-numeric:tabular-nums slashed-zero;
  font-feature-settings:"tnum" 1,"zero" 1;
  letter-spacing:.01em;
}

/* Unboxed text + SVG actions. The accent is the hierarchy, not a rectangle. */
.btn,
a.btn,
button.btn,
input[type="submit"],
input[type="button"],
input[type="reset"],
.arc-action-btn,
.nav-actions .btn,
.nav-actions a.btn,
.nav-actions button,
.arc-mobile-menu-cta{
  position:relative!important;
  isolation:isolate;
  overflow:visible!important;
  min-height:34px;
  padding:6px 2px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  text-shadow:none!important;
  filter:none!important;
  color:var(--arc-action-muted)!important;
  font-family:var(--arc-receipt-font)!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.035em;
  line-height:1.2;
  gap:7px!important;
  transition:color .18s ease,transform .18s ease,opacity .18s ease!important;
}

.btn::after,
a.btn::after,
button.btn::after,
.arc-action-btn::after,
.arc-mobile-menu-cta::after{
  content:"";
  position:absolute;
  left:2px;
  right:2px;
  bottom:2px;
  height:1px;
  background:currentColor;
  opacity:.38;
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .2s ease,opacity .2s ease;
  pointer-events:none;
}

.btn:hover,
a.btn:hover,
button.btn:hover,
.arc-action-btn:hover,
.nav-actions .btn:hover,
.nav-actions a.btn:hover,
.nav-actions button:hover,
.arc-mobile-menu-cta:hover{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--arc-action-strong)!important;
  transform:translateY(-1px)!important;
}

.btn:hover::after,
a.btn:hover::after,
button.btn:hover::after,
.arc-action-btn:hover::after,
.arc-mobile-menu-cta:hover::after{
  transform:scaleX(1);
  opacity:.65;
}

.btn-primary,
a.btn-primary,
button.btn-primary,
.cta-primary,
.hero-cta,
.arc-mobile-menu-cta,
input[type="submit"]{
  color:var(--arc-action-accent)!important;
  background:transparent!important;
  border:0!important;
}
.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover,
.cta-primary:hover,
.hero-cta:hover,
.arc-mobile-menu-cta:hover,
input[type="submit"]:hover{
  color:color-mix(in srgb,var(--arc-action-accent) 72%,var(--arc-action-strong))!important;
  background:transparent!important;
  border:0!important;
}

.btn-secondary,
.btn-outline,
.btn-ghost,
a.btn-secondary,
a.btn-outline,
a.btn-ghost,
button.btn-secondary,
button.btn-outline,
button.btn-ghost{
  color:var(--arc-action-muted)!important;
  background:transparent!important;
  border:0!important;
}

.btn-danger,
a.btn-danger,
button.btn-danger,
[data-danger="1"].btn{
  color:var(--arc-action-danger)!important;
  background:transparent!important;
  border:0!important;
}
.btn-danger:hover,
a.btn-danger:hover,
button.btn-danger:hover,
[data-danger="1"].btn:hover{
  color:color-mix(in srgb,var(--arc-action-danger) 72%,var(--arc-action-strong))!important;
}

/* V22.19 action controls used boxed pills/squares. Keep its SVG enhancement,
   but deliberately remove the chrome and preserve readable labels. */
.arc-action-btn{
  min-width:0!important;
  width:auto!important;
  height:auto!important;
  border-radius:0!important;
  padding-inline:2px!important;
}
.arc-action-btn::before{display:none!important}
.arc-action-btn.arc-icon-only{
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  min-height:34px!important;
  padding:6px 2px!important;
  border-radius:0!important;
}
.arc-action-btn.arc-icon-only .arc-action-label{
  position:static!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  clip:auto!important;
  white-space:nowrap!important;
  border:0!important;
}
.arc-action-btn[data-arc-action-icon="share"],
.arc-action-btn.is-complete{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--arc-action-accent)!important;
}
.arc-action-symbol{
  width:17px!important;
  height:17px!important;
  flex:0 0 17px!important;
  transition:transform .18s ease,opacity .18s ease;
}
.arc-action-symbol svg{width:17px!important;height:17px!important}
.btn:hover .arc-action-symbol,
.arc-action-btn:hover .arc-action-symbol{
  transform:translateX(2px);
}
.arc-action-btn[data-arc-action-icon="refresh"]:hover .arc-action-symbol{transform:rotate(180deg)}

/* Close, theme and menu actions should also stop looking like boxed controls. */
.modal-close,
.arc-theme-toggle,
.theme-toggle,
.auth-theme-toggle,
.arc-mobile-menu-button,
.arc-mobile-menu-close{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--text3)!important;
  border-radius:0!important;
  transition:color .18s ease,transform .18s ease!important;
}
.modal-close:hover,
.arc-theme-toggle:hover,
.theme-toggle:hover,
.auth-theme-toggle:hover,
.arc-mobile-menu-button:hover,
.arc-mobile-menu-close:hover{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  color:var(--accent)!important;
  transform:rotate(3deg) scale(1.06);
}

/* Modal form rhythm: more breathing room around floating receipt labels. */
.modal .form-group{margin-bottom:20px}
.modal .form-row-2,.modal .form-row-3{column-gap:24px;row-gap:8px}
.modal .modal-header{margin-bottom:26px}
.modal .modal-footer{
  margin-top:26px!important;
  padding-top:12px!important;
  border-top:1px dashed var(--border2)!important;
  gap:18px!important;
}
.modal .modal-sub{max-width:680px;line-height:1.7}

@media(max-width:640px){
  .btn,a.btn,button.btn,.arc-action-btn{font-size:11px!important}
  .modal .modal-footer{gap:14px!important;flex-wrap:wrap}
}

@media(prefers-reduced-motion:reduce){
  .btn,a.btn,button.btn,.arc-action-btn,.arc-action-symbol,.modal-close{transition:none!important}
  .btn:hover,a.btn:hover,button.btn:hover,.arc-action-btn:hover,.modal-close:hover{transform:none!important}
}

/* =========================================================
   V22.30 Receipt empty states + modal select system
========================================================= */
.arc-receipt-empty{
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:112px;
  text-align:center;
  font-family:var(--arc-receipt-font)!important;
}
.arc-receipt-empty-visual{
  width:58px;
  height:58px;
  display:inline-grid;
  place-items:center;
  position:relative;
  margin:0 auto 5px;
  color:color-mix(in srgb,var(--accent,#00d4a9) 72%,var(--text2));
  opacity:.82;
}
.arc-receipt-empty-visual>svg{width:52px;height:52px;display:block}
.arc-receipt-empty-visual.is-chart{width:72px;height:72px}
.arc-receipt-empty-visual.is-chart>svg{width:64px;height:64px}
.arc-receipt-empty-spark{
  position:absolute;
  right:-1px;
  bottom:4px;
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  background:var(--surface,#fff);
  color:var(--accent,#00d4a9);
  border-radius:50%;
}
.arc-receipt-empty-spark svg{width:17px;height:17px}
.empty-state.arc-receipt-empty .empty-title{font-family:var(--arc-receipt-font)!important;font-weight:700;letter-spacing:.025em}
.empty-state.arc-receipt-empty .empty-sub{max-width:520px;line-height:1.65}
.arc-chart-empty.arc-receipt-empty{min-height:260px!important}

/* Keep the native select in the form for validation/submission, but remove the
   browser-drawn dropdown chrome. The visible trigger opens Arcendium's modal. */
select.arc-select-native{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  border:0!important;
  opacity:.001!important;
  pointer-events:none!important;
}
.arc-select-trigger{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:9px 2px 8px!important;
  border:0!important;
  border-bottom:1px dashed color-mix(in srgb,var(--text3,#64748b) 45%,transparent)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--text,#0f172a)!important;
  font-family:var(--arc-receipt-font)!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.025em;
  text-align:left;
  cursor:pointer;
  transition:color .18s ease,border-color .18s ease,transform .18s ease!important;
}
.arc-select-trigger:hover,.arc-select-trigger:focus-visible{
  color:var(--accent,#00d4a9)!important;
  border-bottom-color:var(--accent,#00d4a9)!important;
  outline:none!important;
  transform:translateY(-1px);
}
.arc-select-trigger.is-placeholder{color:var(--text3,#64748b)!important;font-weight:500!important}
.arc-select-trigger[aria-invalid="true"]{border-bottom-color:var(--red,#ef4444)!important;color:var(--red,#ef4444)!important}
.arc-select-trigger:disabled{opacity:.48;cursor:not-allowed;transform:none!important}
.arc-select-trigger-chevron{width:18px;height:18px;flex:0 0 18px;display:grid;place-items:center;transition:transform .18s ease}
.arc-select-trigger-chevron svg{width:18px;height:18px}
.arc-select-trigger:hover .arc-select-trigger-chevron{transform:translateY(2px)}

.arc-select-modal{
  position:fixed;
  inset:0;
  z-index:16000;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(2,8,16,.58);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.arc-select-modal[hidden]{display:none!important}
html.arc-select-modal-open{overflow:hidden}
.arc-select-dialog{
  width:min(520px,calc(100vw - 32px));
  max-height:min(72vh,650px);
  display:flex;
  flex-direction:column;
  position:relative;
  padding:22px 24px 20px;
  overflow:hidden;
  background:var(--surface,#fff);
  color:var(--text,#0f172a);
  border:1px solid color-mix(in srgb,var(--border,#dbe4ee) 85%,transparent);
  box-shadow:0 28px 80px rgba(2,8,16,.28);
}
.arc-select-dialog::before,.arc-select-dialog::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:8px;
  pointer-events:none;
  background:repeating-linear-gradient(135deg,transparent 0 6px,var(--surface,#fff) 6px 12px);
}
.arc-select-dialog::before{top:-4px;transform:rotate(180deg)}
.arc-select-dialog::after{bottom:-4px}
.arc-select-receipt-top{position:absolute;right:23px;top:18px;width:38px;height:38px;color:var(--accent,#00d4a9);opacity:.14;pointer-events:none}
.arc-select-receipt-top svg{width:38px;height:38px}
.arc-select-dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding-bottom:14px;border-bottom:1px dashed var(--border2,var(--border,#dbe4ee))}
.arc-select-dialog-head>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.arc-select-kicker{font:600 10px/1 var(--arc-receipt-font)!important;letter-spacing:.13em;color:var(--accent,#00d4a9)}
.arc-select-dialog-head strong{font:700 17px/1.35 var(--arc-receipt-font)!important;letter-spacing:.015em;padding-right:42px}
.arc-select-close{width:30px;height:30px;display:grid;place-items:center;padding:0!important;border:0!important;background:transparent!important;color:var(--text3,#64748b)!important;cursor:pointer}
.arc-select-close:hover{color:var(--accent,#00d4a9)!important;transform:rotate(4deg)}
.arc-select-close svg{width:18px;height:18px}
.arc-select-search-wrap{padding:13px 0 5px}
.arc-select-search-wrap input{width:100%;padding:10px 2px!important;border:0!important;border-bottom:1px dashed var(--border2,var(--border,#dbe4ee))!important;border-radius:0!important;background:transparent!important;font-family:var(--arc-receipt-font)!important;color:var(--text)!important;outline:none!important}
.arc-select-search-wrap input:focus{border-bottom-color:var(--accent,#00d4a9)!important}
.arc-select-options{overflow:auto;padding:8px 0 2px;overscroll-behavior:contain}
.arc-select-option{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:9px 3px!important;
  border:0!important;
  border-bottom:1px dashed color-mix(in srgb,var(--border2,var(--border,#dbe4ee)) 75%,transparent)!important;
  background:transparent!important;
  color:var(--text2,#334155)!important;
  font-family:var(--arc-receipt-font)!important;
  text-align:left;
  cursor:pointer;
  transition:color .15s ease,padding-left .15s ease!important;
}
.arc-select-option:hover,.arc-select-option:focus-visible,.arc-select-option.is-selected{color:var(--accent,#00d4a9)!important;padding-left:8px!important;outline:none!important}
.arc-select-option:disabled{opacity:.38;cursor:not-allowed}
.arc-select-option-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.arc-select-option-copy strong{font-size:12px;font-weight:600;line-height:1.35}
.arc-select-option-copy small{font-size:10px;color:var(--text3);line-height:1.3}
.arc-select-option-check{width:19px;height:19px;flex:0 0 19px;display:grid;place-items:center}
.arc-select-option-check svg{width:17px;height:17px}

/* Existing branded MT4/MT5/cTrader chooser is already custom and intentionally
   keeps its platform artwork; never expose its underlying native select. */
.arc-brand-select .arc-brand-native-select{position:absolute!important;opacity:.001!important;pointer-events:none!important;width:1px!important;height:1px!important}

@media(max-width:640px){
  .arc-select-modal{place-items:end center;padding:0}
  .arc-select-dialog{width:100%;max-height:76vh;padding:22px 20px 24px;border-left:0;border-right:0;border-bottom:0}
  .arc-select-dialog-head strong{font-size:15px}
}
.arc-select-option-main{display:flex;align-items:center;gap:11px;min-width:0;flex:1}
.arc-select-option-logo{width:28px;height:28px;object-fit:contain;flex:0 0 28px;background:transparent!important;border:0!important;box-shadow:none!important}


/* ============================================================
   V22.30.1 — Modal layering contract
   Regular Arcendium modal: 300000 (header_fixed.css)
   Nested receipt select:    600000
   Toast notifications:      700000
   ============================================================ */
:root{
  --arc-layer-modal:300000;
  --arc-layer-select:600000;
  --arc-layer-toast:700000;
}

/* Toasts are feedback, not modal content. They must remain crisp and visible
   above every modal/backdrop, including the nested receipt selector. */
#toast-container,
body #toast-container{
  position:fixed!important;
  z-index:var(--arc-layer-toast)!important;
  isolation:isolate!important;
  filter:none!important;
  -webkit-filter:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
#toast-container .toast,
body #toast-container .toast{
  position:relative!important;
  z-index:1!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}

/* The custom select is intentionally a child dialog. It must sit above an
   already-open account/billing/settings modal instead of being hidden behind it. */
.arc-select-modal,
body .arc-select-modal{
  z-index:var(--arc-layer-select)!important;
  isolation:isolate!important;
}
.arc-select-dialog{
  position:relative!important;
  z-index:1!important;
}


/* ============================================================
   V22.36.1 — global per-action wheel + duplicate-click lock
   ============================================================ */
.arc-action-locked{
  cursor:wait!important;
  opacity:.72!important;
  transform:none!important;
  user-select:none;
  -webkit-user-select:none;
}
.arc-action-locked:hover,
.arc-action-locked:focus-visible,
.arc-action-locked:active{
  transform:none!important;
}
button.arc-action-locked::before,
a.arc-action-locked::before,
[role="button"].arc-action-locked::before{
  content:""!important;
  width:12px!important;
  height:12px!important;
  min-width:12px!important;
  display:inline-block!important;
  box-sizing:border-box!important;
  flex:0 0 12px!important;
  margin:0 7px 0 0!important;
  vertical-align:-1px!important;
  border:1.7px solid currentColor!important;
  border-right-color:transparent!important;
  border-radius:50%!important;
  background:transparent!important;
  animation:arc-action-wheel .62s linear infinite!important;
}
@keyframes arc-action-wheel{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){
  button.arc-action-locked::before,
  a.arc-action-locked::before,
  [role="button"].arc-action-locked::before{animation-duration:1.25s!important}
}
