/* Mobilens Kunder (docs/mobile/ZIMLA_MOBIL_HANDOVER.md 6.8, prototypen s-kunder). Bara under 1024 px – datorns tavla och
   tabell (zimla-kunder.css) rörs inte; på mobil döljs de bakom prototypens lista. */
.zmk { display: none; }
@media (max-width: 1023px) {
  .ku-page:has(> .zmk) > :not(.zmk):not(dialog) { display: none !important; }
  /* Appens topprad (klockan, kontot) och den korniga bakgrunden som på startsidan (UX-packen 2026-10-30); sidans egen luft bort. */
  #zimla-page-content:has(.zmk), .ku-page:has(> .zmk) { padding: 0 !important; margin: 0 !important; max-width: none !important; }
  .zmk { --zmk-deep: #12382b; --zmk-green: #1f6b4f; --zmk-ink: #1d2420; --zmk-mut: #5d6b61; --zmk-soft: #6b746d; --zmk-line2: #eef0ec; --zmk-serif: Newsreader, Georgia, serif;
    display: block; padding: 0 0 calc(var(--zmk-dock, 76px) + 24px + env(safe-area-inset-bottom, 0px)); color: var(--zmk-ink); font: 400 14px/1.4 Inter, ui-sans-serif, system-ui, sans-serif; }
  .zmk-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding: calc(12px + env(safe-area-inset-top, 0px)) 12px 8px 20px; }
  .zmk-head h1 { margin: 0; font: 500 26px/1.1 var(--zmk-serif); color: var(--zmk-deep); }
  .zmk-head p { margin: 0; font-size: 12px; color: var(--zmk-mut); }
  .zmk-new { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--zmk-green); color: #fff; display: flex; align-items: center; justify-content: center; text-decoration: none; }
  .zmk-new .material-symbols-outlined { font-size: 20px; }
  .zmk-tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 3px; margin: 0 16px 8px; border-radius: 12px; background: rgba(18, 56, 43, 0.08); }
  .zmk-tabs button { height: 36px; border: 0; border-radius: 9px; background: none; font: 600 13.5px/1 Inter, ui-sans-serif, system-ui, sans-serif; color: var(--zmk-mut); display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
  .zmk-tabs button[aria-selected="true"] { background: #fff; color: var(--zmk-deep); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); }
  .zmk-tabs .material-symbols-outlined { font-size: 16px; }
  .zmk-pane { padding: 0 16px; }
  .zmk-search { display: flex; align-items: center; gap: 8px; height: 46px; padding: 0 6px 0 13px; border: 1px solid #e5e2da; border-radius: 14px; background: #fff; color: var(--zmk-soft); box-shadow: 0 8px 20px -18px rgba(18, 56, 43, 0.5); }
  .zmk-search:focus-within { border-color: var(--zmk-green); box-shadow: 0 0 0 3px rgba(31, 107, 79, 0.12); color: var(--zmk-green); }
  .zmk-search .material-symbols-outlined { font-size: 19px; }
  .zmk-search input { flex: 1; min-width: 0; height: 100%; border: 0; outline: 0; background: transparent; font: 16px Inter, ui-sans-serif, system-ui, sans-serif; color: var(--zmk-ink); }
  .zmk-chips { display: flex; gap: 6px; overflow-x: auto; margin: 8px -16px 0; padding: 0 16px 2px; scrollbar-width: none; }
  .zmk-chips::-webkit-scrollbar { display: none; }
  .zmk-chips button { flex: none; height: 34px; padding: 0 13px; border: 1px solid #dfe3de; border-radius: 999px; background: rgba(255, 255, 255, 0.7); font: 500 13px/1 Inter, ui-sans-serif, system-ui, sans-serif; color: #2f4237; }
  .zmk-chips button[aria-pressed="true"] { background: var(--zmk-deep); border-color: var(--zmk-deep); color: #fff; }
  .zmk-k { margin: 18px 2px 10px; font-size: 11px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--zmk-mut); }
  .zmk-card { padding: 2px 6px; border-radius: 18px; background: #fff; border: 1px solid #ebe8e1; }
  .zmk-row { display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 8px 6px 8px 8px; border-top: 1px solid var(--zmk-line2); border-radius: 12px; text-decoration: none; color: inherit; }
  .zmk-row:active { background: #f1f6f2; }
  .zmk-card > .zmk-row:first-child, .zmk-card > .zmk-row.is-first { border-top: 0; }
  .zmk-row[hidden] { display: none; }
  .zmk-av { flex: none; width: 42px; height: 42px; border-radius: 50%; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 13.5px; font-weight: 600; letter-spacing: 0.02em; }
  .zmk-rt { flex: 1; min-width: 0; }
  .zmk-rt b { display: block; font: 500 18px/1.2 var(--zmk-serif); color: var(--zmk-deep); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .zmk-rt small { display: block; margin-top: 2px; font-size: 12.5px; color: var(--zmk-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .zmk-rs { flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
  .zmk-rs b { font-size: 12.5px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .zmk-pill { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 11.5px; font-style: normal; font-weight: 600; white-space: nowrap; }
  .zmk-pill.is-amb { background: #fff1d6; color: #6e4a00; }
  .zmk-pill.is-blue { background: #e2eef8; color: #1e4a6e; }
  .zmk-pill.is-ok { background: #dff2e6; color: #0f5a33; }
  .zmk-pill.is-mute { background: #eef0ec; color: #6b746d; }
  .zmk-chev { flex: none; color: #b0b7b1; font-size: 20px; }
  .zmk-empty { margin: 14px 2px; color: var(--zmk-mut); }
  .zmk-note { margin: 0 2px 10px; font-size: 13px; color: var(--zmk-mut); }
  .zmk-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .zmk-kpi { padding: 12px; border-radius: 16px; background: #fff; border: 1px solid #ebe8e1; min-width: 0; }
  .zmk-kpi small { display: block; font-size: 12px; font-weight: 600; color: var(--zmk-mut); }
  .zmk-kpi b { display: block; margin-top: 2px; font: 400 22px/1.15 var(--zmk-serif); color: var(--zmk-deep); white-space: nowrap; }
  .zmk-kpi span { display: block; margin-top: 2px; font-size: 12px; color: var(--zmk-soft); }
  .zmk-kpi.is-hero { background: var(--zmk-deep); border-color: var(--zmk-deep); }
  .zmk-kpi.is-hero :is(small, b, span) { color: #fff; }
  .zmk-kpi.is-hero span { color: #b9d3c6; }
  .zmk-panel { margin-top: 12px; padding: 12px 14px; border-radius: 16px; background: #fff; border: 1px solid #ebe8e1; }
  .zmk-panel > header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 4px; }
  .zmk-panel > header b { font-size: 11.5px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--zmk-mut); }
  .zmk-panel > header small { font-size: 12px; color: var(--zmk-soft); }
  .zmk-panel > header button { min-height: 32px; border: 0; background: none; font: 500 13px Inter, sans-serif; color: var(--zmk-green); }
  .zmk-bar, .zmk-stack { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 2px 10px; padding: 8px 0; text-decoration: none; color: inherit; }
  .zmk-bar-t b { display: block; font-size: 14px; font-weight: 600; }
  .zmk-bar-t small { display: block; font-size: 12px; color: var(--zmk-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .zmk-bar-v { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
  .zmk-bar > i { grid-column: 1 / -1; display: block; height: 8px; border-radius: 4px; background: linear-gradient(to right, var(--zmk-green) var(--w), #eef0ec var(--w)); }
  .zmk-legend { display: flex; flex-wrap: wrap; gap: 12px; margin: 0 0 4px; font-size: 12.5px; color: var(--zmk-mut); }
  .zmk-legend i { display: inline-block; width: 10px; height: 10px; margin-right: 5px; border-radius: 3px; vertical-align: -1px; }
  .zmk-segs { grid-column: 1 / -1; display: flex; height: 12px; border-radius: 4px; overflow: hidden; background: #eef0ec; }
  .zmk-segs i, .zmk-legend i { flex: none; }
  .zmk :is(.zmk-segs, .zmk-legend) .is-done { background: #2a78d6; }
  .zmk :is(.zmk-segs, .zmk-legend) .is-order { background: #eb6834; }
  .zmk :is(.zmk-segs, .zmk-legend) .is-sent { background: #1baf7a; }
  .zmk-table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
  .zmk-table th, .zmk-table td { padding: 8px 4px; border-top: 1px solid var(--zmk-line2); text-align: right; }
  .zmk-table th[scope="row"], .zmk-table thead th:first-child { text-align: left; font-weight: 500; }
  .zmk-table thead th { font-size: 11.5px; color: var(--zmk-mut); font-weight: 600; border-top: 0; }
  [data-zmk-value].is-table .zmk-stacks, [data-zmk-value].is-table .zmk-legend { display: none; }
  /* Markera och ta bort (håll in på en kund): kryssrutan ersätter avatar och pil, rubriken räknar, raden ovanför menyn. */
  .zmk-row { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
  .zmk-tick { display: none; flex: none; width: 40px; height: 40px; border-radius: 50%; border: 2px solid #c9d3cc; background: #fff; align-items: center; justify-content: center; color: #fff; }
  .zmk-tick .material-symbols-outlined { font-size: 22px; opacity: 0; }
  .zmk.is-selecting .zmk-av, .zmk.is-selecting .zmk-chev { display: none; }
  .zmk.is-selecting .zmk-tick { display: inline-flex; }
  .zmk.is-selecting .zmk-row[aria-checked="true"] { background: #eef5f0; }
  .zmk.is-selecting .zmk-row[aria-checked="true"] .zmk-tick { border-color: #1f6b4f; background: #1f6b4f; }
  .zmk.is-selecting .zmk-row[aria-checked="true"] .zmk-tick .material-symbols-outlined { opacity: 1; }
  .zmk.is-selecting .zmk-head > div:first-child, .zmk.is-selecting .zmk-new { display: none; }
  .zmk-selhead { display: flex; flex: 1; align-items: center; justify-content: space-between; gap: 12px; }
  .zmk-selhead[hidden] { display: none; }
  .zmk-selhead b { font: 600 17px/1.2 Inter, ui-sans-serif, system-ui, sans-serif; color: var(--zmk-deep); }
  .zmk-selx { min-height: 44px; padding: 0 16px; border: 1px solid #d5e2d9; border-radius: 999px; background: #fff; color: var(--zmk-deep); font: 500 14px/1 Inter, ui-sans-serif, system-ui, sans-serif; }
  .zmk.is-selecting { padding-bottom: calc(var(--zmk-dock, 76px) + 110px + env(safe-area-inset-bottom, 0px)); }  /* dockan + markeringsraden ovanför den */
  .zmk-delbar { position: fixed; z-index: 45; left: 12px; right: 12px; bottom: calc(var(--zmk-dock, 76px) + 36px + env(safe-area-inset-bottom, 0px)); }  /* ovanför Zimla-knappen som sticker upp ur menyn */
  .zmk-delbar[hidden] { display: none; }
  .zmk-delbtn { width: 100%; min-height: 48px; border: 0; border-radius: 14px; background: #b3261e; color: #fff; font: 600 15px/1 Inter, ui-sans-serif, system-ui, sans-serif; box-shadow: 0 12px 24px -16px rgba(80, 20, 15, .6); }
  .zmk-delbtn:disabled { background: #d9b3ae; }
  .zm-sheet.zmk-sheet--danger .zm-btn--primary { background: #b3261e; }
  .zmk-delsum { margin: 0; font-size: 14px; line-height: 1.45; color: var(--zmk-ink); }
  .zmk-delsum ul { margin: 8px 0 0; padding-left: 18px; color: var(--zmk-mut); }
}