/* AT-177 (2026-10-31): redigeringsläge och borttagning enligt L-204 – en fil för dator och mobil. */
/* AT-177 (m, Patrik 10-31, L-204): samma redigeringsläge i ALLA upplåsbara rutor, dator och mobil.
   Markören är det upplåsta låset självt (AT-169: titeln/aria-label "Avbryt och lås …"), inte rutans egen klass. */
:root body #view-admin :is(section, .glass-panel):has(> :is(.admin-config-section-heading, .catalog-active-vehicles-heading, .category-builder-edit-heading) [aria-label^="Avbryt och lås"]),
:root body #view-admin #chat-office-hours-section[data-unlocked="true"],
:root body #view-admin #chat-office-hours-section[data-unlocked="true"] + div,
:root body #view-admin .admin-kb-section-card.unlocked {
  border-color: color-mix(in srgb, var(--status-warning, #f59e0b) 75%, transparent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-warning, #f59e0b) 18%, transparent) !important;
  background: color-mix(in srgb, var(--status-warning, #f59e0b) 20%, transparent) !important;
  transition: box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}
:root body #view-admin :is(.admin-config-section-heading, .catalog-active-vehicles-heading, .category-builder-edit-heading):has([aria-label^="Avbryt och lås"]) h4::after,
:root body #view-admin .admin-kb-section-card.unlocked .admin-kb-section-head-actions::before {
  content: "Redigeras"; margin-left: 8px; padding: 1px 8px; border-radius: 999px; white-space: nowrap;
  font-size: 10px; font-weight: 600; letter-spacing: .2px; text-transform: none; vertical-align: 1px;
  color: var(--edit-badge-fg, color-mix(in srgb, #e8590c 78%, var(--text-primary, #1d1d1f)));
  background: var(--edit-badge-bg, color-mix(in srgb, #f76707 16%, transparent));
}
:root body #view-admin .admin-kb-section-card.unlocked .admin-kb-section-head-actions::before { margin: 0 4px 0 0; align-self: center; }
/* Upplåst lås i varningston (inte grönt = sparat). Mobil: fylld knapp (tryckyta). Dator: bara ikonen orange (Patrik 10-31 23:51, "mobilkänsla"). */
@media (max-width: 768px) {
  :root body #view-admin #admin-detail-content :is(.admin-config-lock-icon-btn, .admin-lock-btn)[aria-label^="Avbryt och lås"] { background: var(--status-warning, #ff9f0a) !important; color: var(--text-on-accent, #fff) !important; }
}
@media (min-width: 769px) {
  :root body #view-admin #admin-detail-content :is(.admin-config-lock-icon-btn, .admin-lock-btn)[aria-label^="Avbryt och lås"] { background: transparent !important; box-shadow: none !important; color: color-mix(in srgb, var(--status-warning, #f59e0b) 85%, var(--text-primary, #1d1d1f)) !important; }
  :root body #view-admin #admin-detail-content :is(.admin-config-lock-icon-btn, .admin-lock-btn)[aria-label^="Avbryt och lås"]:hover { background: color-mix(in srgb, var(--status-warning, #f59e0b) 14%, transparent) !important; }
}
/* Öppettiderna saknar egen ruta (platt i AI-motor-vyn): dagblocket får en egen ram när det är upplåst. */
:root body #view-admin #chat-office-hours-section[data-unlocked="true"] + div { border: 1px solid transparent; border-radius: 12px; padding: 6px 10px; margin-top: 8px; }
/* Öppna formulär är redigeringsläge: Kundinformation-redigeraren och snabbfrågeformuläret. */
:root body #view-admin #ctpl-editor:not([style*="display:none"]):not([style*="display: none"]),
:root body #view-admin #domain-fact-form:not([hidden]) {
  border-color: color-mix(in srgb, var(--status-warning, #f59e0b) 75%, transparent) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-warning, #f59e0b) 18%, transparent) !important;
  background: color-mix(in srgb, var(--status-warning, #f59e0b) 20%, transparent) !important;
}
:root body #view-admin #domain-fact-form:not([hidden]) { border: 1px solid; border-radius: 12px; padding: 12px; }
/* AT-219 tillägg p.6: posten i listan som redigeras (admin-edit-tone.js) har samma ton som redigeringsytan, i stället för accentens grönt. */
:root body #view-admin #ctpl-list .ctpl-item.ctpl-item.is-being-edited,
:root body #view-admin tr.is-being-edited > td {
  border-color: color-mix(in srgb, var(--status-warning, #f59e0b) 75%, transparent) !important;
  background: color-mix(in srgb, var(--status-warning, #f59e0b) 20%, transparent) !important;
}
:root body #view-admin #ctpl-list .ctpl-item.ctpl-item.is-being-edited { box-shadow: 0 0 0 3px color-mix(in srgb, var(--status-warning, #f59e0b) 18%, transparent) !important; }
:root body #view-admin #domain-fact-form:not([hidden])::before {
  content: "Redigeras"; grid-column: 1 / -1; justify-self: start; padding: 1px 8px; border-radius: 999px;
  font-size: 10px; font-weight: 600; letter-spacing: .2px;
  color: var(--edit-badge-fg, color-mix(in srgb, #e8590c 78%, var(--text-primary, #1d1d1f)));
  background: var(--edit-badge-bg, color-mix(in srgb, #f76707 16%, transparent));
}
/* AT-177 (p, L-204): borttagning i en ruta finns först när rutan är upplåst. */
:root body #view-admin .admin-kb-section-card:not(.unlocked) [data-qq-delete] { display: none !important; }
/* AT-177 (q, Patrik 10-31): ett och samma läsläge-märke, direkt efter vyns rubrik, i alla teman. */
:root body #view-admin .admin-readonly-badge {
  display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto;
  height: 22px; padding: 0 9px; border-radius: 999px; border: 0;
  font-size: 11px; font-weight: 600; line-height: 1; letter-spacing: 0; text-transform: none; white-space: nowrap;
  color: var(--text-secondary, var(--on-surface-muted));
  background: color-mix(in srgb, var(--text-primary, currentColor) 8%, transparent);
  vertical-align: middle; cursor: default;
}
:root body #view-admin .admin-readonly-badge svg { width: 13px; height: 13px; flex: 0 0 auto; }
:root body #view-admin .admin-readonly-title-row { display: flex; align-items: center; gap: 8px; min-width: 0; }
:root body #view-admin .admin-readonly-title-row > h3 { margin: 0; }
/* AT-177 (Patrik 11-01): en ej publicerad kunskapsmall märks med samma orange bricka som "Inte ifyllt"; texten själv är vanlig. */
html body #view-admin .admin-kb-section-head-actions .kb-unpublished-template-badge.kb-unpublished-template-badge {
  color: color-mix(in srgb, var(--status-warning, #ff9f0a) 80%, var(--text-primary)) !important;
  background: color-mix(in srgb, var(--status-warning, #ff9f0a) 12%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--status-warning, #ff9f0a) 32%, transparent) !important;
}
/* AT-177 (p, L-204): sektionens papperskorg finns först när sektionen är upplåst. */
:root body #view-admin .admin-kb-section-card:not(.unlocked) [id^="kb-delete-"] { display: none !important; }
/* AT-177 (Patrik 11-01): en ej publicerad mall bär redigeringslägets orange, svagare än "Redigeras", i stället för den röda fara-tonen
   (admin-gaps-bulk-reader.css:390, som avstängda fordonstyper behåller). */
html body #view-admin .admin-kb-section-card[data-kb-placeholder="true"]:not([data-kb-template-edited="true"]):not(.unlocked):not(.is-vehicle-inactive) {
  background: color-mix(in srgb, var(--status-warning, #f59e0b) 8%, transparent) !important;
  border-color: color-mix(in srgb, var(--status-warning, #f59e0b) 40%, var(--border-color)) !important;
}
/* AT-177 g/m (Patrik 11-01, mobil): kategorins rader har egen ogenomskinlig grön botten och dolde redigeringslägets orange.
   Upplåst får raderna och ikonväljaren en varm ton i samma familj, så hela rutan läses som redigeras. */
:root body #view-admin .category-builder-main:has(> .category-builder-edit-heading [aria-label^="Avbryt och lås"]) :is(.category-builder-field.category-builder-field, .category-builder-icon-picker) {
  background: color-mix(in srgb, var(--status-warning, #f59e0b) 12%, var(--bg-dark-primary)) !important;
}
/* AT-177 (Patrik 11-01): kontors- och personalkortet visar alltid ärenderäknaren, "–" utan ärenden. Tonad, temats färger. */
html body #view-admin .office-card-badge.office-card-badge.is-empty,
html body #view-admin .admin-card-badge.admin-card-badge.is-empty {
  background: color-mix(in srgb, var(--text-secondary) 10%, transparent);
  color: var(--text-secondary);
  font-weight: 500;
}
/* AT-177 ring-hover (Patrik 11-01): ringens egen hovringstext ska synas i temarutan, inte kortets. Klick bubblar till kortet, därför hand (pekarregeln: klickbart = hand). */
html body #view-admin .admin-mini-card > .admin-card-badge,
html body #view-admin .admin-mini-card > .office-card-badge {
  pointer-events: auto;
  cursor: pointer;
}

/* AT-177 (Patrik 11-01): rullista med två val som två segment (admin-core.js, data-atlas-segment). Samma uttryck som
   prisradens Prisrad/Informationsrad: mjuk tematon, valt = ljus platta med accenttext. Låst: valt syns, det andra tonat. */
html body :is(select, button).atlas-segment-source.atlas-segment-source:not(#_a):not(#_b):not(#_c) { display: none !important; } /* ID-vikt: mobilens fältregler visade annars rullistan ovanför segmentet */
html body :is(select.atlas-segment-source + .atlas-filter-dd, .atlas-segment + .atlas-filter-dd):not(#_a):not(#_b):not(#_c) { display: none !important; } /* appens rullistersättare (mobil) */
html body .atlas-segment:not(#_a):not(#_b) { display: flex !important; gap: 4px !important; padding: 3px !important; border-radius: 10px !important; box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; background: color-mix(in srgb, var(--text-secondary) 9%, transparent) !important; }
html body .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn { flex: 1 1 0 !important; min-width: 0 !important; min-height: 28px !important; height: auto !important; margin: 0 !important; padding: 4px 12px !important; border: none !important; border-radius: 8px !important; box-shadow: none !important; background: transparent !important; color: var(--text-secondary) !important; font: inherit !important; font-size: 13px !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; cursor: pointer !important; transition: background .15s, color .15s !important; }
html body .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn:hover:not(:disabled):not([aria-checked="true"]) { color: var(--text-primary) !important; background: color-mix(in srgb, var(--accent-primary) 8%, transparent) !important; }
html body .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn[aria-checked="true"] { background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-primary)) !important; font-weight: 600 !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; cursor: default !important; }
/* Pekaren (Patrik 11-01): valt = vanlig pil (redan valt), icke valt = hand upplåst och förbudstecken bara i låst läge. */
html body .atlas-segment.is-locked:not(#_a):not(#_b) > .atlas-segment-btn:not([aria-checked="true"]) { cursor: not-allowed !important; }
html body .atlas-segment.is-locked:not(#_a):not(#_b) > .atlas-segment-btn:not([aria-checked="true"]) { opacity: .8 !important; }
@media (max-width: 768px) { html body .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn { min-height: 38px !important; font-size: 14px !important; } }
/* Inne i en rad bredvid talfältet (Uppläggslängd i katalogen, prisradens veckor/dagar): segmentet tar bara sin egen bredd. */
html body :is(.office-duration-control, #catalog-program-duration-field, .fact-source) .atlas-segment:not(#_a):not(#_b) { width: auto !important; justify-self: start !important; flex: 0 0 auto !important; padding: 2px !important; }
html body :is(.office-duration-control, #catalog-program-duration-field, .fact-source) .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn { flex: 0 0 auto !important; min-height: 24px !important; padding: 2px 9px !important; font-size: 12px !important; }
/* Samma/Varierar: kompakt segment framför sin förklaringstext. */
html body .catalog-duration-variance-toggle > .atlas-segment--variance:not(#_a):not(#_b) { width: auto !important; flex: 0 0 auto !important; padding: 2px !important; }
html body .catalog-duration-variance-toggle > .atlas-segment--variance:not(#_a):not(#_b) > .atlas-segment-btn { flex: 0 0 auto !important; min-height: 24px !important; padding: 2px 10px !important; font-size: 12px !important; }
/* AT-177 (Patrik 11-01 14:26): Ja/Nej (och "Inte ifyllt" i redigering) får samma segmentuttryck. Radioknapparna och logiken orörda. */
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) { display: inline-flex !important; flex-wrap: wrap !important; gap: 4px !important; width: auto !important; max-width: 100% !important; padding: 3px !important; border: none !important; border-radius: 10px !important; box-shadow: none !important; backdrop-filter: none !important; background: color-mix(in srgb, var(--text-secondary) 9%, transparent) !important; }
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group { min-height: 28px !important; margin: 0 !important; padding: 4px 16px !important; border: none !important; border-radius: 8px !important; box-shadow: none !important; background: transparent !important; color: var(--text-secondary) !important; font-size: 13px !important; font-weight: 500 !important; cursor: pointer !important; }
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group.is-selected { background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-primary)) !important; font-weight: 600 !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; cursor: default !important; opacity: 1 !important; }
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group:not(.is-selected):hover:not(:has(input:disabled)) { color: var(--text-primary) !important; background: color-mix(in srgb, var(--accent-primary) 8%, transparent) !important; }
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group:not(.is-selected):has(input:disabled) { opacity: .5 !important; cursor: not-allowed !important; }
html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group :is(input, .cf-pill-input) { cursor: inherit !important; }
@media (max-width: 768px) { html body :is(.office-duration-control, #catalog-program-duration-field, .fact-source, .catalog-duration-variance-toggle) .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn { min-height: 34px !important; padding: 4px 12px !important; font-size: 13px !important; } }
@media (max-width: 768px) { html body .cf-yesno.cf-yesno:not(#_a):not(#_b):not(#_c) > .cf-group { min-height: 34px !important; } }
@media (max-width: 768px) { html body .atlas-segment:not(#_a):not(#_b) > .atlas-segment-btn { flex: 1 1 0 !important; min-width: max-content !important; text-overflow: clip !important; } } /* mobil: ett kort namn klipps aldrig (Admin blev Ad…) */
/* PÅ/AV som segment "Av | På" (tråd 7): kompakt, lika breda knappar. */
html body .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) { width: auto !important; flex: 0 0 auto !important; padding: 2px !important; }
html body .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) > .atlas-segment-btn { flex: 1 1 0 !important; min-width: 44px !important; min-height: 26px !important; padding: 2px 12px !important; font-size: 12px !important; }
@media (max-width: 768px) { html body .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) > .atlas-segment-btn { min-height: 34px !important; font-size: 13px !important; } }
/* Patrik 11-01: valt Av är rött (temats --danger-text), så att av och på skiljs åt direkt. */
html body .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) > .atlas-segment-btn[data-value="off"][aria-checked="true"] { background: color-mix(in srgb, var(--danger-text) 24%, var(--bg-frosty-content, var(--bg-dark-secondary))) !important; color: color-mix(in srgb, var(--danger-text) 85%, var(--text-primary)) !important; box-shadow: none !important; }
/* Kom igång (Patrik 11-01): valt På är grönt med vyns egen klar-grön (--atlas-onboarding-ready, ljus/mörk variant i onboarding-status.css). Kanten tonad som övriga segment ("mörk kant", 11-01). */
html body #view-onboarding .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) > .atlas-segment-btn[data-value="on"][aria-checked="true"] { background: color-mix(in srgb, var(--atlas-onboarding-ready) 18%, transparent) !important; color: color-mix(in srgb, var(--atlas-onboarding-ready) 85%, var(--text-primary)) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--atlas-onboarding-ready) 20%, transparent) !important; }
/* Patrik 11-01 ("ser grå ut"): låst kontroll får saturate(.62) (admin-overrides.css:633), även på segmentets omslag och valda knapp, så valt Av blev grått. Valt läge visas i full färg; ovalt dämpas fortfarande. Röd blandas täckande mot temats bakgrund, annars blir den brun över grönt. */
html body #view-admin .admin-toggle-hover-wrap:has(> .atlas-segment):not(#_a):not(#_b), html body #view-admin .atlas-segment > .atlas-segment-btn[aria-checked="true"]:not(#_a):not(#_b) { filter: none !important; }
/* Patrik 11-01 ("kan footern på ärendekortet följa ärendekortets färg?"): foten var ett eget band per tema (style-modals.css .ticket-footer-bar 25 % svart, temafilerna t.ex. apple-light-green 5 %). Nu genomskinlig med svag skiljelinje, så den följer kortets färg även vald/hovrad. Gäller alla ärendekort (Inkorg, Mina ärenden, Garaget, Kunder). */
html body :is(.team-ticket-card, .archive-card) .ticket-footer-bar:not(#_a):not(#_b) { background: color-mix(in srgb, var(--agent-color, var(--accent-primary)) 12%, transparent) !important; border-top: 1px solid color-mix(in srgb, var(--agent-color, var(--accent-primary)) 28%, transparent) !important; }
/* Patrik 11-01: Policyns ämnesflikar och Nytt meddelandes Extern/Intern ser ut som segmenten (halvrunda, vald = Samma-färgen). Ja/Nej (.cf-yesno) berörs inte: bara .cf-groups > .cf-group. */
html body .cf-surface .cf-groups > .cf-group.agent-view-pill:not(#_a):not(#_b) { border-radius: 8px !important; border: none !important; background: transparent !important; color: var(--text-secondary) !important; box-shadow: none !important; }
html body .cf-surface .cf-groups > .cf-group.agent-view-pill:not(#_a):not(#_b):hover:not(.is-selected) { color: var(--text-primary) !important; background: color-mix(in srgb, var(--accent-primary) 8%, transparent) !important; }
html body .cf-surface .cf-groups > .cf-group.agent-view-pill.is-selected:not(#_a):not(#_b) { background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-primary)) !important; font-weight: 600 !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; }
html body .cf-surface .cf-groups.cf-groups:not(#_a):not(#_b) { gap: 4px !important; padding: 3px !important; border-radius: 10px !important; background: color-mix(in srgb, var(--text-secondary) 9%, transparent) !important; }
html body #composer-mode-toggle:not(#_a):not(#_b) { background: color-mix(in srgb, var(--text-secondary) 9%, transparent) !important; border: none !important; gap: 4px !important; }
html body #composer-mode-toggle > .toggle-mode-btn:not(#_a):not(#_b) { background: transparent !important; color: var(--text-secondary) !important; border: none !important; box-shadow: none !important; }
html body #composer-mode-toggle > .toggle-mode-btn:not(#_a):not(#_b):hover:not(.active) { color: var(--text-primary) !important; background: color-mix(in srgb, var(--accent-primary) 8%, transparent) !important; }
html body #composer-mode-toggle > .toggle-mode-btn.active:not(#_a):not(#_b) { background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-primary)) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; }
/* Chattens öppettider: dagens Stängt | Öppet (admin-config.js _chatHoursDayRow) får plats för hela orden. */
html body [id^="chat-hours-row-"] .atlas-segment.atlas-segment--toggle:not(#_a):not(#_b) > .atlas-segment-btn { flex: 0 0 auto !important; min-width: max-content !important; text-overflow: clip !important; padding: 2px 10px !important; }
/* AT-177 tråd 9 (Patrik 11-01 "inte så vitt"): plattformskorten i Webbplats-widget följer temats ton, inte fältfärgen. */
body.atlas-light-theme #view-admin .widget-platform-steps > div:not(#_a) { background: color-mix(in srgb, var(--text-primary) 5%, transparent) !important; border-color: color-mix(in srgb, var(--text-primary) 10%, transparent) !important; }
/* AT-177 tråd 9 (Patrik 11-01 "samma footer som i Kunder"): ärendekorten i Admin Personal/Kontor får Kunders kortyta och fot i ärendets färg (--atp-color). */
html body .admin-ticket-preview:not(#_a):not(#_b) { background: var(--bg-frosty-content) !important; border-top: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent) !important; border-right: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent) !important; border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent) !important; border-radius: 12px !important; overflow: hidden !important; padding-bottom: 0 !important; }
html body .admin-ticket-preview:not(#_a):not(#_b) .atp-footer-row { margin: 6px -12px 0 !important; padding: 5px 12px !important; background: color-mix(in srgb, var(--atp-color, var(--accent-primary)) 12%, transparent) !important; border-top: 1px solid color-mix(in srgb, var(--atp-color, var(--accent-primary)) 28%, transparent) !important; }
/* AT-177 tråd 9 (mätt 390): en prisrad med extra kontroller (veckor/dagar, lektionsantal) tryckte tjänstenamnet till 0 px och klippte i-knappen. Raden bryter: namnet överst, kontrollerna under. */
@media (max-width: 768px) {
  :root body #view-admin #box-prices .price-row:has(.office-duration-control, .office-package-quantity-control) > div:first-child:not(#_a) { flex-wrap: wrap !important; row-gap: 8px !important; }
  :root body #view-admin #box-prices .price-row:has(.office-duration-control, .office-package-quantity-control) span[data-service-name]:not(#_a) { flex: 1 1 100% !important; }
  :root body #view-admin #box-prices .price-row:has(.office-duration-control, .office-package-quantity-control) .office-price-actions:not(#_a) { margin-left: auto !important; max-width: 100% !important; }
}
/* AT-177 tråd 9 (Patrik 11-01 "tungt och kontrastlöst"): låsta fält och rader i ljusa teman = temats ljusa yta, mellanting mellan vitt och kortets ton (office-prices-desktop.css gav 5 % mörk ton). */
html body.atlas-light-theme #view-admin #admin-detail-content :is(input:disabled, input[readonly], select:disabled, textarea:disabled, textarea[readonly]):not([type="color"]):not([type="checkbox"]):not([type="radio"]):not(#_a) { background: color-mix(in srgb, var(--bg-frosty-content) 70%, transparent) !important; border-color: color-mix(in srgb, var(--text-secondary) 26%, transparent) !important; opacity: 1 !important; }
body.atlas-light-theme #view-admin .qqr-row:not(#_a) { background: color-mix(in srgb, var(--bg-frosty-content) 45%, transparent) !important; }
/* AT-177 tråd 9 (Patrik 11-01): sökordspillren ser aktiva ut (grön ton som valt segment) i stället för grå och avstängda. */
html body #view-admin .kw-pill:not(#_a) { background: var(--pill-state-active-bg, color-mix(in srgb, var(--accent-primary) 14%, transparent)) !important; border-color: color-mix(in srgb, var(--accent-primary) 26%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 62%, var(--text-primary)) !important; opacity: 1 !important; }
/* AT-177 tråd 9 (Patrik 11-01, live i förhandsfliken): icke-klickbara piller blå (temats info-färg), öppen kategori i kampanjrutans ljusa stil, fordonskortet lika brett som kategorierna, kampanjrutan som stjärnfall (tonad kant runt ruta+kort, gnistikon som skapa-knapp med svans, glimrande rubrikikon, valt kampanjkort grönt), Tjänstekatalog som avdelare, kontorspillren i Tjänstekedjan i Språk-pillrens form. */
html body{--atlas-info-pill:color-mix(in srgb,var(--info-text,#3b82f6) 72%,var(--text-primary))}
html body #view-admin .category-builder-group.is-open:not(#_a){background:linear-gradient(color-mix(in srgb,var(--accent-primary) 9%,transparent),color-mix(in srgb,var(--bg-frosty-content) 30%,transparent))!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent-primary) 26%,transparent)!important}
html body #view-admin .category-builder-group.is-open > .category-builder-card:not(#_a):not(.active){background:transparent!important;box-shadow:none!important;border-color:transparent!important}
html body #view-admin :is(.kw-pill,.svc-type-pill,.category-builder-badge):not(#_a):not(#_b){background:color-mix(in srgb,var(--atlas-info-pill) 11%,transparent)!important;border-color:color-mix(in srgb,var(--atlas-info-pill) 26%,transparent)!important;color:var(--atlas-info-pill)!important}
html body #view-admin .catalog-feature-group:not(#_a){padding-left:0!important;padding-right:0!important}
html body #view-admin .catalog-campaign-section:not(#_a):not(#_b){padding:10px 0 0!important;flex:none!important;gap:6px!important;border:0!important;box-shadow:none!important;border-radius:14px!important;background:radial-gradient(2.2px 2.2px at 78% 24%,color-mix(in srgb,var(--accent-primary) 70%,transparent),transparent 70%),radial-gradient(1.5px 1.5px at 62% 50%,color-mix(in srgb,var(--accent-primary) 55%,transparent),transparent 70%),radial-gradient(1.8px 1.8px at 88% 62%,color-mix(in srgb,var(--accent-primary) 60%,transparent),transparent 70%),radial-gradient(1.3px 1.3px at 50% 16%,color-mix(in srgb,var(--accent-primary) 50%,transparent),transparent 70%),linear-gradient(180deg,color-mix(in srgb,var(--accent-primary) 13%,transparent),color-mix(in srgb,var(--accent-primary) 4%,transparent) 55%,transparent)!important}
html body #view-admin .catalog-campaign-section > .catalog-campaign-heading:not(#_a){padding:0 12px 2px!important;margin:0!important;width:auto!important}
html body #view-admin .catalog-campaign-section > .campaign-summary-card:not(#_a):not(#_b){margin:0!important;width:100%!important;box-sizing:border-box!important}
html body #view-admin .catalog-campaign-heading .campaign-heading-icon svg{animation:t9Glimmer 3.2s ease-in-out infinite}
@keyframes t9Glimmer{0%,100%{opacity:.75;transform:scale(1) rotate(0);filter:drop-shadow(0 0 0 transparent)}45%{opacity:1;transform:scale(1.12) rotate(-6deg);filter:drop-shadow(0 0 4px color-mix(in srgb,var(--accent-primary) 70%,transparent))}60%{opacity:.9;transform:scale(1.04) rotate(0)}}
@media (prefers-reduced-motion: reduce){html body #view-admin .catalog-campaign-heading .campaign-heading-icon svg{animation:none}}
html body #view-admin .catalog-campaign-section:not(#_a){position:relative!important}
html body #view-admin .catalog-campaign-heading .campaign-create-btn:not(#_a):not(#_b){position:relative;z-index:1;background:transparent!important;border:0!important;box-shadow:none!important}
html body #view-admin .catalog-campaign-heading .campaign-create-btn > svg{display:none!important}
html body #view-admin .catalog-campaign-heading .campaign-create-btn::before{content:"";width:19px;height:19px;background:var(--accent-primary);-webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M11.017%202.814a1%201%200%200%201%201.966%200l1.051%205.558a2%202%200%200%200%201.594%201.594l5.558%201.051a1%201%200%200%201%200%201.966l-5.558%201.051a2%202%200%200%200-1.594%201.594l-1.051%205.558a1%201%200%200%201-1.966%200l-1.051-5.558a2%202%200%200%200-1.594-1.594l-5.558-1.051a1%201%200%200%201%200-1.966l5.558-1.051a2%202%200%200%200%201.594-1.594z%27%2F%3E%3Cpath%20d%3D%27M20%202v4%27%2F%3E%3Cpath%20d%3D%27M22%204h-4%27%2F%3E%3Ccircle%20cx%3D%274%27%20cy%3D%2720%27%20r%3D%272%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M11.017%202.814a1%201%200%200%201%201.966%200l1.051%205.558a2%202%200%200%200%201.594%201.594l5.558%201.051a1%201%200%200%201%200%201.966l-5.558%201.051a2%202%200%200%200-1.594%201.594l-1.051%205.558a1%201%200%200%201-1.966%200l-1.051-5.558a2%202%200%200%200-1.594-1.594l-5.558-1.051a1%201%200%200%201%200-1.966l5.558-1.051a2%202%200%200%200%201.594-1.594z%27%2F%3E%3Cpath%20d%3D%27M20%202v4%27%2F%3E%3Cpath%20d%3D%27M22%204h-4%27%2F%3E%3Ccircle%20cx%3D%274%27%20cy%3D%2720%27%20r%3D%272%27%2F%3E%3C%2Fsvg%3E") center/contain no-repeat;filter:drop-shadow(0 0 3px color-mix(in srgb,var(--accent-primary) 55%,transparent));transition:transform .2s ease,filter .2s ease}
html body #view-admin .catalog-campaign-heading .campaign-create-btn:hover::before,html body #view-admin .catalog-campaign-heading .campaign-create-btn:focus-visible::before{transform:scale(1.15) rotate(12deg);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--accent-primary) 80%,transparent))}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable:not(#_a){margin:6px 0 2px!important;padding:4px 2px!important;display:flex!important;align-items:center!important;gap:8px!important}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable > span:first-child{flex:none}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable::after{content:"";order:1;flex:1;height:1px;background:color-mix(in srgb,var(--accent-primary) 28%,transparent)}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable > .catalog-guide-label-hint{order:2;flex:none}
html body #view-admin .catalog-campaign-section > .campaign-summary-card:not(#_a):not(#_b):not(#_c){border-top-color:transparent!important;border-right-color:transparent!important;border-bottom-color:transparent!important;box-shadow:none!important;border-radius:0 0 14px 14px!important;background:linear-gradient(180deg,color-mix(in srgb,var(--accent-primary) 5%,transparent),color-mix(in srgb,var(--bg-frosty-content) 60%,transparent) 70%)!important;background-image:linear-gradient(180deg,color-mix(in srgb,var(--accent-primary) 5%,transparent),color-mix(in srgb,var(--bg-frosty-content) 60%,transparent) 70%)!important}
html body #view-admin #admin-detail-content .catalog-chain-panel .atlas-unit-pill:not(#_a):not(#_b){background:color-mix(in srgb,var(--accent-primary) 13%,var(--bg-frosty-content))!important;border:1px solid color-mix(in srgb,var(--accent-primary) 16%,transparent)!important;color:color-mix(in srgb,var(--accent-primary) 62%,var(--text-primary))!important;font-weight:600!important;padding:3px 10px!important;font-size:11.5px!important;min-height:0!important;line-height:1.4!important;box-shadow:none!important}
html body #view-admin #admin-detail-content .catalog-chain-panel .atlas-unit-pill:not(#_a):not(#_b):is(:hover,:focus-visible){background:color-mix(in srgb,var(--accent-primary) 22%,var(--bg-frosty-content))!important;border-color:color-mix(in srgb,var(--accent-primary) 36%,transparent)!important}
/* Kampanjen: en gemensam kant runt rutan och kortet som tonar ut uppåt */
html body #view-admin .catalog-campaign-section > .campaign-summary-card:not(#_a):not(#_b):not(#_c):not(#_d){border-right-color:transparent!important;border-bottom-color:transparent!important}
html body #view-admin .catalog-campaign-heading:not(#_a){position:relative!important}
html body #view-admin .catalog-campaign-heading::before,html body #view-admin .catalog-campaign-heading::after{content:"";position:absolute;pointer-events:none;height:1.5px;border-radius:2px;transform-origin:100% 50%;background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent-primary) 55%,transparent))}
html body #view-admin .catalog-campaign-heading::before{top:16px;right:30px;width:118px;transform:rotate(-17deg)}
html body #view-admin .catalog-campaign-heading::after{top:17px;right:31px;width:64px;opacity:.55;transform:rotate(-31deg)}
html body #view-admin .catalog-campaign-section::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:linear-gradient(0deg,color-mix(in srgb,var(--accent-primary) 34%,transparent) 0%,color-mix(in srgb,var(--accent-primary) 24%,transparent) 50%,color-mix(in srgb,var(--accent-primary) 10%,transparent) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
html body #view-admin .catalog-campaign-section > .campaign-summary-card.active:not(#_a):not(#_b):not(#_c):not(#_d){background:linear-gradient(180deg,color-mix(in srgb,var(--accent-primary) 10%,transparent),var(--pill-state-active-bg,color-mix(in srgb,var(--accent-primary) 17%,transparent)) 70%)!important;border-left-color:var(--accent-primary)!important}
/* Tråd 10 (11-01, Patrik godkänt): ett markeringsspråk i Utbud-listan, kampanjrutan, piller i agentens färg (--min-agentfarg; val behåller temats accent), lika breda typpiller, Tjänstekatalog/Utbud som två delar, Tjänstekedjan som stegkedja. */
@media (min-width: 769px){html body #view-admin #admin-main-list .campaign-summary-card.admin-mini-card:not(.active):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e),html body #view-admin #admin-main-list .catalog-feature-card.admin-mini-card:not(.active):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e){border-left-color: color-mix(in srgb,var(--accent-primary) 30%,transparent) !important}html body #view-admin #admin-main-list .category-builder-group:not(.is-inactive)>.category-builder-card.admin-mini-card:not(.active):not(#_a):not(#_b):not(#_c){border-left-color: color-mix(in srgb,var(--status-success,#22c55e) 42%,transparent) !important}html body #view-admin #admin-main-list .category-builder-group:not(.is-inactive) .category-builder-group-list>.admin-mini-card:not(.active):not(#_a):not(#_b):not(#_c){border-left-color: color-mix(in srgb,var(--status-success,#22c55e) 38%,transparent) !important}html body #view-admin #admin-main-list .admin-mini-card.admin-mini-card:not(.active):not([id^="gap-card-"]):not(#_a):not(#_b):not(#_c){background-image: none !important;background-color: color-mix(in srgb,var(--text-primary) 3.5%,transparent) !important;box-shadow: none !important}html body #view-admin #admin-main-list .category-builder-group.is-open>.category-builder-card:not(.active):not(#_a):not(#_b):not(#_c){background-color: transparent !important}html body #view-admin #admin-main-list .admin-mini-card.admin-mini-card.active:not([id^="gap-card-"]):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e){background-image: none !important;background-color: color-mix(in srgb,var(--accent-primary) 17%,var(--bg-dark-secondary,var(--bg-dark-primary))) !important;border-color: color-mix(in srgb,var(--accent-primary) 40%,transparent) !important;border-left-color: var(--accent-primary) !important;box-shadow: 0 0 0 1px color-mix(in srgb,var(--accent-primary) 18%,transparent),0 4px 12px -6px rgba(0,0,0,0.25) !important;transform: none !important}html body #view-admin #admin-main-list .admin-mini-card.active:not(#_a) strong{color: var(--text-primary) !important}html body #view-admin #admin-main-list .catalog-campaign-section>.campaign-summary-card.active:not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){border-top-color: transparent !important;border-right-color: transparent !important;box-shadow: none !important;border-radius: 0 0 14px 14px !important}html body #view-admin #admin-main-list .admin-mini-card.admin-mini-card:not(.active):not([id^="gap-card-"]):hover:not(#_a):not(#_b):not(#_c):not(#_d){background-image: none !important;background-color: color-mix(in srgb,var(--accent-primary) 7%,var(--bg-dark-secondary,var(--bg-dark-primary))) !important;transform: none !important}}
html body #view-admin .catalog-campaign-section>.catalog-campaign-heading{cursor: pointer}
html body #view-admin .catalog-campaign-section>.catalog-campaign-heading:hover .catalog-list-section-label-text{color: var(--accent-primary) !important}
html body #view-admin .campaign-summary-card .campaign-summary-chevron{margin-left: auto;font-size: 20px;line-height: 1;padding: 0 2px 2px;color: color-mix(in srgb,var(--text-secondary) 80%,transparent);transition: transform .15s ease,color .15s ease}
html body #view-admin .campaign-summary-card:hover .campaign-summary-chevron,html body #view-admin .catalog-campaign-section:has(>.catalog-campaign-heading:hover) .campaign-summary-chevron{transform: translateX(2px);color: var(--accent-primary)}
html body #view-admin .campaign-summary-card.active .campaign-summary-chevron{color: var(--accent-primary)}
html body #view-admin{--t10-pill: var(--min-agentfarg,var(--accent-primary))}
html body #view-admin :is(.svc-type-pill,.category-builder-badge,.kw-pill,.ctpl-card-pill,a.atlas-unit-pill,.office-catalog-link-pill,.kb-service-count-badge):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){background: color-mix(in srgb,var(--t10-pill) 12%,var(--bg-frosty-content,var(--bg-dark-secondary))) !important;color: color-mix(in srgb,var(--t10-pill) 72%,var(--text-primary)) !important;border: 1px solid transparent !important;box-shadow: none !important}
html body:not(.atlas-light-theme) #view-admin :is(.svc-type-pill,.category-builder-badge,.kw-pill,.ctpl-card-pill,a.atlas-unit-pill,.office-catalog-link-pill,.kb-service-count-badge):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){background: color-mix(in srgb,var(--t10-pill) 20%,var(--bg-frosty-content,var(--bg-dark-secondary))) !important;color: color-mix(in srgb,var(--t10-pill) 45%,var(--text-primary)) !important}
html body #view-admin :is(a.atlas-unit-pill,.office-catalog-link-pill,.kb-service-count-badge):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){border-color: color-mix(in srgb,var(--t10-pill) 40%,transparent) !important;font-weight: 600 !important}
html body #view-admin :is(a.atlas-unit-pill,.office-catalog-link-pill,.kb-service-count-badge):hover:not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){background: color-mix(in srgb,var(--t10-pill) 24%,var(--bg-frosty-content,var(--bg-dark-secondary))) !important;border-color: color-mix(in srgb,var(--t10-pill) 75%,transparent) !important}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable:not(#_a):not(#_b){margin: 10px 0 0 !important;padding: 8px 12px !important;border: 1px solid color-mix(in srgb,var(--text-primary) 12%,transparent) !important;border-radius: 10px !important;cursor: pointer;background: color-mix(in srgb,var(--text-primary) 2.5%,transparent) !important;justify-content: space-between !important;transition: background .15s ease,border-color .15s ease}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable::after{display: none !important}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable:hover:not(#_a):not(#_b){background: color-mix(in srgb,var(--accent-primary) 8%,transparent) !important;border-color: color-mix(in srgb,var(--accent-primary) 40%,transparent) !important}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable .catalog-guide-label-hint{color: color-mix(in srgb, var(--accent-primary) 60%, var(--text-primary)) !important}
html body #view-admin #admin-main-list .catalog-list-section-label--clickable:hover .catalog-guide-label-arrow{display: inline-block;transform: translateX(2px)}
html body #view-admin #admin-main-list .category-builder-heading:not(#_a):not(#_b){margin-top: 14px !important;padding-top: 12px !important;border-top: 1px solid color-mix(in srgb,var(--text-primary) 9%,transparent) !important}
html body #view-admin #admin-main-list .category-builder-heading-actions>button:not(#_a):not(#_b):not(#_c){width: 28px !important;height: 28px !important;min-height: 28px !important;border-radius: 50% !important;background: color-mix(in srgb,var(--text-primary) 6%,transparent) !important;border: 0 !important;box-shadow: none !important}
html body #view-admin #admin-main-list .category-builder-heading-actions>button:hover:not(#_a):not(#_b):not(#_c){background: color-mix(in srgb,var(--accent-primary) 16%,transparent) !important;color: var(--accent-primary) !important}
html body #view-admin :is(.svc-type-pill,.category-builder-badge,.kw-pill,.ctpl-card-pill):not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f):not(#_g){border-color: color-mix(in srgb,var(--t10-pill) 24%,transparent) !important}
html body #view-admin #admin-main-list .admin-mini-card .svc-type-pill:not(#_a):not(#_b):not(#_c):not(#_d):not(#_e):not(#_f){min-width: 58px !important;box-sizing: border-box !important;display: inline-flex !important;justify-content: center !important;text-align: center !important;padding: 2px 8px !important;flex: none !important}
html body #view-admin .catalog-chain-panel .catalog-chain-list{position: relative}
html body #view-admin .catalog-chain-panel .catalog-chain-row.catalog-chain-row.catalog-chain-row:not(#_a):not(#_b){position: relative;background: color-mix(in srgb,var(--bg-frosty-content,var(--bg-dark-secondary)) 72%,transparent) !important;border: 1px solid color-mix(in srgb,var(--text-primary) 9%,transparent) !important;color: var(--text-primary) !important;font-weight: 500;padding: 9px 12px 9px 12px !important;gap: 12px !important}
html body:not(.atlas-light-theme) #view-admin .catalog-chain-panel .catalog-chain-row.catalog-chain-row.catalog-chain-row:not(#_a):not(#_b){background: color-mix(in srgb,var(--text-primary) 4%,transparent) !important}
html body #view-admin .catalog-chain-panel .catalog-chain-row .catalog-chain-icon:not(#_a){flex: none;width: 22px;height: 22px;border-radius: 50%;display: inline-flex;align-items: center;justify-content: center;font-size: 12px;font-weight: 800;line-height: 1;background: var(--status-success,#22c55e) !important;color: #fff !important;box-shadow: 0 0 0 3px color-mix(in srgb,var(--status-success,#22c55e) 18%,transparent);position: relative;z-index: 1}
html body #view-admin .catalog-chain-panel .catalog-chain-row.is-warning .catalog-chain-icon:not(#_a){background: var(--status-warning,#f59e0b) !important;box-shadow: 0 0 0 3px color-mix(in srgb,var(--status-warning,#f59e0b) 20%,transparent)}
html body #view-admin .catalog-chain-panel .catalog-chain-row.is-muted .catalog-chain-icon:not(#_a){background: color-mix(in srgb,var(--text-secondary) 45%,transparent) !important;box-shadow: none}
html body #view-admin .catalog-chain-panel .catalog-chain-row:has(+ .catalog-chain-row)::after{content: "";position: absolute;left: 23px;top: calc(50% + 11px);height: calc(100% - 4px);width: 2px;border-radius: 2px;pointer-events: none;background: color-mix(in srgb,var(--status-success,#22c55e) 35%,transparent)}
/* Tråd 10 (11-01, Patrik godkänt): kategorins detaljvy - ikonen centrerad under rubriken utan ruta, länkfältet med luft och synlig ruta i mörka teman. */
html body #view-admin .category-builder-detail .category-builder-field:has(>#category-builder-name-icon-value){position: relative}
html body #view-admin .category-builder-detail .category-builder-name-icon-value:not(#_a):not(#_b){justify-content: flex-start !important;gap: 10px !important}
html body #view-admin .category-builder-detail #category-builder-current-icon:not(#_a):not(#_b){position: absolute;left: 42px;top: 38px;display: inline-flex !important;align-items: center;justify-content: flex-start;width: auto;height: auto;margin: 0 !important;padding: 0 !important;background: none !important;border: 0 !important;box-shadow: none !important;color: var(--accent-primary)}
html body #view-admin .category-builder-detail #category-builder-current-icon svg{width: 24px;height: 24px}
html body #view-admin .category-builder-detail #category-builder-url:not(#_a):not(#_b){padding-left: 12px !important;padding-right: 12px !important}
html body:not(.atlas-light-theme) #view-admin .category-builder-detail #category-builder-url:not(#_a):not(#_b){background: color-mix(in srgb,var(--text-primary) 4%,transparent) !important;border: 1px solid color-mix(in srgb,var(--text-primary) 14%,transparent) !important;border-radius: 8px !important}
/* Tråd 10 (11-01, Patrik godkänt): färgväljaren - vald prick med bock och ring, Egen färg som palett-ikon, tydligare reglagenamn. */
:root body #ledare-farg-palett .lfp-ruta.lfp-ruta{position: relative}
:root body #ledare-farg-palett .lfp-ruta.lfp-ruta.vald{box-shadow: 0 0 0 2px var(--bg-frosty-content,var(--bg-dark-secondary)),0 0 0 4px var(--c) !important;transform: scale(1.06)}
:root body #ledare-farg-palett .lfp-ruta.vald::after{content: "";position: absolute;inset: 0;margin: auto;width: 14px;height: 14px;background: #fff;-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat}
:root body #ledare-farg-palett .lfp-nyans-txt{color: var(--text-primary) !important;opacity: .8;font-weight: 600}
:root body #ledare-farg-palett .lfp-egen.lfp-egen{font-size: 0 !important;width: 36px !important;min-height: 36px !important;height: 36px;padding: 0 !important;margin: 12px auto 0 !important;display: block;border-radius: 50% !important;background: color-mix(in srgb,var(--text-primary) 8%,transparent) !important;position: relative}
:root body #ledare-farg-palett .lfp-egen.lfp-egen::before{content: "";position: absolute;inset: 0;margin: auto;width: 18px;height: 18px;background: var(--text-primary);-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='13.5' cy='6.5' r='.5' fill='black'/%3E%3Ccircle cx='17.5' cy='10.5' r='.5' fill='black'/%3E%3Ccircle cx='8.5' cy='7.5' r='.5' fill='black'/%3E%3Ccircle cx='6.5' cy='12.5' r='.5' fill='black'/%3E%3Cpath d='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z'/%3E%3C/svg%3E") center/contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='13.5' cy='6.5' r='.5' fill='black'/%3E%3Ccircle cx='17.5' cy='10.5' r='.5' fill='black'/%3E%3Ccircle cx='8.5' cy='7.5' r='.5' fill='black'/%3E%3Ccircle cx='6.5' cy='12.5' r='.5' fill='black'/%3E%3Cpath d='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z'/%3E%3C/svg%3E") center/contain no-repeat}
:root body #ledare-farg-palett .lfp-egen.lfp-egen:hover{background: color-mix(in srgb,var(--accent-primary) 18%,transparent) !important}
/* Tråd 10 (11-01, Patrik godkänt): färgväljarens fot - ring med vald färg (--nu sätts i mobile-soft-ui.js) och palett-ikonen. */
:root body #ledare-farg-palett .lfp-fot{display: flex;align-items: center;justify-content: space-between;gap: 10px;margin-top: 12px;padding-top: 10px;border-top: 1px solid color-mix(in srgb,var(--text-primary) 10%,transparent)}
:root body #ledare-farg-palett .lfp-fot::before{content: "Vald färg";order: 1;flex: 1;font-size: 12px;font-weight: 600;color: var(--text-primary);opacity: .8}
:root body #ledare-farg-palett .lfp-nu{order: 0;flex: none;width: 30px;height: 30px;border-radius: 50%;background: var(--nu,transparent);box-shadow: 0 0 0 2px var(--bg-frosty-content,var(--bg-dark-secondary)),0 0 0 4px var(--nu,color-mix(in srgb,var(--text-primary) 25%,transparent));margin-left: 4px}
:root body #ledare-farg-palett .lfp-fot .lfp-egen.lfp-egen{order: 2;margin: 0 !important;flex: none}
/* Tråd 10 (11-01, Patrik godkänt): mobilens ärendekortsfot (Personal/Kontor), Kontors kortton, kontorshuvudet i två rader, räknarbrickor med linjeikon + sifferbricka (dator och mobil). */
@media (max-width: 768px){html body .admin-ticket-preview:has(>.atp-footer-row):not(#_a):not(#_b):not(#_c){padding-bottom: 8px !important;overflow: hidden !important;background-image: linear-gradient(to top,color-mix(in srgb,var(--atp-color,var(--accent-primary)) 12%,transparent) 0 40px,color-mix(in srgb,var(--atp-color,var(--accent-primary)) 28%,transparent) 40px 41px,transparent 41px) !important}html body .admin-ticket-preview:not(#_a):not(#_b):not(#_c)>.atp-footer-row>*{margin-top: 12px !important}html body #office-detail-body .admin-ticket-preview:not(#_a):not(#_b):not(#_c){background-color: color-mix(in srgb,var(--atp-color,var(--accent-primary)) 6%,var(--bg-dark-secondary)) !important}}
@media (max-width: 768px){html body #office-detail-header>div:first-child{position: relative !important}html body #office-detail-header.detail-header-top:not(#_a):not(#_b){min-height: 100px !important;height: auto !important;padding-bottom: 8px !important}html body #office-detail-header .header-pills-row:not(#_a):not(#_b){position: absolute !important;top: 0 !important;right: 0 !important;left: auto !important;width: auto !important;margin: 0 !important;padding: 0 !important;justify-content: flex-end !important;max-height: none !important;height: auto !important;overflow: visible !important}html body #office-detail-header .header-pills-row .office-mobile-counter-slot:not(#_a):not(#_b){position: static !important;width: auto !important;margin: 0 !important;gap: 6px !important;flex-direction: column-reverse !important;align-items: stretch !important;min-width: 150px !important;gap: 8px !important}html body #office-detail-header .detail-subject:not(#_a):not(#_b){padding-right: 118px !important;box-sizing: border-box !important;white-space: nowrap !important;overflow: hidden !important;text-overflow: ellipsis !important}}
@media (max-width: 768px){html body #office-detail-header .office-mobile-counter-slot>div{width: 100% !important;margin: 0 !important}html body #office-detail-header .office-mobile-counter-slot>div>span:not(#_a){display: flex !important;align-items: center;gap: 6px;width: 100% !important;box-sizing: border-box !important;min-height: 36px !important;padding: 8px 12px !important;border-radius: 12px !important;font-size: 13px !important;font-weight: 600 !important;background: color-mix(in srgb,var(--text-primary) 5%,transparent) !important;border: 1px solid color-mix(in srgb,var(--text-primary) 10%,transparent) !important;color: var(--text-primary) !important}html body #office-detail-header .office-mobile-counter-slot>div[onclick*=Active]>span:not(#_a){background: color-mix(in srgb,var(--office-color,var(--accent-primary)) 16%,transparent) !important;border-color: color-mix(in srgb,var(--office-color,var(--accent-primary)) 34%,transparent) !important}}
html body .atlas-counter-ico{display: inline-block;flex: none;width: 16px;height: 16px;vertical-align: -3px;color: var(--text-primary)}
html body .atlas-counter-ico::before{content: "";position: absolute;inset: 0;background: currentColor;opacity: .7;-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='5' x='2' y='3' rx='1'/%3E%3Cpath d='M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E") center/contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='5' x='2' y='3' rx='1'/%3E%3Cpath d='M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8'/%3E%3Cpath d='M10 12h4'/%3E%3C/svg%3E") center/contain no-repeat}
html body .atlas-counter-ico--active{color: var(--accent-primary)}
html body .atlas-counter-ico--active::before{opacity: 1;-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 12 16 12 14 15 10 15 8 12 2 12'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E") center/contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 12 16 12 14 15 10 15 8 12 2 12'/%3E%3Cpath d='M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z'/%3E%3C/svg%3E") center/contain no-repeat}
html body .atlas-counter-ico{position: relative;overflow: visible;margin-right: 21px}
html body .atlas-counter-badge{position: absolute;top: -8px;left: 9px;min-width: 15px;height: 15px;padding: 0 4px;box-sizing: border-box;display: inline-flex;align-items: center;justify-content: center;border-radius: 8px;font: 600 9.5px/1 inherit;font-style: normal;letter-spacing: 0;background: var(--accent-primary);color: var(--bg-frosty-content,#fff);box-shadow: 0 0 0 1.5px var(--bg-frosty-content,var(--bg-dark-secondary));-webkit-mask: none !important;mask: none !important;opacity: 1}
html body .atlas-counter-ico--archived .atlas-counter-badge{background: color-mix(in srgb,var(--text-primary) 55%,transparent)}
@media (min-width: 769px){html body #view-admin span:has(>.atlas-counter-ico):not(#_a){display: inline-flex !important;align-items: center !important;justify-content: flex-start !important;gap: 0 !important;padding: 7px 14px 7px 12px !important;min-height: 34px !important;box-sizing: border-box !important;font-size: 12.5px !important;font-weight: 600 !important;color: var(--text-primary) !important}html body #view-admin span:has(>.atlas-counter-ico)>.atlas-counter-ico{margin-right: 31px !important}}
/* AT-177 (Patrik 11-01): kontorets prislista kapas i höjd med vänsterkolumnen; husets pil fäller ut resten. */
#view-admin .office-price-cap.is-capped:not(.is-open) > #price-list-grid { max-height: var(--office-price-cap, 480px); overflow: hidden; -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent); mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent); }
#view-admin .office-price-cap:not(.is-capped) > .atlas-unit-pills-more { display: none; }
#view-admin .office-price-cap > .atlas-unit-pills-more { margin-top: 2px; }
/* AT-177 tråd 11 (Patrik 11-01): Kopplade agenter som ärendekort, rund papperskorg, mobilens fotband på alla ärendekort, Personals piller. */
html body #view-admin #box-agents .office-agent-row:not(#_a) { box-sizing: border-box; padding: 9px 10px 9px 12px !important; margin: 0 0 6px !important; border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent) !important; border-left: 3px solid var(--agent-color, var(--accent-primary)) !important; border-radius: 12px; background: var(--bg-frosty-content) !important; box-shadow: none; }
html body #view-admin #box-agents .office-agent-row:not(#_a):last-child { margin-bottom: 0 !important; }
html body #view-admin #box-agents .office-agent-name:not(#_a) { font-weight: 600; }
/* Papperskorgen: rund, mjuk farofärgad yta, tunnare ikon; fylls helt vid hovring. */
html body #view-admin #box-agents .office-agent-remove:not(.is-armed):not(#_a) { width: 30px; min-width: 30px; height: 30px; padding: 0; border-radius: 50%; background: color-mix(in srgb, var(--status-danger, #ef4444) 10%, transparent) !important; color: var(--status-danger, #ef4444); }
html body #view-admin #box-agents .office-agent-remove:not(.is-armed):not(#_a):hover, html body #view-admin #box-agents .office-agent-remove:not(.is-armed):not(#_a):focus-visible { background: color-mix(in srgb, var(--status-danger, #ef4444) 22%, transparent) !important; }
html body #view-admin #box-agents .office-agent-remove:not(#_a) svg { width: 13px; height: 13px; }
html body #view-admin #box-agents .office-agent-remove.is-armed:not(#_a) { height: 30px; border-radius: 999px; padding: 0 12px; }
/* Mobil: agentkortet följer mobilens ärendekort (mobile-ticket-cards.css:229): ingen kant, 16 px hörn, skugga; ytan som grenens Kontor-ärendekort (admin-edit-state.css:241). */
@media (max-width: 768px) {
  :root body #view-admin #box-agents .office-agent-row.office-agent-row:not(#_a):not(#_b) { padding: 12px 14px !important; margin: 0 0 8px !important; border: none !important; border-image: linear-gradient(transparent, transparent) 1 !important; border-radius: var(--mtc-radius, 16px) !important; background: color-mix(in srgb, var(--agent-color, var(--accent-primary)) 6%, var(--bg-dark-secondary)) !important; box-shadow: var(--mtc-card-shadow) !important; }
  :root body #view-admin #box-agents .office-agent-row.office-agent-row:not(#_a):not(#_b):last-child { margin-bottom: 0 !important; }
}
/* Mobil: ärendekortens fot i Mina ärenden, Inkorgen, Garaget och Kunder är display:contents (höjd 0), så fotbandets färg (admin-edit-state.css:131) ritades aldrig. Bandet ritas i kortets bakgrund: 12 px luft + 24 px pill + 8 px = 44 px från botten. */
@media (max-width: 768px) {
  html body :is(.team-ticket-card, .archive-card):has(> .ticket-footer-bar):not(#_a):not(#_b):not(#_c) { background-image: linear-gradient(to top, color-mix(in srgb, var(--agent-color, var(--accent-primary)) 12%, transparent) 0 44px, color-mix(in srgb, var(--agent-color, var(--accent-primary)) 28%, transparent) 44px 45px, transparent 45px) !important; }
  html body :is(.team-ticket-card, .archive-card):not(#_a):not(#_b):not(#_c) > .ticket-footer-bar > * { margin-top: 10px !important; }
}
/* Mobil: Personals ärendekort – två piller (kontor + agent) blev 254 px i en 185 px kolumn och låg över datumet. Gruppen hålls i sin kolumn och pillren kortas med ellips, som på datorn (admin-ticket-preview-desktop.css:23). */
@media (max-width: 768px) {
  html body #view-admin .admin-ticket-preview .atp-pills:not(#_a):not(#_b) { max-width: 100% !important; width: auto !important; min-width: 0 !important; }
  html body #view-admin .admin-ticket-preview .atp-pills > .atp-pill:not(#_a):not(#_b) { display: block !important; min-width: 3.2em !important; flex: 0 1 auto !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
  html body #view-admin .admin-ticket-preview .atp-pills > .atp-pill:not(#_a):not(#_b) > svg { display: inline-block !important; vertical-align: -2px !important; margin-right: 4px !important; }
}
/* Dator och mobil: på agentens egen sida (Personal) tillhör alla ärenden agenten, så agentpillret (admin-core.js:488) är överflödigt (Patrik 11-02). */
html body #view-admin #agent-detail-body .admin-ticket-preview .atp-pill[title^="Tilldelad agent"]:not(#_a):not(#_b) { display: none !important; }
/* Dator: agenthuvudets märken (roll, @användare) i agentens färg, som i mobilen (mobile-soft-customers-admin.css). Ersätter accentplattan i detail-header-desktop.css:29 för agentsidan (Patrik 11-02: "agenten skall ha agentfärgen alltid"). */
@media (min-width: 769px) {
  html body #view-admin .admin-user-detail .detail-header-top .header-pills-row .pill.pill[style]:not(#_a) { background: color-mix(in srgb, var(--dynamic-pill-color, var(--accent-primary)) 10%, transparent) !important; color: color-mix(in srgb, var(--dynamic-pill-color, var(--accent-primary)) 60%, var(--text-primary)) !important; border-color: color-mix(in srgb, var(--dynamic-pill-color, var(--accent-primary)) 24%, transparent) !important; }
}
/* Oplockade ärenden (getAgentStyles('unclaimed') = #ff4444) i temats varningsfärg, inte rött: rött betyder hög prioritet och ta bort (Patrik 11-02 "Testa orange", godkänt). Dator + mobil; går före mobilens accentregel (mobile-soft-ticket-views.css:198). */
:root body :is(.team-ticket-card, .admin-ticket-preview, .archive-card):is([style*="#ff4444"], [style*="255, 68, 68"]):not(#_a):not(#_b):not(#_c) { --agent-color: var(--status-warning, #ff9f0a) !important; --atp-color: var(--status-warning, #ff9f0a) !important; border-left-color: var(--status-warning, #ff9f0a) !important; }
:root body :is(.team-ticket-card, .admin-ticket-preview, .archive-card) :is([style*="#ff4444"], [style*="255, 68, 68"]):not(#_a):not(#_b):not(#_c) { --agent-color: var(--status-warning, #ff9f0a) !important; --dynamic-pill-color: var(--status-warning, #ff9f0a) !important; --dynamic-pill-bg: color-mix(in srgb, var(--status-warning, #ff9f0a) 10%, transparent) !important; color: color-mix(in srgb, var(--status-warning, #ff9f0a) 50%, var(--text-primary)) !important; }
:root body :is(.team-ticket-card, .admin-ticket-preview, .archive-card) :is(.ticket-tag, .atp-pill):is([style*="#ff4444"], [style*="255, 68, 68"]):not(#_a):not(#_b):not(#_c) { background: color-mix(in srgb, var(--status-warning, #ff9f0a) 10%, transparent) !important; border-color: color-mix(in srgb, var(--status-warning, #ff9f0a) 30%, transparent) !important; }
/* Öppnat oplockat ärende: detaljvyns färger (_getTicketDetailTheme sätter dem inline) i varningsfärgen. */
:root body [style*="--detail-accent: #ff4444"]:not(#_a):not(#_b):not(#_c) {
  --w: var(--status-warning, #ff9f0a);
  --detail-accent: var(--w) !important; --detail-accent-text: color-mix(in srgb, var(--w) 50%, var(--text-primary)) !important;
  --detail-bg: color-mix(in srgb, var(--w) 8%, transparent) !important; --detail-footer-bg: color-mix(in srgb, var(--w) 8%, transparent) !important;
  --detail-accent-11: color-mix(in srgb, var(--w) 7%, transparent) !important; --detail-accent-18: color-mix(in srgb, var(--w) 9%, transparent) !important;
  --detail-accent-1a: color-mix(in srgb, var(--w) 10%, transparent) !important; --detail-accent-22: color-mix(in srgb, var(--w) 13%, transparent) !important;
  --detail-accent-35: color-mix(in srgb, var(--w) 21%, transparent) !important; --detail-accent-40: color-mix(in srgb, var(--w) 25%, transparent) !important;
  --detail-accent-44: color-mix(in srgb, var(--w) 27%, transparent) !important; --detail-accent-55: color-mix(in srgb, var(--w) 33%, transparent) !important;
  --detail-accent-66: color-mix(in srgb, var(--w) 40%, transparent) !important; --detail-accent-aa: color-mix(in srgb, var(--w) 67%, transparent) !important;
}
/* Ljusa teman: ren varningsfärg som text (avatarens initialer, MAIL-märket) gav kontrast 1,5 mot ljus yta (temasvepet 11-02). Mörkare orange där. */
:root body.atlas-light-theme [style*="--detail-accent: #ff4444"]:not(#_a):not(#_b):not(#_c) { --w: color-mix(in srgb, var(--status-warning, #ff9f0a) 62%, #000); }
:root body [style*="--detail-footer-bg:rgba(255, 68, 68"]:not(#_a):not(#_b):not(#_c) { --detail-footer-bg: color-mix(in srgb, var(--status-warning, #ff9f0a) 8%, transparent) !important; }
/* Bubblorna (Patrik 11-02): kundens i ärendets färg (--detail-accent), agentens i skribentens färg (--msg-agent från getAgentBubbleVar, live via --agent-live-<agent>), Atlas egna svar neutralt grå. */
:root body .msg-row.msg-row.user:not(#_a):not(#_b) { --bubble-neutral-bg: color-mix(in srgb, var(--detail-accent, var(--accent-primary)) 26%, var(--bg-dark-tertiary)) !important; }
:root body.atlas-light-theme .msg-row.msg-row.user:not(#_a):not(#_b) { --bubble-neutral-bg: color-mix(in srgb, var(--detail-accent, var(--accent-primary)) 15%, #ffffff) !important; }
:root body .msg-row.msg-row.atlas[style*="--msg-agent"]:not(#_a):not(#_b) { --detail-accent: var(--msg-agent) !important; --detail-bubble-bg: color-mix(in srgb, var(--msg-agent) 26%, var(--bg-dark-tertiary)) !important; }
:root body.atlas-light-theme .msg-row.msg-row.atlas[style*="--msg-agent"]:not(#_a):not(#_b) { --detail-bubble-bg: color-mix(in srgb, var(--msg-agent) 15%, #ffffff) !important; }
:root body .msg-row.msg-row.atlas:not([style*="--msg-agent"]):not(#_a):not(#_b) { --detail-bubble-bg: color-mix(in srgb, var(--text-primary) 7%, var(--bg-dark-tertiary)) !important; }
:root body.atlas-light-theme .msg-row.msg-row.atlas:not([style*="--msg-agent"]):not(#_a):not(#_b) { --detail-bubble-bg: color-mix(in srgb, var(--text-primary) 6%, #ffffff) !important; }
/* Personal › agent i mobilen – räknarna som egen rad under pillren: två lika breda brickor, Aktiva först (Kontors brickstil, b58ba7ab6). Namnet får hela bredden. Räknarna ritas om utan klasser (admin-agents.js:627, :702), därför struktur + ikonklass. */
@media (max-width: 768px) {
  html body #view-admin .admin-user-detail .detail-header-top > div:not(.agent-desktop-counter-wrap) > div:last-child:not(#_a):not(#_b) { display: flex !important; flex-direction: column !important; }
  html body #view-admin #admin-detail-content .admin-user-detail .detail-header-top > div:not(.agent-desktop-counter-wrap) > div:last-child > div:first-child:not(#_a):not(#_b) { padding-right: 0 !important; }
  html body #view-admin .admin-user-detail .detail-header-top .detail-subject.detail-subject:not(#_a):not(#_b) { padding-right: 0 !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot.agent-mobile-counter-slot:not(#_a):not(#_b) { position: static !important; order: 3 !important; width: 100% !important; max-width: none !important; margin: 10px 0 0 !important; inset: auto !important; transform: none !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot > div:not(#_a):not(#_b) { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; width: 100% !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot > div > div:not(#_a):not(#_b) { width: auto !important; min-width: 0 !important; margin: 0 !important; display: block !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot > div > div:has(.atlas-counter-ico--active):not(#_a):not(#_b) { order: -1 !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot > div > div > span:not(#_a):not(#_b) { display: flex !important; align-items: center !important; width: 100% !important; box-sizing: border-box !important; height: auto !important; min-height: 36px !important; padding: 8px 12px !important; border-radius: 12px !important; font-size: 13px !important; font-weight: 600 !important; background: color-mix(in srgb, var(--text-primary) 5%, transparent) !important; border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important; color: var(--text-primary) !important; }
  html body #view-admin .admin-user-detail .agent-mobile-counter-slot > div > div > span:has(.atlas-counter-ico--active):not(#_a):not(#_b) { background: color-mix(in srgb, var(--agent-color, var(--accent-primary)) 16%, transparent) !important; border-color: color-mix(in srgb, var(--agent-color, var(--accent-primary)) 34%, transparent) !important; }
}
/* Kontor (Patrik 11-02: "lägg dem under som på personal") i mobilen – räknarna som egen rad under namn och ikoner, två lika breda brickor, Aktiva först. */
@media (max-width: 768px) {
  html body #office-detail-header > div:first-child > div:nth-child(2):not(#_a):not(#_b) { display: contents !important; }
  html body #office-detail-header.detail-header-top:not(#_a):not(#_b):not(#_c) { min-height: 0 !important; }
  html body #office-detail-header .detail-subject.detail-subject:not(#_a):not(#_b):not(#_c):not(#_d) { padding-right: 0 !important; }
  html body #office-detail-header .header-pills-row:not(#_a):not(#_b):not(#_c) { position: static !important; grid-column: 1 / -1 !important; width: 100% !important; margin: 10px 0 0 !important; justify-content: stretch !important; }
  html body #office-detail-header .header-pills-row .office-mobile-counter-slot:not(#_a):not(#_b):not(#_c) { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 8px !important; width: 100% !important; min-width: 0 !important; }
  html body #office-detail-header .office-mobile-counter-slot > div:has(.atlas-counter-ico--active):not(#_a):not(#_b) { order: -1 !important; }
}
@media (max-width: 768px) {
  html body #office-detail-header .office-mobile-counter-slot > div > span:not(#_a):not(#_b):not(#_c) { display: flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; width: 100% !important; box-sizing: border-box !important; height: auto !important; min-height: 36px !important; padding: 8px 12px !important; border-radius: 12px !important; font-size: 13px !important; font-weight: 600 !important; background: color-mix(in srgb, var(--text-primary) 5%, transparent) !important; border: 1px solid color-mix(in srgb, var(--text-primary) 10%, transparent) !important; color: var(--text-primary) !important; }
  html body #office-detail-header .office-mobile-counter-slot > div > span:has(.atlas-counter-ico--active):not(#_a):not(#_b):not(#_c) { background: color-mix(in srgb, var(--unit-color, var(--office-color, var(--accent-primary))) 16%, transparent) !important; border-color: color-mix(in srgb, var(--unit-color, var(--office-color, var(--accent-primary))) 34%, transparent) !important; }
}
/* Initialringen (agent-presence-ring): agentfärgen som text gav kontrast 1,05 för ljusa agentfärger på ljus yta (temasvepet 11-02). Texten blandas med temats textfärg; kanten behåller agentfärgen. */
:root body .agent-presence-ring.agent-presence-ring:not(#_a):not(#_b) { color: color-mix(in srgb, var(--agent-color, var(--accent-primary)) 40%, var(--text-primary)) !important; }
/* Ljusa teman: interna ärendens gula text (#f1c40f, archive-view/tickets-view) gav kontrast 1,4 på kortets ljusgula yta (temasvepet 11-02). Kant och yta behåller gult. */
:root body.atlas-light-theme :is(.team-ticket-card, .archive-card, .detail-header-top) :is([style*="color: #f1c40f"], [style*="color:#f1c40f"]) > span:not([style*="color"]):not(#_a):not(#_b) { color: color-mix(in srgb, #f1c40f 45%, var(--text-primary)) !important; }
/* Kontorets prisrad i mobilen, upplåst – namnet på egen rad, pris och knappar under (namnen kapades till 111 px; låssvepet 11-02). */
@media (max-width: 768px) {
  html body #view-admin #box-prices .price-row > div:has(.price-inp):not(#_a):not(#_b) { flex-wrap: wrap !important; row-gap: 2px !important; width: 100% !important; }
  html body #view-admin #box-prices .price-row > div:has(.price-inp) > span:first-child:not(#_a):not(#_b) { flex: 1 1 100% !important; min-width: 0 !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; height: auto !important; min-height: 28px !important; display: flex !important; align-items: center !important; }
  html body #view-admin #box-prices .price-row > div:has(.price-inp) > .office-price-actions:not(#_a):not(#_b) { margin-left: auto !important; }
}
/* Temasvepet (tråd 12): text som låg under läsbarhetsgränsen i minst ett av de tio temana. Bara textfärg och opacitet. */
html body #view-admin #box-prices .office-service-note-btn:not(.has-note):not(#_a):not(#_b) { color: color-mix(in srgb, var(--text-secondary) 55%, var(--text-primary)) !important; opacity: 1 !important; }
html body #view-admin #box-prices .office-service-note-btn.has-note:not(#_a):not(#_b) { background: color-mix(in srgb, var(--accent-primary) 20%, transparent) !important; color: color-mix(in srgb, var(--accent-primary) 65%, var(--text-primary)) !important; }
html body #view-admin .admin-user-detail .agent-view-admin-lock:not(#_a) { opacity: 1 !important; color: color-mix(in srgb, var(--text-secondary) 60%, var(--text-primary)) !important; }
html body #view-admin .admin-user-detail :is(.agent-office-city, .agent-office-count, .agent-office-group-arrow):not(#_a) { color: color-mix(in srgb, var(--text-secondary) 55%, var(--text-primary)) !important; }
html body .cf-surface .cf-help:not(#_a) { color: color-mix(in srgb, var(--text-secondary) 60%, var(--text-primary)) !important; }
html body #view-admin #admin-main-list .catalog-list-copy small:not(#_a) { opacity: .8 !important; }
html body #view-admin #admin-main-list .catalog-list-section-label--clickable:not(#_a):not(#_b) { opacity: 1 !important; }