/* DD Coin Box - live price section [dd_coin_table] (DigiDollar brand).
   A full-bleed "market band": section header with sort chips + search, then a
   responsive grid of coin cards. Each card carries the coin identity, a Toman
   hero price with a 24h change pill and a Tether chip, a reconstructed trend
   sparkline, and a 4-timeframe momentum strip.
   Markup is server-rendered and hydrated live by table.js. */
.dd-ctable{
  --dd-gold:#e0be00;
  --dd-gold-bright:#ffbf2f;
  --dd-gold-deep:#7a6500;
  --dd-grad:linear-gradient(135deg,#fdb837 0%,#ffbf2f 45%,#e0be00 100%);
  --dd-ink:#15151b;
  --dd-ink-soft:#4a4a58;
  --dd-muted:#85858f;
  --dd-line:rgba(20,20,35,0.08);
  --dd-line-strong:rgba(20,20,35,0.13);
  --dd-card:#ffffff;
  --dd-icon-bg:#f6f7fa;
  --dd-chip:rgba(132,132,150,0.11);
  --dd-seg-bg:#f7f8fb;
  --dd-bar-track:rgba(20,20,35,0.09);
  --dd-up-fg:#0a8a5b;
  --dd-up-bar:#16b07c;
  --dd-up-wash:rgba(17,160,111,0.12);
  --dd-down-fg:#d6363c;
  --dd-down-bar:#f0575c;
  --dd-down-wash:rgba(229,72,77,0.11);
  --dd-radius:20px;
  --dd-shadow:0 18px 40px -30px rgba(25,22,50,0.40);
  --dd-shadow-hover:0 28px 56px -28px rgba(25,22,50,0.48);

  /* full-bleed: escape the theme's narrow content column */
  box-sizing:border-box;
  position:relative;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding:clamp(26px,4vw,52px) clamp(14px,4vw,44px) clamp(24px,3.4vw,44px);
  color:var(--dd-ink);
  font-family:inherit;
  background:
    radial-gradient(1100px 430px at 78% -14%,rgba(255,191,47,.20),transparent 62%),
    radial-gradient(820px 380px at 6% 112%,rgba(22,176,124,.07),transparent 60%),
    linear-gradient(180deg,#fffdf5 0%,#fbfbfd 58%,#ffffff 100%);
  border-block:1px solid var(--dd-line);
  overflow:hidden;
}
.dd-ctable *{box-sizing:border-box;}

/* centre inner content within the full-bleed band */
.dd-ctable__bar,
.dd-ctable__grid,
.dd-ctable__foot{max-width:1180px;margin-inline:auto;position:relative;z-index:1;}

/* ---- section header ---------------------------------------------------- */
.dd-ctable__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px 28px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
/* the heading column absorbs the slack; the tools keep their natural width so
   the sort chips and the search field stay on one line */
.dd-ctable__head{flex:1 1 300px;min-width:0;}
.dd-ctable__title{
  margin:0;
  font-size:clamp(1.28rem,2.6vw,1.85rem);
  font-weight:900;
  color:var(--dd-ink);
  letter-spacing:-.015em;
  line-height:1.3;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
/* ---- tools: sort chips + search ---------------------------------------- */
.dd-ctable__tools{
  display:flex;align-items:center;justify-content:flex-end;gap:10px 12px;flex-wrap:wrap;
  flex:0 0 auto;
  margin-inline-start:auto;
}
.dd-ctable__sorts{
  display:inline-flex;align-items:center;gap:3px;
  padding:4px;
  background:var(--dd-card);
  border:1px solid var(--dd-line);
  border-radius:999px;
  box-shadow:0 10px 24px -22px rgba(25,22,50,.6);
}
.dd-ctable__sort{
  appearance:none;-webkit-appearance:none;
  border:0;background:transparent;
  font-family:inherit;font-size:.8rem;font-weight:800;
  color:var(--dd-muted);
  padding:8px 14px;border-radius:999px;
  cursor:pointer;white-space:nowrap;line-height:1;
  transition:color .18s ease,background .18s ease,box-shadow .18s ease;
}
.dd-ctable__sort:hover{color:var(--dd-ink);}
.dd-ctable__sort.is-active{
  color:#1a1400;
  background:var(--dd-grad);
  box-shadow:0 8px 18px -10px rgba(224,190,0,.9);
}

/* search - gold-framed capsule with a magnifier chip */
.dd-ctable__search{
  position:relative;
  display:flex;align-items:center;
  flex:1 1 240px;min-width:200px;max-width:330px;
  direction:rtl;
  border-radius:999px;
  padding:2px;                          /* thickness of the gradient frame */
  background:linear-gradient(115deg,#fdb837 0%,#ffe08a 22%,#e0be00 50%,#ffd76a 74%,#fdb837 100%);
  background-size:240% 240%;
  animation:dd-q-shimmer 7s ease-in-out infinite;
  box-shadow:0 14px 30px -20px rgba(224,190,0,.7),0 5px 14px -12px rgba(25,22,50,.4);
  transition:box-shadow .28s ease,transform .22s ease;
}
@keyframes dd-q-shimmer{
  0%,100%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
}
.dd-ctable__search:hover{box-shadow:0 18px 34px -20px rgba(224,190,0,.85),0 6px 16px -12px rgba(25,22,50,.45);}
.dd-ctable__search:focus-within{
  transform:translateY(-1px);
  box-shadow:0 0 0 4px rgba(224,190,0,.20),0 20px 40px -18px rgba(224,190,0,.8);
}
/* The field is scoped through the wrapper (and the element name) on purpose:
   the parent theme styles every `input[type=search]` with its own height,
   padding, border and a 15px bottom margin, which is more specific than a
   lone class and used to leave the capsule with a fat gold band underneath. */
.dd-ctable__search input.dd-ctable__q{
  display:block;
  width:100%;
  height:auto;
  min-height:0;
  margin:0;
  font-family:inherit;
  font-size:.9rem;
  font-weight:600;
  line-height:1.5;
  letter-spacing:0;
  color:var(--dd-ink);
  direction:rtl;
  text-align:right;
  border:0;
  box-shadow:none;
  background:var(--dd-card);
  border-radius:999px;
  /* top | right(icon chip) | bottom | left(clear/kbd) */
  padding:12px 48px 12px 46px;
  outline:none;
  -webkit-appearance:none;
  appearance:none;
  transition:background .2s ease;
}
.dd-ctable__search input.dd-ctable__q:focus{border:0;box-shadow:none;outline:none;}
.dd-ctable__search input.dd-ctable__q::placeholder{color:var(--dd-muted);font-weight:500;opacity:.95;}
.dd-ctable__search input.dd-ctable__q::-webkit-search-decoration,
.dd-ctable__search input.dd-ctable__q::-webkit-search-cancel-button,
.dd-ctable__search input.dd-ctable__q::-webkit-search-results-button{-webkit-appearance:none;appearance:none;display:none;}

/* leading magnifier (physical right so it never flips) */
.dd-ctable__qicon{
  position:absolute;right:5px;left:auto;top:50%;transform:translateY(-50%);
  width:34px;height:34px;padding:8px;
  color:#fff;
  background:var(--dd-grad);
  border-radius:50%;
  box-shadow:0 7px 14px -8px rgba(224,190,0,.9),inset 0 1px 0 rgba(255,255,255,.4);
  pointer-events:none;z-index:2;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease;
}
.dd-ctable__qicon svg{width:100%;height:100%;display:block;}
.dd-ctable__search:hover .dd-ctable__qicon{transform:translateY(-50%) scale(1.05);}
.dd-ctable__search:focus-within .dd-ctable__qicon{
  transform:translateY(-50%) rotate(-7deg) scale(1.08);
  box-shadow:0 10px 18px -8px rgba(224,190,0,1),inset 0 1px 0 rgba(255,255,255,.5);
}

/* trailing "/" shortcut hint (hidden when focused / filled) */
.dd-ctable__qkbd{
  position:absolute;left:14px;right:auto;top:50%;transform:translateY(-50%);
  display:inline-flex;align-items:center;justify-content:center;
  min-width:21px;height:21px;padding:0 6px;
  font-family:inherit;font-size:.74rem;font-weight:800;line-height:1;
  color:var(--dd-muted);background:var(--dd-chip);
  border:1px solid var(--dd-line);border-radius:7px;
  pointer-events:none;z-index:2;transition:opacity .18s ease;
}
.dd-ctable__search:focus-within .dd-ctable__qkbd,
.dd-ctable__search.is-filled .dd-ctable__qkbd{opacity:0;}

/* trailing clear button (springs in once there's text) */
.dd-ctable__qclear{
  position:absolute;left:11px;right:auto;top:50%;
  transform:translateY(-50%) scale(.6) rotate(-90deg);
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;padding:0;margin:0;
  color:var(--dd-muted);background:var(--dd-chip);
  border:0;border-radius:50%;cursor:pointer;
  opacity:0;visibility:hidden;z-index:3;
  transition:opacity .2s ease,transform .25s cubic-bezier(.34,1.56,.64,1),color .18s ease,background .18s ease;
}
.dd-ctable__qclear svg{width:12px;height:12px;}
.dd-ctable__qclear:hover{color:#fff;background:var(--dd-down-bar);transform:translateY(-50%) scale(1.08) rotate(0);}
.dd-ctable__search.is-filled .dd-ctable__qclear{opacity:1;visibility:visible;transform:translateY(-50%) scale(1) rotate(0);}

/* ---- card grid --------------------------------------------------------- */
.dd-ctable__grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,420px),1fr));
  gap:14px;
  align-items:start;
}

/* ---- the card ---------------------------------------------------------- */
.dd-ctable__row{
  display:grid;
  grid-template-rows:auto auto auto;
  gap:14px;
  position:relative;
  overflow:hidden;
  background:var(--dd-card);
  border:1px solid var(--dd-line);
  border-radius:var(--dd-radius);
  padding:15px 16px 13px;
  box-shadow:var(--dd-shadow);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
/* faint 24h sentiment wash in the leading top corner */
.dd-ctable__row::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
  background:radial-gradient(130% 90% at 100% 0,var(--dd-wash,transparent),transparent 60%);
}
.dd-ctable__row[data-dir="up"]{--dd-wash:var(--dd-up-wash);}
.dd-ctable__row[data-dir="down"]{--dd-wash:var(--dd-down-wash);}
.dd-ctable__row:hover{transform:translateY(-3px);box-shadow:var(--dd-shadow-hover);border-color:rgba(224,190,0,.5);}
.dd-ctable__row>*{position:relative;z-index:2;}

/* ---- identity ---------------------------------------------------------- */
.dd-ctable__id{display:flex;align-items:center;gap:11px;}
.dd-ctable__iconwrap{
  flex:none;width:44px;height:44px;border-radius:50%;
  background:var(--dd-icon-bg);
  display:grid;place-items:center;position:relative;
  box-shadow:inset 0 0 0 1px var(--dd-line);
}
.dd-ctable__iconwrap::before{
  content:"";position:absolute;inset:-3px;border-radius:50%;
  border:2px solid var(--dd-ring,transparent);
  transition:border-color .22s ease;
}
.dd-ctable__row[data-dir="up"]{--dd-ring:rgba(22,176,124,.32);}
.dd-ctable__row[data-dir="down"]{--dd-ring:rgba(240,87,92,.32);}
.dd-ctable__icon{
  width:28px !important;height:28px !important;
  max-width:28px !important;min-width:28px !important;
  object-fit:contain;display:block;
  margin:0 !important;padding:0 !important;border:0 !important;
  background:transparent !important;box-shadow:none !important;border-radius:0 !important;
  transition:transform .22s ease;
}
.dd-ctable__row:hover .dd-ctable__icon{transform:scale(1.1);}
.dd-ctable__icon--fallback{
  width:30px !important;height:30px !important;border-radius:50% !important;
  display:flex;align-items:center;justify-content:center;
  font-size:.58rem;font-weight:900;color:#1a1400;letter-spacing:-.03em;
  background:var(--dd-grad) !important;
}
.dd-ctable__names{display:flex;flex-direction:column;gap:3px;min-width:0;margin-inline-end:auto;}
.dd-ctable__fa{font-size:1.06rem;font-weight:800;color:var(--dd-ink);line-height:1.2;}
.dd-ctable__en{
  display:inline-flex;align-items:center;gap:7px;
  font-size:.72rem;font-weight:600;color:var(--dd-muted);
  direction:ltr;white-space:nowrap;
}
.dd-ctable__sym{
  font-style:normal;font-weight:800;color:var(--dd-ink-soft);
  padding:2px 6px;border-radius:5px;background:var(--dd-chip);letter-spacing:.02em;
}
.dd-ctable__rank{
  flex:none;align-self:flex-start;
  font-size:.7rem;font-weight:800;color:var(--dd-muted);
  background:var(--dd-chip);
  padding:4px 9px;border-radius:999px;direction:ltr;line-height:1;
}
.dd-ctable__rank.is-top{
  color:var(--dd-gold-deep);
  background:rgba(224,190,0,.16);
  box-shadow:inset 0 0 0 1px rgba(224,190,0,.3);
}

/* ---- price + trend ----------------------------------------------------- */
.dd-ctable__main{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
}
.dd-ctable__price{display:flex;flex-direction:column;gap:9px;min-width:0;}
.dd-ctable__toman{display:flex;align-items:baseline;gap:6px;min-width:0;}
.dd-ctable__toman b{
  font-weight:900;font-variant-numeric:tabular-nums;letter-spacing:-.015em;
  font-size:clamp(1.2rem,2.9vw,1.6rem);line-height:1.05;color:var(--dd-ink);
  white-space:nowrap;
  border-radius:6px;
  transition:color .25s ease,background .25s ease,box-shadow .25s ease;
}
.dd-ctable__toman b.is-flash-up{color:var(--dd-up-fg);background:var(--dd-up-wash);box-shadow:0 0 0 4px var(--dd-up-wash);}
.dd-ctable__toman b.is-flash-down{color:var(--dd-down-fg);background:var(--dd-down-wash);box-shadow:0 0 0 4px var(--dd-down-wash);}
.dd-ctable__u{font-style:normal;font-size:.7rem;font-weight:700;color:var(--dd-muted);flex:none;}
.dd-ctable__meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.dd-ctable__meta>[data-dd-tfield="d1"]{display:inline-flex;}

/* 24h hero pill */
.ddt-chg{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 10px;border-radius:9px;line-height:1;
  background:var(--dd-chip);color:var(--dd-muted);
}
.ddt-chg b{font-size:.83rem;font-weight:900;direction:ltr;font-variant-numeric:tabular-nums;white-space:nowrap;}
.ddt-chg i{font-style:normal;font-size:.66rem;font-weight:700;opacity:.75;white-space:nowrap;}
.ddt-chg.is-up{background:var(--dd-up-wash);color:var(--dd-up-fg);}
.ddt-chg.is-down{background:var(--dd-down-wash);color:var(--dd-down-fg);}

.dd-ctable__usdt{
  display:inline-flex;align-items:center;gap:6px;flex:none;
  font-size:.78rem;font-weight:800;color:var(--dd-ink-soft);
  font-variant-numeric:tabular-nums;
  background:var(--dd-chip);padding:5px 10px;border-radius:9px;direction:ltr;line-height:1;
}
.dd-ctable__ulab{font-style:normal;font-weight:700;font-size:.68rem;color:var(--dd-muted);}

/* reconstructed 1y trend sparkline */
.dd-ctable__trend{
  flex:0 1 168px;width:168px;max-width:44%;
  color:var(--dd-muted);
  display:flex;align-items:center;
}
.dd-ctable__trend[data-trend="up"]{color:var(--dd-up-bar);}
.dd-ctable__trend[data-trend="down"]{color:var(--dd-down-bar);}
.dd-ctable__trend:empty{display:none;}
.ddt-spark{position:relative;display:block;width:100%;}
.ddt-spark__svg{display:block;width:100%;height:46px;overflow:visible;}
.ddt-spark__end{
  position:absolute;right:0;top:var(--e,50%);
  width:7px;height:7px;border-radius:50%;
  background:currentColor;
  transform:translate(45%,-50%);
  box-shadow:0 0 0 3px var(--dd-card),0 0 10px 1px currentColor;
}

/* ---- momentum strip ---------------------------------------------------- */
.dd-ctable__mom{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:var(--dd-seg-bg);
  border:1px solid var(--dd-line);
  border-radius:14px;
  padding:6px 4px;
  align-self:end;
}
.ddt-seg{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:7px 4px 6px;position:relative;min-width:0;
}
.ddt-seg + .ddt-seg::before{
  content:"";position:absolute;inset-inline-start:0;top:18%;bottom:18%;
  width:1px;background:var(--dd-line);
}
.ddt-seg__k{font-size:.63rem;font-weight:700;color:var(--dd-muted);white-space:nowrap;line-height:1;}
.ddt-seg__val{display:flex;justify-content:center;width:100%;min-width:0;}

.ddt-pct{display:flex;flex-direction:column;align-items:center;gap:5px;width:100%;min-width:0;}
.ddt-pct__n{
  font-size:.78rem;font-weight:800;direction:ltr;
  font-variant-numeric:tabular-nums;white-space:nowrap;line-height:1;
}
.ddt-pct__bar{
  position:relative;width:76%;height:3px;border-radius:99px;
  background:var(--dd-bar-track);overflow:hidden;
}
.ddt-pct__bar::before{
  content:"";position:absolute;inset-block:0;inset-inline-start:0;
  width:calc(var(--m,0) * 100%);border-radius:99px;
  background:var(--dd-bar-fill,var(--dd-muted));
  transition:width .3s ease;
}
.ddt-pct.is-up{--dd-bar-fill:var(--dd-up-bar);}
.ddt-pct.is-up .ddt-pct__n{color:var(--dd-up-fg);}
.ddt-pct.is-down{--dd-bar-fill:var(--dd-down-bar);}
.ddt-pct.is-down .ddt-pct__n{color:var(--dd-down-fg);}
.ddt-pct.is-flat .ddt-pct__n,
.ddt-pct--na .ddt-pct__n{color:var(--dd-muted);font-weight:700;}

/* ---- empty ------------------------------------------------------------- */
.dd-ctable__empty{
  grid-column:1 / -1;
  padding:46px 16px;text-align:center;font-size:.95rem;font-weight:700;color:var(--dd-muted);
}

/* ---- footer + pager ---------------------------------------------------- */
.dd-ctable__foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:22px;}
.dd-ctable__pager{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;}
.dd-ctable__pg{
  min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  padding:0 12px;border:1px solid var(--dd-line);background:var(--dd-card);color:var(--dd-ink);
  border-radius:12px;font-family:inherit;font-size:.86rem;font-weight:800;cursor:pointer;
  box-shadow:0 6px 16px -14px rgba(25,22,50,.5);transition:all .16s ease;
}
.dd-ctable__pg:hover:not(:disabled){border-color:var(--dd-gold);transform:translateY(-1px);}
.dd-ctable__pg.is-active{background:var(--dd-grad);border-color:transparent;color:#1a1400;box-shadow:0 10px 20px -10px rgba(224,190,0,.85);}
.dd-ctable__pg:disabled{opacity:.4;cursor:default;}
.dd-ctable__pg--gap{border:0;background:transparent;cursor:default;min-width:18px;padding:0;color:var(--dd-muted);box-shadow:none;}
.dd-ctable__note{
  margin:0;max-width:74ch;text-align:center;
  font-size:.76rem;font-weight:500;line-height:1.9;color:var(--dd-muted);
}

/* ---- dark mode (Dracula) ----------------------------------------------- */
html[data-dracula-scheme="dark"] .dd-ctable{
  --dd-ink:#f2f2f4;
  --dd-ink-soft:#c9c9d4;
  --dd-muted:#9a9aa6;
  --dd-line:rgba(255,255,255,0.09);
  --dd-line-strong:rgba(255,255,255,0.16);
  --dd-card:#1c1c24;
  --dd-icon-bg:rgba(255,255,255,0.06);
  --dd-chip:rgba(255,255,255,0.08);
  --dd-seg-bg:rgba(255,255,255,0.035);
  --dd-bar-track:rgba(255,255,255,0.13);
  --dd-up-fg:#34d399;
  --dd-down-fg:#f87171;
  --dd-shadow:0 18px 40px -30px rgba(0,0,0,0.75);
  --dd-shadow-hover:0 28px 56px -28px rgba(0,0,0,0.8);
  background:
    radial-gradient(1100px 430px at 78% -14%,rgba(224,190,0,.13),transparent 62%),
    radial-gradient(820px 380px at 6% 112%,rgba(22,176,124,.07),transparent 60%),
    linear-gradient(180deg,#15151c 0%,#121218 60%,#0f0f14 100%);
}
html[data-dracula-scheme="dark"] .dd-ctable__rank.is-top{color:var(--dd-gold-bright);}
/* dark: soften the capsule's gold glow so it doesn't bloom on a black page */
html[data-dracula-scheme="dark"] .dd-ctable__search{
  box-shadow:0 14px 30px -20px rgba(224,190,0,.45),0 5px 14px -12px rgba(0,0,0,.6);
}
html[data-dracula-scheme="dark"] .dd-ctable__search:focus-within{
  box-shadow:0 0 0 4px rgba(224,190,0,.18),0 20px 40px -18px rgba(224,190,0,.55);
}

/* ---- tablet / narrow desktop: single column of full-width cards -------- */
@media (max-width:900px){
  .dd-ctable__grid{grid-template-columns:1fr;}
  .dd-ctable__bar{align-items:flex-start;}
  .dd-ctable__tools{margin-inline-start:0;flex:1 1 100%;justify-content:flex-start;}
  .dd-ctable__search{max-width:none;}
}

/* ---- phones: tighten + momentum wraps ---------------------------------- */
@media (max-width:560px){
  .dd-ctable{padding:22px 12px 20px;}
  .dd-ctable__head{min-width:100%;}
  .dd-ctable__sorts{width:100%;justify-content:space-between;}
  .dd-ctable__sort{flex:1;padding:9px 6px;font-size:.76rem;text-align:center;}
  .dd-ctable__qkbd{display:none;}
  .dd-ctable__q{padding-left:42px;}

  .dd-ctable__row{padding:14px 13px 12px;border-radius:18px;gap:12px;}
  .dd-ctable__fa{font-size:1rem;}
  .dd-ctable__trend{flex:0 1 128px;width:128px;}
  .ddt-spark__svg{height:40px;}

  .dd-ctable__mom{grid-template-columns:repeat(2,1fr);gap:6px;padding:0;background:transparent;border:0;}
  .ddt-seg{background:var(--dd-seg-bg);border:1px solid var(--dd-line);border-radius:12px;padding:9px 4px 8px;}
  .ddt-seg + .ddt-seg::before{display:none;}
}

/* keep the Toman number readable on the smallest phones */
@media (max-width:380px){
  .dd-ctable__main{flex-direction:column;align-items:stretch;gap:10px;}
  .dd-ctable__trend{flex:none;width:100%;max-width:none;}
}

/* ---- motion preference ------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .dd-ctable *,
  .dd-ctable *::before,
  .dd-ctable *::after{transition:none !important;animation:none !important;}
}