

/* ══════════════════════════════════════════════════════
   KANONISKA KNAPPSTILAR
   Alla knappar: gul pill, mörk text, mörkare vid hover
══════════════════════════════════════════════════════ */

/* Reset */
.lp-portal-wrap button,
.lp-portal-wrap input[type="button"],
.lp-portal-wrap input[type="submit"],
.lp-login-page button,
.lp-login-page input[type="submit"] {
    all: unset !important;
    box-sizing: border-box !important;
    font-family: 'DM Sans', sans-serif !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    text-align: center !important;
    border-radius: 100px !important;
    transition: background .15s, border-color .15s, opacity .15s !important;
}

/* Gul – alla primärknappar */
.lp-portal-wrap .lp-btn-yellow,
.lp-portal-wrap button.lp-btn-yellow,
.lp-portal-wrap .lp-save-project,
.lp-portal-wrap .lp-save-profile,
.lp-portal-wrap .lp-confirm-add-to-project,
.lp-portal-wrap .lp-request-quote,
.lp-portal-wrap .lp-open-project-modal,
.lp-portal-wrap .lp-cb-save,
.lp-portal-wrap .lp-btn-add,
.lp-portal-wrap .lp-ajax-save-product {
    background: var(--lp-yellow) !important;
    color: #2A2000 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 10px 20px !important;
    border: none !important;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-cb-save,
.lp-portal-wrap .lp-btn-add,
.lp-portal-wrap .lp-ajax-save-product { width: 100% !important; font-size: 12px !important; padding: 9px 16px !important; }
.lp-login-page .lp-login-btn-primary,
.lp-portal-wrap .lp-login-btn-primary { background: var(--lp-yellow) !important; color: #2A2000 !important; font-weight: 600 !important; font-size: 14px !important; padding: 12px !important; width: 100% !important; display: block !important; border: none !important; border-radius: 100px !important; }

/* Hover – bara mörkare */
.lp-portal-wrap .lp-btn-yellow:hover,
.lp-portal-wrap button.lp-btn-yellow:hover,
.lp-portal-wrap .lp-save-project:hover,
.lp-portal-wrap .lp-save-profile:hover,
.lp-portal-wrap .lp-confirm-add-to-project:hover,
.lp-portal-wrap .lp-request-quote:hover,
.lp-portal-wrap .lp-open-project-modal:hover,
.lp-portal-wrap .lp-cb-save:hover,
.lp-portal-wrap .lp-btn-add:hover,
.lp-portal-wrap .lp-ajax-save-product:hover,
.lp-login-page .lp-login-btn-primary:hover { background: var(--lp-yellow-dark) !important; color: #1A1400 !important; border-radius: 100px !important; }

/* Sparad */
.lp-portal-wrap .lp-cb-save.saved,
.lp-portal-wrap .lp-ajax-save-product.saved { background: var(--lp-yellow-soft) !important; border: 1.5px solid var(--lp-yellow) !important; color: var(--lp-yellow-dark) !important; }

/* Grå sekundär – avbryt, ta bort favorit */
.lp-portal-wrap .lp-modal-cancel,
.lp-portal-wrap button.lp-modal-cancel,
.lp-portal-wrap .lp-btn-remove { background: var(--lp-gray-100) !important; color: var(--lp-gray-600) !important; font-weight: 500 !important; font-size: 12px !important; padding: 9px 18px !important; border: none !important; border-radius: 100px !important; }
.lp-portal-wrap .lp-btn-remove { width: 100% !important; margin-top: 5px !important; }
.lp-portal-wrap .lp-modal-cancel:hover,
.lp-portal-wrap button.lp-modal-cancel:hover,
.lp-portal-wrap .lp-btn-remove:hover { background: var(--lp-gray-150) !important; color: var(--lp-text) !important; }

/* Outline – PDF, etc */
.lp-portal-wrap .lp-btn-outline,
.lp-portal-wrap a.lp-btn-outline { background: transparent !important; border: 1.5px solid var(--lp-gray-200) !important; color: var(--lp-text) !important; font-weight: 500 !important; font-size: 12px !important; padding: 8px 16px !important; border-radius: 100px !important; text-decoration: none !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; }
.lp-portal-wrap .lp-btn-outline:hover,
.lp-portal-wrap a.lp-btn-outline:hover { border-color: var(--lp-yellow-dark) !important; }

/* Modal close cirkel-X */
.lp-portal-wrap .lp-modal-close,
.lp-portal-wrap button.lp-modal-close { background: var(--lp-gray-100) !important; color: var(--lp-gray-600) !important; width: 28px !important; height: 28px !important; padding: 0 !important; border-radius: 50% !important; border: none !important; }
.lp-portal-wrap .lp-modal-close:hover,
.lp-portal-wrap button.lp-modal-close:hover { background: var(--lp-gray-150) !important; color: var(--lp-text) !important; }

/* Filter toggle (mobil) */
.lp-portal-wrap .lp-filter-toggle { all: unset !important; display: none; width: 100%; padding: 12px 16px; cursor: pointer; font-size: 13px; font-weight: 500; color: var(--lp-text); align-items: center; justify-content: space-between; }

/* Filter clear */
.lp-portal-wrap .lp-filter-clear { all: unset !important; display: inline-block !important; font-size: 12px !important; color: var(--lp-yellow-dark) !important; cursor: pointer !important; text-decoration: underline !important; margin-top: 8px !important; }

/* Kategori-expand-pil */
.lp-portal-wrap .lp-filter-cat-toggle { all: unset !important; cursor: pointer !important; color: var(--lp-gray-400) !important; display: inline-flex !important; align-items: center !important; flex-shrink: 0 !important; opacity: 1 !important; visibility: visible !important; }
.lp-portal-wrap .lp-filter-cat-toggle svg { display: block !important; opacity: 1 !important; visibility: visible !important; transition: transform .2s; }
.lp-portal-wrap .lp-filter-cat-toggle.open svg { transform: rotate(180deg); }

/* Ta bort från projekt – X-ikon */
.lp-portal-wrap .lp-proj-prod-remove { all: unset !important; position: absolute !important; top: 4px !important; right: 4px !important; width: 20px !important; height: 20px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; z-index: 10 !important; border-radius: 50% !important; opacity: 1 !important; visibility: visible !important; }
.lp-portal-wrap .lp-proj-prod-remove:hover { opacity: .55 !important; }
.lp-portal-wrap .lp-proj-prod-remove svg { display: block !important; pointer-events: none; }

/* ══════════════════════════════════════════════════════════
   INLOGGNINGSSIDA – visas på /kundportal för ej-inloggade
══════════════════════════════════════════════════════════ */
.lp-login-page {
    display: flex;
    min-height: 80vh;
    background: var(--lp-white);
    border-radius: var(--lp-radius);
    overflow: hidden;
    border: var(--lp-border);
    font-family: 'DM Sans', sans-serif;
}

/* Vänster – hero */
.lp-login-left {
    width: 46%;
    background: var(--lp-gray-50);
    border-right: var(--lp-border);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 44px;
    position: relative;
    overflow: hidden;
}
.lp-login-left::after {
    content: '';
    position: absolute;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    background: var(--lp-yellow);
    opacity: 0.10;
    bottom: -80px;
    right: -80px;
    pointer-events: none;
}
.lp-login-logo { margin-bottom: 0; }
.lp-login-hero { z-index: 1; }
.lp-login-hero h2 {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: 30px;
    color: var(--lp-text);
    line-height: 1.25;
    margin: 0 0 12px;
}
.lp-login-hero h2 em {
    color: var(--lp-yellow-dark);
    font-style: normal;
}
.lp-login-hero p {
    font-size: 14px;
    color: var(--lp-muted);
    line-height: 1.65;
    max-width: 280px;
    margin: 0;
}
.lp-login-features { display: flex; flex-direction: column; gap: 9px; z-index: 1; }
.lp-login-feature {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--lp-white);
    border: var(--lp-border);
    border-radius: 100px;
    padding: 9px 16px;
    width: fit-content;
    font-size: 13px;
    color: var(--lp-muted);
}
.lp-login-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--lp-yellow-dark);
    flex-shrink: 0;
    display: inline-block;
}

/* Höger – formulär */
.lp-login-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 44px;
}
.lp-login-box { width: 100%; max-width: 360px; }
.lp-login-title {
    font-family: 'Syne', sans-serif;
    font-weight: 700;
    font-size: 24px;
    color: var(--lp-text);
    margin: 0 0 4px;
}
.lp-login-sub {
    font-size: 14px;
    color: var(--lp-muted);
    margin: 0 0 28px;
}

/* Formulärfält */
.lp-login-form { display: flex; flex-direction: column; gap: 0; }
.lp-login-field { margin-bottom: 16px; }
.lp-login-field label {
    display: block;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--lp-gray-600);
    margin-bottom: 5px;
}
.lp-login-field input {
    width: 100%;
    padding: 11px 14px;
    border: 1.5px solid var(--lp-gray-200);
    border-radius: 100px !important;
    font-family: 'DM Sans', sans-serif;
    font-size: 14px;
    color: var(--lp-text);
    background: var(--lp-white);
    outline: none;
    transition: border-color .2s;
    box-sizing: border-box;
}
.lp-login-field input:focus { border-color: var(--lp-yellow) !important; }
.lp-login-field input::placeholder { color: var(--lp-gray-400); }

/* Inloggningsknapp */
.lp-login-btn-primary {
    all: unset !important;
    box-sizing: border-box !important;
    display: block !important;
    width: 100% !important;
    padding: 12px !important;
    background: var(--lp-yellow) !important;
    color: #2A2000 !important;
    border-radius: 100px !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-align: center !important;
    cursor: pointer !important;
    margin-top: 4px !important;
    transition: background .15s !important;
}
.lp-login-btn-primary:hover {
    background: var(--lp-yellow-dark) !important;
    color: #fff !important;
    border-radius: 100px !important;
}

/* Länkar */
.lp-login-links {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 18px;
    font-size: 13px;
    color: var(--lp-muted);
}
.lp-login-links a {
    color: var(--lp-yellow-dark);
    text-decoration: none;
    font-weight: 500;
}
.lp-login-links a:hover { text-decoration: underline; }

/* Meddelanden */
.lp-login-error {
    background: #FCEBEB;
    border: 1px solid #F09595;
    border-radius: 100px !important;
    padding: 10px 14px;
    font-size: 13px;
    color: #A32D2D;
    margin-bottom: 16px;
}
.lp-login-success {
    background: #E2F5EC;
    border: 1px solid #97C459;
    border-radius: 100px !important;
    padding: 10px 14px;
    font-size: 13px;
    color: #1A6A3C;
    margin-bottom: 16px;
}

/* Responsiv */
@media (max-width: 700px) {
    .lp-login-page { flex-direction: column; }
    .lp-login-left { width: 100%; padding: 28px; min-height: auto; }
    .lp-login-left::after { display: none; }
    .lp-login-hero h2 { font-size: 22px; }
    .lp-login-features { display: none; }
    .lp-login-right { padding: 28px; }
}


/* Modal close + cancel – override theme completely */
.lp-portal-wrap .lp-modal-close,
.lp-portal-wrap button.lp-modal-close {
    all: unset !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: var(--lp-gray-100) !important;
    color: var(--lp-gray-600) !important;
    cursor: pointer !important;
    transition: background .12s !important;
    padding: 0 !important;
    border: none !important;
}
.lp-portal-wrap .lp-modal-close:hover,
.lp-portal-wrap button.lp-modal-close:hover {
    background: var(--lp-gray-150) !important;
    color: var(--lp-text) !important;
}
.lp-portal-wrap .lp-modal-cancel,
.lp-portal-wrap button.lp-modal-cancel {
    all: unset !important;
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 9px 16px !important;
    border-radius: 100px !important;
    background: var(--lp-gray-100) !important;
    color: var(--lp-gray-600) !important;
    font-family: 'DM Sans', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    border: none !important;
    transition: background .12s !important;
}
.lp-portal-wrap .lp-modal-cancel:hover,
.lp-portal-wrap button.lp-modal-cancel:hover {
    background: var(--lp-gray-150) !important;
    color: var(--lp-text) !important;
    border-radius: 100px !important;
}


/* ── Portal-knappar – tvinga igenom mot Elementor-tema ───── */
.lp-portal-wrap button,
.lp-portal-wrap input[type="button"],
.lp-portal-wrap input[type="submit"] {
    all: unset;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-family: 'DM Sans', sans-serif;
    cursor: pointer;
    line-height: 1.3;
    text-align: center;
    transition: background .15s, color .15s, opacity .15s;
    border-radius: 100px !important;
    white-space: nowrap;
}

/* Gul primärknapp */
.lp-portal-wrap .lp-btn-yellow,
.lp-portal-wrap button.lp-btn-yellow {
    background: var(--lp-yellow) !important;
    color: #2A2000 !important;
    padding: 9px 16px;
    font-weight: 600;
    font-size: 13px;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-btn-yellow:hover,
.lp-portal-wrap button.lp-btn-yellow:hover {
    background: var(--lp-yellow-dark) !important;
    color: #fff !important;
    border-radius: 100px !important;
}

/* Outline-knapp */
.lp-portal-wrap .lp-btn-outline,
.lp-portal-wrap button.lp-btn-outline {
    background: transparent !important;
    border: 1.5px solid var(--lp-gray-200) !important;
    color: var(--lp-text) !important;
    padding: 7px 13px;
    font-weight: 500;
    font-size: 12px;
}
.lp-portal-wrap .lp-btn-outline:hover,
.lp-portal-wrap button.lp-btn-outline:hover {
    border-color: var(--lp-yellow-dark) !important;
    border-radius: 100px !important;
}

/* Spara produkt-knapp i katalogen */
.lp-portal-wrap .lp-cb-save {
    width: 100%;
    padding: 8px;
    background: var(--lp-yellow) !important;
    border: none !important;
    color: #2A2000 !important;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-cb-save:hover {
    background: var(--lp-yellow-dark) !important;
    color: #fff !important;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-cb-save.saved {
    background: var(--lp-yellow-soft) !important;
    border: 1.5px solid var(--lp-yellow) !important;
    color: var(--lp-yellow-dark) !important;
    font-weight: 600;
}

/* Lägg till i projekt-knapp */
.lp-portal-wrap .lp-btn-add {
    width: 100%;
    padding: 8px;
    background: var(--lp-yellow) !important;
    color: #2A2000 !important;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: none !important;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-btn-add:hover {
    background: var(--lp-yellow-dark) !important;
    color: #fff !important;
    border-radius: 100px !important;
}

/* Ta bort produkt från projekt – bara ett X-kryss */
.lp-portal-wrap .lp-proj-prod-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 50% !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 0 !important;
    padding: 0 !important;
    color: #1A1A18 !important;
    z-index: 10;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.lp-portal-wrap .lp-proj-prod-remove:hover { opacity: .55 !important; }
.lp-portal-wrap .lp-proj-prod-remove svg { display: block !important; pointer-events: none; stroke: #1A1A18 !important; }

/* Ta bort sparad produkt */
.lp-portal-wrap .lp-btn-remove {
    width: 100%;
    padding: 6px;
    background: transparent !important;
    border: 1.5px solid var(--lp-gray-150) !important;
    color: var(--lp-gray-500) !important;
    font-size: 11px;
    margin-top: 5px;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-btn-remove:hover {
    border-color: #E24B4A !important;
    color: #E24B4A !important;
}

/* Filter-knapp mobil */
.lp-portal-wrap .lp-filter-toggle {
    all: unset;
    display: none;
    width: 100%;
    padding: 12px 16px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: var(--lp-text);
    align-items: center;
    justify-content: space-between;
}

/* Expandknapp kategori */
.lp-portal-wrap .lp-filter-cat-toggle {
    all: unset;
    cursor: pointer;
    color: var(--lp-gray-500);
    display: inline-flex !important;
    align-items: center;
    flex-shrink: 0;
    opacity: 1 !important;
    visibility: visible !important;
}
.lp-portal-wrap .lp-filter-cat-toggle svg {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    transition: transform .2s;
}
.lp-portal-wrap .lp-filter-cat-toggle.open svg { transform: rotate(180deg); }

/* Modal-knappar */
.lp-portal-wrap .lp-modal-close {
    background: none !important;
    border: none !important;
    padding: 4px;
    color: var(--lp-gray-400);
    display: flex;
    align-items: center;
}
.lp-portal-wrap .lp-modal-close:hover { color: var(--lp-text); }

/* Save profile */
.lp-portal-wrap .lp-save-profile,
.lp-portal-wrap .lp-save-project,
.lp-portal-wrap .lp-confirm-add-to-project {
    background: var(--lp-yellow) !important;
    color: #2A2000 !important;
    padding: 9px 16px;
    font-weight: 600;
    font-size: 13px;
    border-radius: 100px !important;
}
.lp-portal-wrap .lp-save-profile:hover,
.lp-portal-wrap .lp-save-project:hover,
.lp-portal-wrap .lp-confirm-add-to-project:hover {
    background: var(--lp-yellow-dark) !important;
    color: #fff !important;
    border-radius: 100px !important;
}

/* Filter clear */
.lp-portal-wrap .lp-filter-clear {
    all: unset;
    font-size: 12px;
    color: var(--lp-yellow-dark);
    cursor: pointer;
    text-decoration: underline;
    display: inline-block;
    margin-top: 8px;
    border-radius: 100px !important;
}


/* Avatar med logotyp */
.lp-avatar.lp-avatar--logo,.lp-avatar-lg.lp-avatar--logo{background:var(--lp-white)!important;border:1.5px solid var(--lp-gray-150)!important;padding:2px;overflow:hidden}
.lp-avatar.lp-avatar--logo img,.lp-avatar-lg.lp-avatar--logo img{width:100%!important;height:100%!important;object-fit:contain;border-radius:50%;display:block}

/* ── Letusplay Kundportal v6 ────────────────────────────── */
:root{--lp-yellow:#FDCC04;--lp-yellow-dark:#D4AA00;--lp-yellow-soft:#FFFDE8;--lp-yellow-mid:#FFFBE0;--lp-white:#FFFFFF;--lp-gray-50:#F8F8F6;--lp-gray-100:#F0F0EE;--lp-gray-150:#E6E6E2;--lp-gray-200:#D8D8D4;--lp-gray-400:#AEAEA8;--lp-gray-500:#8A8A84;--lp-gray-600:#5C5C58;--lp-text:#1A1A18;--lp-muted:#6A6A64;--lp-radius:12px;--lp-radius-sm:8px;--lp-border:1px solid #E6E6E2}
.lp-portal-wrap *{box-sizing:border-box}
.lp-portal-wrap{font-family:'DM Sans',sans-serif;color:var(--lp-text);display:flex;align-items:stretch;min-height:80vh;background:var(--lp-gray-50);border-radius:var(--lp-radius);overflow:hidden;border:var(--lp-border)}

/* Sidebar */
.lp-sidebar{width:220px;background:var(--lp-white);border-right:var(--lp-border);display:flex;flex-direction:column;flex-shrink:0}
.lp-sb-logo{padding:18px 20px 14px;border-bottom:var(--lp-border)}
.lp-sb-logo .lp-wordmark{font-family:'Syne',sans-serif;font-weight:700;font-size:13px;color:var(--lp-muted);letter-spacing:0.5px;text-transform:uppercase}
.lp-sb-user{padding:12px 20px;border-bottom:var(--lp-border);display:flex;align-items:center;gap:10px}
.lp-avatar{width:32px;height:32px;border-radius:50%;background:var(--lp-yellow);display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:700;font-size:12px;color:#2A2000;flex-shrink:0}
.lp-sb-name{font-size:13px;font-weight:500;color:var(--lp-text);line-height:1.2}
.lp-sb-org{font-size:11px;color:var(--lp-gray-400);margin-top:1px}
.lp-sb-nav{flex:1;padding:12px 0}
.lp-sb-section{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--lp-gray-400);padding:10px 20px 4px;margin-top:2px}
.lp-ni{display:flex;align-items:center;gap:9px;padding:9px 20px;font-size:13px;color:var(--lp-gray-500);cursor:pointer;transition:all .12s;border-left:2.5px solid transparent;text-decoration:none;font-family:'DM Sans',sans-serif}
.lp-ni:hover{color:var(--lp-text);background:var(--lp-gray-50);text-decoration:none}
.lp-ni.active{color:var(--lp-yellow-dark);background:var(--lp-yellow-soft);border-left-color:var(--lp-yellow-dark);font-weight:500}
.lp-nb{margin-left:auto;background:var(--lp-yellow);color:#2A2000;font-size:10px;font-weight:700;padding:1px 6px;border-radius:20px}
.lp-ni--logout{color:var(--lp-gray-400)!important}
.lp-sb-bottom{border-top:var(--lp-border);padding:10px 0}

/* Main */
.lp-main{flex:1;padding:24px 28px;overflow-y:auto;min-width:0;background:var(--lp-gray-50)}
.lp-tab{display:none}
.lp-tab.active{display:block;animation:lp-fi .18s ease}
@keyframes lp-fi{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* Topbar – smaller headings */
.lp-topbar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:22px;gap:16px}
.lp-portal-wrap .lp-topbar h1,.lp-portal-wrap .lp-topbar h2,.lp-portal-wrap .lp-topbar h3{font-family:'Syne',sans-serif!important;font-size:16px!important;font-weight:700!important;color:var(--lp-text)!important;margin:0!important;padding:0!important;line-height:1.3!important}
.lp-portal-wrap .lp-topbar p{font-size:12px;color:var(--lp-muted);margin:2px 0 0}
.lp-portal-wrap h1,.lp-portal-wrap h2,.lp-portal-wrap h3{font-size:inherit!important;font-weight:inherit!important;margin:0!important;padding:0!important}

/* Buttons */
.lp-btn-yellow{background:var(--lp-yellow);color:#2A2000;border:none;padding:9px 16px;border-radius:100px!important;font-family:'DM Sans',sans-serif;font-weight:600;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .15s;white-space:nowrap;text-decoration:none}
.lp-btn-yellow:hover{background:var(--lp-yellow-dark);color:var(--lp-white)}
.lp-btn-yellow.lp-btn-sm{font-size:12px;padding:7px 12px}
.lp-btn-outline{background:transparent;border:1.5px solid var(--lp-gray-200);color:var(--lp-text);padding:7px 13px;border-radius:100px!important;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:border-color .15s;text-decoration:none}
.lp-btn-outline:hover{border-color:var(--lp-yellow-dark);text-decoration:none}

/* Banner */
.lp-banner{background:var(--lp-yellow-soft);border:1px solid #F5DC3A;border-radius:var(--lp-radius-sm);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:16px}
.lp-ban-t{font-size:13px;font-weight:600;color:#4A3900}
.lp-ban-s{font-size:12px;color:var(--lp-muted);margin-top:2px}

/* Stats */
.lp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.lp-sc{background:var(--lp-white);border-radius:var(--lp-radius);border:var(--lp-border);padding:16px 18px}
.lp-lbl{font-size:11px;color:var(--lp-muted);font-weight:500;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.lp-val{font-family:'Syne',sans-serif;font-size:24px;font-weight:700;color:var(--lp-text);line-height:1}
.lp-val small{font-size:12px;font-weight:400;color:var(--lp-gray-400);font-family:'DM Sans',sans-serif}
.lp-g2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}

/* Cards */
.lp-card,.lp-fc{background:var(--lp-white);border-radius:var(--lp-radius);border:var(--lp-border);overflow:hidden;margin-bottom:16px}
.lp-ch{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:var(--lp-border)}
.lp-ch h3{font-family:'Syne',sans-serif;font-size:13px;font-weight:700;color:var(--lp-text);margin:0}
.lp-cl{font-size:12px;color:var(--lp-yellow-dark);cursor:pointer;font-weight:500;text-decoration:none}

/* Project rows */
.lp-pr{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid var(--lp-gray-50);cursor:pointer;transition:background .1s}
.lp-pr:last-child{border-bottom:none}
.lp-pr:hover{background:var(--lp-gray-50)}
.lp-pi{width:32px;height:32px;border-radius:7px;background:var(--lp-yellow-soft);border:1px solid var(--lp-yellow-mid);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.lp-pn{font-size:13px;font-weight:500;color:var(--lp-text);line-height:1.3}
.lp-pm{font-size:12px;color:var(--lp-muted);margin-top:2px}

/* Badges */
.lp-badge{font-size:11px;font-weight:500;padding:3px 8px;border-radius:20px;white-space:nowrap;flex-shrink:0}
.lp-badge-yellow{background:var(--lp-yellow-mid);color:#5A4800}
.lp-badge-green{background:#E2F5EC;color:#1A6A3C}
.lp-badge-blue{background:#E4EDFB;color:#1A44A0}
.lp-badge-gray{background:var(--lp-gray-100);color:var(--lp-gray-600)}

/* Dashboard mini product grid */
.lp-pgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px}
.lp-pc{border:1.5px solid var(--lp-gray-150);border-radius:var(--lp-radius-sm);overflow:hidden;cursor:pointer;transition:border-color .15s}
.lp-pc:hover{border-color:var(--lp-yellow)}
.lp-pimg{width:100%;aspect-ratio:1/1;background:var(--lp-gray-100);overflow:hidden}
.lp-pimg img{width:100%;height:100%;object-fit:cover;display:block}
.lp-pb{padding:8px}
.lp-pname{font-size:11.5px;font-weight:500;color:var(--lp-text);margin-bottom:2px;line-height:1.3}
.lp-price{font-family:'Syne',sans-serif;font-size:13px;font-weight:700;color:var(--lp-text)}
.lp-sku{font-size:10.5px;color:var(--lp-gray-400)}

/* ── Catalog layout: sidebar filter + grid ─────────────── */
.lp-catalog-wrap{display:flex;gap:0;align-items:flex-start}
.lp-filter-sidebar{width:200px;flex-shrink:0;border-right:var(--lp-border);padding:16px}
.lp-filter-sidebar-title{font-family:'Syne',sans-serif;font-size:12px;font-weight:700;color:var(--lp-text);text-transform:uppercase;letter-spacing:.8px;margin-bottom:14px}
.lp-filter-group{margin-bottom:20px}
.lp-filter-group-label{font-size:11px;font-weight:600;color:var(--lp-gray-600);text-transform:uppercase;letter-spacing:.8px;margin-bottom:8px;display:block}
.lp-filter-option{display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer}
.lp-filter-option input[type="checkbox"]{width:15px;height:15px;border:1.5px solid var(--lp-gray-200);border-radius:3px;accent-color:var(--lp-yellow-dark);cursor:pointer;flex-shrink:0}
.lp-filter-option label{font-size:13px;color:var(--lp-text);cursor:pointer;line-height:1.3}
.lp-filter-option:hover label{color:var(--lp-yellow-dark)}
.lp-filter-clear{font-size:12px;color:var(--lp-yellow-dark);cursor:pointer;background:none;border:none;padding:0;font-family:'DM Sans',sans-serif;margin-top:4px;text-decoration:underline}
.lp-filter-clear:hover{color:var(--lp-yellow)}
.lp-catalog-right{flex:1;min-width:0}

/* Search bar above catalog */
.lp-search-bar{padding:14px 16px;border-bottom:var(--lp-border);display:flex;align-items:center;gap:10px}
.lp-search-wrap{position:relative;flex:1}
.lp-search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);pointer-events:none;display:flex;align-items:center;color:var(--lp-gray-400);z-index:2}
.lp-search-input{width:100%;padding:9px 14px 9px 36px!important;border:1.5px solid var(--lp-gray-200);border-radius:var(--lp-radius-sm);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--lp-text);background:var(--lp-white);outline:none;transition:border-color .2s}
.lp-search-input:focus{border-color:var(--lp-yellow)}
.lp-search-input::placeholder{color:var(--lp-gray-400)}
.lp-catalog-count{font-size:12px;color:var(--lp-muted);padding:8px 16px;border-bottom:var(--lp-border)}

/* Catalog grid */
.lp-catgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:14px}
.lp-cc{border:1.5px solid var(--lp-gray-150);border-radius:var(--lp-radius-sm);overflow:hidden;cursor:pointer;transition:border-color .15s;position:relative}
.lp-cc:hover{border-color:var(--lp-yellow)}
.lp-cc.lp-hidden{display:none}
.lp-ci{width:100%;aspect-ratio:1/1;background:var(--lp-gray-100);overflow:hidden}
.lp-ci img{width:100%;height:100%;object-fit:cover;display:block}
.lp-cb{padding:10px}
.lp-cn{font-size:12.5px;font-weight:500;color:var(--lp-text);margin-bottom:3px;line-height:1.3}
.lp-cp{font-family:'Syne',sans-serif;font-size:14px;font-weight:700;color:var(--lp-text);margin-bottom:1px}
.lp-cs{font-size:11px;color:var(--lp-gray-400);margin-bottom:8px}
.lp-cb-save{width:100%;padding:7px;background:var(--lp-gray-50);border:1.5px solid var(--lp-gray-150);border-radius:100px!important;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:500;color:var(--lp-text);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:all .12s}
.lp-cb-save:hover{background:var(--lp-yellow-soft);border-color:var(--lp-yellow)}
.lp-cb-save.saved{background:var(--lp-yellow-soft);border-color:var(--lp-yellow);color:var(--lp-yellow-dark);font-weight:600}
.lp-cb-save.saved svg path{stroke:var(--lp-yellow-dark)}
.lp-no-results{display:none;grid-column:1/-1;padding:32px;text-align:center;color:var(--lp-muted);font-size:13px}

/* Saved products */
.lp-savgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:16px}
.lp-svc{border:1.5px solid var(--lp-gray-150);border-radius:var(--lp-radius-sm);overflow:hidden}
.lp-svi{width:100%;aspect-ratio:1/1;background:var(--lp-gray-100);overflow:hidden}
.lp-svi img{width:100%;height:100%;object-fit:cover;display:block}
.lp-svb{padding:12px}
.lp-svn{font-size:13px;font-weight:500;color:var(--lp-text);margin-bottom:2px}
.lp-svp{font-family:'Syne',sans-serif;font-size:14px;font-weight:700;margin-bottom:1px}
.lp-svs{font-size:11px;color:var(--lp-gray-400);margin-bottom:9px}
.lp-btn-add{width:100%;padding:8px;background:var(--lp-yellow);border:none;border-radius:100px!important;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;color:#2A2000;cursor:pointer;transition:background .12s;display:flex;align-items:center;justify-content:center;gap:5px}
.lp-btn-add:hover{background:var(--lp-yellow-dark);color:var(--lp-white)}
.lp-btn-remove{width:100%;padding:6px;background:transparent;border:1.5px solid var(--lp-gray-150);border-radius:100px!important;font-family:'DM Sans',sans-serif;font-size:11px;color:var(--lp-gray-500);cursor:pointer;transition:all .12s;margin-top:5px}
.lp-btn-remove:hover{border-color:#E24B4A;color:#E24B4A}

/* Quotes */
.lp-qr{display:flex;align-items:center;gap:12px;padding:13px 18px;border-bottom:1px solid var(--lp-gray-50);flex-wrap:wrap}
.lp-qr:last-child{border-bottom:none}
.lp-qnum{font-family:'Syne',sans-serif;font-size:12px;font-weight:700;color:var(--lp-yellow-dark);width:76px;flex-shrink:0}
.lp-qm{flex:1;min-width:0}
.lp-qn{font-size:13px;font-weight:500;color:var(--lp-text)}
.lp-qs{font-size:12px;color:var(--lp-muted);margin-top:2px}
.lp-qamt{font-family:'Syne',sans-serif;font-size:13px;font-weight:700;color:var(--lp-text);white-space:nowrap}

/* Profile */
.lp-profile-top{display:flex;align-items:center;gap:16px;margin-bottom:22px;padding-bottom:20px;border-bottom:var(--lp-border)}
.lp-avatar-lg{width:58px;height:58px;border-radius:50%;background:var(--lp-yellow);display:flex;align-items:center;justify-content:center;font-family:'Syne',sans-serif;font-weight:700;font-size:20px;color:#2A2000;flex-shrink:0}
.lp-profile-name{font-family:'Syne',sans-serif;font-size:17px;font-weight:700;color:var(--lp-text)}
.lp-profile-email{font-size:13px;color:var(--lp-muted);margin-top:2px}
.lp-sec-label{font-family:'Syne',sans-serif;font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--lp-yellow-dark);margin:20px 0 10px}
.lp-pgridp{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* Forms */
.lp-fg{margin-bottom:12px}
.lp-fg label{display:block;font-size:12px;font-weight:500;color:var(--lp-gray-600);margin-bottom:4px}
.lp-fg input,.lp-fg select,.lp-fg textarea{width:100%;padding:9px 12px;border:1.5px solid var(--lp-gray-200);border-radius:var(--lp-radius-sm);font-family:'DM Sans',sans-serif;font-size:13px;color:var(--lp-text);background:var(--lp-white);outline:none;transition:border-color .2s}
.lp-fg input:focus,.lp-fg select:focus,.lp-fg textarea:focus{border-color:var(--lp-yellow)}
.lp-fg input::placeholder,.lp-fg textarea::placeholder{color:var(--lp-gray-400)}
.lp-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* Modal */
.lp-modal-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.35);z-index:99990;align-items:center;justify-content:center;padding:20px}
.lp-modal-backdrop.open{display:flex}
.lp-modal{background:var(--lp-white);border-radius:var(--lp-radius);width:100%;max-width:580px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,0.15)}
.lp-modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:var(--lp-border)}
.lp-modal-header h3{font-family:'Syne',sans-serif;font-size:15px;font-weight:700;color:var(--lp-text);margin:0}
.lp-modal-close{background:none;border:none;cursor:pointer;color:var(--lp-gray-400);padding:4px;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:color .12s}
.lp-modal-close:hover{color:var(--lp-text)}
.lp-modal-body{padding:20px 22px}
.lp-modal-footer{padding:0 22px 20px;display:flex;align-items:center;gap:10px}

/* Add to project modal */
.lp-project-select-list{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.lp-project-select-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1.5px solid var(--lp-gray-150);border-radius:var(--lp-radius-sm);cursor:pointer;transition:border-color .12s}
.lp-project-select-item:hover{border-color:var(--lp-yellow)}
.lp-project-select-item input[type="radio"]{accent-color:var(--lp-yellow-dark)}
.lp-project-select-item label{font-size:13px;font-weight:500;cursor:pointer}

/* Empty / misc */
.lp-empty{padding:24px 18px;text-align:center;color:var(--lp-muted);font-size:13px}
.lp-login-prompt{text-align:center;padding:48px 20px}
.lp-login-prompt p{font-size:15px;color:var(--lp-muted);margin-bottom:16px}
.lp-form-msg{font-size:13px}


/* ── Produktmodal ───────────────────────────────────────── */
.lp-product-modal .lp-modal{max-width:780px}
.lp-product-modal-body{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:start}
.lp-product-modal-images{background:var(--lp-white);border-right:var(--lp-border);padding:0}
.lp-product-main-img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;object-position:center}
.lp-product-thumbnails{display:flex;gap:6px;padding:10px;flex-wrap:wrap;border-top:var(--lp-border);background:var(--lp-white)}
.lp-product-thumb{width:54px;height:54px;object-fit:cover;border-radius:6px;border:2px solid transparent;cursor:pointer;transition:border-color .15s}
.lp-product-thumb:hover,.lp-product-thumb.active{border-color:var(--lp-yellow-dark)}
.lp-product-modal-info{padding:22px 24px;overflow-y:auto;max-height:70vh}
.lp-product-modal-name{font-family:'Syne',sans-serif;font-size:17px;font-weight:700;color:var(--lp-text);margin-bottom:4px;line-height:1.3}
.lp-product-modal-sku{font-size:12px;color:var(--lp-gray-400);margin-bottom:10px}
.lp-product-modal-cats{font-size:12px;color:var(--lp-muted);margin-bottom:12px}
.lp-product-modal-price{font-family:'Syne',sans-serif;font-size:22px;font-weight:700;color:var(--lp-text);margin-bottom:16px;padding-bottom:16px;border-bottom:var(--lp-border)}
.lp-product-modal-desc{font-size:13px;color:var(--lp-muted);line-height:1.65;margin-bottom:16px}
.lp-product-modal-desc p{margin-bottom:8px}
.lp-attrs-title{font-family:'Syne',sans-serif;font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--lp-yellow-dark);margin-bottom:10px;padding-left:12px}
.lp-attrs-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:16px}
.lp-attrs-table tr{border-bottom:1px solid var(--lp-gray-100)}
.lp-attrs-table tr:last-child{border-bottom:none}
.lp-attrs-table td{padding:8px 0;vertical-align:top}
.lp-attrs-table td:first-child{color:var(--lp-gray-600);font-weight:500;width:45%;padding-right:16px;padding-left:12px}
.lp-attrs-table td:last-child{color:var(--lp-text);padding-left:8px}
.lp-product-modal-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;padding-top:16px;border-top:var(--lp-border)}

/* ── Projektmodal ───────────────────────────────────────── */
.lp-project-modal-header-info{margin-bottom:20px}
.lp-project-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.lp-project-meta-item{}
.lp-project-meta-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:var(--lp-gray-400);margin-bottom:3px}
.lp-project-meta-value{font-size:13.5px;color:var(--lp-text);font-weight:500}
.lp-status-timeline{display:flex;align-items:center;gap:0;margin:20px 0;overflow-x:auto;padding-bottom:4px}
.lp-status-step{display:flex;flex-direction:column;align-items:center;flex:1;min-width:80px;position:relative}
.lp-status-step::before{content:'';position:absolute;top:14px;left:50%;width:100%;height:2px;background:var(--lp-gray-150);z-index:0}
.lp-status-step:last-child::before{display:none}
.lp-status-dot{width:28px;height:28px;border-radius:50%;border:2.5px solid var(--lp-gray-200);background:var(--lp-white);display:flex;align-items:center;justify-content:center;z-index:1;position:relative;flex-shrink:0}
.lp-status-dot svg{display:none}
.lp-status-step.done .lp-status-dot{background:var(--lp-yellow);border-color:var(--lp-yellow-dark)}
.lp-status-step.done .lp-status-dot svg{display:block}
.lp-status-step.current .lp-status-dot{background:var(--lp-white);border-color:var(--lp-yellow-dark);box-shadow:0 0 0 3px var(--lp-yellow-soft)}
.lp-status-step.done::before{background:var(--lp-yellow-mid)}
.lp-status-label{font-size:10px;color:var(--lp-muted);margin-top:6px;text-align:center;line-height:1.3}
.lp-status-step.current .lp-status-label{color:var(--lp-yellow-dark);font-weight:600}
.lp-project-products-title{font-family:'Syne',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--lp-text);margin-bottom:12px}
.lp-project-products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}
.lp-proj-prod-card{border:1.5px solid var(--lp-gray-150);border-radius:var(--lp-radius-sm);overflow:hidden;cursor:pointer}
.lp-proj-prod-card:hover{border-color:var(--lp-yellow)}
.lp-proj-prod-img{width:100%;aspect-ratio:1/1;background:var(--lp-gray-100);overflow:hidden}
.lp-proj-prod-img img{width:100%;height:100%;object-fit:cover;display:block}
.lp-proj-prod-name{font-size:11px;font-weight:500;color:var(--lp-text);padding:6px 8px;line-height:1.3}

/* Kategorier i filter */
.lp-filter-cat-group{margin-bottom:0}
.lp-filter-cat-main{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--lp-gray-100)}
.lp-filter-cat-main label{font-size:13px;font-weight:400;color:var(--lp-text);cursor:pointer;flex:1}
.lp-filter-cat-main input[type="checkbox"]{width:15px;height:15px;accent-color:var(--lp-yellow-dark);cursor:pointer;flex-shrink:0}
.lp-filter-cat-toggle{all:unset;cursor:pointer;color:var(--lp-gray-400);display:inline-flex!important;align-items:center;opacity:1!important;visibility:visible!important;flex-shrink:0}
.lp-filter-cat-toggle svg{transition:transform .2s;opacity:1!important;display:block!important;visibility:visible!important}
.lp-filter-cat-toggle.open svg{transform:rotate(180deg)}
.lp-filter-subcats{padding-left:12px;margin-top:4px;display:none}
.lp-filter-subcats.open{display:block}
.lp-filter-attr-group{margin-bottom:14px;padding-top:14px;border-top:1px solid var(--lp-gray-100)}
.lp-filter-attr-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--lp-gray-500);margin-bottom:8px;display:block}

/* Klickbar produktbild */
.lp-clickable-img{cursor:zoom-in;transition:opacity .15s}
.lp-clickable-img:hover{opacity:.88}

/* Lightbox */
.lp-lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:99999;align-items:center;justify-content:center}
.lp-lightbox.open{display:flex}
.lp-lightbox img{max-width:92vw;max-height:88vh;object-fit:contain;border-radius:8px}
.lp-lightbox-close{position:absolute;top:16px;right:20px;background:rgba(255,255,255,.15);border:none;border-radius:50%;width:36px;height:36px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:white}
.lp-lightbox-close:hover{background:rgba(255,255,255,.25)}

@media(max-width:700px){
  .lp-product-modal-body{grid-template-columns:1fr}
  .lp-product-modal-images{border-right:none;border-bottom:var(--lp-border)}
  .lp-product-modal-info{max-height:none;padding:16px}
  .lp-project-meta-grid{grid-template-columns:1fr}
  .lp-project-products-grid{grid-template-columns:1fr 1fr}
}

/* Produkt i projekt – ta bort knapp */
.lp-proj-prod-card{position:relative}
.lp-proj-prod-remove{position:absolute;top:4px;right:4px;background:none!important;border:none!important;box-shadow:none!important;border-radius:0!important;width:20px;height:20px;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;color:var(--lp-text);z-index:2}
.lp-proj-prod-remove:hover{opacity:.6}

/* Filter toggle (visas bara på mobil) */
.lp-filter-panel{padding:0}
.lp-filter-desktop{display:none}
.lp-filter-toggle{display:none;align-items:center;justify-content:space-between;padding:12px 16px;cursor:pointer;font-size:13px;font-weight:500;color:var(--lp-text);border:none;background:none;width:100%;font-family:'DM Sans',sans-serif}
.lp-filter-toggle svg{transition:transform .2s}
.lp-filter-toggle.open svg{transform:rotate(180deg)}
.lp-filter-toggle-count{background:var(--lp-yellow);color:#2A2000;font-size:10px;font-weight:700;padding:1px 7px;border-radius:20px;margin-left:6px}

/* ── Responsive ─────────────────────────────────────────── */

/* Tablet (960px och nedåt) */
@media(max-width:960px){
  .lp-portal-wrap{flex-direction:column;border-radius:0;border-left:none;border-right:none}
  /* Sidebar → horisontell navbar */
  .lp-sidebar{width:100%;min-height:auto;border-right:none;border-bottom:var(--lp-border);flex-direction:column}
  .lp-sb-logo{padding:14px 16px 10px}
  .lp-sb-user{padding:10px 16px}
  .lp-sb-nav{display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;padding:0;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .lp-sb-nav::-webkit-scrollbar{display:none}
  .lp-sb-section{display:none}
  .lp-ni{padding:12px 14px;font-size:12px;border-left:none;border-bottom:3px solid transparent;white-space:nowrap;flex-shrink:0}
  .lp-ni.active{border-left:none;border-bottom-color:var(--lp-yellow-dark);background:var(--lp-yellow-soft)}
  .lp-sb-bottom{border-top:var(--lp-border);padding:0}
  .lp-sb-bottom .lp-ni{border-bottom:none}
  /* Main */
  .lp-main{padding:16px}
  /* Stats */
  .lp-stats{grid-template-columns:1fr 1fr;gap:10px}
  /* Grids */
  .lp-g2{grid-template-columns:1fr}
  .lp-catgrid{grid-template-columns:1fr 1fr}
  .lp-savgrid{grid-template-columns:1fr 1fr}
  .lp-form-row{grid-template-columns:1fr}
  .lp-pgridp{grid-template-columns:1fr}
  /* Catalog: filter som kollapsbar panel */
  .lp-catalog-wrap{flex-direction:column}
  .lp-filter-sidebar{width:100%;border-right:none;border-bottom:var(--lp-border);padding:0;display:block}
  .lp-filter-sidebar-title{display:none}
  .lp-filter-toggle{display:flex!important}
  .lp-filter-panel{display:none;padding:14px 16px;border-top:var(--lp-border)}
  .lp-filter-panel.open{display:block}
  .lp-filter-group{margin-bottom:14px}
  /* Quote rows */
  .lp-qr{flex-wrap:wrap;gap:8px}
  .lp-qnum{width:auto}
  .lp-qamt{margin:0}
  /* Modal */
  .lp-modal{max-width:100%;margin:10px}
  .lp-modal-body{padding:16px 18px}
  .lp-modal-footer{padding:0 18px 18px}
}

/* Mobil (600px och nedåt) */
@media(max-width:600px){
  .lp-main{padding:12px}
  /* Stats: 2x2 */
  .lp-stats{grid-template-columns:1fr 1fr;gap:8px}
  .lp-sc{padding:12px 14px}
  .lp-val{font-size:22px}
  /* Produkter: 1 kolumn */
  .lp-catgrid{grid-template-columns:1fr}
  .lp-savgrid{grid-template-columns:1fr 1fr}
  .lp-pgrid{grid-template-columns:1fr 1fr}
  /* Topbar */
  .lp-topbar{flex-wrap:wrap;gap:10px}
  .lp-topbar .lp-btn-yellow{width:100%}
  /* Banner */
  .lp-banner{flex-direction:column;align-items:flex-start;gap:10px}
  .lp-banner .lp-btn-yellow{width:100%}
  /* Profil */
  .lp-profile-top{flex-direction:column;text-align:center}
  /* Sparade */
  .lp-svb{padding:10px}
  /* Catalog */
  .lp-cb{padding:8px}
  /* Sidebar nav ikoner */
  .lp-ni svg{display:none}
  .lp-ni{font-size:11.5px;padding:11px 11px}
  /* Forms */
  .lp-form-row{grid-template-columns:1fr}
}

/* Mycket liten skärm (400px och nedåt) */
@media(max-width:400px){
  .lp-savgrid{grid-template-columns:1fr}
  .lp-stats{grid-template-columns:1fr 1fr}
  .lp-sb-name{font-size:12px}
  .lp-sb-org{display:none}
}
