:root{
  --guardian-blue:#003a70;
  --guardian-accent:#009fe3;
  --text:#1f2937;
  --muted:#6b7280;
  --bg:#f6f8fb;
  --card:#ffffff;
  --border:#e5e7eb;
  --shadow:0 2px 12px rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--text);background:var(--bg)}
.wrapper{max-width:1200px;margin:24px auto;padding:0 16px}
.header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.brand{font-size:1.2rem;line-height:1.2;margin:0;color:var(--guardian-blue);font-weight:800;letter-spacing:.2px}
.logo{width:160px;height:auto}

.langswitch{display:flex;align-items:center;gap:12px;position:relative}
.lang-trigger{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--border);border-radius:999px;background:#fff;cursor:pointer;font-size:12px;box-shadow:var(--shadow)}
.lang-trigger::after{content:'';width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-top:6px solid #6b7280;margin-left:6px}
.lang-menu{position:absolute;right:0;top:110%;min-width:220px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);padding:6px;display:none;z-index:20}
.lang-menu[aria-hidden="false"]{display:block}
.lang-item{display:flex;align-items:center;gap:8px;width:100%;border:0;background:transparent;padding:8px 10px;border-radius:10px;cursor:pointer;font-size:13px}
.lang-item:hover,.lang-item[aria-current=true]{background:#f2f6fb}
.lang-item .flag{font-size:18px}

.card{background:var(--card);border:1px solid var(--border);border-radius:14px;box-shadow:0 2px 12px rgba(0,0,0,.05);padding:16px}
.controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}
.input{flex:1 1 260px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:14px;outline:none}
.select{flex:0 0 220px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:14px;background:white}
.badges{display:flex;gap:8px;align-items:center;margin-left:auto}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;font-size:12px;border:1px solid var(--border);background:#fff;white-space:nowrap}
.toggle{padding:8px 12px;border-radius:10px;border:1px solid var(--border);background:#fff;cursor:pointer;font-size:13px}
.toggle:hover{background:#f2f6fb}

.table-wrap{overflow:auto}
table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--border);border-radius:12px;overflow:hidden;table-layout:fixed}
thead th{background:var(--guardian-blue);color:white;text-align:left;font-weight:600;padding:12px 14px;font-size:14px;position:sticky;top:0;width:25%}
tbody td{border-top:1px solid var(--border);padding:10px 14px;font-size:14px;background:white;width:25%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
tbody tr:nth-child(even) td{background:#fbfdff}

.meta{font-size:12px;color:var(--muted);margin-top:8px}
details.make{border:1px solid var(--border);border-radius:12px;background:#fff;margin:10px 0;padding:0}
details.make[open]{box-shadow:0 2px 8px rgba(0,0,0,.03)}
details.make summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,#fff,#fafcff)}
details.make summary::-webkit-details-marker{display:none}
.summary-make{font-weight:700;color:var(--guardian-blue)}
.count{font-size:12px;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:2px 8px}

.chips td[data-label*="Kapazität"]{white-space:normal}
.chip{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:28px;padding:0 10px;margin:2px 6px 2px 0;
  border-radius:999px;border:1px solid var(--border);background:#fff;box-shadow:var(--shadow);
  font-size:12px;font-weight:600;color:var(--guardian-blue);
}

@media (max-width:900px){
  .select{flex:1 1 180px}
}
/* Mobile: card view */
@media (max-width:720px){
  thead{display:none}
  table,tbody,tr,td{display:block;width:100%}
  tbody tr{
    border:1px solid var(--border);
    border-radius:12px;
    box-shadow:var(--shadow);
    margin:12px 0;
    overflow:hidden;
  }
  tbody td{
    display:flex;justify-content:space-between;align-items:center;
    padding:12px 14px;border:0;border-bottom:1px solid var(--border);
    background:white;width:auto;white-space:normal
  }
  tbody td:last-child{border-bottom:0}
  tbody td::before{content:attr(data-label);font-weight:600;color:#374151;margin-right:16px}
  /* Hide brand cell in mobile to reduce redundancy */
  td[data-label="Marke"]{display:none}
}


/* Footer: meta left with label+date, copyright right, same font size */
.footer{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;font-size:12px;}
.footer .meta{margin:0;text-align:left;}
.footer .copy{margin:0;text-align:right;color:#666;font-size:inherit;}



/* Footer: meta left & label+date localized, copyright right, same size */
.footer{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;font-size:12px;}
.footer .meta{margin:0;text-align:left;}
.footer .copy{margin:0;text-align:right;color:#666;font-size:inherit;}

/* CARA badge next to brand logo */
.cara-logo{max-height:24px;vertical-align:middle;margin-left:8px;opacity:.95}
@media (min-width:768px){.cara-logo{max-height:27px}}

img[alt="Laddkraft"]{max-height:24px !important;height:auto !important;width:auto !important}