:root {
  --violet: #572381;
  --violet-dark: #371950;
  --violet-mid: #572381;
  --violet-light: #f4eef8;
  --white: #ffffff;
  --ink-1: #1a1a1a;
  --ink-2: #555555;
  --grau-1: #777777;
  --grau-2: #999999;
  --grau-3: #cccccc;
  --grau-4: #eeeeee;
  --grau-5: #f8f7fa;
  --shadow-card: 0 2px 16px rgba(87,35,129,.07);
  --shadow-header: 0 1px 8px rgba(87,35,129,.06);
  --ease: cubic-bezier(.37,0,.63,1);
  --font: "Opinion Pro", Arial, sans-serif;
  --radius-xl: 10px;
  --radius-md: 8px;
  --radius-sm: 5px;
  --green: #76b82a;
  --red: #e30613;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-width: 320px; font-family: var(--font); color: var(--ink-1); background: var(--white); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
.hidden { display: none !important; }

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  min-height: 76px;
  padding: 12px clamp(20px, 4vw, 40px);
  border-bottom: 1px solid rgba(87,35,129,.1);
  box-shadow: var(--shadow-header);
  background: var(--white);
  position: sticky;
  top: 0;
  z-index: 20;
}
.topbar-nav, .topbar-right { display: flex; align-items: center; gap: 10px; }
.topbar-back { display: flex; align-items: center; gap: 5px; font-size: 13px; color: var(--grau-2); text-decoration: none; transition: color .18s; }
.topbar-back:hover { color: var(--violet); }
.topbar-back svg { width: 15px; height: 15px; }
.topbar-sep { color: var(--grau-3); font-size: 13px; }
.topbar-current { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.user-badge { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 7px 10px; border-radius: 20px; background: var(--violet-light); color: var(--violet); font-size: 11.5px; font-weight: 600; }

.hero { background: linear-gradient(180deg, var(--violet) 0%, var(--violet-dark) 100%); padding: clamp(28px,4vw,52px) clamp(28px,5vw,60px); color: var(--white); }
.hero-inner { width: 100%; max-width: 1760px; margin: 0 auto; }
.hero h1 { margin: 0 0 8px; font-size: clamp(24px,2.8vw,36px); font-weight: 800; letter-spacing: -.02em; }
.hero p { margin: 0; font-size: clamp(13px,1.1vw,16px); opacity: .78; max-width: 720px; line-height: 1.6; }

.login-wrap { padding: clamp(36px,6vw,80px) clamp(28px,5vw,60px) 96px; }
.login-panel { max-width: 760px; margin: 0 auto; padding: 30px; border: 1.5px solid rgba(87,35,129,.12); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; }
.login-icon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 14px; background: var(--violet-light); color: var(--violet); }
.login-icon svg { width: 24px; height: 24px; }
.login-eyebrow { margin-bottom: 5px; color: var(--grau-2); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.login-copy h2 { margin: 0 0 5px; font-size: 20px; }
.login-copy p { margin: 0; color: var(--grau-1); font-size: 13px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 40px; padding: 9px 14px; border: 1.5px solid transparent; border-radius: var(--radius-sm); cursor: pointer; font-size: 12.5px; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap; transition: border-color .15s, color .15s, background .18s, transform .15s; }
.btn:hover { transform: translateY(-1px); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn svg { width: 12px; height: 12px; }
.btn-primary { background: var(--violet); border-color: var(--violet); color: var(--white); }
.btn-primary:hover { background: var(--violet-dark); border-color: var(--violet-dark); }
.btn-secondary { background: var(--white); border-color: var(--grau-3); color: var(--violet); }
.btn-secondary:hover { border-color: var(--violet); }
.btn-danger { background: #fff5f5; border-color: #e7bdbd; color: var(--red); }
.btn-danger:hover { border-color: var(--red); }
.btn-ghost { min-height: 0; padding: 3px 0; border: 0; background: transparent; color: var(--grau-1); }
.btn-ghost:hover { color: var(--violet); background: transparent; transform: none; }
.btn-sm { min-height: 32px; padding: 6px 10px; font-size: 11.5px; }
.message { grid-column: 2 / -1; min-height: 1em; margin: -8px 0 0; color: var(--red); font-size: 12px; }

.search-bar { background: var(--white); border-bottom: 1px solid rgba(87,35,129,.08); padding: 16px clamp(28px,5vw,60px); }
.search-bar-inner { width: 100%; max-width: 1760px; margin: 0 auto; }
.search-box { position: relative; max-width: 620px; }
.search-box .search-ico { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); width: 17px; height: 17px; color: var(--grau-2); pointer-events: none; }
.search-box input { width: 100%; padding: 10px 100px 10px 42px; border: 1.5px solid var(--grau-3); border-radius: 10px; font-size: 14px; color: var(--ink-1); background: var(--grau-5); outline: none; transition: border-color .18s, box-shadow .18s, background .18s; }
.search-box input:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(87,35,129,.1); background: var(--white); }
.search-box input::placeholder { color: var(--grau-2); }
.result-count { position: absolute; right: 13px; top: 50%; transform: translateY(-50%); color: var(--grau-2); font-size: 11px; pointer-events: none; }


.search-controls { display: flex; align-items: center; gap: 12px; }
.search-controls .search-box { flex: 1 1 620px; max-width: 620px; }
.search-field-wrap { flex: 0 1 250px; min-width: 180px; }
.search-field { min-width: 180px; background-color: var(--white); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.main-wrap { padding: clamp(24px,3vw,40px) clamp(28px,5vw,60px) 64px; }
.main-inner { width: 100%; max-width: 1760px; margin: 0 auto; display: grid; grid-template-columns: 272px minmax(0,1fr); gap: 24px; }
.error-box { width: 100%; max-width: 1760px; margin: 0 auto 18px; padding: 12px 15px; border: 1px solid #e7bdbd; border-radius: 9px; background: #fff5f5; color: var(--red); font-size: 13px; }
.tree-wrap { align-self: start; position: sticky; top: 94px; }
.tree-panel { border: 1.5px solid rgba(87,35,129,.12); border-radius: var(--radius-xl); background: var(--white); box-shadow: var(--shadow-card); overflow: hidden; max-height: calc(100vh - 118px); display: flex; flex-direction: column; }
.tree-head { padding: 14px 18px 12px; border-bottom: 1px solid rgba(87,35,129,.08); font-size: 11px; font-weight: 700; color: var(--grau-2); letter-spacing: .12em; text-transform: uppercase; flex: none; }
.tree-scroll { overflow-y: auto; padding: 8px 0; }
.tree-empty { padding: 20px 18px; color: var(--grau-2); font-size: 12px; line-height: 1.5; }
.cat-btn { display: flex; align-items: center; gap: 8px; width: 100%; padding: 9px 16px; background: none; border: none; cursor: pointer; font-size: 12.5px; font-weight: 700; color: var(--ink-2); text-align: left; transition: color .15s, background .15s; }
.cat-btn:hover { color: var(--violet); background: var(--violet-light); }
.cat-btn.open { color: var(--violet); }
.cat-btn-ico { width: 15px; height: 15px; opacity: .55; flex: none; }
.cat-btn-arr { margin-left: auto; width: 13px; height: 13px; opacity: .5; transition: transform .2s var(--ease); flex: none; }
.cat-btn.open .cat-btn-arr { transform: rotate(90deg); }
.cat-items { overflow: hidden; }
.dev-btn { display: block; width: 100%; padding: 8px 16px 8px 38px; background: none; border: none; border-left: 2.5px solid transparent; cursor: pointer; font-size: 12.5px; font-weight: 400; color: var(--ink-2); text-align: left; transition: color .15s, background .15s, border-color .15s; }
.dev-btn:hover { color: var(--violet); background: var(--violet-light); }
.dev-btn.active { color: var(--violet); font-weight: 600; background: var(--violet-light); border-left-color: var(--violet); }
.dev-art { display: block; margin-top: 2px; color: var(--grau-2); font-size: 10.5px; font-weight: 400; }
.dev-btn.active .dev-art { color: rgba(87,35,129,.55); }

.dl-panel { min-width: 0; }
.empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 360px; border: 2px dashed rgba(87,35,129,.15); border-radius: var(--radius-xl); color: var(--grau-2); gap: 12px; text-align: center; padding: 40px; }
.empty-state svg { width: 44px; height: 44px; opacity: .25; }
.empty-state p { margin: 0; font-size: 14px; line-height: 1.6; }
.dev-header { margin-bottom: 18px; }
.dev-title { font-size: clamp(18px,2vw,26px); font-weight: 800; color: var(--ink-1); letter-spacing: -.02em; overflow-wrap: anywhere; }
.dev-art-label { margin-top: 3px; font-size: 13px; color: var(--grau-2); }
.dev-badge { display: inline-flex; align-items: center; gap: 5px; margin-top: 10px; padding: 4px 10px; background: rgba(40,160,80,.1); border-radius: 20px; font-size: 11px; color: var(--green); font-weight: 600; }
.dev-badge svg { width: 11px; height: 11px; }
.dl-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.dl-grid > .dl-sec:last-child:nth-child(odd) { grid-column: 1 / -1; }
.dl-sec { min-width: 0; padding: 0; overflow: hidden; border-radius: var(--radius-md); }
.dl-sec-head { display: flex; align-items: center; gap: 10px; padding: 13px 16px 11px; border-bottom: 1px solid rgba(87,35,129,.06); }
.dl-sec-ico { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; flex: none; }
.dl-sec-ico svg { width: 16px; height: 16px; }
.ico-firmware { background: rgba(87,35,129,.12); color: var(--violet); }
.ico-parameterfiles { background: rgba(30,120,200,.1); color: #1e78c8; }
.ico-dokumente { background: rgba(200,130,0,.1); color: #c28000; }
.ico-default { background: rgba(0,143,143,.1); color: #008f8f; }
.dl-sec-title { font-size: 13.5px; font-weight: 700; color: var(--ink-1); }
.dl-sec-desc { margin-top: 1px; font-size: 11px; color: var(--grau-2); }
.dl-sec-body { padding: 13px 16px; }
.dl-current { display: flex; align-items: center; gap: 10px; padding: 9px 12px; background: var(--grau-5); border: 1.5px solid rgba(87,35,129,.07); border-radius: var(--radius-sm); margin-bottom: 9px; }
.dl-cur-info { flex: 1; min-width: 0; }
.dl-fname { font-size: 12.5px; font-weight: 600; color: var(--ink-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dl-fmeta { margin-top: 2px; font-size: 10.5px; color: var(--grau-2); }
.ver-badge { display: inline-flex; align-items: center; padding: 1.5px 6px; border-radius: 10px; font-size: 10px; font-weight: 700; background: rgba(87,35,129,.1); color: var(--violet); margin-right: 5px; }
.dl-na { padding: 9px 12px; background: var(--grau-5); border-radius: var(--radius-sm); font-size: 12px; color: var(--grau-2); font-style: italic; margin-bottom: 9px; }
.older-toggle.open { color: var(--violet); }
.older-toggle svg { width: 13px; height: 13px; transition: transform .2s var(--ease); }
.older-toggle.open svg { transform: rotate(180deg); }
.no-older { font-size: 11px; color: var(--grau-3); }
.older-list { display: none; margin-top: 8px; border-top: 1px solid var(--grau-4); padding-top: 6px; }
.older-list.open { display: block; }
.older-row { display: flex; align-items: center; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--grau-4); }
.older-row:last-child { border-bottom: none; }
.older-info { flex: 1; min-width: 0; }
.older-name { font-size: 12px; font-weight: 500; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.older-meta { font-size: 10.5px; color: var(--grau-2); }

.faq-wrap { padding: 0 clamp(28px,5vw,60px) 80px; }
.faq-inner { width: 100%; max-width: 1760px; margin: 0 auto; }
.section-head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; padding-top: 8px; border-top: 1px solid rgba(87,35,129,.08); }
.section-ico { width: 36px; height: 36px; border-radius: 10px; background: var(--violet-light); display: grid; place-items: center; flex: none; }
.section-ico svg { width: 18px; height: 18px; color: var(--violet); }
.section-title { font-size: clamp(16px,1.6vw,22px); font-weight: 700; color: var(--ink-1); letter-spacing: -.02em; }
.section-divider { flex: 1; height: 1px; background: linear-gradient(to right,rgba(87,35,129,.1),transparent); margin-left: 8px; }
.faq-list { display: flex; flex-direction: column; gap: 7px; }
.faq-item { border: 1.5px solid rgba(87,35,129,.1); border-radius: var(--radius-md); overflow: hidden; }
.faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; background: var(--white); cursor: pointer; font-size: 13.5px; font-weight: 600; color: var(--ink-1); transition: background .15s; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '⌄'; color: var(--violet); font-size: 18px; line-height: 1; transition: transform .2s var(--ease); }
.faq-item[open] summary { background: var(--violet-light); }
.faq-item[open] summary::after { transform: rotate(180deg); }
.faq-a { padding: 12px 18px 18px; color: var(--ink-2); font-size: 13.5px; line-height: 1.7; }
.faq-a code { padding: 2px 5px; border-radius: 4px; background: var(--grau-5); color: var(--violet); }
.site-footer { background:var(--violet); color:var(--white); border-top:0; padding:20px clamp(28px,5vw,60px); font-size:12px; }
.site-footer-inner { width:100%; max-width:1760px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-footer-copy { line-height:1.5; }
.site-footer-release { margin-left:auto; opacity:.72; white-space:nowrap; font-size:11px; font-weight:650; }
.site-footer-links { display:flex; align-items:center; gap:8px; white-space:nowrap; }
.site-footer a { color:var(--white); text-decoration:none; font-weight:650; }
.site-footer a:hover, .site-footer a:focus-visible { text-decoration:underline; text-underline-offset:3px; }
@media (max-width:700px) {
  .site-footer-inner { align-items:flex-start; flex-direction:column; gap:10px; }
  .site-footer-release { margin-left:0; }
}

@media (max-width: 800px) {
  .main-inner { grid-template-columns: 1fr; }
  .tree-wrap { position: static; }
  .tree-panel { max-height: none; }
  .dl-grid { grid-template-columns: 1fr; }
  .dl-grid > .dl-sec:last-child:nth-child(odd) { grid-column: 1; }
  .topbar { padding: 12px 20px; }
  .user-badge { display: none !important; }
  .hero { padding: 28px 20px; }
  .login-panel { grid-template-columns: auto 1fr; }
  .login-panel .btn-primary { grid-column: 1 / -1; width: 100%; }
  .message { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
  .topbar-current, .topbar-sep { display: none; }
  .search-box input { padding-right: 16px; }
  .result-count { position: static; display: block; margin-top: 6px; transform: none; }
  .dl-current, .older-row { align-items: stretch; flex-direction: column; }
  .btn { justify-content: center; }
}

.portal-tabs { display:flex; align-self:stretch; align-items:stretch; justify-content:center; gap:3px; min-width:0; overflow:visible; }
.portal-tab { display:flex; align-items:center; padding:0 12px; border:0; border-bottom:3px solid transparent; background:transparent; color:var(--grau-1); text-decoration:none; font-size:12px; font-weight:650; white-space:nowrap; transition:.15s; cursor:pointer; }
.portal-tab:hover { color:var(--violet); background:var(--violet-light); }
.portal-tab.active { color:var(--violet); border-bottom-color:var(--violet); }
@media (max-width: 1050px) { .topbar { flex-wrap:wrap; } .portal-tabs { order:3; width:100%; justify-content:flex-start; min-height:40px; } }
@media (max-width: 900px) { .portal-tabs { overflow-x:auto; overflow-y:hidden; } }


/* Gemeinsame Komponenten: Downloadcenter ist visueller Master */
.card { background: var(--white); border: 1.5px solid rgba(87,35,129,.10); border-radius: var(--radius-xl); box-shadow: var(--shadow-card); padding: 22px; }
.form-control { width: 100%; min-height: 40px; border: 1.5px solid var(--grau-3); border-radius: var(--radius-sm); padding: 8px 10px; background: var(--white); color: var(--ink-1); outline: none; transition: border-color .18s, box-shadow .18s, background .18s; }
.form-control:focus { border-color: var(--violet); box-shadow: 0 0 0 3px rgba(87,35,129,.1); }
.form-control:disabled { background: var(--grau-5); color: var(--grau-1); }
.field { display: grid; gap: 6px; color: var(--grau-1); font-size: 12px; font-weight: 700; }
.check-field { display: flex; align-items: center; gap: 7px; min-height: 40px; color: var(--ink-2); font-size: 12px; font-weight: 700; white-space: nowrap; }
.check-option { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid var(--grau-4); border-radius: var(--radius-sm); background: var(--white); color: var(--ink-2); font-size: 12px; font-weight: 600; }
.notice { width: 100%; max-width: 1760px; margin: 14px auto 0; padding: 12px 15px; border: 1px solid; border-radius: var(--radius-sm); font-size: 13px; font-weight: 650; }
.notice-success { background: #f1faf4; border-color: #b9dfc6; color: #176b3a; }
.notice-error { background: #fff5f5; border-color: #e7bdbd; color: var(--red); }
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 20px; font-size: 10.5px; font-weight: 700; white-space: nowrap; }
.badge-success { background: rgba(40,160,80,.10); color: var(--green); }
.badge-warning { background: #fff5df; color: #9a6500; }
.badge-muted { background: var(--grau-5); color: var(--grau-1); }
.table-wrap { width: 100%; overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: 10px; border-bottom: 1px solid var(--grau-4); vertical-align: top; text-align: left; }
.table thead th { color: var(--grau-1); font-size: 11px; font-weight: 700; }
.table tbody th { color: var(--ink-2); }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.muted { color: var(--grau-1); font-size: 13px; line-height: 1.55; }
.empty { padding: 18px 4px; color: var(--grau-1); font-size: 13px; }
code { padding: 2px 5px; border-radius: 4px; background: var(--grau-5); color: var(--violet); }

/* Verwaltung */
.admin-message-wrap { padding: 0 clamp(28px,5vw,60px); }
.admin-content { width: min(1760px, calc(100vw - clamp(28px, 4vw, 80px))); max-width: none; margin: 0 auto; padding: 28px 0 64px; display: grid; gap: 18px; }
.admin-content > .card { min-width: 0; }
.section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.section-heading h2 { margin: 4px 0 6px; font-size: clamp(17px,1.8vw,22px); }
.section-heading p { margin: 0; }
.card-kicker { color: var(--violet); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.grid-form { display: grid; gap: 12px; align-items: end; padding: 15px; margin: 0 0 18px; border: 1px solid var(--grau-4); border-radius: var(--radius-md); background: var(--grau-5); }
.role-create-form { grid-template-columns: 1fr 1.35fr auto; }
.binding-form { grid-template-columns: 1.1fr 1fr minmax(240px,2fr) auto auto; }
.file-type-form { grid-template-columns: 1fr 1.3fr 2fr .7fr auto auto; }
.filter-form { grid-template-columns: 1.2fr 2fr .8fr auto auto; }
.wide-field { min-width: 0; }
.cap-fieldset { grid-column: 1 / -1; border: 0; padding: 0; margin: 4px 0; }
.cap-fieldset legend { margin-bottom: 7px; color: var(--grau-1); font-size: 12px; font-weight: 700; }
.capability-list { display: flex; gap: 8px; flex-wrap: wrap; }
.stack-list { display: grid; gap: 10px; }
.editor-row { padding: 13px; border: 1px solid var(--grau-4); border-radius: var(--radius-md); background: var(--white); }
.editor-grid { display: grid; grid-template-columns: 1fr 1fr 1fr auto; gap: 10px; align-items: end; }
.role-editor { grid-template-columns: 1fr 1.5fr auto auto; }
.binding-editor { grid-template-columns: 1.1fr 1fr 1.8fr auto auto; }
.filetype-editor { grid-template-columns: 1fr 1.2fr 1.8fr .6fr auto auto; }
.status-field { align-self: stretch; }
.status-control { display:flex; align-items:center; gap:8px; min-height:40px; padding:8px 10px; border:1.5px solid var(--grau-3); border-radius:var(--radius-sm); background:var(--white); color:var(--ink-2); font-size:12px; font-weight:700; }
.status-control input { margin:0; }
.filetype-actions { align-self:end; min-height:40px; flex-wrap:nowrap; }
.filetype-actions .btn { min-height:40px; }

.filter-editor { grid-template-columns: 1.2fr 2fr .8fr auto auto; }
.row-actions { display: flex; gap: 7px; justify-content: flex-end; align-items: center; flex-wrap: wrap; }
.row-capabilities { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--grau-4); }
.dropzone { min-height: 180px; border: 2px dashed rgba(87,35,129,.20); border-radius: var(--radius-xl); background: var(--grau-5); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; text-align: center; padding: 24px; color: var(--grau-1); transition: border-color .15s, background .15s; }
.dropzone strong { color: var(--violet-dark); font-size: 18px; }
.dropzone.dragover { border-color: var(--violet); background: var(--violet-light); }
.dropzone small { max-width: 680px; }
.permission-table { min-width: 820px; }
.permission-table thead th small { display: block; font-weight: 400; }
.permission-table tbody th { min-width: 170px; }
.permission-cell { display: grid; gap: 7px; min-width: 135px; }
.permission-cell label { display: flex; align-items: center; gap: 6px; font-size: 11.5px; }
.table-head, .audit-row { display: grid; gap: 10px; align-items: center; }
.table-head { padding: 0 10px 8px; color: var(--grau-1); text-transform: uppercase; letter-spacing: .05em; font-size: 10px; font-weight: 800; }
.audit-head, .audit-row { grid-template-columns: 1.05fr 1.3fr 1.2fr 2fr 1.5fr; }
.audit-row { padding: 12px 10px; border-top: 1px solid var(--grau-4); font-size: 12px; line-height: 1.4; }
.audit-action { color: var(--violet-dark); font-weight: 800; }
.request-id { overflow-wrap: anywhere; color: var(--grau-1); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; }
.product-preview { display: grid; gap: 16px; margin-top: 18px; }
.meta-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
.meta-item { padding: 10px 12px; border: 1px solid var(--grau-4); border-radius: var(--radius-sm); background: var(--grau-5); }
.meta-item span { display: block; margin-bottom: 3px; color: var(--grau-1); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.meta-item strong { overflow-wrap: anywhere; font-size: 12.5px; }
.toolbar { display: flex; align-items: end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.toolbar .field { min-width: min(100%,360px); }
.match-summary { display: flex; gap: 8px; flex-wrap: wrap; }
.data-table { min-width: 760px; }
.data-table td { max-width: 320px; overflow-wrap: anywhere; font-size: 12px; }
.version-active { display: grid; gap: 8px; }
.version-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px; border: 1px solid var(--grau-4); border-radius: var(--radius-md); background: var(--white); }
.version-main { min-width: 0; display: grid; gap: 5px; }
.stat-row { display: flex; flex-wrap: wrap; gap: 12px; color: var(--grau-1); font-size: 11.5px; }
dialog:not([open]) { display: none !important; }
.dialog { width: min(620px,calc(100% - 30px)); padding: 0; border: 0; border-radius: var(--radius-xl); box-shadow: 0 24px 80px rgba(30,15,40,.22); }
.dialog::backdrop { background: rgba(25,17,31,.38); }
.dialog-card { padding: 24px; }
.dialog-card h2 { margin: 6px 0 12px; }
.dialog-copy { margin-bottom: 20px; color: var(--ink-2); font-size: 13px; line-height: 1.55; }

@media (max-width: 1050px) {
  .admin-content { padding-left: 20px; padding-right: 20px; }
  .grid-form, .editor-grid, .role-editor, .binding-editor, .filetype-editor, .filter-editor { grid-template-columns: 1fr 1fr; }
  .cap-fieldset, .wide-field, .row-capabilities, .row-actions { grid-column: 1 / -1; }
  .audit-head { display: none; }
  .audit-row { grid-template-columns: 1fr 1fr; }
  .audit-change, .request-id { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
  .admin-message-wrap { padding: 0 16px; }
  .admin-content { padding: 18px 12px 42px; }
  .card { padding: 17px; border-radius: var(--radius-md); }
  .grid-form, .editor-grid, .role-editor, .binding-editor, .filetype-editor, .filter-editor, .audit-row, .meta-grid { grid-template-columns: 1fr; }
  .cap-fieldset, .wide-field, .row-capabilities, .row-actions, .audit-change, .request-id { grid-column: auto; }
  .section-heading, .version-row { align-items: stretch; flex-direction: column; }
  .row-actions { justify-content: stretch; }
  .row-actions .btn { flex: 1; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .toolbar .field { min-width: 0; }
}

@media (max-width: 720px) {
  .search-controls { align-items: stretch; flex-direction: column; }
  .search-controls .search-box { max-width: none; flex-basis: auto; }
  .search-field-wrap, .search-field { width: 100%; min-width: 0; }
}


/* Downloadcenter: tabellarische, datengetriebene Produktsuche */
.search-results-card {
  width: 100%;
  max-width: 1760px;
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
}

.search-results-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 20px 22px 17px;
  border-bottom: 1px solid var(--grau-4);
  background: var(--white);
}

.search-results-head h2 {
  margin: 4px 0 5px;
  color: var(--ink-1);
  font-size: clamp(17px,1.8vw,22px);
}

.search-results-head p {
  max-width: 760px;
  margin: 0;
  color: var(--grau-1);
  font-size: 12.5px;
  line-height: 1.55;
}

.search-start {
  min-height: 280px;
  margin: 22px;
}

.product-results-wrap {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.result-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.result-table th,
.result-table td {
  min-width: 150px;
  max-width: 360px;
  padding: 12px 14px;
  overflow-wrap: anywhere;
  border-bottom: 1px solid var(--grau-4);
  background: var(--white);
  font-size: 12.5px;
  line-height: 1.45;
}

.result-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--grau-5);
  color: var(--grau-1);
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
  white-space: nowrap;
}

.product-result-row:hover > td {
  background: #fbf9fc;
}

.product-field-cell:empty::after {
  content: "–";
  color: var(--grau-3);
}

.result-expand-col {
  position: sticky;
  left: 0;
  z-index: 3;
  width: 54px;
  min-width: 54px !important;
  max-width: 54px !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  text-align: center !important;
  box-shadow: 1px 0 0 var(--grau-4);
}

.result-table thead .result-expand-col {
  z-index: 5;
  background: var(--grau-5);
}


.product-detail-row > td {
  min-width: 0;
  max-width: none;
  padding: 0 !important;
  background: var(--violet-light) !important;
}

.result-files {
  min-width: min(760px, calc(100vw - 90px));
  padding: 18px 22px 22px 70px;
  border-bottom: 1px solid rgba(87,35,129,.12);
}

.result-files-head {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 11px;
  color: var(--violet-dark);
  font-size: 12.5px;
}

.result-file-table {
  min-width: 720px;
  border: 1px solid rgba(87,35,129,.10);
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--white);
}

.result-file-table th,
.result-file-table td {
  padding: 9px 11px;
  background: var(--white);
  font-size: 12px;
}

.result-file-table thead th {
  background: var(--grau-5);
}

.result-file-table th:first-child,
.result-file-table td:first-child {
  width: 160px;
}

.result-file-table td:last-child {
  width: 120px;
  text-align: right;
}

.file-type-cell {
  vertical-align: top;
}

.file-type-label {
  font-weight: 700;
  color: var(--ink-2);
}

.file-type-description {
  display: block;
  margin-top: 3px;
  line-height: 1.35;
  white-space: normal;
}

.file-name-cell {
  min-width: 280px;
  max-width: 520px;
  overflow-wrap: anywhere;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 11.5px !important;
}

@media (max-width: 700px) {
  .search-results-head {
    padding: 17px;
  }

  .search-start {
    min-height: 220px;
    margin: 14px;
  }

  .result-files {
    padding: 14px 14px 18px 58px;
  }

  .result-table th,
  .result-table td {
    min-width: 130px;
    padding: 10px 11px;
  }
}


.search-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  padding: 14px 18px;
  border-top: 1px solid var(--grau-4);
  background: var(--grau-5);
}

.search-pagination-nav,
.search-pagination-settings {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.search-pagination-settings {
  margin-left: auto;
  justify-content: flex-end;
}

.search-page-status {
  min-width: 190px;
  color: var(--grau-1);
  font-size: 12px;
  font-weight: 650;
  text-align: center;
}

.search-page-edge {
  min-width: 42px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.search-pagination-field {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  white-space: nowrap;
  color: var(--grau-1);
  font-size: 12px;
  font-weight: 650;
}

.search-pagination-input,
.search-pagination-select {
  height: 34px;
  border: 1px solid var(--grau-3);
  border-radius: 6px;
  background: #fff;
  color: var(--grau-1);
  font: inherit;
  padding: 0 8px;
}

.search-pagination-input {
  width: 70px;
}

.search-pagination-select {
  min-width: 72px;
}

.search-pagination-input:focus,
.search-pagination-select:focus {
  outline: 2px solid rgba(91, 35, 129, .18);
  outline-offset: 1px;
  border-color: var(--violet);
}

@media (max-width: 760px) {
  .search-pagination,
  .search-pagination-nav,
  .search-pagination-settings {
    justify-content: center;
  }

  .search-pagination-settings {
    margin-left: 0;
    width: 100%;
  }

  .search-page-status {
    min-width: 0;
    font-size: 11px;
  }
}

@media (max-width: 520px) {
  .search-pagination-nav {
    width: 100%;
  }

  .search-pagination-nav .btn {
    padding-left: 8px;
    padding-right: 8px;
  }

  .search-pagination-field {
    font-size: 11px;
  }
}


.field small {
  color: var(--grau-2);
  font-size: 10.5px;
  font-weight: 500;
  line-height: 1.35;
}

.btn-action-busy {
  cursor: wait;
  opacity: .78;
}

.btn-action-success,
.btn-action-success:hover {
  background: #eef9f1;
  border-color: #8bc79d;
  color: #176b3a;
  transform: none;
}

.btn-action-complete,
.btn-action-complete:hover {
  background: var(--grau-5);
  border-color: var(--grau-3);
  color: var(--ink-2);
  transform: none;
}


.file-index-filter-panel { margin: 4px 0 14px; }
.file-index-toolbar {
  display: grid;
  grid-template-columns: minmax(280px,2.4fr) repeat(4,minmax(130px,1fr)) auto;
  align-items: end;
  gap: 12px;
  margin: 0;
}
.file-index-search-field { min-width: 0; }
.file-index-status-field { min-width: 0; }
.file-index-advanced { margin-top: 10px; border-top: 1px solid var(--grau-4); padding-top: 8px; }
.file-index-advanced > summary { cursor: pointer; color: var(--violet); font-weight: 700; width: max-content; }
.file-index-advanced-grid { display: grid; grid-template-columns: minmax(220px,1.4fr) minmax(220px,1fr) minmax(260px,1.2fr); gap: 12px; align-items: end; padding-top: 10px; }
.file-index-filter-group { border: 0; padding: 0; margin: 0; min-width: 0; }
.file-index-filter-group legend { font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.file-index-filter-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }

.file-index-table td:last-child,
.file-index-table th:last-child {
  width: 205px;
  min-width: 205px;
  text-align: right;
}

.file-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  white-space: nowrap;
}

.btn-icon {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  padding: 7px;
  border: 1px solid var(--grau-3);
  border-radius: 9px;
  background: var(--white);
  color: var(--violet);
}

.btn-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.btn-eye-closed {
  color: var(--grau-2);
  background: var(--grau-5);
}

.btn-danger-icon {
  color: #a72c2c;
  border-color: #efc7c7;
  background: #fff8f8;
}

.btn-icon:hover {
  border-color: currentColor;
  transform: translateY(-1px);
}

.file-deprovisioned td {
  opacity: .62;
}

.file-deprovisioned td:last-child,
.file-deprovisioned td:nth-last-child(2) {
  opacity: 1;
}

@media (max-width: 1050px) {
  .file-index-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .file-index-search-field { grid-column: 1 / -1; }
  .quality-toggle { justify-self: start; }
  .file-index-advanced-grid { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .file-index-toolbar { grid-template-columns: 1fr; }
  .file-index-search-field { grid-column: auto; }
  .file-index-filter-pair { grid-template-columns: 1fr; }
}


.product-draft-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  align-items: end;
  gap: 14px;
  margin: 18px 0;
}

.product-draft-toolbar .notice {
  margin: 0;
}


.product-editor-toolbar {
  border-top: 1px solid var(--grau-4);
  padding-top: 16px;
}

.product-editor-table {
  min-width: max(900px, max-content);
  width: max-content;
}

#product-editor-table {
  max-height: 68vh;
  overflow: auto;
  scrollbar-gutter: stable;
}

#product-editor-table .product-editor-table thead th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--weiss, #fff);
}

#product-editor-table .product-editor-table thead .product-expand-col {
  z-index: 5;
}

.product-editor-table th,
.product-editor-table td {
  vertical-align: middle;
}

.product-editor-table .product-expand-col {
  width: 46px;
  min-width: 46px;
  background: inherit;
  text-align: center;
}

.product-cell-input {
  min-width: 150px;
}

.product-row-changed {
  background: #fff9e9;
}

.product-row-deleted {
  background: var(--grau-5);
  opacity: .68;
  text-decoration-color: currentColor;
}

.product-row-deleted td:not(:first-child):not(:last-child) {
  text-decoration: line-through;
}

.product-row-deleted td:first-child,
.product-row-deleted td:last-child {
  opacity: 1;
  text-decoration: none;
}

.btn-toggle { font-size: 20px; font-weight: 600; line-height: 1; }
.btn-edit svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.product-file-detail-row > td {
  padding: 12px 18px 18px 54px;
  background: var(--grau-5);
}

.nested-file-table {
  margin: 0;
  background: var(--white);
}

.compact-empty {
  padding: 12px;
}

#product-version-detail-card {
  scroll-margin-top: 90px;
}

@media (max-width: 950px) {
  .product-draft-toolbar {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .product-draft-mode-box {
    align-items: stretch;
  }

  .product-draft-mode-box .field {
    flex: 1;
  }
}

.capability-group {
  margin: 0 0 14px;
  padding: 12px 14px 14px;
  border: 1px solid var(--grau-4);
  border-radius: 10px;
}

.capability-group legend { padding: 0 6px; font-weight: 700; }
.capability-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px 14px; }
.check-option-readonly { opacity: .65; }
.product-row-new { background: #eef8ff; }
.btn-refresh-match { font-size: 20px; line-height: 1; }
.column-label-edit{border:0;background:transparent;font:inherit;font-weight:700;padding:0;cursor:pointer;color:inherit}.column-label-edit:hover{text-decoration:underline}.file-type-override{min-width:190px}.file-index-table td small.muted{display:block;margin-top:.25rem}

/* Compact role administration */
.capability-group {
  margin: 0 0 10px;
  padding: 0;
  overflow: hidden;
}
.capability-group > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  cursor: pointer;
  font-weight: 700;
  list-style: none;
}
.capability-group > summary::-webkit-details-marker { display: none; }
.capability-group > summary::before {
  content: "+";
  flex: 0 0 auto;
  font-size: 1.25rem;
  line-height: 1;
  color: var(--primary, #5d1f8f);
}
.capability-group[open] > summary::before { content: "−"; }
.capability-group .capability-grid { padding: 0 14px 14px 40px; }
.capability-group-count {
  margin-left: auto;
  font-size: .82rem;
  font-weight: 600;
  color: var(--text-muted, #6d6870);
}

.role-binding-cards {
  display: grid;
  gap: 14px;
}
.role-binding-card {
  border: 1px solid var(--grau-4);
  border-radius: 14px;
  padding: 16px 18px;
  background: #fff;
}
.role-binding-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.role-binding-card-head h3 { margin: 2px 0 0; }
.role-binding-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  white-space: nowrap;
}
.role-binding-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}
.role-binding-actions .btn:disabled { opacity: .45; cursor: not-allowed; }

.role-binding-dialog { width: min(680px, calc(100vw - 32px)); }
.role-binding-dialog-card { min-width: 0; }
.dialog-heading,
.dialog-footer,
.role-binding-dialog-add-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.dialog-heading { justify-content: space-between; }
.dialog-footer { justify-content: space-between; margin-top: 16px; }
.role-binding-dialog-add-row { margin: 18px 0 14px; }
.role-binding-dialog-add-row .form-control { flex: 1; }
.role-binding-dialog-list { min-height: 220px; }
.dialog-close {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border: 0;
  background: transparent url("icons/close.svg") center / 24px 24px no-repeat;
  color: transparent;
  font-size: 0;
  cursor: pointer;
  line-height: 1;
  padding: 8px;
  border-radius: var(--radius-sm, 4px);
}
.dialog-close:hover { background-color: rgba(92,36,131,.08); }
.dialog-close:focus-visible { outline: 2px solid var(--kessel-violet, #5C2483); outline-offset: 2px; }

@media (max-width: 680px) {
  .role-binding-card-head,
  .dialog-footer,
  .role-binding-dialog-add-row { align-items: stretch; flex-direction: column; }
  .role-binding-all { align-self: flex-start; }
  .role-binding-actions .btn { flex: 1 1 100%; }
}

.product-editor-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 14px 0;
}

.product-column-head {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.column-actions {
  position: relative;
}

.column-actions > summary {
  cursor: pointer;
  list-style: none;
  border: 1px solid var(--grau-4);
  border-radius: 6px;
  padding: 1px 7px;
  background: var(--white);
}

.column-actions > summary::-webkit-details-marker { display: none; }

.column-actions-menu {
  position: absolute;
  z-index: 12;
  top: calc(100% + 4px);
  right: 0;
  display: grid;
  gap: 6px;
  min-width: 150px;
  padding: 8px;
  border: 1px solid var(--grau-4);
  border-radius: 8px;
  background: var(--white);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}

.card-subsection {
  margin-top: 16px;
  padding: 12px 14px;
  border: 1px solid var(--grau-4);
  border-radius: 8px;
}

.card-subsection > summary {
  cursor: pointer;
  font-weight: 700;
}
.quality-toggle { display:flex; align-items:center; gap:8px; align-self:end; min-height:38px; padding:0 4px 8px; font-size:13px; font-weight:700; }
.quality-stat { width:100%; text-align:left; cursor:pointer; font:inherit; }
.quality-stat:hover { border-color:var(--lila); }
.quality-stat { color:inherit; }

/* File-index analysis table: column filters + server-side sort controls. */
.file-index-table thead th{vertical-align:top}
.file-index-table .file-sort{border:0;background:transparent;padding:0;font:inherit;font-weight:700;color:inherit;cursor:pointer;white-space:nowrap}
.file-index-table .file-sort:hover{text-decoration:underline}
.recognized-product{white-space:nowrap;font-weight:700}
.recognized-products-details summary{cursor:pointer;color:var(--lila,#552080);font-weight:700;white-space:nowrap}
.recognized-products-list{display:grid;gap:.25rem;margin-top:.4rem;padding:.45rem;border:1px solid var(--border,#ddd);border-radius:.5rem;background:var(--surface,#fff)}
.recognized-products-list code{white-space:nowrap}

/* v26: konsistente kompakte Topbar, Administration/Profil außerhalb des scrollenden Nav-Containers */
.topbar-brand { display:flex; align-items:center; flex:0 0 auto; }
.topbar-brand .topbar-current { text-decoration:none; color:var(--ink-2); white-space:nowrap; }
.admin-nav-dynamic { display:flex; align-self:stretch; }
.topbar-menu-trigger.active { color:var(--violet); border-bottom-color:var(--violet); }
.profile-button { display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:7px 11px; border:1px solid rgba(87,35,129,.14); border-radius:18px; background:var(--violet-light); color:var(--violet); font-size:12px; font-weight:700; cursor:pointer; }
.profile-button:hover, .profile-button[aria-expanded="true"] { border-color:rgba(87,35,129,.35); background:#eee3f7; }
.topbar-popover { position:fixed; z-index:1000; min-width:210px; max-width:min(360px,calc(100vw - 16px)); padding:8px; border:1px solid var(--grau-4); border-radius:10px; background:var(--white); box-shadow:0 12px 34px rgba(30,10,45,.18); }
.topbar-popover[hidden] { display:none !important; }
.topbar-menu-items { display:grid; gap:2px; }
.admin-nav-menu-item, .topbar-menu-link, .language-menu-item, .export-menu-item { display:block; width:100%; padding:10px 12px; border:0; border-radius:7px; background:transparent; color:var(--ink-2); text-align:left; text-decoration:none; font:inherit; font-size:12px; font-weight:650; cursor:pointer; }
.admin-nav-menu-item:hover, .admin-nav-menu-item.active, .topbar-menu-link:hover, .language-menu-item:hover, .language-menu-item[aria-current="true"], .export-menu-item:hover { background:var(--violet-light); color:var(--violet); }
.profile-popover { min-width:300px; padding:14px; }
.profile-popover-heading { margin-bottom:10px; color:var(--violet); font-size:13px; font-weight:800; }
.profile-row { display:grid; grid-template-columns:120px minmax(0,1fr); gap:10px; padding:7px 0; border-bottom:1px solid var(--grau-4); font-size:12px; }
.profile-row > span { color:var(--grau-1); }
.profile-row > strong { min-width:0; overflow-wrap:anywhere; color:var(--ink-2); font-weight:650; }
.profile-row-stack { align-items:start; }
.profile-role-list { display:flex; flex-wrap:wrap; gap:5px; }
.profile-role { padding:3px 7px; border-radius:12px; background:var(--violet-light); color:var(--violet); font-size:10.5px; font-weight:700; }
.profile-actions { display:flex; justify-content:flex-end; padding-top:12px; }
@media (max-width:1050px) { .topbar { gap:12px; } .portal-tabs { order:3; width:100%; } }
@media (max-width:620px) { .profile-popover { min-width:min(300px,calc(100vw - 16px)); } .kessel-logo { display:none; } }
.legacy-auth-control { display:none !important; }
.portal-tab[hidden], .profile-button[hidden], .topbar-menu-trigger[hidden] { display:none !important; }

/* Produktdaten-CSV-Export: aktueller Entwurf, veröffentlichter Stand und historische Versionen */
.export-menu { position: relative; display: inline-flex; }
.export-menu-popover {
  position: absolute;
  z-index: 40;
  top: calc(100% + 6px);
  left: 0;
  min-width: 250px;
  padding: 7px;
  border: 1px solid var(--grau-4);
  border-radius: var(--radius-sm);
  background: var(--white);
  box-shadow: 0 10px 28px rgba(30,10,45,.16);
}
.export-menu-popover[hidden] { display: none !important; }

/* v27.8: KESSEL Brandportal GUI alignment */
.kessel-logo {
  display:block;
  width:clamp(164px, 13vw, 220px);
  height:auto;
  margin-left:18px;
  flex:0 0 auto;
}
.brand-icon { display:block; width:18px; height:18px; }
.btn .brand-icon { width:18px; height:18px; }
.search-box .search-ico { object-fit:contain; }

/* KESSEL button hierarchy: Primary = one dominant positive action, Tertiary = utility/download. */
.btn-tertiary {
  min-height:34px;
  padding:6px 8px;
  border-color:transparent;
  background:transparent;
  color:var(--violet);
}
.btn-tertiary:hover {
  border-color:transparent;
  background:var(--violet-light);
  color:var(--violet-dark);
  transform:none;
}
.btn-tertiary:focus-visible,
.btn-secondary:focus-visible,
.btn-primary:focus-visible,
.btn-icon:focus-visible,
.profile-button:focus-visible,
.portal-tab:focus-visible {
  outline:3px solid rgba(92,36,131,.18);
  outline-offset:2px;
}

/* Role editor: owner and enabled state belong to the same grid, no floating auto-width island. */
.role-editor {
  grid-template-columns:minmax(150px,1fr) minmax(220px,1.45fr) minmax(220px,1fr) minmax(96px,.45fr);
  align-items:end;
}
.role-owner-field { min-width:0; }
.role-owner-field .form-control { min-width:0; }
.role-owner-field small { min-height:1.35em; }
.role-enabled-field {
  align-self:end;
  justify-content:flex-start;
  min-height:40px;
  padding:0 0 1px;
}
.role-editor > .row-actions {
  grid-column:1 / -1;
  justify-content:flex-end;
  padding-top:2px;
}

/* Official icon already carries its circular geometry. */
.btn-toggle .brand-icon { width:22px; height:22px; }

@media (max-width:1050px) {
  .role-editor { grid-template-columns:1fr 1fr; }
  .role-owner-field, .role-enabled-field { min-width:0; }
  .role-editor > .row-actions { grid-column:1 / -1; }
}
@media (max-width:700px) {
  .kessel-logo { width:150px; margin-left:8px; }
  .role-editor { grid-template-columns:1fr; }
  .role-editor > .row-actions { grid-column:auto; }
}
@media (max-width:520px) {
  .kessel-logo { width:132px; }
}


/* v27.17 product key regex editor */
#product-match-regex-dialog { width: min(1100px, calc(100vw - 48px)); max-width: none; }
.product-match-regex-card { width: 100%; box-sizing: border-box; }
.product-match-regex-card-clean { width: 100%; max-height: none; overflow-y: visible; gap: 16px; box-sizing: border-box; }
.regex-intro { margin: -2px 0 0; color: var(--ink-2); font-size: 14px; line-height: 1.5; }
.regex-intro code { color: var(--violet); font-weight: 800; }
.regex-template-field { margin: 0; }
.regex-preset-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: -4px; }
.regex-preset-chips .btn { min-height: 34px; padding: 7px 11px; }
.regex-test-section { margin-top: 4px; padding: 18px; border: 1px solid var(--grau-3); border-radius: var(--radius-md); background: var(--white); }
.regex-test-heading-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.regex-test-heading-row h3 { margin: 2px 0 0; font-size: 18px; }
.regex-test-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.regex-test-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.regex-test-result { flex: 0 0 auto; max-width: 45%; padding: 7px 10px; border-radius: 999px; font-size: 12px; font-weight: 800; line-height: 1.3; }
.regex-test-result.notice-success { background: #e8f6ed; color: #15743a; }
.regex-test-result.notice-danger { background: #fff0ef; color: #aa221e; }
.regex-help { margin-top: 0; padding-top: 2px; }
.regex-help summary { cursor: pointer; font-weight: 700; color: var(--violet); }
.regex-dialog-footer { margin-top: 0; justify-content: space-between; }
@media (max-width: 760px) {
  #product-match-regex-dialog { width: calc(100vw - 20px); max-height: calc(100vh - 20px); overflow-y: auto; }
  .product-match-regex-card-clean { width: 100%; }
  .regex-test-grid { grid-template-columns: 1fr; }
  .regex-test-heading-row { display: block; }
  .regex-test-result { max-width: none; margin-top: 10px; width: fit-content; }
}

/* v27.21: topbar action/dropdown controls share one visual language */
.language-button{min-width:64px;justify-content:center}

/* Product language views */
.language-popover{min-width:180px}
.language-dialog{width:min(1180px,calc(100vw - 40px));max-width:none}
.language-dialog-card{width:100%;max-width:none;max-height:calc(100vh - 48px);overflow:auto}
.language-view-list{display:grid;gap:12px;min-height:120px}
.language-view-card{border:1px solid var(--grau-3,#d7d7d7);border-radius:14px;background:#fff;overflow:hidden}
.language-view-summary{display:grid;grid-template-columns:minmax(220px,1fr) auto auto auto;gap:12px;align-items:center;padding:14px 16px}
.language-view-title{display:flex;align-items:center;gap:10px;min-width:0}
.language-code-badge{display:inline-flex;min-width:42px;justify-content:center;padding:5px 8px;border-radius:999px;background:#f3edf8;color:#572381;font-weight:800}
.language-default-badge{font-size:11px;font-weight:800;color:#167a45;background:#e8f5ed;padding:4px 7px;border-radius:999px}
.language-view-columns{border-top:1px solid var(--grau-3,#d7d7d7);padding:14px 16px;background:#fafafa}
.language-column-row{display:grid;grid-template-columns:minmax(170px,.7fr) minmax(260px,1.4fr) 120px 76px;gap:14px;align-items:end;padding:8px 0}
.language-column-technical{font-size:12px;color:#777;padding-bottom:11px;overflow-wrap:anywhere}
.language-visible-control{display:flex;gap:8px;align-items:center;min-height:40px}

.language-column-order{display:flex;align-items:center;justify-content:flex-end;gap:5px;min-height:40px}
.language-column-order .btn-icon{width:34px;height:34px;min-width:34px;padding:0;font-size:17px;font-weight:800}
.language-add-panel{margin-top:16px;padding-top:16px;border-top:1px solid var(--grau-3,#d7d7d7);display:flex;gap:12px;align-items:end;justify-content:space-between}
.language-add-grid{flex:1;grid-template-columns:180px minmax(240px,1fr)}
@media(max-width:760px){.language-dialog{width:calc(100vw - 18px)}.language-view-summary{grid-template-columns:1fr auto}.language-column-row{grid-template-columns:1fr}.language-add-panel{display:block}.language-add-grid{grid-template-columns:1fr}.language-add-panel .btn{margin-top:10px}}

/* v27.20: keep draft controls below the sticky main navigation */
@media (min-width: 1051px) {
  .product-draft-toolbar {
    position: sticky;
    top: 76px;
    z-index: 15;
    padding: 10px 0;
    background: rgba(255,255,255,.97);
    border-bottom: 1px solid var(--grau-4);
    backdrop-filter: blur(5px);
  }
}
@media (max-width: 1050px) {
  .product-draft-toolbar { position: static; }
}

/* File type editor + language dialog */
.filetype-create-card{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;padding:14px;border:1px solid var(--grau-4);border-radius:var(--radius-md);background:var(--grau-5);margin-bottom:18px}
.filetype-core-grid{display:grid;grid-template-columns:minmax(220px,340px) 150px minmax(170px,210px) 110px minmax(300px,1fr);gap:14px;align-items:end;width:100%}
.filetype-name-field{min-width:0;max-width:340px}
.filetype-order-field{display:grid;gap:4px;align-self:end}.filetype-order-actions{display:flex;gap:6px;align-items:center;min-height:40px}.filetype-order-actions .btn{min-width:40px}
.filetype-retention-field{min-width:0}
.filetype-actions{align-self:end;justify-content:flex-end}
.filetype-translation-row{display:grid;grid-template-columns:190px minmax(220px,1fr) minmax(320px,1.7fr);gap:14px;align-items:end;width:100%;min-width:0}
.filetype-language{display:flex;align-items:center;gap:9px;min-height:40px;font-weight:700;color:var(--ink-2)}
.filetype-language .filetype-language-visibility{margin-left:auto;flex:0 0 auto}
.filetype-card{padding:15px 16px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.filetype-languages-dialog{width:min(1080px,calc(100vw - 36px));max-width:none}
.filetype-languages-dialog-card{width:100%;max-height:calc(100vh - 48px);overflow:auto}
.filetype-languages-list{display:grid;gap:12px;margin-top:14px}
.filetype-languages-list .filetype-translation-row{padding:12px 0;border-bottom:1px solid var(--grau-4)}
.filetype-languages-list .filetype-translation-row:last-child{border-bottom:0}
@media(max-width:1180px){.filetype-core-grid{grid-template-columns:minmax(220px,1fr) 150px minmax(170px,210px) 110px}.filetype-actions{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:760px){.filetype-core-grid{grid-template-columns:1fr 1fr}.filetype-name-field{max-width:none}.filetype-translation-row{grid-template-columns:1fr 1fr}.filetype-language{grid-column:1/-1}.filetype-actions{grid-column:1/-1}}
@media(max-width:620px){.filetype-core-grid,.filetype-translation-row{grid-template-columns:1fr}.filetype-language,.filetype-actions{grid-column:auto}.filetype-languages-dialog{width:calc(100vw - 18px)}}

/* Auswahlkomponente für Produktzuordnungen */
.product-assignment-picker{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:14px;align-items:end}
.assignment-list{min-height:320px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.assignment-transfer-buttons{display:flex;flex-direction:column;gap:10px;padding-bottom:4px}
.assignment-transfer-buttons .btn{min-width:46px;font-size:20px;line-height:1}
@media(max-width:760px){.product-assignment-picker{grid-template-columns:1fr}.assignment-transfer-buttons{flex-direction:row;justify-content:center}.assignment-list{min-height:200px}}

/* v27.28: centralized database-backed translation packages */
.language-package-list{display:grid;gap:12px}
.language-package-card{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(300px,1.3fr) auto;gap:18px;align-items:center;padding:16px;border:1px solid var(--grau-3,#d7d7d7);border-radius:14px;background:#fff}
.language-package-identity{display:flex;align-items:center;gap:12px;min-width:0}
.language-package-identity strong{font-size:15px;color:var(--ink-2)}
.language-package-stats{display:flex;flex-wrap:wrap;gap:8px 16px;color:var(--grau-1);font-size:12px}
.language-package-dialog{width:min(1180px,calc(100vw - 36px));max-width:none}
.language-package-dialog-card{width:100%;max-height:calc(100vh - 40px);overflow:auto}
.language-package-editor-meta{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(320px,1.35fr);gap:14px}
.language-package-add-row{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr) auto;gap:12px;align-items:end;padding:14px 0;border-top:1px solid var(--grau-4);border-bottom:1px solid var(--grau-4)}
.language-package-editor-head{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(360px,1.3fr);gap:14px;padding:12px 10px 8px;color:var(--grau-1);font-size:12px;font-weight:800}
.language-package-editor-list{display:grid;gap:0;max-height:52vh;overflow:auto;border:1px solid var(--grau-4);border-radius:12px;background:#fff}
.language-package-editor-row{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(360px,1.3fr);gap:14px;align-items:start;padding:10px;border-bottom:1px solid var(--grau-4)}
.language-package-editor-row:last-child{border-bottom:0}
.language-package-editor-row code{padding:9px 4px;overflow-wrap:anywhere;color:var(--violet);font-weight:700}
.language-package-editor-row textarea{min-height:62px;resize:vertical}
@media(max-width:820px){.language-package-card{grid-template-columns:1fr}.language-package-card>.row-actions{justify-content:flex-start}.language-package-editor-meta,.language-package-add-row,.language-package-editor-head,.language-package-editor-row{grid-template-columns:1fr}.language-package-editor-head{display:none}.language-package-dialog{width:calc(100vw - 18px)}}

/* v27.30: file-type product matching dialog + live preview */
.filetype-product-match-dialog{width:min(1180px,calc(100vw - 36px));max-width:none}
.filetype-product-match-dialog-card{width:100%;max-height:calc(100vh - 40px);overflow:auto}
.filetype-product-match-config-grid{grid-template-columns:minmax(280px,.8fr) minmax(420px,1.2fr);gap:14px;align-items:end}
.filetype-live-preview-section{display:grid;gap:14px}
.filetype-product-match-preview{display:grid;gap:10px;min-height:48px}
.filetype-product-match-preview-summary{margin:0}
.filetype-product-match-preview-table{display:grid;border:1px solid var(--grau-4);border-radius:12px;overflow:hidden;background:#fff}
.filetype-product-match-preview-head,.filetype-product-match-preview-row{display:grid;grid-template-columns:minmax(180px,.65fr) minmax(260px,1.35fr);gap:14px;align-items:center;padding:10px 12px}
.filetype-product-match-preview-head{background:var(--grau-5);font-size:12px;color:var(--grau-1)}
.filetype-product-match-preview-row{border-top:1px solid var(--grau-4)}
.filetype-product-match-preview-row code{color:var(--violet);font-weight:800;overflow-wrap:anywhere}
.filetype-product-match-preview-row span{overflow-wrap:anywhere}
.filetype-product-match-preview-truncated{padding:0 2px}
.filetype-actions{flex-wrap:wrap}
@media(max-width:760px){.filetype-product-match-dialog{width:calc(100vw - 18px)}.filetype-product-match-config-grid,.filetype-product-match-preview-head,.filetype-product-match-preview-row{grid-template-columns:1fr}}

/* v27.31: file-type classification dialog */
.classification-dialog-section{display:grid;gap:14px;padding:18px 0;border-top:1px solid var(--grau-4)}
.classification-dialog-section:first-of-type{border-top:0;padding-top:6px}
.filetype-rule-dialog-grid,.filetype-rule-dialog-row{display:grid;grid-template-columns:minmax(280px,1.7fr) minmax(130px,.55fr) auto auto;gap:12px;align-items:end}
.filetype-rule-dialog-list{display:grid;gap:10px}
.filetype-rule-dialog-row{padding:12px;border:1px solid var(--grau-4);border-radius:12px;background:#fff}
.filetype-rule-enabled{align-self:center;padding-bottom:11px}
.filetype-assignment-modes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.assignment-mode-card{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border:1px solid var(--grau-4);border-radius:12px;background:#fff;cursor:pointer}
.assignment-mode-card:has(input:checked){border-color:var(--violet);box-shadow:0 0 0 1px var(--violet)}
.assignment-mode-card input{margin-top:3px}
.assignment-mode-card span{display:grid;gap:3px}
.assignment-mode-card small{color:var(--grau-1);font-weight:500}
.filetype-product-match-settings{display:grid;gap:14px}
.filetype-product-match-settings[hidden]{display:none!important}
@media(max-width:860px){.filetype-rule-dialog-grid,.filetype-rule-dialog-row,.filetype-assignment-modes{grid-template-columns:1fr}.filetype-rule-enabled{padding-bottom:0}}

/* v27.32: global file-detection filter catalog */
.filetype-detection-filters-details{border:1px solid var(--grau-4);border-radius:14px;background:var(--grau-5);overflow:hidden}
.filetype-detection-filters-details>summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;gap:10px;color:var(--violet)}
.filetype-detection-filters-details>summary::-webkit-details-marker{display:none}
.filetype-detection-filters-details>summary:before{content:'▸';font-weight:900;transition:transform .15s ease}
.filetype-detection-filters-details[open]>summary:before{transform:rotate(90deg)}
.filetype-detection-filters-details>summary span{display:grid;gap:2px}
.filetype-detection-filters-details>summary small{color:var(--grau-1);font-weight:500}
.filetype-detection-filters-body{display:grid;gap:12px;padding:0 14px 14px}
.filetype-rule-dialog-grid{grid-template-columns:minmax(280px,1fr) auto auto}
.filetype-rule-dialog-row.global-filter-row{grid-template-columns:minmax(280px,1.2fr) auto minmax(220px,.8fr) auto;align-items:end}
.filetype-filter-owner{align-self:end}
.filetype-filter-order-actions{flex-wrap:nowrap;align-items:center}
.filetype-filter-analysis{grid-column:1/-1}
.filetype-filter-warning{margin:0}
.filetype-filter-ok{font-size:12px;color:var(--grau-1);font-weight:700}
.filetype-filter-candidate-preview:empty{display:none}
.filetype-filter-index-note{font-size:12px}
@media(max-width:980px){.filetype-rule-dialog-row.global-filter-row{grid-template-columns:1fr 1fr}.filetype-filter-analysis{grid-column:1/-1}.filetype-filter-order-actions{flex-wrap:wrap}}
@media(max-width:700px){.filetype-rule-dialog-grid,.filetype-rule-dialog-row.global-filter-row{grid-template-columns:1fr}.filetype-filter-owner{padding-bottom:0}}

/* v27.32: global detection catalog inside file-type classification dialog */
.filetype-filter-details{border:1px solid var(--grau-4);border-radius:14px;background:var(--grau-5);overflow:hidden;padding:0}
.filetype-filter-details>summary{cursor:pointer;list-style:none;padding:14px 16px;display:flex;align-items:center;gap:10px;color:var(--violet)}
.filetype-filter-details>summary::-webkit-details-marker{display:none}
.filetype-filter-details>summary:before{content:'▸';font-weight:900;transition:transform .15s ease}
.filetype-filter-details[open]>summary:before{transform:rotate(90deg)}
.filetype-filter-details>p,.filetype-filter-details>form,.filetype-filter-details>.filetype-filter-preview,.filetype-filter-details>.filetype-filter-list-head,.filetype-filter-details>.filetype-filter-list{margin-left:16px;margin-right:16px}
.filetype-filter-details>.filetype-filter-index-note{margin-bottom:16px}
.filetype-filter-create-grid{display:grid;grid-template-columns:minmax(280px,1fr) auto auto;gap:12px;align-items:end;margin-top:12px}
.filetype-filter-enabled{align-self:center;padding-bottom:11px}
.filetype-filter-preview{margin-top:10px}
.filetype-filter-preview:empty{display:none}
.filetype-filter-list-head{display:grid;grid-template-columns:minmax(150px,.55fr) minmax(260px,1.2fr) auto minmax(150px,.6fr) auto;gap:12px;padding:14px 12px 6px;color:var(--grau-1);font-size:12px;font-weight:800}
.filetype-filter-list{display:grid;gap:10px;padding-bottom:4px}
.filetype-filter-list .global-filter-row{grid-template-columns:minmax(280px,1.2fr) auto minmax(220px,.8fr) auto;align-items:end}
.filetype-filter-list .filetype-filter-analysis{grid-column:1/-1}
@media(max-width:980px){.filetype-filter-list-head{display:none}.filetype-filter-create-grid,.filetype-filter-list .global-filter-row{grid-template-columns:1fr 1fr}.filetype-filter-list .filetype-filter-analysis{grid-column:1/-1}}
@media(max-width:700px){.filetype-filter-create-grid,.filetype-filter-list .global-filter-row{grid-template-columns:1fr}.filetype-filter-enabled{padding-bottom:0}}

/* v27.35: einheitliche HTML-Dialoge statt sticky Meldungen / Browser-Alerts */
.admin-message-wrap{display:none!important}
.ui-message-dialog{width:min(560px,calc(100vw - 30px));max-width:none}
.ui-message-dialog-card{padding:24px}
.ui-message-dialog-copy{white-space:pre-line;font-size:14px;line-height:1.55;padding:14px 16px;border:1px solid var(--grau-4);border-radius:var(--radius-sm);background:#fafafa;color:var(--ink-2)}
.ui-message-dialog-error{background:#fff5f5;border-color:#e7bdbd;color:var(--red)}
.ui-message-dialog-success{background:#f1faf4;border-color:#b9dfc6;color:#176b3a}
.ui-message-dialog-info{background:#faf8fc;border-color:#d9cde2;color:var(--ink-2)}
.ui-message-dialog-footer{justify-content:flex-end}

/* v27.38: automatic file retention */

/* v27.39: configurable product catalog visibility */
.product-catalog-settings {
  display: flex;
  align-items: end;
  gap: 12px;
  margin: 14px 0 18px;
  padding: 12px 14px;
  border: 1px solid var(--grau-4);
  border-radius: 8px;
  background: var(--grau-5);
}
.product-catalog-visibility-field {
  margin: 0;
  max-width: 640px;
}
.product-catalog-visibility-field select {
  max-width: 320px;
}

/* v27.40: Retention lives in the file-type overview; language fields use a dedicated dialog. */


/* v27.45: KESSEL UI review / brand-system consolidation
   Keep component behavior intact, but align typography, color, hierarchy and states. */
:root {
  /* Official KESSEL brand colors */
  --kessel-violet: #572381;
  --kessel-violet-dark: #371950;
  --kessel-white: #ffffff;
  --kessel-background: #e5e5e5;
  --kessel-info: #009edc;
  --kessel-success: #76b82a;
  --kessel-danger: #e30613;
  --kessel-warning: #fdc800;
  --kessel-turquoise: #007b8a;
  --kessel-brown: #7f6c74;

  /* Semantic UI tokens. Legacy variables above remain supported. */
  --surface: #ffffff;
  --surface-subtle: #f7f7f7;
  --surface-brand-soft: #f4eef8;
  --text: #161616;
  --text-muted: #4f4f4f;
  --border: #d9d9d9;
  --border-strong: #bfbfbf;
  --focus-ring: rgba(87,35,129,.22);
  --shadow-card: 0 2px 8px rgba(55,25,80,.07);
  --shadow-header: 0 1px 5px rgba(55,25,80,.08);
  --shadow-popover: 0 12px 30px rgba(55,25,80,.16);

  --ink-1: var(--text);
  --ink-2: #303030;
  --grau-1: #555555;
  --grau-2: #707070;
  --grau-3: #c7c7c7;
  --grau-4: #e5e5e5;
  --grau-5: #f7f7f7;
}

html { background: var(--kessel-background); }
body {
  background: var(--white);
  letter-spacing: 0;
  line-height: 1.45;
}

/* Stronger typographic hierarchy without artificial tracking. */
h1, h2, h3, h4, .section-title, .dev-title {
  letter-spacing: 0;
  color: var(--ink-1);
}
.hero h1 { font-weight: 600; letter-spacing: 0; }
.hero p { opacity: .92; line-height: 1.5; }
.card-kicker, .tree-head, .login-eyebrow {
  letter-spacing: 0;
  text-transform: none;
  font-weight: 600;
  color: var(--violet);
}

/* Brand zone: only sanctioned vertical violet gradient, never diagonal. */
.hero {
  background: linear-gradient(180deg, var(--violet) 0%, var(--violet-dark) 100%);
  padding-top: clamp(26px,3.4vw,44px);
  padding-bottom: clamp(26px,3.4vw,44px);
}
.hero h1, .hero p { color: var(--white); }

/* Top navigation stays quiet so the brand zone carries the identity. */
.topbar {
  min-height: 72px;
  border-bottom-color: rgba(87,35,129,.14);
  box-shadow: var(--shadow-header);
}
.topbar-current { color: var(--ink-1); font-weight: 600; }
.portal-tab {
  font-size: 13px;
  font-weight: 600;
  padding-inline: 14px;
}
.portal-tab:hover { background: var(--surface-brand-soft); }
.portal-tab.active { color: var(--violet); border-bottom-color: var(--violet); }
.kessel-logo { min-width: 90px; }

/* Cards: less floating SaaS tile, more restrained KESSEL surface. */
.card, .login-panel, .tree-panel {
  border: 1px solid rgba(87,35,129,.14);
  box-shadow: var(--shadow-card);
}
.card { padding: clamp(18px,2vw,24px); }
.section-heading { margin-bottom: 16px; }
.section-heading h2 { font-weight: 600; color: var(--violet); }

/* Forms: consistent height, visible focus and calm backgrounds. */
.form-control,
.search-box input {
  min-height: 42px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--white);
  color: var(--ink-1);
}
.form-control:hover:not(:disabled), .search-box input:hover { border-color: #9b9b9b; }
.form-control:focus, .search-box input:focus {
  border-color: var(--violet);
  box-shadow: 0 0 0 3px var(--focus-ring);
  background: var(--white);
}
.field { color: var(--ink-2); font-weight: 600; }

/* Buttons follow Primary / Secondary / Tertiary hierarchy. */
.btn {
  min-height: 40px;
  border-width: 1px;
  border-radius: var(--radius-sm);
  font-size: 13px;
  font-weight: 600;
  transform: none;
  box-shadow: none;
}
.btn:hover { transform: none; }
.btn-primary { background: var(--violet); border-color: var(--violet); }
.btn-primary:hover { background: var(--violet-dark); border-color: var(--violet-dark); }
.btn-secondary { background: var(--white); border-color: var(--violet); color: var(--violet); }
.btn-secondary:hover { background: var(--surface-brand-soft); border-color: var(--violet); }
.btn-tertiary { color: var(--violet); border-color: transparent; background: transparent; }
.btn-tertiary:hover { background: var(--surface-brand-soft); color: var(--violet-dark); }
.btn-danger { background: var(--white); border-color: var(--red); color: var(--red); }
.btn-danger:hover { background: rgba(227,6,19,.06); border-color: var(--red); }
.btn:focus-visible,
.profile-button:focus-visible,
.portal-tab:focus-visible,
summary:focus-visible,
a:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

/* Compact header controls are controls, not decorative pills. */
.profile-button,
.user-badge {
  border-radius: var(--radius-sm);
  background: var(--surface-brand-soft);
}
.profile-button { min-height: 36px; border-color: rgba(87,35,129,.24); }
.profile-button:hover, .profile-button[aria-expanded="true"] { background: #eadff2; border-color: var(--violet); }
.profile-role, .language-code-badge, .language-default-badge, .badge, .dev-badge, .ver-badge {
  border-radius: var(--radius-sm);
}

/* Tables: clearer scan lines and stronger header separation. */
.table th, .table td { border-bottom-color: var(--grau-4); }
.table thead th {
  color: var(--ink-2);
  font-size: 12px;
  font-weight: 600;
  background: var(--surface-subtle);
  border-bottom: 2px solid var(--grau-3);
}
.table tbody tr:hover td, .table tbody tr:hover th { background: #fbf9fc; }

/* Functional colors use the official palette; tints stay subordinate. */
.notice-success, .ui-message-dialog-success { background: rgba(118,184,42,.10); border-color: rgba(118,184,42,.50); color: #3f6612; }
.notice-error, .ui-message-dialog-error, .error-box { background: rgba(227,6,19,.055); border-color: rgba(227,6,19,.32); color: #a0000b; }
.badge-success, .dev-badge { background: rgba(118,184,42,.12); color: #426b12; }
.badge-warning { background: rgba(253,200,0,.18); color: #715900; }
.ui-message-dialog-info { background: rgba(0,158,220,.07); border-color: rgba(0,158,220,.28); color: #005c80; }

/* Dialogs and popovers use the same surface language as cards. */
.topbar-popover, dialog, .column-actions-menu, .export-menu-popover {
  box-shadow: var(--shadow-popover);
}
.topbar-popover { border-color: rgba(87,35,129,.16); border-radius: var(--radius-md); }
.admin-nav-menu-item, .topbar-menu-link, .language-menu-item, .export-menu-item { border-radius: var(--radius-sm); }

/* Dropzones and secondary panels should read as tools, not cards inside cards. */
.grid-form,
.filetype-create-card,
.product-catalog-settings,
.filetype-detection-filters-details,
.filetype-filter-details,
.card-subsection {
  background: var(--surface-subtle);
  border-color: var(--grau-4);
}

/* Public FAQ follows the same restrained component system. */
.faq-item { border-width: 1px; border-radius: var(--radius-md); }
.faq-item[open] summary { background: var(--surface-brand-soft); }
.section-divider { background: linear-gradient(to right, rgba(87,35,129,.18), transparent); }

/* Footer is a simple brand block. */
.site-footer { background: var(--violet-dark); }

/* Improve compact layouts without hiding the brand mark too early. */
@media (max-width: 620px) {
  .topbar { min-height: 64px; }
  .kessel-logo { display:block; width:112px; margin-left:6px; }
  .topbar-right { margin-left:auto; }
}
@media (max-width: 430px) {
  .kessel-logo { width:96px; }
  .profile-button { padding-inline:8px; }
}

/* v27.48: product columns show human label and stable CSV identity together */
.product-column-title{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.product-column-display-name{font-weight:600;line-height:1.2}
.product-column-csv-name{font-size:11px;font-weight:400;line-height:1.2;color:var(--ink-2);white-space:normal;overflow-wrap:anywhere}
.product-column-head{align-items:flex-start}

/* v27.49: richer product assignment picker */
.assignment-search-field{display:block;margin:14px 0}
.assignment-search-field .form-control{width:100%}
.assignment-list option{white-space:nowrap}

/* v27.50: product-name badge + readable recognized-product labels */
.product-name-badge{display:inline-flex;align-items:center;gap:4px}
.product-name-badge svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.recognized-product{display:block;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.recognized-products-list code{white-space:normal;overflow-wrap:anywhere}


/* v27.52: compact product-key role markers */
.product-key-icon-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;width:24px;height:24px;padding:0;border-radius:6px;font-size:12px;line-height:1;cursor:help}
.product-key-icon-badge svg{width:13px;height:13px}


/* v27.54: lazy, compact full-width product details below file rows */
.recognized-products-toggle{border:0;background:transparent;padding:0;color:var(--violet);font:inherit;font-weight:700;cursor:pointer;white-space:nowrap}
.recognized-products-toggle:hover{text-decoration:underline}
.file-product-detail-row>td{padding:0!important;border-top:0!important;background:var(--white)}
.file-product-detail-shell{padding:5px 10px 8px 16px;border-bottom:1px solid var(--grau-4)}
.file-product-detail-list{display:grid;gap:3px}
.file-product-detail-item{display:flex;flex-wrap:wrap;gap:3px 12px;padding:4px 7px;border-left:2px solid var(--violet);background:rgba(87,35,129,.025);font-size:12px;line-height:1.35}
.file-product-detail-field{display:inline-flex;gap:3px;min-width:0;max-width:100%}
.file-product-detail-field strong{font-weight:700;white-space:nowrap}
.file-product-detail-field span{overflow-wrap:anywhere}
.file-product-detail-empty{padding:4px 7px;color:var(--ink-2);font-size:12px}

/* v27.55: direct download-link copy action */
.file-name-with-link{display:flex;align-items:flex-start;gap:6px;min-width:0}
.file-name-text{min-width:0;overflow-wrap:anywhere}
.direct-link-copy-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:25px;height:25px;margin-top:-3px;padding:0;border:1px solid rgba(87,35,129,.22);border-radius:6px;background:#fff;color:var(--violet);cursor:pointer}
.direct-link-copy-button:hover{border-color:var(--violet);background:var(--violet-light)}
.direct-link-copy-button:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
.direct-link-copy-button svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.direct-link-copy-toast{position:fixed;right:18px;bottom:18px;z-index:2000;padding:9px 13px;border-radius:8px;background:var(--violet-dark);color:#fff;font-size:13px;font-weight:700;box-shadow:0 8px 24px rgba(30,10,45,.22);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .14s ease,transform .14s ease}
.direct-link-copy-toast.is-visible{opacity:1;transform:translateY(0)}

/* v27.56: download/share actions live together in the actions column */
.file-action-cell{white-space:nowrap}
.file-action-group{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:nowrap}
.direct-link-share-button{display:inline-flex;align-items:center;gap:6px}
.direct-link-share-button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
@media (max-width:700px){.file-action-group{flex-wrap:wrap;justify-content:flex-start}}


/* v27.58: report fixes */
.permission-matrix-shell{display:grid;gap:14px}
.permission-matrix-actions{display:flex;justify-content:flex-end;padding-top:2px}
.assignment-list-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;padding-bottom:4px}
.assignment-list-scroll .assignment-list{width:max-content;min-width:100%;max-width:none}
.assignment-list-scroll .assignment-list option{white-space:pre}
body{min-height:100vh;display:flex;flex-direction:column}
.site-footer{margin-top:auto;flex:none}


/* v27.60: standalone audit filters */
.audit-filter-form{display:grid;grid-template-columns:minmax(180px,1.4fr) minmax(180px,1fr) minmax(180px,1fr) minmax(180px,1fr) auto;gap:12px;align-items:end;margin:12px 0 8px}
.audit-filter-actions{display:flex;gap:8px;align-items:center;padding-bottom:1px}
.audit-result-count{margin:4px 0 10px}
@media (max-width:1100px){.audit-filter-form{grid-template-columns:repeat(2,minmax(0,1fr))}.audit-filter-actions{grid-column:1/-1}}
@media (max-width:640px){.audit-filter-form{grid-template-columns:1fr}.audit-filter-actions{grid-column:auto;flex-wrap:wrap}}


/* v27.64: per-user product-detail field selector in file index */
.file-product-detail-header{display:flex;align-items:center;gap:6px;white-space:nowrap}
.file-product-detail-columns-menu>summary{min-width:30px;text-align:center}
.file-product-detail-columns-menu .column-actions-menu{min-width:220px;max-width:min(340px,80vw);max-height:340px;overflow:auto}
.file-product-detail-menu-title{padding:2px 4px 5px;font-weight:700;color:var(--ink-2)}
.file-product-detail-column-option{display:flex;align-items:flex-start;gap:7px;padding:5px 4px;font-size:12px;line-height:1.25;cursor:pointer;white-space:normal}
.file-product-detail-column-option:hover{background:var(--violet-light)}
.file-product-detail-column-option input{margin-top:1px;flex:0 0 auto}

/* v27.72: database backup & recovery */
.backup-import-box{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;margin:8px 0 16px;border:1px solid var(--line);border-radius:10px;background:var(--surface-soft,#fafafa)}
.backup-list{gap:10px}
.backup-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#fff}
.backup-row-main{min-width:0;display:grid;gap:4px}
.backup-row-main strong{overflow-wrap:anywhere}
.backup-checksum{font-size:11px;color:var(--ink-3,#777);font-family:ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.backup-row-actions{flex:0 0 auto;flex-wrap:wrap;justify-content:flex-end}
.notice-warning{margin:14px 0;background:#fff6dd;border:1px solid #e5c86a;color:#4d3b00}
@media (max-width:800px){.backup-import-box,.backup-row{align-items:stretch;flex-direction:column}.backup-row-actions{justify-content:flex-start}}

/* v27.72: GUI language provisioning/default controls */
.language-package-title-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}

/* v27.81: fein granulare Rollendelegation */
.delegation-cell { min-width: 220px; gap: 8px; }
.delegation-rights { border-top: 1px solid var(--grau-4); border-bottom: 1px solid var(--grau-4); padding: 5px 0; }
.delegation-rights > summary { cursor: pointer; color: var(--violet); font-size: 11.5px; font-weight: 800; }
.delegation-rights-grid { display: grid; gap: 5px; padding: 7px 0 2px 12px; }
.delegation-scopes { display: grid; gap: 5px; }
.delegation-scopes > strong { font-size: 10.5px; color: var(--grau-1); }

/* v27.83: manuelle Produktzuordnung je Dateityp */
.filetype-assignment-modes{grid-template-columns:repeat(4,minmax(0,1fr))}
.filetype-manual-product-settings,.filetype-rule-product-settings{display:grid;gap:14px}
.filetype-manual-product-settings[hidden],.filetype-rule-product-settings[hidden]{display:none!important}
.filetype-manual-rule-editor{display:grid;gap:12px;padding:14px;border:1px solid var(--grau-4);border-radius:12px;background:var(--grau-5)}
.filetype-manual-all-products{align-self:end}
.filetype-manual-product-picker .assignment-list{min-height:220px}
.filetype-manual-rules-heading{display:flex;justify-content:space-between;gap:16px;align-items:end;flex-wrap:wrap}
.filetype-manual-rules-heading small{max-width:680px}
.filetype-manual-rules-list{display:grid;gap:10px}
.filetype-manual-rule-row{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(320px,1.2fr) auto;gap:14px;align-items:center;padding:12px 14px;border:1px solid var(--grau-4);border-radius:12px;background:#fff}
.filetype-manual-rule-pattern{display:grid;gap:4px;min-width:0}
.filetype-manual-rule-pattern code{font-weight:800;color:var(--violet);overflow-wrap:anywhere}
.filetype-manual-rule-products{min-width:0;overflow-wrap:anywhere}
.filetype-manual-rule-actions{justify-content:flex-end;flex-wrap:nowrap}
@media(max-width:980px){.filetype-assignment-modes{grid-template-columns:1fr}.filetype-manual-rule-row{grid-template-columns:1fr}.filetype-manual-rule-actions{justify-content:flex-start}}

.filetype-rule-product-config-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:980px){.filetype-rule-product-config-grid{grid-template-columns:1fr}}

/* v27.84: role-aware file preview + language-column ordering */
.file-preview-button{display:inline-flex;align-items:center;gap:6px}
.file-preview-button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.file-preview-dialog{width:min(1180px,calc(100vw - 36px));max-width:none}
.file-preview-dialog-card{display:grid;grid-template-rows:auto minmax(0,1fr) auto;max-height:calc(100vh - 36px);min-height:min(720px,calc(100vh - 36px));overflow:hidden}
.file-preview-body{min-height:0;overflow:auto;padding:14px 2px 10px}
.file-preview-message{padding:18px;color:var(--ink-2)}
.file-preview-text{margin:0;padding:16px;border:1px solid var(--grau-4);border-radius:10px;background:#fafafa;white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace}
.file-preview-table-wrap{width:100%;overflow:auto;border:1px solid var(--grau-4);border-radius:10px;background:#fff}
.file-preview-table{min-width:max-content;margin:0}
.file-preview-table th{position:sticky;top:0;z-index:1;background:#f4f1f6}
.file-preview-image,.file-preview-pdf-page{display:block;max-width:100%;height:auto;margin:0 auto;border:1px solid var(--grau-4);border-radius:8px;background:#fff;box-shadow:0 5px 20px rgba(25,17,31,.08)}
.file-preview-pdf-page{max-height:calc(100vh - 260px)}
.file-preview-note{margin-top:10px;color:var(--ink-2);font-size:12px;line-height:1.45}
.file-preview-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-top:14px;border-top:1px solid var(--grau-4)}
.file-preview-pagination{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.file-preview-pagination[hidden]{display:none!important}
.file-preview-pagination span{font-size:13px;color:var(--ink-2);font-weight:700}
@media(max-width:700px){.file-preview-dialog{width:calc(100vw - 18px)}.file-preview-dialog-card{min-height:calc(100vh - 18px);max-height:calc(100vh - 18px)}.file-preview-footer{align-items:stretch;flex-direction:column}.file-preview-pagination{justify-content:space-between}}

/* v27.85: database migration hotfix for capability-key based RBAC schema */

/* v27.86: strategy-scoped product matching controls + indexed live preview */
.filetype-assignment-preview-section{margin-top:4px;padding-top:16px;border-top:1px solid var(--grau-4)}
.filetype-rule-summary-row{grid-template-columns:minmax(0,1fr) auto}
.strategy-preview-scroll{width:100%;overflow:auto;border:1px solid var(--grau-4);border-radius:12px;background:#fff}
.strategy-preview-table{min-width:max-content;margin:0}
.strategy-preview-table th,.strategy-preview-table td{vertical-align:top;white-space:nowrap}
.strategy-preview-table thead th{position:sticky;top:0;z-index:1;background:var(--grau-5)}
.strategy-preview-expand-cell{width:42px;min-width:42px;text-align:center!important;padding-left:8px!important;padding-right:8px!important}
.strategy-preview-expand{width:28px;height:28px;border:1px solid var(--violet);border-radius:7px;background:#fff;color:var(--violet);font-weight:900;line-height:1;cursor:pointer}
.strategy-preview-expand:hover,.strategy-preview-expand:focus-visible{background:var(--violet);color:#fff}
.strategy-preview-files-row td{padding:0!important;background:#faf9fb}
.strategy-preview-files{padding:12px 16px 14px 54px;border-top:1px solid var(--grau-4)}
.strategy-preview-files ul{display:grid;gap:6px;margin:8px 0 0;padding:0;list-style:none}
.strategy-preview-files li{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.strategy-preview-files li small{color:var(--grau-1)}
@media(max-width:980px){.filetype-rule-summary-row{grid-template-columns:1fr}.strategy-preview-files{padding-left:16px}}

/* v27.87: per-language file-type visibility and localized file-type explanations */

/* v27.88: simplified product-assignment strategy visibility and manual picker semantics */

/* v27.89: bidirectional dry-run preview + forward matching helpers */
.filetype-product-match-config-grid{grid-template-columns:minmax(220px,.8fr) minmax(180px,.55fr) minmax(300px,1.25fr)}
.filetype-forward-glob-tools{display:grid;grid-template-columns:1fr;gap:8px;margin-top:10px;padding:12px 14px;border:1px solid var(--grau-4);border-radius:10px;background:var(--grau-5)}
.filetype-forward-glob-tools[hidden]{display:none!important}
.filetype-preview-controls{display:flex;align-items:end;justify-content:space-between;gap:18px;flex-wrap:wrap;padding:10px 12px;border:1px solid var(--grau-4);border-radius:10px;background:var(--grau-5)}
.filetype-preview-direction{display:flex;gap:14px;align-items:center;border:0;margin:0;padding:0;min-width:0}
.filetype-preview-direction legend{font-size:11px;font-weight:800;color:var(--grau-1);margin:0 12px 0 0;float:left}
.filetype-preview-only-matches{margin-left:auto}
.strategy-preview-unmatched{opacity:.62}
.strategy-preview-targeted{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:#eef6e7;color:#426c1f;font-weight:900}
.strategy-preview-nested{margin-top:10px;border-radius:8px}
.strategy-preview-nested .table{margin:0;min-width:max-content}
@media(max-width:980px){.filetype-product-match-config-grid{grid-template-columns:1fr}.filetype-forward-glob-tools{grid-template-columns:1fr}.filetype-preview-controls{align-items:flex-start;flex-direction:column}.filetype-preview-only-matches{margin-left:0}.filetype-preview-direction{align-items:flex-start;flex-direction:column;gap:8px}.filetype-preview-direction legend{float:none;margin:0}}

/* v27.93: Admin-Cards ein-/ausklappbar */
.admin-content > .card.admin-card-collapsible > .section-heading {
  cursor: pointer;
}
.admin-card-collapse-toggle {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid var(--grau-4);
  border-radius: var(--radius-sm);
  background: var(--white);
  color: var(--violet);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s, border-color .15s, transform .15s;
}
.admin-card-collapse-toggle:hover {
  background: var(--violet-light);
  border-color: rgba(87,35,129,.28);
}
.admin-card-collapse-toggle svg {
  width: 18px;
  height: 18px;
  transition: transform .18s ease;
}
.admin-content > .card.admin-card-collapsed > .section-heading {
  margin-bottom: 0;
}
.admin-content > .card.admin-card-collapsed > :not(.section-heading) {
  display: none !important;
}
.admin-content > .card.admin-card-collapsed .admin-card-collapse-toggle svg {
  transform: rotate(-90deg);
}


/* FAQ administration */
.faq-admin-language-list{display:flex;flex-direction:column;gap:12px}
.faq-admin-language{border:1px solid var(--line,#e4ddea);border-radius:12px;background:var(--white,#fff);overflow:hidden}
.faq-admin-language>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;font-weight:600;list-style:none}
.faq-admin-language>summary::-webkit-details-marker{display:none}
.faq-admin-language-body{padding:0 18px 18px;border-top:1px solid var(--line,#e4ddea)}
.faq-admin-add-form{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(320px,1.6fr) auto;gap:12px;align-items:end;padding:16px 0}
.faq-admin-answer{min-height:92px;resize:vertical}
.faq-admin-items{display:flex;flex-direction:column;gap:10px}
.faq-admin-item{border:1px solid rgba(87,35,129,.12);border-radius:10px;padding:14px}
.faq-admin-display{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:start}
.faq-admin-copy{min-width:0}
.faq-admin-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.faq-admin-order-actions,.faq-admin-crud-actions{display:flex;gap:8px;justify-content:flex-end}
.faq-admin-order-actions .btn{width:42px;min-width:42px;height:38px;margin:0}
.faq-admin-crud-actions .btn{min-width:96px;margin:0}
.faq-admin-edit-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.faq-admin-answer-text{white-space:pre-wrap;color:var(--ink-2);margin-top:6px;line-height:1.55}
.faq-admin-edit{display:none;margin-top:12px;gap:10px}
.faq-admin-item.is-editing .faq-admin-display{display:none}
.faq-admin-item.is-editing .faq-admin-edit{display:grid}
@media(max-width:900px){.faq-admin-add-form{grid-template-columns:1fr}.faq-admin-display{grid-template-columns:1fr}.faq-admin-actions{align-items:flex-start}.faq-admin-order-actions,.faq-admin-crud-actions{justify-content:flex-start;flex-wrap:wrap}}

/* v3.0.11: embedded 3D model preview */
.file-preview-3d-shell{position:relative;width:100%;height:min(68vh,720px);min-height:420px;border:1px solid var(--grau-4);border-radius:10px;overflow:hidden;background:#fafafa}
.file-preview-3d-viewer{width:100%;height:100%;min-height:420px;touch-action:none}
.file-preview-3d-viewer canvas{display:block;width:100%!important;height:100%!important;outline:none}
.file-preview-3d-status{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(250,250,250,.82);color:var(--ink-2);font-weight:700;pointer-events:none}
.file-preview-3d-help{font-weight:700}
@media(max-width:700px){.file-preview-3d-shell,.file-preview-3d-viewer{min-height:320px}.file-preview-3d-shell{height:58vh}}

/* v3.0.14: direct preview/download actions in the admin file index */

/* v3.0.14: homepage hot-access administration */
.homepage-admin-language-list{display:flex;flex-direction:column;gap:12px}
.homepage-admin-language{border:1px solid var(--line,#e4ddea);border-radius:12px;background:var(--white,#fff);overflow:hidden}
.homepage-admin-language>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;font-weight:600;list-style:none}
.homepage-admin-language>summary::-webkit-details-marker{display:none}
.homepage-admin-language-body{padding:16px 18px 18px;border-top:1px solid var(--line,#e4ddea)}
.homepage-admin-form{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(300px,1fr);gap:14px 18px;align-items:start}
.homepage-admin-form .field small{display:block;margin:4px 0 7px;color:var(--ink-2)}
.homepage-admin-subtext{grid-column:1/-1}
.homepage-admin-subtext textarea{min-height:96px;resize:vertical}
.homepage-admin-actions{grid-column:1/-1;display:flex;justify-content:flex-end}
@media(max-width:900px){.homepage-admin-form{grid-template-columns:1fr}.homepage-admin-subtext,.homepage-admin-actions{grid-column:1}.homepage-admin-actions{justify-content:flex-start}}

/* v3.0.15: native audio/video preview */
.file-preview-media-shell{width:100%;border:1px solid var(--grau-4);border-radius:10px;background:#111;overflow:hidden}
.file-preview-media{display:block;width:100%}
.file-preview-video{max-height:min(68vh,720px);background:#000}
.file-preview-audio-shell{max-width:820px;margin:36px auto;background:#fafafa;padding:22px}
.file-preview-audio-title{margin:0 0 14px;font-weight:800;color:var(--ink);overflow-wrap:anywhere}
.file-preview-audio{width:100%}
.file-preview-media-help{font-weight:700}
.file-preview-media-error{margin-top:10px}
.file-preview-media-error[hidden]{display:none!important}
@media(max-width:700px){.file-preview-video{max-height:58vh}.file-preview-audio-shell{margin:18px auto;padding:16px}}


/* v3.0.18: language-specific homepage file-action labels and order */
.homepage-admin-action-config{grid-column:1/-1;border-top:1px solid var(--line,#e4ddea);padding-top:16px;margin-top:2px}
.homepage-admin-action-config-head{display:flex;flex-direction:column;gap:4px;margin-bottom:10px}
.homepage-admin-action-config-head small{color:var(--ink-2)}
.homepage-admin-action-list{display:flex;flex-direction:column;gap:8px}
.homepage-admin-action-row{display:grid;grid-template-columns:minmax(120px,.45fr) minmax(260px,1fr) auto;gap:12px;align-items:end;border:1px solid rgba(87,35,129,.12);border-radius:10px;padding:10px 12px;background:#fff}
.homepage-admin-action-kind{display:flex;flex-direction:column;gap:3px;align-self:center}
.homepage-admin-action-kind small{color:var(--ink-2);font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.homepage-admin-action-label{margin:0}
.homepage-admin-action-order{display:flex;gap:8px;align-items:center;padding-bottom:1px}
.homepage-admin-action-order .btn{width:42px;min-width:42px;height:38px;margin:0}
.homepage-admin-readonly{grid-column:1/-1}
@media(max-width:900px){.homepage-admin-action-row{grid-template-columns:1fr}.homepage-admin-action-order{justify-content:flex-start}.homepage-admin-action-config{grid-column:1}.homepage-admin-readonly{grid-column:1}}

/* First product-data import: keep the zero-state setup compact and explicit. */
.product-initial-key-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
@media(max-width:760px){.product-initial-key-grid{grid-template-columns:1fr}}

/* v3.0.21: file-index bulk actions */
.file-index-bulk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:12px 0;padding:12px 14px;border:1px solid var(--line,#e4ddea);border-radius:10px;background:#faf8fc}
.file-index-bulk-toolbar.hidden{display:none!important}
.file-index-bulk-toolbar .row-actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.file-index-select-cell{width:42px;text-align:center}
.file-index-select-cell input{width:18px;height:18px}
@media(max-width:900px){.file-index-bulk-toolbar{align-items:flex-start}.file-index-bulk-toolbar .row-actions{width:100%;margin-left:0}}


/* v3.0.24: compact customer download rows so action buttons stay in view */
.result-files{padding-left:28px;padding-right:14px;min-width:min(700px,calc(100vw - 56px))}
.result-file-table{width:100%;min-width:760px;table-layout:fixed}
.result-file-table th:first-child,.result-file-table td:first-child{width:135px}
.result-file-table th:nth-child(2),.result-file-table td:nth-child(2){width:auto}
.result-file-table th:nth-child(3),.result-file-table td:nth-child(3){width:105px}
.result-file-table th:nth-child(4),.result-file-table td:nth-child(4){width:82px}
.result-file-table th:last-child,.result-file-table td:last-child{width:1%;white-space:nowrap}
.result-file-table .file-name-cell{min-width:0;max-width:none}
.result-file-table .file-action-group{gap:6px;justify-content:flex-start}
.result-file-table .file-action-group .btn{padding-left:9px;padding-right:9px}
@media(max-width:900px){.result-files{padding-left:14px;padding-right:10px}.result-file-table{min-width:760px}}

/* v3.0.24: system settings */
.system-settings-form{max-width:920px;grid-template-columns:minmax(240px,320px) minmax(320px,1fr);align-items:end}
.system-settings-meta{margin:0;align-self:end}
.system-settings-form>.btn{grid-column:1/-1;justify-self:start}
@media(max-width:760px){.system-settings-form{grid-template-columns:1fr}}

/* v3.0.24: virtual catch-all ACL row for files without a matching classifier */
.permission-table .permission-catch-all-row > * {
  border-top: 2px solid var(--border, #ded6e7);
  background: color-mix(in srgb, var(--surface, #fff) 92%, var(--accent, #5b1f88) 8%);
}
.permission-catch-all-help {
  display: block;
  margin-top: .25rem;
  font-weight: 400;
  color: var(--muted, #6f6678);
  max-width: 30rem;
}

/* v3.0.26: keep customer download actions next to file metadata instead of pinning them to the far edge */
.result-files .table-wrap{overflow-x:auto}
.result-file-table{
  width:max-content;
  max-width:100%;
  min-width:0;
  table-layout:auto;
}
.result-file-table th:first-child,.result-file-table td:first-child{width:150px;min-width:150px}
.result-file-table th:nth-child(2),.result-file-table td:nth-child(2){width:320px;max-width:420px}
.result-file-table th:nth-child(3),.result-file-table td:nth-child(3){width:105px;min-width:105px}
.result-file-table th:nth-child(4),.result-file-table td:nth-child(4){width:82px;min-width:82px}
.result-file-table th:last-child,.result-file-table td:last-child{width:auto;min-width:max-content;white-space:nowrap}
.result-file-table .file-name-cell{overflow-wrap:anywhere;word-break:break-word}
.result-file-table .file-action-cell{text-align:left}
@media(max-width:900px){
  .result-file-table{width:max-content;max-width:none;min-width:0}
}

.file-index-selection-control{display:flex;align-items:center;gap:8px;min-width:220px}
.file-index-selection-control>input[type="checkbox"]{flex:0 0 auto}
.file-index-selection-scope{width:auto;min-width:170px;max-width:230px}

.assignment-mode-card-select{margin-top:.75rem;width:100%;}
.assignment-mode-card:has(#filetype-assignment-global:checked) .assignment-mode-card-select{pointer-events:auto;}

/* v3.0.36: collapsible file-type live preview */
.filetype-live-preview-section{display:block}
.filetype-live-preview-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;list-style:none;padding:2px 0}
.filetype-live-preview-summary::-webkit-details-marker{display:none}
.filetype-live-preview-summary strong{display:block;font-size:20px;line-height:1.25}
.filetype-live-preview-chevron{font-size:22px;transition:transform .15s ease}
.filetype-live-preview-section[open] .filetype-live-preview-chevron{transform:rotate(180deg)}
.filetype-live-preview-body{display:grid;gap:14px;margin-top:16px}

/* v3.0.36: Filefilter des aktuell geöffneten Klassifikators hervorheben */
.filetype-filter-list .global-filter-row.current-classifier-filter{background:#fff8d8;border-color:#e6cf6a;box-shadow:0 0 0 1px rgba(170,130,0,.08) inset}
.filetype-filter-list .global-filter-row.current-classifier-filter .filetype-filter-owner select{font-weight:700}

/* v3.0.39: Verwaltungskarten nutzen den verfügbaren Viewport dynamisch statt einer festen 1180px-Grenze. */
@media (min-width: 1051px) {
  .admin-content > .card { width: 100%; }
}

/* v3.0.39: Öffentliche Suche und Ergebnis-Card teilen wieder exakt dieselbe responsive Inhaltsbreite. */
.search-bar-inner,
.search-results-card {
  width: 100%;
  max-width: 1760px;
  margin-left: auto;
  margin-right: auto;
}
.search-results-card {
  box-sizing: border-box;
}


/* v3.0.42: file security blocklist */
.file-security-form { gap: 16px; }
.file-security-form .security-list { min-height: 132px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.file-security-script-toggle { align-items: flex-start; gap: 10px; }
.file-security-script-toggle span { display: grid; gap: 3px; }
.file-security-blocked td { background: #fff0f0; border-color: #f0c2c2; }
.file-security-blocked td:first-child { box-shadow: inset 4px 0 0 #c62828; }
.badge-danger { background: #ffe1e1; color: #a51616; }
.file-security-integrity { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.file-security-preset-field { gap: 8px; }
.file-security-preset-row { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 10px; align-items: end; }
.file-security-preset-row .btn { white-space: nowrap; }
@media(max-width:760px){.file-security-preset-row{grid-template-columns:1fr}.file-security-preset-row .btn{justify-self:start}}

/* v3.0.43: blocked-file presets and independent file-security rights */

/* v3.0.56: suspicious product-match warnings in classifier live preview */
.strategy-preview-warning-summary{display:flex;align-items:center;gap:8px;margin:0 0 10px;padding:8px 10px;border:1px solid #e1bb4a;border-radius:10px;background:#fff7dc;color:#5e4700;font-size:12px;font-weight:800}
.strategy-preview-warning-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1;cursor:help;flex:0 0 auto}
.strategy-preview-warning-row>td{background:#fffaf0}
.strategy-preview-markers{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:28px}
.strategy-preview-warning-cell{width:34px;min-width:34px;text-align:center!important;padding-left:6px!important;padding-right:6px!important}
.strategy-preview-warning-inline{background:#fffaf0;border-radius:7px;padding:3px 6px}
.strategy-preview-warning-row .strategy-preview-expand-cell{width:64px;min-width:64px}

/* v3.0.56: full global product-matching dialog */
.global-product-match-dialog-card .filetype-product-match-config-grid{grid-template-columns:minmax(220px,.9fr) minmax(210px,.75fr) minmax(360px,1.35fr);align-items:end}
.global-product-match-dialog-card .filetype-live-preview-section{margin-top:4px}
@media(max-width:980px){.global-product-match-dialog-card .filetype-product-match-config-grid{grid-template-columns:1fr}}

/* v3.0.58: asymmetric match conflicts + collapsed live-preview warning badge */
.filetype-live-preview-summary-status{display:inline-flex;align-items:center;gap:10px;flex:0 0 auto}
.filetype-live-preview-warning-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border:1px solid #e1bb4a;border-radius:999px;background:#fff7dc;color:#5e4700;font-size:12px;font-weight:900;cursor:help}
.filetype-live-preview-warning-badge[hidden]{display:none!important}
.filetype-live-preview-warning-symbol::before{content:"⚠️"}
.filetype-live-preview-warning-badge.has-asymmetry{background:#ffeaa7;border-color:#c99700;color:#4d3900}
.strategy-preview-asymmetry-summary{margin:0 0 12px;padding:12px 14px;border:1px solid #c99700;border-radius:10px;background:#fff2b8;color:#4d3900}
.strategy-preview-asymmetry-heading{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:13px}
.strategy-preview-asymmetry-summary ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.strategy-preview-asymmetry-summary li{display:flex;align-items:flex-start;gap:8px;padding:6px 8px;border-radius:7px;background:rgba(255,255,255,.55);font-size:12px;font-weight:700}
.strategy-preview-asymmetry-truncated{margin-top:8px;font-size:11px;font-weight:700}
.strategy-preview-asymmetric-row>td{background:#fff1b8!important}
.strategy-preview-warning-inline:has(.strategy-preview-warning-icon){outline:1px solid rgba(201,151,0,.25)}

/* v3.0.58: classification matching autopilot */
.filetype-autopilot-section{display:grid;gap:12px}
.filetype-autopilot-heading-row{margin-bottom:0}
.filetype-autopilot-controls{display:grid;grid-template-columns:minmax(280px,1fr) auto;gap:12px;align-items:end}
.filetype-autopilot-controls .btn{white-space:nowrap}
.filetype-autopilot-result:empty{display:none}
.filetype-autopilot-result-card{display:grid;gap:12px;padding:14px;border:1px solid #d8d8df;border-radius:12px;background:#fafafd}
.filetype-autopilot-result-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.filetype-autopilot-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.filetype-autopilot-value{display:grid;gap:4px;padding:10px 12px;border:1px solid #e2e2e8;border-radius:9px;background:#fff;min-width:0}
.filetype-autopilot-value>span{font-size:11px;color:#666;font-weight:700}
.filetype-autopilot-value code{overflow-wrap:anywhere;white-space:normal}
.filetype-autopilot-validation{padding:9px 11px;border-radius:9px;background:#f1f4ed;color:#3d5f18;font-size:12px;font-weight:700}
.filetype-autopilot-candidates summary{cursor:pointer;font-weight:800;color:var(--purple,#5a2483)}
.filetype-autopilot-candidates ul{display:grid;gap:6px;margin:8px 0 0;padding:0;list-style:none}
.filetype-autopilot-candidates li{display:grid;grid-template-columns:20px minmax(140px,.8fr) minmax(180px,1fr) auto;gap:8px;align-items:center;padding:7px 9px;border-radius:8px;background:#fff;border:1px solid #e6e6eb;font-size:12px}
.filetype-autopilot-candidates small{color:#666}
.badge-info{background:rgba(90,36,131,.10);color:#5a2483}
@media(max-width:820px){.filetype-autopilot-controls,.filetype-autopilot-values{grid-template-columns:1fr}.filetype-autopilot-candidates li{grid-template-columns:20px 1fr}.filetype-autopilot-candidates li code,.filetype-autopilot-candidates li small{grid-column:2}}