{"id":94524,"date":"2026-02-04T14:12:27","date_gmt":"2026-02-04T13:12:27","guid":{"rendered":"https:\/\/stonehouse.se\/?page_id=94524"},"modified":"2026-02-05T11:24:38","modified_gmt":"2026-02-05T10:24:38","slug":"kortportal","status":"publish","type":"page","link":"https:\/\/stonehouse.se\/en\/kortportal\/","title":{"rendered":"Card portal"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><div class=\"vc_row wpb_row vc_row-fluid\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\">\n\t<div class=\"wpb_raw_code wpb_raw_html wpb_content_element\" >\n\t\t<div class=\"wpb_wrapper\">\n\t\t\t<style>\n  \/* ====== LAYOUT \/ PORTAL LOOK ====== *\/\n  .kp-wrap { max-width: 1100px; margin: 0 auto; padding: 28px 16px; }\n  .kp-shell { background: #fff; border: 1px solid #edf0f5; border-radius: 18px; overflow: hidden; }\n  .kp-top { padding: 22px 22px 18px; background: linear-gradient(180deg, #fafbfc, #ffffff); }\n  .kp-title { margin: 0; font-size: 28px; line-height: 1.2; }\n  .kp-sub { margin: 8px 0 0; color: #555; max-width: 75ch; }\n\n  .kp-content { padding: 18px 22px 22px; }\n  .kp-grid { display: grid; grid-template-columns: 1fr 420px; gap: 16px; align-items: start; }\n  @media (max-width: 980px) { .kp-grid { grid-template-columns: 1fr; } }\n\n  .kp-card { background: #fff; border: 1px solid #edf0f5; border-radius: 16px; padding: 16px; }\n  .kp-card h2 { margin: 0 0 8px; font-size: 16px; }\n  .kp-muted { color: #666; font-size: 14px; margin: 6px 0 0; }\n\n  .kp-note { border-radius: 14px; padding: 12px 12px; background: #f7f9fc; border: 1px solid #edf0f5; color: #444; }\n  .kp-note strong { display: block; margin-bottom: 4px; }\n\n  .kp-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }\n  .kp-btn { display: inline-block; text-decoration: none; padding: 10px 12px; border-radius: 12px; border: 1px solid #e3e8f2; background: #fff; }\n  .kp-btn:hover { filter: brightness(0.98); }\n\n  .kp-divider { height: 1px; background: #edf0f5; margin: 14px 0; }\n\n  \/* ====== SHOW\/HIDE (logged in\/out) ====== *\/\n  .kp-auth-only { display: none; }\n  .kp-guest-only { display: block; }\n  body.logged-in .kp-auth-only { display: block; }\n  body.logged-in .kp-guest-only { display: none; }\n\n  \/* ====== LOGIN (clean + tydlig) ====== *\/\n  body:not(.logged-in) .kp-grid { grid-template-columns: 1fr 1fr; }\n  @media (max-width: 980px) { body:not(.logged-in) .kp-grid { grid-template-columns: 1fr; } }\n\n  .kp-login-head { margin: 0 0 10px; font-size: 18px; }\n  .kp-login-sub { margin: 0 0 12px; color: #555; font-size: 14px; }\n\n  .kp-card .woocommerce form { margin: 0; }\n  .kp-card .woocommerce .form-row { margin: 0 0 10px; }\n  .kp-card .woocommerce input[type=\"text\"],\n  .kp-card .woocommerce input[type=\"email\"],\n  .kp-card .woocommerce input[type=\"password\"]{\n    width: 100%;\n    padding: 12px 12px;\n    border-radius: 12px;\n    border: 1px solid #dde3ee;\n    background: #fff;\n  }\n\n  body:not(.logged-in) .kp-card .woocommerce form.login{\n    padding: 14px;\n    border-radius: 14px;\n    border: 1px solid #edf0f5;\n    background: #fafbfc;\n  }\n\n  .kp-card .woocommerce button.button{\n    width: 100%;\n    padding: 12px 14px;\n    border-radius: 12px;\n    border: 0;\n    cursor: pointer;\n  }\n\n  \/* St\u00e4da bort \u201cMy account\u201d-nav\/content i login-kortet om temat f\u00f6rs\u00f6ker visa n\u00e5got extra *\/\n  body:not(.logged-in) .kp-card .woocommerce .woocommerce-MyAccount-navigation,\n  body:not(.logged-in) .kp-card .woocommerce .woocommerce-MyAccount-content{\n    display:none !important;\n  }\n\n  \/* ====== PRODUCTS GRID (fix theme conflicts) ====== *\/\n  .kp-products ul.products{\n    display:grid !important;\n    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;\n    gap:14px !important;\n    margin:0 !important;\n    padding:0 !important;\n    list-style:none !important;\n  }\n  @media (max-width: 900px){\n    .kp-products ul.products{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }\n  }\n  @media (max-width: 560px){\n    .kp-products ul.products{ grid-template-columns: 1fr !important; }\n  }\n\n  .kp-products ul.products li.product{\n    float:none !important;\n    width:auto !important;\n    margin:0 !important;\n    clear:none !important;\n    box-sizing:border-box !important;\n\n    border: 1px solid #edf0f5;\n    border-radius: 16px;\n    padding: 14px;\n    background:#fff;\n  }\n\n  .kp-products ul.products li.product a img{\n    width:100% !important;\n    height:auto !important;\n    display:block !important;\n    border-radius:12px;\n  }\n\n  .kp-products ul.products li.product .woocommerce-loop-product__title{\n    font-size: 15px;\n    margin: 10px 0 6px;\n    word-break: normal !important;\n    overflow-wrap: anywhere !important;\n  }\n\n  \/* D\u00f6ljer k\u00f6pknapp\/added-to-cart i listan \u2013 man ska klicka in p\u00e5 produkten *\/\n  .kp-products ul.products li.product a.button,\n  .kp-products ul.products li.product .button,\n  .kp-products ul.products li.product .added_to_cart{\n    display:none !important;\n  }\n\n  \/* D\u00f6ljer \u201cresult count\u201d\/sortering som k\u00e4nns butik *\/\n  .kp-products .woocommerce-result-count,\n  .kp-products .woocommerce-ordering{\n    display:none !important;\n  }\n\n  \/* Pris ska synas (om rollen till\u00e5ter) \u2013 lite snygg spacing *\/\n  .kp-products ul.products li.product .price{\n    margin: 0;\n  }\n<\/style>\n\n<div class=\"kp-wrap\">\n  <div class=\"kp-shell\">\n\n    <div class=\"kp-top\">\n      <h1 class=\"kp-title\">Stonehouse Kortportal - F\u00f6r best\u00e4llning av f\u00f6retags- och unika kort.<\/h1>\n      <p class=\"kp-sub\">\n        Best\u00e4ll dina f\u00f6retagskort via v\u00e5r portal. Logga in f\u00f6r att se de kort som \u00e4r kopplade till ditt avtal. Leverans sker direkt till din adress inom 1-2 dagar.\n      <\/p>\n    <\/div>\n\n    <div class=\"kp-content\">\n\n      <div class=\"kp-grid\">\n\n        <!-- INFO (alltid synlig) -->\n        <div class=\"kp-card\">\n          <h2>S\u00e5 fungerar det<\/h2>\n\n          <div class=\"kp-note\">\n            <strong>F\u00f6r avtalskunder<\/strong>\n            N\u00e4r du loggar in visas bara de kort du har tillg\u00e5ng till. Klicka p\u00e5 ett kort f\u00f6r att \u00f6ppna produktsidan och g\u00f6ra dina val (namn, roll m.m.). Beh\u00f6ver du g\u00f6ra n\u00e5gra justeringar s\u00e5 kontakta oss.\n          <\/div>\n\n          <div class=\"kp-actions\">\n            <a class=\"kp-btn\" href=\"\/contact\/\">Kontakta oss<\/a>\n            <a class=\"kp-btn\" href=\"\/mitt-konto\/\">Mitt konto<\/a>\n          <\/div>\n\n          <div class=\"kp-divider\"><\/div>\n\n          <p class=\"kp-muted\" style=\"margin:0;\">\n            Om du inte ser n\u00e5gra kort efter inloggning kan det bero p\u00e5 att ditt konto saknar beh\u00f6righet. Kontakta oss s\u00e5 hj\u00e4lper vi dig.\n          <\/p>\n        <\/div>\n\n        <!-- H\u00d6GER: LOGIN eller \u201cinloggad\u201d-status -->\n        <div class=\"kp-card\">\n\n          <!-- UTLOGGAD -->\n          <div class=\"kp-guest-only\">\n            <h2 class=\"kp-login-head\">Logga in f\u00f6r att se dina kort<\/h2>\n            <p class=\"kp-login-sub\">Anv\u00e4nd de inloggningsuppgifter du f\u00e5tt av oss.<\/p>\n            <div class=\"kp-divider\"><\/div>\n\n            <div class=\"woocommerce\"><\/div>\n          <\/div>\n\n          <!-- INLOGGAD -->\n          <div class=\"kp-auth-only\">\n            <h2>Du \u00e4r inloggad<\/h2>\n            <p class=\"kp-muted\" style=\"margin:0;\">\n              Scrolla ned f\u00f6r att se dina kort.\n            <\/p>\n            <div class=\"kp-divider\"><\/div>\n            <a class=\"kp-btn\" href=\"\/mitt-konto\/\">Redigera kontoinst\u00e4llningar<\/a>\n          <\/div>\n\n        <\/div>\n      <\/div>\n\n      <div class=\"kp-divider\"><\/div>\n\n      <!-- PRODUKTER: bara n\u00e4r inloggad -->\n      <div class=\"kp-auth-only\">\n        <div class=\"kp-card kp-products\">\n          <h2>V\u00e4lj kort<\/h2>\n          <p class=\"kp-muted\" style=\"margin:0 0 12px;\">\n            Klicka p\u00e5 ett kort f\u00f6r att \u00f6ppna produktsidan och g\u00f6ra dina val.\n          <\/p>\n\n          <div class=\"woocommerce columns-3 \"><\/div>\n\n          <p class=\"kp-muted\" style=\"margin-top:12px;\">\n            Ser du inga produkter? D\u00e5 saknas koppling p\u00e5 ditt konto \u2013 kontakta oss s\u00e5 l\u00f6ser vi det.\n          <\/p>\n        <\/div>\n      <\/div>\n\n      <!-- UTLOGGAD: liten clean ruta ist\u00e4llet f\u00f6r produkter -->\n      <div class=\"kp-guest-only\">\n        <div class=\"kp-card\">\n          <h2>Dina kort visas efter inloggning<\/h2>\n          <p class=\"kp-muted\" style=\"margin:0;\">\n            Logga in ovan f\u00f6r att se ditt kortutbud och kunna best\u00e4lla.\n          <\/p>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n  \/\/ Extra s\u00e4kerhet: om temat av n\u00e5gon anledning inte s\u00e4tter body.logged-in korrekt,\n  \/\/ s\u00e5 g\u00f6r vi en mild toggle baserat p\u00e5 om \"Logga ut\" finns i sidan.\n  (function(){\n    try {\n      var body = document.body;\n      if (body.classList.contains('logged-in')) return;\n\n      \/\/ Om det finns en logga-ut l\u00e4nk n\u00e5gonstans, anta inloggad\n      var logoutLink = document.querySelector('a[href*=\"customer-logout\"], a[href*=\"logout\"]');\n      if (logoutLink) body.classList.add('logged-in');\n    } catch(e){}\n  })();\n<\/script>\n\n\t\t<\/div>\n\t<\/div>\n<\/div><\/div><\/div><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"Stonehouse Kortportal - F\u00f6r best\u00e4llning av f\u00f6retags- och unika kort. Best\u00e4ll dina f\u00f6retagskort via v\u00e5r portal. Logga in f\u00f6r att","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-94524","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/pages\/94524","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/comments?post=94524"}],"version-history":[{"count":6,"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/pages\/94524\/revisions"}],"predecessor-version":[{"id":94539,"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/pages\/94524\/revisions\/94539"}],"wp:attachment":[{"href":"https:\/\/stonehouse.se\/en\/wp-json\/wp\/v2\/media?parent=94524"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}