/* =============================================================================
   Sameiginlegar farsíma-reglur fyrir 52hlutir app-síður.
   Fasi 1 (triage): stoppa hrun — pakka saman, fela það sem passar ekki, drepa
   lárétt yfirflæði. Fínni hönnun kemur síðar. Hlaðið á öllum app-síðum.
   ============================================================================= */

/* Burger-hnappur og checkbox eru AÐEINS fyrir farsíma — falin á tölvuskjá. */
.app-burger, .app-burger-cb { display: none; }

/* Ár-fellilistinn (Listi) er AÐEINS fyrir farsíma — á tölvuskjá eru pillurnar. */
.year-select { display: none; }

@media (max-width: 680px) {

  /* ALHEIMS-VÖRN: síðan má ALDREI skruna/dragast til hliðar á síma. `clip` (ekki
     `hidden`) af því clip býr ekki til skrun-gám og brýtur því ekki sticky-hausinn.
     Þetta grípur hvaðeina sem sleppur framhjá síðu-sértæku reglunum. */
  html, body { overflow-x: clip; max-width: 100%; }

  /* ---- App-haus (sameiginlegur á öllum síðum) ------------------------------
     Nav-röðin var of breið og flæddi út fyrir skjáinn. Pökkum saman, felum
     vörumerkjatextann (bara 52-lógóið) og teygju-bilið, minnkum bil. */
  .app-header {
    flex-wrap: wrap !important;
    row-gap: 0 !important;
    column-gap: 12px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  /* teygju-bil (React raðar sem „flex: 1 1 0%"). Getur verið <div> eða <span>. */
  .app-header > [style*="flex: 1"], .app-header > [style*="flex:1"] { display: none !important; }
  .app-brandtext { display: none !important; }

  /* Burger-hnappur (hægra megin) + falin checkbox sem stýrir opnun */
  .app-burger {
    display: flex; align-items: center; justify-content: center;
    margin-left: auto; flex: none;
    width: 44px; height: 40px; border: 1px solid var(--border); border-radius: 10px;
    background: var(--surface); color: var(--text); font-size: 20px; line-height: 1; cursor: pointer; user-select: none;
  }
  .app-burger-cb { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }

  /* Valmyndar-liðir (nav-röð + Mitt svæði/Innskráning) faldir sjálfgefið.
     React raðar inline-stíl með bilum → „gap: 24px". */
  .app-header > div[style*="gap: 24px"], .app-header > div[style*="gap: 22px"],
  .app-header > div[style*="gap: 11px"],
  .app-header > a:not(:first-child) { display: none !important; }

  /* Opnað: stafla liðunum full-breidd undir hausnum. ALLIR liðir vinstri-stilltir
     (inline align-items:center á nav-div slær annars út — þarf !important). */
  .app-burger-cb:checked ~ div[style*="gap: 24px"],
  .app-burger-cb:checked ~ div[style*="gap: 22px"] {
    display: flex !important; flex-direction: column !important;
    align-items: flex-start !important; justify-content: flex-start !important;
    width: 100%; gap: 0 !important; order: 9;
    border-top: 1px solid var(--border); margin-top: 10px; padding-top: 2px;
  }
  .app-burger-cb:checked ~ div[style*="gap: 24px"] > *,
  .app-burger-cb:checked ~ div[style*="gap: 22px"] > * {
    padding: 13px 2px; font-size: 16px; width: 100%; text-align: left; justify-content: flex-start;
  }
  .app-burger-cb:checked ~ a:not(:first-child),
  .app-burger-cb:checked ~ div[style*="gap: 11px"] {
    display: flex !important; width: 100%; order: 10; padding: 13px 2px;
    align-items: center; justify-content: flex-start; gap: 11px; border-top: 1px solid var(--border);
  }

  /* ======================= UPPGÖTVA ======================= */
  /* Öryggisnet: klippa stray lárétt yfirflæði (t.d. hreiður flex-raðir í
     lista-flipanum) svo síðan skruni aldrei til hliðar. Snertir ekki lóðrétt. */
  .page-uppgotvun { overflow-x: clip; }

  /* Flipa-röð: skrunast lárétt í stað þess að flæða út */
  .app-tabs {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    flex-wrap: nowrap;
    scrollbar-width: none;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .app-tabs::-webkit-scrollbar { display: none; }
  /* Þéttari flipar + stytt „Listar og uppgjör" → „Listar" svo allir 4 (þ.á.m.
     Hugmyndabanki) passi án þess að þurfa að skruna. */
  .app-tabs > button { flex: 0 0 auto; white-space: nowrap; padding: 12px 11px !important; font-size: 14px !important; }
  .app-tabs .tab-long { display: none; }
  .app-tabs { gap: 4px !important; }

  /* Minnka stóru inline-paddingin og risafyrirsagnir */
  .page-uppgotvun [style*="padding:44px 32px 28px"] { padding: 26px 16px 18px !important; }
  .page-uppgotvun [style*="padding:100px 32px"] { padding: 60px 20px !important; }
  .disc-body { padding-left: 16px !important; padding-right: 16px !important; }
  .page-uppgotvun h1 { font-size: 32px !important; }

  /* Nýjar viðburða/félaga/admin síður: minnka 32px inline-hliðarpadding á farsíma */
  .page-vidburdir [style*="padding:22px 32px 64px"],
  .page-lidnir [style*="padding:22px 32px 64px"],
  .page-finndu-felaga [style*="padding:22px 32px 64px"],
  .page-vidburdur [style*="padding:22px 24px 80px"],
  .page-felagaleit [style*="padding:22px 32px 70px"] {
    padding-left: 16px !important; padding-right: 16px !important;
  }
  /* Titilstórar fyrirsagnir á þessum síðum minni á farsíma */
  .page-vidburdir h1, .page-lidnir h1, .page-finndu-felaga h1, .page-vidburdur h1, .page-felagaleit h1 { font-size: 30px !important; }

  /* Viðburður: höfundar-röð (avatar + nafn + „Bjóða fylgjendum"/„Breyta"). Á síma
     kremja eigenda-hnapparnir nafnið → leyfa að vefjast, hnappar á eigin línu. */
  .vd-authrow { flex-wrap: wrap; row-gap: 10px; }
  .vd-authrow > div[style*="flex: 1"] { flex: 1 1 55% !important; }
  .vd-authrow > span[onclick], .vd-authrow > span[style*="cursor: pointer"] { flex: 1 1 auto; text-align: center; }
  /* 3-dálka Hvenær/Hvar/Laus-pláss ræman → staflast lóðrétt á farsíma */
  .ff-inforow { flex-direction: column !important; }
  .ff-inforow > div { border-left: none !important; }
  .ff-inforow > div + div { border-top: 1px solid var(--border); }

  /* Kort-ristir → einn dálkur (full-breidd myndakort líta vel út á síma).
     Afmarkað við .disc-body svo hitakorta-ristir (repeat(13/18/26)) haldist.
     DCLogic (React) raðar inline-stíl með bilum („repeat(3, 1fr)") — grípum bæði form. */
  .disc-body [style*="repeat(2, 1fr)"], .disc-body [style*="repeat(2,1fr)"],
  .disc-body [style*="repeat(3, 1fr)"], .disc-body [style*="repeat(3,1fr)"],
  .disc-body [style*="repeat(4, 1fr)"], .disc-body [style*="repeat(4,1fr)"],
  .disc-body [style*="1fr 1.05fr"],
  .disc-body [style*="1.05fr 1fr"],
  .disc-body [style*="1.15fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Flokka-kort: fela undirflokka á síma — bara mynd + titill + „Hugmynd að
     markmiði" + „Sjá meira" (fallegra og einfaldara á litlum skjá). */
  .disc-body .cat-subchips,
  .disc-body .cat-sub { display: none !important; }

  /* Flokka-val í Hugmyndabanka (Uppgötva): var 4 dálkar → titlar klipptir og
     ólæsilegir. Niður í 2 dálka og leyfa texta að brjótast (enginn ellipsis). */
  .ideas-picker { columns: 2 !important; column-gap: 16px !important; }
  .ideas-picker [style*="text-overflow"] {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  /* Hugmynda-röð: titill/reitur kramdist því takkarnir tóku plássið. Stafla:
     titill (eða innsláttarreitur) full-breidd efst, takkar í fulla breidd niður. */
  .idea-row { flex-wrap: wrap; row-gap: 12px; padding: 14px 16px !important; }
  .idea-row > span[style*="width: 7px"] { display: none; }         /* punktur */
  .idea-row > div[style*="flex: 1"],
  .idea-row > input { flex: 1 1 100% !important; }                  /* titill / reitur */
  .idea-row > button { flex: 1 1 auto !important; }                 /* takkar deila línu */

  /* Bento („Vinsælir flokkar"): spanning-rist virkar ekki á síma — gerum hvert
     kort full-breitt með fasta hæð, staflað. Núllstillum span á börnum. */
  .page-uppgotvun .bento {
    grid-template-columns: 1fr !important;
    grid-auto-rows: 150px !important;
  }
  .page-uppgotvun .bento > * {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  /* Hitakort (52-reita rist, repeat(13/18/26,1fr)): 1fr-dálkar hafa min-width:auto
     sem meinar þeim að skreppa undir 18 reiti → þvingar kortið breitt. min-width:0
     leyfir reitunum að skreppa svo ristin passi í skjáinn. */
  .disc-body [style*="repeat(13, 1fr)"],
  .disc-body [style*="repeat(18, 1fr)"],
  .disc-body [style*="repeat(26, 1fr)"] { min-width: 0 !important; }
  /* og allir beinir afkomendur lista-korta mega skreppa (min-content gildra) */
  .disc-body [style*="1.15fr 1fr"] > *,
  .disc-body [style*="repeat(2, 1fr)"] > * { min-width: 0 !important; }

  /* Flex-raðir (t.d. „titill … Skoða →"): leyfa börnum að skreppa svo texti
     vefjist í stað þess að ýta systkinum út fyrir skjáinn. */
  .disc-body [style*="display: flex"] > * { min-width: 0; }

  /* ======================= MITT SVÆÐI (minsida) ======================= */
  .page-minsida { overflow-x: clip; }
  /* Tveggja-dálka layout (prófíll + stjórnborð, kort-ristir) → einn dálkur */
  .page-minsida [style*="1.1fr 1fr"],
  .page-minsida [style*="1fr 1fr"] { grid-template-columns: 1fr !important; }
  /* Fastar breiddir → sveigjanlegar */
  .page-minsida [style*="width: 700px"], .page-minsida [style*="width:700px"],
  .page-minsida [style*="width: 520px"], .page-minsida [style*="width:520px"],
  .page-minsida [style*="width: 320px"], .page-minsida [style*="width:320px"],
  .page-minsida [style*="width: 240px"], .page-minsida [style*="width:240px"] {
    width: 100% !important; max-width: 100% !important;
  }
  /* Verðlaunakort o.fl.: leyfa flex-börnum að skreppa (var eitt orð á línu) */
  .page-minsida [style*="min-width: 260px"], .page-minsida [style*="min-width:260px"],
  .page-minsida [style*="min-width: 200px"], .page-minsida [style*="min-width:200px"] { min-width: 0 !important; }
  .page-minsida [style*="display: flex"] > * { min-width: 0; }

  /* Prófíl-haus: „Skipta um mynd" takkinn kramdi nafnið/@handle í margar línur.
     Gefum nafninu plássið og látum takkann falla á eigin línu fyrir neðan. */
  .ms-idrow { flex-wrap: wrap; }
  .ms-idname { flex: 1 1 auto; min-width: 60%; }
  .ms-idspacer { display: none !important; }
  .ms-idbtn { flex: 0 0 auto !important; margin-top: 8px; }

  /* Stjórnborð-kortin: voru gisin (lítið tákn efst, tómt pláss). Á síma gerum við
     þau lárétt — stærra tákn vinstra megin, texti hægra megin, lóðrétt miðjað — svo
     þau fylli kassann og líti flottar út. */
  .page-minsida .dash-card { flex-direction: row !important; align-items: center; gap: 16px; min-height: 0 !important; padding: 18px 20px !important; }
  .page-minsida .dash-card .dash-icon { width: 52px !important; height: 52px !important; border-radius: 14px !important; font-size: 25px !important; }
  .page-minsida .dash-card .dash-icon { display: flex !important; align-items: center; justify-content: center; }
  /* Verðlauna-borði: föstu hlutarnir (merki + takkar) kramdi textann í eitt orð
     á línu. Leyfa að vefjast svo textinn fái fulla breidd og takkar fari niður. */
  .reward-banner { flex-wrap: wrap; row-gap: 12px; }
  .reward-banner > div[style*="flex: 1"] { flex: 1 1 60% !important; }

  /* ======================= PRÓFÍLL (Profill) ======================= */
  .page-profill { overflow-x: clip; }
  /* Verðlauna-borði: 6 → 3 dálkar (litil merki) */
  .page-profill [style*="repeat(6, 1fr)"], .page-profill [style*="repeat(6,1fr)"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  /* Sögu-/„stóðu upp úr" kort: 3 → 1 dálkur */
  .page-profill [style*="repeat(3, 1fr)"], .page-profill [style*="repeat(3,1fr)"] {
    grid-template-columns: 1fr !important;
  }
  /* Fastar breiddir → sveigjanlegar */
  .page-profill [style*="width: 700px"], .page-profill [style*="width:700px"],
  .page-profill [style*="width: 680px"], .page-profill [style*="width:680px"],
  .page-profill [style*="width: 560px"], .page-profill [style*="width:560px"],
  .page-profill [style*="width: 360px"], .page-profill [style*="width:360px"] {
    width: 100% !important; max-width: 100% !important;
  }
  .page-profill [style*="min-width: 260px"], .page-profill [style*="min-width:260px"],
  .page-profill [style*="min-width: 180px"], .page-profill [style*="min-width:180px"] { min-width: 0 !important; }
  .page-profill [style*="display: flex"] > * { min-width: 0; }

  /* ======================= STJÓRNBORÐ (Stjornbord) ======================= */
  .page-stjornbord { overflow-x: clip; }
  /* Dálkalabels (MARKMIÐ/SÖGUR/STAÐA/…) meika ekki sens þegar raðir vefjast */
  .sb-thead { display: none !important; }
  /* Goal-röð á síma: Lína 1 = númer + titill + ⋯ (⋯ efst-hægri, eðlilegur staður
     fyrir „fleiri" — ekki stakt neðst). Aðgerðirnar vefjast í snyrtilegar línur
     fyrir neðan. Notum `order` til að lyfta ⋯ upp að titlinum. */
  .sb-row { flex-wrap: wrap; row-gap: 10px; padding: 14px 16px !important; align-items: flex-start; }
  .sb-row > span:first-child { order: 0; }                                   /* númer */
  .sb-row > a[style*="flex: 1"], .sb-row > a[style*="flex:1"] { order: 1; flex: 1 1 0 !important; min-width: 0 !important; }
  .sb-row > div[style*="position: relative"]:last-child { order: 2; }        /* ⋯ efst-hægri */
  .sb-row > div[style*="width: 210px"] { order: 3; flex: 0 0 100% !important; width: auto !important; padding-left: 0 !important; } /* Skoða/Skrifa */
  /* Staða + sýnileiki + stjarna: náttúruleg breidd svo þau rúmist á EINNI línu
     (voru fastar 130px → duttu hvert á sína línu). */
  .sb-row > div[style*="width: 130px"] { order: 4; width: auto !important; flex: 0 0 auto !important; padding-left: 0 !important; }
  .sb-row > div[style*="width: 70px"]  { order: 5; width: auto !important; flex: 0 0 auto !important; }
  /* Staða-/sýnileika-valmyndir sitja vinstra megin → opna til HÆGRI svo þær fari
     ekki út fyrir vinstri skjábrún (right:0 gerði það). ⋯ er hægra megin → heldur right:0. */
  .sb-row > div[style*="width: 130px"] div[style*="right: 0"] { left: 0 !important; right: auto !important; }
  /* Lista-/uppgjörskort: titill fyllir efstu línu, merki + takkar (Skoða/Gera upp/⋯)
     vefjast undir. Án þessa hrynur flex:1 titillinn í 0 og takkarnir kremjast. */
  .sb-listrow { flex-wrap: wrap; row-gap: 12px; padding-left: 16px !important; padding-right: 16px !important; }
  .sb-listrow > div[style*="flex: 1"] { flex: 1 1 100% !important; min-width: 0 !important; }
  /* Undirtexti fyrirsagnar („Staða og sýnileiki…") fer undir titilinn */
  .sb-goalhdr { flex-wrap: wrap; row-gap: 4px; }
  .sb-goalhdr > span { flex: 1 1 100%; }

  /* ============ AÐRAR APP-SÍÐUR (triage) ============ */
  .page-hugmyndabanki, .page-listi, .page-uppgjor, .page-tolfraedi,
  .page-bud, .page-verdlaun, .page-stillingar { overflow-x: clip; }

  /* Stillingar: efnis-vafningur var með 32px hliðarstiku (content-box) → náði út
     fyrir rammann. Minnka stiku svo form-reitir + Vista-takki passi innan skjás. */
  .page-stillingar .st-wrap { padding-left: 16px !important; padding-right: 16px !important; box-sizing: border-box; max-width: 100%; }

  /* fr-ristir → einn dálkur (Uppgjörs stat-tiles repeat(3,1fr) fá að halda sér
     — bara tölur, passa á síma). */
  .page-hugmyndabanki [style*="repeat(3, 1fr)"], .page-hugmyndabanki [style*="repeat(3,1fr)"],
  .page-verdlaun [style*="1fr 1fr"] { grid-template-columns: 1fr !important; }

  /* Fastar breiddir (≥300px) → sveigjanlegar. Afmarkað við þessar síður. */
  .page-listi [style*="width: 760px"], .page-listi [style*="width:760px"],
  .page-listi [style*="width: 700px"], .page-listi [style*="width:700px"],
  .page-listi [style*="width: 640px"], .page-listi [style*="width:640px"],
  .page-listi [style*="width: 520px"], .page-listi [style*="width:520px"],
  .page-listi [style*="width: 300px"], .page-listi [style*="width:300px"],
  .page-uppgjor [style*="width: 760px"], .page-uppgjor [style*="width:760px"],
  .page-uppgjor [style*="width: 700px"], .page-uppgjor [style*="width:700px"],
  .page-uppgjor [style*="width: 400px"], .page-uppgjor [style*="width:400px"],
  .page-uppgjor [style*="width: 325px"], .page-uppgjor [style*="width:325px"],
  .page-tolfraedi [style*="width: 700px"], .page-tolfraedi [style*="width:700px"],
  .page-tolfraedi [style*="width: 460px"], .page-tolfraedi [style*="width:460px"],
  .page-tolfraedi [style*="width: 440px"], .page-tolfraedi [style*="width:440px"],
  .page-bud [style*="width: 960px"], .page-bud [style*="width:960px"],
  .page-bud [style*="width: 700px"], .page-bud [style*="width:700px"],
  .page-bud [style*="width: 640px"], .page-bud [style*="width:640px"],
  .page-bud [style*="width: 460px"], .page-bud [style*="width:460px"],
  .page-verdlaun [style*="width: 880px"], .page-verdlaun [style*="width:880px"],
  .page-verdlaun [style*="width: 700px"], .page-verdlaun [style*="width:700px"],
  .page-verdlaun [style*="width: 560px"], .page-verdlaun [style*="width:560px"],
  .page-verdlaun [style*="width: 460px"], .page-verdlaun [style*="width:460px"],
  .page-stillingar [style*="width: 720px"], .page-stillingar [style*="width:720px"],
  .page-stillingar [style*="width: 700px"], .page-stillingar [style*="width:700px"],
  .page-stillingar [style*="width: 520px"], .page-stillingar [style*="width:520px"],
  .page-hugmyndabanki [style*="width: 700px"], .page-hugmyndabanki [style*="width:700px"] {
    width: 100% !important; max-width: 100% !important; box-sizing: border-box !important;
  }

  /* Leyfa flex-börnum að skreppa (texti vefst í stað þess að ýta út) */
  .page-listi [style*="display: flex"] > *,
  .page-uppgjor [style*="display: flex"] > *,
  .page-stillingar [style*="display: flex"] > *,
  .page-tolfraedi [style*="display: flex"] > * { min-width: 0; }

  /* Listi: röðin var þröng (96px hliðar-padding) og full af aðgerðum sem kramdi
     titilinn í eitt orð á línu. Víkka umgjörð, minnka bil, fela raða-handfangið,
     og láta stöðu-veljarann fara í eigin línu fyrir neðan. */
  .page-listi [style*="padding: 40px 48px 60px"] { padding-left: 14px !important; padding-right: 14px !important; }
  .page-listi .li-row { flex-wrap: wrap; row-gap: 8px; gap: 10px !important; }
  .page-listi .li-row > span[title*="Dragðu"] { display: none; }   /* raða-handfang */
  .li-statuspick { flex: 1 1 100% !important; margin-top: 2px; }
  .li-statuspick button { flex: 1 1 auto; white-space: nowrap; }
  /* Ár-flipar: margir árgangar → pillurnar kremjast/klippast. Á síma birtum við
     fellilista í staðinn (skýrara og fyrirferðarlítið), felum pillu-röðina. */
  .page-listi .year-select { display: block; }
  .page-listi .year-pills { display: none !important; }

  /* ============ PERSÓNULEGI HUGMYNDABANKINN (Hugmyndabanki) ============ */
  /* Töflu-haus (Markmið/Flokkur/Á listum röðun) meikar ekki sens þröngt — fela. */
  .hb-thead { display: none !important; }
  /* Gagna-röð: stafla — titill fær efstu línu, Flokka + Á listum dropdown niðri. */
  .page-hugmyndabanki .hb-idearow { flex-wrap: wrap; row-gap: 10px; padding: 12px 14px !important; }
  .page-hugmyndabanki .hb-idearow > div[style*="flex: 1"] { flex: 1 1 60% !important; }
  .page-hugmyndabanki .hb-idearow > div[style*="width: 150px"],
  .page-hugmyndabanki .hb-idearow > div[style*="width: 180px"] { width: auto !important; flex: 1 1 auto !important; }
  /* Miðjaðir hausar með absolute-hnöppum hægra megin (Flokkar/Listar/Gæti átt
     við þig) skarast á síma — stafla og gera hnappana static. */
  .page-hugmyndabanki [style*="justify-content: center"][style*="position: relative"] {
    flex-direction: column !important; gap: 8px;
  }
  .page-hugmyndabanki [style*="justify-content: center"][style*="position: relative"] > [style*="position: absolute"] {
    position: static !important; right: auto !important;
  }

}

/* ═══════════════════════════════════════════════════════════════════
   AÐGENGI (a11y) — gildir á öllum skjástærðum (utan media-query).
   ═══════════════════════════════════════════════════════════════════ */

/* Sýnilegur lyklaborðs-fókus. !important svo hann sigri inline outline:none
   sem er víða á reitum. :focus-visible birtist AÐEINS við lyklaborð/hjálpartæki
   — ekki við músarsmell — svo þetta truflar ekki mús-notendur. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
  outline: 3px solid var(--accent) !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}

/* Virða ósk um minni hreyfingu (vestibular/athyglis-þarfir). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}