.shop-header-bar { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.shop-trust { display:flex; gap:10px; flex-wrap:wrap; font-size:0.82rem; color:#555; }
.shop-trust span {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 12px; background:#f0f7ff; border:1px solid #c5d8ef;
  border-radius:999px; font-weight:600; color:#1a2d4f;
}
.shop-kurv-knap { position:relative; padding:10px 18px; background:#1a2d4f; color:white; border:none; border-radius:8px; font-weight:700; cursor:pointer; font-size:0.95rem; }
.shop-kurv-knap:hover { background:#1565c0; }
.kurv-badge { position:absolute; top:-6px; right:-6px; background:#e65100; color:white; font-size:0.72rem; font-weight:700; min-width:20px; height:20px; border-radius:10px; display:flex; align-items:center; justify-content:center; padding:0 5px; }
.shop-filter { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px; align-items:center; }
.shop-filter input { flex:1; min-width:180px; padding:10px 14px; border:1.5px solid #d0d8e8; border-radius:7px; font-size:0.9rem; outline:none; }
.shop-fbtn { padding:8px 16px; border:1.5px solid #d0d8e8; border-radius:20px; background:white; font-size:0.85rem; font-weight:600; color:#555; cursor:pointer; }
.shop-fbtn.aktiv { background:#1a2d4f; color:white; border-color:#1a2d4f; }
.shop-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:20px; }
.shop-kort { background:white; border-radius:12px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,0.07); display:flex; flex-direction:column; transition:transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; position:relative; border:1px solid transparent; }
.shop-fav { position:absolute; top:10px; right:10px; z-index:2; width:36px; height:36px; border-radius:50%; border:none; background:rgba(255,255,255,0.92); font-size:1.1rem; cursor:pointer; box-shadow:0 1px 4px rgba(0,0,0,0.12); line-height:1; }
.shop-fav.aktiv { color:#e65100; background:#fff3e0; }
.shop-kort:hover { transform:translateY(-3px); box-shadow:0 10px 28px rgba(21,101,192,0.12); border-color:rgba(21,101,192,0.12); }
.shop-kort-img { width:100%; height:150px; object-fit:contain; background:#f4f6f9; display:block; }
.shop-kort-placeholder { width:100%; height:150px; display:flex; align-items:center; justify-content:center; font-size:3rem; background:#f4f6f9; }
.shop-kort-body { padding:16px; flex:1; display:flex; flex-direction:column; }
.shop-kort-producent { font-size: 0.78rem; color: #555; margin-bottom: 4px; }
.cit-producent-tekst { font-size: 0.9rem; color: #333; margin: 0 0 12px; }
.cit-varemærke-note { font-size: 0.75rem; color: #888; line-height: 1.45; margin: 12px 0 0; }
.chk-garanti-note { font-size: 0.82rem; color: #555; background: #f0f7ff; border-left: 3px solid #1565c0; padding: 10px 12px; margin: 0 0 12px; line-height: 1.45; border-radius: 0 6px 6px 0; }
.shop-kort-specs { font-size:0.8rem; color:#888; margin-bottom:10px; flex:1; }
.shop-kort-pris { font-size:1.25rem; font-weight:700; color:#1565c0; margin-bottom:12px; }
.shop-kort-btns { display:flex; gap:8px; }
.btn-tilfoej { flex:1; padding:10px; background:#1a2d4f; color:white; border:none; border-radius:7px; font-weight:700; cursor:pointer; font-size:0.85rem; }
.btn-tilfoej:hover { background:#1565c0; }
.btn-tilfoej:disabled { background:#ccc; cursor:not-allowed; }
.btn-detalje { padding:10px 14px; background:#e3f2fd; color:#1565c0; border:none; border-radius:7px; font-weight:600; cursor:pointer; font-size:0.85rem; }
.shop-grade { position:absolute; top:10px; right:10px; width:28px; height:28px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:0.9rem; color:white; box-shadow:0 2px 6px rgba(0,0,0,0.2); }
.shop-type { position:absolute; top:10px; left:10px; font-size:0.7rem; font-weight:700; padding:3px 9px; border-radius:12px; background:rgba(26,45,79,0.85); color:white; text-transform:uppercase; }
.shop-status { font-size:0.75rem; font-weight:700; padding:3px 10px; border-radius:10px; display:inline-block; margin-bottom:8px; }
.shop-status.tilgaengelig { background:#e8f5e9; color:#2e7d32; }
.shop-status.reserveret { background:#fff3e0; color:#e65100; }

.kurv-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:400; }
.kurv-panel { position:fixed; top:0; right:0; width:min(420px,100vw); height:100vh; background:white; z-index:401; display:flex; flex-direction:column; box-shadow:-4px 0 24px rgba(0,0,0,0.15); transform:translateX(100%); transition:transform 0.25s ease; padding-bottom: env(safe-area-inset-bottom); }
.kurv-panel.aben { transform:translateX(0); }
.kurv-overlay.aben { display:block; }
.kurv-top { padding:18px 20px; border-bottom:1px solid #eee; display:flex; justify-content:space-between; align-items:center; }
.kurv-top h2 { color:#1a2d4f; font-size:1.2rem; }
.kurv-luk { background:none; border:none; font-size:1.4rem; cursor:pointer; color:#888; min-width:44px; min-height:44px; }
.kurv-linjer { flex:1; overflow-y:auto; padding:16px 20px; }
.kurv-linje { display:flex; gap:12px; padding:12px 0; border-bottom:1px solid #f0f0f0; align-items:flex-start; }
.kurv-linje-info { flex:1; }
.kurv-linje-navn { font-weight:700; font-size:0.9rem; color:#1a2d4f; }
.kurv-linje-pris { font-size:0.85rem; color:#1565c0; font-weight:600; margin-top:3px; }
.kurv-fjern { background:none; border:none; color:#c62828; cursor:pointer; font-size:0.8rem; font-weight:600; padding:8px 0; min-height:44px; }
.kurv-tom { text-align:center; color:#667788; padding:40px 20px; }
.kurv-tom.cit-empty-state { border:none; background:transparent; }

/* Loading skeleton */
@keyframes shop-shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}
.shop-skel-kort {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  border: 1px solid #eef2f8;
}
.shop-skel-img {
  height: 150px;
  background: linear-gradient(90deg, #f0f4f8 25%, #e4eaf2 50%, #f0f4f8 75%);
  background-size: 200% 100%;
  animation: shop-shimmer 1.3s ease-in-out infinite;
}
.shop-skel-body { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.shop-skel-line {
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, #f0f4f8 25%, #e4eaf2 50%, #f0f4f8 75%);
  background-size: 200% 100%;
  animation: shop-shimmer 1.3s ease-in-out infinite;
}
.shop-skel-line--short { width: 45%; }
.shop-skel-line--price { width: 35%; height: 18px; animation-delay: 0.1s; }
.shop-skel-btns { display: flex; gap: 8px; margin-top: 4px; }
.shop-skel-btn {
  flex: 1;
  height: 38px;
  border-radius: 7px;
  background: linear-gradient(90deg, #f0f4f8 25%, #e4eaf2 50%, #f0f4f8 75%);
  background-size: 200% 100%;
  animation: shop-shimmer 1.3s ease-in-out infinite;
  animation-delay: 0.15s;
}
.shop-skel-btn--sm { flex: 0 0 72px; }

/* Focus rings — webshop */
.shop-kurv-knap:focus-visible,
.shop-fbtn:focus-visible,
.btn-tilfoej:focus-visible,
.btn-detalje:focus-visible,
.btn-checkout:focus-visible,
.shop-fav:focus-visible,
.kurv-luk:focus-visible {
  outline: 3px solid #1565c0;
  outline-offset: 2px;
}
.shop-filter input:focus-visible {
  outline: none;
  border-color: #4fc3f7;
  box-shadow: 0 0 0 3px rgba(79, 195, 247, 0.25);
}

body.dark .shop-trust span { background: #0d2137; border-color: #2a3a4a; color: #b0c4d8; }
body.dark .shop-skel-kort { background: #1a2535; border-color: #2a3a4a; }
body.dark .shop-skel-img,
body.dark .shop-skel-line,
body.dark .shop-skel-btn {
  background: linear-gradient(90deg, #131f2c 25%, #1e2d3d 50%, #131f2c 75%);
  background-size: 200% 100%;
}
body.dark .shop-kort:hover { border-color: rgba(79, 195, 247, 0.2); box-shadow: 0 10px 28px rgba(0,0,0,0.35); }
.kurv-bund { padding:20px; border-top:1px solid #eee; background:#f8fafc; }
.kurv-total { display:flex; justify-content:space-between; font-size:1.15rem; font-weight:700; color:#1a2d4f; margin-bottom:16px; }
.btn-checkout { width:100%; padding:14px; background:#2e7d32; color:white; border:none; border-radius:8px; font-size:1rem; font-weight:700; cursor:pointer; }
.btn-checkout:hover { background:#1b5e20; }
.btn-checkout:disabled { background:#ccc; cursor:not-allowed; }

.chk-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:500; align-items:center; justify-content:center; padding:20px; }
.chk-boks { background:white; border-radius:14px; padding:32px; max-width:480px; width:100%; max-height:90vh; overflow-y:auto; }
.chk-boks h2 { color:#1a2d4f; margin-bottom:6px; }
.chk-boks p { color:#666; font-size:0.9rem; margin-bottom:20px; }
.chk-fg { display:flex; flex-direction:column; gap:5px; margin-bottom:12px; }
.chk-fg label { font-size:0.84rem; font-weight:600; color:#444; }
.chk-fg input, .chk-fg select, .chk-fg textarea { padding:10px 12px; border:1.5px solid #d0d8e8; border-radius:6px; font-size:0.9rem; font-family:inherit; outline:none; }
.chk-fg input:focus, .chk-fg select:focus { border-color:#4fc3f7; }
.chk-btns { display:flex; gap:10px; margin-top:18px; justify-content:flex-end; }
.btn-chk-send { padding:12px 24px; background:#2e7d32; color:white; border:none; border-radius:7px; font-weight:700; cursor:pointer; }
.btn-chk-annuller { padding:12px 18px; background:#eee; border:none; border-radius:7px; cursor:pointer; }
.chk-succes { text-align:center; padding:20px 0; display:none; }
.chk-succes strong { color:#2e7d32; font-size:1.1rem; display:block; margin-bottom:8px; }
.chk-ord-nr { background:#e8f5e9; padding:10px 16px; border-radius:8px; font-weight:700; color:#1b5e20; margin:12px 0; }

.det-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:350; align-items:center; justify-content:center; padding:20px; overflow-y:auto; }
.det-boks { background:white; border-radius:14px; max-width:640px; width:100%; overflow:hidden; }
.det-header { background:#1a2d4f; color:white; padding:20px 24px; display:flex; justify-content:space-between; align-items:flex-start; }
.det-body { padding:24px; }
.det-specs { width:100%; border-collapse:collapse; font-size:0.88rem; margin:16px 0; }
.det-specs th { text-align:left; padding:8px 12px; background:#f4f6f9; color:#555; width:35%; }
.det-specs td { padding:8px 12px; border-bottom:1px solid #f0f0f0; }
.test-item { font-size:0.82rem; padding:6px 10px; border-radius:5px; margin-bottom:4px; }
.test-item.pass { background:#e8f5e9; color:#2e7d32; }

body.dark .shop-kort, body.dark .kurv-panel, body.dark .chk-boks, body.dark .det-boks { background:#1a2535; color:#d0dce8; }
body.dark .shop-kort-navn, body.dark .kurv-top h2, body.dark .kurv-total, body.dark .chk-boks h2, body.dark .det-header { color:#81d4fa; }
body.dark .shop-filter input, body.dark .chk-fg input, body.dark .chk-fg select, body.dark .chk-fg textarea { background:#131f2c; color:#d0dce8; border-color:#2a3a4a; }
body.dark .shop-fbtn { background:#131f2c; color:#99b0c8; border-color:#2a3a4a; }
body.dark .shop-fbtn.aktiv { background:#1565c0; border-color:#1565c0; color:white; }
body.dark .shop-kort-img, body.dark .shop-kort-placeholder { background:#131f2c; }
body.dark .kurv-bund { background:#131f2c; border-color:#2a3a4a; }
body.dark .btn-chk-annuller { background:#2a3a4a; color:#d0dce8; }
body.dark .det-specs th { background:#131f2c; color:#99b0c8; }

.cit-gpsr-boks { background:#f0f7ff; border:1px solid #bbdefb; border-radius:10px; padding:14px 16px; margin:16px 0; font-size:0.88rem; line-height:1.55; }
.cit-gpsr-titel { margin:0 0 8px; font-size:0.95rem; color:#1565c0; }
.cit-gpsr-tekst { margin:0 0 10px; color:#555; }
.cit-pris-gammel { font-size:0.82rem; color:#888; }
body.dark .cit-gpsr-boks { background:#0d2137; border-color:#1565c0; color:#d0dce8; }
body.dark .cit-gpsr-titel { color:#81d4fa; }