﻿/* Safaribok 1.3.4: egna artikelstilar efter CMS-bas, skyddade från globala section-regler. */
@import url("sidbyggare.css?v=1.3.3");
.page.sb-article-index{width:100%;max-width:1400px;margin-inline:auto;box-sizing:border-box}
.sb-article-index *, .sb-article-index *::before,.sb-article-index *::after{box-sizing:border-box}
.page.sb-article-index .sb-article-invitation{width:100%!important;max-width:none!important;margin:24px 0 32px!important;padding:28px!important;display:flex;gap:24px;align-items:center;justify-content:space-between;text-align:left}
.sb-article-index .sb-article-invitation>div{min-width:0;flex:1}
.sb-article-index .sb-article-invitation h2{margin:0 0 10px;font-size:26px;line-height:1.25}
.sb-article-index .sb-article-invitation p{margin:0;max-width:none}
.sb-article-index .sb-article-invitation>.button{flex-shrink:0;white-space:nowrap}
.sb-article-index .sb-article-filter{display:grid;grid-template-columns:minmax(180px,2fr) repeat(2,minmax(130px,1fr)) auto auto;gap:12px;align-items:end;width:100%;margin:0 0 20px;padding:20px;border:1px solid #dce3dd;border-radius:18px;background:#fff}
.sb-article-index .sb-article-filter label{display:grid;gap:8px;margin:0;min-width:0;font-size:14px;line-height:1.4}
.sb-article-index .sb-article-filter input[type=search]{width:100%;height:48px;margin:0;padding:10px 12px;font:inherit;border:1px solid #ced9cf;border-radius:12px;min-width:0}
.sb-article-index .sb-article-filter>.button,.sb-article-index .sb-article-filter>.outline{height:48px;margin:0;display:inline-flex;align-items:center;justify-content:center;padding:10px 20px;white-space:nowrap}
.sb-article-index .sb-article-sort{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px}
.sb-article-index .sb-article-home{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;align-items:start}
.sb-article-index .sb-article-main{min-width:0}
.sb-article-index .sb-article-sidebar{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;width:100%;min-width:0;justify-items:stretch}
.page.sb-article-index .sb-article-sidebar>section{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:22px!important;text-align:left;min-width:0}
.sb-article-index .sb-article-sidebar h2{font-size:17px;line-height:1.35;margin:0 0 14px}
.sb-article-index .sb-article-sidebar p{margin:0;max-width:none;font-size:15px;line-height:1.65}
.sb-article-index .sb-article-sidebar a{overflow-wrap:anywhere}
.sb-article-index .sb-article-card{min-width:0;padding:22px;border:1px solid #dce3dd;border-radius:18px;background:#fff}
.sb-article-index .sb-article-card h2{font-size:23px;line-height:1.3}
.sb-article-index .sb-article-pages{display:flex;gap:12px;align-items:center;margin-top:24px}
@media(max-width:1000px){.sb-article-index .sb-article-filter{grid-template-columns:repeat(3,minmax(0,1fr))}.sb-article-index .sb-article-home{grid-template-columns:minmax(0,1fr) 270px}}
@media(max-width:760px){.sb-article-index .sb-article-home{grid-template-columns:1fr}.page.sb-article-index .sb-article-invitation{align-items:flex-start;flex-direction:column}.sb-article-index .sb-article-filter{grid-template-columns:1fr 1fr}.sb-article-index .sb-article-filter label:first-of-type{grid-column:1/-1}}
@media(max-width:420px){.sb-article-index .sb-article-filter{grid-template-columns:1fr}.sb-article-index .sb-article-filter label:first-of-type{grid-column:auto}}

/* 1.3.6: kortens bilder får samma proportioner; hela omslaget visas inne på artikeln. */
.sb-article-index .sb-article-card>img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:12px;margin:0 0 18px;max-width:100%}
.sb-article-index .sb-article-mini>img{width:64px;height:64px;flex:0 0 64px;object-fit:cover;border-radius:10px}

.sb-article-index .sb-article-home .sb-article-list{grid-template-columns:1fr}
.sb-article-index .sb-article-card{display:grid;grid-template-columns:190px minmax(0,1fr);gap:24px;align-items:start}
.sb-card-thumb{width:100%;aspect-ratio:4/3;background:#eef2eb;border-radius:12px;overflow:hidden}
.sb-card-thumb img{display:block;width:100%;height:100%;object-fit:cover}.sb-card-copy{min-width:0}.sb-card-copy>:first-child{margin-top:0}
.sb-article-index .sb-article-filter select{height:48px;width:100%;padding:10px 12px;border:1px solid #ced9cf;border-radius:12px;background:white;font:inherit}
@media(max-width:600px){.sb-article-index .sb-article-card{grid-template-columns:100px minmax(0,1fr);gap:14px;padding:16px}}
