/* ==========================================================================
   Lenders.se, artikel-CSS (globala regler för tabeller, rutor och listor)
   Flyttad oförändrad från Anpassa > Ytterligare CSS i Spacious Pro, okt 2026.
   Ändringar som rör temat (sidhuvud, byline, sidfot) ligger i lenders.css.
   ========================================================================== */
/*    
   1. 2-KOLUMNERS TABELLER
      Vanlig HTML, ingen klass. Visas som vanlig tabell pa bade
      desktop och mobil.
      
      <table>
        <thead><tr><th>Rubrik 1</th><th>Rubrik 2</th></tr></thead>
        <tbody><tr><td>Varde 1</td><td>Varde 2</td></tr></tbody>
      </table>
   
   2. 3+ KOLUMNERS TABELLER MED KORTA CELLVARDEN (1-2 ord per cell)
      Vanlig HTML, ingen klass. Funkar lasbart pa mobil anda eftersom
      cellinnehallet ar sa kort att tabellen far plats utan stacking.
      Exempel: jamforelse av langivare med korta varden som "Trustly",
      "De flesta storbanker", "Dygnet runt".
   
   3. 3+ KOLUMNERS TABELLER MED LANGA CELLVARDEN ELLER DAR STACKING
      GER BATTRE LASBARHET
      
      MASTE ha class="kort-mobil" pa <table> OCH data-label-attribut pa
      VARJE <td>. Pa mobil (<700px) stackas raderna till kort dar
      data-label visas som etikett ovanfor varje varde och forsta
      cellen blir gron kort-header.
      
      Anvands t.ex. for rakneexempel (lanebelopp, loptid, manadskostnad,
      total kostnad) dar siffrorna behover egna etiketter pa mobil for
      att lasaren ska forsta sammanhanget.
      
      RATT:
      <table class="kort-mobil">
        <thead>
          <tr>
            <th>Lanebelopp</th><th>Loptid</th><th>Manadskostnad</th><th>Total kostnad</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td data-label="Lanebelopp">5 000 kr</td>
            <td data-label="Loptid">12 man</td>
            <td data-label="Manadskostnad">517 kr</td>
            <td data-label="Total kostnad"><strong>6 599 kr</strong></td>
          </tr>
        </tbody>
      </table>
      
      FEL (saknar class="kort-mobil" - blir oformaterad pa mobil):
      <table>
      
      FEL (saknar data-label - rubrikerna forsvinner pa mobil):
      <td>5 000 kr</td>
   
   4. FORSTA KOLUMNEN i kort-mobil-tabeller blir automatiskt gron
      kort-header pa mobil. Etiketten visas vit (semi-transparent) for
      kontrast mot gron bakgrund. Lagg data-label aven dar.
   
   5. PRINCIP: Anvand kort-mobil bara nar det BEHOVS. Korta tabeller
      klarar sig utan. Mindre markup ar alltid battre nar det rader sig.
   
   ============================================================================ */


/* =========================================================================
   LENDERS.SE - GLOBAL CSS v14
   Fargpalett: #28a745 (gron) | #163b6d (navy) | #0056b3 (info-bla)
              #d9534f (varning-rod) | #f8fafc (slate-bg) | #1e293b (text)
   Typografi: -apple-system / sans-serif
   ========================================================================= */

/* -------- ROOT VARIABLER -------- */
:root {
    --le-green: #28a745;
    --le-green-dark: #166534;
    --le-green-bg: #e8f5e9;
    --le-green-light: #f0fdf4;

    --le-navy: #163b6d;
    --le-navy-dark: #003366;
    --le-info-blue: #0056b3;
    --le-info-bg: #f0f7ff;

    --le-warning-red: #d9534f;
    --le-warning-text: #912d2b;
    --le-warning-bg: #fff5f5;

    --le-amber: #f59e0b;
    --le-amber-text: #78350f;
    --le-amber-bg: #fffbe6;

    --le-slate-bg: #f8fafc;
    --le-slate-border: #e2e8f0;
    --le-slate-text: #475569;
    --le-slate-dark: #1e293b;
    --le-slate-muted: #64748b;

    --le-blue: #0066ff;
    --le-emerald: #10b981;

    --le-shadow: 0 1px 3px rgba(0,0,0,0.05);
    --le-shadow-lg: 0 4px 15px rgba(0,0,0,0.05);
    --le-radius: 10px;
    --le-radius-lg: 12px;
}


/* -------- TYPOGRAFI - rubriker -------- */
.entry-content h2,
.post-content h2,
article h2 {
    color: #1a1a1a !important;
    border-bottom: 3px solid var(--le-green) !important;
    padding-bottom: 10px !important;
    margin-top: 40px !important;
    margin-bottom: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
}

.entry-content h3,
.post-content h3,
article h3 {
    color: #1a1a1a !important;
    border-left: 4px solid var(--le-green) !important;
    padding-left: 12px !important;
    margin-top: 30px !important;
    margin-bottom: 16px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}


/* -------- PUNKTLISTOR (ul) - automatiska checklistor --------
   Anvander direkt-barn-selektor (>) sa att enbart artikelns egna
   listor pa toppniva fa r styling. Listor inuti [companytable] eller
   andra widgets/shortcodes ligger djupare och paverkas inte. -------- */
.entry-content > ul:not([style]):not(.company-listing),
.post-content > ul:not([style]):not(.company-listing),
article > ul:not([style]):not(.company-listing),
.entry-content > ul:not([style]):not(.company-listing) ul:not([style]),
.post-content > ul:not([style]):not(.company-listing) ul:not([style]),
article > ul:not([style]):not(.company-listing) ul:not([style]) {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 18px 0 !important;
    line-height: 1.6 !important;
}

.entry-content > ul:not([style]):not(.company-listing) > li,
.post-content > ul:not([style]):not(.company-listing) > li,
article > ul:not([style]):not(.company-listing) > li {
    position: relative !important;
    padding-left: 36px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
    margin-bottom: 10px !important;
    list-style: none !important;
    font-size: 16px !important;
    color: #374151 !important;
}

.entry-content > ul:not([style]):not(.company-listing) > li::before,
.post-content > ul:not([style]):not(.company-listing) > li::before,
article > ul:not([style]):not(.company-listing) > li::before {
    content: "\2713" !important;
    position: absolute !important;
    left: 0 !important;
    top: 4px !important;
    width: 24px !important;
    height: 24px !important;
    background-color: var(--le-green-bg) !important;
    color: #2e7d32 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

.entry-content > ul:not([style]):not(.company-listing) > li strong,
.post-content > ul:not([style]):not(.company-listing) > li strong,
article > ul:not([style]):not(.company-listing) > li strong {
    color: #1a1a1a !important;
}


/* -------- EXKLUDERA companytable-shortcoden helt --------
   [companytable] genererar li.companies_post_type, .company-wrapper,
   .info2 ul - alla dessa ska inte fa checklistor eller stegkort. -------- */
.companies_post_type,
.companies_post_type li,
.company-wrapper li,
.company-wrapper ul,
.company-wrapper ol,
.info2 ul,
.info2 li,
ul.loans-list,
ul.loans-list li,
ul.loans-list > li {
    list-style: none !important;
    padding-left: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    counter-increment: none !important;
}

.companies_post_type::before,
.companies_post_type li::before,
.company-wrapper li::before,
.company-wrapper ul li::before,
.company-wrapper ol li::before,
.info2 li::before,
ul.loans-list li::before,
ul.loans-list > li::before {
    display: none !important;
    content: none !important;
    background: none !important;
    width: 0 !important;
    height: 0 !important;
}


/* -------- NUMRERADE LISTOR (ol) - automatiska steg-kort -------- */
.entry-content > ol:not([style]),
.post-content > ol:not([style]),
article > ol:not([style]) {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 20px 0 !important;
    counter-reset: lestep !important;
}

.entry-content > ol:not([style]) > li:not(.companies_post_type),
.post-content > ol:not([style]) > li:not(.companies_post_type),
article > ol:not([style]) > li:not(.companies_post_type) {
    counter-increment: lestep !important;
    position: relative !important;
    background: #fff !important;
    border: 1px solid var(--le-slate-border) !important;
    border-radius: var(--le-radius) !important;
    padding: 14px 18px 14px 60px !important;
    margin-bottom: 10px !important;
    box-shadow: var(--le-shadow) !important;
    list-style: none !important;
    font-size: 15px !important;
    color: var(--le-slate-dark) !important;
    line-height: 1.5 !important;
    min-height: 30px !important;
}

.entry-content > ol:not([style]) > li:not(.companies_post_type)::before,
.post-content > ol:not([style]) > li:not(.companies_post_type)::before,
article > ol:not([style]) > li:not(.companies_post_type)::before {
    content: counter(lestep) !important;
    position: absolute !important;
    left: 14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 32px !important;
    height: 32px !important;
    background: var(--le-green) !important;
    color: #fff !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-weight: bold !important;
    font-size: 14px !important;
}


/* -------- TABELLER (desktop) -------- */
.entry-content table,
.post-content table,
article table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse !important;
    border: 1px solid var(--le-green) !important;
    background-color: #fff !important;
    margin: 20px 0 !important;
    font-size: 14px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.entry-content table thead tr,
.post-content table thead tr,
article table thead tr,
.entry-content table th,
.post-content table th,
article table th {
    background-color: var(--le-green) !important;
    color: #fff !important;
}

.entry-content table th,
.post-content table th,
article table th {
    padding: 10px 12px !important;
    font-weight: normal !important;
    text-align: left !important;
}

.entry-content table td,
.post-content table td,
article table td {
    padding: 12px !important;
    color: #333 !important;
    border-bottom: 1px solid #eee !important;
    vertical-align: top !important;
    text-align: left !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.entry-content table tbody tr:last-child td,
.post-content table tbody tr:last-child td,
article table tbody tr:last-child td {
    border-bottom: none !important;
}

.entry-content table td:first-child,
.post-content table td:first-child,
article table td:first-child {
    color: #000 !important;
    font-weight: 500 !important;
}


/* -------- INLINE-BOXAR (granskad-bar etc) -------- */

/* Granskad-bar (gron) */
div[style*="#f0fdf4"][style*="#28a745"] {
    background-color: var(--le-green-light) !important;
    padding: 14px 20px !important;
    border-radius: 8px !important;
    border-left: 5px solid var(--le-green) !important;
    margin: 15px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

div[style*="#f0fdf4"][style*="#28a745"] p {
    color: var(--le-green-dark) !important;
    line-height: 1.5 !important;
    margin: 0 0 6px 0 !important;
    font-size: 14px !important;
}

div[style*="#f0fdf4"][style*="#28a745"] p:last-child {
    margin-bottom: 0 !important;
}

div[style*="#f0fdf4"][style*="#28a745"] a {
    color: var(--le-green) !important;
    text-decoration: underline !important;
    font-weight: bold !important;
}

/* Info-box (bla) */
div[style*="#f0f7ff"][style*="#0056b3"] {
    background-color: var(--le-info-bg) !important;
    padding: 18px 25px !important;
    border-radius: var(--le-radius) !important;
    border-left: 5px solid var(--le-info-blue) !important;
    margin: 20px 0 !important;
    text-align: left !important;
}

div[style*="#f0f7ff"][style*="#0056b3"] > div:first-child {
    font-weight: bold !important;
    color: var(--le-navy-dark) !important;
    font-size: 16px !important;
    margin-bottom: 10px !important;
}

div[style*="#f0f7ff"][style*="#0056b3"] p {
    color: var(--le-navy-dark) !important;
    line-height: 1.6 !important;
    margin: 0 0 10px 0 !important;
    font-size: 15px !important;
}

div[style*="#f0f7ff"][style*="#0056b3"] p:last-child {
    margin-bottom: 0 !important;
}

/* Varningsbox (rod) */
div[style*="#fff5f5"][style*="#d9534f"] {
    background-color: var(--le-warning-bg) !important;
    padding: 18px 25px !important;
    border-radius: var(--le-radius) !important;
    border-left: 5px solid var(--le-warning-red) !important;
    margin: 20px 0 !important;
    text-align: left !important;
}

div[style*="#fff5f5"][style*="#d9534f"] > div:first-child {
    font-weight: bold !important;
    color: var(--le-warning-text) !important;
    font-size: 16px !important;
    margin-bottom: 8px !important;
}

div[style*="#fff5f5"][style*="#d9534f"] p {
    color: var(--le-warning-text) !important;
    line-height: 1.6 !important;
    margin: 0 !important;
    font-size: 15px !important;
}

/* Disclaimer (slate-gra) */
div[style*="#f1f5f9"][style*="#64748b"] {
    background-color: #f1f5f9 !important;
    padding: 16px 22px !important;
    border-radius: 8px !important;
    border-left: 4px solid var(--le-slate-muted) !important;
    margin: 20px 0 !important;
}

div[style*="#f1f5f9"][style*="#64748b"] > div:first-child {
    font-weight: bold !important;
    color: #334155 !important;
    font-size: 14px !important;
    margin-bottom: 6px !important;
}

div[style*="#f1f5f9"][style*="#64748b"] p {
    margin: 0 !important;
    font-size: 13px !important;
    color: var(--le-slate-text) !important;
    line-height: 1.5 !important;
}

/* YMYL (amber) */
div[style*="#fffbe6"][style*="#f59e0b"] {
    background-color: var(--le-amber-bg) !important;
    padding: 16px 22px !important;
    border-radius: 8px !important;
    border-left: 4px solid var(--le-amber) !important;
    margin: 20px 0 !important;
}

div[style*="#fffbe6"][style*="#f59e0b"] > div:first-child {
    font-weight: bold !important;
    color: var(--le-amber-text) !important;
    font-size: 14px !important;
    margin-bottom: 6px !important;
}

div[style*="#fffbe6"][style*="#f59e0b"] p {
    margin: 0 !important;
    font-size: 13px !important;
    color: var(--le-amber-text) !important;
    line-height: 1.5 !important;
}

/* Forfattarbox & kallista */
div[style*="#f8fafc"][style*="#e2e8f0"] {
    background-color: var(--le-slate-bg) !important;
    padding: 22px 25px !important;
    border-radius: var(--le-radius) !important;
    border: 1px solid var(--le-slate-border) !important;
    margin: 20px 0 !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] p {
    margin: 0 0 12px 0 !important;
    font-size: 15px !important;
    color: var(--le-slate-dark) !important;
    line-height: 1.6 !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] p:last-child {
    margin-bottom: 0 !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] a {
    color: var(--le-green) !important;
    text-decoration: underline !important;
    font-weight: bold !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] ul li {
    padding: 10px 0 !important;
    padding-left: 0 !important;
    border-bottom: 1px solid var(--le-slate-border) !important;
    font-size: 14px !important;
    color: var(--le-slate-text) !important;
    line-height: 1.5 !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] ul li::before {
    display: none !important;
    content: none !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] ul li:last-child {
    border-bottom: none !important;
}

div[style*="#f8fafc"][style*="#e2e8f0"] ul li strong {
    color: var(--le-navy) !important;
}


/* -------- INLINE-STYLED tabeller (desktop) -------- */
table[style*="#28a745"] {
    width: 100% !important;
    border-collapse: collapse !important;
    border: 1px solid var(--le-green) !important;
    background-color: #fff !important;
    margin: 20px 0 !important;
    font-size: 14px !important;
}

table[style*="#28a745"] thead tr,
table[style*="#28a745"] th {
    background-color: var(--le-green) !important;
    color: #fff !important;
}

table[style*="#28a745"] th {
    padding: 10px 12px !important;
    font-weight: normal !important;
    text-align: left !important;
}

table[style*="#28a745"] td {
    padding: 12px !important;
    color: #333 !important;
    border-bottom: 1px solid #eee !important;
}

table[style*="#28a745"] td:first-child {
    color: #000 !important;
    font-weight: 500 !important;
}


/* -------- BILDER - mjuka horn pa alla bilder i artiklar -------- */
.entry-content img,
.post-content img,
article img {
    max-width: 100% !important;
    height: auto !important;
    border-radius: var(--le-radius) !important;
    box-shadow: var(--le-shadow) !important;
}

/* Undantag: bilder inuti shortcodes/widgets dar small logotyper anvands */
.entry-content [class*="company"] img,
.post-content [class*="company"] img,
article [class*="company"] img,
.entry-content [class*="logo"] img,
.post-content [class*="logo"] img,
article [class*="logo"] img {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Luft under haltebilden */
.entry-content > img,
.entry-content > p:first-child > img {
    margin-bottom: 28px !important;
}


/* =========================================================================
   MOBIL - Tablet (max 768px)
   ========================================================================= */
@media (max-width: 768px) {

    /* Boxar - mindre padding */
    div[style*="#f0fdf4"][style*="#28a745"],
    div[style*="#f0f7ff"][style*="#0056b3"],
    div[style*="#fff5f5"][style*="#d9534f"],
    div[style*="#f8fafc"][style*="#e2e8f0"],
    div[style*="#f1f5f9"][style*="#64748b"],
    div[style*="#fffbe6"][style*="#f59e0b"] {
        padding: 14px 16px !important;
        margin: 16px 0 !important;
    }

    /* Bilder med alignright/left blir centrerade */
    .entry-content img.alignright,
    .entry-content img.alignleft,
    .post-content img.alignright,
    .post-content img.alignleft,
    article img.alignright,
    article img.alignleft {
        float: none !important;
        display: block !important;
        margin: 15px auto !important;
    }
}


/* =========================================================================
   MOBIL (max 700px) - TABELLER (v12 minimal)
   
   Strategi: starka selektorer (med [style]) overskrider inline-styling.
   - 2-kol tabeller (inkl smslan): visas som vanlig tabell
   - 3+ kol tabeller: stackas till kort med data-label
   
   Ingen overlapp mellan reglerna. Inga upprepningar. Bara det som behovs.
   ========================================================================= */
@media (max-width: 700px) {

    /* Wrappers neutraliseras */
    .entry-content div[style*="overflow"],
    .post-content div[style*="overflow"],
    article div[style*="overflow"] {
        overflow: visible !important;
        width: auto !important;
        max-width: 100% !important;
    }

    /* ============= 2-KOL och fa rre: visa som vanlig tabell ============= */
    
    /* Tabell-niva */
    .entry-content table,
    .post-content table,
    article table {
        display: table !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
        border-collapse: collapse !important;
        border: 1px solid #28a745 !important;
        background: #fff !important;
        margin: 20px 0 !important;
        font-size: 13px !important;
    }
    
    /* thead/tbody-niva */
    .entry-content table thead,
    .post-content table thead,
    article table thead {
        display: table-header-group !important;
        background: #28a745 !important;
    }
    .entry-content table tbody,
    .post-content table tbody,
    article table tbody {
        display: table-row-group !important;
    }
    
    /* tr-niva */
    .entry-content table tr,
    .post-content table tr,
    article table tr {
        display: table-row !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    .entry-content table thead tr,
    .post-content table thead tr,
    article table thead tr {
        background: #28a745 !important;
    }
    
    /* th-niva */
    .entry-content table thead th,
    .post-content table thead th,
    article table thead th {
        display: table-cell !important;
        width: 50% !important;
        padding: 10px 8px !important;
        margin: 0 !important;
        border: 0 !important;
        background: #28a745 !important;
        color: #fff !important;
        font-weight: 600 !important;
        font-size: 13px !important;
        text-align: left !important;
        line-height: 1.3 !important;
        vertical-align: middle !important;
        white-space: normal !important;
        word-wrap: break-word !important;
    }
    
    /* td-niva */
    .entry-content table tbody td,
    .post-content table tbody td,
    article table tbody td {
        display: table-cell !important;
        width: 50% !important;
        padding: 10px 8px !important;
        margin: 0 !important;
        border: 0 !important;
        border-bottom: 1px solid #eee !important;
        background: transparent !important;
        color: #333 !important;
        font-size: 13px !important;
        font-weight: normal !important;
        text-align: left !important;
        line-height: 1.5 !important;
        vertical-align: top !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }
    .entry-content table tbody td:first-child,
    .post-content table tbody td:first-child,
    article table tbody td:first-child {
        color: #000 !important;
        font-weight: 600 !important;
    }
    .entry-content table tbody tr:last-child td,
    .post-content table tbody tr:last-child td,
    article table tbody tr:last-child td {
        border-bottom: 0 !important;
    }
    
    /* Inga data-label etiketter for 2-kol (men inte for .kort-mobil) */
    .entry-content table:not(.kort-mobil) td[data-label]::before,
    .post-content table:not(.kort-mobil) td[data-label]::before,
    article table:not(.kort-mobil) td[data-label]::before {
        content: none !important;
        display: none !important;
    }


    /* ============= 3+ KOL TABELLER - .kort-mobil =============
       Klassbaserad regel. Inget :has(), inget data-label kravs.
       Lagger man class="kort-mobil" pa <table> sa stackas raderna
       till kort pa mobil med rubrikerna automatiskt fran <th>. */
    
    table.kort-mobil {
        display: block !important;
        border: 0 !important;
        background: transparent !important;
        table-layout: auto !important;
    }
    table.kort-mobil thead {
        display: none !important;
    }
    table.kort-mobil tbody {
        display: block !important;
    }
    table.kort-mobil tbody tr {
        display: block !important;
        background: #fff !important;
        border: 1px solid #28a745 !important;
        border-radius: 10px !important;
        margin-bottom: 14px !important;
        padding: 0 !important;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
        width: 100% !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }
    table.kort-mobil tbody td {
        display: block !important;
        width: 100% !important;
        padding: 10px 14px !important;
        border: 0 !important;
        border-bottom: 1px solid #f1f5f9 !important;
        background: transparent !important;
        color: #333 !important;
        font-size: 14px !important;
        font-weight: normal !important;
        text-align: left !important;
        line-height: 1.5 !important;
        box-sizing: border-box !important;
    }
    table.kort-mobil tbody td:first-child {
        background: #28a745 !important;
        color: #fff !important;
        font-weight: bold !important;
        font-size: 15px !important;
        padding: 12px 14px !important;
        border-bottom: 0 !important;
    }
    table.kort-mobil tbody td:first-child a {
        color: #fff !important;
        text-decoration: underline !important;
    }
    table.kort-mobil tbody tr td:last-child {
        border-bottom: 0 !important;
    }
    table.kort-mobil tbody td[data-label]::before {
        content: attr(data-label) !important;
        display: block !important;
        font-weight: bold;
        color: #163b6d;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin-bottom: 4px;
    }
    
    /* Forsta cellen har gron bakgrund - vit etikett for kontrast */
    table.kort-mobil tbody td:first-child[data-label]::before {
        color: rgba(255, 255, 255, 0.85) !important;
    }

}


/* =========================================================================
   MOBIL (max 600px) - kompaktare allt
   ========================================================================= */
@media (max-width: 600px) {

    /* Lanetyp-rader (inline-styled flex) staplas */
    div[style*="display: flex"][style*="border-bottom: 1px solid #f1f5f9"] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        text-align: left !important;
    }

    div[style*="display: flex"][style*="border-bottom: 1px solid #f1f5f9"] > div {
        text-align: left !important;
        flex: 1 1 auto !important;
    }

    div[style*="display: flex"][style*="border-bottom: 1px solid #f1f5f9"] a {
        display: block !important;
        text-align: center !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Inline-checklistor pa indexsidan */
    ul[style*="list-style: none"] li[style*="display: flex"] > div:first-child {
        width: 22px !important;
        min-width: 22px !important;
        height: 22px !important;
        font-size: 13px !important;
    }

    /* Numrerade kort - kompaktare */
    .entry-content > ol:not([style]) > li:not(.companies_post_type),
    .post-content > ol:not([style]) > li:not(.companies_post_type),
    article > ol:not([style]) > li:not(.companies_post_type) {
        padding: 12px 14px 12px 52px !important;
        font-size: 14px !important;
    }

    .entry-content > ol:not([style]) > li:not(.companies_post_type)::before,
    .post-content > ol:not([style]) > li:not(.companies_post_type)::before,
    article > ol:not([style]) > li:not(.companies_post_type)::before {
        width: 28px !important;
        height: 28px !important;
        left: 12px !important;
        font-size: 13px !important;
    }

    /* Checklistor - mindre */
    .entry-content > ul:not([style]):not(.company-listing) > li,
    .post-content > ul:not([style]):not(.company-listing) > li,
    article > ul:not([style]):not(.company-listing) > li {
        font-size: 14px !important;
        padding-left: 32px !important;
    }

    /* Rubriker mindre */
    .entry-content h2,
    .post-content h2,
    article h2 {
        font-size: 22px !important;
        margin-top: 30px !important;
    }

    .entry-content h3,
    .post-content h3,
    article h3 {
        font-size: 18px !important;
        margin-top: 24px !important;
    }
}


/* -------- PRINT -------- */
@media print {
    .entry-content table,
    .post-content table {
        page-break-inside: avoid;
    }
}


/* =========================================================================
   GLOBAL OVERRIDE FOR INLINE-STYLED ELEMENT
   Tvingar alla artiklar att folja samma fargschema oavsett gammal kod
   ========================================================================= */

/* -------- BLA NUMMERCIRKLAR (#0066ff) -> GRONA (#28a745) -------- */
.entry-content div[style*="background: #0066ff"],
.post-content div[style*="background: #0066ff"],
article div[style*="background: #0066ff"],
.entry-content div[style*="background:#0066ff"],
.post-content div[style*="background:#0066ff"],
article div[style*="background:#0066ff"] {
    background: var(--le-green) !important;
}

/* -------- EMERALD-KNAPPAR (#10b981) -> GRONA (#28a745) -------- */
.entry-content a[style*="background: #10b981"],
.post-content a[style*="background: #10b981"],
article a[style*="background: #10b981"],
.entry-content a[style*="background:#10b981"],
.post-content a[style*="background:#10b981"],
article a[style*="background:#10b981"] {
    background: var(--le-green) !important;
}

/* -------- STEG-RUTOR med inline-styling -------- */
.entry-content div[style*="display: grid"][style*="grid-template-columns: 1fr"] > div[style*="border: 1px solid #e2e8f0"],
.post-content div[style*="display: grid"][style*="grid-template-columns: 1fr"] > div[style*="border: 1px solid #e2e8f0"],
article div[style*="display: grid"][style*="grid-template-columns: 1fr"] > div[style*="border: 1px solid #e2e8f0"] {
    border: 1px solid var(--le-slate-border) !important;
    border-radius: var(--le-radius) !important;
    padding: 14px 18px !important;
    box-shadow: var(--le-shadow) !important;
    background: #fff !important;
}

/* -------- ROD KRYSS-IKON (cons-listor) -------- */
.entry-content li div[style*="background: #fee2e2"],
.post-content li div[style*="background: #fee2e2"],
article li div[style*="background: #fee2e2"],
.entry-content li div[style*="background:#fee2e2"],
.post-content li div[style*="background:#fee2e2"],
article li div[style*="background:#fee2e2"] {
    background: #fee2e2 !important;
}

/* -------- PROS-IKON (gron bock) -------- */
.entry-content li div[style*="background: #e8f5e9"],
.post-content li div[style*="background: #e8f5e9"],
article li div[style*="background: #e8f5e9"],
.entry-content li div[style*="background:#e8f5e9"],
.post-content li div[style*="background:#e8f5e9"],
article li div[style*="background:#e8f5e9"] {
    background: var(--le-green-bg) !important;
}

/* -------- LANK-FARG -------- */
.entry-content a[style*="color: #28a745"],
.post-content a[style*="color: #28a745"],
article a[style*="color: #28a745"],
.entry-content a[style*="color:#28a745"],
.post-content a[style*="color:#28a745"],
article a[style*="color:#28a745"] {
    color: var(--le-green) !important;
}

/* -------- AUTO-NUMRERING for div-baserade steg-guider -------- */
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(1) > div:first-child,
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(2) > div:first-child,
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(3) > div:first-child,
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(4) > div:first-child,
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(5) > div:first-child,
.entry-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div:nth-child(6) > div:first-child,
.post-content div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div > div:first-child,
article div[style*="grid-template-columns: 1fr"][style*="gap: 10px"] > div > div:first-child {
    background: var(--le-green) !important;
}


/* ===== Hela sajten: allt i 850px, centrerat ===== */
.entry-content {
    max-width: 850px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Spalten/artikeln fyller bredden, sa centreringen far plats */
#primary,
#content,
.entry-content {
    width: auto !important;
    float: none !important;
}

/* Alla block fyller de 850 (aven rutor som var 800) */
.entry-content > * {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
.entry-content [style*="max-width"],
.entry-content .lka-wrap {
    max-width: 100% !important;
}

/* Bilder lika breda */
.entry-content > img,
.entry-content > p > img {
    width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
}


/* ===== LAGSTADGAD KREDITVARNING (KOVFS 2025:1) =====
   Svart text pa vit bakgrund enligt foreskrift. Triangel ritad i CSS
   som SVG-data-URI i ::before (kan inte strippas av plugins). */

.entry-content .le-lagvarning,
.post-content .le-lagvarning,
article .le-lagvarning {
    display: flex;
    align-items: flex-start;
    gap: 1.2em;
    padding: 18px 22px;
    margin: 25px 0;
    background: #ffffff;
    border: 1px solid var(--le-slate-border);
    border-left: 4px solid var(--le-warning-red);
    border-radius: 0 var(--le-radius) var(--le-radius) 0;
    font-family: sans-serif;
}

.entry-content .le-lagvarning::before,
.post-content .le-lagvarning::before,
article .le-lagvarning::before {
    content: "";
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 90'%3E%3Cpath d='M50 5 L97 87 L3 87 Z' fill='none' stroke='%23d9534f' stroke-width='7' stroke-linejoin='round'/%3E%3Crect x='45.5' y='32' width='9' height='30' rx='4' fill='%23d9534f'/%3E%3Ccircle cx='50' cy='74' r='5.5' fill='%23d9534f'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
}

.entry-content .le-lagvarning > div,
.post-content .le-lagvarning > div,
article .le-lagvarning > div,
.entry-content .le-lagvarning p,
.post-content .le-lagvarning p,
article .le-lagvarning p {
    min-width: 0;
}

.entry-content .le-lagvarning p,
.post-content .le-lagvarning p,
article .le-lagvarning p {
    margin: 0;
    color: #000000;
    line-height: 1.6;
    font-size: 15px;
}

.entry-content .le-lagvarning-rubrik,
.post-content .le-lagvarning-rubrik,
article .le-lagvarning-rubrik {
    font-weight: 700;
    margin: 0 0 0.5em !important;
    color: #000000 !important;
    font-size: 16px;
    border: none !important;
    padding: 0 !important;
}

@media (max-width: 700px) {
    .entry-content .le-lagvarning,
    .post-content .le-lagvarning,
    article .le-lagvarning {
        flex-direction: column;
        gap: 0.8em;
        padding: 16px 18px;
    }
    .entry-content .le-lagvarning::before,
    .post-content .le-lagvarning::before,
    article .le-lagvarning::before {
        width: 56px;
        height: 56px;
    }
}
