/* ==========================================================================
   km-school.css - school modules (2026-10-20), prefix ksc- / kita- / ksd- / ksr- / ksf- / ksl- / ksw- / ksdb-
   ITA / OIT, documents, org chart (RMS), contact + complaints, site search, landing module,
   urgent alert bar, QR codes, setup wizard and dashboard. Loaded on every page by head.php
   (ksc_head_tags) before the dark sheets; colours come from the --km-* tokens of km-theme.css,
   which km-dark.css redefines for dark mode, so these pages follow light/dark automatically.
   ========================================================================== */
:root {
  --ksc-ok: #067647; --ksc-ok-bg: #ecfdf3; --ksc-ok-bd: #abefc6;
  --ksc-warn: #b54708; --ksc-warn-bg: #fffaeb; --ksc-warn-bd: #fedf89;
  --ksc-bad: #b42318; --ksc-bad-bg: #fef3f2; --ksc-bad-bd: #fecdca;
  --ksc-info: #175cd3; --ksc-info-bg: #eff8ff; --ksc-info-bd: #b2ddff;
  --ksc-pri: var(--km-primary, #2563eb);
}
html[data-theme="dark"] {
  --ksc-ok: #75e0a7; --ksc-ok-bg: rgba(18, 183, 106, .14); --ksc-ok-bd: rgba(18, 183, 106, .35);
  --ksc-warn: #fec84b; --ksc-warn-bg: rgba(247, 144, 9, .14); --ksc-warn-bd: rgba(247, 144, 9, .35);
  --ksc-bad: #fda29b; --ksc-bad-bg: rgba(240, 68, 56, .14); --ksc-bad-bd: rgba(240, 68, 56, .35);
  --ksc-info: #84caff; --ksc-info-bg: rgba(46, 144, 250, .14); --ksc-info-bd: rgba(46, 144, 250, .35);
}

/* ---------------------------------------------------------------- page + shared pieces */
.ksc-page { max-width: var(--km-max, 1240px); margin: 0 auto; padding: 4px 0 28px; color: var(--km-text); }
.ksc-page *, .ksc-admin *, .ksl * { box-sizing: border-box; }
.ksc-muted { color: var(--km-muted); }
.ksc-card { background: var(--km-surface); border: 1px solid var(--km-border); border-radius: var(--km-radius, 14px); box-shadow: var(--km-shadow-sm); padding: 18px 20px; margin: 0 0 16px; }
.ksc-card-title { font-size: 17px; font-weight: 600; margin: 0 0 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ksc-card-title > i { color: var(--ksc-pri); }
.ksc-card-title small { color: var(--km-muted); font-weight: 400; font-size: 13px; }
details.ksc-card > summary { cursor: pointer; font-weight: 600; list-style: none; }
details.ksc-card > summary::-webkit-details-marker { display: none; }
details.ksc-card[open] > summary { margin-bottom: 12px; }
details.ksc-card.is-danger > summary { color: var(--ksc-bad); }
.ksc-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.ksc-grid-main { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.ksc-grid2 > .ksc-card, .ksc-grid-main > .ksc-card { margin: 0; }
.ksc-row2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.ksc-row3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 14px; }

.ksc-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding: 22px 24px; margin: 0 0 16px; border-radius: 18px; color: #fff;
  background: linear-gradient(135deg, var(--ksc-pri), color-mix(in srgb, var(--ksc-pri) 62%, #0f172a)); background-color: var(--ksc-pri); box-shadow: var(--km-shadow); }
.ksc-hero-main { display: flex; align-items: center; gap: 14px; flex: 1 1 320px; min-width: 0; }
.ksc-hero-ico { flex: 0 0 52px; height: 52px; border-radius: 14px; background: rgba(255, 255, 255, .18); display: grid; place-items: center; font-size: 24px; }
.ksc-hero h1 { font-size: 24px; font-weight: 600; margin: 0; line-height: 1.3; color: #fff; }
.ksc-hero p { margin: 4px 0 0; opacity: .88; }
.ksc-hero-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.ksc-hero-stats div { background: rgba(255, 255, 255, .14); border-radius: 12px; padding: 8px 14px; min-width: 92px; text-align: center; }
.ksc-hero-stats b { display: block; font-size: 22px; line-height: 1.2; }
.ksc-hero-stats span { font-size: 12px; opacity: .9; }
.ksc-hero-actions { display: flex; gap: 8px; flex-wrap: wrap; flex-basis: 100%; }
.ksc-hero .ksc-btn { background: #fff; color: var(--ksc-pri); border-color: #fff; }
.ksc-hero .ksc-btn-ghost { background: rgba(255, 255, 255, .14); color: #fff; border-color: rgba(255, 255, 255, .4); }

.ksc-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--ksc-pri); background: var(--ksc-pri); color: #fff;
  font: inherit; font-size: 14px; line-height: 1.3; cursor: pointer; text-decoration: none; white-space: nowrap; transition: filter .15s, background .15s; }
.ksc-btn:hover, .ksc-btn:focus { color: #fff; text-decoration: none; filter: brightness(1.08); }
.ksc-btn-ghost { background: transparent; color: var(--ksc-pri); }
.ksc-btn-ghost:hover, .ksc-btn-ghost:focus { color: var(--ksc-pri); background: var(--km-primary-soft); filter: none; }
.ksc-btn-sm { padding: 5px 12px; font-size: 13px; }
.ksc-btn-lg { padding: 11px 24px; font-size: 16px; }
.ksc-ibtn { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--km-border); background: var(--km-surface); color: var(--km-muted); cursor: pointer; padding: 0; }
.ksc-ibtn:hover { color: var(--ksc-pri); border-color: var(--ksc-pri); }
.ksc-ibtn.is-danger:hover { color: var(--ksc-bad); border-color: var(--ksc-bad); }
.ksc-ibtn.is-on { color: #fff; background: var(--ksc-pri); border-color: var(--ksc-pri); }
.ksc-inline { display: inline-flex; gap: 4px; margin: 0; }
.ksc-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 14px; }

.ksc-tag { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; font-size: 12px; line-height: 1.5; background: var(--km-surface-2); color: var(--km-muted); border: 1px solid var(--km-border); white-space: nowrap; font-style: normal; }
.ksc-tag.is-new { background: var(--ksc-bad-bg); color: var(--ksc-bad); border-color: var(--ksc-bad-bd); }
.ksc-tag.is-ok { background: var(--ksc-ok-bg); color: var(--ksc-ok); border-color: var(--ksc-ok-bd); }
.ksc-tag.is-warn, .ksc-tag.is-draft { background: var(--ksc-warn-bg); color: var(--ksc-warn); border-color: var(--ksc-warn-bd); }
.ksc-tag.is-pin { background: var(--km-primary-soft); color: var(--ksc-pri); border-color: transparent; }
.ksc-tag.is-muted { opacity: .8; }
.ksc-badge { display: inline-block; min-width: 18px; padding: 0 6px; border-radius: 999px; background: #f04438; color: #fff; font-size: 11px; line-height: 18px; text-align: center; }

.ksc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.ksc-chips > a, .ksc-chips > span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--km-border); background: var(--km-surface); color: var(--km-text); text-decoration: none; font-size: 14px; }
.ksc-chips > a:hover { border-color: var(--ksc-pri); color: var(--ksc-pri); text-decoration: none; }
.ksc-chips > a.is-active { background: var(--ksc-pri); border-color: var(--ksc-pri); color: #fff; }
.ksc-chips small { opacity: .75; }
.ksc-chips > a.is-add { border-style: dashed; color: var(--km-muted); }
.ksc-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--km-border); margin: 0 0 16px; scrollbar-width: thin; }
.ksc-tabs a { padding: 10px 16px; color: var(--km-muted); text-decoration: none; border-bottom: 2px solid transparent; white-space: nowrap; margin-bottom: -1px; }
.ksc-tabs a:hover { color: var(--ksc-pri); text-decoration: none; }
.ksc-tabs a.is-active { color: var(--ksc-pri); border-bottom-color: var(--ksc-pri); font-weight: 600; }

.ksc-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 14px; }
.ksc-search { position: relative; flex: 1 1 260px; margin: 0; font-weight: 400; }
.ksc-search > i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--km-muted); pointer-events: none; }
.ksc-search input { width: 100%; height: 40px; border-radius: 999px; border: 1px solid var(--km-border-strong); background: var(--km-surface); color: var(--km-text); padding: 0 16px 0 38px; font: inherit; }
.ksc-search input:focus, .ksc-bigsearch input:focus { outline: 0; border-color: var(--ksc-pri); box-shadow: 0 0 0 3px var(--km-primary-ring); }
.ksc-select { width: auto; min-width: 140px; height: 40px; border-radius: 10px; display: inline-block; }
.ksc-progress { flex: 0 1 200px; height: 8px; border-radius: 999px; background: var(--km-surface-2); border: 1px solid var(--km-border); overflow: hidden; }
.ksc-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--ksc-pri), #12b76a); border-radius: 999px; }
.ksc-result-note { color: var(--km-muted); margin: -4px 0 12px; }

.ksc-empty { text-align: center; padding: 40px 20px; color: var(--km-muted); background: var(--km-surface); border: 1px dashed var(--km-border-strong); border-radius: 16px; margin: 0 0 16px; }
.ksc-empty > i { display: block; font-size: 40px; opacity: .45; margin-bottom: 10px; }
.ksc-empty b { display: block; font-size: 17px; color: var(--km-text); }
.ksc-empty p { margin: 6px 0 0; }
.ksc-flash { padding: 12px 16px; border-radius: 12px; margin: 0 0 14px; border: 1px solid var(--ksc-ok-bd); background: var(--ksc-ok-bg); color: var(--ksc-ok); }
.ksc-flash.is-error { border-color: var(--ksc-bad-bd); background: var(--ksc-bad-bg); color: var(--ksc-bad); }
.ksc-flash.is-warning { border-color: var(--ksc-warn-bd); background: var(--ksc-warn-bg); color: var(--ksc-warn); }
.ksc-note { padding: 10px 14px; border-radius: 10px; margin: 0 0 14px; background: var(--km-surface-2); border: 1px solid var(--km-border); }
.ksc-note.is-ok { background: var(--ksc-ok-bg); border-color: var(--ksc-ok-bd); color: var(--ksc-ok); }
.ksc-note.is-warn { background: var(--ksc-warn-bg); border-color: var(--ksc-warn-bd); color: var(--ksc-warn); }
.ksc-note a { color: inherit; text-decoration: underline; }
.ksc-foot-note { color: var(--km-muted); font-size: 13px; margin: 18px 0 0; }
.ksc-crumb { margin: 0 0 12px; color: var(--km-muted); font-size: 14px; }
.ksc-crumb a { color: var(--km-muted); }
.ksc-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 18px 0 0; }
.ksc-pager a, .ksc-pager b, .ksc-pager span { min-width: 36px; height: 36px; display: inline-grid; place-items: center; padding: 0 10px; border-radius: 10px; border: 1px solid var(--km-border); background: var(--km-surface); color: var(--km-text); text-decoration: none; }
.ksc-pager b { background: var(--ksc-pri); border-color: var(--ksc-pri); color: #fff; }
.ksc-pager .ksc-pager-gap { border: 0; background: none; }
.ksc-dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 8px 14px; margin: 0; }
.ksc-dl dt { font-weight: 500; color: var(--km-muted); }
.ksc-dl dd { margin: 0; word-break: break-word; }
.ksc-dl.is-inline { font-size: 13px; margin-top: 10px; }
.ksc-mini-list { padding-left: 18px; margin: 6px 0 0; }

/* QR popover */
.ksc-qr { position: relative; display: inline-block; }
.ksc-qr > summary { list-style: none; }
.ksc-qr > summary::-webkit-details-marker { display: none; }
.ksc-qr-pop { position: absolute; z-index: 30; top: calc(100% + 8px); left: 0; width: 220px; padding: 14px; border-radius: 14px; background: #fff; color: #1f2937; box-shadow: var(--km-shadow-lg); border: 1px solid #e5e7eb; text-align: center; }
.ksc-qr-img svg { display: block; margin: 0 auto; width: 180px; height: 180px; }
.ksc-qr-pop p { font-size: 12px; margin: 8px 0; color: #64748b; }
.ksc-hero .ksc-qr-pop { color: #1f2937; }

/* ---------------------------------------------------------------- ITA / OIT */
.kita-group { margin: 0 0 20px; }
.kita-group-title { font-size: 16px; font-weight: 600; margin: 18px 0 10px; padding-left: 12px; border-left: 4px solid var(--ksc-pri); }
.kita-list { display: grid; gap: 8px; }
.kita-item { background: var(--km-surface); border: 1px solid var(--km-border); border-radius: 12px; overflow: hidden; }
.kita-item > summary { display: flex; align-items: center; gap: 12px; padding: 12px 14px; cursor: pointer; list-style: none; }
.kita-item > summary::-webkit-details-marker { display: none; }
.kita-item > summary:hover { background: var(--km-surface-2); }
.kita-code { flex: 0 0 auto; min-width: 46px; padding: 3px 8px; border-radius: 8px; text-align: center; font-weight: 700; font-size: 13px; background: var(--km-primary-soft); color: var(--ksc-pri); }
.kita-item.is-done .kita-code { background: var(--ksc-ok-bg); color: var(--ksc-ok); }
.kita-title { flex: 1 1 auto; font-weight: 500; min-width: 0; }
.kita-count { flex: 0 0 auto; font-size: 13px; color: var(--km-muted); white-space: nowrap; }
.kita-item.is-empty .kita-count { color: var(--ksc-warn); }
.kita-body { padding: 4px 16px 14px 72px; border-top: 1px solid var(--km-border); }
.kita-detail { color: var(--km-muted); font-size: 14px; margin: 10px 0; }
.kita-links { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 6px; }
.kita-links li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 8px 12px; border-radius: 10px; background: var(--km-surface-2); }
.kita-links li > a { flex: 1 1 auto; min-width: 0; word-break: break-word; }
.kita-links li.is-auto { background: var(--ksc-info-bg); }
.kita-edit { display: inline-block; margin-top: 10px; font-size: 13px; }
.kita-adm-body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 18px; padding-left: 16px; }
.kita-adm-col h4 { font-size: 14px; font-weight: 600; margin: 12px 0 8px; }
.kita-add { display: grid; gap: 8px; margin-top: 10px; padding: 12px; border: 1px dashed var(--km-border-strong); border-radius: 12px; }
.kita-edit-form label, .ksc-form label { display: block; font-weight: 500; margin: 0 0 12px; }
.ksc-form label > .form-control, .kita-edit-form label > .form-control { margin-top: 4px; font-weight: 400; }
.ksc-start-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.ksc-start-opt { padding: 16px; border: 1px solid var(--km-border); border-radius: 14px; background: var(--km-surface-2); display: grid; gap: 10px; align-content: start; }
.ksc-start-opt p { margin: 0; color: var(--km-muted); font-size: 14px; }

/* ---------------------------------------------------------------- documents */
.ksd-list { display: grid; gap: 8px; }
.ksd-row { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 12px; background: var(--km-surface); border: 1px solid var(--km-border); }
.ksd-row.is-pin { border-color: color-mix(in srgb, var(--ksc-pri) 40%, var(--km-border)); box-shadow: inset 4px 0 0 var(--ksc-pri); }
.ksd-ico { flex: 0 0 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; font-size: 20px; background: var(--km-primary-soft); color: var(--ksc-pri); }
.ksd-ico .fa-file-pdf-o { color: #d92d20; }
.ksd-ico .fa-file-word-o { color: #1570ef; }
.ksd-ico .fa-file-excel-o { color: #079455; }
.ksd-ico .fa-file-powerpoint-o { color: #e04f16; }
.ksd-ico.is-lg { flex-basis: 64px; height: 64px; font-size: 30px; border-radius: 16px; }
.ksd-main { flex: 1 1 auto; min-width: 0; }
.ksd-title { font-weight: 600; color: var(--km-text); display: block; word-break: break-word; }
.ksd-title:hover { color: var(--ksc-pri); }
.ksd-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; font-size: 13px; color: var(--km-muted); align-items: center; }
.ksd-cat { color: var(--km-muted); }
.ksd-dl { flex: 0 0 auto; }
.ksd-one header { display: flex; gap: 16px; align-items: flex-start; }
.ksd-one h1 { font-size: 22px; font-weight: 600; margin: 0 0 6px; line-height: 1.4; word-break: break-word; }
.ksd-detail { margin: 16px 0 0; line-height: 1.75; }
.ksd-preview { margin-top: 16px; border-radius: 12px; overflow: hidden; border: 1px solid var(--km-border); background: var(--km-surface-2); }
.ksd-preview iframe { display: block; width: 100%; height: 78vh; border: 0; }
.ksd-preview.is-img img { display: block; max-width: 100%; margin: 0 auto; }
.ksd-adm-row { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.ksd-adm-row .ksd-row { flex: 1 1 auto; border: 0; padding: 8px 4px; background: none; box-shadow: none; }
.ksd-adm-row + .ksd-adm-row { border-top: 1px solid var(--km-border); }
.ksd-adm-act { display: flex; gap: 4px; }
.ksd-form .ksc-grid-main aside { background: var(--km-surface-2); border-radius: 12px; padding: 14px; }
.ksc-fieldset { border: 1px solid var(--km-border); border-radius: 12px; padding: 12px 14px 4px; margin: 0 0 14px; }
.ksc-fieldset legend { width: auto; border: 0; padding: 0 6px; margin: 0; font-size: 14px; font-weight: 600; color: var(--km-text); }
.ksc-radios { display: grid; gap: 8px; margin: 6px 0 10px; }
.ksc-radios label, .ksc-check { display: flex !important; align-items: center; gap: 8px; font-weight: 400 !important; margin: 0 0 8px; cursor: pointer; }
.ksc-radios input, .ksc-check input { margin: 0; flex: 0 0 auto; }
.ksc-sub { padding-left: 24px; }
.ksd-curfile { padding: 8px 12px; border-radius: 10px; background: var(--km-surface-2); display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ksc-danger-zone { margin: -6px 0 16px; text-align: right; }
.ksc-table { margin: 0; }
.ksc-inline-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 0; }
.ksc-inline-form .form-control { width: auto; flex: 1 1 160px; }
.ksc-inline-form .ksc-icon-select { flex: 0 0 120px; }
.ksc-add-row { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--km-border); }

/* ---------------------------------------------------------------- org chart (RMS) */
.ksr-av { position: relative; flex: 0 0 auto; display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; overflow: hidden;
  background: var(--km-primary-soft); color: var(--ksc-pri); font-weight: 700; font-size: 20px; }
.ksr-av img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.ksr-av.is-xs { width: 26px; height: 26px; font-size: 12px; }
.ksr-av.is-sm { width: 44px; height: 44px; font-size: 16px; }
.ksr-av.is-lg { width: 96px; height: 96px; font-size: 32px; }
.ksr-av.is-xl { width: 140px; height: 140px; font-size: 44px; box-shadow: 0 0 0 4px var(--km-surface), 0 0 0 6px var(--ksc-pri); }
.ksr-exec-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 16px; }
.ksr-exec-grid.is-sub { margin-top: 18px; }
.ksr-exec-card { flex: 0 1 220px; text-align: center; padding: 16px 12px; border-radius: 16px; background: var(--km-surface-2); }
.ksr-exec-card.is-top { flex-basis: 320px; background: none; }
.ksr-exec-card h3 { font-size: 16px; font-weight: 600; margin: 12px 0 2px; }
.ksr-exec-card.is-top h3 { font-size: 20px; }
.ksr-role { color: var(--ksc-pri); font-size: 14px; margin: 2px 0; line-height: 1.5; }
.ksr-acad { color: var(--km-muted); font-size: 13px; margin: 2px 0; }
.ksr-contacts { display: flex; justify-content: center; gap: 6px; margin-top: 8px; flex-wrap: wrap; }
.ksr-contacts a { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--km-surface); border: 1px solid var(--km-border); color: var(--km-muted); }
.ksr-contacts a:hover { color: var(--ksc-pri); border-color: var(--ksc-pri); }
.ksr-tree { display: flex; flex-direction: column; align-items: center; }
.ksr-node { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 14px; background: var(--km-surface); border: 1px solid var(--km-border); box-shadow: var(--km-shadow-sm); text-align: left; }
.ksr-node > div { min-width: 0; }
.ksr-node b { display: block; font-weight: 600; }
.ksr-node span { font-size: 13px; color: var(--km-muted); }
.ksr-node.is-root { border: 2px solid var(--ksc-pri); }
.ksr-branches { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; margin-top: 28px; padding-top: 18px; width: 100%; }
.ksr-branches::before { content: ""; position: absolute; top: -28px; left: 50%; height: 28px; border-left: 2px solid var(--km-border-strong); }
.ksr-branches::after { content: ""; position: absolute; top: 0; left: 12%; right: 12%; border-top: 2px solid var(--km-border-strong); }
.ksr-branch { position: relative; flex: 1 1 200px; max-width: 260px; }
.ksr-branch::before { content: ""; position: absolute; top: -18px; left: 50%; height: 18px; border-left: 2px solid var(--km-border-strong); }
.ksr-branch .ksr-node { flex-direction: column; align-items: stretch; gap: 6px; height: 100%; border-top: 4px solid var(--ksc-pri); }
.ksr-branch.is-h2 .ksr-node { border-top-color: #0e9384; }
.ksr-branch.is-h3 .ksr-node { border-top-color: #dc6803; }
.ksr-branch.is-h4 .ksr-node { border-top-color: #7a5af8; }
.ksr-head { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--km-text); flex-wrap: wrap; }
.ksr-head small { color: var(--km-muted); width: 100%; padding-left: 32px; margin-top: -4px; }
.ksr-count { font-size: 12px; color: var(--ksc-pri); }
.ksr-group-title { font-size: 15px; font-weight: 600; margin: 24px 0 10px; }
.ksr-group-title small { color: var(--km-muted); font-weight: 400; }
.ksr-units { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px; }
.ksr-unit { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--km-border); background: var(--km-surface-2); color: var(--km-text); text-decoration: none; }
.ksr-unit:hover { border-color: var(--ksc-pri); text-decoration: none; color: var(--km-text); }
.ksr-unit b { font-weight: 600; font-size: 14px; }
.ksr-dir { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.ksr-person { display: flex; gap: 12px; padding: 12px; border-radius: 14px; border: 1px solid var(--km-border); background: var(--km-surface); align-items: flex-start; }
.ksr-person[hidden] { display: none; }
.ksr-pmain { min-width: 0; flex: 1 1 auto; }
.ksr-pmain h3 { font-size: 15px; font-weight: 600; margin: 2px 0; }
.ksr-pmain h3 small { color: var(--km-muted); font-weight: 400; }
.ksr-person .ksr-contacts { justify-content: flex-start; }
.ksr-person .ksr-contacts a { width: 28px; height: 28px; font-size: 13px; }
.ksc-empty-inline { text-align: center; color: var(--km-muted); padding: 20px; }

/* ---------------------------------------------------------------- contact + complaints */
.ksc-contact .ksc-dl { margin-bottom: 14px; }
.ksc-socials { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0 0; }
.ksc-social { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; color: #fff; text-decoration: none; font-size: 14px; background: #475467; }
.ksc-social:hover { color: #fff; text-decoration: none; filter: brightness(1.1); }
.ksc-social.is-facebook { background: #1877f2; } .ksc-social.is-line { background: #06c755; } .ksc-social.is-youtube { background: #ff0000; } .ksc-social.is-tiktok { background: #111827; }
.ksc-map { padding: 0; overflow: hidden; min-height: 320px; display: flex; }
.ksc-map iframe { border: 0; width: 100%; min-height: 360px; flex: 1 1 auto; }
.ksc-map .ksc-empty { margin: auto; border: 0; }
.ksf-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.ksf-form { position: relative; max-width: 760px; }
.ksf-anon { padding: 10px 14px; border-radius: 10px; background: var(--km-surface-2); }
.ksf-captcha { display: flex; gap: 14px; align-items: flex-end; flex-wrap: wrap; }
.ksf-captcha img { border-radius: 8px; border: 1px solid var(--km-border); margin-bottom: 12px; background: #f0f0f0; }
.ksf-captcha label { flex: 0 1 200px; }
.ksf-consent { font-size: 14px; align-items: flex-start !important; }
.ksf-consent input { margin-top: 4px; }
.ksf-guide ul { margin: 0; padding-left: 20px; line-height: 1.8; }
.ksf-sent { text-align: center; padding: 28px 20px; }
.ksf-sent > i { font-size: 48px; color: var(--ksc-ok); }
.ksf-sent h2 { font-size: 22px; margin: 10px 0; }
.ksf-ticket { display: inline-block; font-size: 32px; font-weight: 700; letter-spacing: 3px; padding: 8px 24px; border-radius: 14px; border: 2px dashed var(--ksc-pri); color: var(--ksc-pri); margin: 4px 0 12px; font-family: Consolas, Menlo, monospace; }
.ksf-track { max-width: 560px; }
.ksf-track > label { display: block; font-weight: 600; margin-bottom: 8px; }
.ksf-track .form-control { letter-spacing: 2px; text-transform: uppercase; }
.ksf-result-head { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; }
.ksf-result-head b { font-size: 17px; }
.ksf-result-head .ksc-muted { flex-basis: 100%; font-size: 13px; }
.ksf-steps { display: flex; list-style: none; padding: 0; margin: 18px 0; counter-reset: s; }
.ksf-steps li { flex: 1 1 0; position: relative; text-align: center; font-size: 13px; color: var(--km-muted); padding-top: 34px; }
.ksf-steps li::before { counter-increment: s; content: counter(s); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--km-surface-2); border: 2px solid var(--km-border-strong); font-weight: 700; z-index: 1; }
.ksf-steps li + li::after { content: ""; position: absolute; top: 13px; right: 50%; width: 100%; border-top: 2px solid var(--km-border-strong); }
.ksf-steps li.is-done { color: var(--ksc-ok); font-weight: 600; }
.ksf-steps li.is-done::before { background: var(--ksc-ok); border-color: var(--ksc-ok); color: #fff; content: "\2713"; }
.ksf-steps li.is-done::after { border-top-color: var(--ksc-ok); }
.ksf-reply { padding: 14px 16px; border-radius: 12px; background: var(--ksc-info-bg); border: 1px solid var(--ksc-info-bd); }
.ksf-reply h3 { font-size: 15px; font-weight: 600; margin: 0 0 6px; color: var(--ksc-info); }
.ksf-reply p { margin: 0 0 6px; }
.ksf-rate { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ksf-stars { display: inline-flex; flex-direction: row-reverse; }
.ksf-stars input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksf-stars label { font-size: 28px; color: var(--km-border-strong); cursor: pointer; padding: 0 2px; margin: 0; }
.ksf-stars label:hover, .ksf-stars label:hover ~ label, .ksf-stars input:checked ~ label { color: #f5b301; }
.ksf-stars input:focus-visible + label { outline: 2px solid var(--ksc-pri); border-radius: 4px; }
.ksf-rated { color: #f5b301; }
.ksf-sat { margin: 12px 0 0; }
.ksf-sat > i { color: #f5b301; }
.ksf-bars { display: flex; align-items: flex-end; gap: 6px; height: 150px; margin-top: 16px; padding-top: 18px; }
.ksf-bar { flex: 1 1 0; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; }
.ksf-bar span { width: 100%; max-width: 30px; min-height: 2px; border-radius: 6px 6px 0 0; background: var(--ksc-pri); position: relative; }
.ksf-bar span b { position: absolute; top: -18px; left: 0; right: 0; text-align: center; font-size: 11px; color: var(--km-text); }
.ksf-bar small { font-size: 11px; color: var(--km-muted); margin-top: 4px; }
.ksf-list { display: grid; gap: 10px; }
.ksf-item { padding: 0; }
.ksf-item > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 14px 16px; margin: 0 !important; }
.ksf-item > summary .ksc-muted { font-weight: 400; font-size: 13px; flex-basis: 100%; }
.ksf-item-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; padding: 0 16px 16px; }
.ksf-msg { padding: 12px 14px; border-radius: 12px; background: var(--km-surface-2); white-space: normal; word-break: break-word; }
.ksc-seg { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; align-items: center; }
.ksc-seg > span { color: var(--km-muted); margin-right: 4px; }
.ksc-seg label { display: inline-flex !important; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--km-border); background: var(--km-surface); font-weight: 400 !important; cursor: pointer; margin: 0 !important; font-size: 13px; }
.ksc-seg input { margin: 0; }
.ksc-seg label:has(input:checked) { border-color: var(--ksc-pri); background: var(--km-primary-soft); color: var(--ksc-pri); }

/* ---------------------------------------------------------------- search */
.ksc-bigsearch { position: relative; display: flex; gap: 10px; max-width: 760px; margin: 10px auto 18px; }
.ksc-bigsearch > i { position: absolute; left: 20px; top: 50%; transform: translateY(-50%); color: var(--km-muted); font-size: 18px; pointer-events: none; }
.ksc-bigsearch input { flex: 1 1 auto; min-width: 0; height: 52px; border-radius: 999px; border: 1px solid var(--km-border-strong); background: var(--km-surface); color: var(--km-text); padding: 0 20px 0 50px; font: inherit; font-size: 17px; box-shadow: var(--km-shadow-sm); }
.ksc-search-hint { text-align: center; color: var(--km-muted); }
.ksc-search-hint .ksc-chips { justify-content: center; }
.ksc-results ul { list-style: none; margin: 0; padding: 0; }
.ksc-results li { padding: 10px 0; border-top: 1px solid var(--km-border); }
.ksc-results li:first-child { border-top: 0; padding-top: 0; }
.ksc-results li > a { font-weight: 600; font-size: 15px; }
.ksc-results li > small { display: block; color: var(--km-muted); margin-top: 2px; }
.ksc-results li > p { margin: 4px 0 0; font-size: 14px; color: var(--km-muted); }
.ksc-results mark { background: #fef08a; color: inherit; padding: 0 2px; border-radius: 3px; }
html[data-theme="dark"] .ksc-results mark { background: rgba(250, 204, 21, .3); }
.ksc-more { display: inline-block; margin-top: 8px; font-size: 14px; }

/* ---------------------------------------------------------------- header: menu, search icon, urgent alert */
.ksc-nav .dropdown-menu .fa { color: var(--ksc-pri); margin-right: 4px; }
.ksc-alert { color: #fff; background: #b54708; font-size: 15px; position: relative; z-index: 5; }
.ksc-alert.is-info { background: #175cd3; }
.ksc-alert.is-danger { background: #b42318; animation: kscPulse 2s ease-in-out 2; }
.ksc-alert-in { display: flex; align-items: center; gap: 10px; padding: 10px 15px; }
.ksc-alert-in > i { font-size: 18px; flex: 0 0 auto; }
.ksc-alert-txt { flex: 1 1 auto; min-width: 0; font-weight: 500; }
.ksc-alert-link { color: #fff !important; text-decoration: underline; white-space: nowrap; font-weight: 600; }
.ksc-alert-x { background: none; border: 0; color: #fff; font-size: 22px; line-height: 1; opacity: .8; cursor: pointer; padding: 0 4px; }
.ksc-alert-x:hover { opacity: 1; }
.ksc-alert[hidden] { display: none; }
.ksc-alert-preview .ksc-alert { margin-top: 6px; border-radius: 10px; }
@keyframes kscPulse { 50% { filter: brightness(1.25); } }
@media (prefers-reduced-motion: reduce) { .ksc-alert.is-danger { animation: none; } }
.km-post-pin { color: var(--ksc-pri); font-weight: 600; }

/* ---------------------------------------------------------------- landing module (page_landing.php) */
.ksl { --ksl-c: var(--km-primary, #1d4ed8); margin: 0 0 18px; }
.ksl-hero { position: relative; border-radius: 22px; overflow: hidden; color: #fff; min-height: 300px; display: flex; align-items: flex-end;
  background: radial-gradient(1200px 400px at 10% 0%, color-mix(in srgb, var(--ksl-c) 70%, #fff) 0%, transparent 60%), linear-gradient(135deg, var(--ksl-c), color-mix(in srgb, var(--ksl-c) 55%, #0b1220));
  background-color: var(--ksl-c); background-size: cover; background-position: center; box-shadow: var(--km-shadow); }
.ksl-hero.has-img::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .25) 45%, rgba(0, 0, 0, .72) 100%); }
.ksl-hero-in { position: relative; display: flex; align-items: flex-end; gap: 20px; padding: 32px 34px 66px; width: 100%; flex-wrap: wrap; }
.ksl-logo { width: 110px; height: 110px; object-fit: contain; background: #fff; border-radius: 24px; padding: 10px; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); flex: 0 0 auto; }
.ksl-hero-text { flex: 1 1 360px; min-width: 0; }
.ksl-aff { margin: 0 0 4px; opacity: .85; font-size: 14px; }
.ksl-hero h1 { margin: 0; font-size: clamp(26px, 4vw, 40px); font-weight: 700; line-height: 1.25; color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.ksl-en { margin: 2px 0 0; opacity: .85; letter-spacing: .3px; }
.ksl-sub { margin: 10px 0 0; font-size: 17px; opacity: .95; }
.ksl-cta { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.ksl-btn { display: inline-block; padding: 10px 22px; border-radius: 999px; background: #fff; color: var(--ksl-c) !important; font-weight: 600; text-decoration: none !important; box-shadow: 0 4px 14px rgba(0, 0, 0, .18); }
.ksl-btn.is-ghost { background: rgba(255, 255, 255, .14); color: #fff !important; border: 1px solid rgba(255, 255, 255, .6); box-shadow: none; }
.ksl-btn:hover { transform: translateY(-1px); }
.ksl-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 12px; margin: -34px 18px 0; position: relative; z-index: 2; }
.ksl-tile { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 8px; border-radius: 16px; background: var(--km-surface); border: 1px solid var(--km-border); box-shadow: var(--km-shadow); color: var(--km-text) !important; text-decoration: none !important; text-align: center; font-size: 14px; transition: transform .15s var(--km-ease), box-shadow .15s; }
.ksl-tile i { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 22px; background: color-mix(in srgb, var(--ksl-c) 12%, transparent); color: var(--ksl-c); }
html[data-theme="dark"] .ksl-tile i { color: var(--km-primary-hi, #8ab4ff); }
.ksl-tile:hover { transform: translateY(-3px); box-shadow: var(--km-shadow-lg); }
/* slide banner inside the landing (km_school.land_banner): no tile overlap when it sits right under the hero */
.ksl-banner { margin: 18px 0 0; }
.ksl-banner .km-banner { margin: 0; }
.ksl-bn-hero .ksl-hero-in { padding-bottom: 32px; }
.ksl-bn-hero .ksl-tiles { margin: 18px 0 0; }
.ksl-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 18px 0 0; }
.ksl-stat { padding: 16px; border-radius: 16px; background: var(--km-surface); border: 1px solid var(--km-border); display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 0 12px; align-items: center; }
.ksl-stat i { grid-row: span 2; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--km-primary-soft); color: var(--ksc-pri); font-size: 20px; }
.ksl-stat b { font-size: 24px; line-height: 1.2; }
.ksl-stat span { color: var(--km-muted); font-size: 13px; }
.ksl-about { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 14px; margin: 18px 0 0; }
.ksl-about > :only-child { grid-column: 1 / -1; }
.ksl-exec { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 18px; background: var(--km-surface); border: 1px solid var(--km-border); color: var(--km-text) !important; text-decoration: none !important; }
.ksl-exec > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.ksl-exec b { font-size: 17px; }
.ksl-exec small { color: var(--ksc-pri); font-size: 14px; }
.ksl-exec em { font-style: normal; font-size: 13px; color: var(--km-muted); margin-top: 6px; }
.ksl-vision { margin: 0; padding: 18px 22px; border-radius: 18px; border: 0; border-left: 5px solid var(--ksl-c); background: var(--km-surface); font-size: 16px; line-height: 1.8; color: var(--km-text); }
.ksl-vision small { display: block; color: var(--km-muted); font-size: 13px; margin-bottom: 4px; }
.ksl-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 18px 0 0; }
.ksl-cols.n1 { grid-template-columns: 1fr; }
.ksl-cols.n2 { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
/* news on its own full row, documents + events share the row below half and half (no empty third column) */
.ksl-cols.n3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* documents + events without news: two equal columns */
.ksl-cols.n2:not(:has(> .is-wide)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ksl-col { padding: 16px 18px; border-radius: 18px; background: var(--km-surface); border: 1px solid var(--km-border); min-width: 0; }
.ksl-cols.n3 .ksl-col.is-wide { grid-column: 1 / -1; }
.ksl-col header { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; }
.ksl-col h2 { font-size: 17px; font-weight: 600; margin: 0; }
.ksl-col h2 i { color: var(--ksc-pri); }
.ksl-col header a { font-size: 13px; white-space: nowrap; }
.ksl-news { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; }
.ksl-news.c1 { grid-template-columns: minmax(0, 420px); }
.ksl-news.c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ksl-news.c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ksl-news.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ksl-news-card { display: flex; flex-direction: column; gap: 6px; color: var(--km-text) !important; text-decoration: none !important; }
.ksl-news-img { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; background: var(--km-surface-2) center / cover no-repeat; display: grid; place-items: center; color: var(--km-muted); font-size: 28px; overflow: hidden; }
.ksl-news-img em { position: absolute; top: 8px; left: 8px; font-style: normal; font-size: 12px; padding: 2px 8px; border-radius: 999px; background: var(--ksc-pri); color: #fff; }
.ksl-news-card b { font-weight: 600; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ksl-news-card:hover b { color: var(--ksc-pri); }
.ksl-news-card small { color: var(--km-muted); }
.ksl-list, .ksl-events { list-style: none; margin: 0; padding: 0; }
.ksl-list li + li, .ksl-events li + li { border-top: 1px solid var(--km-border); }
.ksl-list a { display: flex; gap: 10px; padding: 9px 0; color: var(--km-text) !important; text-decoration: none !important; }
.ksl-list a > i { color: var(--ksc-pri); margin-top: 4px; }
.ksl-list a:hover span { color: var(--ksc-pri); }
.ksl-list span, .ksl-events span { min-width: 0; line-height: 1.45; }
.ksl-list small, .ksl-events small { display: block; color: var(--km-muted); font-size: 12px; margin-top: 2px; }
.ksl-events li { display: flex; gap: 12px; align-items: center; padding: 9px 0; }
.ksl-date { flex: 0 0 52px; text-align: center; border-radius: 12px; background: var(--km-primary-soft); color: var(--ksc-pri); font-size: 12px; padding: 4px 0; }
.ksl-date b { display: block; font-size: 20px; line-height: 1.1; }

/* ---------------------------------------------------------------- admin pages (setup.php) */
.ksc-admin .ksc-chips { margin-top: 2px; }
.ksc-statrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; margin: 0 0 16px; }
.ksc-stat { display: block; padding: 12px 14px; border-radius: 14px; background: var(--km-surface); border: 1px solid var(--km-border); color: var(--km-text) !important; text-decoration: none !important; }
.ksc-stat b { display: block; font-size: 24px; line-height: 1.2; }
.ksc-stat span { font-size: 13px; color: var(--km-muted); }
.ksc-stat .ksc-progress { margin-top: 6px; }
.ksc-stat.is-ok b { color: var(--ksc-ok); } .ksc-stat.is-warn b { color: var(--ksc-warn); } .ksc-stat.is-new b { color: var(--ksc-info); } .ksc-stat.is-muted b { color: var(--km-muted); }
a.ksc-stat:hover { border-color: var(--ksc-pri); }
.ksc-switches { display: grid; gap: 4px; }
.ksc-switch-row { display: flex !important; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 12px; font-weight: 400 !important; cursor: pointer; margin: 0 !important; }
.ksc-switch-row:hover { background: var(--km-surface-2); }
.ksc-switch-row > .fa { color: var(--ksc-pri); font-size: 18px; }
.ksc-switch-row b { display: block; font-weight: 600; }
.ksc-switch-row small { display: block; color: var(--km-muted); }
.ksc-switch { position: relative; display: inline-flex !important; align-items: center; gap: 10px; font-weight: 500; margin: 0 0 12px; cursor: pointer; }
.ksc-switch-row .ksc-switch { margin: 0; }
.ksc-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ksc-switch > span { width: 42px; height: 24px; border-radius: 999px; background: var(--km-border-strong); position: relative; transition: background .2s; flex: 0 0 auto; }
.ksc-switch > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .2s var(--km-ease); box-shadow: 0 1px 3px rgba(0, 0, 0, .25); }
.ksc-switch input:checked + span { background: var(--ksc-pri); }
.ksc-switch input:checked + span::after { transform: translateX(18px); }
.ksc-switch input:focus-visible + span { box-shadow: 0 0 0 3px var(--km-primary-ring); }
.ksc-checks { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.ksc-logo-prev { width: 140px; height: 140px; border-radius: 22px; border: 1px dashed var(--km-border-strong); display: grid; place-items: center; margin: 0 0 12px; background: #fff; overflow: hidden; }
.ksc-logo-prev img { max-width: 90%; max-height: 90%; }
.ksc-logo-prev i { font-size: 40px; color: #cbd5e1; }
.ksc-admin img.ksc-hero-thumb { width: 240px; max-width: 100%; height: auto; border-radius: 10px; vertical-align: middle; }
.ksc-color-row { display: flex; gap: 10px; align-items: center; margin: 0 0 12px; }
.ksc-color-row input[type=color] { width: 64px; height: 44px; padding: 2px; border-radius: 10px; border: 1px solid var(--km-border); background: var(--km-surface); cursor: pointer; }
.ksc-color-row .form-control { max-width: 140px; font-family: Consolas, Menlo, monospace; text-transform: lowercase; }
.ksc-swatches { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; }
.ksc-swatches button { width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--km-surface); box-shadow: 0 0 0 1px var(--km-border-strong); cursor: pointer; padding: 0; }
.ksc-swatches button.is-on { box-shadow: 0 0 0 2px var(--km-text); }
.ksc-palette-prev { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1.4fr; gap: 6px; margin: 0 0 14px; font-size: 12px; }
.ksc-palette-prev span { padding: 14px 6px; border-radius: 10px; text-align: center; color: #fff; background: #888; }
.ksc-palette-prev .is-link, .ksc-palette-prev .is-bg { color: #1f2937; }
.ksc-preview-box > summary { color: var(--ksc-pri); }
.ksc-preview-box .ksl { margin-top: 10px; }

/* wizard */
.ksw-head h1 { font-size: 24px; font-weight: 600; margin: 0 0 4px; }
.ksw-head h1 i { color: var(--ksc-pri); }
.ksw-head p { color: var(--km-muted); margin: 0 0 18px; }
.ksw-steps { display: flex; list-style: none; padding: 0; margin: 0 0 18px; gap: 6px; overflow-x: auto; }
.ksw-steps li { flex: 1 1 0; min-width: 96px; }
.ksw-steps a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; border-radius: 12px; color: var(--km-muted); text-decoration: none; text-align: center; font-size: 13px; }
.ksw-steps a span { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; border: 2px solid var(--km-border-strong); font-weight: 700; background: var(--km-surface); }
.ksw-steps li.is-cur a { color: var(--ksc-pri); font-weight: 600; background: var(--km-primary-soft); }
.ksw-steps li.is-cur a span { border-color: var(--ksc-pri); background: var(--ksc-pri); color: #fff; }
.ksw-steps li.is-done a span { border-color: var(--ksc-ok); background: var(--ksc-ok); color: #fff; }
.ksw-body h2 { font-size: 20px; font-weight: 600; margin: 0 0 4px; }
.ksw-body > form > .ksc-muted { margin-bottom: 16px; }
.ksw-nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--km-border); }
.ksw-choices { display: grid; gap: 10px; margin: 0 0 16px; }
.ksw-choices label { display: flex !important; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 14px; border: 1px solid var(--km-border); cursor: pointer; font-weight: 400 !important; margin: 0 !important; }
.ksw-choices label:has(input:checked) { border-color: var(--ksc-pri); background: var(--km-primary-soft); }
.ksw-choices input { margin-top: 4px; }
.ksw-choices span { display: grid; grid-template-columns: 28px 1fr; gap: 0 8px; }
.ksw-choices span i { grid-row: span 2; font-size: 20px; color: var(--ksc-pri); }
.ksw-choices small { color: var(--km-muted); }
.ksw-done { text-align: center; padding: 20px 0; }
.ksw-done > i { font-size: 56px; color: var(--ksc-ok); }
.ksw-done h2 { font-size: 24px; margin: 10px 0 4px; }
.ksw-next { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin: 14px 0 22px; text-align: left; }
.ksw-next a { display: grid; grid-template-columns: 36px 1fr; gap: 0 10px; padding: 14px; border-radius: 14px; border: 1px solid var(--km-border); color: var(--km-text) !important; text-decoration: none !important; }
.ksw-next a:hover { border-color: var(--ksc-pri); }
.ksw-next i { grid-row: span 2; font-size: 22px; color: var(--ksc-pri); }
.ksw-next small { color: var(--km-muted); }

/* dashboard */
.ksdb-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 0 0 16px; }
.ksdb-head h1 { font-size: 24px; font-weight: 600; margin: 0; }
.ksdb-head p { margin: 2px 0 0; color: var(--km-muted); }
.ksdb-todo { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin: 0 0 16px; }
.ksdb-todo-item { min-width: 0; display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-radius: 14px; border: 1px solid var(--km-border); background: var(--km-surface); color: var(--km-text) !important; text-decoration: none !important; }
.ksdb-todo-item > i { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 18px; flex: 0 0 auto; background: var(--km-surface-2); }
.ksdb-todo-item > span { flex: 1 1 auto; min-width: 0; }
.ksdb-todo-item b { display: block; }
.ksdb-todo-item small { color: var(--km-muted); display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ksdb-todo-item em { font-style: normal; color: var(--ksc-pri); font-weight: 600; white-space: nowrap; }
.ksdb-todo-item.is-pri > i { background: var(--ksc-pri); color: #fff; }
.ksdb-todo-item.is-warn > i { background: var(--ksc-warn-bg); color: var(--ksc-warn); }
.ksdb-todo-item.is-danger { border-color: var(--ksc-bad-bd); }
.ksdb-todo-item.is-danger > i { background: var(--ksc-bad-bg); color: var(--ksc-bad); }
.ksdb-todo-item.is-info > i { background: var(--ksc-info-bg); color: var(--ksc-info); }
.ksdb-todo-item:hover { border-color: var(--ksc-pri); }
.ksdb-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin: 0 0 16px; }
.ksdb-tile { padding: 16px; border-radius: 16px; background: var(--km-surface); border: 1px solid var(--km-border); position: relative; overflow: hidden; }
.ksdb-tile > i { position: absolute; right: 12px; top: 12px; font-size: 22px; color: var(--ksc-pri); opacity: .85; }
.ksdb-tile b { display: block; font-size: 28px; line-height: 1.15; margin-top: 4px; }
.ksdb-tile span { display: block; font-weight: 500; }
.ksdb-tile small { color: var(--km-muted); font-size: 12px; }
.ksdb-chart { display: flex; align-items: flex-end; gap: 3px; height: 170px; padding: 6px 0; border-bottom: 1px solid var(--km-border); }
.ksdb-bar { flex: 1 1 0; background: var(--ksc-pri); border-radius: 4px 4px 0 0; opacity: .85; min-height: 2px; }
.ksdb-bar.is-we { opacity: .5; }
.ksdb-bar:hover { opacity: 1; }
.ksdb-chart-x { display: flex; justify-content: space-between; font-size: 12px; color: var(--km-muted); margin-top: 6px; }
.ksdb-acts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ksdb-acts a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px; border-radius: 12px; background: var(--km-surface-2); color: var(--km-text) !important; text-decoration: none !important; font-size: 13px; text-align: center; }
.ksdb-acts a i { font-size: 20px; color: var(--ksc-pri); }
.ksdb-acts a:hover { background: var(--km-primary-soft); }
.ksdb-list { list-style: none; margin: 0; padding: 0; }
.ksdb-list li { padding: 9px 0; border-top: 1px solid var(--km-border); }
.ksdb-list li:first-child { border-top: 0; padding-top: 0; }
.ksdb-list a { font-weight: 500; }
.ksdb-list small { display: block; color: var(--km-muted); margin-top: 2px; }

/* ---------------------------------------------------------------- phones */
@media (max-width: 991px) {
  .ksc-grid-main, .kita-adm-body, .ksf-item-body { grid-template-columns: 1fr; }
  .ksl-cols, .ksl-cols.n2, .ksl-cols.n3, .ksl-cols.n2:not(:has(> .is-wide)) { grid-template-columns: 1fr; }
  .ksl-news.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ksl-about { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .ksc-grid2, .ksc-row2, .ksc-row3 { grid-template-columns: 1fr; }
  .ksc-hero { padding: 18px; border-radius: 14px; }
  .ksc-hero h1 { font-size: 20px; }
  .ksc-hero-stats div { min-width: 0; flex: 1 1 80px; }
  .kita-body { padding-left: 16px; }
  .ksd-row { flex-wrap: wrap; }
  .ksd-dl span { display: none; }
  .ksd-one header { flex-direction: column; }
  .ksd-preview iframe { height: 60vh; }
  .ksl-hero { min-height: 240px; border-radius: 16px; }
  .ksl-hero-in { padding: 22px 18px 52px; }
  .ksl-logo { width: 76px; height: 76px; border-radius: 18px; }
  .ksl-tiles { margin: -32px 8px 0; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .ksl-tile { padding: 12px 4px; font-size: 12px; }
  .ksl-tile i { width: 38px; height: 38px; font-size: 18px; }
  .ksr-branches::after, .ksr-branch::before { display: none; }
  .ksr-branch { max-width: none; flex-basis: 100%; }
  .ksr-exec-card.is-top { flex-basis: 100%; }
  .ksf-ticket { font-size: 24px; letter-spacing: 2px; padding: 6px 14px; }
  .ksdb-acts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ksc-bigsearch { flex-wrap: wrap; }
  .ksc-bigsearch .ksc-btn { flex: 1 1 100%; justify-content: center; }
  .ksc-qr-pop { left: auto; right: 0; }
  .ksc-alert-in { flex-wrap: wrap; }
  .ksc-alert-txt { flex-basis: calc(100% - 64px); }
}
@media (max-width: 480px) {
  .ksl-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ksl-stats { grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; }
  .ksl-stat { grid-template-columns: 1fr; text-align: center; padding: 12px 6px; }
  .ksl-stat b { font-size: 20px; }
  .ksl-stat i { grid-row: auto; margin: 0 auto 6px; }
  .ksr-dir { grid-template-columns: 1fr; }
  .ksf-bars { gap: 3px; }
  .ksc-palette-prev { grid-template-columns: repeat(3, 1fr); }
  .ksw-steps b { display: none; }
}

/* ---------------------------------------------------------------- print (ITA, documents, org chart) */
@media print {
  .ksc-alert, .ksc-hero-actions, .ksc-toolbar, .ksc-chips, .ksc-tabs, .ksc-qr, .kita-edit, .ksc-pager, .ksr-contacts, .ksc-actions { display: none !important; }
  .ksc-hero { background: none !important; color: #000 !important; box-shadow: none; border: 1px solid #ccc; }
  .ksc-hero h1, .ksc-hero p { color: #000 !important; }
  .ksc-hero-stats div { background: #f3f4f6 !important; }
  .kita-item { break-inside: avoid; }
  .kita-item:not([open]) > .kita-body { display: block; }
  .ksc-card, .kita-item, .ksd-row { box-shadow: none !important; }
}

/* ---------------------------------------------------------------- link colours: the owner colours print
   a / a:link rules (css_data2.php, specificity 0,1,1) that would paint these controls; restate them */
a.ksc-btn:link, a.ksc-btn:visited, a.ksc-btn:hover, .ksc-chips > a.is-active:link, .ksc-chips > a.is-active:visited,
a.ksc-social:link, a.ksc-social:visited, a.ksc-alert-link:link, a.ksc-alert-link:visited, .ksc-pager b { color: #fff; }
a.ksc-btn-ghost:link, a.ksc-btn-ghost:visited, a.ksc-btn-ghost:hover { color: var(--ksc-pri); }
.ksc-hero a.ksc-btn:link, .ksc-hero a.ksc-btn:visited { color: var(--ksc-pri); }
.ksc-hero a.ksc-btn-ghost:link, .ksc-hero a.ksc-btn-ghost:visited { color: #fff; }
.ksc-chips > a:link, .ksc-chips > a:visited, .ksc-pager a:link, .ksc-pager a:visited, a.ksr-unit:link, a.ksr-unit:visited,
a.ksd-title:link, a.ksd-title:visited, .ksdb-list a:link, .ksdb-list a:visited, .ksc-results li > a:link, .ksc-results li > a:visited { color: var(--km-text); }
.ksc-chips > a:hover, a.ksd-title:hover, .ksc-results li > a:hover, .ksdb-list a:hover { color: var(--ksc-pri); }
.ksc-tabs a:link, .ksc-tabs a:visited, a.ksd-cat:link, a.ksd-cat:visited { color: var(--km-muted); }
.ksc-tabs a.is-active:link, .ksc-tabs a.is-active:visited, .ksc-tabs a:hover, a.ksr-count:link, a.ksr-count:visited, a.ksc-more:link { color: var(--ksc-pri); }
@media (max-width: 480px) {
  .ksdb-todo-item { gap: 10px; padding: 10px 12px; }
  .ksdb-todo-item em { display: none; }
}
/* popups / framed pages (html.km-embed, km-ui.js) show no urgent alert bar */
html.km-embed .ksc-alert { display: none !important; }
/* the hidden attribute must win over the display of grid / flex rows (e.g. #kfWho = .ksc-row2 when the complaint is anonymous) */
.ksc-page [hidden], .ksc-admin [hidden], .ksl [hidden] { display: none !important; }
@media (max-width: 480px) { .ksl-news.c2, .ksl-news.c3, .ksl-news.c4 { grid-template-columns: 1fr; } }