/* =============================================================================
   FORRE.NU — SNACKA (rummet), themes/forre_pulse/css/pulse-snacka.css
   -----------------------------------------------------------------------------
   BYGGD 2026-09-12. Ruttgatad på `wall` i app/Helpers/PulseAssets.php.
   Rollback = ta bort raden i PulseAssets + radera den här filen. Ingenting i
   forre_pulse.css är rört (den är 217 KB och har trunkerats i synken en gång —
   rollback måste kunna vara en radering).

   ── STEG 0 / PRE-FLIGHT (.clinerules/02-ui-facit.md) ─────────────────────────
   1. YTA     ?page=wall — rummet "Snacka". Tre kolumner: kopplingar · vad folk
              säger · vad som händer runt samtalet.
   2. TEMA    PULSE.
   3. CSS     DEN HÄR FILEN. Prefix `snk-`.
   4. TOKENS  --card --inset --zebra --line --line2 --ink --ink2 --dim --faint
              --accent --accent-ink --accent-wash --live --live-wash --gold
              --r --r-sm --shadow. Noll hårdkodad hex.
   5. FANNS   .shell.c3 · .rail.left/.right · .center · .card/.pad · .chd +
              .slabel + .chd-ic · .composer + .fake + .avatar-ph · .fon (rad med
              avatar, namn, status och live-prick) · .btn.g/.sm · .nlink · .cqa
              · .fnx-am-* (auto-remsan) · .pempty. NYTT här: bara filterraden,
              "Sänder nu"-kortets radvariant och railens täthetsöverskrivning.

   ── §0.5 ─────────────────────────────────────────────────────────────────────
   Noll lodräta färglinjer. Ingen border-left/right som färgstrimma, inget
   box-shadow:inset Npx 0 0. Där en yta ska bära en roll tonas HELA ytan
   (ljust 4 %, mörkt 8 %) och avgränsningen är en vågrät hårlinje.

   ── §4 RADIUS ────────────────────────────────────────────────────────────────
   var(--r) på ytor, var(--r-sm) på etiketter, 50% på runt, 999px på piller.
   ============================================================================= */

/* ── FILTERRADEN ──────────────────────────────────────────────────────────────
   Scopen (allt/vänner) fanns redan i koden — WidgetDataEngine har filtrerat på
   `hub_feed` sedan 2026-07-10 utan att någon UI någonsin satte parametern. Det
   här är alltså inte en ny funktion, det är knappen till en som redan finns.

   Raden är INTE ett kort. Den ligger i .center:s gap, ovanför composern, och
   bär sin egen underlinje så att den läser som en flik-rad och inte som en
   låda till. Höjden är 32 px: samma ordning som .btn.sm, men lägre än ett
   .card-huvud så att ögat inte tar den för ett innehållskort. */
.snk-f{display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  padding:0 2px 10px;border-bottom:1px solid var(--line)}
.snk-f .snk-fb{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;
  border:1px solid var(--line2);border-radius:999px;background:transparent;
  font-family:'Roboto',system-ui,sans-serif;font-size:12.5px;font-weight:700;
  color:var(--ink2);white-space:nowrap;transition:border-color .12s,color .12s,background .12s}
.snk-f .snk-fb i{font-size:12px;line-height:1}
.snk-f .snk-fb:hover{border-color:var(--accent);color:var(--accent-ink)}
/* PÅ-läget tonar HELA pillret (§0.5) — ingen kant i accentfärg som strimma. */
.snk-f .snk-fb.on{background:var(--accent-wash);border-color:transparent;color:var(--accent-ink)}
.snk-f .snk-fn{margin-left:auto;font-size:11.5px;color:var(--ink2);
  font-variant-numeric:tabular-nums;white-space:nowrap}

/* ── TOMT LÄGE ────────────────────────────────────────────────────────────────
   Skiljer på "väggen är tom" och "ditt filter är tomt". Den andra är inte ett
   tomt hus, den är ett för hårt filter — och då är rätt handling att lätta på
   filtret, inte att skriva ett inlägg. */
.snk-tom{display:flex;flex-direction:column;align-items:center;gap:9px;
  padding:34px 22px;text-align:center}
.snk-tom>i{font-size:24px;color:var(--faint);line-height:1}
.snk-tom b{font-size:14.5px;font-weight:700;color:var(--ink)}
.snk-tom span{font-size:13.5px;color:var(--dim);max-width:34ch;line-height:1.5}

/* ── SÄNDER NU (högerrail, kort 1) ────────────────────────────────────────────
   EN FRÅGA: VILKA. Antalet står i skalets ropar-rad ("3 sänder nu") och bara
   där — kortet räknar aldrig om samma tal. Bilden och titeln är Hems biograf
   (pulse-hub-creators.php); här är det ansikten och ett namn man känner igen.
   Raden ÄR .fon, oförändrad. Det enda som läggs till är plattformsorden och
   Titta-länken längst till höger. */
.snk-live .fon{padding:7px 13px}
.snk-live .fon:hover{background:var(--zebra)}
.snk-live .snk-w{min-width:0;flex:1}
.snk-live .fon .nm{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.snk-live .fon .st{font-size:11px;color:var(--dim)}
.snk-live .snk-go{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;
  height:24px;padding:0 9px;border-radius:var(--r-sm);background:var(--inset);
  font-size:11.5px;font-weight:700;color:var(--accent-ink);white-space:nowrap}
.snk-live .snk-go:hover{background:var(--accent-wash)}
.snk-live .snk-tt{display:block;margin-top:1px;font-size:11px;color:var(--dim);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── HÄNT I HUSET (högerrail, kort 2) ─────────────────────────────────────────
   Raderna är auto-remsans egna (HubDigestService + pulse-autorad.php) — samma
   sanning som Hem använder, ingen andra beskrivning av samma händelse. Det
   enda railen ändrar är TÄTHETEN: marginalkolumnen är satt för en 1fr-mitt och
   äter 76 px av 292. Den är en custom property just för det här. */
.snk-hant .fnx-am{--am-mar:40px}
.snk-hant .fnx-am-dag{padding:8px 13px 2px}
.snk-hant .fnx-am-row{padding:0 13px;gap:8px}
.snk-hant .fnx-am-tx{font-size:12px}
.snk-hant .fnx-am-add{display:none}   /* "+ svara" kräver bredd railen inte har */
.snk-hant .fnx-am-tr{padding:3px 13px 9px}

/* ── RÄKNAD AA I RAILEN (2026-09-12) ──────────────────────────────────────────
   Tre rader i återanvänd CSS hamnar under 4,5:1 när de står här. Alla tre är
   RÄKNADE, inte gissade, och rättade BARA i den här scopen — de delade filerna
   (forre-ui.css, forre_pulse.css) är orörda, så Hem ser ut som Hem.

     .fnx-am-dag .d   --faint  9,5px/800   ljust 3,63:1 · mörkt 2,68:1  → --dim
     .fnx-am-tal      --gold  12px/800     ljust 4,40:1 (mörkt 8,3:1 OK)
                      → guldet mörkas 24 % i LJUST läge, rollen behålls
     .fake .ph-txt    --dim   14px         ljust 4,26:1 → --ink2

   De två första gäller även Hem i dag (samma remsa, samma tokens). Den tredje
   gäller composern på Hem OCH profilväggen. Rättelsen där är en rad i
   forre_pulse.css — den ligger inte här, för den filen rör jag inte utan
   backup + ett ja. */
.snk-hant .fnx-am-dag .d{color:var(--dim)}
.snk-hant .fnx-am-tal{color:color-mix(in srgb,var(--gold) 74%,#000)}
html[data-theme="dark"] .snk-hant .fnx-am-tal{color:var(--gold)}
.snk .composer .fake .ph-txt{color:var(--ink2)}

/* ── MOBIL (≤820) ─────────────────────────────────────────────────────────────
   Railen går full bredd (forre_pulse.css @820). Filterraden får skrolla i
   stället för att radbrytas till två rader ovanför composern. */
@media (max-width:820px){
  .snk-f{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:9px}
  .snk-f::-webkit-scrollbar{display:none}
  .snk-f .snk-fn{display:none}        /* antalet står redan i tomläget/flödet */
  .snk-live .snk-tt{display:none}
}
