@font-face {
  font-family: "Euclid Circular A";
  src:
    url("../fonts/euclid/EuclidCircularA-Regular.woff2") format("woff2"),
    url("../fonts/euclid/EuclidCircularA-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Euclid Circular A";
  src:
    url("../fonts/euclid/EuclidCircularA-Semibold.woff2") format("woff2"),
    url("../fonts/euclid/EuclidCircularA-Semibold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #f4f5f9;
  --surface: #ffffff;
  --surface-soft: #f9fbfd;
  --text: #353550;
  --muted: #717b8c;
  --line: #e2edf3;
  --primary: #2496cf;
  --primary-dark: #006d95;
  --primary-soft: #ecf9ff;
  --green: #0fa477;
  --green-soft: #eafbf5;
  --amber: #e89f04;
  --amber-soft: #fff7e8;
  --cyan: #006d95;
  --cyan-soft: #ecf9ff;
  --red: #ef4444;
  --red-soft: #fff1f2;
  --blue: #2496cf;
  --blue-soft: #ecf9ff;
  --radius: 8px;
  --pill: 999px;
  --shadow: 0 10px 24px rgba(0, 109, 149, .08);
  --soft-shadow: 0 8px 18px rgba(0, 109, 149, .055);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: "Euclid Circular A", Euclid, "Euclid Flex", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
  font-size: 14px;
}
body.modal-open { overflow: hidden; }
body.is-page-loading {
  cursor: wait;
}
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }

.page-loading-overlay {
  position: fixed;
  inset: 128px 0 0;
  z-index: 9;
  padding: 28px;
  background: rgba(244, 245, 249, .96);
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease;
  overflow: hidden;
}
body.is-page-loading .page-loading-overlay {
  opacity: 1;
  pointer-events: none;
}
.page-loading-skeleton {
  width: 100%;
  max-width: 1480px;
  margin: 0 auto;
}
.skeleton-head {
  margin-bottom: 22px;
}
.skeleton-actions {
  position: absolute;
  top: 66px;
  right: max(28px, calc((100vw - 1480px) / 2 + 28px));
  display: flex;
  gap: 10px;
}
.skeleton-line,
.skeleton-pill,
.skeleton-panel,
.skeleton-stat-grid span,
.skeleton-table,
.skeleton-table-head,
.skeleton-table-row,
.skeleton-mini-grid span,
.skeleton-button-row {
  position: relative;
  overflow: hidden;
  background: #eaf1f6;
}
.skeleton-line::after,
.skeleton-pill::after,
.skeleton-panel::after,
.skeleton-stat-grid span::after,
.skeleton-table::after,
.skeleton-table-head::after,
.skeleton-table-row::after,
.skeleton-mini-grid span::after,
.skeleton-button-row::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.72), transparent);
  animation: skeleton-shimmer 1.15s ease-in-out infinite;
}
.skeleton-line {
  display: block;
  height: 13px;
  border-radius: var(--pill);
  margin-bottom: 12px;
}
.skeleton-eyebrow { width: 90px; height: 10px; }
.skeleton-title { width: min(260px, 62vw); height: 30px; }
.skeleton-text { width: min(520px, 74vw); }
.skeleton-heading { width: 160px; height: 18px; }
.skeleton-line-short { width: 62%; }
.skeleton-pill {
  width: 116px;
  height: 40px;
  display: inline-block;
  border-radius: var(--pill);
  background: #fff;
  border: 1px solid var(--line);
}
.skeleton-pill-primary { background: var(--primary-soft); }
.skeleton-pill-small {
  width: 108px;
  height: 28px;
  margin-bottom: 22px;
}
.skeleton-main-grid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}
.skeleton-panel {
  min-height: 300px;
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #f7fdff, #fff);
  box-shadow: var(--soft-shadow);
}
.skeleton-panel-large .skeleton-heading {
  width: min(300px, 70%);
  height: 26px;
  margin-bottom: 18px;
}
.skeleton-button-row {
  display: block;
  width: min(500px, 85%);
  height: 74px;
  border-radius: var(--pill);
  margin-top: 38px;
  background: #fff;
  border: 1px solid var(--line);
}
.skeleton-mini-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 22px;
}
.skeleton-mini-grid span {
  min-height: 112px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}
.skeleton-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 24px;
}
.skeleton-stat-grid span {
  min-height: 124px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}
.skeleton-table {
  min-height: 220px;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--soft-shadow);
}
.skeleton-table-head,
.skeleton-table-row {
  height: 44px;
  border-radius: 0;
  background: #f6f9fc;
  border-bottom: 1px solid var(--line);
}
.skeleton-table-row {
  height: 58px;
  background: #fff;
}
@keyframes skeleton-shimmer {
  100% { transform: translateX(100%); }
}
@media (prefers-reduced-motion: reduce) {
  .skeleton-line::after,
  .skeleton-pill::after,
  .skeleton-panel::after,
  .skeleton-stat-grid span::after,
  .skeleton-table::after,
  .skeleton-table-head::after,
  .skeleton-table-row::after,
  .skeleton-mini-grid span::after,
  .skeleton-button-row::after {
    animation-duration: 2s;
  }
}
body.auth-body .page-loading-overlay {
  inset: 0;
}

.auth-body {
  min-height: 100vh;
  background: var(--bg);
}
.login-screen {
  min-height: 100vh;
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(420px, 560px) minmax(360px, 430px);
  align-items: center;
  justify-content: center;
  gap: clamp(44px, 5vw, 84px);
  padding: clamp(36px, 6vw, 72px);
}
.login-copy {
  max-width: 560px;
}
.login-copy .brand.inline {
  min-width: 0;
}
.login-copy .brand span {
  display: block;
  color: var(--muted);
  margin-top: 2px;
  font-size: 12px;
}
.login-copy h1 {
  margin: 34px 0 16px;
  font-size: clamp(38px, 4vw, 46px);
  line-height: 1.08;
  letter-spacing: 0;
}
.login-copy p {
  max-width: 540px;
  margin: 0;
  color: #667085;
  font-size: 17px;
  line-height: 1.6;
}
.stat-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  max-width: 460px;
  margin-top: 28px;
}
.stat-row div {
  min-height: 82px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255,255,255,.78);
  box-shadow: var(--soft-shadow);
}
.stat-row strong,
.stat-row span {
  display: block;
}
.stat-row strong {
  font-size: 26px;
  line-height: 1;
  color: var(--primary-dark);
}
.stat-row span {
  margin-top: 9px;
  color: var(--muted);
  font-weight: 700;
}
.login-panel {
  background: rgba(255,255,255,.9);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 34px;
  box-shadow: var(--shadow);
}
.login-panel h2 { margin: 0 0 8px; font-size: 28px; }
.login-panel p { margin: 0 0 28px; color: var(--muted); }
.login-remember {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-self: start;
  width: max-content;
  min-height: 18px;
  margin-top: -2px;
  color: var(--text);
  cursor: pointer;
  line-height: 18px;
  user-select: none;
}
.login-remember input[type="checkbox"] {
  position: absolute;
  left: 0;
  top: 1px;
  width: 16px;
  height: 16px;
  margin: 0;
  opacity: 0;
}
.login-remember-check {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  border: 1.5px solid #b9cad8;
  border-radius: 4px;
  background: #fff;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.login-remember-check::after {
  content: "";
  width: 8px;
  height: 4px;
  margin-top: -1px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  opacity: 0;
  transform: rotate(-45deg) scale(.75);
  transition: opacity .14s ease, transform .14s ease;
}
.login-remember input[type="checkbox"]:checked + .login-remember-check {
  border-color: var(--primary);
  background: var(--primary);
  box-shadow: 0 5px 12px rgba(36,150,207,.18);
}
.login-remember input[type="checkbox"]:checked + .login-remember-check::after {
  opacity: 1;
  transform: rotate(-45deg) scale(1);
}
.login-remember input[type="checkbox"]:focus-visible + .login-remember-check {
  box-shadow: 0 0 0 4px rgba(36,150,207,.14);
}
.login-remember-text {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
  line-height: 18px;
}

.app-shell { min-height: 100vh; }
.topbar {
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 28px;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 10;
}
.topbar-inner {
  width: 100%;
  max-width: 1480px;
  display: flex;
  align-items: center;
  gap: 22px;
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 230px;
}
.brand-mark {
  width: 52px;
  height: 42px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--line);
  box-shadow: 0 10px 18px rgba(36,150,207,.20);
}
.brand-mark img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.brand strong, .top-user strong { display: block; font-weight: 700; }
.brand small, .top-user small { display: block; color: var(--muted); margin-top: 2px; font-size: 12px; }
.top-search {
  height: 44px;
  width: min(430px, 34vw);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: var(--surface-soft);
  color: #98a2b3;
}
.top-search input {
  min-height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.top-search input:focus { box-shadow: none; }
.search-icon { font-size: 20px; line-height: 1; }
.top-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 10px;
}
.notification-menu {
  position: relative;
  z-index: 43;
}
.notification-button {
  position: relative;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  color: var(--primary-dark);
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(0,109,149,.06);
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.notification-button:hover,
.notification-menu.open .notification-button {
  border-color: rgba(36,150,207,.32);
  background: var(--primary-soft);
  box-shadow: 0 12px 24px rgba(0,109,149,.12);
}
.notification-button svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.notification-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  display: grid;
  place-items: center;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}
.notification-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  display: none;
  width: min(380px, calc(100vw - 32px));
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 22px 46px rgba(0,109,149,.14);
}
.notification-menu.open .notification-dropdown { display: grid; gap: 8px; }
.notification-head {
  padding: 10px 12px 12px;
  border-bottom: 1px solid var(--line);
}
.notification-head strong,
.notification-empty strong,
.notification-item strong {
  display: block;
  color: var(--text);
  font-weight: 850;
}
.notification-head small,
.notification-empty small,
.notification-item small,
.notification-item em {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}
.notification-list {
  display: grid;
  gap: 4px;
  max-height: 360px;
  overflow: auto;
  padding-right: 2px;
}
.notification-item {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border-radius: 17px;
  color: var(--text);
}
.notification-item:hover {
  background: var(--primary-soft);
}
.notification-dot {
  width: 9px;
  height: 9px;
  margin-top: 5px;
  border-radius: 999px;
  background: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.notification-dot-manager { background: #f59e0b; box-shadow: 0 0 0 4px rgba(245,158,11,.14); }
.notification-dot-accounting { background: #10b981; box-shadow: 0 0 0 4px rgba(16,185,129,.14); }
.notification-dot-revision { background: #8b5cf6; box-shadow: 0 0 0 4px rgba(139,92,246,.14); }
.notification-dot-danger { background: #ef4444; box-shadow: 0 0 0 4px rgba(239,68,68,.14); }
.notification-dot-info { background: var(--primary); }
.notification-empty {
  padding: 18px 12px;
  border-radius: 17px;
  background: var(--surface-soft);
}
.notification-all-link {
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: 1px solid var(--line);
  color: var(--primary-dark);
  font-weight: 900;
}
.notification-all-link:hover {
  color: var(--primary);
}
.notifications-page-panel {
  padding: 10px;
}
.notifications-page-list {
  display: grid;
  gap: 8px;
}
.notification-page-item {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 16px;
  color: var(--text);
  background: #fff;
}
.notification-page-item:hover {
  border-color: rgba(36,150,207,.28);
  background: var(--primary-soft);
}
.notification-page-item strong {
  display: block;
  color: var(--text);
  font-weight: 850;
}
.notification-page-item small,
.notification-page-item em {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  font-style: normal;
}
.notifications-page-empty {
  margin: 8px;
}
.top-user-menu {
  position: relative;
  z-index: 42;
}
.top-user {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  border: 1px solid transparent;
  border-radius: var(--pill);
  padding: 5px 10px 5px 5px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.top-user:hover,
.top-user-menu.open .top-user {
  border-color: var(--line);
  background: #fff;
  box-shadow: 0 8px 18px rgba(0,109,149,.08);
}
.top-user-info { min-width: 0; }
.user-caret {
  width: 8px;
  height: 8px;
  margin-left: 2px;
  border-right: 2px solid #8b96aa;
  border-bottom: 2px solid #8b96aa;
  transform: rotate(45deg) translate(-1px, -2px);
  transition: transform .16s ease, border-color .16s ease;
}
.top-user-menu.open .user-caret {
  border-color: var(--primary-dark);
  transform: rotate(225deg) translate(-2px, -1px);
}
.user-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  display: none;
  width: 286px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 22px 46px rgba(0,109,149,.14);
}
.top-user-menu.open .user-dropdown { display: grid; gap: 6px; }
.user-dropdown-head {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 10px 12px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 4px;
}
.user-dropdown-head strong,
.user-dropdown-head small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.user-dropdown-head small { color: var(--muted); margin-top: 3px; }
.user-menu-item {
  display: grid;
  gap: 3px;
  padding: 11px 12px;
  border-radius: 16px;
  color: #4c586a;
}
.user-menu-item span {
  color: var(--text);
  font-weight: 800;
}
.user-menu-item small {
  color: var(--muted);
  font-size: 12px;
}
.user-menu-item:hover {
  background: var(--primary-soft);
}
.user-menu-item.disabled {
  pointer-events: none;
  opacity: .48;
}
.user-menu-item.danger span { color: #b42318; }
.user-menu-item.danger:hover {
  background: #fff1f1;
}
.avatar {
  width: 40px;
  height: 40px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, var(--primary-dark), var(--primary));
  font-weight: 700;
}
.avatar.small { width: 36px; height: 36px; font-size: 12px; }
.nav-strip {
  background: #fff;
  border-bottom: 1px solid var(--line);
}
.nav-inner {
  max-width: 1480px;
  margin: 0 auto;
  padding: 8px 28px;
  display: flex;
  align-items: center;
  gap: 6px;
  overflow-x: auto;
}
.nav-inner.manager-nav-inner {
  overflow: visible;
  flex-wrap: wrap;
  row-gap: 8px;
}
.nav-inner a,
.nav-group summary {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  border-radius: var(--pill);
  padding: 9px 15px;
  color: #5f6b7c;
  font-weight: 700;
}
.nav-inner a:hover,
.nav-group summary:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.nav-inner a.active,
.nav-group.active summary,
.nav-group[open] summary {
  color: var(--primary-dark);
  background: var(--primary-soft);
}
.nav-group {
  position: relative;
}
.nav-group summary {
  gap: 8px;
  cursor: pointer;
  list-style: none;
}
.nav-group summary::-webkit-details-marker {
  display: none;
}
.nav-caret {
  width: 7px;
  height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-1px, -2px);
  transition: transform .16s ease;
}
.nav-group[open] .nav-caret {
  transform: rotate(225deg) translate(-2px, -1px);
}
.nav-group-menu {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 40;
  width: max-content;
  min-width: 190px;
  display: grid;
  gap: 4px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 36px rgba(17,24,39,.12);
}
.nav-group-menu a {
  width: 100%;
  justify-content: flex-start;
  border-radius: 14px;
  padding-inline: 12px;
}
.nav-spacer {
  flex: 1 1 auto;
  min-width: 18px;
}
.nav-inner a.nav-utility-link {
  --nav-utility-bg: linear-gradient(135deg, #0f766e, #14b8a6);
  --nav-utility-hover-bg: linear-gradient(135deg, #0d9488, #22d3ee);
  flex: 0 0 auto;
  gap: 9px;
  min-height: 42px;
  padding: 7px 16px 7px 9px;
  border: 0;
  background: var(--nav-utility-bg);
  color: #fff;
  box-shadow: 0 12px 22px rgba(15,23,42,.10);
  transition: background .16s ease, transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
.nav-inner a.nav-utility-link:hover,
.nav-inner a.nav-utility-link.active {
  background: var(--nav-utility-hover-bg);
  color: #fff !important;
  filter: saturate(1.08);
  transform: translateY(-1px);
  box-shadow: 0 15px 28px rgba(15,23,42,.14);
}
.nav-utility-forms {
  --nav-utility-bg: linear-gradient(135deg, #0f766e, #14b8a6);
  --nav-utility-hover-bg: linear-gradient(135deg, #0d9488, #22d3ee);
}
.nav-utility-tools {
  --nav-utility-bg: linear-gradient(135deg, #2563eb, #0ea5e9);
  --nav-utility-hover-bg: linear-gradient(135deg, #1d4ed8, #0284c7);
}
.nav-utility-icon {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 28px;
  border-radius: 50%;
  background: rgba(255,255,255,.20);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.nav-utility-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.logout-link {
  margin-left: auto;
  color: #b42318 !important;
  background: #fff1f1;
  border: 1px solid #ffd6d6;
  box-shadow: 0 6px 14px rgba(180,35,24,.06);
}
.logout-link:hover {
  color: #fff !important;
  background: #ef4444 !important;
  border-color: #ef4444;
}
.payment-sent-pill {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  border: 1px solid #bfdbfe;
  border-radius: var(--pill);
  background: #edf5ff;
  color: #1d4ed8;
  padding: 9px 15px;
  font-weight: 900;
}
.content {
  max-width: 1480px;
  margin: 0 auto;
  padding: 28px;
}
.page-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
}
.page-head h1 { margin: 4px 0 6px; font-size: 28px; letter-spacing: 0; }
.page-head p { margin: 0; color: var(--muted); }
.eyebrow {
  color: var(--primary);
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0;
}
.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(420px, .95fr);
  gap: 18px;
  margin-bottom: 18px;
}
.welcome-card, .overview-card, .panel, .stat-card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--soft-shadow);
}
.welcome-card {
  padding: 28px;
  background: linear-gradient(180deg, #ffffff 0%, #ecf9ff 100%);
}
.welcome-card h2 { margin: 14px 0 8px; font-size: 28px; letter-spacing: 0; }
.welcome-card p { color: #667085; line-height: 1.7; max-width: 760px; }
.welcome-actions, .actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.surgical-row-actions form { margin: 0; }
.activity-card {
  margin-top: 20px;
  padding: 16px;
  background: rgba(255,255,255,.82);
  border: 1px solid var(--line);
  border-radius: var(--pill);
}
.activity-card strong, .activity-card span { display: block; }
.activity-card span { color: var(--muted); margin-top: 5px; }
.online-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 30px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: #fff;
  padding: 6px 11px;
  color: #475467;
  font-weight: 700;
  font-size: 12px;
}
.online-pill::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 4px rgba(16,185,129,.10);
}
.overview-card { padding: 18px; }
.overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.overview-grid div {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  background: #fff;
}
.overview-grid span, .stat-card span { display: block; color: var(--muted); font-weight: 700; }
.overview-grid strong { display: block; font-size: 26px; margin-top: 8px; }
.overview-grid small, .stat-card small { display: block; color: var(--muted); margin-top: 5px; }
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.stat-card { position: relative; overflow: hidden; padding: 20px; }
.stat-card::before {
  content: "";
  position: absolute;
  left: 0;
  inset-block: 0;
  width: 3px;
  background: var(--primary);
}
.stat-card strong { display: block; margin-top: 8px; font-size: 30px; }
.quick-access-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}
.quick-access-card {
  position: relative;
  min-height: 118px;
  display: grid;
  align-content: center;
  grid-template-columns: 42px minmax(0, 1fr);
  column-gap: 14px;
  padding: 18px 20px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  box-shadow: var(--soft-shadow);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.quick-access-card::before {
  content: "";
  position: absolute;
  left: 0;
  inset-block: 0;
  width: 3px;
  background: var(--quick-access-color, var(--primary));
}
.quick-access-card:hover,
.quick-access-card:focus-visible {
  border-color: var(--quick-access-color, var(--primary));
  box-shadow: 0 14px 28px rgba(15,23,42,.10);
  transform: translateY(-2px);
}
.quick-access-icon {
  grid-row: 1 / span 2;
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #eef8fc;
  color: var(--quick-access-color, var(--primary));
}
.quick-access-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.quick-access-card strong {
  display: block;
  min-width: 0;
  color: var(--text);
  font-size: 16px;
  line-height: 1.2;
}
.quick-access-card small {
  display: block;
  min-width: 0;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.quick-access-daily { --quick-access-color: var(--primary); }
.quick-access-transfer { --quick-access-color: #0f766e; }
.quick-access-jobs { --quick-access-color: #f59e0b; }
.quick-access-surgical { --quick-access-color: #7c3aed; }
.accent-green::before { background: var(--green); }
.accent-amber::before { background: var(--amber); }
.accent-cyan::before { background: var(--cyan); }
.accent-purple::before { background: var(--primary); }
.panel { overflow: visible; margin-bottom: 22px; }
.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}
.panel-head.no-border { border-bottom: 0; padding: 0 0 14px; }
.panel-head h2 { margin: 0 0 4px; font-size: 17px; }
.panel-head p { margin: 0; color: var(--muted); font-size: 13px; }
.empty-state-panel {
  padding: 28px;
}
.empty-state {
  display: grid;
  gap: 8px;
  max-width: 560px;
}
.empty-state strong {
  color: var(--text);
  font-size: 20px;
}
.empty-state span {
  color: var(--muted);
  line-height: 1.55;
}
.summary-period-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: var(--surface-soft);
}
.summary-period-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  min-width: 68px;
  padding: 7px 12px;
  border-radius: var(--pill);
  color: #667085;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  transition: background .16s ease, color .16s ease, box-shadow .16s ease;
}
.summary-period-btn:hover {
  background: #fff;
  color: var(--text);
}
.summary-period-btn.active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 16px rgba(36,150,207,.18);
}
.overview-card.is-summary-loading .overview-grid {
  opacity: .55;
  transition: opacity .16s ease;
}
.overview-card.is-summary-loading .summary-period-btn {
  pointer-events: none;
}
.accounting-dashboard-head .actions {
  justify-content: flex-end;
}
.accounting-branch-switcher {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding: 0 0 12px;
  margin: -6px 0 16px;
  scrollbar-width: thin;
}
.accounting-branch-chip {
  flex: 0 0 auto;
  min-width: 150px;
  display: grid;
  gap: 3px;
  padding: 12px 15px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
}
.accounting-branch-chip:hover,
.accounting-branch-chip:focus-visible,
.accounting-branch-chip.active {
  border-color: #9bdcf5;
  background: #eefaff;
}
.accounting-branch-chip strong {
  font-size: 13px;
}
.accounting-branch-chip span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.daily-accounting-branch-switcher {
  margin-top: -4px;
}
[data-accounting-daily-data-view].is-accounting-daily-data-loading {
  opacity: .68;
  pointer-events: none;
}
.accounting-stat-grid .stat-card strong {
  font-size: 28px;
  line-height: 1.15;
}
.accounting-report-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, .85fr);
  gap: 18px;
  margin-bottom: 22px;
}
.accounting-report-panel {
  padding: 18px 20px 20px;
}
.accounting-report-panel .panel-head.no-border {
  padding-bottom: 16px;
  background: transparent;
}
.accounting-chart-bars {
  display: grid;
  gap: 2px;
}
.accounting-bar-row {
  display: grid;
  grid-template-columns: 96px minmax(180px, 1fr) 150px;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
  border-top: 1px solid #eef2f7;
}
.accounting-bar-row:first-child {
  border-top: 0;
}
.accounting-bar-date {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.accounting-bar-stack {
  display: grid;
  gap: 5px;
}
.accounting-bar-track,
.stock-flow-track {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 7px;
  border-radius: var(--pill);
  background: #edf3f8;
}
.accounting-bar-fill,
.stock-flow-fill {
  display: block;
  height: 100%;
  min-width: 0;
  border-radius: inherit;
}
.accounting-bar-fill.total {
  background: var(--primary);
}
.accounting-bar-fill.expense,
.stock-flow-fill.out {
  background: var(--amber);
}
.accounting-bar-fill.net,
.stock-flow-fill.in {
  background: var(--green);
}
.accounting-bar-fill.net.negative {
  background: #ef4444;
}
.accounting-bar-values {
  display: grid;
  gap: 2px;
  text-align: right;
  white-space: nowrap;
}
.accounting-bar-values strong {
  color: var(--text);
  font-size: 12px;
}
.accounting-bar-values span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}
.accounting-chart-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.accounting-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.accounting-chart-legend i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
.legend-total { background: var(--primary); }
.legend-expense { background: var(--amber); }
.legend-net { background: var(--green); }
.stock-flow-summary {
  display: grid;
  gap: 18px;
  padding-top: 4px;
}
.stock-flow-row {
  display: grid;
  gap: 10px;
}
.stock-flow-row > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.stock-flow-row strong {
  color: var(--text);
}
.stock-flow-row span {
  color: var(--muted);
  font-weight: 800;
}
.accounting-mini-note {
  display: grid;
  gap: 5px;
  margin-top: 24px;
  padding: 14px 16px;
  border-left: 3px solid var(--primary);
  border-radius: 8px;
  background: #f8fbff;
}
.accounting-mini-note strong {
  color: var(--text);
}
.accounting-mini-note span {
  color: var(--muted);
  line-height: 1.5;
}
.accounting-submission-list {
  display: grid;
  gap: 10px;
}
.accounting-submission-section {
  display: grid;
  gap: 10px;
}
.accounting-submission-section + .accounting-submission-section {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid #eef2f7;
}
.accounting-submission-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
  font-size: 12px;
  font-weight: 900;
}
.accounting-submission-section-title span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.accounting-submission-section .accounting-mini-note {
  margin-top: 0;
}
.accounting-submission-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
}
.accounting-submission-icon {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #eef8fc;
  color: var(--primary);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
}
.accounting-submission-transfer .accounting-submission-icon {
  background: #eafaf7;
  color: #0f766e;
}
.accounting-submission-cargo .accounting-submission-icon {
  background: #fff7ed;
  color: #d97706;
}
.accounting-submission-item div strong,
.accounting-submission-item div span {
  display: block;
}
.accounting-submission-item strong {
  font-size: 13px;
}
.accounting-submission-item div span,
.accounting-submission-item small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.accounting-report-table th,
.accounting-report-table td {
  white-space: nowrap;
  font-size: 12px;
}
.accounting-report-table td:last-child {
  white-space: normal;
  min-width: 180px;
}
.table-wrap { width: 100%; overflow: visible; }
.treatment-total-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: -2px;
  margin-bottom: 22px;
  padding: 22px 24px;
  border: 1px solid #cfeaf5;
  border-radius: var(--radius);
  background: linear-gradient(135deg, #ffffff 0%, #ecf9ff 100%);
  box-shadow: var(--soft-shadow);
}
.treatment-total-panel h2 {
  margin: 4px 0 6px;
  font-size: 22px;
  letter-spacing: 0;
}
.treatment-total-panel p {
  margin: 0;
  color: var(--muted);
}
.treatment-total-value {
  min-width: 240px;
  padding: 16px 18px;
  border: 1px solid #cfeaf5;
  border-radius: 20px;
  background: #fff;
  text-align: right;
  box-shadow: 0 10px 22px rgba(0,109,149,.07);
}
.treatment-total-values {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 12px;
}
.treatment-total-value span {
  display: block;
  color: var(--muted);
  font-weight: 800;
  font-size: 12px;
}
.treatment-total-value strong {
  display: block;
  margin-top: 7px;
  color: var(--primary-dark);
  font-size: 28px;
  line-height: 1.1;
}
table { width: 100%; border-collapse: collapse; background: #fff; }
th, td {
  text-align: left;
  padding: 15px 16px;
  border-bottom: 1px solid #eef2f7;
  vertical-align: middle;
}
th {
  background: #fbfcff;
  color: #98a2b3;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
}
tbody tr:hover { background: #fbfaff; }
tr:last-child td { border-bottom: 0; }
.package-lab-detail-panel .panel-head {
  background: #fff;
}
.package-lab-title-pill {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border: 1px solid var(--lab-border, #cfeaf5);
  border-radius: var(--pill);
  background: var(--lab-bg, var(--primary-soft));
  color: var(--lab-text, var(--primary-dark));
  padding: 7px 14px;
  font-size: 17px;
  line-height: 1.2;
}
.package-lab-total-row td {
  background: var(--lab-bg, #f8fbff);
  border-top: 1px solid var(--lab-border, #dce8f1);
  border-bottom: 0;
  color: var(--text);
  font-weight: 900;
}
.package-lab-total-row td:first-child {
  color: var(--lab-text, var(--primary-dark));
}
.technician-row td:first-child {
  border-left: 4px solid transparent;
}
.technician-tone-0 td { background: #f2fbff; }
.technician-tone-1 td { background: #f4fff8; }
.technician-tone-2 td { background: #fff9f0; }
.technician-tone-3 td { background: #f7f3ff; }
.technician-tone-4 td { background: #fff5f7; }
.technician-tone-5 td { background: #f4f8ff; }
.technician-tone-0 td:first-child { border-left-color: #219bd4; }
.technician-tone-1 td:first-child { border-left-color: #12b886; }
.technician-tone-2 td:first-child { border-left-color: #f5a524; }
.technician-tone-3 td:first-child { border-left-color: #8067dc; }
.technician-tone-4 td:first-child { border-left-color: #e25575; }
.technician-tone-5 td:first-child { border-left-color: #4b83db; }
.package-lab-detail-panel .technician-row td:first-child {
  border-left-color: var(--lab-stripe, #219bd4);
}
.technician-row:hover td {
  filter: brightness(.985);
}
.technician-row td {
  transition: background-color .22s ease, opacity .22s ease, transform .22s ease;
}
.technician-row.inline-action-done td {
  background: #ecfdf5;
}
.technician-row.inline-action-removing td {
  opacity: 0;
  transform: translateX(14px);
}
.inline-action-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 10px;
  padding: 6px 10px 6px 7px;
  border-radius: 999px;
  background: #dcfce7;
  color: #047857;
  font-size: 12px;
  font-weight: 800;
  animation: inline-check-pop .28s ease-out both;
  vertical-align: middle;
}
.inline-action-check span {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #10b981;
  color: #fff;
  line-height: 1;
}
.inline-action-check strong {
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.inline-action-check.is-leaving {
  animation: inline-check-out .24s ease-in both;
}
.is-inline-pending {
  opacity: .62;
  pointer-events: none;
}
.manager-approval-closed-panel {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 22px;
  padding: 18px 22px;
  border-color: #fed7aa;
  border-left: 4px solid #f97316;
  background: #fff7ed;
  box-shadow: 0 14px 30px rgba(249, 115, 22, .08);
}
.manager-approval-closed-panel h2 {
  margin: 4px 0 6px;
  font-size: 18px;
  letter-spacing: 0;
}
.manager-approval-closed-panel p {
  margin: 0;
  color: #9a4b14;
}
.package-deadline-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  padding: 18px 22px;
  border-left: 4px solid #f59e0b;
}
.package-deadline-panel h2 {
  margin: 4px 0 6px;
  font-size: 18px;
  letter-spacing: 0;
}
.package-deadline-panel p {
  margin: 0;
  color: var(--muted);
}
.package-deadline-panel-closed {
  background: #fff7ed;
  border-color: #fed7aa;
  border-left-color: #f97316;
}
.package-deadline-panel-ok {
  background: #ecfdf5;
  border-color: #bbf7d0;
  border-left-color: #10b981;
}
.package-deadline-requests-panel {
  margin-bottom: 22px;
}
.deadline-request-list {
  display: grid;
  gap: 10px;
}
.deadline-request-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfd;
}
.deadline-request-card strong,
.deadline-request-card span {
  display: block;
}
.deadline-request-card span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}
@keyframes inline-check-pop {
  from { opacity: 0; transform: scale(.82) translateY(4px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes inline-check-out {
  to { opacity: 0; transform: translateY(-4px); }
}
.technician-pill {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #d8e8f1;
  background: #fff;
  color: var(--text);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.technician-pill-tone-0 { border-color: #a9ddf1; color: #077cad; background: #eefaff; }
.technician-pill-tone-1 { border-color: #a9e8ce; color: #087956; background: #effdf6; }
.technician-pill-tone-2 { border-color: #f5d6a2; color: #9a6105; background: #fff8eb; }
.technician-pill-tone-3 { border-color: #d3c8ff; color: #5a43b9; background: #f5f1ff; }
.technician-pill-tone-4 { border-color: #f2becb; color: #b52d52; background: #fff2f5; }
.technician-pill-tone-5 { border-color: #bed3f5; color: #3266b7; background: #f1f6ff; }
.row-note {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.approval-closed-note {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin-top: 0;
  padding: 6px 10px;
  border-radius: var(--pill);
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
}
.package-important-notes {
  border-left: 4px solid #f59e0b;
}
.package-important-notes .panel-head {
  margin-bottom: 14px;
}
.important-note-list {
  display: grid;
  gap: 0;
  padding: 0 20px 18px;
}
.important-note-row {
  display: grid;
  grid-template-columns: minmax(220px, .9fr) minmax(0, 1.4fr);
  gap: 16px;
  align-items: start;
  padding: 14px 0;
  border-top: 1px solid var(--line);
}
.important-note-row:first-child {
  padding-top: 0;
  border-top: 0;
}
.important-note-row:last-child {
  padding-bottom: 0;
}
.important-note-meta {
  display: grid;
  gap: 4px;
}
.important-note-meta span {
  color: #c2410c;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.important-note-meta strong {
  color: var(--text);
  font-size: 14px;
}
.important-note-meta small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.35;
}
.important-note-row p {
  margin: 0;
  color: #344054;
  line-height: 1.55;
}
.technician-performance-panel {
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(0, 1.4fr);
  align-items: center;
  gap: 18px;
  padding: 20px;
}
.technician-performance-copy h2 {
  margin: 0 0 6px;
  font-size: 18px;
}
.technician-performance-copy p {
  margin: 0;
  color: var(--muted);
}
.performance-breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  max-width: none;
}
.performance-breakdown-panel {
  display: flex;
  justify-content: flex-end;
}
.performance-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 7px 11px;
  border: 1px solid #d8e8f1;
  border-radius: 999px;
  background: #f7fcff;
  color: #334155;
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.performance-chip strong {
  color: var(--primary-dark);
  font-size: 14px;
}
.technician-period-filter {
  margin-bottom: 16px;
}
.technician-detail-filter { align-items: end; }
.job-entry-table {
  table-layout: fixed;
}
.job-entry-table th:nth-child(1),
.job-entry-table td:nth-child(1) { width: 20%; }
.job-entry-table th:nth-child(2),
.job-entry-table td:nth-child(2) { width: 14%; }
.job-entry-table th:nth-child(3),
.job-entry-table td:nth-child(3) { width: 24%; }
.job-entry-table th:nth-child(4),
.job-entry-table td:nth-child(4) { width: 15%; }
.job-entry-table th:nth-child(5),
.job-entry-table td:nth-child(5) { width: 72px; }
.job-entry-table th:nth-child(6),
.job-entry-table td:nth-child(6) { width: 11%; }
.job-entry-table th:nth-child(7),
.job-entry-table td:nth-child(7) { width: 58px; }
.job-entry-table td:nth-child(5) input {
  min-width: 0;
  text-align: center;
  padding-inline: 8px;
}
.surgical-entry-table th:nth-child(1),
.surgical-entry-table td:nth-child(1) { width: 11%; }
.surgical-entry-table th:nth-child(2),
.surgical-entry-table td:nth-child(2) { width: 15%; }
.surgical-entry-table th:nth-child(3),
.surgical-entry-table td:nth-child(3) { width: 16%; }
.surgical-entry-table th:nth-child(4),
.surgical-entry-table td:nth-child(4) { width: 12%; }
.surgical-entry-table th:nth-child(5),
.surgical-entry-table td:nth-child(5) { width: 13%; }
.surgical-entry-table th:nth-child(6),
.surgical-entry-table td:nth-child(6) { width: 10%; }
.surgical-entry-table th:nth-child(7),
.surgical-entry-table td:nth-child(7) { width: 5%; }
.surgical-entry-table th:nth-child(8),
.surgical-entry-table td:nth-child(8) { width: 11%; }
.surgical-entry-table th:nth-child(9),
.surgical-entry-table td:nth-child(9) { width: 52px; }
.surgical-entry-table th,
.surgical-entry-table td {
  padding-inline: 12px;
}
.surgical-entry-table td:nth-child(7) {
  text-align: center;
}
.surgical-entry-table td:nth-child(5) input {
  text-align: left;
}
.surgical-entry-table .tooth-select-trigger,
.surgical-entry-table .custom-select-trigger {
  min-height: 40px;
  height: 40px;
  padding-inline: 12px;
  font-size: 13px;
}
.surgical-entry-table .custom-select-value {
  height: 38px;
  line-height: 38px;
}
.surgical-entry-table .surgical-selection-trigger {
  min-width: 96px;
}
.surgical-entry-table .surgical-material-trigger {
  min-width: 150px;
}
.selection-count-pill {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #cfeaf5;
  border-radius: var(--pill);
  background: var(--primary-soft);
  color: var(--primary-dark);
  padding: 7px 11px;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.selection-count-pill.form-count {
  width: 100%;
  min-height: 42px;
}
.guide-check {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 30px;
  min-height: 30px;
  cursor: pointer;
  margin-bottom: 0;
  vertical-align: middle;
}
.guide-check input {
  position: absolute;
  width: 1px;
  height: 1px;
  min-height: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}
.guide-check > span,
.guide-status {
  position: relative;
  display: inline-block;
  width: 24px;
  height: 24px;
  margin-bottom: 0;
  border: 1px solid #d9e6f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(31, 60, 88, .05);
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.guide-check > span::after,
.guide-status::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 4px;
  width: 5px;
  height: 10px;
  border: solid var(--primary);
  border-width: 0 2px 2px 0;
  opacity: 0;
  transform: rotate(45deg) scale(.75);
  transition: opacity .16s ease, transform .16s ease;
}
.guide-check:hover > span {
  border-color: #b9ddec;
  background: #fbfdff;
}
.guide-check input:checked + span,
.guide-status.is-on {
  border-color: #a9dceb;
  background: var(--primary-soft);
}
.guide-check input:checked + span::after,
.guide-status.is-on::after {
  opacity: 1;
  transform: rotate(45deg) scale(1);
}
.guide-check input:focus-visible + span {
  box-shadow: 0 0 0 4px rgba(36,150,207,.14), 0 4px 12px rgba(31, 60, 88, .05);
}
.guide-check-field {
  justify-self: start;
}
.guide-field > .guide-check {
  margin-bottom: 0;
}
.table-link { color: var(--primary); font-weight: 900; }
.empty { text-align: center; color: var(--muted); padding: 34px; }
.rate-summary {
  margin-top: 8px;
  color: #667085;
  font-size: 13px;
  font-weight: 700;
}
.form-stack { display: grid; gap: 16px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.form-grid.technician-detail-filter { grid-template-columns: minmax(190px, 1fr) minmax(220px, 1.4fr) auto; }
.preference-box {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #f8fcff;
}
.checkbox-line {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--text);
  font-weight: 800;
}
.checkbox-line input {
  width: 18px;
  height: 18px;
  min-height: 18px;
  accent-color: var(--primary);
}
.daily-month-panel {
  overflow: hidden;
}
.daily-branch-panel {
  overflow: hidden;
}
.daily-branch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.daily-branch-card {
  position: relative;
  display: grid;
  gap: 10px;
  min-height: 150px;
  padding: 18px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.cargo-branch-panel,
.cargo-list-panel {
  overflow: hidden;
}
.cargo-page {
  display: flex;
  flex-direction: column;
}
.cargo-page .page-head {
  order: 1;
}
.cargo-page .cargo-branch-panel {
  order: 2;
  margin-bottom: 18px;
}
.cargo-page > .stat-grid {
  order: 3;
}
.cargo-page .cargo-list-panel {
  order: 4;
}
.cargo-page.is-cargo-branch-loading {
  opacity: .72;
  pointer-events: none;
}
.cargo-page .cargo-branch-panel .panel-head {
  padding: 14px 16px 10px;
}
.cargo-page .cargo-branch-panel .panel-head h2 {
  font-size: 17px;
}
.cargo-page .cargo-branch-panel .panel-head p {
  font-size: 13px;
}
.cargo-branch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 10px;
  padding: 12px 16px 14px;
  border-top: 1px solid var(--line);
}
.cargo-branch-card {
  display: grid;
  gap: 4px;
  min-height: 68px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--primary);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
  box-shadow: 0 8px 18px rgba(18, 45, 73, .04);
}
.cargo-branch-card.active {
  border-color: #8dd7f4;
  background: #eefaff;
}
.cargo-branch-card strong {
  color: var(--primary-dark);
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cargo-branch-card span,
.cargo-branch-card small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  line-height: 1.25;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cargo-shipment-list {
  display: grid;
  gap: 12px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.cargo-shipment-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.cargo-shipment-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.cargo-shipment-head span,
.cargo-shipment-head small,
.cargo-item-row small,
.cargo-dashboard-item span,
.cargo-dashboard-item small {
  color: var(--muted);
  font-weight: 800;
}
.cargo-shipment-head strong {
  display: block;
  margin-top: 4px;
  color: var(--text);
  font-size: 18px;
}
.cargo-item-list {
  display: grid;
  gap: 8px;
}
.cargo-item-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(180px, 1fr) minmax(180px, 1.2fr);
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid #dcebf3;
  border-radius: 8px;
  background: #f8fcff;
}
.cargo-items-editor {
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
}
.cargo-items-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: #f8fcff;
}
.cargo-items-editor-head h2 {
  margin: 0;
  font-size: 18px;
}
.cargo-items-editor-head p {
  margin: 4px 0 0;
  color: var(--muted);
}
.cargo-item-editor-list {
  display: grid;
  gap: 10px;
  padding: 14px;
}
.cargo-item-editor-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(220px, 1.1fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid #dcebf3;
  border-radius: 8px;
  background: #fff;
}
.cargo-dashboard-list {
  display: grid;
  gap: 10px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.cargo-dashboard-item {
  display: grid;
  grid-template-columns: 120px minmax(180px, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  text-decoration: none;
}
.cargo-dashboard-item strong {
  color: var(--primary-dark);
}
@media (max-width: 760px) {
  .cargo-shipment-head,
  .cargo-items-editor-head {
    align-items: stretch;
    flex-direction: column;
  }
  .cargo-item-row,
  .cargo-item-editor-row,
  .cargo-dashboard-item {
    grid-template-columns: 1fr;
  }
  .cargo-item-editor-row .btn {
    width: 100%;
  }
}
.daily-branch-card::before {
  content: "";
  position: absolute;
  left: 0;
  inset-block: 0;
  width: 3px;
  background: var(--primary);
}
.daily-branch-card:hover,
.daily-branch-card:focus-visible,
.daily-branch-card.active {
  border-color: #9bdcf5;
  box-shadow: 0 14px 26px rgba(15,23,42,.08);
  transform: translateY(-1px);
}
.daily-branch-card > span {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.daily-branch-card strong {
  color: var(--primary-dark);
  font-size: 16px;
}
.daily-branch-card b {
  color: var(--text);
  font-size: 26px;
  line-height: 1.1;
}
.daily-branch-card em,
.daily-branch-card small {
  color: var(--muted);
  font-style: normal;
  font-weight: 800;
}
.daily-branch-card div {
  display: grid;
  gap: 4px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.daily-branch-card-simple {
  min-height: 86px;
  align-content: center;
}
.daily-branch-card-simple > span {
  align-items: center;
}
.daily-month-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 12px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.daily-month-card {
  min-height: 150px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 8px 18px rgba(17,24,39,.04);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.daily-month-card:hover {
  transform: translateY(-1px);
  border-color: #b9ddec;
  box-shadow: 0 14px 26px rgba(36,150,207,.10);
}
.daily-month-card span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--primary-dark);
  font-size: 16px;
  font-weight: 900;
}
.daily-month-card span b {
  border-radius: var(--pill);
  background: #dcfce7;
  color: #047857;
  padding: 4px 8px;
  font-size: 11px;
}
.daily-month-card strong {
  color: var(--text);
  font-size: 26px;
  line-height: 1.1;
}
.daily-month-card small,
.daily-month-card em {
  color: var(--muted);
  font-style: normal;
  font-weight: 800;
}
.daily-month-card div {
  display: grid;
  gap: 5px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.daily-month-empty {
  grid-column: 1 / -1;
  padding: 34px;
  border: 1px dashed #d8e9f1;
  border-radius: var(--radius);
  background: #f8fcff;
  color: var(--muted);
  text-align: center;
  font-weight: 800;
}
.daily-record-panel {
  overflow: hidden;
}
.daily-record-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.daily-record-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
}
.daily-record-card header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.daily-record-card header div:first-child {
  display: grid;
  gap: 4px;
}
.daily-record-date {
  width: fit-content;
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 6px;
  padding: 6px 9px;
  border: 1px solid #bfe4f4;
  border-radius: 8px;
  background: #eefaff;
  color: var(--primary-dark);
}
.daily-record-date b {
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}
.daily-record-card .daily-record-date small {
  color: var(--primary-dark);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
.transfer-batch-card .daily-record-date small {
  color: var(--primary-dark);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
.daily-record-card header span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.daily-record-card header strong {
  min-width: 0;
  color: var(--primary-dark);
  font-size: 16px;
  line-height: 1.25;
}
.daily-record-card header small {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}
.daily-record-balance {
  min-width: 120px;
  padding: 10px 12px;
  border: 1px solid #dff4eb;
  border-radius: 8px;
  background: #effdf6;
  text-align: right;
}
.daily-record-balance small {
  display: block;
  color: #047857;
  font-size: 11px;
  font-weight: 900;
}
.daily-record-balance b {
  display: block;
  color: var(--text);
  font-size: 17px;
  line-height: 1.25;
  white-space: nowrap;
}
.daily-record-main {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.daily-record-main span {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fcff;
}
.daily-record-main small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  margin-bottom: 4px;
}
.daily-record-main strong {
  display: block;
  color: var(--text);
  font-size: 15px;
  line-height: 1.2;
  white-space: nowrap;
}
.daily-record-breakdown {
  display: grid;
  gap: 7px;
}
.daily-record-breakdown span {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.daily-record-breakdown strong {
  color: var(--text);
  white-space: nowrap;
}
.daily-record-card footer {
  display: flex;
  justify-content: flex-start;
  padding-top: 2px;
}
.daily-record-expense-button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #d8e6ee;
  border-radius: var(--pill);
  background: #f8fcff;
  color: var(--primary-dark);
  padding: 8px 12px;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
}
.daily-record-expense-button .daily-expense-detail-icon,
.daily-record-expense-button .daily-expense-detail-icon::before,
.daily-record-expense-button .daily-expense-detail-icon::after {
  width: 14px;
}
.daily-record-expense-button em {
  color: var(--muted);
  font-style: normal;
  font-weight: 800;
}
.daily-record-no-expense {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.daily-close-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px;
  margin-bottom: 16px;
}
.daily-close-panel h2 {
  margin: 4px 0 6px;
  font-size: 20px;
}
.daily-close-panel p {
  margin: 0;
  color: var(--muted);
}
.daily-close-summary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.daily-close-summary span:not(.daily-close-badge):not(.daily-close-note) {
  min-width: 150px;
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #f8fcff;
}
.daily-close-summary small {
  color: var(--muted);
  font-weight: 800;
}
.daily-close-summary strong {
  color: var(--primary-dark);
  font-size: 18px;
}
.daily-close-badge,
.daily-close-note {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  border-radius: var(--pill);
  padding: 8px 12px;
  font-weight: 900;
}
.daily-close-badge {
  background: #dcfce7;
  color: #047857;
}
.daily-close-note {
  background: #fff7e8;
  color: #b45309;
}
.daily-ledger-panel {
  padding: 0;
  overflow: hidden;
}
.daily-ledger-board {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
  border-top: 1px solid var(--line);
}
.daily-ledger-column {
  min-width: 0;
}
.daily-ledger-expenses {
  border-right: 1px solid var(--line);
}
.daily-ledger-title {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--line);
  background: #f8fcff;
  color: var(--primary-dark);
  font-weight: 900;
}
.daily-ledger-title > span {
  min-width: 0;
}
.daily-ledger-title .btn {
  flex: 0 0 auto;
}
.daily-expense-rows {
  display: grid;
}
.daily-expense-row {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(130px, 180px) 74px;
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}
.daily-expense-row input {
  min-width: 0;
  min-height: 40px;
}
.daily-money-field {
  min-width: 0;
  min-height: 40px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 6px;
  padding: 0 12px 0 0;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
}
.daily-money-field:focus-within {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.daily-money-field input {
  min-height: 38px;
  border: 0;
  background: transparent;
  box-shadow: none;
  text-align: right;
}
.daily-money-field input:focus {
  border-color: transparent;
  box-shadow: none;
}
.daily-money-field span {
  display: inline;
  margin: 0;
  color: var(--primary-dark);
  font-size: 12px;
  font-weight: 900;
}
.daily-expense-row .btn {
  width: 100%;
}
.daily-ledger-row {
  display: grid;
  grid-template-columns: minmax(130px, .8fr) minmax(150px, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 58px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--line);
}
.daily-ledger-row span {
  color: #344054;
  font-weight: 900;
}
.daily-ledger-row input {
  min-width: 0;
  min-height: 40px;
  text-align: right;
}
.daily-ledger-total {
  background: #f8fcff;
}
.daily-ledger-total input[readonly],
.daily-ledger-net input[readonly] {
  background: #fff;
  color: var(--primary-dark);
  font-weight: 900;
}
.daily-ledger-net {
  background: var(--green-soft);
}
.daily-ledger-net span,
.daily-ledger-net input[readonly] {
  color: var(--primary-dark);
  font-weight: 900;
}
.daily-ledger-net input.daily-negative {
  background: #fff1f2;
  border-color: #fecaca;
  color: #b91c1c;
}
.expense-lines {
  display: grid;
  gap: 6px;
  min-width: 180px;
}
.expense-lines span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 8px;
  border: 1px solid #e2edf3;
  border-radius: 8px;
  background: #f8fcff;
  color: #566176;
  font-size: 12px;
  font-weight: 800;
}
.expense-lines strong {
  min-width: 0;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.daily-data-table-wrap {
  overflow-x: auto;
}
.daily-data-table {
  min-width: 1180px;
}
.daily-data-table th,
.daily-data-table td {
  padding: 13px 12px;
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
}
.daily-data-table th {
  font-size: 10px;
  line-height: 1.15;
}
.daily-data-table td strong {
  white-space: nowrap;
}
.daily-data-table .btn.small {
  min-height: 34px;
  padding: 8px 12px;
  font-size: 12px;
}
.daily-expense-detail-cell {
  text-align: center;
}
.daily-expense-detail-button {
  position: relative;
  width: 42px;
  height: 42px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d8e6ee;
  border-radius: 50%;
  background: #f8fcff;
  color: var(--primary-dark);
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.daily-expense-detail-button:hover,
.daily-expense-detail-button:focus-visible {
  border-color: var(--primary);
  box-shadow: 0 8px 20px rgba(36,150,207,.16);
  transform: translateY(-1px);
}
.daily-expense-detail-icon,
.daily-expense-detail-icon::before,
.daily-expense-detail-icon::after {
  display: block;
  width: 16px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}
.daily-expense-detail-icon {
  position: relative;
}
.daily-expense-detail-icon::before,
.daily-expense-detail-icon::after {
  content: "";
  position: absolute;
  left: 0;
}
.daily-expense-detail-icon::before {
  top: -6px;
}
.daily-expense-detail-icon::after {
  top: 6px;
}
.daily-expense-detail-count {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  padding: 0 5px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--primary);
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
}
.daily-expense-detail-modal-card {
  width: min(520px, 100%);
}
.daily-expense-detail-list {
  display: grid;
  gap: 8px;
}
.daily-expense-detail-list span {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid #e2edf3;
  border-radius: 8px;
  background: #f8fcff;
}
.daily-expense-detail-list strong {
  min-width: 0;
  color: var(--text);
  font-size: 13px;
  overflow-wrap: anywhere;
}
.daily-expense-detail-list em {
  color: var(--primary-dark);
  font-style: normal;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}
.daily-expense-detail-empty {
  margin: 0;
  color: var(--muted);
}
.transfer-entry-panel {
  padding: 0;
  overflow: visible;
}
.transfer-total-pill {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  background: #f8fcff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.transfer-total-pill strong {
  color: var(--primary-dark);
  font-size: 13px;
}
.transfer-entry-table {
  min-width: 1080px;
}
.transfer-entry-table th,
.transfer-entry-table td {
  vertical-align: middle;
}
.transfer-entry-table input {
  min-width: 0;
  min-height: 40px;
}
.transfer-entry-table .transfer-money-field {
  max-width: 190px;
}
.transfer-entry-table .btn.small {
  min-height: 34px;
  padding: 8px 12px;
}
.transfer-data-table-wrap {
  overflow-x: auto;
}
.transfer-data-table {
  min-width: 880px;
}
.transfer-detail-table {
  min-width: 980px;
}
.transfer-data-table th,
.transfer-data-table td {
  padding: 13px 12px;
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
}
.transfer-data-table th {
  font-size: 10px;
}
.transfer-data-table td small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 800;
}
.transfer-data-table tfoot th {
  background: #f8fcff;
  color: var(--primary-dark);
  font-size: 12px;
  text-align: right;
}
.transfer-data-table tfoot th:last-child {
  text-align: left;
}
.transfer-review-note {
  padding: 18px 20px;
  border-left: 3px solid #ef4444;
}
.transfer-review-note h2 {
  margin: 2px 0 6px;
  font-size: 18px;
}
.transfer-review-note p:last-child {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.transfer-review-panel {
  overflow: hidden;
}
.transfer-accounting-branch-switcher {
  margin-top: -4px;
}
[data-accounting-transfer-data-view].is-accounting-transfer-data-loading {
  opacity: .68;
  pointer-events: none;
}
.transfer-batch-panel {
  overflow: hidden;
}
.transfer-batch-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
  padding: 16px;
  border-top: 1px solid var(--line);
}
.transfer-batch-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(15,23,42,.04);
}
.transfer-batch-card header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.transfer-batch-card header > div:first-child {
  display: grid;
  gap: 4px;
}
.transfer-batch-card header strong {
  min-width: 0;
  color: var(--primary-dark);
  font-size: 16px;
  line-height: 1.25;
}
.transfer-batch-card header small {
  color: var(--text);
  font-size: 13px;
  font-weight: 800;
}
.transfer-batch-main {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.transfer-batch-main span {
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fcff;
}
.transfer-batch-main small {
  display: block;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}
.transfer-batch-main strong {
  display: block;
  color: var(--text);
  font-size: 15px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.transfer-batch-card footer {
  display: flex;
  justify-content: flex-start;
}
.salary-filter {
  grid-template-columns: minmax(220px, 320px) auto;
  align-items: end;
}
.leave-toolbar {
  padding: 18px 20px;
}
.leave-filter {
  padding-top: 0;
  border-top: 0;
  grid-template-columns: minmax(220px, 1.35fr) minmax(150px, .75fr) minmax(180px, .9fr) auto;
  align-items: end;
  gap: 12px;
}
.leave-filter.has-branch {
  grid-template-columns: minmax(180px, 1fr) minmax(120px, .65fr) minmax(190px, 1fr) minmax(160px, .85fr) auto;
}
.package-list-filter.leave-filter .leave-filter-actions {
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 0;
}
.leave-filter .btn {
  white-space: nowrap;
  min-height: 42px;
  padding-inline: 16px;
}
.salary-entry-panel {
  padding: 0;
  overflow: visible;
}
.leave-entry-modal-card {
  width: min(680px, 100%);
  max-height: calc(100vh - 28px);
  overflow: visible;
  padding: 14px 18px 12px;
}
.leave-entry-modal-card .modal-head {
  margin-bottom: 8px;
}
.leave-entry-modal-card .modal-head h2 {
  margin-bottom: 2px;
  font-size: 22px;
}
.leave-entry-modal-card .modal-head p {
  font-size: 14px;
  line-height: 1.35;
}
.leave-modal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 12px;
  margin-top: 8px;
}
.leave-modal-grid .span-2 {
  grid-column: 1 / -1;
}
.leave-modal-grid label {
  gap: 6px;
}
.leave-modal-grid label > span,
.leave-date-range-field .leave-field-label {
  margin-bottom: 3px;
  font-size: 12px;
}
.leave-modal-grid input,
.leave-modal-grid select,
.leave-modal-grid .custom-select-trigger,
.leave-modal-grid .date-picker-trigger {
  min-height: 40px;
  padding-inline: 13px;
}
.leave-modal-grid input[data-leave-day-count] {
  background: #f8fbff;
  color: #667085;
  cursor: default;
  pointer-events: none;
  user-select: none;
}
.leave-modal-grid input[data-leave-day-count]::-webkit-outer-spin-button,
.leave-modal-grid input[data-leave-day-count]::-webkit-inner-spin-button {
  margin: 0;
  appearance: none;
}
.leave-modal-grid input[data-leave-day-count] {
  appearance: textfield;
}
.leave-date-range-field {
  position: relative;
  display: grid;
  gap: 6px;
  min-width: 0;
  z-index: 2;
}
.leave-date-range-field.open {
  z-index: 44;
}
.leave-field-label {
  color: #44516a;
  font-size: 12px;
  font-weight: 800;
}
.leave-range-trigger {
  width: 100%;
  min-height: 50px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  padding: 8px 13px 8px 15px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
  color: var(--text);
  cursor: pointer;
  text-align: left;
  box-shadow: 0 4px 12px rgba(17,24,39,.035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.leave-range-trigger:hover {
  border-color: #d5ddea;
  background: #fbfcff;
}
.leave-date-range-field.open .leave-range-trigger {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.leave-range-trigger > span {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.leave-range-trigger strong,
.leave-range-trigger small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.leave-range-trigger strong {
  font-size: 14px;
  font-weight: 900;
}
.leave-range-trigger small {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.leave-range-trigger i {
  width: 17px;
  height: 17px;
  justify-self: end;
  position: relative;
  border: 2px solid #8b96aa;
  border-radius: 5px;
}
.leave-range-trigger i::before {
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  top: 3px;
  border-top: 2px solid #8b96aa;
}
.leave-range-calendar {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: min(326px, calc(100vw - 32px));
  display: none;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 36px rgba(17,24,39,.14);
}
.leave-date-range-field.open-up .leave-range-calendar {
  top: auto;
  bottom: calc(100% + 8px);
}
.leave-date-range-field.align-right .leave-range-calendar {
  left: auto;
  right: 0;
}
.leave-date-range-field.open .leave-range-calendar {
  display: block;
}
.leave-range-head {
  display: grid;
  grid-template-columns: 32px 1fr 32px;
  align-items: center;
  gap: 6px;
  margin-bottom: 7px;
}
.leave-range-head strong {
  text-align: center;
  color: var(--text);
  font-size: 14px;
}
.leave-range-nav {
  width: 32px;
  height: 30px;
  border: 1px solid #e3edf5;
  border-radius: 50%;
  background: #fff;
  color: var(--muted);
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.leave-range-nav:hover {
  border-color: #bee5f6;
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.leave-range-weekdays,
.leave-range-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
}
.leave-range-weekdays {
  margin-bottom: 4px;
}
.leave-range-weekdays span {
  height: 22px;
  display: grid;
  place-items: center;
  color: #98a2b3;
  font-size: 10px;
  font-weight: 900;
}
.leave-range-day {
  height: 30px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #344054;
  cursor: pointer;
  font-size: 12px;
  font-weight: 800;
}
.leave-range-day:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.leave-range-day.muted {
  color: #b8c0cf;
}
.leave-range-day.today {
  box-shadow: inset 0 0 0 1px #bfe3f4;
}
.leave-range-day.in-range {
  border-radius: 6px;
  background: #e9f7fd;
  color: var(--primary-dark);
}
.leave-range-day.selected {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 16px rgba(36,150,207,.18);
}
.leave-range-day.range-start,
.leave-range-day.range-end {
  background: var(--primary);
  color: #fff;
}
.leave-range-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 8px;
}
.leave-range-clear,
.leave-range-done,
.leave-range-today {
  min-height: 30px;
  padding: 5px 10px;
  border: 1px solid #cfeaf5;
  border-radius: var(--pill);
  background: var(--primary-soft);
  color: var(--primary-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
}
.leave-range-clear {
  background: #fff;
  color: var(--muted);
}
.leave-range-done {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
  box-shadow: 0 8px 16px rgba(36,150,207,.16);
}
.leave-range-helper {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.leave-entry-modal-card .date-picker-menu {
  width: 284px;
  padding: 8px;
  border-radius: 18px;
}
.leave-entry-modal-card .date-picker-head {
  grid-template-columns: 32px 1fr 32px;
  gap: 6px;
  margin-bottom: 6px;
}
.leave-entry-modal-card .date-picker-head strong {
  font-size: 14px;
}
.leave-entry-modal-card .date-picker-nav {
  width: 32px;
  height: 30px;
}
.leave-entry-modal-card .date-picker-weekdays,
.leave-entry-modal-card .date-picker-grid {
  gap: 2px;
}
.leave-entry-modal-card .date-picker-weekdays {
  margin-bottom: 3px;
}
.leave-entry-modal-card .date-picker-weekdays span {
  height: 22px;
  font-size: 10px;
}
.leave-entry-modal-card .date-picker-day {
  height: 28px;
  border-radius: 10px;
  font-size: 12px;
}
.leave-entry-modal-card .date-picker-foot {
  margin-top: 6px;
}
.leave-entry-modal-card .date-picker-clear,
.leave-entry-modal-card .date-picker-today {
  min-height: 30px;
  padding: 5px 10px;
  font-size: 12px;
}
.leave-modal-grid textarea {
  min-height: 58px;
  height: 64px;
  border-radius: 14px;
  padding: 10px 13px;
  line-height: 1.35;
  resize: none;
}
.leave-form-hint {
  align-self: center;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.leave-modal-actions {
  align-items: center;
  margin-top: 8px;
}
.leave-modal-actions .leave-form-hint {
  margin-right: auto;
}
.leave-file-field input[type="file"] {
  min-height: 40px;
  padding: 6px 9px;
  background: #fbfdff;
}
.leave-file-field input[type="file"]::file-selector-button {
  min-height: 28px;
  margin-right: 12px;
  padding: 6px 11px;
  border: 1px solid #cfe4f2;
  border-radius: var(--pill);
  background: var(--primary-soft);
  color: var(--primary-dark);
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
}
.leave-file-field small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}
.leave-document-icon-link {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  border: 1px solid #d6e7f0;
  border-radius: 10px;
  background: #fff;
  color: #198fbd;
  box-shadow: none;
  transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.leave-document-icon-link:hover,
.leave-document-icon-link:focus-visible {
  border-color: #a9d9ea;
  background: #f2fbff;
  color: var(--primary-dark);
}
.leave-document-icon-link svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.leave-row-actions {
  align-items: center;
  gap: 7px;
  flex-wrap: nowrap;
}
.leave-row-actions form {
  margin: 0;
}
.leave-row-actions .btn.small {
  min-width: 72px;
  justify-content: center;
  padding-inline: 11px;
}
.leave-view-modal-card {
  width: min(640px, 100%);
}
.leave-view-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 18px 0 0;
}
.leave-view-grid > div {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid #e2edf3;
  border-radius: 12px;
  background: #f8fcff;
}
.leave-view-grid > .span-2 {
  grid-column: 1 / -1;
}
.leave-view-grid dt {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}
.leave-view-grid dd {
  margin: 0;
  color: var(--text);
  font-weight: 850;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.leave-view-document {
  display: inline-grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  max-width: 100%;
}
.leave-view-document span {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.leave-view-document strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.leave-view-document small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.leave-person-detail-card {
  width: min(1120px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
  gap: 12px;
  overflow: hidden;
}
.leave-person-detail-card .modal-head {
  margin-bottom: 0;
}
.leave-person-detail-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.leave-person-detail-stats span {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid #dceaf2;
  border-radius: 12px;
  background: #f8fcff;
}
.leave-person-detail-stats small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}
.leave-person-detail-stats strong {
  color: var(--text);
  font-size: 18px;
  line-height: 1.1;
}
.leave-person-detail-filters {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(130px, .85fr) minmax(160px, 1fr) auto;
  align-items: end;
  gap: 10px;
  padding: 12px;
  border: 1px solid #e3edf5;
  border-radius: 14px;
  background: #fbfdff;
}
.leave-person-detail-filters label {
  margin: 0;
}
.leave-person-detail-filters select {
  min-height: 40px;
}
.leave-person-detail-filter-actions {
  display: flex;
  align-items: flex-end;
}
.leave-person-detail-filter-actions .btn {
  min-height: 40px;
  white-space: nowrap;
}
.leave-person-detail-table-wrap {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid #e6edf5;
  border-radius: 14px;
}
.leave-person-detail-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.leave-person-detail-table th,
.leave-person-detail-table td {
  padding: 11px 12px;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}
.leave-person-detail-table th:nth-child(1),
.leave-person-detail-table td:nth-child(1) {
  width: 25%;
}
.leave-person-detail-table th:nth-child(2),
.leave-person-detail-table td:nth-child(2) {
  width: 18%;
}
.leave-person-detail-table th:nth-child(3),
.leave-person-detail-table td:nth-child(3) {
  width: 11%;
}
.leave-person-detail-table th:nth-child(4),
.leave-person-detail-table td:nth-child(4) {
  width: 18%;
}
.leave-person-detail-table th:nth-child(5),
.leave-person-detail-table td:nth-child(5) {
  width: 28%;
}
.leave-person-detail-actions {
  margin-top: 0;
}
.leave-document-preview-card {
  width: min(980px, 100%);
  height: min(760px, calc(100vh - 44px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 18px;
}
.leave-document-preview-frame {
  width: 100%;
  height: 100%;
  min-height: 430px;
  border: 1px solid #dfe8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.leave-document-preview-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.leave-summary-panel {
  margin-bottom: 22px;
}
.leave-type-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 5px 10px;
  border-radius: var(--pill);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.leave-type-annual {
  background: #e0f2fe;
  color: #0369a1;
}
.leave-type-sick {
  background: #fff7ed;
  color: #c2410c;
}
.leave-date-range,
.leave-person-role {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.leave-record-table td,
.leave-summary-table td {
  vertical-align: top;
}
.salary-total-actions {
  flex-wrap: wrap;
}
.salary-total-pill {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  background: #f8fcff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.salary-total-pill strong {
  color: var(--primary-dark);
  font-size: 13px;
}
.salary-tab-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 18px;
}
.salary-accounting-branch-switcher {
  margin-top: -4px;
}
[data-accounting-salary-data-view].is-accounting-salary-data-loading {
  opacity: .68;
  pointer-events: none;
}
.leave-accounting-branch-switcher {
  margin-top: -4px;
}
[data-accounting-leaves-view].is-accounting-leaves-loading {
  opacity: .68;
  pointer-events: none;
}
.salary-tab-strip :is(a, button) {
  min-height: 46px;
  display: grid;
  place-items: center;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  background: #fff;
  color: var(--muted);
  box-shadow: var(--soft-shadow);
  cursor: pointer;
  font: inherit;
  font-weight: 900;
}
.salary-tab-strip :is(a, button).active {
  border-color: rgba(36,150,207,.30);
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.salary-entry-modal-card {
  width: min(680px, 100%);
}
.salary-kind-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 5px;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  background: #f8fcff;
}
.salary-kind-toggle button {
  min-height: 38px;
  border: 0;
  border-radius: var(--pill);
  background: transparent;
  color: var(--muted);
  cursor: pointer;
  font-weight: 900;
}
.salary-kind-toggle button.active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 10px 20px rgba(36,150,207,.20);
}
.salary-modal-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 14px;
}
.salary-modal-grid .span-2 {
  grid-column: 1 / -1;
}
.salary-modal-grid label:last-child {
  grid-column: 1 / -1;
}
.salary-modal-money-field {
  max-width: 100%;
}
.staff-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  padding: 6px 11px;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
}
.staff-status.is-active {
  border-color: #a9e8ce;
  background: #effdf6;
  color: #087956;
}
.staff-status.is-passive {
  border-color: #f2becb;
  background: #fff2f5;
  color: #b52d52;
}
.staff-row-actions {
  flex-wrap: nowrap;
}
.staff-row-actions form {
  margin: 0;
}
.branch-row-actions {
  flex-wrap: nowrap;
}
.branch-row-actions form {
  margin: 0;
}
.staff-form {
  padding: 20px;
}
.staff-form-alert {
  margin: 0;
}
.staff-form-section {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}
.staff-form-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #eef4f8;
}
.staff-form-section-head > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.staff-form-section-head span {
  width: 30px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: var(--primary-soft);
  color: var(--primary-dark);
  font-size: 12px;
  font-weight: 900;
}
.staff-form-section-head h2 {
  margin: 0;
  font-size: 17px;
  line-height: 1.2;
}
.staff-form-section-head small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  white-space: nowrap;
}
.staff-form-grid .span-2 {
  grid-column: 1 / -1;
}
.staff-readonly-field {
  min-height: 46px;
  display: grid;
  gap: 5px;
  padding: 11px 14px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #f8fcff;
}
.staff-readonly-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.staff-readonly-field strong {
  color: var(--text);
}
.staff-money-field {
  min-height: 46px;
}
.staff-document-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.staff-disabled-panel {
  display: grid;
  gap: 6px;
  padding: 20px;
  border: 1px dashed #b9ddec;
  border-radius: 8px;
  background: #f8fcff;
  color: var(--muted);
}
.staff-disabled-panel strong {
  color: var(--primary-dark);
  font-size: 15px;
}
.staff-disabled-panel p {
  margin: 0;
  line-height: 1.5;
}
.sms-config-list {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(260px, 1.5fr) minmax(140px, .5fr);
  gap: 10px;
}
.sms-config-list span {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 14px 16px;
  border: 1px solid #dfe5ee;
  border-radius: 8px;
  background: #f8fcff;
}
.sms-config-list small,
.sms-doc-note,
.sms-log-message small {
  color: var(--muted);
}
.sms-config-list strong,
.sms-log-message strong {
  min-width: 0;
  overflow-wrap: anywhere;
}
.sms-warning-box {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}
.sms-warning-box span {
  padding: 10px 12px;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  background: #fff7ed;
  color: #9a3412;
  font-weight: 800;
  font-size: 13px;
}
.sms-doc-note {
  margin: 12px 0 0;
  line-height: 1.5;
}
.sms-log-message {
  display: grid;
  gap: 4px;
  max-width: 360px;
}
.staff-document-upload {
  display: grid;
  gap: 14px;
  min-width: 0;
  padding: 16px;
  border: 1px solid #dfe5ee;
  border-radius: 12px;
  background: #f8fcff;
}
.staff-document-upload.has-file {
  border-color: #bfe8f7;
  background: #f5fcff;
}
.staff-document-upload-head {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}
.staff-document-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid #cfe8f5;
  border-radius: 12px;
  background: #eefaff;
  color: var(--primary);
}
.staff-document-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.staff-document-upload-head strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
}
.staff-document-upload-head small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.staff-document-badge {
  flex: 0 0 auto;
  padding: 5px 8px;
  border-radius: var(--pill);
  background: #dcfce7;
  color: #047857;
  font-size: 11px;
  font-weight: 900;
}
.staff-document-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, max-content));
  align-items: center;
  gap: 8px;
}
.staff-document-actions .btn {
  min-height: 36px;
  padding-inline: 13px;
}
.staff-document-delete {
  border: 1px solid #f2becb;
  background: #fff7f9;
  color: #b52d52;
}
.staff-document-delete:hover {
  border-color: #ef7d94;
  background: #fff0f3;
  color: #9f1239;
}
.staff-document-file {
  display: grid;
  gap: 7px;
  margin: 0;
}
.staff-document-file > span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.staff-document-file input[type="file"] {
  width: 100%;
  min-width: 0;
  padding: 8px;
  border: 1px solid #dfe5ee;
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font-size: 12px;
}
.staff-document-file input[type="file"]::file-selector-button {
  min-height: 30px;
  margin-right: 10px;
  padding: 6px 11px;
  border: 1px solid #cfe1ec;
  border-radius: var(--pill);
  background: #f5fbff;
  color: var(--primary-dark);
  font-weight: 900;
  cursor: pointer;
}
.staff-document-preview-card {
  width: min(980px, 100%);
  height: min(760px, calc(100vh - 44px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 18px;
}
.staff-document-preview-frame {
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 1px solid #dfe8f0;
  border-radius: 16px;
  background: #f8fafc;
}
.staff-document-preview-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.staff-form-actions {
  margin-top: 2px;
}
.staff-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.staff-detail-card {
  padding: 20px;
}
.staff-detail-card h2 {
  margin: 0 0 14px;
  font-size: 17px;
}
.staff-detail-wide {
  grid-column: 1 / -1;
}
.staff-detail-list {
  display: grid;
  gap: 10px;
  margin: 0;
}
.staff-detail-list div,
.staff-detail-document {
  display: grid;
  grid-template-columns: minmax(160px, 220px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 11px 0;
  border-bottom: 1px solid #eef4f8;
}
.staff-detail-list div:last-child,
.staff-detail-document:last-child {
  border-bottom: 0;
}
.staff-detail-list dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
}
.staff-detail-list dd {
  margin: 0;
  color: var(--text);
  font-weight: 800;
  overflow-wrap: anywhere;
}
.staff-detail-documents {
  display: grid;
  gap: 0;
}
.staff-detail-document {
  grid-template-columns: minmax(0, 1fr) auto;
}
.staff-detail-document strong {
  display: block;
  color: var(--text);
  font-size: 13px;
  font-weight: 900;
}
.staff-detail-document small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.staff-detail-note {
  margin: 0;
  color: var(--text);
  line-height: 1.6;
}
.form-grid .span-2 {
  grid-column: 1 / -1;
}
.resource-upload-panel {
  padding: 20px;
}
.resource-file-field input[type="file"],
.tool-drop-field input[type="file"] {
  width: 100%;
  min-width: 0;
  padding: 9px;
  border: 1px solid #dfe5ee;
  border-radius: 12px;
  background: #fff;
  color: var(--text);
  font-size: 12px;
}
.resource-file-field input[type="file"]::file-selector-button,
.tool-drop-field input[type="file"]::file-selector-button {
  min-height: 32px;
  margin-right: 10px;
  padding: 7px 12px;
  border: 1px solid #cfe1ec;
  border-radius: var(--pill);
  background: #f5fbff;
  color: var(--primary-dark);
  font-weight: 900;
  cursor: pointer;
}
.resource-list-panel {
  overflow: hidden;
}
.resource-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  padding: 16px;
}
.resource-card {
  min-width: 0;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 8px 18px rgba(17,24,39,.04);
}
.resource-icon,
.tool-drop-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #cfe8f5;
  border-radius: 14px;
  background: #eefaff;
  color: var(--primary);
}
.resource-icon svg,
.tool-drop-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.resource-card-body {
  min-width: 0;
}
.resource-card h2 {
  margin: 10px 0 6px;
  font-size: 17px;
  line-height: 1.2;
}
.resource-card p {
  min-height: 38px;
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}
.resource-card small {
  display: block;
  margin-top: 10px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-actions {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 12px;
  border-top: 1px solid #eef4f8;
}
.resource-actions form {
  margin: 0;
}
.resource-grid {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}
.resource-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  min-height: 270px;
  padding: 18px;
  border-color: #d5e9f2;
  background:
    linear-gradient(180deg, #ffffff 0%, #f8fcff 100%);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.resource-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--primary), #14b8a6);
}
.resource-card:hover {
  transform: translateY(-2px);
  border-color: #a7d7eb;
  box-shadow: 0 18px 36px rgba(0,109,149,.12);
}
.resource-card-top {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}
.resource-pdf-cover {
  position: relative;
  width: 76px;
  min-height: 96px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  border: 1px solid #bfe8f7;
  border-radius: 8px;
  background: linear-gradient(180deg, #f0fbff, #ffffff);
  color: var(--primary-dark);
  box-shadow: 0 10px 18px rgba(36,150,207,.10);
}
.resource-pdf-cover::after {
  content: "";
  position: absolute;
  top: -1px;
  right: -1px;
  width: 22px;
  height: 22px;
  border-left: 1px solid #bfe8f7;
  border-bottom: 1px solid #bfe8f7;
  border-radius: 0 8px 0 8px;
  background: #dff6ff;
}
.resource-pdf-cover svg {
  width: 27px;
  height: 27px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.resource-pdf-cover b {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: var(--pill);
  background: #e0f2fe;
  color: #0369a1;
  font-size: 11px;
  line-height: 1;
}
.resource-card-body .badge {
  min-height: 24px;
  padding: 5px 9px;
}
.resource-card h2 {
  margin: 12px 0 7px;
  font-size: 18px;
  overflow-wrap: anywhere;
}
.resource-card p {
  min-height: 42px;
  line-height: 1.55;
}
.resource-meta-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.resource-meta-list span {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 10px 11px;
  border: 1px solid #e2edf3;
  border-radius: 8px;
  background: #fff;
}
.resource-meta-list small {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  font-weight: 900;
}
.resource-meta-list strong {
  min-width: 0;
  color: var(--text);
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-card-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid #e7f0f6;
}
.resource-card-foot > small {
  min-width: 0;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-card-foot .resource-actions {
  flex: 0 0 auto;
  grid-column: auto;
  padding-top: 0;
  border-top: 0;
}
.resource-card-foot .btn.small {
  min-height: 36px;
  padding-inline: 13px;
}
.form-preview-card {
  width: min(1120px, 100%);
  height: min(820px, calc(100vh - 44px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 18px;
}
.form-preview-frame {
  width: 100%;
  height: 100%;
  min-height: 480px;
  border: 1px solid #dfe8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.form-preview-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.tool-format-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.tool-format-card {
  pointer-events: none;
}
.tool-converter-panel {
  overflow: hidden;
}
.tool-converter-form {
  display: grid;
  gap: 18px;
  padding: 20px;
}
.tool-step {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid #dce8f0;
  border-radius: var(--radius);
  background: linear-gradient(180deg, #ffffff, #f8fcff);
}
.tool-step-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tool-step-head > span {
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 34px;
  border-radius: 50%;
  background: var(--primary-soft);
  color: var(--primary-dark);
  font-size: 12px;
  font-weight: 900;
}
.tool-step-head h2 {
  margin: 0 0 3px;
  font-size: 17px;
}
.tool-step-head p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}
.tool-choice-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.tool-choice-card {
  --tool-choice-color: var(--primary);
  position: relative;
  min-width: 0;
  min-height: 138px;
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px;
  border: 1px solid #dce8f0;
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(17,24,39,.04);
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.tool-choice-card::before {
  content: "";
  position: absolute;
  left: 0;
  inset-block: 0;
  width: 3px;
  background: var(--tool-choice-color);
}
.tool-choice-card:hover,
.tool-choice-card.is-selected {
  transform: translateY(-1px);
  border-color: #b9ddec;
  border-color: color-mix(in srgb, var(--tool-choice-color) 42%, #dce8f0);
  background: #fbfdff;
  box-shadow: 0 14px 28px rgba(15,23,42,.08);
}
.tool-choice-card.is-selected {
  box-shadow: 0 16px 34px rgba(36,150,207,.13);
}
.tool-choice-input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.tool-choice-icon {
  width: 44px;
  height: 44px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  background: #eef8fc;
  background: color-mix(in srgb, var(--tool-choice-color) 10%, #fff);
  color: var(--tool-choice-color);
}
.tool-choice-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.tool-choice-copy {
  display: grid;
  gap: 5px;
}
.tool-choice-copy strong {
  color: var(--text);
  font-size: 16px;
}
.tool-choice-copy small {
  color: var(--muted);
  line-height: 1.35;
}
.tool-choice-check {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid #dce8f0;
  border-radius: 50%;
  background: #fff;
}
.tool-choice-check::before {
  content: "";
  width: 9px;
  height: 5px;
  border-left: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(-45deg) translate(1px, -1px);
  opacity: 0;
}
.tool-choice-card.is-selected .tool-choice-check {
  border-color: var(--tool-choice-color);
  background: var(--tool-choice-color);
}
.tool-choice-card.is-selected .tool-choice-check::before {
  opacity: 1;
}
.tool-choice-blue { --tool-choice-color: var(--primary); }
.tool-choice-teal { --tool-choice-color: #0f766e; }
.tool-choice-amber { --tool-choice-color: #f59e0b; }
.tool-choice-purple { --tool-choice-color: #7c3aed; }
.tool-drop-field {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  gap: 6px 14px;
  align-items: center;
  margin: 0;
  padding: 18px;
  border: 1px dashed #b9ddec;
  border-radius: var(--radius);
  background: #f8fcff;
}
.tool-drop-field strong,
.tool-drop-field small {
  display: block;
}
.tool-drop-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.tool-drop-field small {
  color: var(--muted);
  font-weight: 800;
}
.tool-file-chip {
  min-height: 34px;
  max-width: 360px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 11px;
  border: 1px solid #dce8f0;
  border-radius: var(--pill);
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tool-drop-field.is-file-selected .tool-file-chip {
  border-color: #b9ddec;
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.tool-drop-field input[type="file"] {
  grid-column: 2 / -1;
}
.tool-converter-actions {
  display: flex;
  justify-content: flex-end;
}
.salary-entry-table {
  min-width: 980px;
}
.salary-entry-table th,
.salary-entry-table td {
  vertical-align: middle;
}
.salary-entry-table .custom-select,
.salary-entry-table input {
  min-width: 0;
}
.salary-entry-table .salary-money-field {
  max-width: 180px;
}
.salary-note-input {
  min-width: 220px;
}
.salary-entry-table .btn.small {
  min-height: 34px;
  padding: 8px 12px;
}
.salary-advance-table-wrap {
  overflow-x: auto;
}
.salary-advance-table {
  min-width: 1040px;
}
.salary-advance-table th,
.salary-advance-table td {
  padding: 13px 12px;
  font-size: 12px;
  line-height: 1.25;
  white-space: nowrap;
}
.salary-advance-table th {
  font-size: 10px;
}
.salary-row-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.salary-row-actions form {
  margin: 0;
}
.salary-advance-table td:nth-child(8) {
  max-width: 260px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.surgical-option-board {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.surgical-option-panel {
  display: grid;
  align-content: start;
  gap: 16px;
}
.surgical-option-add,
.surgical-option-edit {
  display: grid;
  gap: 10px;
}
.surgical-option-add {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: end;
  padding-top: 4px;
}
.surgical-option-list {
  display: grid;
  gap: 10px;
}
.surgical-option-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  padding: 10px;
  border: 1px solid #e1edf5;
  border-radius: var(--radius);
  background: #f8fcff;
}
.surgical-option-edit {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
}
.surgical-option-row input[name="name"] {
  min-width: 0;
}
.surgical-option-empty {
  border: 1px dashed #d8e9f1;
  border-radius: var(--radius);
  background: #f8fcff;
}
.doctor-detail-hero {
  padding: 22px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, .9fr);
  gap: 18px 22px;
  align-items: start;
}
.doctor-detail-copy h1 {
  margin: 4px 0 8px;
  font-size: 30px;
  line-height: 1.12;
  letter-spacing: 0;
}
.doctor-detail-copy p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.doctor-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.doctor-detail-meta span {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid #d8e8f1;
  border-radius: var(--pill);
  background: #f7fcff;
  color: #566176;
  font-size: 12px;
  font-weight: 800;
}
.doctor-detail-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: #fbfdff;
}
.doctor-detail-metrics div {
  min-width: 0;
  padding: 16px;
}
.doctor-detail-metrics div + div {
  border-left: 1px solid var(--line);
}
.doctor-detail-metrics span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.doctor-detail-metrics strong {
  display: block;
  margin-top: 8px;
  color: var(--text);
  font-size: 24px;
  line-height: 1.1;
}
.doctor-detail-metrics div:last-child strong {
  color: var(--primary-dark);
  font-size: 21px;
}
.doctor-detail-filter {
  grid-column: 1 / -1;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(160px, 200px) minmax(220px, 280px) minmax(0, 1fr);
  gap: 12px;
  align-items: end;
}
.doctor-detail-filter .actions {
  grid-column: 3;
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.table-subtext {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.package-list-toolbar {
  padding: 18px 20px 20px;
}
.package-list-toolbar-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}
.package-list-toolbar-head h1 {
  margin: 4px 0 6px;
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: 0;
}
.package-list-toolbar-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}
.package-branch-switcher {
  margin: 2px 0 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.package-branch-switcher + .package-list-filter {
  padding-top: 14px;
}
.package-list-filter {
  width: 100%;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(260px, 1.35fr) minmax(210px, 1fr) minmax(170px, .75fr) minmax(210px, .95fr) auto;
  gap: 12px;
  align-items: end;
}
.package-list-filter.surgical-list-filter {
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.2fr) auto;
}
.package-list-filter .actions {
  align-self: end;
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.audit-filter-panel {
  padding: 18px 20px;
}
.audit-filter-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.5fr) minmax(190px, 1fr) minmax(170px, .8fr) minmax(150px, .7fr) minmax(150px, .7fr) auto;
  gap: 12px;
  align-items: end;
}
.audit-filter-actions {
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.audit-log-table td {
  vertical-align: top;
}
.audit-time {
  min-width: 145px;
  color: #566176;
  font-weight: 800;
}
.audit-description strong {
  display: block;
  line-height: 1.45;
}
.audit-route-chip {
  display: inline-flex;
  align-items: center;
  max-width: 220px;
  min-height: 28px;
  padding: 5px 9px;
  border: 1px solid #d8e8f1;
  border-radius: var(--pill);
  background: #f7fcff;
  color: #566176;
  font-size: 12px;
  font-weight: 900;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.audit-metadata {
  margin-top: 8px;
}
.audit-metadata summary {
  width: max-content;
  color: var(--primary-dark);
  cursor: pointer;
  font-size: 12px;
  font-weight: 900;
}
.audit-metadata pre {
  margin: 8px 0 0;
  max-width: 620px;
  max-height: 180px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fbfcff;
  color: #344054;
  padding: 10px;
  font-size: 12px;
  line-height: 1.45;
  white-space: pre-wrap;
}
.audit-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  padding: 16px 20px;
  border-top: 1px solid var(--line);
}
.audit-pagination span {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}
.modal-field-grid { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 14px; align-items: end; }
label span, .field-label {
  display: block;
  margin-bottom: 8px;
  color: #566176;
  font-size: 13px;
  font-weight: 700;
}
input, select, textarea {
  width: 100%;
  border: 1px solid #dfe5ee;
  background: #fff;
  border-radius: var(--pill);
  min-height: 42px;
  padding: 10px 12px;
  color: var(--text);
  outline: none;
}
textarea { min-height: 88px; resize: vertical; }
input:focus, select:focus, textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.lab-color-field {
  display: grid;
  gap: 8px;
}
.lab-color-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
  gap: 10px;
}
.lab-color-option {
  position: relative;
  min-width: 0;
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--lab-choice-border, #dfe5ee);
  border-radius: 14px;
  background: var(--lab-choice-bg, #fff);
  color: var(--lab-choice-text, var(--text));
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(17,24,39,.04);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.lab-color-option:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(17,24,39,.07);
}
.lab-color-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.lab-color-swatch {
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: 50%;
  background: var(--lab-choice-stripe, var(--primary));
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.72);
  margin-bottom: 0;
}
.lab-color-option input:checked + .lab-color-swatch {
  box-shadow: inset 0 0 0 3px rgba(255,255,255,.82), 0 0 0 3px #fff, 0 0 0 5px var(--lab-choice-stripe, var(--primary));
}
.lab-color-option input:focus-visible + .lab-color-swatch {
  outline: 3px solid rgba(36,150,207,.25);
  outline-offset: 4px;
}
.lab-color-name {
  display: block;
  min-width: 0;
  margin-bottom: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.native-select-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.month-picker-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.date-picker-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.custom-select {
  position: relative;
  width: 100%;
  min-width: 0;
  z-index: 1;
}
.custom-select.open { z-index: 30; }
.custom-select-trigger {
  width: 100%;
  height: 46px;
  min-height: 46px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
  color: var(--text);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  align-items: stretch;
  column-gap: 12px;
  padding: 0 16px;
  cursor: pointer;
  text-align: left;
  line-height: normal;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(17,24,39,.035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.custom-select-trigger:hover { border-color: #d5ddea; background: #fbfcff; }
.custom-select.open .custom-select-trigger {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.custom-select.invalid .custom-select-trigger {
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(239,68,68,.10);
}
.custom-select-value {
  display: block;
  min-width: 0;
  height: 44px;
  line-height: 44px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transform: none;
}
.custom-select.is-placeholder .custom-select-value { color: #98a2b3; }
.custom-select-arrow {
  width: 9px;
  height: 9px;
  align-self: center;
  justify-self: end;
  border-right: 2px solid #8b96aa;
  border-bottom: 2px solid #8b96aa;
  transform: rotate(45deg) translate(-1px, -2px);
  transition: transform .16s ease, border-color .16s ease;
}
.custom-select.open .custom-select-arrow {
  transform: rotate(225deg) translate(-2px, -1px);
  border-color: var(--primary);
}
.custom-select-menu {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  display: none;
  max-height: var(--custom-select-menu-height, 260px);
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 36px rgba(17,24,39,.12);
}
.custom-select.open-up .custom-select-menu {
  top: auto;
  bottom: calc(100% + 8px);
}
.custom-select.open .custom-select-menu { display: grid; gap: 2px; }
.custom-select-option {
  width: 100%;
  min-height: 40px;
  border: 0;
  border-radius: var(--pill);
  background: transparent;
  color: #344054;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px 8px;
  cursor: pointer;
  text-align: left;
  line-height: 1.25;
}
.custom-select-option:hover { background: var(--primary-soft); color: var(--primary-dark); }
.custom-select-option.selected {
  background: var(--primary);
  color: #fff;
}
.custom-select-option.selected::after {
  content: "";
  width: 7px;
  height: 12px;
  margin-left: 12px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.custom-select-option.placeholder { color: #98a2b3; }
.custom-select.disabled .custom-select-trigger {
  cursor: not-allowed;
  color: #98a2b3;
  background: #f8fafc;
}
.month-picker {
  position: relative;
  width: 100%;
  min-width: 0;
  z-index: 1;
}
.month-picker.open { z-index: 35; }
.month-picker-trigger {
  width: 100%;
  height: 46px;
  min-height: 46px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
  color: var(--text);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  align-items: stretch;
  column-gap: 12px;
  padding: 0 16px;
  cursor: pointer;
  text-align: left;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(17,24,39,.035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.month-picker-trigger:hover { border-color: #d5ddea; background: #fbfcff; }
.month-picker.open .month-picker-trigger {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.month-picker.invalid .month-picker-trigger {
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(239,68,68,.10);
}
.month-picker-value {
  display: block;
  min-width: 0;
  height: 44px;
  line-height: 44px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.month-picker.is-placeholder .month-picker-value { color: #98a2b3; }
.month-picker-icon {
  width: 16px;
  height: 16px;
  align-self: center;
  justify-self: end;
  position: relative;
  border: 2px solid #8b96aa;
  border-radius: 5px;
}
.month-picker-icon::before {
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  top: 3px;
  border-top: 2px solid #8b96aa;
}
.month-picker-menu {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: min(330px, calc(100vw - 32px));
  display: none;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 36px rgba(17,24,39,.12);
}
.month-picker.open .month-picker-menu { display: block; }
.month-picker-head {
  display: grid;
  grid-template-columns: 38px 1fr 38px;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.month-picker-head strong {
  text-align: center;
  font-size: 15px;
}
.month-picker-nav {
  width: 38px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: #fff;
  color: #566176;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}
.month-picker-nav:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
  border-color: #cfeaf5;
}
.month-picker-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 6px;
}
.month-picker-month {
  min-height: 38px;
  border: 0;
  border-radius: var(--pill);
  background: transparent;
  color: #344054;
  cursor: pointer;
  font-weight: 700;
}
.month-picker-month:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.month-picker-month.selected {
  background: var(--primary);
  color: #fff;
}
.month-picker-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: 8px;
}
.month-picker-today {
  min-height: 34px;
  border: 1px solid #cfeaf5;
  border-radius: var(--pill);
  background: var(--primary-soft);
  color: var(--primary-dark);
  padding: 7px 12px;
  cursor: pointer;
  font-weight: 700;
}
.date-picker {
  position: relative;
  width: 100%;
  min-width: 0;
  z-index: 1;
}
.date-picker.open { z-index: 36; }
.date-picker-trigger {
  width: 100%;
  height: 46px;
  min-height: 46px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
  color: var(--text);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px;
  align-items: stretch;
  column-gap: 12px;
  padding: 0 16px;
  cursor: pointer;
  text-align: left;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(17,24,39,.035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.date-picker-trigger:hover { border-color: #d5ddea; background: #fbfcff; }
.date-picker.open .date-picker-trigger {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.date-picker.invalid .date-picker-trigger {
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(239,68,68,.10);
}
.date-picker-value {
  display: block;
  min-width: 0;
  height: 44px;
  line-height: 44px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.date-picker.is-placeholder .date-picker-value { color: #98a2b3; }
.date-picker-icon {
  width: 16px;
  height: 16px;
  align-self: center;
  justify-self: end;
  position: relative;
  border: 2px solid #8b96aa;
  border-radius: 5px;
}
.date-picker-icon::before {
  content: "";
  position: absolute;
  left: -2px;
  right: -2px;
  top: 3px;
  border-top: 2px solid #8b96aa;
}
.date-picker-menu {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  width: min(342px, calc(100vw - 32px));
  display: none;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 36px rgba(17,24,39,.12);
}
.date-picker.open-up .date-picker-menu {
  top: auto;
  bottom: calc(100% + 8px);
}
.date-picker.align-right .date-picker-menu {
  left: auto;
  right: 0;
}
.date-picker.open .date-picker-menu { display: block; }
.date-picker-head {
  display: grid;
  grid-template-columns: 38px 1fr 38px;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.date-picker-head strong {
  text-align: center;
  font-size: 15px;
}
.date-picker-nav {
  width: 38px;
  height: 34px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: #fff;
  color: #566176;
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
}
.date-picker-nav:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
  border-color: #cfeaf5;
}
.date-picker-weekdays,
.date-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
}
.date-picker-weekdays {
  margin-bottom: 5px;
}
.date-picker-weekdays span {
  display: grid;
  place-items: center;
  height: 28px;
  color: #98a2b3;
  font-size: 11px;
  font-weight: 700;
}
.date-picker-day {
  height: 36px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: #344054;
  cursor: pointer;
  font-weight: 700;
}
.date-picker-day:hover {
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.date-picker-day.muted {
  color: #b5bdca;
}
.date-picker-day.today {
  box-shadow: inset 0 0 0 1px #b9ddec;
  color: var(--primary-dark);
}
.date-picker-day.selected {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 8px 16px rgba(36,150,207,.20);
}
.date-picker-foot {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-top: 10px;
}
.date-picker-clear,
.date-picker-today {
  min-height: 34px;
  border-radius: var(--pill);
  padding: 7px 12px;
  cursor: pointer;
  font-weight: 700;
}
.date-picker-clear {
  border: 1px solid transparent;
  background: transparent;
  color: #7c879b;
}
.date-picker-clear:hover {
  background: #f7f9fc;
  color: #566176;
}
.date-picker-today {
  border: 1px solid #cfeaf5;
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.checkbox-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.check-row {
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  padding: 10px 12px;
}
.check-row input { width: auto; min-height: auto; }
.permission-panel {
  padding: 20px;
}
.permission-table th:not(:first-child),
.permission-table .permission-cell {
  text-align: center;
}
.permission-name {
  min-width: 260px;
}
.permission-name strong,
.permission-name span {
  display: block;
}
.permission-name span {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}
.permission-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  min-width: 106px;
  padding: 5px 12px 5px 6px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  background: #fff;
  color: #667085;
  cursor: pointer;
  user-select: none;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}
.permission-toggle:hover {
  border-color: #cfeaf5;
  background: #fbfdff;
}
.permission-toggle:has(input:checked) {
  border-color: #b9ddec;
  background: var(--primary-soft);
  box-shadow: 0 8px 18px rgba(36,150,207,.08);
}
.permission-toggle input {
  position: absolute;
  inset: 0;
  width: 100%;
  min-height: 100%;
  opacity: 0;
  cursor: pointer;
}
.permission-switch {
  position: relative;
  flex: 0 0 auto;
  width: 42px;
  height: 26px;
  border: 1px solid #d6e4ed;
  border-radius: var(--pill);
  background: #edf3f7;
  transition: background .16s ease, border-color .16s ease;
}
.permission-switch::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(16,24,40,.16);
  transition: transform .16s ease;
}
.permission-toggle input:checked + .permission-switch {
  border-color: transparent;
  background: linear-gradient(135deg, var(--primary-dark), var(--primary));
}
.permission-toggle input:checked + .permission-switch::after {
  transform: translateX(16px);
}
.permission-toggle input:focus-visible + .permission-switch {
  box-shadow: 0 0 0 4px rgba(36,150,207,.14);
}
.permission-toggle-text {
  position: relative;
  z-index: 1;
  min-width: 36px;
  text-align: left;
  font-weight: 800;
}
.permission-toggle-text::before {
  content: "Pasif";
}
.permission-toggle input:checked ~ .permission-toggle-text {
  color: var(--primary-dark);
}
.permission-toggle input:checked ~ .permission-toggle-text::before {
  content: "Aktif";
}
.revision-note {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  max-width: 260px;
  color: #667085;
  font-size: 12px;
  line-height: 1.35;
}
.revision-note strong {
  color: #c2410c;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.revision-edit-row > td {
  padding: 0;
  background: #fbfcff;
}
.revision-edit-row:hover { background: #fbfcff; }
.revision-edit-form {
  margin: 12px;
  padding: 16px;
  border: 1px solid #e6eaf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(17,24,39,.05);
}
.revision-edit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.revision-edit-head strong {
  display: block;
  margin-top: 4px;
  font-size: 15px;
}
.revision-edit-grid {
  display: grid;
  grid-template-columns: 1.15fr .8fr 1.1fr .9fr .45fr .65fr;
  gap: 12px;
  align-items: end;
}
.revision-edit-grid.accounting-single-row {
  grid-template-columns:
    minmax(135px, .82fr)
    minmax(145px, .9fr)
    minmax(160px, 1fr)
    minmax(155px, .9fr)
    minmax(125px, .72fr)
    minmax(100px, .5fr)
    minmax(82px, .38fr)
    minmax(118px, .58fr);
  gap: 10px;
}
.revision-edit-grid.accounting-single-row label > span {
  font-size: 12px;
}
.revision-edit-grid.accounting-single-row input,
.revision-edit-grid.accounting-single-row select,
.revision-edit-grid.accounting-single-row .custom-select-trigger,
.revision-edit-grid.accounting-single-row .date-picker-trigger,
.revision-edit-grid.accounting-single-row .tooth-select-trigger {
  min-height: 42px;
  padding-inline: 13px;
}
.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: none;
  place-items: center;
  padding: 22px;
  background: rgba(15, 23, 42, .42);
  backdrop-filter: blur(8px);
}
.modal-backdrop.open { display: grid; }
.modal-card {
  width: min(540px, 100%);
  max-height: min(720px, calc(100vh - 44px));
  overflow: auto;
  border: 1px solid #e3e8f2;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, .20);
  padding: 22px;
}
.modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}
.modal-head h2 {
  margin: 4px 0 6px;
  font-size: 24px;
  letter-spacing: 0;
}
.modal-head p:last-child {
  margin: 0;
  color: var(--muted);
}
.modal-close {
  width: 38px;
  height: 38px;
  border: 1px solid var(--line);
  border-radius: 50%;
  background: #fff;
  color: #667085;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.modal-close:hover {
  background: #f8fafc;
  color: var(--text);
}
.modal-form textarea {
  min-height: 132px;
  border-radius: 18px;
  padding: 14px 16px;
  line-height: 1.55;
  resize: vertical;
}
.modal-form label {
  gap: 9px;
}
.modal-form .split-actions {
  align-items: center;
  margin-top: 20px;
}
.modal-form .btn {
  min-width: 104px;
  min-height: 44px;
}
.modal-form .btn.warn {
  background: #fff7e8;
  border-color: #f7c873;
  color: #b45309;
}
.modal-form .btn.warn:hover {
  background: var(--amber);
  border-color: var(--amber);
  color: #fff;
}
.modal-form .btn.ghost {
  border-color: #d8e6ee;
  color: #566176;
}
.confirm-modal-card {
  width: min(460px, 100%);
  text-align: left;
}
.confirm-icon {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin-bottom: 14px;
  border-radius: 50%;
  background: #fff0f1;
  color: var(--red);
  font-size: 22px;
  font-weight: 900;
}
.confirm-modal-card h2 {
  margin: 0 0 8px;
  font-size: 24px;
  letter-spacing: 0;
}
.confirm-modal-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.confirm-modal-card .split-actions {
  margin-top: 22px;
}
.package-existing-modal-card {
  border-top: 4px solid #f59e0b;
}
.package-existing-icon {
  background: #fff7ed;
  color: #c2410c;
}
.app-alert-modal-card {
  border-top: 4px solid #f59e0b;
}
.app-alert-icon {
  background: #fff7ed;
  color: #c2410c;
}
.app-alert-modal-backdrop.is-success .app-alert-modal-card { border-top-color: var(--green); }
.app-alert-modal-backdrop.is-success .app-alert-icon {
  background: var(--green-soft);
  color: var(--green);
}
.app-alert-modal-backdrop.is-error .app-alert-modal-card { border-top-color: var(--red); }
.app-alert-modal-backdrop.is-error .app-alert-icon {
  background: var(--red-soft);
  color: var(--red);
}
.app-alert-modal-backdrop.is-info .app-alert-modal-card { border-top-color: var(--primary); }
.app-alert-modal-backdrop.is-info .app-alert-icon {
  background: var(--primary-soft);
  color: var(--primary);
}
.app-alert-modal-backdrop.is-warning .app-alert-modal-card { border-top-color: var(--amber); }
.app-alert-modal-backdrop.is-warning .app-alert-icon {
  background: var(--amber-soft);
  color: var(--amber);
}
.duplicate-patient-modal-card {
  width: min(520px, 100%);
}
.duplicate-patient-note {
  display: grid;
  gap: 8px;
  margin-top: 16px;
}
.duplicate-patient-note span {
  color: #344054;
  font-size: 13px;
  font-weight: 800;
}
.duplicate-patient-note textarea {
  width: 100%;
  min-height: 110px;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 8px !important;
  padding: 12px 14px;
  color: var(--text);
  font: inherit;
  outline: none;
}
.duplicate-patient-note textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.duplicate-patient-note textarea.invalid {
  border-color: #fca5a5;
  box-shadow: 0 0 0 4px rgba(220,38,38,.10);
}
.duplicate-patient-note small {
  color: #b91c1c;
  font-weight: 800;
}
.tooth-select-trigger {
  width: 100%;
  min-width: 150px;
  min-height: 44px;
  border: 1px solid #dfe5ee;
  border-radius: var(--pill);
  background: #fff;
  color: #667085;
  cursor: pointer;
  padding: 10px 14px;
  text-align: left;
  font-size: 14px;
  font-weight: 800;
  box-shadow: 0 4px 12px rgba(17,24,39,.035);
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}
.tooth-select-trigger:hover {
  border-color: var(--primary);
  background: #f7fcff;
}
.tooth-select-trigger.has-selection {
  border-color: #b9ddec;
  background: #f0faff;
  color: var(--primary-dark);
}
.tooth-modal-card {
  width: min(760px, 100%);
}
.tooth-mode-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
  padding: 5px;
  border: 1px solid #d8e9f1;
  border-radius: var(--pill);
  background: #f7fcff;
}
.tooth-mode-tab {
  min-height: 40px;
  border: 0;
  border-radius: var(--pill);
  background: transparent;
  color: #566176;
  cursor: pointer;
  font-weight: 900;
}
.tooth-mode-tab.active {
  background: var(--primary);
  color: #fff;
  box-shadow: 0 10px 22px rgba(36,150,207,.22);
}
.tooth-picker {
  display: grid;
  gap: 0;
  padding: 16px;
  border: 1px solid #d8e9f1;
  border-radius: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fcff 100%);
}
.tooth-panel {
  display: none;
}
.tooth-panel.active {
  display: grid;
  gap: 12px;
}
.tooth-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
}
.tooth-side {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 6px;
}
.tooth-side.compact {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  padding-inline: 18%;
}
.jaw-selection-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.jaw-button {
  min-height: 72px;
  font-size: 15px;
}
.surgical-region-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin-top: 4px;
  padding-top: 12px;
  border-top: 1px solid #d8e9f1;
}
.surgical-region-button {
  min-height: 48px;
}
.surgical-material-picker {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.surgical-material-group {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid #d8e9f1;
  border-radius: 18px;
  background: #f8fcff;
}
.surgical-material-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.surgical-material-group-head strong {
  color: var(--text);
  font-size: 14px;
}
.surgical-material-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.surgical-material-option {
  display: grid;
  grid-template-columns: 0 minmax(0, 1fr) 0;
  gap: 6px;
  align-items: center;
}
.surgical-material-option.selected {
  grid-template-columns: 38px minmax(0, 1fr) 38px;
}
.surgical-material-stepper {
  grid-column: 1;
  display: none;
  width: 38px;
  min-height: 38px;
  border: 1px solid #d8e9f1;
  border-radius: 999px;
  background: #fff;
  color: var(--primary-dark);
  cursor: pointer;
  font-size: 18px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 5px 12px rgba(17,24,39,.035);
}
.surgical-material-stepper[data-surgical-material-step="1"] {
  grid-column: 3;
}
.surgical-material-option.selected .surgical-material-stepper {
  display: inline-grid;
  place-items: center;
}
.surgical-material-stepper:hover {
  border-color: var(--primary);
  background: #f0faff;
}
.surgical-material-choice {
  grid-column: 2;
  width: 100%;
  min-height: 44px;
  padding-inline: 10px;
}
.surgical-material-empty {
  grid-column: 1 / -1;
  padding: 14px;
  border: 1px dashed #d8e9f1;
  border-radius: 14px;
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
  text-align: center;
}
.tooth-divider {
  width: 2px;
  height: 54px;
  justify-self: center;
  border-radius: 99px;
  background: #e85b5b;
  opacity: .9;
}
.tooth-button {
  min-height: 40px;
  border: 1px solid #dfe5ee;
  border-radius: 14px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font-weight: 900;
  box-shadow: 0 5px 12px rgba(17,24,39,.035);
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.tooth-button:hover {
  border-color: var(--primary);
  background: #f7fcff;
}
.tooth-button.selected {
  border-color: var(--primary);
  background: var(--primary);
  color: #fff;
  box-shadow: 0 10px 22px rgba(36,150,207,.24);
}
.tooth-arch-line {
  height: 2px;
  border-radius: 99px;
  background: #e85b5b;
  opacity: .9;
}
.tooth-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 16px;
  padding: 14px 16px;
  border: 1px solid #d8e9f1;
  border-radius: 18px;
  background: #f7fcff;
  color: #566176;
  font-weight: 800;
}
.tooth-summary span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.tooth-summary strong {
  flex: 0 0 auto;
  color: var(--primary-dark);
}
.currency-rate-hint {
  margin-top: -4px;
  padding: 12px 14px;
  border: 1px solid #d8e9f1;
  border-radius: 18px;
  background: #f7fcff;
  color: #566176;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}
.modal-form textarea::placeholder {
  color: #a3adbd;
}
.modal-form textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(36,150,207,.12);
}
.pdf-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: none;
  place-items: center;
  padding: 22px;
  background: rgba(15, 23, 42, .42);
  backdrop-filter: blur(9px);
}
.pdf-modal-backdrop.open { display: grid; }
.pdf-modal-card {
  position: relative;
  width: min(480px, 100%);
  border: 1px solid #d8e9f1;
  border-radius: 26px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fcff 100%);
  box-shadow: 0 26px 72px rgba(0, 109, 149, .20);
  padding: 30px;
  text-align: center;
}
.pdf-modal-card .modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
}
.pdf-modal-visual {
  width: 76px;
  height: 76px;
  margin: 0 auto 18px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  background: var(--primary-soft);
  color: var(--primary);
}
.pdf-modal-visual span {
  width: 38px;
  height: 38px;
  border: 4px solid #cfeaf5;
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: pdf-spin .82s linear infinite;
}
.pdf-modal-backdrop.is-ready .pdf-modal-visual span,
.pdf-modal-backdrop.is-error .pdf-modal-visual span {
  position: relative;
  border: 0;
  border-radius: 50%;
  animation: none;
}
.pdf-modal-backdrop.is-ready .pdf-modal-visual {
  background: var(--green-soft);
  color: var(--green);
}
.pdf-modal-backdrop.is-ready .pdf-modal-visual span::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 5px;
  width: 13px;
  height: 24px;
  border-right: 5px solid currentColor;
  border-bottom: 5px solid currentColor;
  transform: rotate(45deg);
}
.pdf-modal-backdrop.is-error .pdf-modal-visual {
  background: var(--red-soft);
  color: var(--red);
}
.pdf-modal-backdrop.is-error .pdf-modal-visual span::before,
.pdf-modal-backdrop.is-error .pdf-modal-visual span::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 16px;
  width: 26px;
  height: 4px;
  border-radius: 999px;
  background: currentColor;
}
.pdf-modal-backdrop.is-error .pdf-modal-visual span::before { transform: rotate(45deg); }
.pdf-modal-backdrop.is-error .pdf-modal-visual span::after { transform: rotate(-45deg); }
.pdf-modal-card .eyebrow {
  margin: 0 0 8px;
  color: var(--primary);
}
.pdf-modal-card h2 {
  margin: 0 0 10px;
  font-size: 25px;
  letter-spacing: 0;
}
.pdf-modal-card p:not(.eyebrow) {
  margin: 0 auto;
  max-width: 360px;
  color: var(--muted);
  line-height: 1.6;
}
.pdf-modal-actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 24px;
}
@keyframes pdf-spin {
  to { transform: rotate(360deg); }
}
.btn {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: var(--pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 9px 14px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font-weight: 700;
  transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.btn.primary {
  background: var(--primary);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 10px 18px rgba(36,150,207,.20);
}
.btn svg {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.btn:hover { transform: translateY(-1px); }
.btn.primary:hover { background: var(--primary-dark); box-shadow: 0 12px 22px rgba(0,109,149,.22); }
.btn.success { background: var(--green); border-color: var(--green); color: #fff; }
.btn.danger { background: var(--red-soft); border-color: #fecaca; color: #b91c1c; }
.btn.warn { background: var(--amber-soft); border-color: #fed7aa; color: #c2410c; }
.btn.warning { background: #f59e0b; border-color: #f59e0b; color: #fff; }
.btn.ghost { background: #fff; color: #566176; box-shadow: 0 4px 12px rgba(17,24,39,.04); }
.btn.ghost:hover { border-color: #d6deea; background: #fbfcff; }
.btn.soft { background: var(--primary-soft); color: var(--primary-dark); border-color: #cfeaf5; }
.btn.full { width: 100%; }
.btn.small { min-height: 34px; padding: 7px 10px; font-size: 12px; }
.btn.compact { min-height: 36px; padding: 8px 12px; font-size: 13px; }
.edit-icon-button {
  gap: 6px;
}
.edit-icon-button[aria-expanded="true"] {
  border-color: rgba(36,150,207,.35);
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.btn.detail-button::before {
  content: "";
  width: 14px;
  height: 14px;
  background: currentColor;
  flex: 0 0 14px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 12s3.5-6 9.5-6 9.5 6 9.5 6-3.5 6-9.5 6-9.5-6-9.5-6Z' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.5 12s3.5-6 9.5-6 9.5 6 9.5 6-3.5 6-9.5 6-9.5-6-9.5-6Z' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.print-report-header,
.print-report-title,
.print-summary-grid {
  display: none;
}
.daily-pdf-source-panel,
.transfer-pdf-source-panel {
  display: none;
}

.public-pdf-page {
  background: #f3f7fb;
}
.public-pdf-content {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 28px 0 48px;
}
.public-pdf-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.public-pdf-toolbar .brand {
  min-width: 220px;
}
.public-pdf-toolbar-info {
  display: grid;
  gap: 3px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.public-pdf-toolbar-info strong {
  color: var(--text);
  font-size: 15px;
}
.public-pdf-page .print-report-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  padding: 18px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--primary);
  border-radius: 16px;
  background: #fff;
}
.public-pdf-page .print-report-title {
  display: block;
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid #cfeaf5;
  border-radius: 18px;
  background: linear-gradient(135deg, #f8fdff 0%, #ecf9ff 100%);
}
.public-pdf-page .print-report-title h1 {
  margin: 0;
  font-size: 30px;
  line-height: 1.15;
  letter-spacing: 0;
}
.public-pdf-page .print-report-title p:not(.eyebrow) {
  margin: 8px 0 0;
  color: var(--muted);
}
.public-pdf-page .print-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.public-pdf-page .print-summary-grid > div {
  min-height: 92px;
  padding: 16px;
  border: 1px solid var(--line);
  border-left: 4px solid var(--primary);
  border-radius: 14px;
  background: #fff;
}
.public-pdf-page .print-summary-grid span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}
.public-pdf-page .print-summary-grid strong {
  display: block;
  margin-top: 9px;
  color: var(--text);
  font-size: 18px;
  line-height: 1.25;
}
.public-pdf-total-panel {
  margin-bottom: 16px;
}
.public-pdf-panel {
  margin-bottom: 16px;
}
.public-pdf-empty,
.public-pdf-expired {
  display: grid;
  place-items: center;
  min-height: 70vh;
}
.public-pdf-expired-card {
  width: min(520px, 100%);
  padding: 34px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  box-shadow: var(--shadow-soft);
  text-align: center;
}
.public-pdf-expired-card .brand-mark {
  margin: 0 auto 18px;
}
.public-pdf-expired-card h1 {
  margin: 0 0 10px;
  font-size: 28px;
  line-height: 1.15;
  letter-spacing: 0;
}
.public-pdf-expired-card p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
  line-height: 1.6;
}
.public-cargo-card {
  display: grid;
  gap: 18px;
  width: min(920px, 100%);
  margin: 0 auto;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}
.public-cargo-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.public-cargo-brand h1 {
  margin: 4px 0 6px;
  font-size: 28px;
  letter-spacing: 0;
}
.public-cargo-brand p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}
.public-cargo-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.public-cargo-summary span {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid #dcebf3;
  border-radius: 8px;
  background: #f8fcff;
}
.public-cargo-summary small,
.public-cargo-item small {
  color: var(--muted);
  font-weight: 900;
}
.public-cargo-summary strong,
.public-cargo-item strong {
  color: var(--text);
}
.public-cargo-items {
  display: grid;
  gap: 10px;
}
.public-cargo-item {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(180px, 1fr) minmax(180px, 1.2fr);
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-left: 3px solid var(--primary);
  border-radius: 8px;
  background: #fff;
}
.public-cargo-item > div {
  display: grid;
  gap: 4px;
}
.public-cargo-item span {
  color: var(--muted);
  font-weight: 700;
}
.doctor-pdf-download-screen {
  min-height: calc(100vh - 96px);
  display: grid;
  place-items: center;
  align-content: center;
  gap: 14px;
  text-align: center;
}
.doctor-pdf-download-screen .brand-mark {
  width: 72px;
  height: 58px;
  margin-bottom: 6px;
}
.doctor-pdf-download-screen h1 {
  margin: 0;
  font-size: 34px;
  line-height: 1.1;
  letter-spacing: 0;
}
.doctor-pdf-download-button {
  min-width: 190px;
  min-height: 48px;
  margin-top: 8px;
  font-size: 15px;
}
.doctor-pdf-download-screen small {
  color: var(--muted);
  font-weight: 700;
}
.doctor-pdf-source {
  display: none !important;
}
@media (max-width: 760px) {
  .public-pdf-content {
    width: min(100% - 20px, 1180px);
    padding-top: 14px;
  }
  .public-pdf-toolbar {
    align-items: stretch;
    flex-direction: column;
  }
  .public-pdf-toolbar .actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .public-pdf-page .print-report-header {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }
  .public-pdf-page .print-summary-grid {
    grid-template-columns: 1fr;
  }
  .public-pdf-page .print-report-title h1,
  .public-pdf-expired-card h1 {
    font-size: 24px;
  }
  .public-cargo-card {
    padding: 18px;
  }
  .public-cargo-brand {
    align-items: flex-start;
    flex-direction: column;
  }
  .public-cargo-summary {
    grid-template-columns: 1fr 1fr;
  }
  .public-cargo-item {
    grid-template-columns: 1fr;
  }
  .doctor-pdf-download-screen {
    min-height: calc(100vh - 56px);
  }
  .doctor-pdf-download-screen h1 {
    font-size: 28px;
  }
}

@media print {
  @page {
    size: A4 portrait;
    margin: 12mm;
  }

  :root {
    --text: #22243a;
    --muted: #687386;
    --line: #d7e5ed;
    --primary: #006d95;
    --primary-dark: #005a7c;
    --primary-soft: #eefaff;
  }

  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  body {
    background: #fff;
    color: var(--text);
    font-size: 10.5pt;
  }

  .topbar,
  .nav-strip,
  .btn,
  .actions,
  .page-head,
  .package-list-toolbar,
  .no-print,
  .user-dropdown,
  .notification-dropdown,
  .notification-menu,
  .modal-backdrop {
    display: none !important;
  }

  .content {
    max-width: none;
    padding: 0;
  }

  .print-report-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0 0 18px;
    padding: 0 0 16px;
    border-bottom: 2px solid var(--primary);
  }

  .print-brand {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .print-brand-logo {
    width: 56px;
    height: 42px;
    object-fit: contain;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 5px;
    background: #fff;
  }

  .print-brand strong,
  .print-meta strong {
    display: block;
    font-size: 13pt;
  }

  .print-brand small,
  .print-meta span,
  .print-meta small {
    display: block;
    color: var(--muted);
    font-size: 8.5pt;
  }

  .print-meta {
    text-align: right;
  }

  .print-report-title {
    display: block;
    margin: 0 0 16px;
    padding: 16px 18px;
    border: 1px solid #cfeaf5;
    border-radius: 18px;
    background: linear-gradient(135deg, #f8fdff 0%, #ecf9ff 100%);
  }

  .print-report-title .eyebrow {
    margin: 0 0 8px;
    color: var(--primary-dark);
  }

  .print-report-title h1 {
    margin: 0;
    font-size: 24pt;
    line-height: 1.1;
  }

  .print-report-title p {
    margin: 8px 0 0;
    color: var(--muted);
  }

  .print-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 0 0 16px;
  }

  .print-summary-grid > div {
    min-height: 76px;
    padding: 14px;
    border: 1px solid var(--line);
    border-left: 4px solid var(--primary);
    border-radius: 16px;
    background: #fff;
  }

  .print-summary-grid span {
    display: block;
    color: var(--muted);
    font-weight: 700;
    font-size: 8.5pt;
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  .print-summary-grid strong {
    display: block;
    margin-top: 8px;
    font-size: 17pt;
    line-height: 1.1;
    color: var(--text);
  }

  .panel,
  .stat-card,
  .treatment-total-panel {
    box-shadow: none;
    break-inside: avoid;
  }

  .panel {
    margin: 0 0 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
  }

  .panel-head {
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
    background: #f8fbfd;
  }

  .table-wrap {
    overflow: visible;
  }

  table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
  }

  th {
    background: #f4f8fb;
    color: #59677c;
    font-size: 8.2pt;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  td {
    padding: 13px 14px;
    border-bottom: 1px solid #edf3f7;
    vertical-align: middle;
  }

  tr:last-child td {
    border-bottom: 0;
  }

  td strong {
    font-size: 10.5pt;
  }

  .badge {
    min-height: 24px;
    padding: 5px 9px;
    font-size: 8.5pt;
  }

  .stat-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
  }

  .stat-card {
    border-radius: 16px;
    border-left: 4px solid var(--primary);
    padding: 14px;
  }

  .stat-card span {
    font-size: 8.5pt;
  }

  .stat-card strong {
    font-size: 16pt !important;
  }
}

.badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: var(--pill);
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 700;
}
.badge-draft { background: #eef2f7; color: #475569; }
.badge-wait { background: #fff7ed; color: #c2410c; }
.badge-manager { background: #e0f2fe; color: #0369a1; }
.badge-final { background: #dcfce7; color: #047857; }
.badge-ok { background: #dcfce7; color: #047857; }
.badge-danger { background: #fee2e2; color: #b91c1c; }
.badge-revision { background: #f5f3ff; color: #7c3aed; }
.badge-warn { background: #fff8e8; color: #b45309; }
.badge-info { background: #edf5ff; color: #1d4ed8; }
.badge-muted { background: #f3f6fa; color: #64748b; }
.alert { border-radius: var(--pill); padding: 14px 18px; margin-bottom: 18px; font-weight: 700; }
.alert-error { background: #fef2f2; border: 1px solid #fecaca; color: #dc2626; }
.alert-success { background: #ecfdf5; border: 1px solid #bbf7d0; color: #047857; }
.alert-info { background: #eff6ff; border: 1px solid #bfdbfe; color: #1d4ed8; }
.package-existing-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px;
  border-color: #bfdbfe;
  background: #f8fbff;
}
.package-existing-notice h2 {
  margin: 0 0 8px;
  font-size: 20px;
}
.package-existing-notice p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}
.package-job-manage-panel .revision-edit-form {
  margin: 0;
}
.split-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }

@media (max-width: 1180px) {
  .dashboard-grid { grid-template-columns: 1fr; }
  .accounting-report-grid { grid-template-columns: 1fr; }
  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sms-config-list { grid-template-columns: 1fr; }
  .quick-access-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .doctor-detail-hero { grid-template-columns: 1fr; }
  .package-list-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .package-list-filter.leave-filter,
  .package-list-filter.leave-filter.has-branch { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .package-list-filter.leave-filter .leave-filter-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    min-width: 0;
  }
  .package-list-filter.surgical-list-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .revision-edit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .revision-edit-grid.accounting-single-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .skeleton-main-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .topbar { height: auto; padding: 16px; }
  .topbar-inner { flex-direction: column; align-items: stretch; gap: 14px; }
  .brand { min-width: 0; }
  .top-search { width: 100%; }
  .top-actions { margin-left: 0; justify-content: space-between; }
  .nav-inner { padding: 8px 16px; }
  .content { padding: 18px; }
  .page-head { flex-direction: column; align-items: flex-start; }
  .package-list-toolbar-head { flex-direction: column; align-items: flex-start; }
  .package-deadline-panel,
  .deadline-request-card {
    flex-direction: column;
    align-items: flex-start;
  }
  .package-deadline-panel .btn,
  .deadline-request-card .actions {
    width: 100%;
  }
  .deadline-request-card .actions {
    justify-content: flex-start;
  }
  .doctor-detail-filter { grid-template-columns: 1fr; }
  .doctor-detail-filter .actions { justify-content: flex-start; }
  .overview-grid, .stat-grid, .quick-access-grid, .form-grid, .checkbox-grid, .package-list-filter, .audit-filter-grid, .daily-ledger-board,
  .form-grid.technician-detail-filter,
  .revision-edit-grid.accounting-single-row { grid-template-columns: 1fr; }
  .package-list-filter.leave-filter,
  .package-list-filter.leave-filter.has-branch { grid-template-columns: 1fr; }
  .package-list-filter.surgical-list-filter { grid-template-columns: 1fr; }
  .daily-ledger-expenses {
    border-right: 0;
  }
  .daily-close-panel {
    align-items: stretch;
    flex-direction: column;
  }
  .daily-close-summary {
    justify-content: flex-start;
  }
  .package-list-filter .actions { justify-content: flex-start; flex-wrap: wrap; }
  .package-list-filter.leave-filter .leave-filter-actions { flex-wrap: wrap; }
  .technician-performance-panel {
    grid-template-columns: 1fr;
    align-items: flex-start;
  }
  .page-loading-overlay {
    inset: 0;
    padding: 18px;
  }
  .skeleton-actions {
    position: static;
    margin: 0 0 16px;
  }
  .skeleton-stat-grid,
  .skeleton-mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .performance-breakdown-panel {
    justify-content: flex-start;
  }
  .doctor-detail-metrics {
    grid-template-columns: 1fr;
  }
  .doctor-detail-metrics div + div {
    border-left: 0;
    border-top: 1px solid var(--line);
  }
  .login-screen {
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    padding: 28px;
  }
  .login-copy,
  .login-copy p,
  .stat-row {
    max-width: none;
  }
}

@media (max-width: 680px) {
  body { font-size: 13px; background: #f7f9fc; }
  .topbar {
    padding: 10px 12px;
    position: static;
  }
  .topbar-inner { gap: 12px; }
  .brand {
    min-width: 0;
    gap: 10px;
  }
  .brand-mark {
    width: 32px;
    height: 32px;
    border-radius: 12px;
  }
  .brand strong { font-size: 14px; }
  .brand small { display: none; }
  .top-search {
    order: 3;
    width: 100%;
    height: 38px;
  }
  .top-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
  }
  .top-user {
    justify-self: end;
    min-width: 0;
    min-height: 42px;
    padding: 4px 10px 4px 4px;
  }
  .avatar.small {
    width: 34px;
    height: 34px;
  }
  .top-user-info {
    max-width: 112px;
    overflow: hidden;
  }
  .top-user strong,
  .top-user small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .top-user small { display: none; }
  .nav-strip {
    position: sticky;
    top: 0;
    z-index: 9;
  }
  .nav-inner {
    padding: 8px 12px;
    gap: 8px;
    scrollbar-width: none;
  }
  .nav-spacer {
    display: none;
  }
  .nav-inner::-webkit-scrollbar { display: none; }
  .nav-inner a,
  .nav-group summary {
    min-height: 36px;
    padding: 8px 13px;
    font-size: 12.5px;
  }
  .nav-inner a.nav-utility-link {
    min-height: 38px;
    padding: 6px 12px 6px 7px;
    gap: 7px;
  }
  .nav-utility-icon {
    width: 24px;
    height: 24px;
    flex-basis: 24px;
  }
  .nav-utility-icon svg {
    width: 14px;
    height: 14px;
  }
  .nav-group-menu {
    min-width: 176px;
  }
  .skeleton-panel {
    min-height: 220px;
    padding: 20px;
  }
  .skeleton-stat-grid {
    grid-template-columns: 1fr;
  }
  .skeleton-stat-grid span {
    min-height: 76px;
  }
  .skeleton-table {
    min-height: 190px;
    padding: 16px;
  }
  .logout-link {
    margin-left: 0;
    flex: 0 0 auto;
  }
  .user-dropdown {
    right: 0;
    width: min(286px, calc(100vw - 24px));
  }
  .notification-dropdown {
    right: 0;
    width: min(360px, calc(100vw - 24px));
  }
  .content { padding: 16px 12px 24px; }
  .page-head {
    gap: 12px;
    margin-bottom: 12px;
  }
  .page-head h1 {
    font-size: 22px;
    line-height: 1.15;
  }
  .page-head > div > p:not(.eyebrow) {
    display: none;
  }
  .page-head .actions,
  .split-actions,
  .welcome-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }
  .page-head .actions .btn,
  .split-actions .btn,
  .welcome-actions .btn { width: 100%; }
  .welcome-card,
  .overview-card,
  .panel,
  .stat-card {
    border-radius: 14px;
    box-shadow: 0 6px 14px rgba(17,24,39,.04);
  }
  .welcome-card { padding: 16px; }
  .welcome-card h2 {
    font-size: 20px;
    line-height: 1.2;
  }
  .welcome-card p,
  .activity-card {
    display: none;
  }
  .welcome-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .overview-card {
    padding: 14px;
  }
  .overview-grid,
  .stat-grid,
  .quick-access-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .accounting-stat-grid {
    grid-template-columns: 1fr;
  }
  .accounting-branch-switcher {
    margin: -2px 0 12px;
  }
  .accounting-branch-chip {
    min-width: 132px;
    padding: 10px 12px;
  }
  .accounting-report-panel {
    padding: 14px;
  }
  .accounting-bar-row {
    grid-template-columns: 1fr;
    gap: 7px;
    padding: 9px 0;
  }
  .accounting-bar-values {
    text-align: left;
    white-space: normal;
  }
  .accounting-report-table th,
  .accounting-report-table td,
  .accounting-report-table td:last-child {
    min-width: 0;
    white-space: normal;
  }
  .accounting-submission-item {
    grid-template-columns: 32px minmax(0, 1fr);
    gap: 10px;
  }
  .accounting-submission-icon {
    width: 32px;
    height: 32px;
  }
  .accounting-submission-item small {
    grid-column: 2;
  }
  .daily-branch-grid {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .daily-branch-card {
    min-height: auto;
    padding: 14px;
  }
  .daily-record-grid {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .transfer-batch-grid {
    grid-template-columns: 1fr;
    padding: 10px;
  }
  .daily-record-card {
    padding: 14px;
  }
  .transfer-batch-card {
    padding: 14px;
  }
  .daily-record-card header {
    grid-template-columns: 1fr;
  }
  .transfer-batch-card header {
    grid-template-columns: 1fr;
  }
  .daily-record-balance {
    min-width: 0;
    text-align: left;
  }
  .daily-record-main {
    grid-template-columns: 1fr;
  }
  .transfer-batch-main {
    grid-template-columns: 1fr;
  }
  .overview-grid {
    gap: 8px;
  }
  .overview-grid div,
  .stat-card {
    padding: 12px;
    border-radius: 12px;
  }
  .overview-grid strong,
  .stat-card strong {
    font-size: 21px;
    margin-top: 4px;
  }
  .overview-grid small,
  .stat-card small {
    display: none;
  }
  .quick-access-grid {
    gap: 8px;
    margin-bottom: 14px;
  }
  .quick-access-card {
    min-height: 70px;
    grid-template-columns: 34px minmax(0, 1fr);
    column-gap: 10px;
    padding: 12px;
    border-radius: 12px;
  }
  .quick-access-icon {
    width: 34px;
    height: 34px;
  }
  .quick-access-icon svg {
    width: 18px;
    height: 18px;
  }
  .quick-access-card strong {
    font-size: 13px;
  }
  .quick-access-card small {
    display: none;
  }
  .panel-head {
    padding: 12px 14px;
    align-items: flex-start;
    flex-direction: column;
  }
  .panel-head p {
    display: none;
  }
  .summary-period-actions {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .summary-period-btn {
    min-width: 0;
  }
  .panel-head .btn { width: 100%; }
  .panel.form-grid,
  .panel.form-stack {
    padding: 14px !important;
  }
  .staff-form {
    padding: 12px;
    gap: 12px;
  }
  .staff-form-section {
    padding: 14px;
    gap: 12px;
  }
  .staff-form-section-head {
    align-items: flex-start;
    flex-direction: column;
    padding-bottom: 10px;
  }
  .staff-form-section-head h2 {
    font-size: 15px;
  }
  .staff-form-section-head small {
    white-space: normal;
  }
  .staff-form-grid,
  .staff-document-grid {
    grid-template-columns: 1fr;
  }
  .staff-row-actions {
    flex-wrap: wrap;
  }
  .branch-row-actions {
    flex-wrap: wrap;
  }
  .staff-detail-grid {
    grid-template-columns: 1fr;
  }
  .staff-detail-card {
    padding: 14px;
  }
  .staff-detail-list div,
  .staff-detail-document {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  .staff-detail-document .actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .staff-detail-document .actions .btn {
    width: 100%;
  }
  .staff-document-upload {
    border-radius: 12px;
    padding: 12px;
  }
  .staff-document-upload-head {
    grid-template-columns: 34px minmax(0, 1fr);
  }
  .staff-document-badge {
    grid-column: 2;
    justify-self: start;
  }
  .staff-document-icon {
    width: 34px;
    height: 34px;
  }
  .staff-document-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .staff-document-actions .btn,
  .staff-document-delete {
    width: 100%;
    justify-content: center;
  }
  .resource-upload-panel {
    padding: 14px;
  }
  .resource-grid {
    grid-template-columns: 1fr;
    padding: 10px;
    gap: 10px;
  }
  .resource-card {
    grid-template-columns: 1fr;
    padding: 14px;
    min-height: 0;
  }
  .resource-card-top {
    grid-template-columns: 58px minmax(0, 1fr);
    gap: 12px;
  }
  .resource-pdf-cover {
    width: 58px;
    min-height: 78px;
  }
  .resource-pdf-cover svg {
    width: 22px;
    height: 22px;
  }
  .resource-meta-list {
    grid-template-columns: 1fr;
  }
  .resource-card-foot {
    align-items: stretch;
    flex-direction: column;
  }
  .resource-card-foot > small {
    white-space: normal;
  }
  .resource-icon,
  .tool-drop-icon {
    width: 38px;
    height: 38px;
  }
  .resource-actions,
  .tool-converter-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .resource-actions .btn,
  .resource-actions form,
  .resource-actions button,
  .tool-converter-actions .btn {
    width: 100%;
  }
  .form-preview-card {
    height: min(720px, calc(100vh - 24px));
    padding: 14px;
  }
  .leave-document-preview-card {
    height: min(720px, calc(100vh - 24px));
    padding: 14px;
  }
  .leave-person-detail-card {
    overflow: auto;
  }
  .leave-person-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .leave-person-detail-filters {
    grid-template-columns: 1fr;
  }
  .leave-person-detail-filter-actions,
  .leave-person-detail-filter-actions .btn {
    width: 100%;
  }
  .form-preview-frame {
    min-height: 360px;
  }
  .leave-document-preview-frame {
    min-height: 360px;
  }
  .form-preview-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .leave-document-preview-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .form-preview-actions .btn,
  .leave-document-preview-actions .btn {
    width: 100%;
  }
  .tool-format-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .tool-choice-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .tool-choice-card {
    min-height: 126px;
    padding: 14px;
  }
  .tool-converter-form {
    padding: 12px;
  }
  .tool-step {
    padding: 14px;
  }
  .tool-step-head {
    align-items: flex-start;
  }
  .tool-drop-field {
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 14px;
  }
  .tool-file-chip {
    grid-column: 1 / -1;
    max-width: none;
    justify-content: flex-start;
  }
  .tool-drop-field input[type="file"] {
    grid-column: 1 / -1;
  }
  .daily-expense-row {
    grid-template-columns: minmax(0, 1fr) minmax(104px, 128px);
  }
  .daily-ledger-title {
    align-items: stretch;
    flex-direction: column;
  }
  .daily-expense-row .btn {
    grid-column: 1 / -1;
  }
  .daily-ledger-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .package-existing-notice {
    align-items: stretch;
    flex-direction: column;
  }
  .package-existing-notice .btn {
    width: 100%;
  }
  .important-note-list {
    padding: 0 16px 16px;
  }
  .important-note-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .treatment-total-panel {
    align-items: stretch;
    flex-direction: column;
    padding: 18px;
  }
  .treatment-total-values {
    justify-content: stretch;
  }
  .treatment-total-value {
    min-width: 0;
    width: 100%;
    text-align: left;
  }
  .treatment-total-value strong {
    font-size: 24px;
  }
  .revision-edit-head {
    align-items: stretch;
    flex-direction: column;
  }
  .revision-edit-head .btn { width: 100%; }
  .revision-edit-grid {
    grid-template-columns: 1fr;
  }
  .revision-edit-row > td {
    display: block;
    padding: 0;
  }
  .revision-edit-row > td::before {
    display: none;
  }
  .modal-backdrop { padding: 12px; }
  .pdf-modal-backdrop { padding: 12px; }
  .modal-card {
    border-radius: 20px;
    padding: 18px;
  }
  .leave-entry-modal-card {
    overflow: auto;
    padding: 14px;
  }
  .pdf-modal-card {
    border-radius: 22px;
    padding: 26px 18px 18px;
  }
  .pdf-modal-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .pdf-modal-actions .btn {
    width: 100%;
  }
  .modal-head h2 { font-size: 21px; }
  .modal-field-grid {
    grid-template-columns: 1fr;
  }
  .leave-modal-grid {
    grid-template-columns: 1fr;
  }
  .modal-form textarea {
    min-height: 118px;
    border-radius: 16px;
  }
  .leave-modal-grid textarea {
    min-height: 56px;
    height: 62px;
  }
  .leave-view-grid {
    grid-template-columns: 1fr;
  }
  .leave-view-grid > .span-2 {
    grid-column: auto;
  }
  .leave-person-detail-stats {
    grid-template-columns: 1fr;
  }
  .leave-person-detail-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
  .leave-row-actions {
    display: grid;
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .leave-row-actions .btn.small {
    width: 100%;
  }
  .leave-row-actions form {
    width: 100%;
  }
  .modal-form .split-actions {
    grid-template-columns: 1fr 1fr;
  }
  input, select, textarea,
  .custom-select-trigger {
    min-height: 46px;
  }
  .custom-select-menu {
    border-radius: 16px;
    max-height: var(--custom-select-menu-height, 220px);
  }
  .month-picker-menu {
    width: min(330px, calc(100vw - 24px));
    border-radius: 16px;
  }
  .date-picker-menu {
    width: min(342px, calc(100vw - 24px));
    border-radius: 16px;
  }
  .tooth-modal-card {
    max-height: calc(100vh - 24px);
    border-radius: 20px;
    padding: 18px;
  }
  .tooth-picker {
    padding: 12px;
  }
  .tooth-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .tooth-divider {
    width: 100%;
    height: 1px;
    background: #e85b5b;
  }
  .tooth-side,
  .tooth-side.compact {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-inline: 0;
  }
  .jaw-selection-grid {
    grid-template-columns: 1fr;
  }
  .surgical-region-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .surgical-material-picker,
  .surgical-option-board,
  .surgical-option-add,
  .surgical-option-edit,
  .surgical-option-row {
    grid-template-columns: 1fr;
  }
  .surgical-material-options {
    grid-template-columns: 1fr;
  }
  .surgical-option-row form,
  .surgical-option-row .btn,
  .surgical-option-add .btn,
  .surgical-option-edit .btn {
    width: 100%;
  }
  .tooth-summary {
    align-items: flex-start;
    flex-direction: column;
  }
  .checkbox-grid { gap: 8px; }
  .check-row {
    align-items: flex-start;
    border-radius: 16px;
  }
  .table-wrap {
    overflow: visible;
  }
  table,
  thead,
  tbody,
  tfoot,
  tr,
  td {
    display: block;
    width: 100%;
  }
  thead { display: none; }
  tbody {
    display: grid;
    gap: 8px;
    padding: 8px;
  }
  tbody tr {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 10px 12px;
    box-shadow: 0 6px 14px rgba(17,24,39,.04);
  }
  tbody tr:hover { background: #fff; }
  tfoot {
    padding: 0 10px 10px;
  }
  tfoot tr {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
  }
  td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 0;
    padding: 4px 0;
    min-height: 0;
    font-size: 12.5px;
  }
  td:last-child { border-bottom: 0; }
  td::before {
    content: attr(data-label);
    flex: 0 0 auto;
    min-width: 82px;
    max-width: 42%;
    color: #98a2b3;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
  }
  td.empty {
    display: block;
    text-align: center;
    padding: 22px 12px;
  }
  td.empty::before { content: ""; display: none; }
  .package-lab-total-row td::before {
    content: "";
    display: none;
  }
  .package-lab-total-row td:last-child {
    display: none;
  }
  td.mobile-form-cell {
    display: block;
  }
  td.mobile-form-cell::before {
    display: block;
    max-width: none;
    margin-bottom: 7px;
  }
  td.mobile-action-cell {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  td.mobile-action-cell::before {
    max-width: none;
  }
  td.mobile-action-cell .actions,
  td.mobile-action-cell .btn,
  td.mobile-action-cell form,
  td.mobile-action-cell button {
    width: 100%;
  }
  table:not(.job-entry-table):not(.transfer-entry-table):not(.salary-entry-table):not(.stock-request-entry-table):not(.permission-table) tbody td:first-child {
    justify-content: flex-start;
    font-size: 14px;
    font-weight: 800;
  }
  table:not(.job-entry-table):not(.transfer-entry-table):not(.salary-entry-table):not(.stock-request-entry-table):not(.permission-table) tbody td:first-child::before {
    display: none;
  }
  table:not(.job-entry-table):not(.transfer-entry-table):not(.salary-entry-table):not(.stock-request-entry-table):not(.permission-table) tbody td:nth-child(n+4):not(:last-child):not(:nth-last-child(2)) {
    display: none;
  }
  table:not(.job-entry-table):not(.transfer-entry-table):not(.salary-entry-table):not(.stock-request-entry-table):not(.permission-table) tbody td:nth-last-child(2) {
    display: flex;
  }
  .daily-data-table tbody td,
  .transfer-data-table tbody td,
  .salary-advance-table tbody td {
    display: none;
  }
  .daily-data-table tbody td:nth-child(1),
  .daily-data-table tbody td:nth-child(3),
  .daily-data-table tbody td:nth-child(8),
  .daily-data-table tbody td:nth-child(10),
  .daily-data-table tbody td:nth-child(12),
  .daily-data-table tbody td:last-child,
  .transfer-data-table tbody td:nth-child(1),
  .transfer-data-table tbody td:nth-child(4),
  .transfer-data-table tbody td:nth-child(6),
  .transfer-data-table tbody td:nth-child(7),
  .transfer-data-table tbody td:last-child,
  .salary-advance-table tbody td:nth-child(1),
  .salary-advance-table tbody td:nth-child(3),
  .salary-advance-table tbody td:nth-child(5),
  .salary-advance-table tbody td:last-child {
    display: flex;
  }
  .transfer-detail-table tbody td {
    display: flex;
  }
  .salary-row-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
  .salary-row-actions::before {
    display: none;
  }
  .salary-row-actions .btn,
  .salary-row-actions form,
  .salary-row-actions button {
    width: 100%;
  }
  .daily-data-table,
  .transfer-data-table,
  .salary-advance-table {
    min-width: 0;
  }
  .daily-data-table th,
  .daily-data-table td,
  .transfer-data-table th,
  .transfer-data-table td,
  .salary-advance-table th,
  .salary-advance-table td {
    white-space: normal;
  }
  .badge,
  .staff-status {
    min-height: 24px;
    padding: 5px 9px;
    font-size: 11px;
  }
  .permission-name {
    min-width: 0;
  }
  .permission-cell {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .permission-cell::before {
    margin-bottom: 0;
  }
  .permission-toggle {
    min-width: 112px;
    justify-content: flex-start;
  }
  .stat-grid { gap: 8px; }
  .login-copy h1 { font-size: 34px; }
  .stat-row { grid-template-columns: 1fr; }
  .stat-row div { min-height: 68px; }
}

@media (max-width: 420px) {
  .top-actions {
    justify-content: stretch;
  }
  .notification-menu { flex: 0 0 auto; }
  .top-user-menu { flex: 1 1 auto; min-width: 0; }
  .top-user {
    width: 100%;
    justify-content: flex-start;
    border-color: var(--line);
    background: #fff;
  }
  .top-user-info { max-width: none; }
  .user-caret { margin-left: auto; }
  .user-dropdown {
    left: 0;
    right: 0;
    width: 100%;
  }
  .notification-dropdown {
    left: 0;
    right: auto;
    width: min(320px, calc(100vw - 24px));
  }
  .page-head h1 { font-size: 23px; }
  .overview-grid { gap: 8px; }
  td {
    display: flex;
    align-items: flex-start;
  }
  .permission-cell {
    display: block;
  }
  .permission-cell .permission-toggle {
    width: 100%;
  }
  td::before {
    display: inline-block;
    max-width: none;
    margin-bottom: 0;
  }
  td.mobile-form-cell {
    display: block;
  }
  td.mobile-action-cell {
    display: grid;
  }
}

.modal-card.leave-person-detail-card {
  width: min(980px, calc(100vw - 28px));
  max-height: calc(100vh - 32px);
  overflow: hidden;
  padding: 20px;
}
.modal-card.leave-person-detail-card .leave-person-detail-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}
.modal-card.leave-person-detail-card .leave-person-detail-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}
.modal-card.leave-person-detail-card .leave-person-detail-table th,
.modal-card.leave-person-detail-card .leave-person-detail-table td {
  display: table-cell;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width: 760px) {
  .modal-card.leave-person-detail-card {
    width: calc(100vw - 20px);
    padding: 14px;
    gap: 10px;
  }
  .modal-card.leave-person-detail-card .leave-person-detail-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .modal-card.leave-person-detail-card .leave-person-detail-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .modal-card.leave-person-detail-card .leave-person-detail-filter-actions {
    grid-column: 1 / -1;
  }
  .modal-card.leave-person-detail-card .leave-person-detail-filter-actions .btn {
    width: 100%;
  }
  .modal-card.leave-person-detail-card .leave-person-detail-table th,
  .modal-card.leave-person-detail-card .leave-person-detail-table td {
    padding: 10px 8px;
    font-size: 12px;
  }
}

@media (max-width: 560px) {
  .modal-card.leave-person-detail-card .leave-person-detail-stats,
  .modal-card.leave-person-detail-card .leave-person-detail-filters {
    grid-template-columns: 1fr;
  }
  .modal-card.leave-person-detail-card .leave-person-detail-table th:nth-child(4),
  .modal-card.leave-person-detail-card .leave-person-detail-table td:nth-child(4),
  .modal-card.leave-person-detail-card .leave-person-detail-table th:nth-child(5),
  .modal-card.leave-person-detail-card .leave-person-detail-table td:nth-child(5) {
    display: none;
  }
}

.inline-check-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border: 1px solid #d7e7ef;
  border-radius: 16px;
  background: #f8fcff;
}
.inline-check-card input {
  margin-top: 4px;
}
.inline-check-card strong,
.inline-check-card small {
  display: block;
}
.inline-check-card small {
  margin-top: 4px;
  color: var(--muted);
  line-height: 1.45;
}
.user-warehouse-field {
  display: grid;
  gap: 8px;
}

.stock-toolbar {
  padding: 18px 20px;
}
.stock-command-bar {
  justify-content: flex-start;
  gap: 10px;
}
.stock-command-bar .btn {
  min-width: 150px;
  min-height: 44px;
  font-size: 14px;
}
.stock-stat-grid {
  display: none;
}
.stock-card-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.stock-home-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
[data-stock-view].is-stock-branch-loading {
  opacity: .72;
  pointer-events: none;
}
.stock-home-grid .stock-overview-card {
  min-height: 132px;
}
.stock-overview-card {
  min-height: 112px;
}
.stock-overview-card .quick-access-icon {
  color: var(--quick-access-color, var(--primary));
}
.stock-overview-card .quick-access-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.stock-overview-card small {
  white-space: normal;
}
.package-list-filter.stock-filter {
  grid-template-columns: minmax(210px, 1fr) minmax(170px, .75fr) auto;
}
.package-list-filter.stock-filter.has-branch {
  grid-template-columns: minmax(190px, .9fr) minmax(150px, .7fr) minmax(230px, 1.15fr) auto;
}
.stock-filter-actions {
  justify-content: flex-end;
  flex-wrap: nowrap;
}
.stock-stat-grid {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.stat-card.accent-purple::before { background: #8b5cf6; }

.stock-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
  margin-bottom: 22px;
}
.stock-action-card {
  padding: 20px;
  display: grid;
  gap: 14px;
}
.stock-action-card h2 {
  margin: 0 0 4px;
  font-size: 18px;
}
.stock-action-card p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
}
.stock-action-card textarea {
  min-height: 96px;
  resize: vertical;
}
.stock-request-list-card {
  grid-column: 1 / -1;
}
.stock-action-head {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}
.stock-action-icon {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid #cceaf6;
  background: #eefaff;
  color: var(--primary);
}
.stock-action-icon svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.stock-icon-material { color: #0e7490; background: #ecfeff; border-color: #bae6fd; }
.stock-icon-movement { color: #047857; background: #ecfdf5; border-color: #bbf7d0; }
.stock-icon-request { color: #c2410c; background: #fff7ed; border-color: #fed7aa; }
.stock-request-entry-head {
  padding: 0;
  border: 0;
}
.stock-request-entry-head h3 {
  margin: 0 0 4px;
  font-size: 15px;
  color: var(--text);
}
.stock-request-entry-table {
  min-width: 760px;
}
.stock-request-entry-table th,
.stock-request-entry-table td {
  padding: 10px;
  vertical-align: middle;
}
.stock-request-entry-table th:first-child,
.stock-request-entry-table td:first-child {
  width: 42%;
}
.stock-request-entry-table th:last-child,
.stock-request-entry-table td:last-child {
  width: 74px;
  text-align: right;
}
.stock-request-entry-table input,
.stock-request-entry-table .custom-select {
  width: 100%;
  min-width: 0;
}
.stock-two-col {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1fr);
  gap: 12px;
}
.stock-form-actions {
  gap: 10px;
  flex-wrap: wrap;
}
.stock-quantity {
  min-width: 76px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 11px;
  border-radius: var(--pill);
  background: #dcfce7;
  color: #047857;
  font-weight: 900;
}
.stock-quantity.stock-empty {
  background: #f3f6fa;
  color: #64748b;
}
.stock-request-actions {
  flex-wrap: nowrap;
}
.stock-request-actions form {
  margin: 0;
}
.stock-request-send-form {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.stock-request-quantity-input {
  width: 96px;
  min-height: 34px;
  padding: 6px 10px;
}
.stock-row-actions {
  flex-wrap: nowrap;
}
.stock-row-actions form {
  margin: 0;
}
.stock-row-actions .btn.small {
  min-height: 34px;
}
.muted-text {
  color: var(--muted);
}
.stock-table td,
.stock-material-table td,
.stock-request-table td,
.stock-movement-table td {
  vertical-align: middle;
}

@media (max-width: 980px) {
  .stock-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .package-list-filter.stock-filter,
  .package-list-filter.stock-filter.has-branch {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .stock-filter-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 640px) {
  .package-list-filter.stock-filter,
  .package-list-filter.stock-filter.has-branch,
  .stock-card-grid,
  .stock-action-grid,
  .stock-two-col {
    grid-template-columns: 1fr;
  }
  .page-head .stock-command-bar,
  .stock-command-bar {
    width: 100%;
  }
  .stock-command-bar .btn {
    width: 100%;
  }
  .stock-filter-actions .btn,
  .stock-action-card .btn {
    width: 100%;
  }
  .stock-request-actions {
    flex-wrap: wrap;
  }
  .stock-request-send-form {
    flex-wrap: wrap;
  }
  .stock-row-actions {
    flex-wrap: wrap;
  }
}