/* 24Ounce account shell layout (moved from templates/account.php) */
/* 24Ounce Account UI - MOBILE FIRST (templates only) */
.tfo-account{
  background:var(--tfo-bg);
  color:var(--tfo-text);
  direction: rtl;
  text-align: right;
  min-height: 70vh;
  overflow-x:hidden;
}

.tfo-account *{ box-sizing:border-box; }
.tfo-account a{ color:inherit; text-decoration:none; }
.tfo-account a:focus, .tfo-account button:focus, .tfo-account input:focus, .tfo-account select:focus, .tfo-account textarea:focus{
  outline:2px solid rgba(187,168,126,.35);
  outline-offset:2px;
}

.tfo-main{
  width:100%;
  padding:16px;
  max-width:1200px;
  margin:0 auto;
  overflow-x:hidden;
}

@media (min-width: 1024px){
  .tfo-account{ display:flex; gap:18px; }
  .tfo-main{ padding:22px; }
}

/* Topbar */
.tfo-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border:1px solid var(--tfo-border);
  border-radius:var(--tfo-radius);
  background:var(--tfo-card);
  box-shadow: var(--tfo-shadow);
  margin-bottom:14px;
}

.tfo-topbar-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
}

@media (max-width: 480px){
  .tfo-topbar{
    flex-wrap:nowrap;
    align-items:center;
  }
  .tfo-topbar-left{
    flex:1 1 auto;
    min-width:0;
  }
  .tfo-topbar-left > div{
    min-width:0;
  }
  .tfo-topbar-right{
    width:auto;
    min-width:0;
    flex-shrink:0;
  }
  .tfo-topbar-right .tfo-wallet-top-action{ width:auto; font-family:"Cairo",sans-serif !important; padding:10px 8px !important; }
  .tfo-notify-btn{
    min-height:42px;
    padding:9px 7px;
    font-size:15px;
  }
}

.tfo-topbar-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width: 0;
}

.tfo-page-title{
  font-weight:800;
  font-size:18px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.tfo-page-sub{
  color:var(--tfo-muted);
  font-size:13px;
  margin-top:2px;
}

.tfo-policy-notices{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin:-2px 0 14px;
}

.tfo-policy-notice{
  border:1px solid var(--tfo-border);
  border-right:4px solid var(--tfo-gold);
  border-radius:14px;
  background:#fffaf0;
  padding:12px 14px;
  box-shadow: var(--tfo-shadow);
}

.tfo-policy-notice.is-critical{
  background:#fff5f5;
  border-right-color:#b42318;
}

.tfo-policy-notice.is-warning{
  background:#fffbeb;
  border-right-color:#bba87e;
}

.tfo-policy-notice-title{
  font-weight:800;
  font-size:15px;
  margin-bottom:4px;
}

.tfo-policy-notice-text{
  color:var(--tfo-muted);
  font-size:13px;
  line-height:1.7;
}


/* Mobile toggle */
.tfo-mobile-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid var(--tfo-border);
  background:#fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.04);
  font-size:20px;
  line-height:1;
}

/* Sidebar */
.tfo-sidebar{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  padding:16px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.tfo-sidebar.is-open{
  opacity:1;
  pointer-events:auto;
}

.tfo-sidebar-card{
  width:min(360px, 92vw);
  height:auto;
  max-height:calc(100vh - 32px);
  background:var(--tfo-card);
  border-radius:var(--tfo-radius);
  box-shadow: var(--tfo-shadow);
  border:1px solid var(--tfo-border);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

.tfo-sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px;
  border-bottom:1px solid var(--tfo-border);
}

.tfo-brand{
  display:flex;
  align-items:baseline;
  gap:8px;
}

.tfo-brand-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:12px;
  background:var(--tfo-gold);
  color:#111;
  font-weight:900;
}

.tfo-brand-name{
  font-weight:900;
  letter-spacing:.2px;
}

.tfo-sidebar-close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid var(--tfo-border);
  background:#fff;
  font-size:22px;
  line-height:1;
}

.tfo-nav{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:12px 14px;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}

.tfo-nav-item{
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--tfo-border);
  background:#fff;
  font-weight:700;
}

.tfo-nav-item.is-active{
  border-color: rgba(187,168,126,.65);
  background: rgba(187,168,126,.14);
}

.tfo-sidebar-foot{
  margin-top:auto;
  padding:14px;
  border-top:1px solid var(--tfo-border);
  display:flex;
  flex-direction:column;
  gap:12px;
}

.tfo-user{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px;
  border:1px solid var(--tfo-border);
  border-radius:14px;
  background:#fff;
}

.tfo-user-avatar{
  width:44px;
  height:44px;
  border-radius:14px;
  background:#111;
  color:var(--tfo-gold-2);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
}

.tfo-user-meta{ min-width:0; }
.tfo-user-name{ font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tfo-user-sub{ color:var(--tfo-muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

@media (min-width:1024px){
  .tfo-sidebar{
    position:sticky;
    top:18px;
    inset:auto;
    opacity:1;
    pointer-events:auto;
    background:transparent;
    padding:22px 0 22px 22px;
    height: calc(100vh - 36px);
    display:block;
  }
  .tfo-mobile-toggle, .tfo-sidebar-close{ display:none; }
  .tfo-sidebar-card{ width:320px; }
}

/* Sidebar footer/user block: mobile-friendly */
@media (max-width:520px){
  .tfo-user{
    flex-direction:row;
    align-items:center;
    text-align:right;
  }
  .tfo-user-meta{
    min-width:0;
    flex:1 1 auto;
    text-align:right;
  }
  .tfo-user-sub{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    word-break:break-all;
    font-size:12px;
    line-height:1.4;
  }
}

/* Content */
.tfo-content{ padding:0; }
.tfo-grid{
  display:grid;
  grid-template-columns:1fr;
  gap: var(--tfo-gap);
}

@media (min-width: 900px){
  .tfo-grid{ grid-template-columns: 1fr 1fr; }
}

.tfo-grid.tfo-grid-4{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
@media (min-width:1024px){
  .tfo-grid.tfo-grid-4{ grid-template-columns:repeat(4,1fr); }
}
@media (max-width:560px){
  .tfo-grid.tfo-grid-4 .tfo-stat-card{ padding:12px; }
  .tfo-grid.tfo-grid-4 .tfo-stat-value{ font-size:18px; }
  .tfo-grid.tfo-grid-4 .tfo-stat-value--sm{ font-size:16px; }
  .tfo-grid.tfo-grid-4 .tfo-stat-label{ font-size:11px; line-height:1.35; }
}

.tfo-card{
  border:1px solid var(--tfo-border);
  background:var(--tfo-card);
  border-radius:var(--tfo-radius);
  box-shadow: var(--tfo-shadow);
}

.tfo-card-inner{ padding:14px; }
.tfo-section-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:12px; }
.tfo-title{ margin:0; font-size:16px; font-weight:900; }
.tfo-subtitle{ color:var(--tfo-muted); font-size:13px; margin-top:4px; }

.tfo-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:11px 14px;
  border-radius:14px;
  border:1px solid rgba(17,17,17,.18);
  background:#111;
  color:var(--tfo-gold-2);
  font-weight:900;
  cursor:pointer;
  min-height:44px;
}

.tfo-btn:hover{ filter:brightness(1.05); }
.tfo-btn:disabled{ opacity:.6; cursor:not-allowed; }
.tfo-btn-secondary{
  background:#fff;
  color:#111;
  border-color: var(--tfo-border);
}

.tfo-pill{
  display:inline-flex;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  border:1px solid var(--tfo-border);
  background:#fff;
  font-weight:800;
  font-size:13px;
}

/* Forms */
.tfo-field{ display:flex; flex-direction:column; gap:6px; margin-bottom:12px; }
.tfo-label{ font-weight:800; font-size:13px; }
.tfo-input, .tfo-select, .tfo-textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid var(--tfo-border);
  background:#fff;
  font-size:16px; /* prevent iOS zoom */
}
.tfo-help{ color:var(--tfo-muted); font-size:12px; line-height:1.6; }

/* Tables */
.tfo-table-wrap{ width:100%; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; border-radius:14px; max-width:100%; }
.tfo-table{ width:100%; border-collapse:collapse; min-width:0; table-layout:auto; }
.tfo-table th, .tfo-table td{ padding:12px 10px; border-bottom:1px solid var(--tfo-border); font-size:13px; text-align:right; white-space:normal; word-break:break-word; }
.tfo-table th{ background: rgba(187,168,126,.10); font-weight:900; }

/* Force mobile-friendly tables */
@media (max-width: 700px){
  .tfo-table{ table-layout:fixed; }
  .tfo-table th, .tfo-table td{ font-size:13.5px; padding:10px 8px; }
}

/* Wallet cards */
.tfo-wallet-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (min-width:520px){
  .tfo-wallet-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width:900px){
  .tfo-wallet-grid{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.tfo-wallet-card{ min-width:0; }
.tfo-wallet-card .tfo-card-inner{ padding:12px; }
.tfo-wallet-card .tfo-muted{ font-size:12px; line-height:1.3; }
.tfo-wallet-card .tfo-muted{ word-break:break-word; }
.tfo-wallet-card .tfo-kpi-value{ font-size:18px; }
.tfo-wallet-card .tfo-kpi-unit{ font-size:12px; }

.tfo-wallet-card .wallet-product-image{
  width:52px; height:52px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid var(--tfo-border);
  background:#fff;
  flex:0 0 auto;
}

.tfo-wallet-card .wallet-product-image img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
}

/* Compatibility: legacy trade modal classes */
.tfo-account .twentyfourounce-modal,
.tfo-account .tfo-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.tfo-account .twentyfourounce-modal[style*="display: block"],
.tfo-account .twentyfourounce-modal.is-open,
.tfo-account .tfo-modal[style*="display: block"],
.tfo-account .tfo-modal.is-open{ display:flex; }

.tfo-account .twentyfourounce-modal-backdrop,
.tfo-account .tfo-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
}
.tfo-account .twentyfourounce-modal-card,
.tfo-account .tfo-modal-card{
  position:relative;
  z-index:1;
  width:min(520px, 90vw);
  background:#fff;
  border-radius:18px;
  border:1px solid var(--tfo-border);
  box-shadow: var(--tfo-shadow);
  overflow:hidden;
}
.tfo-account .twentyfourounce-modal-header,
.tfo-account .tfo-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-bottom:1px solid var(--tfo-border);
  background:#fff;
}
.tfo-account .twentyfourounce-modal-body,
.tfo-account .tfo-modal-body{ padding:14px; background:#fff; }
.tfo-account .twentyfourounce-modal-footer,
.tfo-account .tfo-modal-footer{
  padding:14px;
  border-top:1px solid var(--tfo-border);
  background: rgba(0,0,0,.02);
  display:flex;
  gap:10px;
  flex-direction:column;
}
@media (min-width:520px){
  .tfo-account .twentyfourounce-modal-footer,
.tfo-account .tfo-modal-footer{ flex-direction:row; }
  .tfo-account .twentyfourounce-modal-footer .tfo-btn,
  .tfo-account .tfo-modal-footer .tfo-btn{ flex:1; }
}
.tfo-account .twentyfourounce-modal-close,
.tfo-account .tfo-modal-close{
  width:40px; height:40px;
  border-radius:12px;
  border:1px solid var(--tfo-border);
  background:#000000;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}

/* Modal (trade) */
.tfo-modal{
  position:fixed;
  inset:0;
  z-index:10000;
  background:rgba(0,0,0,.55);
  display:none;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.tfo-modal.is-open{ display:flex; }

.tfo-modal-card{
  width:min(520px, 96vw);
  background:#fff;
  border-radius:18px;
  border:1px solid var(--tfo-border);
  box-shadow: var(--tfo-shadow);
  overflow:hidden;
}

.tfo-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-bottom:1px solid var(--tfo-border);
}

.tfo-modal-title{ font-size:16px; font-weight:900; margin:0; }
.tfo-modal-close{
  width:40px; height:40px;
  border-radius:12px;
  border:1px solid var(--tfo-border);
  background:#fff;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}

.tfo-modal-body{ padding:14px; }
.tfo-modal-grid{ display:grid; grid-template-columns: 1fr; gap:12px; }
@media (min-width:520px){ .tfo-modal-grid{ grid-template-columns: 1fr 1fr; } }

.tfo-kv{
  border:1px solid var(--tfo-border);
  border-radius:14px;
  padding:12px;
  background:#fff;
}
.tfo-kv .k{ color:var(--tfo-muted); font-size:12px; margin-bottom:6px; }
.tfo-kv .v{ font-weight:900; font-size:14px; }

.tfo-modal-actions{
  display:flex;
  gap:10px;
  flex-direction:column;
  padding:14px;
  border-top:1px solid var(--tfo-border);
  background: rgba(0,0,0,.02);
}
@media (min-width:520px){
  .tfo-modal-actions{ flex-direction:row; }
  .tfo-modal-actions .tfo-btn{ flex:1; }
}

/* Compatibility: legacy classes used in templates */
.tfo-account .card{
  border:1px solid var(--tfo-border);
  background:var(--tfo-card);
  border-radius:var(--tfo-radius);
  box-shadow: var(--tfo-shadow);
}
.tfo-account .card-inner,
.tfo-account .tfo-panel-body{ padding:14px; }
.tfo-account .card-bordered{ border:1px solid var(--tfo-border); }

.tfo-account .btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  border-radius:14px;
  border:1px solid var(--tfo-border);
  background:#fff;
  color:#111;
  font-weight:900;
  cursor:pointer;
  min-height:44px;
}
.tfo-account .btn.btn-primary{
  background:#111;
  color:var(--tfo-gold-2);
  border-color: rgba(17,17,17,.18);
}
.tfo-account .btn.btn-light{
  background:#fff;
  color:#111;
}
.tfo-account .btn.btn-outline-primary{
  background:#fff;
  color:#111;
  border-color: rgba(187,168,126,.55);
}
.tfo-account .btn.btn-danger{
  background:#111;
  color:#fff;
  border-color:#111;
}

.tfo-account .table-responsive,
.tfo-account .tfo-table-responsive{ width:100%; overflow:auto; }

/* Dashboard stat cards */
.tfo-stat-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
}
@media (min-width:520px){
  .tfo-stat-grid{ grid-template-columns:1fr 1fr; }
}
.tfo-stat-card{
  border:1px solid var(--tfo-border);
  border-radius:var(--tfo-radius);
  background:#fff;
  box-shadow: var(--tfo-shadow);
  padding:14px;
}
.tfo-stat-label{ color:var(--tfo-muted); font-size:12px; margin-bottom:6px; }
.tfo-stat-value{ font-weight:900; font-size:20px; color: #bba87e;}
.tfo-stat-sub{ color:var(--tfo-muted); font-size:12px; margin-top:6px; }
.tfo-stat-card.is-purple,
.tfo-stat-card.is-blue,
.tfo-stat-card.is-orange,
.tfo-stat-card.is-pink{
  background: #fff;
  border-color: rgba(187,168,126,.45);
}

/* Utility */
.tfo-muted{ color:var(--tfo-muted); }
.tfo-no-scroll{ overflow:hidden; }

/* Responsive tables -> cards on small screens */
@media (max-width: 640px){
  .tfo-table-wrap{ overflow: visible; }
  .tfo-table{ display:block; width:100%; border: none;}
  .tfo-table thead{ display:none; }
  .tfo-table tbody{ display:block; }
  .tfo-table tr{ display:block; border:1px solid var(--tfo-border); border-radius:var(--tfo-radius-sm); background:var(--tfo-card); box-shadow: var(--tfo-shadow); margin-bottom:12px; padding:10px 12px; }
  .tfo-table td{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; padding:8px 5px; border:0; }
  /* Mobile cards: label column = 25%, value column = 75% (more room for inputs/numbers) */
  .tfo-table td::before{ content: attr(data-label); color: var(--tfo-muted); font-weight:800; font-size:13px; min-width:25%; flex:0 0 25%; }
  .tfo-table td > *{ max-width:75%; flex:1 1 auto; }
  .tfo-table td{ font-size:14px; }

  /* Quantity cell (input + available qty) */
  .tfo-qty-input{ width:100%; max-width:240px; }
  .tfo-qty-hint{ font-size:13px; line-height:1.35; white-space:normal; word-break:normal; }
  .tfo-row-msg{ font-size:13px; line-height:1.35; }
  .tfo-table td:last-child{ padding-bottom:0; }
  .tfo-table tr + tr{ margin-top:12px; }
  .tfo-table .tfo-col-id{ display:none; }
}
/* Buttons */
.tfo-btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 12px; border-radius:12px; border:1px solid var(--tfo-border);
  background:#fff; color:var(--tfo-text); font-weight:800; cursor:pointer;
  transition: transform .05s ease, box-shadow .15s ease, border-color .15s ease;
}
.tfo-btn:hover{ box-shadow: 0 10px 24px rgba(0,0,0,.08); border-color: rgba(187,168,126,.55); }
.tfo-btn:active{ transform: translateY(1px); }
.tfo-btn-primary{ background: #0b0b0b; color:#fff; border-color:#0b0b0b; }
.tfo-btn-gold{ background: linear-gradient(135deg, var(--tfo-gold), var(--tfo-gold-2)); color:#0b0b0b; border-color: rgba(187,168,126,.35); }
.tfo-btn-danger{ background:#fff; border-color: rgba(220,38,38,.35); color:#b91c1c; }


/* Batch 2F: remaining inline-style cleanup */
.tfo-account-login-shell{max-width:520px;margin:24px auto;}
.tfo-account-register-link{margin-top:12px;}
.tfo-stat-value--sm{font-size:18px;}

/* Account auth shell */
.tfo-account-login-shell{
  max-width:680px;
  margin:32px auto;
  min-height:auto;
  padding:0 14px;
}
.tfo-login-card{
  width:100%;
  background:linear-gradient(180deg, #ffffff 0%, #fffdf7 100%);
  border:1px solid rgba(187,168,126,.28);
  border-radius:24px;
  box-shadow:0 18px 42px rgba(15,23,42,.08);
  overflow:hidden;
}
.tfo-login-head{
  padding:26px 26px 18px;
  border-bottom:1px solid rgba(15,23,42,.06);
  background:linear-gradient(180deg, rgba(187,168,126,.12) 0%, rgba(255,255,255,.2) 100%);
}
.tfo-login-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin-bottom:18px;
}
.tfo-login-logo-image{
  display:block;
  max-width:min(320px, 100%);
  max-height:96px;
  width:auto;
  height:auto;
  object-fit:contain;
}
.tfo-login-brand-mark{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:54px;
  height:54px;
  border-radius:18px;
  background:linear-gradient(135deg, var(--tfo-gold), var(--tfo-gold-2));
  color:#111;
  font-weight:900;
  font-size:24px;
}
.tfo-login-brand-text{
  font-size:22px;
  font-weight:900;
  color:var(--tfo-text);
}
.tfo-login-copy{
  text-align:center;
}
.tfo-login-title{
  margin:0;
  font-size:28px;
  line-height:1.15;
  font-weight:900;
  color:var(--tfo-text);
}
.tfo-login-subtitle{
  margin:10px auto 0;
  max-width:440px;
  color:var(--tfo-muted);
  line-height:1.8;
  font-size:14px;
}
.tfo-login-body{
  padding:24px 26px 26px;
}
.tfo-auth-form,
#tfo-loginform{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.tfo-form-row,
#tfo-loginform > p{
  margin:0;
}
.tfo-auth-form label,
#tfo-loginform label{
  display:block;
  margin-bottom:8px;
  font-size:13px;
  font-weight:800;
  color:var(--tfo-text);
}
.tfo-auth-form input[type="text"],
.tfo-auth-form input[type="email"],
.tfo-auth-form input[type="password"],
.tfo-auth-form input[type="tel"],
.tfo-auth-form select,
#tfo-loginform .input,
#tfo-loginform input[type="text"],
#tfo-loginform input[type="password"]{
  width:100%;
  min-height:50px;
  padding:0 16px;
  border-radius:14px;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  color:var(--tfo-text);
  box-shadow:none;
}
.tfo-auth-form select{
  appearance:none;
  -webkit-appearance:none;
  background-image:linear-gradient(45deg, transparent 50%, rgba(15,23,42,.58) 50%), linear-gradient(135deg, rgba(15,23,42,.58) 50%, transparent 50%);
  background-position:calc(16px) calc(50% - 3px), calc(10px) calc(50% - 3px);
  background-size:6px 6px, 6px 6px;
  background-repeat:no-repeat;
  padding-left:34px;
}
.tfo-auth-form input[type="text"]:focus,
.tfo-auth-form input[type="email"]:focus,
.tfo-auth-form input[type="password"]:focus,
.tfo-auth-form input[type="tel"]:focus,
.tfo-auth-form select:focus,
#tfo-loginform .input:focus,
#tfo-loginform input[type="text"]:focus,
#tfo-loginform input[type="password"]:focus{
  border-color:rgba(187,168,126,.75);
  box-shadow:0 0 0 4px rgba(187,168,126,.14);
  outline:none;
}
.tfo-form-help{
  display:block;
  margin-top:8px;
  color:var(--tfo-muted);
  font-size:12px;
  line-height:1.7;
}
#tfo-loginform .login-remember{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  padding-top:2px;
}
#tfo-loginform .login-remember label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0;
  font-size:13px;
  font-weight:700;
  color:var(--tfo-muted);
}
#tfo-loginform .login-remember input[type="checkbox"]{
  width:16px;
  height:16px;
  margin:0;
}
.tfo-register-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.tfo-auth-actions,
#tfo-loginform .login-submit{
  padding-top:6px;
}
.tfo-auth-submit,
#tfo-loginform #tfo-wp-submit,
.tfo-login-submit-fallback{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:52px;
  padding:0 18px;
  border:none;
  border-radius:14px;
  background:#0b0b0b;
  color:#fff;
  font-size:15px;
  font-weight:900;
  text-decoration:none;
  cursor:pointer;
  transition:transform .08s ease, box-shadow .16s ease, opacity .16s ease;
}
.tfo-auth-submit:hover,
#tfo-loginform #tfo-wp-submit:hover,
.tfo-login-submit-fallback:hover{
  opacity:.96;
  box-shadow:0 14px 30px rgba(15,23,42,.14);
}
.tfo-auth-submit:active,
#tfo-loginform #tfo-wp-submit:active,
.tfo-login-submit-fallback:active{
  transform:translateY(1px);
}
.tfo-login-links{
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(15,23,42,.06);
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:center;
}
.tfo-login-secondary-link{
  color:#0f172a;
  font-weight:800;
}
.tfo-login-secondary-link:hover{
  color:#7c6641;
}
.tfo-account-register-link{
  margin-top:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  color:var(--tfo-muted);
  font-size:14px;
}
.tfo-auth-error,
.tfo-auth-success{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:16px;
  padding:14px 16px;
  border-radius:14px;
  line-height:1.8;
  font-size:13px;
}
.tfo-auth-error{
  border:1px solid rgba(185,28,28,.18);
  background:#fff5f5;
  color:#991b1b;
}
.tfo-auth-success{
  border:1px solid rgba(22,163,74,.18);
  background:#f0fdf4;
  color:#166534;
}
.tfo-login-note{
  margin-top:16px;
  padding:12px 14px;
  border:1px solid rgba(187,168,126,.26);
  border-radius:14px;
  background:rgba(187,168,126,.08);
  color:#6b5a36;
  font-size:13px;
  line-height:1.75;
  text-align:center;
}

@media (max-width: 640px){
  .tfo-account-login-shell{
    margin:18px auto;
    padding:0 10px;
  }
  .tfo-login-head,
  .tfo-login-body{
    padding:20px 18px;
  }
  .tfo-login-title{
    font-size:24px;
  }
  .tfo-login-brand-text{
    font-size:18px;
  }
  .tfo-register-grid{
    grid-template-columns:1fr;
  }
}


/* Buy/Sell buttons color fix */
.tfo-account .tfo-btn-buy,
.tfo-account .tfo-btn-buy:focus,
.tfo-account .tfo-btn-buy:active,
.tfo-trading-shell .tfo-btn-buy,
.tfo-trading-shell .tfo-btn-buy:focus,
.tfo-trading-shell .tfo-btn-buy:active{
  background:#15803d !important;
  border-color:#15803d !important;
  color:#ffffff !important;
}
.tfo-account .tfo-btn-buy:hover,
.tfo-trading-shell .tfo-btn-buy:hover{
  background:#166534 !important;
  border-color:#166534 !important;
  color:#ffffff !important;
}
.tfo-account .tfo-btn-sell,
.tfo-account .tfo-btn-sell:focus,
.tfo-account .tfo-btn-sell:active,
.tfo-trading-shell .tfo-btn-sell,
.tfo-trading-shell .tfo-btn-sell:focus,
.tfo-trading-shell .tfo-btn-sell:active{
  background:#dc2626 !important;
  border-color:#dc2626 !important;
  color:#ffffff !important;
}
.tfo-account .tfo-btn-sell:hover,
.tfo-trading-shell .tfo-btn-sell:hover{
  background:#b91c1c !important;
  border-color:#b91c1c !important;
  color:#ffffff !important;
}


/* === Trade modal mobile 2-column + gold header fix === */
.twentyfourounce-modal-header,
.tfo-modal-header,
.tfo-account .twentyfourounce-modal-header,
.tfo-account .tfo-modal-header{
  background:#cfad36 !important;
  color:#111827 !important;
}
.twentyfourounce-modal-close,
.tfo-modal-close,
.tfo-account .twentyfourounce-modal-close,
.tfo-account .tfo-modal-close{
  background:rgba(255,255,255,.72) !important;
  border:1px solid rgba(17,24,39,.12) !important;
  color:#111827 !important;
}
.twentyfourounce-modal-card,
.tfo-modal-card,
.tfo-account .twentyfourounce-modal-card,
.tfo-account .tfo-modal-card{
  width:min(720px, calc(100vw - 24px)) !important;
  max-height:calc(100dvh - 24px) !important;
}
.twentyfourounce-modal-body,
.tfo-modal-body,
.tfo-account .twentyfourounce-modal-body,
.tfo-account .tfo-modal-body{
  overflow:auto;
}
.tfo-trade-modal-grid,
.tfo-account .tfo-trade-modal-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.tfo-trade-modal-grid > div,
.tfo-account .tfo-trade-modal-grid > div{
  min-width:0;
}
.tfo-trade-modal-input,
.tfo-trade-modal-value,
.tfo-trade-modal-after,
.tfo-account .tfo-trade-modal-input,
.tfo-account .tfo-trade-modal-value,
.tfo-account .tfo-trade-modal-after{
  min-height:58px;
  border-radius:14px;
}
.tfo-trade-modal-after,
.tfo-account .tfo-trade-modal-after{
  display:flex;
  flex-direction:column;
  justify-content:center;
}
@media (max-width:640px){
  .twentyfourounce-modal,
  .tfo-modal,
  .tfo-account .twentyfourounce-modal,
  .tfo-account .tfo-modal{
    padding:12px !important;
    align-items:center !important;
  }
  .twentyfourounce-modal-card,
  .tfo-modal-card,
  .tfo-account .twentyfourounce-modal-card,
  .tfo-account .tfo-modal-card{
    width:calc(100vw - 20px) !important;
    max-width:none !important;
    max-height:calc(100dvh - 20px) !important;
    border-radius:18px !important;
  }
  .twentyfourounce-modal-body,
  .tfo-modal-body,
  .tfo-account .twentyfourounce-modal-body,
  .tfo-account .tfo-modal-body{
    padding:14px !important;
  }
  .tfo-trade-modal-grid,
  .tfo-account .tfo-trade-modal-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .tfo-trade-modal-label,
  .tfo-trade-modal-value-label,
  .tfo-account .tfo-trade-modal-label,
  .tfo-account .tfo-trade-modal-value-label{
    font-size:11px !important;
    line-height:1.35 !important;
  }
  .tfo-trade-modal-input,
  .tfo-trade-modal-value,
  .tfo-trade-modal-after,
  .tfo-account .tfo-trade-modal-input,
  .tfo-account .tfo-trade-modal-value,
  .tfo-account .tfo-trade-modal-after{
    padding:10px !important;
    font-size:14px !important;
  }
  .twentyfourounce-modal-footer,
  .tfo-modal-footer,
  .tfo-account .twentyfourounce-modal-footer,
  .tfo-account .tfo-modal-footer{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
  .twentyfourounce-modal-footer .tfo-btn,
  .tfo-modal-footer .tfo-btn,
  .tfo-account .twentyfourounce-modal-footer .tfo-btn,
  .tfo-account .tfo-modal-footer .tfo-btn{
    width:100% !important;
  }
}

@media (max-width: 767px){
  .tfo-page-title{font-size:15px !important;}
}



/* 24Ounce account shell overrides: desktop under site header, mobile above all */
:root{
  --tfo-site-header-offset: 118px;
}

.tfo-nav a,
.tfo-nav-item{
  padding:5px 12px !important;
}

.tfo-notify-btn{
  font-size:13px !important;
}

.tfo-account .button{
  font-size:13px !important;
}

@media (min-width:1024px){
  .tfo-sidebar{
    height:calc(100vh - var(--tfo-site-header-offset) - 18px) !important;
    z-index:20 !important;
    align-self:start;
  }
}

@media (max-width:1023px){
  .tfo-sidebar{
    position:fixed !important;
    inset:0 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    height:100dvh !important;
    z-index:999999 !important;
  }

  .tfo-sidebar-card{
    max-height:100dvh !important;
  }
}