:root {
  --coservice-sidebar: #101828;
  --coservice-sidebar-soft: #1d2939;
  --coservice-accent: #2563eb;
  --coservice-success: #099250;
  --coservice-warning: #dc6803;
  --coservice-danger: #d92d20;
  --coservice-muted: #667085;
  --coservice-border: #eaecf0;
}

body {
  background: #f6f8fb;
}

.coservice-shell {
  min-height: 100vh;
}

.coservice-sidebar {
  background: var(--coservice-sidebar);
  bottom: 0;
  color: #d0d5dd;
  left: 0;
  overflow-y: auto;
  padding: 1rem;
  position: fixed;
  top: 0;
  width: 280px;
  z-index: 1040;
}

.coservice-brand {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  color: #fff;
  display: flex;
  gap: .75rem;
  padding: .25rem .25rem 1rem;
}

.coservice-brand-mark {
  align-items: center;
  background: #2447bd;
  border-radius: .5rem;
  color: #fff;
  display: inline-flex;
  font-weight: 800;
  font-size: 26px;
  flex-shrink: 0;
  height: 38px;
  justify-content: center;
  width: 38px;
}

.coservice-nav-title {
  color: #98a2b3;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: 0;
  margin: 1.25rem .75rem .5rem;
  text-transform: uppercase;
}

.coservice-nav {
  list-style: none;
  margin: 0;
  padding: 0;
}

.coservice-nav a {
  align-items: center;
  border-radius: .5rem;
  color: #d0d5dd;
  display: flex;
  gap: .75rem;
  padding: .68rem .75rem;
  text-decoration: none;
}

.coservice-nav a.active,
.coservice-nav a:hover {
  background: var(--coservice-sidebar-soft);
  color: #fff;
}

.coservice-main {
  margin-left: 280px;
  min-height: 100vh;
}

.coservice-topbar {
  align-items: center;
  background: rgba(255, 255, 255, .92);
  border-bottom: 1px solid var(--coservice-border);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  min-height: 72px;
  padding: .875rem 1.5rem;
  position: sticky;
  top: 0;
  z-index: 1020;
}

.coservice-content {
  padding: 1.5rem;
}

.coservice-card {
  background: #fff;
  border: 1px solid var(--coservice-border);
  border-radius: .5rem;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

.coservice-card-header {
  align-items: center;
  border-bottom: 1px solid var(--coservice-border);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem 1.125rem;
}

.coservice-card-body {
  padding: 1.125rem;
}

.coservice-stat {
  min-height: 118px;
}

.coservice-stat .icon {
  align-items: center;
  border-radius: .5rem;
  display: inline-flex;
  font-size: 1.25rem;
  height: 42px;
  justify-content: center;
  width: 42px;
}

.coservice-section {
  display: none;
}

.coservice-section.active {
  display: block;
}

.coservice-table {
  min-width: 920px;
}

.status-pill {
  border-radius: 999px;
  display: inline-flex;
  font-size: .75rem;
  font-weight: 700;
  padding: .25rem .58rem;
}

.status-ok {
  background: #dcfae6;
  color: #067647;
}

.status-info {
  background: #dbeafe;
  color: #1d4ed8;
}

.status-warn {
  background: #fef0c7;
  color: #b54708;
}

.status-danger {
  background: #fee4e2;
  color: #b42318;
}

.task-workspace { min-width: 0; }
.task-view-tab { padding: 10px 0; border-bottom: 2px solid #4385dc; width: fit-content; font-weight: 600; }
.task-toolbar { display: flex; flex-wrap: wrap; gap: 10px; padding: 20px 0 28px; border-top: 1px solid var(--coservice-border); }
.task-toolbar .form-control, .task-toolbar .form-select { width: auto; max-width: 100%; min-width: 150px; flex: 1 1 170px; }
.task-toolbar .btn { flex-shrink: 0; }
.task-group { --group-color: #4385dc; margin-bottom: 30px; }
.task-group.group-1 { --group-color: #9365b8; }
.task-group.group-2 { --group-color: #239d91; }
.task-group summary { color: var(--group-color); padding: 8px 0 12px; font-size: 16px; font-weight: 600; cursor: pointer; text-transform: capitalize; }
.task-group summary span { font-size: 12px; font-weight: 400; color: #667085; margin-left: 12px; text-transform: none; }
.task-table-scroll { overflow-x: auto; border-left: 4px solid var(--group-color); }
.task-table { width: 100%; min-width: 960px; table-layout: fixed; border-collapse: collapse; background: #fff; font-size: 13px; }
.task-table th, .task-table td { border: 1px solid #e7e9ef; padding: 10px 12px; text-align: center; overflow-wrap: anywhere; }
.task-table th { font-weight: 500; color: #667085; height: 38px; }
.task-table th:first-child { width: 29%; }
.task-table th:nth-child(2) { width: 17%; }
.task-table th:nth-child(3) { width: 16%; }
.task-table th:nth-child(4) { width: 12%; }
.task-table th:nth-child(5) { width: 14%; }
.task-table th:nth-child(6) { width: 12%; }
.task-progress-count { font-weight: 600; }
.task-progress-track { height: 6px; background: #e6eaef; margin-top: 5px; }
.task-progress-track span { display: block; height: 100%; background: #19957e; }
.task-detail-progress { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px 0 18px; font-size: 13px; }
.task-detail-progress .task-progress-track { grid-column: 1 / -1; margin-top: 0; }
.task-table td:first-child { text-align: left; }
.task-table td strong { font-weight: 500; }
.task-table small { display: block; font-size: 11px; color: #667085; margin-top: 3px; }
.task-table tbody tr:hover td:not(.task-status) { background: #f5f8ff; }
.task-person { display: flex; align-items: center; gap: 8px; text-align: left; }
.task-avatar { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; background: #edf1fc; color: #38558b; font-size: 10px; font-weight: 600; }
.task-status { font-weight: 500; }
.task-status-pending { background: #e4e8ed; color: #364152; }
.task-status-in_progress, .task-status-reopened { background: #e8b1e8; color: #55205e; }
.task-status-blocked { background: #c84156; color: #fff; }
.task-status-done { background: #aed251; color: #30420a; }
.task-status-waiting_response { background: #367dae; color: #fff; }
.task-status-awaiting_validation { background: #f5ce75; color: #61480d; }
.task-status-cancelled, .task-status-archived { background: #697386; color: #fff; }
.task-stars { display: inline-flex; gap: 2px; color: #d5d9e1; white-space: nowrap; }
.task-stars .filled { color: #bd7b0b; }
.task-add { border: 0; background: transparent; color: #667085; padding: 0; }
.task-add:hover { color: #245dc1; }
.task-status-summary { display: flex; height: 12px; gap: 2px; }
.task-status-summary span { flex: 1; }
.task-table tfoot td { height: 48px; }
.task-empty { padding: 45px 15px; text-align: center; color: #667085; }

.kanban-board {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(4, minmax(230px, 1fr));
  overflow-x: auto;
}

.kanban-column {
  background: #f8fafc;
  border: 1px solid var(--coservice-border);
  border-radius: .5rem;
  min-height: 280px;
  padding: .75rem;
}

.kanban-item {
  background: #fff;
  border: 1px solid var(--coservice-border);
  border-left: 3px solid var(--coservice-accent);
  border-radius: .5rem;
  margin-bottom: .75rem;
  padding: .75rem;
}

.activity-line {
  border-left: 2px solid #d0d5dd;
  margin-left: .45rem;
  padding-left: 1rem;
  position: relative;
}

.activity-line::before {
  background: var(--coservice-accent);
  border: 3px solid #fff;
  border-radius: 50%;
  content: "";
  height: .75rem;
  left: -.43rem;
  position: absolute;
  top: .25rem;
  width: .75rem;
}

.chat-panel {
  height: 470px;
}

.chat-messages {
  background: #f8fafc;
  border: 1px solid var(--coservice-border);
  border-radius: .5rem;
  height: 100%;
  overflow: auto;
  padding: 1rem;
}

.chat-bubble {
  background: #fff;
  border: 1px solid var(--coservice-border);
  border-radius: .5rem;
  margin-bottom: .75rem;
  max-width: 760px;
  padding: .75rem;
}

.chat-row {
  display: flex;
}

.chat-row-own {
  justify-content: flex-end;
}

.chat-row-own .chat-bubble {
  background: var(--coservice-accent);
  border-color: var(--coservice-accent);
  color: #fff;
}

.chat-row-own .text-muted {
  color: rgba(255, 255, 255, .78) !important;
}

.chat-row-own .chat-bubble {
  border-bottom-right-radius: .125rem;
}

.chat-row:not(.chat-row-own) .chat-bubble {
  border-bottom-left-radius: .125rem;
}

.chat-workspace { display: grid; grid-template-columns: 250px minmax(0, 1fr); height: min(740px, calc(100dvh - 155px)); min-height: 430px; background: #fff; border: 1px solid #e3e7eb; position: relative; overflow: hidden; }
.chat-workspace.search-open { grid-template-columns: 220px minmax(280px, 1fr) 260px; }
.chat-conversations { border-right: 1px solid #e3e7eb; overflow: auto; background: #fff; }
.chat-side-heading { display: flex; align-items: center; justify-content: space-between; min-height: 65px; padding: 14px 16px; gap: 8px; }
.chat-side-heading h2, .chat-thread-header h2 { font-size: 14px; margin: 0; font-weight: 600; }
.chat-side-search { padding: 0 12px 15px; }
.chat-side-search input { font-size: 12px; background: #f7f9fa; }
.chat-list-label { padding: 16px 16px 9px; color: #72818b; font-size: 10px; font-weight: 600; }
.chat-conversation { display: flex; gap: 10px; align-items: center; text-align: left; width: calc(100% - 16px); margin: 0 8px; padding: 13px 10px; border: 0; border-radius: 5px; background: #e6f5fa; color: #16485c; }
.chat-conversation[hidden] { display: none; }
.chat-channel-avatar { width: 36px; height: 36px; flex: 0 0 36px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: #159bc0; color: #fff; font-size: 19px; }
.chat-conversation-copy { min-width: 0; }
.chat-conversation-copy strong { display: block; font-size: 13px; }
.chat-conversation-copy small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 11px; margin-top: 4px; }
.chat-member { display: flex; align-items: center; gap: 10px; padding: 10px 16px; font-size: 12px; }
.chat-member small { display: block; color: #7a8791; font-size: 10px; }
.chat-member-avatar, .chat-message-avatar { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%; background: #eee9dc; color: #6c5840; font-size: 10px; font-weight: 600; }
.chat-thread { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: #e9f3f2; }
.chat-thread-header { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: #fff; border-bottom: 1px solid #e3e7eb; min-height: 65px; }
.chat-thread-title { flex: 1; min-width: 0; }
.chat-thread-title small { font-size: 11px; color: #75828b; }
.chat-icon { border: 0; background: transparent; width: 32px; height: 32px; flex: 0 0 32px; color: #647985; border-radius: 4px; font-size: 18px; }
.chat-icon:hover { background: #edf5f7; color: #087d9d; }
.chat-list-toggle, .chat-close-list { display: none; }
.chat-thread .chat-messages { flex: 1; min-height: 0; height: auto; padding: 22px 18px; border: 0; border-radius: 0; background: transparent; }
.chat-start-label { margin: 0 auto 24px; width: fit-content; padding: 4px 12px; border-radius: 4px; background: #d6e4e3; color: #536e6c; font-size: 10px; }
.chat-thread .chat-row { gap: 8px; align-items: flex-end; margin-bottom: 15px; }
.chat-thread .chat-bubble { max-width: 82%; min-width: 0; padding: 10px 12px; margin: 0; border: 0; box-shadow: 0 1px 2px #203b3510; font-size: 12px; }
.chat-bubble strong { font-size: 11px; color: #218394; }
.chat-row-own .chat-bubble { background: #137fa8; }
.chat-row-own .chat-bubble strong { color: #e4f8ff; }
.chat-bubble .small { font-size: 10px; white-space: nowrap; }
.chat-message-text { overflow-wrap: anywhere; white-space: pre-wrap; margin-top: 4px; line-height: 1.6; }
.chat-composer { display: flex; align-items: center; gap: 10px; background: #fff; margin: 0 16px 16px; padding: 8px; border: 1px solid #dfe9e9; border-radius: 6px; }
.chat-composer input { border: 0; box-shadow: none; min-width: 0; font-size: 13px; }
.chat-send { background: #139ac1; border: 0; color: #fff; border-radius: 50%; width: 36px; height: 36px; flex: 0 0 36px; font-size: 18px; }
.chat-send:hover { background: #087d9d; }
.chat-search-panel { border-left: 1px solid #e3e7eb; background: #fff; min-height: 0; overflow: auto; }
.chat-search-results { padding: 0 14px; }
.chat-search-result { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid #e7edef; background: #fff; padding: 13px 0; font-size: 12px; }
.chat-search-result:hover { background: #f3f9fa; }
.chat-search-result strong { color: #218394; }
.chat-search-result small { float: right; color: #75828b; }
.chat-search-result span { display: block; margin-top: 7px; overflow-wrap: anywhere; }
.chat-found .chat-bubble { outline: 3px solid #e6b650; }
@media (max-width: 1200px) {
  .chat-workspace.search-open { grid-template-columns: 220px minmax(0, 1fr); }
  .chat-search-panel { position: absolute; right: 0; top: 0; bottom: 0; width: min(300px, 100%); box-shadow: -8px 0 24px #2133421a; z-index: 3; }
}
@media (max-width: 767px) {
  .chat-workspace, .chat-workspace.search-open { grid-template-columns: minmax(0, 1fr); height: calc(100dvh - 180px); }
  .chat-conversations { display: none; }
  .chat-list-toggle, .chat-close-list { display: block; }
  .chat-workspace.list-open .chat-conversations { display: block; position: absolute; inset: 0 auto 0 0; width: min(280px, 100%); z-index: 4; box-shadow: 8px 0 24px #2133421a; }
  .chat-thread .chat-messages { padding: 16px 10px; }
  .chat-thread-header { padding: 10px; }
  .chat-composer { margin: 0 10px 10px; }
}

.attendance-heading, .attendance-actions, .attendance-filters { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-bottom: 20px; }
.attendance-heading { justify-content: space-between; }
.attendance-filters { border-top: 1px solid #e3e7eb; padding-top: 20px; align-items: flex-end; }
.attendance-filters > div { min-width: 190px; }
.attendance-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid #e3e7eb; margin-bottom: 24px; }
.attendance-summary > div { padding: 18px 12px; }
.attendance-summary small { display: block; color: #667085; }
.attendance-summary strong { display: block; font-size: 24px; margin-top: 4px; }
.attendance-ledger { background: #fff; }
.attendance-ledger table { min-width: 840px; font-size: 13px; }
.attendance-ledger th { background: #f5f8fa; font-size: 12px; }
.attendance-ledger td, .attendance-ledger th { padding: 13px 16px; border: 1px solid #edf0f2; }
.attendance-event { display: inline-block; margin: 2px 8px 2px 0; color: #347f8b; }
@media (max-width: 600px) { .attendance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .attendance-filters > div { min-width: 0; width: 100%; } }

.service-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 24px; }
.service-toolbar h2 { margin-right: auto; }
.service-toolbar .form-control, .service-toolbar .form-select { width: auto; max-width: 240px; flex: 1 1 180px; }
.service-table { background: #fff; min-width: 760px; }
.service-table td, .service-table th { padding: 14px; }
.service-link { border: 0; padding: 0; background: transparent; color: #126d98; text-align: left; font-weight: 500; overflow-wrap: anywhere; }
.service-link:hover { text-decoration: underline; }
.service-user { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 0; border-bottom: 1px solid #edf0f2; }
.service-user small { display: block; color: #667085; overflow-wrap: anywhere; }
.service-description p, .service-history p { white-space: pre-wrap; overflow-wrap: anywhere; }
.service-detail-meta { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12px; color: #667085; border-bottom: 1px solid #e3e7eb; padding-bottom: 12px; margin-bottom: 16px; }
.service-history { border-left: 2px solid #b8dce0; padding: 0 0 16px 14px; margin-left: 3px; }
.service-history strong { font-size: 13px; }
.service-history small { display: block; font-size: 11px; color: #667085; }
.service-history p { margin-top: 8px; font-size: 13px; }
.asset-actions { display: flex; gap: 5px; }
.task-status-difficulty { background: #efc55e; color: #634c09; }
.modal-title { overflow-wrap: anywhere; }
.dropdown-menu { max-width: min(380px, 92vw); }
.dropdown-item { white-space: normal; overflow-wrap: anywhere; }
[hidden] { display: none !important; }
@media (max-width: 767px) {
  .coservice-topbar { flex-wrap: wrap; position: relative; }
  .coservice-topbar > div { min-width: 0; }
  .coservice-stat .coservice-card-body { flex-direction: column; align-items: flex-start !important; }
  .coservice-stat { font-size: 12px; }
  .service-toolbar .form-control, .service-toolbar .form-select { max-width: none; }
}

.coservice-overlay {
  background: rgba(16, 24, 40, .46);
  bottom: 0;
  display: none;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1030;
}

body.sidebar-open .coservice-overlay {
  display: block;
}

@media (max-width: 991.98px) {
  .coservice-sidebar {
    transform: translateX(-100%);
    transition: transform .2s ease;
  }

  body.sidebar-open .coservice-sidebar {
    transform: translateX(0);
  }

  .coservice-main {
    margin-left: 0;
  }

  .coservice-content {
    padding: 1rem;
  }

  .coservice-topbar {
    padding-inline: 1rem;
  }

  .kanban-board {
    grid-template-columns: repeat(4, 260px);
  }
}
.inventory-layout { display: grid; grid-template-columns: 230px minmax(0,1fr); border-top: 1px solid #e4e7ec; }
.inventory-dashboard { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-block: 1px solid #e4e7ec; margin-top: 18px; background: #fff; }
.inventory-metric { display: flex; align-items: center; gap: 14px; min-height: 105px; padding: 18px; text-align: left; background: transparent; border: 0; border-right: 1px solid #e4e7ec; color: #344054; }
.inventory-metric:last-child { border-right: 0; }
.inventory-metric > span { flex: 1; min-width: 0; }
.inventory-metric strong { display: block; font-size: 28px; line-height: 1.2; color: #17212b; }
.inventory-metric span span { display: block; font-size: 12px; margin-top: 6px; }
.inventory-metric > i:first-child { font-size: 23px; }
.metric-red > i:first-child { color: #c3464a; }
.metric-blue > i:first-child { color: #287bb1; }
.metric-green > i:first-child { color: #168574; }
.metric-amber > i:first-child { color: #ac751b; }
.inventory-metric:hover, .inventory-metric[aria-pressed="true"] { background: #f1f6f7; box-shadow: inset 0 -3px #168574; }
.inventory-searchbar { display: flex; gap: 10px; margin-bottom: 12px; }
.inventory-search-input { position: relative; min-width: 0; flex: 1; }
.inventory-search-input > i { position: absolute; top: 10px; left: 12px; color: #667085; }
.inventory-search-input input { padding-left: 36px; }
.inventory-searchbar > button { flex-shrink: 0; }
.inventory-active-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.inventory-active-filters:empty { display: none; }
.inventory-filter-chip { border: 1px solid #d7e3e5; border-radius: 4px; background: #eef5f5; color: #35575a; padding: 5px 9px; font-size: 12px; max-width: 100%; overflow-wrap: anywhere; text-align: left; }
.inventory-org-tabs { display: flex; border-bottom: 1px solid #dfe5ea; margin-bottom: 10px; }
.inventory-org-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; padding: 8px 6px; font-size: 12px; color: #667085; flex: 1; }
.inventory-org-tabs button[aria-pressed="true"] { color: #08756f; border-bottom-color: #168574; }
.inventory-all { width: 100%; margin-bottom: 8px; }
.inventory-person { display: flex; align-items: center; gap: 8px; width: 100%; padding: 10px 6px; border: 0; border-bottom: 1px solid #e7ebef; background: transparent; font-size: 12px; text-align: left; color: #344054; }
.inventory-person span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.inventory-person[aria-pressed="true"] { background: #eaf4f2; color: #08756f; }
.inventory-assign-row { border: 1px solid #dce4ea; background: #fff; color: #08756f; width: 32px; height: 32px; border-radius: 4px; margin: 4px; }
.inventory-custody-heading { display: flex; gap: 12px; align-items: center; padding: 12px 0 20px; }
.inventory-custody-heading > i { color: #08756f; font-size: 24px; }
#inventoryFilterPanel[hidden], #inventoryPeople[hidden], #inventoryTree[hidden] { display: none; }
.inventory-alerts > button { display: flex; align-items: center; gap: 8px; border: 0; background: transparent; border-bottom: 2px solid transparent; padding: 5px 0; }
.inventory-alerts > button[aria-pressed="true"] { border-bottom-color: #ac751b; }
.inventory-alerts > button strong { font-size: 13px; background: #f7ead5; color: #79500b; padding: 2px 7px; border-radius: 4px; }
.inventory-tree { padding: 20px 14px 20px 0; border-right: 1px solid #e4e7ec; overflow-wrap: anywhere; }
.inventory-tree summary { font-weight: 600; padding: 8px 0; cursor: pointer; }
.inventory-tree-department { margin: 8px 0 12px 10px; }
.inventory-tree-department > div, .inventory-tree-area { display: flex; align-items: start; gap: 4px; }
.inventory-tree-area { margin-left: 12px; }
.inventory-tree-link, .inventory-tree-edit { background: transparent; border: 0; color: inherit; padding: 5px 2px; text-align: left; }
.inventory-tree-link { flex: 1; font-size: 12px; }
.inventory-tree-link:hover { color: #087f8c; text-decoration: underline; }
.inventory-tree-edit { flex: 0 0 24px; color: #667085; }
.inventory-main { min-width: 0; padding: 20px 0 20px 20px; }
.inventory-filters { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-bottom: 16px; align-items: end; }
.inventory-filters .form-control, .inventory-filters .form-select { min-width: 0; font-size: 12px; }
.inventory-alerts { display: flex; flex-wrap: wrap; gap: 12px 32px; padding: 18px 0; }
.inventory-alerts > div { display: flex; align-items: baseline; gap: 8px; }
.inventory-alerts strong { font-size: 22px; color: #9c5429; }
.inventory-alerts span { color: #667085; font-size: 12px; }
.inventory-table { font-size: 12px; min-width: 780px; }
.inventory-table th { background: #f6f8fa; white-space: nowrap; }
.inventory-table td { vertical-align: middle; max-width: 240px; overflow-wrap: anywhere; }
.inventory-table small, .inventory-change small, .inventory-detail-grid small { display: block; color: #667085; }
.inventory-area-summary { border-left: 3px solid #138a83; padding: 12px 16px; background: #f3f9f8; margin-bottom: 16px; }
.inventory-area-summary p { margin-bottom: 4px; font-size: 12px; }
.inventory-change { display: flex; justify-content: space-between; align-items: start; gap: 16px; padding: 16px 0; border-top: 1px solid #e4e7ec; font-size: 13px; overflow-wrap: anywhere; }
.inventory-change > div:first-child { min-width: 0; flex: 1; }
.inventory-change p { margin: 8px 0; white-space: pre-wrap; }
.inventory-change .status-pill { white-space: normal; }
.inventory-tabs { display: flex; flex-wrap: wrap; gap: 6px 18px; border-bottom: 1px solid #e4e7ec; margin-bottom: 20px; }
.inventory-tab { background: transparent; border: 0; border-bottom: 2px solid transparent; padding: 10px 0; color: #667085; }
.inventory-tab.active { border-color: #138a83; color: #08756f; }
.inventory-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px; overflow-wrap: anywhere; }
.inventory-detail-grid strong { font-size: 14px; font-weight: 500; }
.inventory-before { display: grid; gap: 6px; padding: 14px; background: #f4f6f8; margin-bottom: 20px; font-size: 13px; }
.inventory-check { padding: 14px 0; border-top: 1px solid #e4e7ec; }
.inventory-photo { width: 180px; height: 140px; object-fit: contain; background: #f6f8fa; margin: 8px; }
.inventory-files { display: flex; flex-wrap: wrap; gap: 20px; }
.inventory-files a { display: flex; flex-direction: column; width: 200px; overflow-wrap: anywhere; }
#inventoryDetailBody .service-history p { white-space: pre-wrap; overflow-wrap: anywhere; }
@media(max-width:1100px) { .inventory-layout { grid-template-columns: 190px minmax(0,1fr); } .inventory-filters { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) { .inventory-layout { grid-template-columns: minmax(0,1fr); } .inventory-tree { border-right: 0; border-bottom: 1px solid #e4e7ec; max-height: 240px; overflow-y: auto; } .inventory-main { padding-left: 0; } .inventory-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .inventory-change { flex-direction: column; } }
@media(max-width:1000px) { .inventory-dashboard { grid-template-columns: repeat(2,minmax(0,1fr)); } .inventory-metric { border-bottom: 1px solid #e4e7ec; } }
@media(max-width:480px) { .inventory-metric { gap: 8px; padding: 12px; min-height: 90px; } .inventory-metric > i:last-child { display: none; } .inventory-metric strong { font-size: 24px; } .inventory-filters { grid-template-columns: minmax(0,1fr); } }