/* ForexR /feeds: the feed directory. Plain CSS, loaded only by feeds.php after app.css,
   whose tokens it reuses. Card look follows .ea-card / .learn-card. */
.feeds-note{display:flex;gap:14px;align-items:flex-start;margin:0 0 30px;padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--brand);border-radius:12px;color:var(--muted);font-size:.94rem}
.feeds-note strong{color:var(--ink)}
.feeds-note svg{flex:0 0 auto;color:var(--brand-strong);margin-top:2px}

.feeds-sec{margin:0 0 36px}
.feeds-sec>h2{margin:0 0 4px;font-size:1.15rem}
.feeds-sub{margin:0 0 16px;color:var(--muted);font-size:.92rem}

.feed-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.feed-card{display:grid;gap:10px;align-content:start;padding:18px;background:var(--surface);border:1px solid var(--line);border-radius:14px}
.feed-card h3{display:flex;align-items:center;gap:9px;margin:0;font-size:1.02rem}
.feed-card h3 svg{flex:0 0 auto;color:var(--brand-strong)}
.feed-card p{margin:0;color:var(--muted);font-size:.89rem}

.feed-row{display:flex;gap:8px;align-items:stretch}
.feed-row input{flex:1 1 auto;min-width:0;padding:9px 11px;background:var(--bg);border:1px solid var(--line);border-radius:10px;font-family:var(--fm);font-size:16px;color:var(--ink);outline:0}
.feed-row input:focus{border-color:var(--brand)}
.feed-copy{flex:0 0 auto;padding:9px 13px;background:var(--bg);border:1px solid var(--line);border-radius:10px;font-family:var(--ff);font-size:.82rem;font-weight:700;color:var(--ink);cursor:pointer}
.feed-copy:hover{border-color:var(--brand)}
/* 16px keeps phones from zooming on focus; wider screens can show the whole address. */
@media(min-width:600px){.feed-row input{font-size:.82rem}}
.feed-copy[data-done="1"]{background:var(--brand);border-color:var(--brand);color:var(--brand-on)}

.feed-links{display:flex;flex-wrap:wrap;gap:8px;font-size:.8rem}
.feed-links a{display:inline-flex;align-items:center;min-height:32px;padding:0 13px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-weight:600}
.feed-links a:hover{border-color:var(--brand);color:var(--ink)}

.feeds-how{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.feeds-how>div{padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.feeds-how h3{margin:0 0 6px;font-size:.95rem}
.feeds-how p{margin:0;color:var(--muted);font-size:.88rem}
/* The global * reset strips list indentation, so the steps restate both. */
.feeds-how ol{margin:8px 0 0;padding-left:1.25em;list-style:decimal;color:var(--muted);font-size:.88rem}
.feeds-how ol li{margin:0 0 4px;list-style:decimal}

/* Subscribe chip (fx_feed_chip), shown on the section hubs beside the share bar. */
.feed-sub{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border:1px solid var(--line);border-radius:980px;background:var(--surface);color:var(--muted);font-size:.8rem;font-weight:650;text-decoration:none;white-space:nowrap}
.feed-sub:hover,.feed-sub:focus-visible{border-color:var(--brand);color:var(--ink);outline:0}
.feed-sub svg{flex:none;color:var(--brand-strong)}
.page-lead .feed-sub{margin:14px 12px 0 0}

/* Subscribe capsule: the RSS chip and the push follow button (partials/follow-btn.php) as one
   segmented pill. Loaded after push.css, so these rules win the ties on .fxp-follow. */
.sub-cap{display:inline-flex;align-items:stretch;max-width:100%;margin:14px 0 20px;
  border:1px solid var(--line);border-radius:999px;background:var(--surface);overflow:hidden}
.sub-cap .feed-sub,.sub-cap .fxp-follow{gap:8px;height:38px;margin:0;padding:0 16px;border:0;border-radius:0;
  background:transparent;color:var(--muted);font:650 .8rem/1 var(--ff);transition:background-color .15s,color .15s}
.sub-cap .feed-sub svg,.sub-cap .fxp-follow svg{width:15px;height:15px}
.sub-cap .fxp-follow-wrap{display:flex;margin:0;border-left:1px solid var(--line)}
.sub-cap .fxp-follow-wrap:first-child{border-left:0}
.sub-cap .feed-sub:hover,.sub-cap .feed-sub:focus-visible,.sub-cap .fxp-follow:hover{
  background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}
.sub-cap .fxp-follow.is-on{background:var(--brand-soft);color:var(--ink)}
.sub-cap .fxp-follow.is-on:hover{background:color-mix(in srgb,var(--brand) 22%,transparent)}
.sub-cap .feed-sub:focus-visible,.sub-cap .fxp-follow:focus-visible{outline:2px solid var(--acc);outline-offset:-3px}
/* Phones: the capsule stays one row; the RSS half drops to its icon (the aria-label still names it). */
@media(max-width:430px){
  .sub-cap .feed-sub,.sub-cap .fxp-follow{height:42px}
  .sub-cap .feed-sub{padding:0 14px}
  .sub-cap .feed-sub .fs-l{display:none}
}