/* DigiDollar Blog Features — trust card + stats + share + related
   Brand gold accents, RTL, dark-mode aware. Scoped under .ddbf / .ddbf-rel. */

.ddbf{--g1:#f6b829;--g2:#d99413;--g3:#b88e19;--ink:#2a2540;--mut:#6b7280;
  --card:#fffdf7;--card2:#fff7e6;--line:#f0e2bf;--ok:#1aa251;--like:#f43676;
  margin:18px 0 22px;font-family:inherit}
.ddbf *{box-sizing:border-box}

.ddbf-card{position:relative;border:1px solid var(--line);border-radius:18px;
  background:linear-gradient(180deg,var(--card2),var(--card));
  box-shadow:0 10px 30px -18px rgba(184,142,25,.55);overflow:hidden}
.ddbf-card::before{content:"";position:absolute;inset-block-start:0;inset-inline:0;height:3px;
  background:linear-gradient(90deg,var(--g1),var(--g3),var(--g1))}

/* ---- top: identity + meta chips ---- */
.ddbf-top{display:flex;flex-wrap:wrap;gap:12px 16px;align-items:center;
  justify-content:space-between;padding:14px 16px 12px}
.ddbf-id{display:flex;align-items:center;gap:12px;min-width:0}
.ddbf-av{position:relative;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:46px;height:46px;border-radius:50%;
  background:radial-gradient(circle at 32% 28%,#fff7e6 0%,#ffe6ac 100%);
  box-shadow:0 0 0 2px var(--g1),0 5px 14px rgba(170,125,0,.3)}
/* force size (theme applies img{height:auto!important}); contain+multiply = no white halo, no overflow.
   border/radius/shadow !important: content-image rules (.main-article img, div.text img) otherwise
   paint a gold 2px square frame + 8px radius on the 46px avatar. */
.ddbf-av img{width:100%!important;height:100%!important;max-width:100%;
  border:0!important;border-radius:50%!important;box-shadow:none!important;
  object-fit:contain;padding:6px;margin:0!important;display:block;
  mix-blend-mode:multiply}
/* Theme option "disable date globally" injects time{display:none!important}; our dates must survive it */
.ddbf time{display:inline!important}
.ddbf-seal{position:absolute;inset-block-end:-3px;inset-inline-start:-3px;width:20px;height:20px;
  border-radius:50%;background:var(--ok);color:#fff;display:grid;place-items:center;
  border:2px solid var(--card)}
.ddbf-seal svg{width:12px;height:12px;stroke-width:3}
.ddbf-by{min-width:0;line-height:1.5}
.ddbf-line{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.ddbf-role{font-size:11px;font-weight:700;color:var(--g3);background:#fbeec6;
  padding:1px 8px;border-radius:999px}
.ddbf-role--rev{color:#2563a8;background:#e4eefb}
.ddbf-name{font-weight:800;color:var(--ink);text-decoration:none;font-size:14px}
.ddbf-name:hover{color:var(--g3)}
.ddbf-ok{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;color:var(--ok)}
.ddbf-ok svg{width:13px;height:13px;stroke-width:2.6}

.ddbf-metas{display:flex;flex-wrap:wrap;gap:8px}
.ddbf-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--mut);
  background:#fff;border:1px solid var(--line);padding:5px 10px;border-radius:999px;white-space:nowrap}
.ddbf-chip svg{width:15px;height:15px;color:var(--g3)}
.ddbf-chip b{color:var(--ink);font-weight:800}
.ddbf-chip time{font-variant-numeric:tabular-nums}

/* ---- stats + share strip ---- */
.ddbf-stats{display:flex;flex-wrap:wrap;gap:12px;align-items:center;
  justify-content:space-between;padding:12px 16px;
  border-block-start:1px dashed var(--line);background:rgba(255,250,232,.5)}
.ddbf-counts{display:flex;gap:8px;flex-wrap:wrap}
.ddbf-stat{display:inline-flex;align-items:center;gap:7px;font:inherit;cursor:default;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:7px 12px;
  color:var(--ink);transition:transform .15s,box-shadow .2s,border-color .2s}
.ddbf-stat svg{width:18px;height:18px;color:var(--g3)}
.ddbf-stat .ddbf-num{font-weight:900;font-variant-numeric:tabular-nums;font-size:15px}
.ddbf-stat i{font-style:normal;font-size:12px;color:var(--mut)}
.ddbf-stat--like{cursor:pointer}
.ddbf-stat--like:hover{border-color:var(--like);transform:translateY(-1px);
  box-shadow:0 8px 18px -10px rgba(244,54,118,.7)}
.ddbf-stat--like svg{color:var(--like);fill:none;transition:transform .2s}
.ddbf-stat--like.is-liked{border-color:var(--like);background:#fff0f5}
.ddbf-stat--like.is-liked svg{fill:var(--like);animation:ddbf-pop .35s}
@keyframes ddbf-pop{0%{transform:scale(.7)}55%{transform:scale(1.3)}100%{transform:scale(1)}}

.ddbf-share{display:flex;gap:7px}
.ddbf-sh{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;
  border:1px solid var(--line);background:#fff;color:#fff;cursor:pointer;
  transition:transform .15s,filter .2s;text-decoration:none}
.ddbf-sh:hover{transform:translateY(-2px) scale(1.05);filter:brightness(1.05)}
.ddbf-sh svg{width:18px;height:18px}
.ddbf-sh--tg{background:#28a8e9;border-color:#28a8e9}
.ddbf-sh--wa{background:#25d366;border-color:#25d366}
.ddbf-sh--x{background:#111;border-color:#111}
.ddbf-sh--copy{background:#fff;border-color:var(--line);color:var(--g3)}
.ddbf-sh--copy.is-copied{background:var(--ok);border-color:var(--ok);color:#fff}

/* ---- trust pills ---- */
.ddbf-trust{display:flex;flex-wrap:wrap;gap:8px;padding:12px 16px 14px;
  border-block-start:1px solid var(--line)}
.ddbf-pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;
  padding:6px 12px;border-radius:999px;text-decoration:none}
.ddbf-pill svg{width:16px;height:16px}
.ddbf-pill--lic{color:var(--g3);background:linear-gradient(135deg,#fff3d1,#ffe8b0);
  border:1px solid #f0d385}
.ddbf-pill--lic:hover{filter:brightness(.98)}
.ddbf-pill--pub{color:var(--mut);background:#fff;border:1px solid var(--line)}
.ddbf-pill--pub time{font-variant-numeric:tabular-nums}

/* ---- related posts ---- */
.ddbf-rel{margin:34px 0 8px}
.ddbf-rel__h{font-size:20px;font-weight:900;color:var(--ink,#2a2540);margin:0 0 14px;
  padding-inline-start:12px;position:relative}
.ddbf-rel__h::before{content:"";position:absolute;inset-inline-start:0;inset-block:4px auto;
  width:5px;height:20px;border-radius:3px;background:linear-gradient(180deg,#f6b829,#b88e19)}
.ddbf-rel__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ddbf-rel__card{display:flex;flex-direction:column;border:1px solid #eee3c4;border-radius:14px;
  overflow:hidden;background:#fff;text-decoration:none;
  transition:transform .18s,box-shadow .22s,border-color .2s}
.ddbf-rel__card:hover{transform:translateY(-3px);border-color:#e7c873;
  box-shadow:0 16px 30px -18px rgba(184,142,25,.6)}
.ddbf-rel__thumb{display:block;aspect-ratio:16/9;background:#faf3df;overflow:hidden}
.ddbf-rel__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ddbf-rel__thumb--ph{background:linear-gradient(135deg,#fdf3d6,#f7e6b8)}
.ddbf-rel__body{padding:11px 13px 13px;display:flex;flex-direction:column;gap:7px}
.ddbf-rel__title{font-weight:800;font-size:14.5px;line-height:1.6;color:#2a2540;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ddbf-rel__card:hover .ddbf-rel__title{color:#b88e19}
.ddbf-rel__date{font-size:12px;color:#9aa0ab;font-variant-numeric:tabular-nums}

/* ---- responsive ---- */
@media (max-width:680px){
  .ddbf-top,.ddbf-stats{padding-inline:13px}
  .ddbf-metas{width:100%}
  .ddbf-stats{flex-direction:column;align-items:stretch}
  .ddbf-counts{justify-content:space-between}
  .ddbf-share{justify-content:flex-end}
  .ddbf-rel__grid{grid-template-columns:1fr;gap:11px}
  .ddbf-rel__card{flex-direction:row;align-items:stretch}
  .ddbf-rel__thumb{flex:0 0 38%;aspect-ratio:auto}
  .ddbf-rel__body{flex:1}
}

/* ---- dark mode: follow the site's Dracula toggle ONLY (never the OS) ----
   Default (.ddbf above) stays LIGHT. These rules apply only when the visitor
   actually switches the site into dark mode (html[data-dracula-scheme="dark"]). */
html[data-dracula-scheme="dark"] .ddbf{
  --ink:#eef1f6;--mut:#9aa3b2;--card:#171a21;--card2:#1d2129;--line:#33260e}
html[data-dracula-scheme="dark"] .ddbf-chip,
html[data-dracula-scheme="dark"] .ddbf-stat,
html[data-dracula-scheme="dark"] .ddbf-sh--copy,
html[data-dracula-scheme="dark"] .ddbf-pill--pub{background:#10131a}
html[data-dracula-scheme="dark"] .ddbf-stats{background:rgba(255,250,232,.04)}
html[data-dracula-scheme="dark"] .ddbf-role{background:#3a2f10}
html[data-dracula-scheme="dark"] .ddbf-role--rev{background:#13233a}
html[data-dracula-scheme="dark"] .ddbf-stat--like.is-liked{background:#2a1018}
html[data-dracula-scheme="dark"] .ddbf-rel__card{background:#171a21;border-color:#2a2f3a}
html[data-dracula-scheme="dark"] .ddbf-rel__h,
html[data-dracula-scheme="dark"] .ddbf-rel__title{color:#eef1f6}
