﻿/* SAFARIBOK | Version: 1.2.8 | Ändrad: 2026-10-25 | Endast sidbyggarens layout. */
.sb-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-bottom: 20px; }
.sb-status { min-height: 26px; font-size: 16px; }
.sb-status.is-error { color: #a12b25; }
.sb-basfalt, .sb-fakta { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.sb-basfalt label, .sb-fakta label, .sb-redigering label { display: grid; gap: 7px; font-size: 16px; margin-bottom: 16px; }
.sb-basfalt input, .sb-fakta input, .sb-redigering textarea { box-sizing: border-box; width: 100%; min-height: 40px; padding: 9px 12px; border: 1px solid var(--line,#dfe6de); border-radius: 10px; font: inherit; }
.sb-editor-layout { display: grid; grid-template-columns: minmax(260px, .8fr) minmax(0, 1.3fr); gap: 28px; align-items: start; margin-top: 28px; }
.sb-blocklista, .sb-redigering { min-width: 0; padding: 24px; border: 1px solid var(--line,#dfe6de); background: #fff; border-radius: 16px; }
.sb-blocklista p { font-size: 16px; line-height: 1.6; }
.sb-blockkort { border: 1px solid var(--line,#dfe6de); border-radius: 12px; padding: 16px; margin-block: 12px; }
.sb-blockkort.is-selected { border-color: #66836c; background: #f3f7f1; }
.sb-blockkort h3 { font-size: 18px; margin: 0 0 12px; }
.sb-block-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sb-block-actions button { min-height: 42px; font-size: 15px; }
.sb-lagg-till { width: 100%; min-height: 44px; margin-block: 7px; }
.sb-preview-panel { margin-top: 24px; }
.sb-preview-panel iframe { width: 100%; height: 75vh; border: 1px solid #dfe6de; border-radius: 12px; background: #fff; }
.sb-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: start; margin-block: 32px; }
.sb-columns > *, .sb-public { min-width: 0; }
.sb-public img { max-width: 100%; }
.sb-image { margin: 32px 0; }
.sb-image img, .sb-columns figure img { width: 100%; height: auto; border-radius: 14px; }
.sb-image figcaption, .sb-columns figcaption { font-size: 15px; color: #617168; margin-top: 10px; }
.sb-text { max-width: 800px; margin-block: 32px; padding: 0; }
.sb-callout, .sb-background { padding: 28px; border-radius: 16px; margin-block: 24px; }
.sb-callout, .sb-background-paper { background: #f1f4ef; }
.sb-background-green { background: #163c2c; color: #fff; }
.sb-background-green p, .sb-background-green h2, .sb-background-green a { color: inherit; }
.sb-button-row { margin-block: 24px; }
.sb-admin-toolbar { position: fixed; z-index: 1800; right: 24px; bottom: 24px; }
@media(max-width: 900px) { .sb-editor-layout { grid-template-columns: 1fr; } .sb-basfalt,.sb-fakta { grid-template-columns: 1fr 1fr; } }
@media(max-width: 600px) { .sb-basfalt,.sb-fakta,.sb-columns { grid-template-columns: 1fr; } .sb-redigering,.sb-blocklista { padding: 18px; } .sb-toolbar .button { flex: 1 1 45%; } .sb-admin-toolbar { right: 14px; bottom: 14px; } }

.sb-mallval { padding: 16px; border: 1px solid #dfe6de; border-radius: 12px; }
.sb-mallval button { display: block; width: 100%; margin-top: 10px; }

.sb-seo { margin-block: 20px; padding: 20px; border: 1px solid #dfe6de; border-radius: 12px; }
.sb-seo summary { cursor: pointer; font-size: 17px; }
.sb-seo label { display: grid; gap: 7px; margin-top: 16px; }
.sb-seo input, .sb-seo textarea { width: 100%; min-height: 40px; padding: 10px; border: 1px solid #dfe6de; border-radius: 10px; font: inherit; }
.sb-faktalista { display: grid; grid-template-columns: auto 1fr; gap: 8px 24px; padding: 24px; background: #f1f4ef; border-radius: 14px; }
.sb-faktalista dt { font-weight: 600; }
.sb-faktalista dd { margin: 0; }

/* WYSIWYG 1.2.3: redigeringsverktyg hålls isär från sidans publicerade layout. */
.sb-editor [hidden] { display: none !important; }
.sb-toolbar { position: sticky; top: 0; z-index: 120; padding: 16px; background: #fff; border: 1px solid #dfe6de; border-radius: 14px; box-shadow: 0 5px 20px #163c2c0d; }
.sb-toolbar label { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.sb-toolbar button, .sb-toolbar a { min-height: 44px; }
.sb-editor-layout { display: block; padding: 0; margin-top: 24px; }
.sb-canvas-heading { display: flex; gap: 24px; justify-content: space-between; align-items: center; padding: 20px 24px; background: #f1f4ef; border: 1px solid #dfe6de; border-radius: 16px 16px 0 0; }
.sb-canvas-heading h2 { margin: 0 0 6px; font-size: 23px; }
.sb-canvas-heading p { margin: 0; max-width: 760px; font-size: 16px; }
.sb-canvas-heading label { flex-shrink: 0; display: grid; gap: 6px; }
.sb-editor select { min-height: 44px; font: inherit; }
.sb-editor iframe[data-sb=canvas] { display: block; width: 100%; max-width: 100%; height: 78vh; min-height: 560px; margin: 0 auto; border: 1px solid #dfe6de; background: #fff; transition: width .18s ease; }
.sb-sidinstallningar { margin-block: 16px; padding: 18px 20px; border: 1px solid #dfe6de; border-radius: 14px; }
.sb-sidinstallningar summary { cursor: pointer; font-weight: 600; }
.sb-sidinstallningar .sb-basfalt { margin-top: 16px; }
.sb-egenskaper { width: min(850px, 92vw); max-height: 88vh; overflow: auto; padding: 28px; border: 1px solid #dfe6de; border-radius: 18px; color: #163c2c; background: #fff; }
.sb-egenskaper::backdrop { background: #10291fc0; }
.sb-egenskaper label { display: grid; gap: 8px; margin-block: 18px; }
.sb-egenskaper input { width: 100%; box-sizing: border-box; min-height: 46px; padding: 10px; font: inherit; border: 1px solid #b4c4b9; border-radius: 8px; }
.sb-egenskaper > button { display: block; width: 100%; min-height: 48px; margin-top: 10px; }
.sb-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.sb-dialog-heading h2 { margin: 0; font-size: 23px; }
.sb-dialog-actions { margin-top: 24px; display: flex; justify-content: flex-end; }
.sb-bildrutor { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; max-height: 350px; overflow: auto; }
.sb-bildrutor button { display: flex; flex-direction: column; padding: 8px; gap: 8px; font-size: 14px; white-space: normal; text-align: left; }
.sb-bildrutor button[aria-pressed=true] { outline: 3px solid #2d7050; background: #eff7f1; }
.sb-bildrutor img { width: 100%; height: 110px; object-fit: cover; border-radius: 6px; }
/* Dessa regler gäller endast inne i den isolerade redigeringsramen. */
.sb-canvas-body { margin: 0; background: #fafbf8; }
.sb-canvas-body .fade { opacity: 1; }
.sb-canvas-body .page { padding-block: 30px 60px; }
.sb-canvas-block { position: relative; min-width: 0; }
.sb-avsnittsverktyg { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 20px 0 16px; padding: 12px; border: 1px solid #cdd9cf; border-radius: 10px; background: #fff; color: #173d2d; font: 14px/1.4 Manrope,Arial,sans-serif; }
.sb-avsnittsverktyg > span { font-weight: 700; margin-right: auto; }
.sb-avsnittsverktyg .button, .sb-avsnittsverktyg select { min-height: 40px; padding: 8px 12px; font-size: 14px; }
.sb-insert { display: block; width: 100%; min-height: 42px; margin: 22px 0; border: 1px dashed #99b1a1; background: #f3f8f3; color: #24583c; font-size: 15px; }
.sb-direkttext { cursor: text; border-radius: 3px; outline: 1px dashed transparent; outline-offset: 5px; min-width: 1ch; }
.sb-direkttext:hover { outline-color: #8da695; }
.sb-direkttext:focus, .sb-direkttext.mce-edit-focus { outline: 2px solid #3b7b55; }
.sb-direkttext:empty::before { content: attr(data-ledtext); color: #687b6b; font-style: italic; }
.sb-direkttext:empty { display: block; min-height: 1.6em; }
.sb-canvas-body img[data-bildfalt] { cursor: pointer; outline: 2px solid transparent; outline-offset: 4px; }
.sb-canvas-body img[data-bildfalt]:hover, .sb-canvas-body img[data-bildfalt]:focus { outline-color: #3b7b55; }
.sb-tom-bild { display: block; width: 100%; min-height: 180px; border: 2px dashed #8da695; background: #e7eee6; }
.sb-canvas-body .tox-tinymce-inline { z-index: 10000; }
@media(max-width: 700px) { .sb-canvas-heading { display: block; padding: 16px; } .sb-canvas-heading label { margin-top: 15px; } .sb-egenskaper { padding: 18px; } .sb-bildrutor { grid-template-columns: repeat(2,minmax(0,1fr)); } }
/* Avsnittsöversikten ger orientering utan att ersätta sidan med ett fältformulär. */
.sb-arbetsyta { display: grid; grid-template-columns: 190px minmax(0,1fr); align-items: start; border: 1px solid #dfe6de; background: #f1f4ef; }
.sb-avsnittslista { padding: 16px; }
.sb-avsnittslista h3 { font-size: 17px; margin: 0 0 12px; }
.sb-avsnittslista .button { display: block; width: 100%; white-space: normal; text-align: left; min-height: 46px; font-size: 14px; margin-block: 8px; padding: 10px; }
.sb-avsnittslista p { font-size: 14px; line-height: 1.6; color: #617168; }
.sb-ramyta { min-width: 0; background: #dce4de; }
.sb-canvas-block.sb-markerat { outline: 2px solid #8da695; outline-offset: 8px; }
@media(max-width:1000px) { .sb-arbetsyta { grid-template-columns: 1fr; } .sb-avsnittslista { padding: 12px; } .sb-avsnittslista [data-sb=avsnittlista] { display: flex; flex-wrap: wrap; gap: 8px; } .sb-avsnittslista .button { width: auto; } .sb-avsnittslista p { display: none; } }
/* Webbens generella section-regel får inte lägga extra luft runt editorernas höljen. */
.sb-canvas-body .sb-canvas-block { padding: 0; margin: 0; max-width: none; }
.sb-canvas-body .sb-direkttext[data-falttyp=html] > :first-child { margin-top: 0; }
/* Samma sidbredd som övriga publika sidor, även när innehållet serverrenderas. */
#app > .sb-public { box-sizing: border-box; width: 100%; max-width: 1600px; padding-inline: 3.5%; margin-inline: auto; }
#app .sb-public .story-heading, #app .sb-public .founder-portraits { max-width: none; }
@media(min-width:751px) {
    #app .sb-public .story-columns { grid-template-columns: 260px minmax(0,1fr); }
    #app .sb-public.founder-story .reading { width: 100%; max-width: none; }
}
/* Färgade rutor är riktiga innehållsobjekt och får samma hörn i båda visningslägena. */
#app .sb-public .story-dedication, #app .sb-public .sb-content-box {
    box-sizing: border-box;
    background: #f4e4c5;
    border-radius: 20px;
    padding: 30px;
    margin-block: 35px;
    overflow-wrap: anywhere;
}
#app .sb-public .sb-content-box > :first-child { margin-top: 0; }
#app .sb-public .sb-content-box > :last-child { margin-bottom: 0; }
#app .sb-public .sb-content-divider { border: 0; border-top: 1px solid #cbd8cd; margin-block: 32px; }
.sb-vyknappar { display: flex; flex-wrap: wrap; gap: 6px; }
.sb-vyknappar button { display: grid; justify-items: center; gap: 5px; min-width: 74px; min-height: 58px; padding: 9px; border: 1px solid #cdd9d1; border-radius: 10px; background: #fff; color: #173d2d; cursor: pointer; font: inherit; font-size: 12px; }
.sb-vyknappar button i { font-size: 21px; }
.sb-vyknappar button[aria-pressed=true] { background: #173d2d; color: #fff; border-color: #173d2d; }
.sb-vyknappar button:focus-visible { outline: 3px solid #e4ad55; outline-offset: 2px; }
.sb-ramyta { position: relative; height: 78vh; min-height: 560px; overflow: hidden; }
.sb-editor iframe[data-sb=canvas] { position: absolute; top: 0; margin: 0; min-height: 0; border: 0; transform-origin: top left; transition: none; }
@media(max-width:600px) { #app .sb-public .sb-content-box, #app .sb-public .story-dedication { padding: 22px; } }
/* Långa originalnamn får inte trycka ut miniatyrkort eller andra kolumner. */
.sb-bildrutor { align-items: stretch; }
.sb-bildrutor button { min-width: 0; max-width: 100%; overflow: hidden; white-space: normal !important; word-break: normal; overflow-wrap: anywhere; }
.sb-bildnamn { display: block; width: 100%; min-width: 0; white-space: normal !important; overflow-wrap: anywhere; word-break: break-word; text-align: left; }
.sb-bildfel { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 110px; padding: 12px; box-sizing: border-box; border-radius: 8px; background: #edf1ec; color: #52695b; font-size: 12px; line-height: 1.5; text-align: center; }
.sb-bildfel i { font-size: 30px; opacity: .7; }
.sb-bildfel[hidden], .sb-bildrutor img[hidden] { display: none !important; }
.sb-bild-saknas .sb-bildfel { order: -1; }
.sb-seo [data-tecken] { display: block; font-size: 13px; color: #52695b; text-align: right; }
.sb-seo [data-tecken].sb-for-lang { color: #a12b25; font-weight: 700; }
.sb-editor input::placeholder, .sb-editor textarea::placeholder { color: #758579; opacity: 1; }
/* Språket ska hållas ihop som ett verktygsval även när toolbaren behöver flera rader. */
.sb-toolbar .sb-sprakval { display: inline-flex; align-items: center; flex: 0 0 auto; flex-wrap: nowrap; gap: 10px; white-space: nowrap; }
.sb-toolbar .sb-sprakval > span { flex: 0 0 auto; white-space: nowrap; }
.sb-toolbar .sb-sprakval .wh-dropdown { width: 145px; flex: 0 0 145px; }
.sb-editor [data-sb=laddaupp] { margin-top: 12px; }
/* Padding och inset-markering ger plats åt hela markeringsramen vid scrollområdets kant. */
.sb-bildrutor { box-sizing: border-box; padding: 8px; scroll-padding: 8px; }
.sb-bildkort { position: relative; min-width: 0; }
.sb-bildrutor .sb-bildkort > button { width: 100%; height: 100%; margin: 0; }
.sb-bildrutor button[data-bildvalsknapp][aria-pressed=true] { outline: none; box-shadow: inset 0 0 0 3px #2d7050; border-color: #2d7050; }
.sb-bildmenyplats { position: absolute; right: 8px; top: 8px; }
.sb-bildrutor .sb-bildmenyknapp { display: grid; place-items: center; width: 32px; height: 32px; min-height: 32px; padding: 0; margin: 0; border: 1px solid #ccd8cf; border-radius: 50%; background: #fff; color: #173d2d; box-shadow: 0 2px 7px #163c2c1f; cursor: pointer; }
.sb-bildmenyknapp i { font-size: 16px; }
.sb-bildmeny { inset: auto; position: fixed; width: 210px; margin: 0; padding: 6px; box-sizing: border-box; border: 1px solid #ccd8cf; border-radius: 12px; background: #fff; color: #173d2d; box-shadow: 0 8px 30px #163c2c26; }
.sb-bildmeny:popover-open { display: grid; gap: 4px; }
.sb-bildmeny .button { width: 100%; min-height: 42px; margin: 0; text-align: left; font-size: 14px; border-radius: 7px; }
.sb-filinformation { padding: 16px; margin-top: 16px; border: 1px solid #dfe6de; border-radius: 12px; }
.sb-filinformation h4 { margin: 0 0 12px; }
.sb-filinformation dl { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 9px; margin: 0; }
.sb-filinformation dt { font-weight: 600; }
.sb-filinformation dd { margin: 0; overflow-wrap: anywhere; }
/* Formaterad bakgrundsmeny inne i ramen; inget OS-renderat select-fönster. */
.sb-canvas-body .sb-bakgrundsmeny { position: relative; margin: 0; padding: 0; min-width: 178px; }
.sb-bakgrundsmeny > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 42px; padding: 9px 12px; box-sizing: border-box; border: 1px solid #cdd9d1; border-radius: 10px; background: #f7f9f7; color: #173d2d; cursor: pointer; font: 14px/1.4 Manrope,Arial,sans-serif; }
.sb-bakgrundsmeny > summary::-webkit-details-marker { display: none; }
.sb-bakgrundslista { position: absolute; z-index: 20; right: 0; top: calc(100% + 5px); min-width: 200px; padding: 6px; border: 1px solid #cdd9d1; border-radius: 10px; box-shadow: 0 8px 25px #173d2d22; background: #fff; }
.sb-bakgrundslista .button { display: block; width: 100%; text-align: left; border-radius: 7px; margin: 0; background: #fff; color: #173d2d; }
.sb-bakgrundslista .button[aria-pressed=true] { background: #e8f2e9; }
.sb-skriv-efter { display: block; width: 100%; min-height: 40px; margin: 16px 0; border: 1px dashed #9ab19e; border-radius: 8px; background: #f3f7f1; color: #24583c; font: 14px/1.4 Manrope,Arial,sans-serif; cursor: pointer; }
@media(max-width:600px) { .sb-filinformation dl { grid-template-columns: 1fr; } }
/* Åtta kvadratiska mallkort: skissen visar layout, namnet ger ett enkelt val. */
.sb-mallval-dialog { width: min(1040px,94vw); }
.sb-mallrutnat { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; margin-top: 22px; }
.sb-mallkort { min-width: 0; aspect-ratio: 1; display: flex; flex-direction: column; gap: 12px; padding: 14px; border: 1px solid #d1dfd5; border-radius: 14px; background: #fff; color: #173d2d; cursor: pointer; font: inherit; }
.sb-mallkort:hover { border-color: #3d7e5a; background: #f5f9f3; }
.sb-mallkort:focus-visible { outline: 3px solid #3d7e5a; outline-offset: 2px; }
.sb-mallillustration { flex: 1; min-height: 80px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 12px; box-sizing: border-box; border-radius: 9px; background: #f1f5ee; overflow: hidden; width: 100%; }
.sb-mallnamn { display: block; width: 100%; text-align: center; font-size: 14px; line-height: 1.4; font-weight: 600; }
.sb-skisskolumn { display: flex; flex: 1; flex-direction: column; gap: 9px; min-width: 0; }
.sb-skissrubrik,.sb-skissrad { display: block; width: 100%; height: 5px; border-radius: 3px; background: #b8c9bd; }
.sb-skissrubrik { width: 75%; height: 9px; background: #496d55; margin-bottom: 3px; }
.sb-skissrad.kort { width: 65%; }
.sb-skissbild { display: grid; place-items: center; flex: 1; align-self: stretch; min-height: 55px; border-radius: 7px; background: #d8e4d4; color: #789681; }
.sb-skissbild i { font-size: 31px; }
.sb-skisshelbild { display: flex; flex-direction: column; width: 100%; gap: 10px; height: 100%; }
.sb-skisshelbild .sb-skissbild { flex: 1; min-height: 65px; }
.sb-skissruta { width: 100%; padding: 13px; box-sizing: border-box; border-radius: 9px; background: #e2eadb; display: flex; flex-direction: column; gap: 9px; }
.sb-skissknapp { display: inline-flex; align-items: center; gap: 12px; padding: 11px 18px; border-radius: 25px; background: #173d2d; color: #fff; font-size: 12px; }
.sb-skisscitat { display: flex; flex: 1; flex-direction: column; gap: 9px; border-left: 3px solid #d9a957; padding-left: 12px; }
.sb-skisscitat i { color: #b58b43; font-size: 22px; align-self: start; }
.sb-skissfakta { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; width: 100%; }
.sb-skissfakta > span { display: flex; flex-direction: column; gap: 7px; min-width: 0; background: #e0e9db; padding: 10px 5px; border-radius: 6px; }
.sb-skissfakta b { font-size: 18px; text-align: center; color: #466b51; }
.sb-mallstang { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #d1dfd5; color: #173d2d; background: #fff; cursor: pointer; }
/* Återanvändbara nya mallar på publicerad sida och i arbetsytan. */
#app .sb-public .sb-quote { margin: 32px 0; padding: 24px 28px; border-left: 4px solid #d9a957; background: #f5f7f0; border-radius: 0 16px 16px 0; }
#app .sb-public .sb-quote p { font-size: 24px; line-height: 1.6; margin: 0 0 16px; }
#app .sb-public .sb-quote .sb-quote-author { display: block; font-style: normal; line-height: 1.6; padding: 0; margin: 0; background: transparent; color: #617168; font-size: 15px; }
#app .sb-public .sb-factgrid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; max-width: none; padding: 0; margin: 32px 0; }
.sb-factgrid > div { padding: 24px; border: 1px solid #dfe6de; border-radius: 16px; background: #f1f5ee; min-width: 0; }
.sb-factgrid strong { display: block; font-size: 36px; color: #173d2d; }
.sb-factgrid h3 { font-size: 20px; margin: 12px 0; }
@media(max-width:760px) { .sb-mallrutnat { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { #app .sb-public .sb-factgrid { grid-template-columns: 1fr; } }
/* Tom löptext får en egen yta under rubriken i stället för att dela rubrikens baslinje. */
.sb-canvas-body div.sb-direkttext[data-falttyp=html]:empty {
    display: block;
    box-sizing: border-box;
    min-height: 100px;
    padding: 16px;
    margin-top: 18px;
    margin-bottom: 14px;
    border: 1px dashed #c1d0c3;
    outline-offset: 0;
    font: 16px/1.6 Manrope,Arial,sans-serif;
    background: #f7faf5;
}
.sb-canvas-body div.sb-direkttext[data-falttyp=html]:empty::before { display: block; line-height: 1.6; margin: 0; }
.sb-canvas-body .sb-columns h2[data-redigeringsfalt] { margin-bottom: 20px; }

/* Bildtexter har en egen grå färg i grundstilen och ärver därför inte mörka
   avsnitts vita text. Ge dem en ljus nyans endast på den mörkgröna ytan.
   Regeln gäller både editor, förhandsgranskning och publicerat innehåll. */
#app .sb-background-green .sb-columns > figure > figcaption,
#app .sb-background-green .sb-image > figcaption,
#app .sb-background-green .founder-portraits > figure > figcaption,
#app .sb-background-green .founder-portraits > figure > figcaption span {
    color: #d8e8de;
}
/* Två flikar med åtta mallkort vardera. */
.sb-mallflikar { display: flex; gap: 10px; margin-top: 18px; }
.sb-mallflikar button { min-height: 44px; padding: 10px 18px; border: 1px solid #cdd9d1; border-radius: 22px; background: #fff; color: #173d2d; font: inherit; cursor: pointer; }
.sb-mallflikar button[aria-pressed=true] { background: #173d2d; color: #fff; }
.sb-mallkort[hidden] { display: none !important; }
.sb-skissportratt { display: flex; flex-direction: column; flex: 1; gap: 8px; height: 100%; min-width: 0; }
.sb-skissportratt .sb-skissbild { min-height: 55px; }
.sb-skissrubrik.stor { height: 16px; width: 90%; }
.sb-skissruta.gul { background: #f4e4c5; }
.sb-skissruta .sb-skissknapp { padding: 5px 9px; font-size: 9px; width: fit-content; }
.sb-skisskortgrid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; width: 100%; }
.sb-skisskortgrid > span { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sb-skisskortgrid i { font-size: 20px; color: #789681; }
.sb-skisssidofakta { display: flex; flex-direction: column; gap: 7px; width: 28%; padding-right: 8px; border-right: 1px solid #cdd9d1; }
.sb-skisssidofakta b { font-size: 19px; color: #496d55; }
.sb-skisshero { display: flex; width: 100%; flex-direction: column; gap: 9px; padding: 13px; background: #9fb7a2; border-radius: 8px; }
.sb-skisshero > i { font-size: 24px; text-align: right; color: #e2ebe3; }
.sb-skisshero .sb-skissrubrik { background: #fff; }
.sb-skisshero .sb-skissknapp { width: fit-content; padding: 5px 10px; font-size: 10px; }
/* Nya mallar återanvänder samma typografi och layoutelement som de befintliga sidorna. */
#app .sb-public .sb-portrait-pair { width: 100%; max-width: none; }
.sb-portrait-pair figcaption > div { font-size: 15px; color: #617168; margin-top: 7px; }
#app .sb-background-green .sb-portrait-pair figcaption > div { color: #d8e8de; }
#app .sb-public .sb-intro { margin-block: 28px 48px; padding: 0; max-width: none; }
.sb-intro h2 { font-size: clamp(36px,5vw,64px); line-height: 1.12; margin: 18px 0; }
.sb-intro .lead { max-width: 900px; font-size: 21px; line-height: 1.7; }
#app .sb-public .sb-card-grid, #app .sb-public .sb-link-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; padding: 0; margin-block: 32px; max-width: none; }
.sb-card-grid .article-card { min-width: 0; background: #fff; border: 1px solid #dfe6de; border-radius: 16px; overflow: hidden; }
.sb-card-grid .article-card > img { display: block; width: 100%; height: 220px; object-fit: cover; }
.sb-card-body { padding: 22px; }
.sb-card-body h3 { margin: 0 0 14px; font-size: 23px; }
.sb-card-body .card-action { display: inline-block; margin-top: 16px; font-weight: 700; color: #173d2d; text-decoration: underline; }
.sb-link-grid .place-card { min-width: 0; padding: 26px; background: #f1f5ee; border: 1px solid #dfe6de; border-radius: 16px; }
.sb-link-symbol { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: #e2eadb; color: #173d2d; font-weight: 700; }
.sb-link-grid h3 { margin: 18px 0 12px; }
.sb-link-grid .button { display: inline-flex; margin-top: 18px; }
#app .sb-public .sb-editorial { padding: 0; margin-block: 32px; max-width: none; }
.sb-editorial .reading { width: 100%; max-width: none; margin: 0; }
#app .sb-public .sb-cover { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; min-height: 420px; padding: 50px; margin-block: 32px; border-radius: 20px; max-width: none; background: #173d2d; color: #fff; }
.sb-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.sb-cover::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(90deg,#10251de6,#10251d33); }
.sb-cover-copy { max-width: 660px; }
.sb-cover-copy h2 { color: #fff; font-size: clamp(32px,4vw,54px); line-height: 1.15; }
.sb-cover-copy .eyebrow, .sb-cover-copy p { color: #fff; }
#app .sb-public .story-dedication, .sb-callout, .sb-factgrid > div, .sb-quote, .sb-card-grid .article-card, .sb-link-grid .place-card { color: #173d2d; }
#app .sb-background-green .story-number { color: #fff; }
#app .sb-background-green .story-number small { color: #d8e8de; }
@media(max-width:900px) { #app .sb-public .sb-card-grid, #app .sb-public .sb-link-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:750px) { #app .sb-public .sb-editorial { grid-template-columns: 1fr; gap: 30px; } .sb-editorial > aside { display: block; } }
@media(max-width:600px) { #app .sb-public .sb-card-grid, #app .sb-public .sb-link-grid { grid-template-columns: 1fr; } #app .sb-public .sb-cover { min-height: 340px; padding: 28px; } }
/* Sidans sällan använda inställningar öppnas i en panel från höger. */
.sb-headingtools { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; flex-shrink: 0; }
.sb-installningsknappar { display: flex; gap: 8px; }
.sb-installningsknappar button { min-height: 38px; padding: 8px 12px; border: 1px solid #cdd9d1; border-radius: 9px; color: #173d2d; background: #fff; font: inherit; font-size: 14px; cursor: pointer; }
.sb-installningsknappar i { margin-right: 6px; }
.sb-installningspanel { position: fixed; inset: 0 0 0 auto; margin: 0; box-sizing: border-box; width: min(480px,100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh; padding: 26px; border: 0; border-left: 1px solid #dfe6de; border-radius: 18px 0 0 18px; background: #fff; color: #173d2d; overflow-y: auto; box-shadow: -12px 0 45px #173d2d22; }
.sb-installningspanel::backdrop { background: #10291f66; }
.sb-panelhuvud { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.sb-panelhuvud h2 { font-size: 23px; margin: 0; }
.sb-panelhuvud > button { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid #dfe6de; border-radius: 50%; background: #fff; color: #173d2d; cursor: pointer; }
.sb-installningspanel .sb-basfalt { grid-template-columns: 1fr; gap: 8px; }
.sb-installningspanel .sb-seo { margin: 0; padding: 0; border: 0; }
.sb-panelfot { margin-top: 28px; padding-top: 20px; border-top: 1px solid #dfe6de; }
.sb-panelfot p { font-size: 14px; line-height: 1.6; color: #617168; }
.sb-panelfot .button { width: 100%; }
@media(max-width:700px) { .sb-headingtools { align-items: flex-start; margin-top: 14px; flex-shrink: 1; } }
/* Samla åtgärder efter vad de gör; låt grupperna brytas i stället för etiketten Visa språk. */
.sb-toolbar { justify-content: space-between; align-items: center; gap: 14px; }
.sb-verktygsgrupp { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.sb-sidgrupp { flex: 1 1 auto; }
.sb-granskningsgrupp, .sb-spargrupp { flex: 0 0 auto; }
.sb-aktuellt-sidnamn { display: block; max-width: 200px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 700; font-size: 15px; padding-inline: 5px; }
.sb-toolbar .sb-sprakval { margin: 0; }
.sb-toolbar .button { padding: 10px 14px; white-space: nowrap; }
.sb-toolbar .button i { margin-right: 5px; }
.sb-flerverktyg { position: relative; }
.sb-flerverktyg > summary { list-style: none; min-height: 44px; padding: 11px 13px; box-sizing: border-box; border: 1px solid #d1dfd5; border-radius: 10px; background: #fff; color: #173d2d; cursor: pointer; font: 14px/1.4 Manrope,Arial,sans-serif; }
.sb-flerverktyg > summary::-webkit-details-marker { display: none; }
.sb-flerverktyg > div { position: absolute; z-index: 130; right: 0; top: calc(100% + 6px); width: 220px; padding: 6px; background: #fff; border: 1px solid #d1dfd5; border-radius: 12px; box-shadow: 0 10px 30px #173d2d22; }
.sb-flerverktyg .button { width: 100%; text-align: left; margin: 2px 0; border-radius: 7px; }
.sb-flerverktyg [data-sb=radera] { color: #a12b25; }
@media(max-width:1100px) { .sb-sidgrupp { flex-basis: 100%; } }
@media(max-width:600px) { .sb-toolbar .sb-verktygsgrupp .button { flex: 0 0 auto; } .sb-aktuellt-sidnamn { max-width: 150px; } }
/* Avsnittets kolumnplacering ändras utan att fält eller sidofakta raderas. */
#app .sb-public .sb-editorial-plain { display: block; padding: 0; max-width: none; margin-block: 32px; }
#app .sb-public .sb-editorial-plain > .reading { width: 100%; max-width: none; }
@media(min-width:751px) { #app .sb-public .sb-editorial-right { grid-template-columns: minmax(0,1fr) 260px; } }
.sb-nytt-avsnitt { width: 100%; white-space: normal; }

/* 1.2.8: modal för faktisk arbetsstatus – inga uppskattade procentsiffror. */
.sb-translation-progress{width:min(460px,calc(100vw - 32px));max-width:460px;padding:34px;border:1px solid #dce5d8;border-radius:22px;background:white;color:#193f30;box-shadow:0 24px 90px #10251d33;text-align:center;font-family:Manrope,sans-serif}.sb-translation-progress::backdrop{background:#10251d88}.sb-translation-progress h2{font-size:23px;margin:18px 0 12px}.sb-translation-progress p{font-size:14px;line-height:1.7;color:#526b5a}.sb-translation-progress .sb-progress-hint{font-size:12px;color:#788474}.sb-progress-spinner{width:46px;height:46px;border-radius:50%;border:4px solid #eaf0e3;border-top-color:#dca849;margin:0 auto;animation:sb-progress-spin .9s linear infinite}.sb-progress-spinner[hidden]{display:none}.sb-progress-close{border:0;border-radius:25px;background:#193f30;color:white;padding:12px 28px;font:inherit;cursor:pointer}.sb-progress-failed h2{color:#963e2d}@keyframes sb-progress-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.sb-progress-spinner{animation:none;border-top-color:#dca849}}

/* CMS-sidväljare i riktext och knappdialog. */
.sb-cms-choose{border:1px solid #dce5d7;border-radius:14px;padding:16px;margin:12px 0 20px}.sb-cms-choose summary{cursor:pointer;font-weight:700;margin-bottom:14px}.sb-cms-pages{display:flex;flex-direction:column;gap:7px;max-height:270px;overflow:auto;padding:4px}.sb-cms-page{display:block;flex-shrink:0;text-align:left;width:100%;border:1px solid #dce5d7;border-radius:12px;background:white;color:#214a36;padding:12px 14px;cursor:pointer;font:inherit}.sb-cms-page:hover,.sb-cms-page[aria-pressed=true]{background:#edf3e7;border-color:#6d956b}.sb-cms-page strong,.sb-cms-page small{display:block}.sb-cms-page small{font-size:12px;color:#6a7d63;margin-top:5px;overflow-wrap:anywhere}.sb-cms-link-dialog{width:min(580px,calc(100vw - 32px));max-width:580px;border:1px solid #dce5d7;border-radius:22px;padding:26px;background:white;color:#193f30;font-family:Manrope,sans-serif}.sb-cms-link-dialog::backdrop{background:#10251d88}.sb-cms-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.sb-cms-dialog-head h2{font-size:23px;margin:0}.sb-cms-dialog-head button{width:36px;height:36px;border:0;border-radius:50%;background:#edf3e7;color:#193f30;font-size:24px}.sb-cms-link-dialog label{font-size:13px;font-weight:700;display:block}.sb-cms-link-dialog input{display:block;width:100%;box-sizing:border-box;border:1px solid #dce5d7;border-radius:12px;padding:12px;margin:8px 0;font:inherit}.sb-cms-link-dialog p{font-size:13px;line-height:1.6;color:#697d61}.sb-cms-link-dialog .sb-cms-pages{max-height:min(50vh,420px)}

/* Sidnamnet får en egen fullbred rad, fristående från åtgärderna. */
.sb-editor-identitet{margin:0 0 20px;min-width:0}.sb-editor-identitet>small{display:block;font-size:10px;font-weight:700;letter-spacing:1.7px;color:#6e816e;margin-bottom:6px}.sb-editor-identitet .sb-aktuellt-sidnamn{max-width:none;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;font-size:25px;line-height:1.4;padding:0;margin:0;color:#193f30}

.sb-editor-identitet>p{font-size:12px;line-height:1.6;color:#6a7d69;margin:6px 0 0}

/* Samma virtuella sidbredd och skala i redigering och förhandsgranskning. */
.sb-editor iframe[data-sb=previewframe]{position:absolute;top:0;margin:0;min-height:0;border:0;transform-origin:top left;transition:none}.sb-translation-canvas .sb-avsnittsverktyg,.sb-translation-canvas .sb-insert{display:none!important}.sb-translation-editor [data-sb=radera]{display:none!important}

/* 1.2.10: riktext får inte renderas som stycken inuti ett annat p-element. */
#app .sb-public .sb-richtext{margin-top:17px}#app .sb-public .sb-richtext>:first-child{margin-top:0}#app .sb-public .sb-richtext>:last-child{margin-bottom:0}#app .sb-public .reading .sb-richtext{font-size:17px;line-height:1.9}#app .sb-public.founder-story .reading .sb-richtext{line-height:1.85}#app .sb-public .story-heading>.sb-richtext{font-size:21px;line-height:1.65;max-width:700px;color:var(--muted)}@media(max-width:600px){#app .sb-public .reading .sb-richtext{font-size:16px}}

/* 1.2.11: textlänkar ska synas både i riktexteditorn och på den publika sidan. */
#app .sb-public{--sb-text-link:#111111}#app .sb-public .sb-background-green,#app .sb-public .sb-cover{--sb-text-link:#f5f9f3}#app .sb-public .sb-quote,#app .sb-public .story-dedication,#app .sb-public .sb-background-paper,#app .sb-public .sb-callout,#app .sb-public .sb-card-grid .article-card,#app .sb-public .sb-factgrid>div,#app .sb-public .sb-content-box,#app .sb-public .place-card{--sb-text-link:#111111}
#app .sb-public a[href]:not(.button):not(.outline):not(.pill):not(.animal-card):not(.photo-tile){color:var(--sb-text-link,#111111);text-decoration-line:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:3px}
#app .sb-public a[href]:not(.button):not(.outline):not(.pill):not(.animal-card):not(.photo-tile):hover{text-decoration-thickness:2px}
#app .sb-public a[href]:focus-visible{outline:3px solid #d9a957;outline-offset:4px;border-radius:2px}

/* Artikel-CMS 1.3.0: samma typografi och rundade ytor som övriga CMS. */
.sb-article-settings{width:100%;border:1px solid #dce3dd;border-radius:16px;padding:18px;margin:12px 0 22px;background:#fff}
.sb-article-settings summary{cursor:pointer;font-weight:700}
.sb-article-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:20px}
.sb-article-fields label{display:flex;flex-direction:column;gap:6px;min-width:0}
.sb-article-fields input:not([type=checkbox]),.sb-article-fields textarea{width:100%;box-sizing:border-box;border:1px solid #ced9cf;border-radius:10px;padding:11px;font:inherit}
.sb-article-fields textarea{min-height:110px;resize:vertical}
.sb-article-relations{min-width:0;border:1px solid #dce3dd;border-radius:12px;padding:12px}
.sb-article-relations legend{font-size:inherit;font-weight:700;width:auto}
.sb-article-relation-list{max-height:180px;overflow:auto;margin-top:10px}
.sb-article-relation-list label{display:flex;flex-direction:row;align-items:center;padding:6px;overflow-wrap:anywhere}
.sb-article-relation-list label[hidden]{display:none}
#app .sb-public .sb-article-lead{font-size:1.2em;line-height:1.7;max-width:none}
#app .sb-public .sb-article-byline,#app .sb-public .sb-article-tags{font-size:.9em;color:#526158}
.sb-article-cover{display:block;width:100%;max-height:650px;object-fit:cover;border-radius:20px;margin:24px 0}
.sb-article-image-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:28px 0}
.sb-article-image-pair figure{margin:0;min-width:0}.sb-article-image-pair img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px}
.sb-article-image-pair figcaption{padding:10px 0;line-height:1.6}
.sb-article-interview,.sb-article-sources{padding:24px;border:1px solid #dce3dd;border-radius:18px;margin:28px 0}
.sb-article-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:28px 0}
.sb-article-card{min-width:0;border:1px solid #dce3dd;border-radius:20px;overflow:hidden;padding:20px;background:#fff;color:#111}
.sb-article-card img{width:100%;height:200px;object-fit:cover;border-radius:12px}.sb-article-card h2{font-size:1.3em}
.sb-article-filter{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.sb-article-filter label{display:grid;gap:6px}.sb-article-filter input{border:1px solid #ced9cf;border-radius:12px;padding:12px;font:inherit;max-width:100%}
.sb-article-pages{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:24px 0}
@media(max-width:900px){.sb-article-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.sb-article-fields,.sb-article-image-pair,.sb-article-list{grid-template-columns:1fr}}

.sb-fakta>.sb-article-settings{grid-column:1/-1;box-sizing:border-box}
.sb-article-home{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:40px;align-items:start;margin-top:24px}
.sb-article-home .sb-article-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.sb-article-sort{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.sb-article-sort [aria-current=true]{background:#173b2b;color:#fff!important}
.sb-article-sidebar{display:grid;gap:22px;min-width:0}
.sb-article-sidebar section{padding:22px;border:1px solid #dce3dd;border-radius:18px;background:#f5f6f1}
.sb-article-sidebar h2{font-size:1.12em;margin:0 0 16px}.sb-article-sidebar ul{list-style:none;padding:0;display:grid;gap:12px}
.sb-article-mini{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #dce3dd;overflow-wrap:anywhere}
.sb-article-mini:last-child{border:0}.sb-article-mini img{width:68px;height:68px;object-fit:cover;border-radius:12px;flex:0 0 68px}
.sb-article-mini small{display:block;margin-top:6px;color:#526158}.sb-article-topic-tags{display:flex;gap:8px;flex-wrap:wrap}
.sb-article-sidebar a{color:#111!important;text-decoration:underline;text-underline-offset:3px}
.sb-article-relations input[type=checkbox]{width:18px;min-height:18px;flex:0 0 18px}.sb-article-relations label{margin-bottom:0}
@media(max-width:1000px){.sb-article-home{grid-template-columns:minmax(0,1fr) 260px;gap:24px}}
@media(max-width:760px){.sb-article-home{grid-template-columns:1fr}.sb-article-home .sb-article-list{grid-template-columns:1fr}.sb-article-sidebar{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:500px){.sb-article-sidebar{grid-template-columns:1fr}}

.sb-article-invitation{display:flex;justify-content:space-between;align-items:center;gap:24px;background:#f4e4c5;border-radius:20px;padding:28px;margin:24px 0}
.sb-pitch-page{max-width:850px;margin:auto}#article-pitch{border:1px solid #dce3dd;border-radius:20px;padding:28px;margin:28px 0;background:#fff}
#article-pitch label{display:grid;gap:8px;margin:18px 0}#article-pitch input:not([type=checkbox]),#article-pitch textarea{width:100%;box-sizing:border-box;border:1px solid #ced9cf;border-radius:12px;padding:12px;font:inherit}
#article-pitch .sb-pitch-consent{display:flex;align-items:flex-start}#article-pitch .sb-pitch-consent input{width:20px;height:20px;flex:0 0 20px}
.sb-pitch-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}#article-pitch input[name=code]{max-width:230px;font-size:24px;letter-spacing:6px}
#article-pitch [data-pitch=verification] button{margin:8px 8px 8px 0}
@media(max-width:620px){.sb-article-invitation{display:block}.sb-article-invitation .button{margin-top:12px}}

/* Sticky-rutan är begränsad till sitt avsnitt och kan aldrig täcka sajtens footer. */
.sb-sticky-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:40px;align-items:start;margin:32px 0}
.sb-sticky-main,.sb-sticky-aside{min-width:0}.sb-sticky-aside{position:sticky;top:100px}
.sb-sticky-box{background:#f0f3ed;color:#142c21;border-radius:20px;padding:28px;overflow-wrap:anywhere}
.sb-sticky-box h3{margin:0 0 18px}.sb-sticky-box a:not(.button){display:block;color:#111;text-decoration:underline;text-underline-offset:3px;margin:12px 0}
.sb-sticky-box .button{margin-top:12px}.sb-sticky-box .button[href=""]{display:none}
@media(max-width:800px){.sb-sticky-layout{grid-template-columns:1fr;gap:24px}.sb-sticky-aside{position:static}}
@media(max-height:700px){.sb-sticky-aside{position:static}}

/* CMS 1.3.3: artikeluppgifter använder samma högra panel som SEO och sidnamn. */
.sb-installningspanel .sb-article-fakta{display:block;margin:0;padding:0}
.sb-installningspanel .sb-article-settings{border:0;border-radius:0;margin:0;padding:0;background:transparent}
.sb-installningspanel .sb-article-fields{grid-template-columns:minmax(0,1fr);gap:16px;margin-top:6px}
.sb-installningspanel .sb-article-fields label{margin-bottom:4px}
.sb-installningspanel .sb-article-relations{padding:14px}
.sb-installningspanel .sb-panelfot{position:sticky;bottom:-26px;background:#fff;padding-bottom:24px;z-index:3}

/* 1.3.6: bildväljarens tilläggsknapp ska inte ärva sidans vanliga knappmarginaler. */
.sb-media-dialog .wh-shared-media-grid{align-items:start}
.wh-upload.wh-gallery-upload .wh-shared-media-grid>.wh-media-tile,
.wh-upload.wh-gallery-upload .wh-shared-media-grid>.wh-media-add{margin:0!important;padding:0!important;align-self:start;box-sizing:border-box;aspect-ratio:1;height:auto;min-height:0;max-width:100%}
.wh-upload.wh-gallery-upload .wh-media-add{line-height:1.3}
.sb-article-head .sb-article-cover{display:block;width:100%;height:auto;object-fit:contain;border-radius:16px}

/* 1.4.0: samma begränsade bildhöjd i CMS-canvas, förhandsgranskning och publik artikel. */
.sb-public .sb-image img,.sb-canvas-body .sb-image img,.sb-article-head .sb-article-cover{display:block;width:100%;height:auto;max-height:520px;object-fit:contain;border-radius:16px}
.sb-canvas-body .sb-image img,.sb-canvas-body .sb-article-cover{max-height:360px}
.sb-cover-picker{display:grid;gap:10px}.sb-cover-picker .button{justify-self:start}
@media(max-width:600px){.sb-public .sb-image img,.sb-article-head .sb-article-cover{max-height:340px}}

.sb-public .sb-richtext img,.sb-canvas-body .sb-richtext img{max-height:520px;object-fit:contain}.sb-canvas-body .sb-richtext img{max-height:360px}
