:root {
  --bg: #f5f7f8;
  --surface: #ffffff;
  --surface-soft: #eef3f2;
  --ink: #182024;
  --muted: #66747b;
  --line: #d9e0e3;
  --teal: #0f766e;
  --teal-strong: #0a5e58;
  --coral: #d94f44;
  --amber: #b7791f;
  --blue: #3267a8;
  --ok: #1f8a5b;
  --warn: #a46513;
  --bad: #b8332f;
  --shadow: 0 18px 50px rgba(24, 32, 36, 0.08);
  --radius: 8px;
  font-family:
    Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  border: 0;
  cursor: pointer;
}

button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.loading-shell {
  display: grid;
  min-height: 100vh;
  place-content: center;
  gap: 8px;
  color: var(--muted);
  text-align: center;
}

.loading-logo {
  width: min(300px, 76vw);
  height: auto;
  justify-self: center;
}

.login-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: #eef3f2;
}

.login-card {
  width: min(420px, 100%);
  display: grid;
  gap: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 24px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(15, 23, 42, 0.12);
}

.login-card h1 {
  margin: 0 0 4px;
  font-size: 1.55rem;
}

.login-card p {
  margin: 0;
  color: var(--muted);
}

.login-card .loading-logo {
  width: min(260px, 76%);
}

.app-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
}

.app-version-badge {
  color: #334047;
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1.2;
  pointer-events: none;
  white-space: nowrap;
}

.app-version-badge--fixed {
  position: fixed;
  left: 12px;
  bottom: 10px;
  z-index: 45;
}

.app-version-badge--sidebar {
  align-self: end;
  margin: 0 16px 16px;
}

.topbar {
  position: sticky;
  top: 0;
  align-self: start;
  z-index: 40;
  height: 100vh;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  border-right: 1px solid var(--line);
  background: rgba(245, 247, 248, 0.94);
  backdrop-filter: blur(14px);
}

.topbar-inner {
  width: auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: stretch;
  padding: 18px 14px 12px;
}

.brand {
  display: flex;
  align-items: center;
  min-width: 0;
}

.brand-logo-img {
  display: block;
  width: min(205px, 100%);
  min-width: 0;
  height: auto;
  max-height: 58px;
  object-fit: contain;
}

.brand h1 {
  margin: 0;
  font-size: clamp(1.35rem, 2vw, 2rem);
  line-height: 1.1;
  letter-spacing: 0;
}

.brand span {
  color: var(--muted);
  font-size: 0.94rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.top-actions {
  display: grid;
  grid-template-columns: 42px;
  gap: 8px;
  align-items: stretch;
}

.top-actions .btn {
  width: 100%;
  min-height: 38px;
  padding-inline: 10px;
}

.top-actions .btn.ghost {
  grid-column: 1 / -1;
}

.sidebar-footer-actions {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  border-top: 1px solid rgba(217, 224, 227, 0.85);
  padding-top: 12px;
}

.sidebar-footer-actions .btn {
  width: 100%;
  min-height: 38px;
  justify-content: flex-start;
}

.sidebar-footer-actions .btn.ghost {
  color: var(--muted);
}

.notification-area {
  position: relative;
}

.notification-area .icon-btn {
  width: 42px;
  height: 38px;
}

.topbar-tabs {
  min-height: 0;
  width: auto;
  margin: 0;
  padding: 0 12px 18px;
  overflow-y: auto;
}

.notification-button {
  position: relative;
  font-size: 1.05rem;
  overflow: visible;
}

.notification-button.has-unread {
  border-color: rgba(184, 51, 47, 0.32);
  color: var(--bad);
  background: rgba(184, 51, 47, 0.08);
  box-shadow: 0 0 0 4px rgba(184, 51, 47, 0.08);
}

.notification-button.has-unread::after {
  content: "";
  position: absolute;
  inset: -5px;
  border: 1px solid rgba(184, 51, 47, 0.32);
  border-radius: 10px;
  animation: notificationPulse 1.8s ease-out infinite;
}

.notification-bell {
  display: inline-block;
  transform-origin: 50% 8%;
}

.notification-button.has-unread .notification-bell {
  animation: notificationRing 1.2s ease-in-out infinite;
}

.notification-button.sound-muted {
  color: var(--muted);
}

.notification-muted-mark {
  position: absolute;
  right: 8px;
  bottom: 6px;
  color: var(--bad);
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
  transform: rotate(20deg);
}

.notification-badge {
  position: absolute;
  top: -7px;
  right: -7px;
  min-width: 21px;
  height: 21px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--surface);
  border-radius: 999px;
  padding: 0 5px;
  color: #fff;
  background: var(--bad);
  font-size: 0.72rem;
  font-weight: 800;
  box-shadow: 0 6px 16px rgba(184, 51, 47, 0.28);
}

@keyframes notificationRing {
  0%, 100% { transform: rotate(0deg); }
  12% { transform: rotate(15deg); }
  24% { transform: rotate(-14deg); }
  36% { transform: rotate(9deg); }
  48% { transform: rotate(-6deg); }
  60% { transform: rotate(3deg); }
}

@keyframes notificationPulse {
  0% {
    opacity: 0.75;
    transform: scale(0.94);
  }
  100% {
    opacity: 0;
    transform: scale(1.16);
  }
}

@media (prefers-reduced-motion: reduce) {
  .notification-button.has-unread::after,
  .notification-button.has-unread .notification-bell {
    animation: none;
  }
}

.notification-panel {
  position: fixed;
  top: 72px;
  left: 16px;
  z-index: 70;
  width: min(440px, calc(100vw - 32px));
  max-height: min(640px, calc(100vh - 112px));
  display: grid;
  gap: 10px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 12px;
  background: var(--surface);
  box-shadow: var(--shadow);
}

.notification-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.notification-head div {
  display: grid;
  gap: 2px;
}

.notification-head span,
.notification-copy small {
  color: var(--muted);
  font-size: 0.8rem;
}

.notification-read-all {
  min-height: 28px;
  padding-inline: 8px;
}

.notification-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px 8px;
  background: #fbfcfc;
}

.notification-control-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.notification-controls span {
  color: var(--muted);
  font-size: 0.78rem;
  white-space: nowrap;
}

.notification-sound-toggle {
  min-height: 28px;
  width: auto;
  padding-inline: 8px;
}

.notification-controls .btn.small {
  min-height: 28px;
  width: auto;
  padding: 0 8px;
  font-size: 0.8rem;
}

.notification-list {
  display: grid;
  gap: 8px;
}

.notification-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 10px;
  background: var(--surface-soft);
}

.notification-item.unread {
  border-color: rgba(184, 51, 47, 0.26);
  background: #fff5f3;
}

.notification-item.cash-shift {
  border-color: rgba(184, 51, 47, 0.46);
  background: #fff1f0;
}

.notification-item.cash-shift .notification-copy strong {
  color: #8f1d1b;
}

.notification-item.birthday {
  border-color: rgba(183, 121, 31, 0.28);
  background: #fff8ed;
}

.notification-item.birthday.unread {
  border-color: rgba(183, 121, 31, 0.44);
}

.notification-item.reduniq-payment {
  border-color: rgba(31, 138, 91, 0.28);
  background: #f1fbf6;
}

.notification-item.reduniq-payment.unread {
  border-color: rgba(31, 138, 91, 0.46);
}

.notification-item.reduniq-payment .notification-copy strong {
  color: #0f6841;
}

.notification-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.notification-copy span {
  color: var(--muted);
  font-size: 0.88rem;
  overflow-wrap: anywhere;
}

.notification-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.notification-empty {
  border: 1px dashed var(--line);
  border-radius: 6px;
  padding: 16px;
  color: var(--muted);
  text-align: center;
}

.notification-panel-footer {
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.notification-panel-footer .btn {
  width: 100%;
  min-height: 38px;
}

.notification-center-view {
  display: grid;
  gap: 18px;
}

.notification-center-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
}

.notification-center-header h2 {
  margin: 4px 0 4px;
}

.notification-center-header p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
}

.notification-center-header-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.notification-center-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.notification-center-metrics article {
  display: grid;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: var(--surface);
}

.notification-center-metrics span {
  color: var(--muted);
  font-size: 0.84rem;
}

.notification-center-metrics strong {
  color: var(--text);
  font-size: 1.75rem;
  line-height: 1;
}

.notification-center-metrics article.attention {
  border-color: rgba(184, 51, 47, 0.24);
  background: #fff6f4;
}

.notification-center-metrics article.warning {
  border-color: rgba(183, 121, 31, 0.28);
  background: #fff8ed;
}

.notification-center-panel {
  display: grid;
  gap: 12px;
}

.notification-center-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  gap: 12px;
  align-items: center;
}

.notification-center-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.notification-center-filter {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 12px;
  color: var(--muted);
  background: var(--surface-soft);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.notification-center-filter strong {
  min-width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0 7px;
  color: var(--muted);
  background: #fff;
  font-size: 0.78rem;
}

.notification-center-filter.active {
  border-color: rgba(13, 125, 116, 0.36);
  color: var(--primary);
  background: rgba(13, 125, 116, 0.08);
}

.notification-center-filter.active strong {
  color: #fff;
  background: var(--primary);
}

.notification-center-search {
  min-width: 0;
}

.notification-center-list {
  display: grid;
  gap: 10px;
}

.notification-center-item {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line);
  border-left: 4px solid #cbd5d8;
  border-radius: 8px;
  padding: 12px;
  background: var(--surface);
}

.notification-center-item.unread {
  background: #fffafa;
}

.notification-center-item--confirmed {
  border-left-color: var(--good);
}

.notification-center-item--cancelled {
  border-left-color: var(--bad);
}

.notification-center-item--reschedule,
.notification-center-item--birthday {
  border-left-color: #b7791f;
}

.notification-center-item--clinical {
  border-left-color: #4f46e5;
}

.notification-center-item--payment {
  border-left-color: #1f8a5b;
  background: #f4fbf7;
}

.notification-center-item--reminder {
  border-left-color: #52646b;
}

.notification-center-icon {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  color: var(--primary);
  background: rgba(13, 125, 116, 0.1);
  font-weight: 900;
}

.notification-center-item--cancelled .notification-center-icon {
  color: var(--bad);
  background: rgba(184, 51, 47, 0.1);
}

.notification-center-item--reschedule .notification-center-icon,
.notification-center-item--birthday .notification-center-icon {
  color: #9a5b12;
  background: rgba(183, 121, 31, 0.12);
}

.notification-center-item--clinical .notification-center-icon {
  color: #4338ca;
  background: rgba(79, 70, 229, 0.1);
}

.notification-center-item--payment .notification-center-icon {
  color: #0f6841;
  background: rgba(31, 138, 91, 0.12);
}

.notification-center-item--reminder .notification-center-icon {
  color: #44545b;
  background: rgba(82, 100, 107, 0.11);
}

.notification-center-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.notification-center-title-row,
.notification-center-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.notification-center-title-row span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  text-transform: uppercase;
}

.notification-center-title-row strong,
.notification-center-title-row em {
  border-radius: 999px;
  padding: 2px 7px;
  font-size: 0.72rem;
  font-style: normal;
  font-weight: 800;
}

.notification-center-title-row strong {
  color: #fff;
  background: var(--bad);
}

.notification-center-title-row em {
  color: var(--muted);
  background: var(--surface-soft);
}

.notification-center-copy h3 {
  margin: 0;
  font-size: 1rem;
}

.notification-center-copy p {
  margin: 0;
  color: var(--text);
  overflow-wrap: anywhere;
}

.notification-center-meta {
  color: var(--muted);
  font-size: 0.82rem;
}

.notification-center-item-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.main {
  width: 100%;
  min-width: 0;
  max-width: 1440px;
  margin: 0;
  padding: 22px clamp(16px, 3vw, 36px) 42px;
}

.status-view {
  display: grid;
  gap: 14px;
}

.status-heading {
  box-shadow: 0 10px 24px rgba(24, 32, 36, 0.04);
}

.status-heading .panel-header {
  margin-bottom: 0;
}

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

.status-view .metrics {
  margin-bottom: 0;
}

.metric {
  min-height: 96px;
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: 0 10px 24px rgba(24, 32, 36, 0.04);
}

.metric span {
  display: block;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
}

.metric strong {
  display: block;
  margin-top: 10px;
  font-size: clamp(1.4rem, 3vw, 2.1rem);
  line-height: 1;
}

.metric small {
  display: block;
  margin-top: 7px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.tabs {
  display: grid;
  gap: 5px;
  overflow: visible;
  padding: 0;
  margin-bottom: 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.topbar-tabs .tabs {
  margin-bottom: 0;
  box-shadow: none;
}

.tab-button {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 14px;
  border-radius: 6px;
  color: var(--muted);
  background: transparent;
  white-space: nowrap;
  text-align: left;
  text-decoration: none;
}

.tab-button--settings {
  margin-top: 10px;
}

.tab-button.active {
  color: #fff;
  background: var(--teal);
  font-weight: 800;
}

.tab-button:hover {
  background: rgba(15, 118, 110, 0.08);
  color: var(--teal);
}

.tab-button.active:hover {
  color: #fff;
  background: var(--teal);
}

.tab-button.cash-shift-closed {
  color: #a3211f;
  border: 1px solid rgba(214, 69, 65, 0.48);
  background: #fff1f0;
}

.tab-button.cash-shift-closed:hover,
.tab-button.cash-shift-closed.active,
.tab-button.cash-shift-closed.active:hover {
  color: #fff;
  border-color: #b42318;
  background: #b42318;
}

.tab-button.cash-shift-open {
  color: #047857;
  border: 1px solid rgba(4, 120, 87, 0.3);
  background: #e8f8f1;
}

.tab-button.cash-shift-open:hover,
.tab-button.cash-shift-open.active,
.tab-button.cash-shift-open.active:hover {
  color: #fff;
  border-color: #0f766e;
  background: #0f766e;
}

.tab-button--nested {
  min-height: 34px;
  padding-left: 16px;
  font-size: 0.94rem;
}

.sidebar-menu-group {
  display: grid;
  gap: 6px;
  margin: 4px 0;
  padding: 0;
}

.sidebar-menu-heading {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0 12px;
  color: var(--ink);
  background: transparent;
  font-size: 0.96rem;
  font-weight: 900;
  text-align: left;
}

.sidebar-menu-group.active .sidebar-menu-heading {
  border-color: var(--ink);
  color: var(--ink);
  background: #fff;
}

.sidebar-menu-group.open:not(.active) .sidebar-menu-heading,
.sidebar-menu-heading:hover {
  border-color: rgba(15, 118, 110, 0.22);
  color: var(--teal);
  background: rgba(15, 118, 110, 0.06);
}

.sidebar-menu-chevron {
  color: inherit;
  font-size: 0.86rem;
  line-height: 1;
}

.sidebar-subtabs {
  display: grid;
  gap: 3px;
  margin-left: 12px;
  padding-left: 10px;
  border-left: 1px solid rgba(15, 118, 110, 0.18);
}

.sidebar-subtabs .tab-button:not(.active) {
  background: #fff;
}

.sidebar-subtabs[hidden] {
  display: none;
}

.view-grid {
  display: grid;
  grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.panel,
.item,
.table-panel {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.panel {
  padding: 18px;
}

.panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.panel-header h2,
.panel h2 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.2;
  letter-spacing: 0;
}

.panel-header small,
.panel > small {
  color: var(--muted);
}

.stack {
  display: grid;
  gap: 12px;
}

.item-list {
  display: grid;
  gap: 12px;
}

.management-item {
  display: grid;
  gap: 12px;
}

.management-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 8px;
}

.compact-field {
  min-width: 170px;
  max-width: 210px;
}

.settings-subsection {
  display: grid;
  gap: 12px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.settings-subsection h3 {
  margin: 0 0 4px;
}

.settings-card {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfcfc;
}

.routine-workflow-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  align-items: end;
}

.routine-workflow-options {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.routine-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.routine-transfer-grid {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(240px, 1fr) auto minmax(240px, 1fr);
  gap: 12px;
  align-items: stretch;
}

.routine-transfer-actions {
  display: grid;
  gap: 8px;
  align-content: center;
  justify-items: stretch;
}

.routine-transfer-select {
  min-height: 260px;
}

.item {
  padding: 14px;
}

.attendance-view {
  display: grid;
  gap: 16px;
}

.attendance-layout {
  display: grid;
  grid-template-columns: minmax(240px, 330px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.attendance-client-list,
.attendance-workspace,
.attendance-item,
.attendance-block,
.attendance-line-list {
  display: grid;
  gap: 10px;
}

.attendance-client-list {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.attendance-client-list-heading {
  display: grid;
  gap: 2px;
}

.attendance-client-list-heading small,
.attendance-batch-action small {
  color: var(--muted);
}

.attendance-client-select-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  gap: 7px;
  align-items: stretch;
}

.attendance-batch-toggle {
  width: 40px;
  min-width: 40px;
  border: 1px solid rgba(15, 118, 110, 0.28);
  border-radius: 8px;
  color: var(--teal);
  background: rgba(15, 118, 110, 0.06);
  font-size: 1.2rem;
  font-weight: 800;
  cursor: pointer;
}

.attendance-batch-toggle:hover,
.attendance-batch-toggle.selected {
  color: #fff;
  background: var(--teal);
}

.attendance-batch-action {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid rgba(15, 118, 110, 0.26);
  border-radius: 8px;
  background: rgba(15, 118, 110, 0.06);
}

.attendance-client-card,
.attendance-line {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.attendance-client-card {
  width: 100%;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.attendance-client-card.selected {
  border-color: rgba(15, 118, 110, 0.36);
  background: rgba(15, 118, 110, 0.08);
}

.attendance-check-line {
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: start;
  cursor: pointer;
}

.attendance-check-line input {
  width: 16px;
  height: 16px;
  margin-top: 3px;
  accent-color: var(--teal);
}

.attendance-client-card span,
.attendance-client-card small,
.attendance-line small {
  color: var(--muted);
}

.attendance-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.attendance-block {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.attendance-line.balance {
  border-color: rgba(15, 118, 110, 0.24);
  background: rgba(15, 118, 110, 0.06);
}

.attendance-notice {
  box-shadow: none;
}

.cash-summary > span {
  color: var(--teal);
  font-size: 1.3rem;
  font-weight: 900;
}

.cash-summary {
  min-width: 0;
  overflow: hidden;
}

.cash-total-discount {
  display: grid;
  gap: 6px;
  margin: 8px 0 4px;
}

.cash-total-discount > label {
  font-weight: 800;
  font-size: 0.78rem;
}

.cash-discount-inline {
  display: grid;
  grid-template-columns: 74px minmax(0, 1fr);
  gap: 6px;
  align-items: center;
}

.cash-payment-summary--discount strong {
  font-variant-numeric: tabular-nums;
}

.cash-shift-panel {
  display: grid;
  gap: 14px;
}

.cash-movements-modal {
  width: min(1120px, calc(100vw - 28px));
}

.cash-movements-modal .cash-shift-panel {
  box-shadow: none;
}

.cash-shift-open-form,
.cash-shift-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
  gap: 12px;
  align-items: end;
}

.cash-shift-open-form {
  grid-template-columns: minmax(220px, 280px) minmax(230px, 320px) minmax(280px, 1fr) minmax(140px, 160px);
  align-items: start;
}

.cash-shift-open-form--closed {
  padding-top: 4px;
}

.cash-shift-open-form--closed .field {
  display: grid;
  align-content: start;
  gap: 7px;
}

.cash-shift-open-form--closed .money-input-wrap,
.cash-shift-open-form--closed .input,
.cash-shift-open-form--closed .select {
  min-height: 45px;
}

.cash-shift-open-form--closed small {
  min-height: 34px;
  max-width: 340px;
  color: var(--muted);
  line-height: 1.35;
}

.cash-shift-open-form .field,
.cash-shift-movement-form .field,
.cash-shift-close-form .field {
  margin: 0;
}

.cash-shift-open-form > .btn {
  width: 100%;
  min-width: 142px;
  min-height: 50px;
  align-self: start;
  margin-top: 24px;
}

.cash-shift-actions {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  align-items: start;
}

.cash-shift-movement-form,
.cash-shift-close-form {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.cash-shift-summary {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
}

.cash-shift-metric {
  display: grid;
  gap: 4px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.cash-shift-metric small {
  color: var(--muted);
  font-weight: 700;
}

.cash-shift-metric strong {
  color: var(--teal);
  font-size: 1.05rem;
}

.cash-shift-history {
  display: grid;
  gap: 8px;
}

.cash-movement-list {
  display: grid;
  gap: 6px;
}

.cash-movement-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.cash-movement-row small {
  display: block;
  color: var(--muted);
}

.cash-movement-row--in span {
  color: var(--teal);
  font-weight: 900;
}

.cash-movement-row--out span {
  color: #b91c1c;
  font-weight: 900;
}

.cash-payment-summary,
.cash-payment-list {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.cash-payment-summary small {
  color: var(--muted);
}

.cash-payment-summary .warn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(184, 51, 47, 0.32);
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff4f4;
  color: var(--bad);
  font-weight: 800;
}

.cash-payment-summary .warn span {
  color: var(--bad);
  font-weight: 900;
}

.cash-payment-summary .warn strong {
  color: var(--bad);
  font-size: 1.08rem;
}

.cash-payment-methods {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
  gap: 6px;
  min-width: 0;
}

.payment-method-button {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 10px;
  background: #fff;
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
  line-height: 1.15;
  overflow-wrap: anywhere;
  white-space: normal;
}

.payment-method-button.active {
  border-color: var(--teal);
  background: var(--teal);
  color: #fff;
}

.cash-payment-summary .ok strong {
  color: var(--ok);
}

.cash-payment-summary .change strong {
  color: var(--teal);
}

.status-danger {
  border-color: rgba(184, 51, 47, 0.32);
  background: rgba(184, 51, 47, 0.08);
  color: var(--bad);
}

.status-warn {
  border-color: rgba(183, 121, 31, 0.32);
  background: rgba(183, 121, 31, 0.1);
  color: var(--warn);
}

.status-muted {
  border-color: rgba(102, 116, 123, 0.26);
  background: rgba(102, 116, 123, 0.1);
  color: var(--muted);
}

.client-debt-alert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid rgba(184, 51, 47, 0.25);
  border-radius: 8px;
  background: rgba(184, 51, 47, 0.055);
}

.client-debt-alert small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.client-debt-alert-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
}

.client-debt-inline-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(184, 51, 47, 0.2);
  border-radius: 8px;
  background: #fffafa;
}

.client-debt-inline-panel .compact-header {
  padding-bottom: 0;
}

.cash-payment-form {
  display: grid;
  gap: 10px;
}

.cash-deferred-payment {
  display: block;
  padding: 10px;
  border: 1px solid rgba(180, 83, 9, 0.26);
  border-radius: 8px;
  background: rgba(180, 83, 9, 0.07);
}

.cash-deferred-payment small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.cash-pending-panel {
  border-color: rgba(184, 51, 47, 0.18);
}

.cash-pending-list {
  display: grid;
  gap: 12px;
}

.cash-pending-row {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(184, 51, 47, 0.18);
  border-radius: 8px;
  background: #fffafa;
}

.cash-pending-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
}

.cash-pending-main span,
.cash-pending-main small {
  display: block;
  color: var(--muted);
}

.cash-pending-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
  align-items: center;
}

.cash-pending-payment .cash-summary {
  background: #fff;
}

.reduniq-payment-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(50, 103, 168, 0.22);
  border-radius: 8px;
  background: #f7faff;
}

.reduniq-payment-heading,
.reduniq-request-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.reduniq-payment-heading small,
.reduniq-request-card small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.reduniq-request-list {
  display: grid;
  gap: 8px;
}

.reduniq-request-card {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(50, 103, 168, 0.18);
  border-radius: 8px;
  background: #fff;
}

.reduniq-request-card.failed {
  border-color: rgba(184, 51, 47, 0.22);
  background: #fffafa;
}

.reduniq-request-card a {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  color: var(--blue);
  font-size: 0.9rem;
}

.danger-text {
  color: var(--bad) !important;
}

.warning-text {
  color: #8a5a00 !important;
}

.client-pending-sale-card {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  border-color: rgba(184, 51, 47, 0.18);
  background: #fffafa;
}

.cash-payment-row {
  display: grid;
  grid-template-columns: minmax(86px, 0.8fr) minmax(0, 1fr) 34px 34px;
  gap: 6px;
  align-items: end;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.cash-payment-row .field {
  margin: 0;
  min-width: 0;
}

.cash-payment-row .input,
.cash-payment-row .select {
  width: 100%;
  min-width: 0;
}

.cash-payment-row label {
  white-space: nowrap;
}

.cash-payment-reference {
  grid-column: 1 / -1;
}

.cash-payment-reference-toggle {
  width: 34px;
  min-width: 34px;
  height: 34px;
  min-height: 34px;
  align-self: end;
  font-size: 1rem;
}

.cash-payment-row > .btn.danger {
  justify-self: start;
  align-self: end;
  width: 34px;
  min-width: 34px;
  min-height: 34px;
  padding: 0;
  font-weight: 900;
  line-height: 1;
}

.money-input {
  padding-right: 10px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.money-input-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 30px;
  gap: 6px;
  align-items: center;
}

.money-clear-button {
  width: 30px;
  height: 30px;
  min-height: 30px;
  border: 0;
  border-radius: 50%;
  background: rgba(87, 104, 116, 0.14);
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.money-clear-button:hover {
  background: rgba(196, 48, 48, 0.14);
  color: var(--bad);
}

.cash-history-panel {
  display: grid;
  gap: 12px;
}

.cash-history-toolbar {
  max-width: 720px;
}

.cash-history-list,
.cash-sale-detail-list,
.cash-sale-detail-section {
  display: grid;
  gap: 8px;
}

.cash-history-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, auto) minmax(110px, auto) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.cash-history-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.cash-history-main span,
.cash-history-main small {
  color: var(--muted);
}

.cash-history-main strong,
.cash-history-main span,
.cash-history-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cash-history-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.cash-history-total {
  color: var(--teal);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.cash-sale-detail-modal {
  width: min(980px, calc(100vw - 28px));
}

.cash-sale-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.cash-sale-detail-section {
  margin-top: 14px;
}

.cash-sale-detail-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.cash-sale-detail-row span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.cash-sale-detail-row small {
  color: var(--muted);
}

.cash-sale-detail-row > strong {
  color: var(--teal);
  font-variant-numeric: tabular-nums;
}

.cash-sale-detail-notes {
  display: grid;
  gap: 6px;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.cash-sale-detail-notes p {
  margin: 0;
  color: var(--text);
  line-height: 1.45;
}

.report-view {
  --report-accent: var(--teal);
}

.report-filter-grid {
  grid-template-columns: minmax(150px, 180px) minmax(150px, 180px) minmax(180px, 220px) minmax(260px, 1fr);
}

.report-metrics {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.report-breakdown-panel {
  display: grid;
  gap: 10px;
}

.report-breakdown-list,
.report-list {
  display: grid;
  gap: 8px;
}

.report-breakdown-row,
.report-row {
  display: grid;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.report-breakdown-row {
  grid-template-columns: minmax(0, 1fr) auto;
}

.report-breakdown-button {
  width: 100%;
  font: inherit;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.report-breakdown-button.active {
  border-color: rgba(15, 118, 110, 0.45);
  background: rgba(15, 118, 110, 0.06);
}

.report-row {
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto) minmax(110px, auto) auto;
}

.report-row-main,
.report-breakdown-row span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.report-row-main strong,
.report-row-main span,
.report-row-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.report-row-main span,
.report-row-main small,
.report-breakdown-row small {
  color: var(--muted);
}

.report-row-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  justify-content: flex-end;
}

.report-row-total,
.report-breakdown-row > strong {
  color: var(--teal);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.client-report-row {
  grid-template-columns: minmax(260px, 1fr) minmax(160px, auto) minmax(170px, auto) minmax(190px, auto);
}

.client-report-dates {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 0.9rem;
  min-width: 0;
}

.client-report-dates strong {
  color: var(--text);
}

.report-row-actions {
  justify-content: flex-end;
}

.cash-direct-client {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
  margin-bottom: 10px;
}

.selected-client-card,
.client-search-results {
  margin-bottom: 10px;
}

.selected-client-card {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid rgba(15, 118, 110, 0.28);
  border-radius: 8px;
  background: rgba(15, 118, 110, 0.06);
}

.selected-client-card small {
  color: var(--muted);
}

.client-search-results {
  display: grid;
  gap: 8px;
}

.client-search-results.compact {
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.client-option {
  display: grid;
  gap: 3px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: inherit;
  text-align: left;
  background: #fff;
}

.client-option:hover {
  border-color: rgba(15, 118, 110, 0.32);
  background: rgba(15, 118, 110, 0.05);
}

.client-option small {
  color: var(--muted);
}

.cash-balance-box,
.cash-balance-list {
  display: grid;
  gap: 10px;
}

.cash-balance-box {
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.cash-balance-box small {
  color: var(--muted);
}

.cash-balance-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(130px, auto);
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid rgba(15, 118, 110, 0.22);
  border-radius: 8px;
  background: rgba(15, 118, 110, 0.05);
}

.cash-balance-row span {
  display: grid;
  gap: 3px;
}

.status-finalized {
  color: #334155;
  background: rgba(51, 65, 85, 0.1);
}

.status-warning {
  color: #8a4f00;
  border-color: rgba(183, 121, 31, 0.32);
  background: #fff7e6;
}

.cash-billing-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 290px);
  gap: 12px;
  align-items: start;
  overflow: hidden;
}

.cash-group-summary {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  padding: 12px;
  border: 1px solid rgba(15, 118, 110, 0.24);
  border-radius: 8px;
  background: rgba(15, 118, 110, 0.05);
}

.cash-group-summary > small {
  color: var(--muted);
}

.cash-group-summary-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 8px;
}

.cash-group-summary-item {
  display: grid;
  gap: 2px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
}

.cash-group-summary-item span,
.cash-item-origin {
  color: var(--muted);
  font-size: 0.78rem;
}

.cash-field-name .cash-item-origin {
  color: var(--teal);
  font-weight: 700;
}

.cash-edit-block,
.cash-edit-list {
  display: grid;
  gap: 10px;
  min-width: 0;
  overflow: hidden;
}

.cash-edit-header,
.cash-add-row,
.cash-edit-row {
  display: grid;
  gap: 10px;
}

.cash-add-row {
  grid-template-columns: minmax(180px, 1fr) auto auto;
  align-items: end;
}

.cash-catalog-picker {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.cash-catalog-picker .input {
  width: 100%;
}

.cash-catalog-results {
  display: none;
  max-height: 300px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(24, 32, 36, 0.12);
}

.cash-catalog-results.open {
  display: grid;
}

.cash-catalog-results button {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  text-align: left;
  background: #fff;
}

.cash-catalog-results button:last-child {
  border-bottom: 0;
}

.cash-catalog-results button:hover,
.cash-catalog-results button:focus-visible {
  background: var(--surface-soft);
}

.cash-catalog-results button span {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.cash-catalog-results button small {
  overflow-wrap: anywhere;
  color: var(--muted);
}

.cash-edit-row {
  grid-template-columns: minmax(145px, 1.15fr) minmax(105px, 0.75fr) 56px 112px minmax(118px, 0.75fr) 88px 86px 44px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  min-width: 0;
}

.cash-edit-row .field {
  margin: 0;
  min-width: 0;
}

.cash-edit-row .field > label {
  min-height: 18px;
}

.cash-edit-row > .btn.danger {
  align-self: start;
  margin-top: 25px;
  min-width: 0;
  padding-inline: 10px;
}

.cash-edit-row > .cash-remove-btn {
  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  font-weight: 900;
  line-height: 1;
}

.cash-field-name small {
  display: block;
  margin-top: 4px;
  color: var(--muted);
}

.cash-line-total {
  align-self: start;
  margin-top: 33px;
  color: var(--teal);
  text-align: right;
  white-space: nowrap;
  min-width: 0;
  font-size: 0.92rem;
}

.clinical-card--signed {
  border-color: rgba(184, 51, 91, 0.22);
  background: #fff5f7;
}

.clinical-card--draft {
  border-color: rgba(183, 121, 31, 0.2);
  background: #fffaf0;
}

.clinical-card--tablet {
  border-color: rgba(50, 103, 168, 0.22);
  background: #f2f7ff;
}

.clinical-card--completed {
  border-color: rgba(31, 138, 91, 0.2);
  background: #f7fcf9;
}

.clinical-day-list {
  gap: 8px;
}

.clinical-day-card {
  padding: 10px 12px;
  box-shadow: 0 8px 20px rgba(24, 32, 36, 0.05);
}

.clinical-day-card-grid {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  grid-template-areas:
    "time info"
    "time state"
    "time action";
  column-gap: 12px;
  row-gap: 8px;
  align-items: start;
}

.clinical-day-time {
  grid-area: time;
  display: grid;
  gap: 2px;
  justify-items: center;
  align-self: stretch;
  min-height: 54px;
  border-right: 1px solid rgba(15, 118, 110, 0.16);
  padding-right: 10px;
  color: var(--teal);
}

.clinical-day-time strong {
  font-size: 0.98rem;
  line-height: 1.1;
}

.clinical-day-time span {
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 800;
  text-align: center;
}

.clinical-day-info {
  grid-area: info;
  display: grid;
  gap: 5px;
  min-width: 0;
}

.clinical-day-info .item-title {
  gap: 2px;
}

.clinical-day-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.clinical-day-meta span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.clinical-day-state,
.clinical-day-action {
  display: flex;
  justify-content: flex-start;
}

.clinical-day-state {
  grid-area: state;
  flex-wrap: wrap;
  gap: 6px;
}

.clinical-day-action {
  grid-area: action;
  justify-content: flex-end;
}

.clinical-day-state .status-pill {
  min-height: 30px;
  padding: 0 10px;
  white-space: nowrap;
}

.clinical-day-action .btn {
  min-height: 36px;
  white-space: nowrap;
}

.clinical-card--tablet .status-tablet,
.status-tablet {
  color: var(--blue);
  background: rgba(50, 103, 168, 0.1);
}

.clinical-record-group {
  display: grid;
  gap: 10px;
}

.clinical-record-group--approved {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fbfcfc;
}

.clinical-record-group--approved summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  color: var(--muted);
}

.clinical-record-group--approved .item-list {
  margin-top: 10px;
}

.item-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.item-title {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.item-title strong {
  overflow-wrap: anywhere;
}

.item-title span,
.meta {
  color: var(--muted);
  font-size: 0.92rem;
}

.item-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.evolution-appointment-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
  overflow-x: auto;
}

.evolution-appointment-actions .btn {
  white-space: nowrap;
}

.evolution-record-card {
  gap: 12px;
  padding: 16px 18px;
}

.evolution-record-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 14px;
}

.evolution-record-title strong {
  font-size: 1.06rem;
  line-height: 1.25;
}

.evolution-record-status {
  justify-content: flex-end;
}

.evolution-record-status .status-pill {
  min-height: 34px;
  padding: 0 14px;
  white-space: nowrap;
}

.evolution-record-meta {
  align-items: center;
  gap: 8px;
}

.evolution-record-actions {
  display: grid;
  grid-template-columns: minmax(150px, max-content) minmax(220px, 1fr) minmax(160px, max-content) max-content;
  align-items: end;
  gap: 10px;
  padding-top: 2px;
}

.evolution-record-actions .btn {
  min-height: 46px;
  white-space: nowrap;
}

.evolution-tablet-room-select {
  min-width: 220px;
  display: grid;
  gap: 4px;
  align-items: end;
  margin: 0;
}

.evolution-tablet-room-select span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  line-height: 1;
}

.evolution-tablet-room-select .select {
  min-height: 46px;
}

.form-grid {
  display: grid;
  gap: 12px;
}

.follow-up-reminder {
  display: grid;
  gap: 10px;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f7fbfa;
}

.follow-up-reminder-toggle {
  display: flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  color: var(--ink);
  font-weight: 850;
  cursor: pointer;
}

.follow-up-reminder-toggle input {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--primary);
}

.follow-up-reminder-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 150px;
  gap: 10px;
}

.follow-up-reminder-fields[hidden] {
  display: none;
}

.follow-up-reminder-status {
  display: block;
  width: fit-content;
  margin-top: 6px;
  padding: 4px 8px;
  border: 1px solid #b8d5ce;
  border-radius: 999px;
  background: #edf7f4;
  color: #116f64;
  font-size: 0.76rem;
  font-weight: 850;
}

.follow-up-reminder-status.due {
  border-color: #e8c37d;
  background: #fff5dc;
  color: #8a5700;
}

.follow-up-reminder-status.completed {
  border-color: var(--line);
  background: #f4f6f6;
  color: var(--muted);
}

.client-form-section {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.client-form-section h3,
.form-section-title {
  margin: 0;
  color: var(--ink);
  font-size: 0.98rem;
  line-height: 1.25;
}

.client-form-section-title-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}

.client-form-section-title-row span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.client-detail-alerts {
  border-color: rgba(184, 51, 91, 0.22);
  background: #fff5f7;
}

.two-col {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.phone-grid {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr);
  gap: 8px;
}

.field {
  display: grid;
  gap: 6px;
}

.field label,
.field-label {
  color: #34434a;
  font-size: 0.86rem;
  font-weight: 700;
}

.field-hint {
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}

.optional-label {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
}

.muted-text {
  color: var(--muted);
  font-weight: 700;
}

.input,
.textarea,
.select {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 9px 11px;
  color: var(--ink);
  background: #fff;
  outline: 0;
}

.textarea {
  min-height: 104px;
  resize: vertical;
}

.input:focus,
.textarea:focus,
.select:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.14);
}

.field.has-error .input,
.field.has-error .textarea,
.field.has-error .select {
  border-color: var(--bad);
  background: rgba(184, 51, 47, 0.05);
  box-shadow: 0 0 0 3px rgba(184, 51, 47, 0.14);
}

.birth-date-field {
  position: relative;
}

.birth-date-control {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 8px;
}

.birth-calendar {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 40;
  width: min(344px, calc(100vw - 24px));
  display: grid;
  gap: 11px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 13px;
  background: var(--surface);
  box-shadow: 0 18px 48px rgba(24, 32, 36, 0.18);
}

.birth-calendar-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.birth-calendar-title {
  min-height: 32px;
  border: 0;
  border-radius: 6px;
  padding: 0 8px;
  color: #34434a;
  background: transparent;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-align: left;
}

.birth-calendar-title:hover {
  background: rgba(15, 118, 110, 0.08);
}

.birth-calendar-title span {
  color: var(--teal);
  font-weight: 900;
}

.birth-calendar-nav {
  display: inline-flex;
  gap: 6px;
}

.birth-calendar-nav .icon-btn {
  width: 30px;
  height: 30px;
  border-color: transparent;
  background: transparent;
}

.birth-calendar-weekdays,
.birth-calendar-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.birth-calendar-weekdays span {
  color: var(--teal);
  font-size: 0.78rem;
  font-weight: 800;
  text-align: center;
}

.birth-calendar-day {
  min-height: 35px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-size: 0.88rem;
  font-weight: 800;
}

.birth-calendar-day:hover:not(:disabled) {
  border-color: rgba(15, 118, 110, 0.28);
  background: rgba(15, 118, 110, 0.08);
}

.birth-calendar-day.selected {
  color: #fff;
  background: var(--teal);
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--teal);
}

.birth-calendar-day:disabled {
  color: #b0bbc1;
  cursor: not-allowed;
}

.birth-calendar-day--empty {
  min-height: 35px;
}

.birth-calendar-years,
.birth-calendar-months {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px 10px;
}

.birth-calendar-year-option,
.birth-calendar-month-option {
  min-height: 38px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: var(--ink);
  background: #fff;
  font-size: 0.88rem;
  font-weight: 800;
}

.birth-calendar-year-option:hover:not(:disabled),
.birth-calendar-month-option:hover:not(:disabled) {
  border-color: rgba(15, 118, 110, 0.28);
  background: rgba(15, 118, 110, 0.08);
}

.birth-calendar-year-option.selected,
.birth-calendar-month-option.selected {
  color: #fff;
  background: var(--teal);
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--teal);
}

.birth-calendar-year-option:disabled,
.birth-calendar-month-option:disabled {
  color: #b0bbc1;
  cursor: not-allowed;
}

.birth-calendar-actions {
  display: flex;
  justify-content: flex-end;
}

.form-error {
  display: grid;
  gap: 3px;
  border: 1px solid rgba(184, 51, 47, 0.34);
  border-left: 5px solid var(--bad);
  border-radius: var(--radius);
  padding: 12px 14px;
  color: #7b211e;
  background: #fff1f0;
}

.form-error span {
  overflow-wrap: anywhere;
}

.channel-row,
.rules-row,
.filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.filter-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(150px, 190px) minmax(160px, 210px);
  gap: 12px;
  align-items: end;
}

.filter-grid.two-filters {
  grid-template-columns: minmax(220px, 1fr) minmax(150px, 210px);
}

.compact-filter {
  min-width: 180px;
}

.agenda-admin-view {
  max-width: 1180px;
}

.agenda-block-admin-panel {
  gap: 14px;
}

.agenda-block-form {
  grid-template-columns: minmax(240px, 1.4fr) minmax(160px, 0.8fr) repeat(2, minmax(150px, 0.75fr));
  align-items: end;
}

.agenda-block-full-day {
  min-height: 42px;
}

.agenda-block-notes {
  grid-column: 1 / -2;
}

.agenda-block-actions {
  align-self: end;
  justify-content: flex-end;
}

.agenda-block-list {
  display: grid;
  gap: 10px;
}

.agenda-block-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(107, 75, 21, 0.24);
  border-left: 6px solid #6b4b15;
  border-radius: 8px;
  padding: 12px;
  background: #fffaf0;
}

.agenda-block-item.is-inactive {
  border-color: var(--line);
  border-left-color: var(--muted);
  background: #fff;
  opacity: 0.78;
}

.agenda-block-title-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 4px;
}

.agenda-block-item small,
.agenda-block-item p {
  display: block;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 0.84rem;
  line-height: 1.35;
}

.agenda-calendar-panel {
  display: grid;
  gap: 14px;
}

.appointment-launcher {
  align-self: start;
  position: sticky;
  top: 118px;
}

.appointment-launcher-box {
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: var(--surface-soft);
}

.appointment-launcher-box span,
.muted-text {
  color: var(--muted);
  font-size: 0.88rem;
}

.appointment-launcher-box strong {
  overflow-wrap: anywhere;
}

.appointment-modal-panel {
  width: min(980px, calc(100vw - 28px));
}

.appointment-detail-modal {
  width: min(920px, calc(100vw - 28px));
  display: grid;
  gap: 14px;
}

.appointment-detail-services .attendance-line {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.appointment-modal-panel .form-grid.panel {
  border: 0;
  padding: 0;
  box-shadow: none;
}

.appointment-modal-panel .form-grid > .panel-header {
  display: none;
}

.agenda-calendar-toolbar,
.agenda-calendar-actions,
.agenda-nav,
.agenda-view-switch,
.agenda-interval-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.agenda-calendar-toolbar {
  justify-content: space-between;
}

.agenda-calendar-toolbar h2 {
  margin-bottom: 2px;
}

.agenda-calendar-toolbar small {
  color: var(--muted);
}

.agenda-calendar-actions {
  justify-content: flex-end;
}

.agenda-view-switch,
.agenda-interval-switch {
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 3px;
  background: var(--surface-soft);
}

.agenda-view-switch .btn,
.agenda-interval-switch .btn {
  min-height: 34px;
}

.agenda-view-switch .btn.selected,
.agenda-interval-switch .btn.selected {
  border-color: rgba(15, 118, 110, 0.32);
  color: #fff;
  background: var(--teal);
}

.agenda-date-input {
  width: 154px;
  min-height: 40px;
}

.agenda-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.agenda-legend span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  gap: 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 9px;
  color: var(--muted);
  background: #fff;
  font-size: 0.78rem;
  font-weight: 800;
}

.agenda-legend-dot {
  width: 10px;
  height: 10px;
  display: inline-block;
  border-radius: 999px;
  border-left-width: 0;
  background: var(--muted);
}

.agenda-legend-dot.agenda-mini-card--confirmed {
  background: var(--blue);
}

.agenda-legend-dot.agenda-mini-card--confirmed_by_client {
  background: var(--ok);
}

.agenda-legend-dot.agenda-mini-card--attended {
  background: var(--ok);
}

.agenda-legend-dot.agenda-mini-card--finalized {
  background: #334155;
}

.agenda-legend-dot.agenda-mini-card--cancelled,
.agenda-legend-dot.agenda-mini-card--no_show {
  background: var(--bad);
}

.agenda-legend-dot.agenda-mini-card--reschedule_requested,
.agenda-legend-dot.agenda-mini-card--contact_requested {
  background: var(--amber);
}

.agenda-legend-dot.agenda-mini-card--blocked {
  background: #6b4b15;
}

.agenda-week {
  display: grid;
  grid-template-columns: 62px repeat(var(--agenda-week-days, 7), minmax(132px, 1fr));
  gap: 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.agenda-week-day,
.agenda-month-cell,
.agenda-day-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.agenda-week-day {
  min-width: 118px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 8px;
}

.agenda-week-day.today,
.agenda-month-cell.today {
  border-color: rgba(15, 118, 110, 0.42);
  background: rgba(15, 118, 110, 0.04);
}

.agenda-week-corner,
.agenda-week-heading,
.agenda-week-time,
.agenda-week-cell {
  min-width: 0;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.agenda-week-corner {
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--surface-soft);
}

.agenda-week-heading {
  display: grid;
  gap: 2px;
  min-height: 48px;
  align-content: center;
  justify-items: center;
  padding: 6px;
  color: var(--ink);
  background: var(--surface-soft);
  text-align: center;
}

.agenda-week-heading.today {
  color: var(--teal);
  background: rgba(15, 118, 110, 0.06);
}

.agenda-week-heading span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
}

.agenda-week-time {
  position: sticky;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 8px 4px;
  color: var(--muted);
  background: #fff;
  font-size: 0.82rem;
  font-weight: 900;
}

.agenda-week-cell {
  min-height: 74px;
  padding: 4px;
  background: #fff;
}

.agenda-week-cell.today {
  background: rgba(15, 118, 110, 0.025);
}

.agenda-week-cell--free:hover {
  background: rgba(15, 118, 110, 0.035);
}

.agenda-week-cell .agenda-mini-card {
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  padding: 5px 6px;
  border-left-width: 4px;
}

.agenda-week-cell .agenda-mini-actions {
  display: none;
}

.agenda-week-cell .agenda-mini-card strong {
  font-size: 0.76rem;
}

.agenda-week-cell .agenda-mini-card span,
.agenda-week-cell .agenda-mini-card small {
  font-size: 0.7rem;
  line-height: 1.15;
}

.agenda-week-free-slot {
  width: 100%;
  min-height: 100%;
  border: 1px dashed rgba(15, 118, 110, 0.16);
  border-radius: 5px;
  background: rgba(15, 118, 110, 0.018);
}

.agenda-week-free-slot:hover,
.agenda-week-free-slot:focus-visible {
  border-color: rgba(15, 118, 110, 0.42);
  background: rgba(15, 118, 110, 0.08);
}

.agenda-day-heading {
  display: grid;
  gap: 2px;
  width: 100%;
  border-radius: 6px;
  padding: 7px;
  color: var(--ink);
  background: var(--surface-soft);
  text-align: left;
}

.agenda-day-heading span {
  color: var(--muted);
  font-size: 0.82rem;
}

.agenda-mini-list,
.agenda-day-slots {
  display: grid;
  gap: 6px;
}

.agenda-mini-list em,
.agenda-day-slots em {
  color: var(--muted);
  font-size: 0.82rem;
  font-style: normal;
}

.agenda-mini-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 10px;
  align-items: center;
  width: 100%;
  border: 1px solid var(--line);
  border-left: 6px solid var(--blue);
  border-radius: 6px;
  padding: 6px 8px;
  color: var(--ink);
  background: #fff;
  text-align: left;
}

.agenda-mini-card--clickable {
  cursor: pointer;
}

.agenda-mini-card--clickable:hover,
.agenda-mini-card--clickable:focus-visible {
  border-color: rgba(15, 118, 110, 0.42);
  box-shadow: 0 12px 28px rgba(24, 32, 36, 0.11);
}

.agenda-mini-card-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.agenda-mini-client-button {
  width: fit-content;
  max-width: 100%;
  padding: 0;
  overflow: hidden;
  color: var(--ink);
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.18;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: transparent;
}

.agenda-mini-client-button:hover,
.agenda-mini-client-button:focus-visible {
  color: var(--teal-strong);
  text-decoration: underline;
}

.agenda-mini-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  justify-content: flex-end;
  align-self: center;
}

.agenda-status-button {
  min-height: 26px;
  padding: 0 7px;
  font-size: 0.74rem;
}

.agenda-mini-card strong {
  font-size: 0.82rem;
  line-height: 1.18;
}

.agenda-mini-card span,
.agenda-mini-card small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.agenda-mini-card span {
  font-size: 0.8rem;
  font-weight: 700;
}

.agenda-mini-card small {
  color: var(--muted);
  font-size: 0.72rem;
  line-height: 1.25;
}

.agenda-deposit-alert {
  border-color: rgba(183, 121, 31, 0.32);
  background: #fffaf0;
}

.agenda-deposit-alert-list {
  display: grid;
  gap: 8px;
}

.agenda-deposit-alert-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid rgba(183, 121, 31, 0.24);
  border-radius: 8px;
  color: inherit;
  text-align: left;
  background: #fff;
}

.agenda-deposit-alert-row:hover,
.agenda-deposit-alert-row:focus-visible {
  border-color: rgba(183, 121, 31, 0.52);
  background: #fff7e6;
}

.agenda-deposit-alert-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.agenda-deposit-alert-row small {
  color: var(--muted);
}

.agenda-pending-quote {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border-color: rgba(13, 126, 116, 0.28);
  background: #eef8f6;
}

.agenda-pending-quote > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.agenda-pending-quote small {
  color: var(--muted);
}

.agenda-mini-time {
  color: var(--teal);
  font-size: 0.74rem;
  font-weight: 900;
}

.agenda-mini-card--scheduled {
  border-color: rgba(102, 116, 123, 0.3);
  border-left-color: var(--muted);
  background: #fff;
}

.agenda-mini-card--confirmed {
  border-color: rgba(50, 103, 168, 0.36);
  border-left-color: var(--blue);
  background: rgba(50, 103, 168, 0.12);
}

.agenda-mini-card--confirmed_by_client {
  border-color: rgba(31, 138, 91, 0.42);
  border-left-color: var(--ok);
  background: rgba(31, 138, 91, 0.16);
}

.agenda-mini-card--attended {
  border-color: rgba(31, 138, 91, 0.36);
  border-left-color: var(--ok);
  background: rgba(31, 138, 91, 0.13);
}

.agenda-mini-card--finalized {
  border-color: rgba(51, 65, 85, 0.34);
  border-left-color: #334155;
  background: rgba(51, 65, 85, 0.08);
}

.agenda-mini-card--cancelled,
.agenda-mini-card--no_show {
  border-color: rgba(184, 51, 47, 0.38);
  border-left-color: var(--bad);
  background: rgba(184, 51, 47, 0.13);
}

.agenda-mini-card--reschedule_requested,
.agenda-mini-card--contact_requested {
  border-color: rgba(183, 121, 31, 0.38);
  border-left-color: var(--amber);
  background: rgba(183, 121, 31, 0.14);
}

.agenda-mini-card--deposit-pending {
  border-color: rgba(183, 121, 31, 0.58);
  border-left-color: #b7791f;
  background: #fff7e6;
  box-shadow: inset 0 0 0 1px rgba(183, 121, 31, 0.14);
}

.agenda-mini-card--blocked {
  border-color: rgba(107, 75, 21, 0.34);
  border-left-color: #6b4b15;
  background: #fff7e6;
}

.agenda-block-slot {
  grid-template-columns: minmax(0, 1fr);
}

.agenda-block-slot--advisory {
  border-style: dashed;
  background: #fffaf0;
}

.agenda-day {
  display: grid;
  gap: 4px;
}

.agenda-day-row {
  display: grid;
  grid-template-columns: 60px repeat(var(--agenda-room-count, 2), minmax(250px, 1fr)) 60px;
  gap: 7px;
  min-height: 42px;
  padding: 5px 6px;
}

.agenda-day-row--header {
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: auto;
  padding-top: 0;
  padding-bottom: 0;
  border: 0;
  background: var(--surface);
}

.agenda-room-heading {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 6px 8px;
  color: var(--ink);
  background: var(--surface-soft);
  font-size: 0.86rem;
  text-align: center;
}

.agenda-day-row--clickable {
  cursor: pointer;
}

.agenda-day-row--clickable:hover {
  border-color: rgba(15, 118, 110, 0.36);
  background: rgba(15, 118, 110, 0.04);
}

.agenda-day-row--occupied {
  border-color: rgba(50, 103, 168, 0.28);
  background: rgba(50, 103, 168, 0.045);
}

.agenda-day-row.selected {
  border-color: rgba(15, 118, 110, 0.42);
  background: rgba(15, 118, 110, 0.05);
}

.agenda-day-time {
  align-self: stretch;
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  min-height: 100%;
  border: 1px solid rgba(15, 118, 110, 0.12);
  border-radius: 8px;
  padding: 7px 4px;
  color: var(--muted);
  background: rgba(15, 118, 110, 0.035);
  font-size: 0.78rem;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.agenda-day-row--header .agenda-day-time {
  min-height: 0;
  border-color: transparent;
  background: transparent;
  padding: 0;
}

.agenda-day-time--end {
  color: var(--teal);
  background: rgba(15, 118, 110, 0.06);
}

.agenda-day-cell {
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 4px;
  background: #fff;
}

.agenda-day-cell--clickable {
  cursor: pointer;
}

.agenda-day-cell--clickable:hover {
  border-color: rgba(15, 118, 110, 0.36);
  background: rgba(15, 118, 110, 0.04);
}

.agenda-day-cell--occupied {
  border-color: rgba(50, 103, 168, 0.28);
  background: rgba(50, 103, 168, 0.045);
}

.agenda-day-cell--blocked {
  border-color: rgba(107, 75, 21, 0.32);
  background: #fffaf0;
}

.agenda-day-cell.selected {
  border-color: rgba(15, 118, 110, 0.42);
  background: rgba(15, 118, 110, 0.05);
}

.agenda-day-slots--full {
  grid-column: 2 / -2;
}

.agenda-slot-target {
  width: 100%;
  min-height: 26px;
  border: 1px dashed rgba(15, 118, 110, 0.28);
  border-radius: 6px;
  color: var(--muted);
  background: rgba(15, 118, 110, 0.035);
  font-size: 0.78rem;
  font-weight: 800;
}

.agenda-slot-target:hover,
.agenda-day-row.selected .agenda-slot-target {
  border-color: rgba(15, 118, 110, 0.48);
  color: var(--teal);
  background: rgba(15, 118, 110, 0.09);
}

.agenda-slot-occupied {
  display: grid;
  gap: 2px;
  min-height: 26px;
  border: 1px dashed rgba(50, 103, 168, 0.28);
  border-radius: 6px;
  padding: 5px 8px;
  color: var(--muted);
  background: rgba(50, 103, 168, 0.05);
  font-size: 0.78rem;
}

.agenda-slot-occupied strong {
  color: var(--blue);
}

.agenda-slot-occupied span {
  font-size: 0.78rem;
}

.agenda-slot-popover {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(15, 118, 110, 0.34);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(24, 32, 36, 0.12);
}

.agenda-slot-popover div {
  display: grid;
  gap: 2px;
}

.agenda-slot-popover span {
  color: var(--muted);
  font-size: 0.82rem;
}

.agenda-day-row--floating {
  border-color: rgba(183, 121, 31, 0.28);
  background: rgba(183, 121, 31, 0.06);
}

.agenda-month {
  display: grid;
  grid-template-columns: repeat(7, minmax(92px, 1fr));
  gap: 6px;
  overflow-x: auto;
}

.agenda-month-weekday {
  min-width: 92px;
  padding: 4px 6px;
  color: var(--muted);
  font-size: 0.78rem;
  text-align: center;
}

.agenda-month-cell {
  min-width: 92px;
  min-height: 104px;
  display: grid;
  align-content: start;
  gap: 4px;
  padding: 7px;
  color: var(--ink);
  text-align: left;
}

.agenda-month-cell.empty {
  background: transparent;
}

.agenda-month-cell.outside-month {
  border-color: rgba(90, 112, 126, 0.16);
  background: rgba(247, 250, 250, 0.72);
}

.agenda-month-cell.outside-month .agenda-month-day {
  color: var(--muted);
}

.agenda-month-day {
  color: var(--ink);
  font-weight: 900;
}

.agenda-month-appointment {
  display: block;
  border-left: 3px solid var(--blue);
  border-radius: 4px;
  padding: 3px 5px;
  color: var(--ink);
  background: var(--surface-soft);
  font-size: 0.74rem;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.agenda-month-cell small {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 800;
}

.check-pill,
.status-pill,
.channel-pill {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 11px;
  color: var(--muted);
  background: #fff;
  font-size: 0.9rem;
}

.check-pill input {
  width: 16px;
  height: 16px;
  accent-color: var(--teal);
}

.check-pill small {
  display: block;
  width: 100%;
  color: var(--muted);
  font-size: 0.78rem;
  line-height: 1.25;
}

.consent-list {
  display: grid;
  gap: 8px;
}

.consent-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.consent-option input {
  width: 16px;
  height: 16px;
  margin-top: 2px;
  accent-color: var(--teal);
}

.consent-option span {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.consent-option small {
  color: var(--muted);
  line-height: 1.35;
}

.consent-origin {
  display: inline-flex;
  width: fit-content;
  border: 1px solid rgba(15, 118, 110, 0.24);
  border-radius: 999px;
  padding: 3px 8px;
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.08);
  font-weight: 800;
}

.rgpd-pill {
  background: rgba(15, 118, 110, 0.09);
  border-color: rgba(15, 118, 110, 0.25);
  color: #0f5f58;
}

.channel-pill.email {
  border-color: rgba(50, 103, 168, 0.34);
  color: var(--blue);
  background: rgba(50, 103, 168, 0.08);
}

.channel-pill.whatsapp {
  border-color: rgba(31, 138, 91, 0.34);
  color: var(--ok);
  background: rgba(31, 138, 91, 0.08);
}

.channel-pill.sms {
  border-color: rgba(183, 121, 31, 0.34);
  color: var(--amber);
  background: rgba(183, 121, 31, 0.08);
}

.rule-box {
  display: grid;
  grid-template-columns: 1fr 88px 106px;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.quick-client {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.quick-client-grid,
.quick-client-permissions {
  display: grid;
  gap: 8px 10px;
  align-items: end;
}

.quick-client-grid--identity {
  grid-template-columns: minmax(82px, 112px) minmax(0, 1fr);
}

.quick-client-grid--contact {
  grid-template-columns: minmax(0, 1fr) minmax(250px, 0.85fr);
}

.quick-client-grid--fiscal {
  grid-template-columns: minmax(126px, 0.75fr) minmax(126px, 0.75fr) minmax(260px, 1.35fr);
}

.quick-client-permissions {
  grid-template-columns: minmax(230px, 0.8fr) minmax(0, 1fr);
  align-items: start;
}

.reschedule-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  border: 1px solid rgba(183, 121, 31, 0.28);
  border-radius: var(--radius);
  padding: 10px 12px;
  background: #fff8ed;
}

.reschedule-box div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.reschedule-box span,
.reschedule-box small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.reschedule-box small {
  font-size: 0.84rem;
}

.next-session-box {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  border: 1px solid rgba(18, 132, 124, 0.22);
  border-radius: var(--radius);
  padding: 10px 12px;
  background: #f4fbfa;
}

.next-session-box--scheduled {
  border-color: rgba(31, 138, 91, 0.22);
  background: #f7fcf9;
}

.next-session-box > div:first-child {
  display: grid;
  gap: 3px;
}

.next-session-box span {
  color: var(--muted);
  font-size: 0.92rem;
}

.next-session-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.next-session-controls .input {
  width: 160px;
  min-height: 38px;
}

.next-session-suggestions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.next-session-suggestions .btn.active {
  border-color: rgba(15, 118, 110, 0.54);
  color: #fff;
  background: var(--teal);
  box-shadow: 0 8px 18px rgba(15, 118, 110, 0.18);
}

.quick-client .field {
  gap: 4px;
}

.quick-client .input,
.quick-client .select {
  min-height: 38px;
  padding: 7px 10px;
}

.quick-client .consent-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.quick-client .consent-option {
  gap: 8px;
  padding: 7px 9px;
}

.quick-client .consent-option small {
  display: none;
}

.quick-client .check-pill {
  min-height: 32px;
}

.quick-client .birth-date-control {
  grid-template-columns: minmax(0, 1fr) 38px;
  gap: 6px;
}

.appointment-client-block {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.appointment-client-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.appointment-client-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.appointment-client-header p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.client-choice-list {
  display: grid;
  gap: 8px;
  max-height: 260px;
  overflow: auto;
}

.client-choice {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 10px 11px;
  background: var(--surface-soft);
  cursor: pointer;
}

.client-choice.selected {
  border-color: rgba(15, 118, 110, 0.46);
  background: rgba(15, 118, 110, 0.08);
}

.client-choice input {
  width: 16px;
  height: 16px;
  accent-color: var(--teal);
}

.client-choice span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.client-choice small {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.client-list {
  gap: 8px;
}

.client-row {
  padding: 12px;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(24, 32, 36, 0.04);
}

.client-row:hover,
.client-row:focus-visible {
  border-color: rgba(15, 118, 110, 0.42);
  outline: 0;
  background: #fbfcfc;
}

.record-badge {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border: 1px solid rgba(50, 103, 168, 0.24);
  border-radius: 999px;
  padding: 0 10px;
  color: var(--blue);
  background: rgba(50, 103, 168, 0.08);
  font-size: 0.82rem;
  font-weight: 800;
}

.record-badge-row,
.clinical-status-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.marketing-grid {
  grid-template-columns: minmax(340px, 500px) minmax(0, 1fr);
}

.marketing-textarea {
  min-height: 190px;
}

.email-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  background: #fff;
}

.btn.compact {
  min-height: 34px;
  padding: 0 10px;
  font-size: 0.82rem;
}

.email-editor {
  min-height: 240px;
  max-height: 460px;
  overflow: auto;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 0 0 6px 6px;
  background: #fff;
  color: var(--ink);
  line-height: 1.55;
  outline: 0;
}

.email-editor:focus {
  border-color: rgba(15, 118, 110, 0.58);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.1);
}

.email-editor p,
.email-preview p {
  margin: 0 0 12px;
}

.email-editor img,
.email-preview img {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

.email-editor img {
  cursor: pointer;
}

.email-editor img.email-editor-image-selected {
  outline: 3px solid rgba(15, 118, 110, 0.58);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(15, 118, 110, 0.1);
}

.email-image-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid rgba(15, 118, 110, 0.2);
  border-top: 0;
  border-radius: 0 0 6px 6px;
  background: rgba(15, 118, 110, 0.07);
}

.email-image-actions[hidden] {
  display: none;
}

.email-image-actions span {
  color: var(--teal-dark);
  font-size: 0.84rem;
  font-weight: 800;
}

.email-preview-shell {
  background: #f7faf9;
}

.email-preview {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
  line-height: 1.55;
}

.email-preview.compact {
  margin-top: 8px;
  max-height: 320px;
  overflow: auto;
}

.integration-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.integration-field {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.integration-field span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
}

.integration-field strong {
  overflow-wrap: anywhere;
  color: var(--ink);
  font-size: 0.9rem;
}

.marketing-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.marketing-preview {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.marketing-preview p {
  margin: 0;
  white-space: pre-wrap;
  color: var(--ink);
  line-height: 1.45;
}

.marketing-recipient-list {
  display: grid;
  max-height: 320px;
  overflow: auto;
  gap: 8px;
  padding-right: 2px;
}

.marketing-recipient {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.marketing-recipient.selected {
  border-color: rgba(15, 118, 110, 0.44);
  background: rgba(15, 118, 110, 0.07);
}

.marketing-recipient input {
  width: 16px;
  height: 16px;
  accent-color: var(--teal);
}

.marketing-recipient span {
  min-width: 0;
}

.marketing-recipient small {
  display: block;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.marketing-campaign-card {
  gap: 10px;
}

.marketing-campaign-card.selected {
  border-color: rgba(15, 118, 110, 0.42);
  background: rgba(15, 118, 110, 0.05);
}

.marketing-campaign-subject {
  display: block;
  color: var(--ink);
  font-size: 0.92rem;
}

.campaign-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.campaign-stats span {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 9px;
  color: var(--muted);
  background: #fff;
  font-size: 0.8rem;
  font-weight: 700;
}

.appointment-services-block {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.appointment-balance-notice {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(15, 118, 110, 0.24);
  border-radius: var(--radius);
  background: rgba(15, 118, 110, 0.06);
}

.appointment-deposit-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.appointment-deposit-panel.compact {
  padding: 10px 12px;
}

.appointment-deposit-config {
  display: grid;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.appointment-deposit-panel.compact .appointment-deposit-config {
  display: none;
}

.appointment-deposit-panel.compact.expanded .appointment-deposit-config,
.appointment-deposit-panel.compact:has(input[name="depositRequired"]:checked) .appointment-deposit-config {
  display: grid;
}

.appointment-deposit-config .appointment-deposit-grid {
  grid-template-columns: repeat(2, minmax(160px, 1fr));
}

.appointment-deposit-panel.warning {
  border-color: rgba(184, 51, 47, 0.24);
  background: rgba(184, 51, 47, 0.055);
}

.appointment-deposit-heading {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
}

.appointment-deposit-heading small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.appointment-deposit-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(120px, 0.35fr) minmax(160px, 0.45fr);
  gap: 10px;
  align-items: end;
}

.appointment-deposit-payment-stack {
  display: grid;
  gap: 10px;
}

.appointment-deposit-payment-form {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(120px, 0.45fr) minmax(150px, 0.55fr) minmax(160px, 0.7fr) auto;
  gap: 10px;
  align-items: end;
  padding: 12px;
  border: 1px solid rgba(184, 126, 33, 0.28);
  border-radius: var(--radius);
  background: rgba(184, 126, 33, 0.07);
}

.appointment-deposit-payment-form small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

@media (max-width: 760px) {
  .appointment-deposit-grid,
  .appointment-deposit-config .appointment-deposit-grid {
    grid-template-columns: 1fr;
  }
}

.appointment-deposit-confirm-modal {
  max-width: 720px;
}

.appointment-deposit-confirm-modal .form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.appointment-deposit-confirm-modal .split-actions {
  grid-column: 1 / -1;
}

.appointment-balance-heading,
.appointment-balance-item {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
}

.appointment-balance-heading small,
.appointment-balance-item small {
  display: block;
  margin-top: 3px;
  color: var(--muted);
}

.appointment-balance-list {
  display: grid;
  gap: 8px;
}

.appointment-balance-item {
  padding: 9px 10px;
  border: 1px solid rgba(15, 118, 110, 0.2);
  border-radius: 8px;
  background: #fff;
}

.appointment-services-header,
.appointment-services-summary,
.appointment-service-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.appointment-services-header p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.appointment-service-list {
  display: grid;
  gap: 8px;
}

.appointment-service-item {
  display: grid;
  align-items: stretch;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px;
  background: var(--surface-soft);
}

.appointment-service-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(112px, auto) auto 34px;
  align-items: center;
  gap: 10px;
}

.appointment-history-copy-notice {
  display: grid;
  gap: 3px;
  border-left: 3px solid var(--teal);
  padding: 9px 11px;
  color: var(--ink);
  background: rgba(15, 118, 110, 0.07);
}

.appointment-history-copy-notice span {
  color: var(--muted);
  font-size: 0.84rem;
}

.appointment-duration-field {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
}

.appointment-duration-control {
  display: grid;
  grid-template-columns: 76px auto;
  align-items: center;
  gap: 6px;
  color: var(--ink);
  font-size: 0.82rem;
}

.appointment-duration-control .input {
  min-height: 36px;
  padding: 6px 8px;
  text-align: right;
}

.appointment-service-price {
  white-space: nowrap;
}

.appointment-service-item.needs-zone {
  border-color: rgba(217, 119, 6, 0.28);
  background: #fff8eb;
}

.appointment-service-item div,
.appointment-history-summary span,
.appointment-history-service-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.appointment-service-item strong,
.appointment-service-item small {
  min-width: 0;
  overflow-wrap: anywhere;
}

.appointment-service-item small,
.appointment-services-summary {
  color: var(--muted);
  font-size: 0.82rem;
}

.appointment-zone-field {
  display: grid;
  gap: 5px;
  margin-top: 8px;
}

.appointment-zone-field span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

@media (max-width: 640px) {
  .appointment-service-main {
    grid-template-columns: minmax(0, 1fr) auto 34px;
  }

  .appointment-service-description {
    grid-column: 1 / -1;
  }

  .appointment-duration-field {
    justify-self: start;
  }
}

.appointment-service-picker-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(24, 32, 36, 0.46);
}

.appointment-service-picker {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
  width: min(760px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  overflow: hidden;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 24px 60px rgba(24, 32, 36, 0.28);
}

.appointment-service-picker-header,
.appointment-service-picker-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
}

.appointment-service-picker-header strong {
  color: var(--blue);
  text-transform: uppercase;
}

.appointment-service-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.appointment-service-tabs .tab-btn {
  border-radius: 0;
  border: 0;
  border-bottom: 3px solid transparent;
  padding: 12px;
  background: #fff;
  color: var(--muted);
  font-weight: 800;
}

.appointment-service-tabs .tab-btn.active {
  border-bottom-color: var(--blue);
  color: var(--blue);
}

.appointment-service-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 16px;
  background: var(--surface-soft);
}

.appointment-service-search-field {
  grid-column: span 2;
  min-width: 0;
}

.appointment-service-catalog,
.appointment-history-list {
  display: grid;
  gap: 0;
  padding: 0 16px 12px;
  overflow: auto;
  min-height: 0;
  max-height: calc(100vh - 270px);
}

.appointment-service-picker-footer {
  border-top: 1px solid var(--line);
  background: #fff;
  justify-content: flex-end;
}

.appointment-service-row {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto 76px 92px;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--line);
  padding: 12px 0;
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.appointment-service-row:hover:not(:disabled) {
  color: var(--teal);
}

.appointment-service-row.selected {
  color: var(--teal);
}

.appointment-service-row small {
  color: var(--muted);
  text-align: right;
}

.appointment-service-count {
  font-weight: 800;
}

.appointment-service-row-main {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.appointment-service-row-main strong,
.appointment-service-row-main small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.appointment-service-row-main small {
  text-align: left;
  white-space: nowrap;
}

.configurator-view {
  display: grid;
  gap: 14px;
}

.configurator-header {
  align-items: flex-start;
}

.configurator-layout {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(420px, 1.25fr);
  gap: 14px;
  align-items: start;
}

.configurator-picker,
.configurator-summary {
  display: grid;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
}

.configurator-client-panel,
.configurator-actions {
  display: grid;
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: var(--surface-soft);
}

.configurator-client-panel > small,
.configurator-actions > small {
  color: var(--muted);
}

.configurator-client-selected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(20, 132, 119, 0.35);
  border-radius: 8px;
  padding: 10px;
  background: #eef8f6;
}

.configurator-client-selected small {
  display: block;
  color: var(--muted);
}

.configurator-client-results {
  display: grid;
  gap: 6px;
}

.configurator-client-results .client-search-result {
  display: grid;
  gap: 3px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: inherit;
  text-align: left;
}

.configurator-client-results .client-search-result:hover {
  border-color: rgba(20, 132, 119, 0.45);
  background: #eef8f6;
}

.configurator-client-results .client-search-result small {
  color: var(--muted);
}

.configurator-actions .split-actions {
  justify-content: flex-end;
}

.configurator-gender-toggle {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.configurator-zone-list {
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 330px);
  min-height: 260px;
  overflow: auto;
  padding-right: 4px;
}

.configurator-zone-option {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: var(--ink);
  text-align: left;
}

.configurator-zone-option:hover,
.configurator-zone-option.selected {
  border-color: rgba(20, 132, 119, 0.45);
  background: #eef8f6;
}

.configurator-zone-symbol {
  display: inline-grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--teal);
  font-weight: 900;
}

.configurator-zone-option strong,
.configurator-zone-option small {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.configurator-zone-option small {
  color: var(--muted);
}

.configurator-zone-price {
  color: var(--teal);
  font-weight: 900;
  white-space: nowrap;
}

.configurator-summary-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.configurator-summary-heading small {
  display: block;
  color: var(--muted);
}

.configurator-selected-zone-block {
  display: grid;
  gap: 8px;
}

.configurator-selected-zone-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.configurator-selected-zone-header small {
  color: var(--muted);
}

.configurator-selected-zones {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.configurator-selected-zone {
  cursor: pointer;
}

.configurator-suggestions {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(20, 132, 119, 0.22);
  border-radius: 8px;
  padding: 10px;
  background: #f3fbf9;
}

.configurator-suggestions-header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}

.configurator-suggestions-header small,
.configurator-suggestion-main small,
.configurator-suggestion-main span {
  color: var(--muted);
}

.configurator-suggestion-list {
  display: grid;
  gap: 6px;
}

.configurator-suggestion-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  background: #fff;
}

.configurator-suggestion-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.configurator-suggestion-main strong,
.configurator-suggestion-main small,
.configurator-suggestion-main span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.configurator-suggestion-side {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}

.configurator-suggestion-side strong {
  color: var(--teal);
}

.configurator-quote {
  display: grid;
  gap: 10px;
}

.configurator-quote h3 {
  margin: 4px 0 0;
}

.configurator-quote-lines {
  display: grid;
  gap: 10px;
}

.configurator-quote-line {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) 150px 210px 110px;
  align-items: end;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.configurator-quote-main {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.configurator-quote-main strong,
.configurator-quote-main small {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

.configurator-quote-main small {
  color: var(--muted);
}

.configurator-price-stack,
.configurator-line-total {
  display: grid;
  gap: 4px;
}

.configurator-price-stack small,
.configurator-line-total small {
  color: var(--muted);
  font-weight: 700;
}

.configurator-discount-controls {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 8px;
}

.configurator-discount-controls label {
  display: grid;
  gap: 4px;
  font-weight: 800;
}

.configurator-discount-controls span {
  color: var(--muted);
  font-size: 0.82rem;
}

.configurator-line-total strong,
.configurator-total {
  color: var(--teal);
}

.configurator-totals {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.configurator-totals span {
  color: var(--muted);
}

.client-followup-quote-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.client-followup-notes {
  margin: 10px 0 0;
  white-space: pre-line;
}

.client-followup-quote {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.client-followup-quote-summary {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr);
  gap: 8px;
}

.client-followup-quote-summary span,
.client-followup-quote-line {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-soft);
}

.client-followup-quote-summary span {
  display: grid;
  gap: 2px;
  min-width: 0;
  padding: 8px 10px;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.client-followup-quote-summary strong {
  color: var(--ink);
}

.client-followup-quote-lines {
  display: grid;
  gap: 8px;
}

.client-followup-quote-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
}

.client-followup-quote-line-main {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.client-followup-quote-line-main span {
  color: var(--muted);
  font-size: 0.86rem;
  overflow-wrap: anywhere;
}

.client-followup-quote-values {
  display: grid;
  justify-items: end;
  gap: 2px;
  min-width: 132px;
  white-space: nowrap;
}

.client-followup-quote-values span {
  color: var(--muted);
  font-size: 0.82rem;
}

.client-followup-quote-values strong,
.client-followup-quote-totals .total dd {
  color: var(--teal);
}

.client-followup-quote-totals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.client-followup-quote-totals div {
  display: grid;
  gap: 2px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  background: #fff;
}

.client-followup-quote-totals dt {
  color: var(--muted);
  font-size: 0.82rem;
}

.client-followup-quote-totals dd {
  margin: 0;
  font-weight: 800;
}

@media (max-width: 640px) {
  .client-followup-quote-summary,
  .client-followup-quote-line,
  .client-followup-quote-totals {
    grid-template-columns: 1fr;
  }

  .client-followup-quote-values {
    justify-items: start;
    min-width: 0;
    white-space: normal;
  }
}

.text-success {
  color: var(--teal) !important;
}

.appointment-service-type-pill {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 5px 8px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.appointment-history-item {
  display: grid;
  gap: 4px;
  border-bottom: 1px solid var(--line);
  padding: 12px 0;
}

.appointment-history-summary,
.appointment-history-service-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.appointment-history-summary {
  width: 100%;
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
}

.appointment-history-summary > span:last-child {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 800;
}

.appointment-history-services {
  display: grid;
  gap: 8px;
  padding: 10px 0 2px;
}

.appointment-history-service-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: var(--surface-soft);
}

.appointment-history-item span,
.appointment-history-item small {
  color: var(--muted);
}

.appointment-dates-block {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.appointment-dates-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.appointment-dates-header p {
  margin: 4px 0 0;
  color: var(--muted);
  font-size: 0.88rem;
}

.appointment-date-list {
  display: grid;
  gap: 8px;
}

.appointment-date-row {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) minmax(132px, 150px) 40px;
  gap: 8px;
  align-items: end;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface-soft);
}

.appointment-date-row .field {
  min-width: 0;
}

.appointment-date-row .field:first-child {
  min-width: 150px;
}

.appointment-date-row .field:nth-child(2) {
  min-width: 132px;
}

.appointment-date-row .field:nth-child(3) {
  grid-column: 1 / -1;
  min-width: 0;
}

.time-picker {
  display: grid;
  grid-template-columns: minmax(72px, 1fr) auto minmax(72px, 1fr);
  gap: 6px;
  align-items: center;
  font-size: 0.88rem;
}

.time-picker span {
  color: var(--muted);
  font-weight: 800;
}

.time-picker .input {
  min-height: 38px;
  padding: 7px 8px;
  font-size: 0.88rem;
}

.hour-picker,
.minute-picker {
  position: relative;
}

.time-picker-button {
  text-align: center;
  cursor: pointer;
}

.time-picker-grid {
  position: absolute;
  bottom: calc(100% + 6px);
  right: 0;
  z-index: 35;
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(2, 1fr);
  gap: 3px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px;
  background: var(--surface);
  box-shadow: 0 14px 36px rgba(24, 32, 36, 0.16);
}

.hour-picker-grid {
  width: 142px;
  grid-template-rows: repeat(8, 28px);
}

.minute-picker-grid {
  width: 124px;
  grid-template-rows: repeat(6, 28px);
}

.time-picker-option {
  min-height: 28px;
  border: 1px solid transparent;
  border-radius: 4px;
  color: var(--ink);
  background: #fff;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1;
}

.time-picker-option:hover {
  border-color: rgba(15, 118, 110, 0.28);
  background: rgba(15, 118, 110, 0.08);
}

.time-picker-option.selected {
  color: #fff;
  background: var(--teal);
}

.icon-btn {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(15, 118, 110, 0.3);
  border-radius: 6px;
  color: var(--teal);
  background: rgba(15, 118, 110, 0.08);
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1;
}

.icon-btn:hover {
  background: rgba(15, 118, 110, 0.14);
}

.icon-btn.danger {
  border-color: rgba(184, 51, 47, 0.28);
  color: var(--bad);
  background: rgba(184, 51, 47, 0.08);
}

.icon-btn.placeholder {
  visibility: hidden;
}

.panel-header.compact h3 {
  margin: 0;
  font-size: 1rem;
}

.panel-header.compact {
  margin-bottom: 4px;
}

.panel-header.compact p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 0.82rem;
}

.compact-close {
  width: 32px;
  height: 32px;
  min-width: 32px;
  font-size: 1rem;
}

.split-actions {
  justify-content: flex-start;
}

.cash-item .split-actions {
  justify-content: space-between;
  align-items: center;
}

.cash-secondary-actions {
  justify-content: flex-start;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  display: grid;
  place-items: center;
  padding: 14px;
  background: rgba(24, 32, 36, 0.48);
}

.modal-panel {
  width: min(980px, 100%);
  max-height: calc(100dvh - 28px);
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  background: var(--surface);
  box-shadow: 0 24px 70px rgba(24, 32, 36, 0.22);
}

.modal-backdrop-raised {
  z-index: 110;
}

.compact-modal {
  width: min(640px, 100%);
}

.compact-notice {
  align-items: flex-start;
  margin: 0 0 16px;
  line-height: 1.45;
}

.notice.danger {
  border-color: rgba(189, 64, 55, 0.32);
  color: #8e2f29;
  background: rgba(189, 64, 55, 0.08);
}

.cash-refund-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.refund-note {
  border-color: rgba(189, 64, 55, 0.24);
  background: rgba(189, 64, 55, 0.06);
}

@media (max-width: 640px) {
  .cash-refund-summary {
    grid-template-columns: 1fr;
  }
}

.confirm-backdrop {
  z-index: 140;
}

.confirm-panel {
  width: min(460px, calc(100vw - 28px));
  display: grid;
  gap: 18px;
}

.confirm-content {
  display: grid;
  gap: 8px;
}

.confirm-content h2 {
  margin: 0;
  font-size: 1.05rem;
}

.confirm-content p {
  margin: 0;
  color: var(--text);
  line-height: 1.45;
}

.cancellation-deposit-row {
  align-items: flex-start;
}

.cancellation-deposit-row span {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.cancellation-deposit-row small {
  color: var(--muted);
  font-weight: 600;
  line-height: 1.3;
}

.confirm-actions {
  justify-content: flex-end;
}

.reduniq-confirm-panel {
  width: min(720px, calc(100vw - 28px));
}

.reduniq-confirm-form {
  display: grid;
  gap: 14px;
}

.reduniq-confirm-header {
  margin-bottom: 2px;
}

.reduniq-confirm-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.reduniq-confirm-field-wide {
  grid-column: 1 / -1;
}

.reduniq-confirm-field-wide small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 0.78rem;
}

.reduniq-confirm-checkbox {
  justify-content: flex-start;
}

.reduniq-confirm-channels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.reduniq-confirm-channels .check-row {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(31, 128, 116, 0.04);
}

.reduniq-confirm-note {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(31, 128, 116, 0.18);
  border-radius: 8px;
  color: var(--muted);
  background: rgba(31, 128, 116, 0.06);
}

.reduniq-confirm-error {
  padding: 10px 12px;
  border: 1px solid rgba(184, 51, 47, 0.35);
  border-radius: 8px;
  color: var(--bad);
  background: rgba(184, 51, 47, 0.08);
}

@media (max-width: 640px) {
  .reduniq-confirm-grid {
    grid-template-columns: 1fr;
  }

  .reduniq-confirm-channels {
    grid-template-columns: 1fr;
  }
}

.modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}

.modal-header h2 {
  margin: 8px 0 4px;
  font-size: 1.35rem;
  line-height: 1.15;
}

.modal-header p {
  margin: 0;
  color: var(--muted);
  overflow-wrap: anywhere;
}

.client-modal {
  display: grid;
  gap: 12px;
}

.client-form-modal {
  width: min(1160px, calc(100vw - 28px));
  padding: 0;
  overflow: hidden;
}

.client-form-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  max-height: calc(100dvh - 28px);
  gap: 0;
}

.client-form-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  padding: 16px 18px 14px;
  border-bottom: 1px solid var(--line);
  background: #fff;
}

.client-form-header h2 {
  margin: 0;
  font-size: 1.25rem;
  line-height: 1.15;
}

.client-form-header p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 0.92rem;
}

.client-form-body {
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 14px 18px;
  overflow: auto;
  background: #f6f8f8;
}

.client-form-body .client-form-section {
  align-content: start;
  gap: 10px;
  padding: 12px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(24, 32, 36, 0.03);
}

.client-form-section--wide {
  grid-column: 1 / -1;
}

.client-form-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.client-form-fields--wide {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.field--span-2 {
  grid-column: span 2;
}

.client-record-field .meta {
  display: block;
  margin-top: 5px;
  line-height: 1.25;
}

.client-record-field {
  max-width: 220px;
}

.client-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  padding: 12px 18px;
  border-top: 1px solid var(--line);
  background: #fff;
}

.client-form-body .field {
  gap: 5px;
}

.client-form-body .input,
.client-form-body .select {
  min-height: 40px;
}

.client-form-body .textarea {
  min-height: 88px;
}

.client-detail-tabs {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 5px;
  background: #fbfcfc;
}

.client-detail-tab {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border-radius: 5px;
  padding: 0 10px;
  color: var(--muted);
  background: transparent;
  font-size: 0.9rem;
  font-weight: 700;
  white-space: nowrap;
}

.client-detail-tab.active {
  color: #fff;
  background: var(--teal);
}

.client-detail-tab span {
  min-width: 22px;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0 6px;
  color: inherit;
  background: rgba(255, 255, 255, 0.18);
  font-size: 0.78rem;
}

.client-detail-tab:not(.active) span {
  background: #fff;
  border: 1px solid var(--line);
}

.client-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 10px;
}

.client-detail-field,
.client-detail-notes,
.client-detail-section {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfcfc;
}

.client-detail-field span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
}

.client-detail-field strong,
.client-detail-notes p {
  overflow-wrap: anywhere;
}

.client-detail-field--danger,
.client-detail-section--danger {
  border-color: rgba(184, 51, 47, 0.32);
  background: #fff4f4;
}

.client-detail-field--success,
.client-detail-section--success,
.client-credit-card {
  border-color: rgba(31, 138, 91, 0.28);
  background: #f1fbf6;
}

.client-detail-field--danger span,
.client-detail-field--danger strong,
.client-detail-section--danger .client-history-header strong,
.client-detail-section--danger .client-history-header span {
  color: #9f1f1c;
}

.client-detail-field--success span,
.client-detail-field--success strong,
.client-detail-section--success .client-history-header strong,
.client-detail-section--success .client-history-header span {
  color: #0f6841;
}

.client-detail-notes p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
  white-space: pre-wrap;
}

.client-appointment-list {
  display: grid;
  gap: 8px;
}

.client-appointment-record {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.client-appointment-summary {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 9px 10px;
}

.client-appointment-summary-main {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.client-appointment-summary-main span {
  color: var(--muted);
  font-size: 0.88rem;
}

.client-appointment-expand {
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid #b9d5d2;
  border-radius: 5px;
  background: #f2faf9;
  color: var(--primary);
  font: inherit;
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1;
  cursor: pointer;
}

.client-appointment-expand:hover,
.client-appointment-expand:focus-visible {
  border-color: var(--primary);
  background: #e3f4f1;
}

.client-appointment-expanded {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-top: 1px solid var(--line);
  background: #f8fbfb;
}

.client-appointment-detail-grid,
.client-appointment-financial {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.client-appointment-detail-field {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
}

.client-appointment-detail-field span {
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 700;
}

.client-appointment-detail-field strong {
  overflow-wrap: anywhere;
}

.client-appointment-service-section {
  display: grid;
  gap: 7px;
}

.client-appointment-section-heading,
.client-appointment-service-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.client-appointment-section-heading span {
  color: var(--muted);
  font-size: 0.82rem;
}

.client-appointment-service-list {
  display: grid;
  gap: 6px;
}

.client-appointment-service-row {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
}

.client-appointment-service-row > span:first-child {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.client-appointment-service-row small,
.client-appointment-empty {
  color: var(--muted);
  font-size: 0.82rem;
}

.client-appointment-empty {
  margin: 0;
}

.client-appointment-history-notes {
  display: grid;
  gap: 4px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
}

.client-appointment-history-notes p {
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
  white-space: pre-wrap;
}

.client-appointment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 10px;
  border-radius: 6px;
  background: #fff;
}

.client-appointment-item div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.client-appointment-item .rules-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  min-width: auto;
}

.client-appointment-item span:not(.status-pill) {
  color: var(--muted);
  font-size: 0.88rem;
}

.client-document-item {
  align-items: flex-start;
}

.client-document-item .item-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.client-history-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.client-history-card > div:first-child {
  display: grid;
  gap: 3px;
}

.client-history-card span,
.client-history-card small {
  color: var(--muted);
}

.client-balance-card {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}

.client-balance-card--active {
  border-color: rgba(15, 118, 110, 0.28);
  background: rgba(15, 118, 110, 0.04);
}

.client-balance-card--closed {
  background: #f8fafc;
}

.client-balance-metrics {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}

.client-balance-meta,
.client-balance-consumptions {
  grid-column: 1 / -1;
}

.client-balance-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}

.client-balance-consumption-backdrop {
  z-index: 100;
}

.client-balance-consumption-modal {
  width: min(620px, 100%);
}

.client-balance-consumptions summary {
  cursor: pointer;
  font-weight: 800;
}

.client-consumption-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 80px minmax(120px, 1fr);
  gap: 8px;
  padding: 7px 0;
  border-top: 1px solid var(--line);
}

.client-financial-sale-card {
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
}

.client-financial-sale-card--pending {
  border-color: rgba(184, 51, 47, 0.32);
  background: #fff4f4;
}

.client-financial-sale-card--pending strong {
  color: #9f1f1c;
}

.client-financial-metrics {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.client-history {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.client-history-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.client-history-header span {
  color: var(--muted);
  font-size: 0.86rem;
}

.client-evolution-create {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  justify-content: flex-end;
  gap: 8px;
}

.client-evolution-create .field {
  min-width: 170px;
  margin: 0;
}

.client-evolution-create .btn {
  min-height: 42px;
  white-space: nowrap;
}

.client-evolution-item {
  align-items: flex-start;
}

.client-evolution-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: end;
  gap: 8px;
}

.client-evolution-actions .evolution-tablet-room-select {
  min-width: 180px;
}

.client-evolution-actions .evolution-tablet-room-select .select,
.client-evolution-actions .btn {
  min-height: 40px;
}

.client-history-list {
  display: grid;
  max-height: 360px;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
}

.client-history-item {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
}

.client-history-item:last-child {
  border-bottom: 0;
}

.client-history-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  color: var(--muted);
  font-size: 0.84rem;
}

.client-history-item p {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.error-text {
  color: var(--bad);
}

.btn {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 6px;
  padding: 0 14px;
  color: #fff;
  background: var(--teal);
  font-weight: 700;
  white-space: nowrap;
}

.btn.small {
  min-height: 32px;
  padding: 0 10px;
  font-size: 0.84rem;
}

.btn:hover {
  background: var(--teal-strong);
}

.btn.secondary {
  color: var(--ink);
  border: 1px solid var(--line);
  background: #fff;
}

.btn.secondary:hover {
  background: var(--surface-soft);
}

.btn.danger {
  background: var(--coral);
}

.btn.danger:hover {
  background: #bd4037;
}

.btn.ghost {
  color: var(--muted);
  background: transparent;
}

.btn.ghost:hover {
  color: var(--ink);
  background: var(--surface-soft);
}

.status-pill {
  border-radius: 999px;
  font-weight: 800;
}

.status-scheduled {
  color: var(--blue);
  background: rgba(50, 103, 168, 0.08);
}

.status-approval_pending {
  border: 1px solid rgba(183, 121, 31, 0.34);
  color: #8a4f00;
  background: #fff3d8;
}

.status-maintenance_hold {
  border: 1px solid rgba(72, 88, 105, 0.22);
  color: #36495d;
  background: rgba(72, 88, 105, 0.1);
}

.status-sent {
  color: var(--ok);
  background: rgba(31, 138, 91, 0.09);
}

.status-signed {
  border: 1px solid rgba(183, 121, 31, 0.34);
  color: #8a4f00;
  background: #fff3d8;
  box-shadow: 0 0 0 2px rgba(183, 121, 31, 0.08);
}

.status-approved {
  color: var(--ok);
  background: rgba(31, 138, 91, 0.14);
}

.status-completed {
  color: var(--ok);
  background: rgba(31, 138, 91, 0.14);
}

.status-draft {
  color: var(--amber);
  background: rgba(183, 121, 31, 0.1);
}

.status-failed {
  color: var(--bad);
  background: rgba(184, 51, 47, 0.08);
}

.status-medical-attention {
  border-color: rgba(184, 51, 47, 0.34);
  color: var(--bad);
  background: rgba(184, 51, 47, 0.12);
}

.status-cancelled {
  color: #7b4b0f;
  background: rgba(183, 121, 31, 0.12);
}

.status-confirmed {
  color: var(--blue);
  background: rgba(50, 103, 168, 0.08);
}

.status-attended {
  color: var(--ok);
  background: rgba(31, 138, 91, 0.09);
}

.status-reschedule_requested,
.status-contact_requested {
  color: var(--warn);
  background: rgba(164, 101, 19, 0.08);
}

.status-no_show {
  color: var(--bad);
  background: rgba(184, 51, 47, 0.1);
}

.appointment-status-button {
  border-width: 1px;
}

.appointment-status-confirmed.selected,
.appointment-status-confirmed:focus-visible {
  border-color: rgba(50, 103, 168, 0.36);
  color: #214f87;
  background: rgba(50, 103, 168, 0.14);
}

.appointment-status-attended.selected,
.appointment-status-attended:focus-visible {
  border-color: rgba(31, 138, 91, 0.36);
  color: #14613d;
  background: rgba(31, 138, 91, 0.15);
}

.appointment-status-no_show.selected,
.appointment-status-no_show:focus-visible {
  border-color: rgba(184, 51, 47, 0.4);
  color: #8d2825;
  background: rgba(184, 51, 47, 0.13);
}

.appointment-status-cancelled.selected,
.appointment-status-cancelled:focus-visible {
  border-color: rgba(184, 51, 47, 0.4);
  color: #8d2825;
  background: rgba(184, 51, 47, 0.13);
}

.appointment-status-button.selected:disabled {
  opacity: 1;
  cursor: default;
}

.notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  border: 1px solid rgba(183, 121, 31, 0.28);
  border-radius: var(--radius);
  padding: 12px 14px;
  color: #5c4213;
  background: rgba(183, 121, 31, 0.08);
}

.maintenance-notice {
  border-color: rgba(72, 88, 105, 0.24);
  color: #36495d;
  background: rgba(72, 88, 105, 0.08);
}

.empty {
  display: grid;
  min-height: 180px;
  place-content: center;
  gap: 12px;
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  padding: 22px;
  color: var(--muted);
  text-align: center;
  background: rgba(255, 255, 255, 0.62);
}

.table-panel {
  overflow: hidden;
}

.table-scroll {
  overflow-x: auto;
}

table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}

th,
td {
  padding: 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

th {
  color: var(--muted);
  font-size: 0.8rem;
  text-transform: uppercase;
  background: #fbfcfc;
}

td {
  font-size: 0.94rem;
}

.queue-row td {
  vertical-align: middle;
}

.queue-row.expanded td {
  border-bottom: 0;
}

.queue-toggle-cell {
  width: 46px;
}

.queue-row-tools {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.queue-toggle {
  width: 32px;
  height: 32px;
  min-width: 32px;
  font-size: 1.05rem;
}

.queue-select {
  width: 18px;
  height: 18px;
  accent-color: var(--teal);
}

.queue-bulk-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid rgba(183, 121, 31, 0.28);
  border-radius: 8px;
  background: #fff8e8;
}

.queue-bulk-actions small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.queue-preview {
  max-width: 360px;
  margin-top: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.queue-action-cell {
  text-align: right;
  white-space: nowrap;
}

.queue-detail-row td {
  padding-top: 0;
  background: #fbfcfc;
}

.queue-detail {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.queue-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-size: 0.88rem;
}

.queue-detail .message-body {
  max-width: 920px;
}

.message-body {
  max-width: 420px;
  color: var(--muted);
  white-space: pre-wrap;
}

.toast {
  position: fixed;
  top: max(14px, env(safe-area-inset-top));
  left: 50%;
  z-index: 130;
  width: min(620px, calc(100vw - 32px));
  max-width: calc(100vw - 32px);
  transform: translateX(-50%);
  border-radius: var(--radius);
  padding: 14px 16px;
  color: #fff;
  background: var(--ink);
  box-shadow: 0 22px 70px rgba(24, 32, 36, 0.28);
  font-weight: 800;
  line-height: 1.35;
  text-align: center;
  pointer-events: none;
}

.toast.error {
  background: var(--bad);
  box-shadow: 0 24px 80px rgba(184, 51, 47, 0.38);
}

.template-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.template-manager-layout {
  display: grid;
  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.template-manager-sidebar {
  position: sticky;
  top: 16px;
  display: grid;
  gap: 8px;
  max-height: calc(100vh - 120px);
  overflow: auto;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow-soft);
}

.template-list-item {
  width: 100%;
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  color: var(--ink);
  background: var(--surface-soft);
  text-align: left;
}

.template-list-item:hover {
  border-color: rgba(15, 118, 110, 0.35);
  background: rgba(15, 118, 110, 0.06);
}

.template-list-item.active {
  border-color: var(--teal);
  color: var(--teal);
  background: #e8f8f1;
}

.template-list-item strong {
  overflow-wrap: anywhere;
}

.template-list-item small {
  color: var(--muted);
  font-weight: 700;
  line-height: 1.35;
}

.template-list-empty {
  border: 1px dashed var(--line);
  border-radius: 8px;
  padding: 14px;
  color: var(--muted);
  font-weight: 700;
  text-align: center;
}

.template-manager-editor {
  min-width: 0;
}

.template-manager-editor .template-card {
  max-width: none;
}

.modelos-view {
  display: grid;
  gap: 16px;
}

.settings-view {
  display: grid;
  gap: 16px;
}

.configuration-view {
  display: grid;
  gap: 16px;
}

.configuration-content {
  min-width: 0;
}

.settings-category-panel {
  max-width: 980px;
}

.user-access-note {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-soft);
}

.user-access-note span {
  color: var(--muted);
  line-height: 1.45;
}

.user-access-card {
  display: grid;
  gap: 12px;
}

.user-form {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.user-room-settings {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(15, 118, 110, 0.18);
  border-radius: 8px;
  background: #f6fbfa;
}

.user-room-settings[hidden] {
  display: none;
}

.user-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}

.panel-header.compact {
  align-items: start;
}

.panel-header.compact h3 {
  margin: 0;
}

.model-category-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.model-category-tab {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  gap: 8px;
  border-radius: 6px;
  padding: 0 14px;
  color: var(--muted);
  background: transparent;
}

.model-category-tab strong {
  min-width: 24px;
  border-radius: 999px;
  padding: 2px 7px;
  color: var(--muted);
  background: var(--surface-soft);
  font-size: 0.82rem;
}

.model-category-tab.active {
  color: #fff;
  background: var(--teal);
}

.model-category-tab.active strong {
  color: var(--teal);
  background: #fff;
}

.template-token-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fbfcfc;
}

.template-token-toolbar .btn {
  width: auto;
}

.template-card {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}

.new-template-card {
  border-style: dashed;
  background: #fbfcfc;
}

.clinical-template-card {
  gap: 16px;
}

.template-editor-section {
  display: grid;
  gap: 10px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.template-editor-section h3 {
  margin: 0;
  font-size: 0.98rem;
}

.section-title-row,
.template-row-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.template-editor-list {
  display: grid;
  gap: 10px;
}

.template-editor-row {
  display: grid;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfcfc;
}

.template-block-textarea {
  min-height: 138px;
}

.template-options-textarea {
  min-height: 118px;
}

.danger-icon {
  color: var(--bad);
}

.settings-grid {
  display: grid;
  grid-template-columns: minmax(280px, 420px) minmax(0, 1fr);
  gap: 16px;
}

.audit-list {
  display: grid;
  gap: 9px;
}

.audit-item {
  padding: 10px 12px;
  border-radius: 6px;
  background: var(--surface-soft);
}

.audit-item span {
  display: block;
  color: var(--muted);
  font-size: 0.8rem;
}

.clinical-grid {
  grid-template-columns: minmax(320px, 480px) minmax(0, 1fr);
}

.compact-list {
  max-height: 360px;
  overflow: auto;
}

.compact-item {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}

.tablet-shell {
  display: block;
  min-height: 100vh;
  background: #eef3f2;
}

.tablet-page {
  min-height: 100vh;
  padding: clamp(16px, 4vw, 42px);
}

.tablet-mode-exit {
  position: sticky;
  top: 0;
  z-index: 40;
  width: min(980px, 100%);
  margin: 0 auto 12px;
  display: flex;
  justify-content: flex-end;
  padding: 8px 0;
  background: rgba(238, 243, 242, 0.94);
  backdrop-filter: blur(10px);
}

.tablet-mode-exit .btn {
  width: auto;
}

.tablet-brand {
  width: min(980px, 100%);
  margin: 0 auto 16px;
  display: flex;
  justify-content: center;
}

.tablet-brand img {
  display: block;
  width: min(340px, 72vw);
  max-height: 92px;
  object-fit: contain;
}

.tablet-card {
  --tablet-card-padding: clamp(18px, 4vw, 38px);
  width: min(980px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 22px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: var(--tablet-card-padding);
  background: var(--surface);
  box-shadow: var(--shadow);
}

.tablet-record-card {
  position: relative;
}

.tablet-sticky-actions {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  align-items: center;
  margin: calc(var(--tablet-card-padding) * -1) calc(var(--tablet-card-padding) * -1) 0;
  padding: 10px var(--tablet-card-padding);
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 24px rgba(24, 32, 36, 0.08);
  backdrop-filter: blur(10px);
}

.tablet-sticky-actions .btn {
  width: auto;
}

.tablet-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 18px;
}

.tablet-header h1 {
  margin: 6px 0 8px;
  font-size: clamp(1.55rem, 3vw, 2.2rem);
  letter-spacing: 0;
}

.tablet-header p,
.clinical-section p {
  color: var(--muted);
  line-height: 1.55;
}

.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.clinical-section {
  display: grid;
  gap: 12px;
}

.clinical-approval-section {
  background: #f8fbfb;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
}

.clinical-section h2 {
  margin: 0;
  font-size: 1.2rem;
  text-align: center;
}

.clinical-section h3 {
  margin: 8px 0 0;
  font-size: 1rem;
  text-align: center;
}

.clinical-question-list {
  display: grid;
  gap: 10px;
}

.evolution-choice-group {
  display: grid;
  gap: 10px;
  min-width: 0;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fbfcfc;
}

.evolution-choice-group legend {
  padding: 0 6px;
  color: #34434a;
  font-weight: 800;
}

.evolution-choice-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.evolution-choice {
  min-height: 46px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  font-weight: 800;
}

.evolution-choice input {
  width: 19px;
  height: 19px;
  accent-color: var(--teal);
}

.evolution-choice.selected,
.evolution-choice:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.42);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.09);
}

.evolution-parameter-groups {
  display: grid;
  gap: 12px;
}

.evolution-zone-picker {
  display: grid;
  gap: 12px;
}

.evolution-zone-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px 10px;
}

.evolution-zone-filters {
  grid-column: 1;
  display: inline-flex;
  flex-wrap: wrap;
  gap: 7px;
}

.evolution-zone-filters[hidden] {
  display: none;
}

.zone-filter-button {
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 0 13px;
  color: var(--muted);
  background: #fff;
  font-weight: 800;
}

.zone-filter-button.active {
  border-color: rgba(15, 118, 110, 0.42);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.1);
}

.evolution-zone-search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px auto;
  gap: 10px;
  align-items: center;
}

.evolution-zone-search-field {
  position: relative;
  min-width: 0;
}

.evolution-zone-search-field .input {
  width: 100%;
  padding-right: 42px;
}

.evolution-zone-search-field input[type="search"]::-webkit-search-cancel-button,
.evolution-zone-search-field input[type="search"]::-webkit-search-decoration {
  appearance: none;
}

.evolution-zone-search-clear {
  position: absolute;
  top: 50%;
  right: 7px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #64747a;
  background: transparent;
  font-size: 1.1rem;
  font-weight: 900;
  line-height: 1;
  transform: translateY(-50%);
}

.evolution-zone-search-clear:active {
  background: rgba(15, 118, 110, 0.1);
  color: #0f5f58;
}

.evolution-zone-search-button {
  position: relative;
  width: 42px;
  height: 42px;
}

.evolution-zone-search-button span {
  position: relative;
  width: 17px;
  height: 17px;
  display: block;
  border: 3px solid currentColor;
  border-radius: 50%;
}

.evolution-zone-search-button span::after {
  content: "";
  position: absolute;
  right: -8px;
  bottom: -6px;
  width: 10px;
  height: 3px;
  border-radius: 999px;
  background: currentColor;
  transform: rotate(45deg);
}

.evolution-zone-sections {
  display: grid;
  gap: 12px;
}

.evolution-zone-section {
  display: grid;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px;
  background: #fbfcfc;
}

.evolution-zone-section[hidden],
.evolution-zone-choice[hidden] {
  display: none !important;
}

.evolution-zone-section h3 {
  margin: 0;
  text-align: left;
  font-size: 1rem;
}

.evolution-zone-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 8px;
}

.evolution-zone-choice {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
  font-weight: 800;
}

.evolution-zone-choice input {
  width: 19px;
  height: 19px;
  accent-color: var(--teal);
}

.evolution-zone-choice:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.42);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.09);
}

.evolution-tablet-page {
  padding: clamp(12px, 2.6vw, 30px);
}

.evolution-tablet-page .tablet-brand {
  width: min(1180px, 100%);
  margin-bottom: 10px;
}

html.operation-tablet-display .evolution-readonly-page {
  box-sizing: border-box;
  height: 100dvh;
  min-height: 100dvh;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 8px;
}

html.operation-tablet-display .evolution-readonly-page .tablet-brand {
  margin-bottom: 8px;
}

html.operation-tablet-display .evolution-readonly-card {
  width: min(980px, 100%);
  margin-bottom: 8px;
}

.evolution-console {
  width: min(1180px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 14px;
}

.evolution-console-header,
.evolution-session-strip,
.evolution-console-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(24, 32, 36, 0.08);
}

.evolution-console-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
}

.evolution-client-block {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.evolution-client-block h1 {
  margin: 0;
  font-size: clamp(1.45rem, 2.8vw, 2.15rem);
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.evolution-client-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--muted);
  font-weight: 800;
}

.evolution-client-meta span {
  border-radius: 999px;
  padding: 5px 10px;
  background: #eef5f4;
}

.evolution-session-strip {
  display: grid;
  grid-template-columns: minmax(180px, 0.95fr) minmax(160px, 0.8fr) minmax(220px, 1.2fr);
  gap: 1px;
  overflow: hidden;
  background: var(--line);
}

.evolution-strip-field {
  min-height: 42px;
  display: flex;
  align-items: center;
  align-content: center;
  gap: 10px;
  padding: 6px 10px;
  background: #132023;
  color: #fff;
}

.evolution-strip-field span {
  flex: 0 0 auto;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.evolution-strip-field strong,
.evolution-strip-field input,
.evolution-strip-field select {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  border: 0;
  color: #fff;
  background: transparent;
  font-size: 1rem;
  font-weight: 900;
}

.evolution-strip-field input,
.evolution-strip-field select {
  min-height: 28px;
  padding: 0;
  color-scheme: dark;
}

.evolution-strip-field--date input[type="date"] {
  flex: 0 1 8.75rem;
  width: 8.75rem;
  max-width: 100%;
}

.evolution-session-stepper {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: 32px minmax(44px, 1fr) 32px;
  gap: 6px;
  align-items: center;
}

.evolution-stepper-btn {
  min-height: 28px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 7px;
  color: #fff;
  background: rgba(255, 255, 255, 0.08);
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1;
}

.evolution-stepper-btn:active {
  transform: translateY(1px);
}

.evolution-session-stepper input {
  text-align: center;
}

.evolution-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(360px, 0.9fr) minmax(0, 1.35fr);
  gap: 14px;
  align-items: start;
}

.evolution-zone-workspace {
  min-width: 0;
  display: grid;
  gap: 0;
}

.evolution-zone-tabs-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
}

.evolution-zone-tabs {
  display: flex;
  gap: 4px;
  align-items: flex-end;
  overflow-x: auto;
  padding: 0 6px;
}

.evolution-zone-tab {
  min-height: 42px;
  min-width: 96px;
  border: 1px solid var(--line);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  padding: 0 12px;
  color: var(--muted);
  background: #eef3f2;
  font-weight: 900;
}

.evolution-zone-tab.active {
  border-color: var(--teal-strong);
  color: #fff;
  background: var(--teal-strong);
}

.evolution-zone-tab--add {
  min-width: 52px;
  color: #fff;
  background: var(--teal);
  font-size: 1.35rem;
}

.evolution-zone-remove-active {
  min-height: 38px;
  white-space: nowrap;
}

.evolution-zone-entry-panel {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(24, 32, 36, 0.08);
}

.evolution-zone-entry-panel[hidden] {
  display: none;
}

.evolution-entry-toolbar,
.evolution-entry-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}

.evolution-zone-entry-grid {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  gap: 10px;
  margin-top: 0;
}

.evolution-compact-parameters {
  align-content: start;
}

.evolution-machine-compact {
  display: grid;
  gap: 10px;
}

.evolution-machine-mode {
  display: grid;
  gap: 7px;
  margin: 0;
  border: 1px solid rgba(15, 118, 110, 0.24);
  border-radius: 8px;
  padding: 9px;
  background: #f4fbfa;
}

.evolution-machine-mode legend {
  padding: 0 4px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.evolution-machine-mode-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.evolution-program-mode .evolution-machine-mode-options {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.evolution-machine-mode-option {
  position: relative;
  min-height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  color: #34434a;
  background: #fff;
  font-weight: 900;
  text-align: center;
}

.evolution-machine-mode-option input {
  position: absolute;
  inset: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.evolution-machine-mode-option.selected,
.evolution-machine-mode-option:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.42);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.12);
}

.evolution-fixed-tip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid rgba(15, 118, 110, 0.24);
  border-radius: 8px;
  padding: 9px 12px;
  background: #eef8f7;
}

.evolution-fixed-tip span {
  color: var(--muted);
  font-size: 0.8rem;
  font-weight: 900;
  text-transform: uppercase;
}

.evolution-fixed-tip strong {
  color: #0f5f58;
  font-size: 1.05rem;
}

.evolution-fixed-tip input {
  display: none;
}

.evolution-zone-history-panel {
  margin-top: 10px;
  display: grid;
  gap: 8px;
}

.evolution-history-item {
  display: grid;
  gap: 4px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px 10px;
  text-align: left;
  background: #fbfcfc;
}

.evolution-history-item strong {
  color: var(--ink);
}

.evolution-history-item span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
}

.evolution-right-column {
  display: grid;
  gap: 14px;
}

.evolution-console-panel {
  display: grid;
  gap: 12px;
  padding: 14px;
}

.evolution-next-session-panel {
  margin-top: 14px;
  border: 1px solid rgba(18, 132, 124, 0.22);
  background: #f4fbfa;
}

.evolution-next-session-panel .next-session-controls {
  align-items: flex-end;
}

.evolution-next-session-panel .input {
  max-width: 190px;
}

.evolution-panel-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.evolution-panel-title span {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--teal);
  font-size: 0.86rem;
  font-weight: 900;
}

.evolution-panel-title h2 {
  margin: 0;
  font-size: 1.12rem;
  letter-spacing: 0;
}

.evolution-console .evolution-choice-group {
  border: 0;
  padding: 0;
  background: transparent;
}

.evolution-console .evolution-choice-group legend {
  padding: 0 0 6px;
  color: #26383e;
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.evolution-characteristics-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.evolution-select-stepper {
  min-height: 76px;
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 9px;
  background: #fbfcfc;
}

.evolution-select-stepper > span {
  color: #26383e;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
}

.evolution-select-stepper-control {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) 42px;
  gap: 7px;
  align-items: stretch;
}

.evolution-select-stepper-control strong {
  min-height: 42px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  padding: 5px 8px;
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.09);
  font-size: 0.98rem;
  line-height: 1.12;
  text-align: center;
  overflow-wrap: anywhere;
}

.evolution-select-stepper-button {
  min-height: 42px;
  border: 1px solid rgba(15, 118, 110, 0.28);
  border-radius: 8px;
  color: #0f5f58;
  background: #fff;
  font-size: 1.35rem;
  font-weight: 900;
}

.evolution-select-stepper-button:active {
  transform: translateY(1px);
}

.evolution-select-stepper-button:disabled {
  opacity: 0.45;
}

.evolution-choice-group.is-compact .evolution-choice-list {
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 7px;
}

.evolution-choice-group.is-compact .evolution-choice {
  position: relative;
  min-height: 44px;
  justify-content: center;
  padding: 8px 10px;
  text-align: center;
}

.evolution-choice-group.is-compact .evolution-choice input {
  position: absolute;
  inset: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.evolution-machine-panel {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfb 100%);
}

.evolution-machine-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.evolution-stepper {
  min-height: 132px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 112px;
  gap: 10px;
  border: 1px solid rgba(19, 32, 35, 0.9);
  border-radius: 8px;
  padding: 12px;
  color: #fff;
  background: #132023;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06);
}

.evolution-stepper-readout {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
}

.evolution-stepper-readout span {
  color: rgba(255,255,255,0.68);
  font-size: 0.82rem;
  font-weight: 900;
  text-transform: uppercase;
}

.evolution-stepper-readout strong {
  color: #8fe9e1;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: clamp(2.15rem, 5vw, 3.45rem);
  font-weight: 900;
  line-height: 1;
}

.evolution-stepper-readout em {
  color: rgba(255,255,255,0.82);
  font-style: normal;
  font-weight: 900;
}

.evolution-stepper:not(.has-value) .evolution-stepper-readout strong {
  color: rgba(255,255,255,0.34);
}

.evolution-stepper.is-disabled {
  opacity: 0.58;
}

.evolution-stepper-controls {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.evolution-stepper-button {
  min-height: 52px;
  border: 1px solid rgba(143, 233, 225, 0.34);
  border-radius: 8px;
  color: #fff;
  background: #176f75;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
}

.evolution-stepper-button:active {
  transform: translateY(1px);
}

.evolution-stepper-button:disabled {
  opacity: 0.42;
}

.evolution-console .evolution-zone-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
}

.evolution-zone-actions {
  grid-column: 2;
  grid-row: 1 / span 3;
  display: grid;
  gap: 8px;
  align-content: start;
}

.evolution-zone-actions > .btn {
  width: 100%;
  min-width: 112px;
  white-space: nowrap;
}

.evolution-notes-button.has-notes {
  border-color: rgba(15, 118, 110, 0.54);
  color: #fff;
  background: #0f766e;
  animation: evolutionNotesPulse 1.35s ease-in-out infinite;
}

.evolution-notes-icon {
  position: relative;
  width: 42px;
  height: 38px;
}

.evolution-notes-icon span {
  position: relative;
  width: 17px;
  height: 21px;
  display: block;
  border: 2px solid currentColor;
  border-radius: 4px;
}

.evolution-notes-icon span::before,
.evolution-notes-icon span::after {
  content: "";
  position: absolute;
  left: 3px;
  right: 3px;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.evolution-notes-icon span::before {
  top: 6px;
  box-shadow: 0 5px 0 currentColor;
}

.evolution-notes-icon span::after {
  bottom: 3px;
}

.evolution-notes-icon.has-notes {
  border-color: rgba(15, 118, 110, 0.54);
  color: #fff;
  background: #0f766e;
  animation: evolutionNotesPulse 1.35s ease-in-out infinite;
}

@keyframes evolutionNotesPulse {
  0%, 100% {
    border-color: rgba(15, 118, 110, 0.54);
    background: #0f766e;
    box-shadow: 0 0 0 rgba(15, 118, 110, 0);
  }
  50% {
    border-color: rgba(20, 184, 166, 0.8);
    background: #0b948c;
    box-shadow: 0 0 0 4px rgba(20, 184, 166, 0.18);
  }
}

.evolution-console .evolution-zone-sections {
  max-height: 58vh;
  overflow: auto;
  padding-right: 2px;
}

.evolution-console .evolution-zone-choice {
  min-height: 44px;
}

.evolution-notes-panel .textarea {
  min-height: 96px;
}

.dictation-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.dictation-toolbar .btn.recording {
  border-color: #b91c1c;
  background: #fee2e2;
  color: #991b1b;
}

.dictation-status {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 700;
}

.evolution-console .tablet-submit {
  margin-top: 0;
  padding: 12px 0 0;
}

.clinical-question {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(190px, max-content);
  gap: 10px 14px;
  align-items: center;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fbfcfc;
}

.clinical-question legend,
.clinical-question-text {
  grid-column: 1;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  font-weight: 800;
  line-height: 1.3;
  overflow-wrap: anywhere;
  white-space: normal;
}

.clinical-answer-options {
  display: flex;
  grid-column: 2;
  justify-content: flex-end;
  gap: 12px;
  min-width: 86px;
  white-space: nowrap;
}

.clinical-question-hint {
  margin-top: -2px;
  color: var(--muted);
  font-weight: 700;
}

.clinical-question label,
.check-row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}

.clinical-yes-option {
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.clinical-yes-option:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.44);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.1);
}

.clinical-question-selection {
  grid-template-columns: 1fr;
  align-items: start;
}

.clinical-option-list {
  display: grid;
  grid-column: 1 / -1;
  gap: 7px;
}

.clinical-option-choice {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  font-weight: 700;
  line-height: 1.35;
}

.clinical-option-choice span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.compact-textarea {
  grid-column: 1 / -1;
  min-height: 70px;
}

.clinical-note {
  border-left: 4px solid var(--teal);
  border-radius: 6px;
  padding: 12px 14px;
  background: rgba(15, 118, 110, 0.08);
}

.clinical-note ul {
  margin: 8px 0 0;
  padding-left: 20px;
}

.check-row {
  justify-content: flex-start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fbfcfc;
}

.check-row input,
.clinical-question input[type="checkbox"] {
  width: 20px;
  height: 20px;
}

.important-check {
  border-color: rgba(15, 118, 110, 0.32);
  background: rgba(15, 118, 110, 0.08);
}

.rgpd-required-acceptance {
  align-items: flex-start;
}

.rgpd-required-acceptance > input[type="checkbox"] {
  flex: 0 0 24px;
  width: 24px;
  min-width: 24px;
  height: 24px;
  margin-top: 1px;
  accent-color: var(--teal);
}

.rgpd-required-acceptance span {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.rgpd-required-acceptance small {
  color: var(--muted);
  font-weight: 600;
  line-height: 1.45;
}

.rgpd-required-summary {
  display: grid;
  gap: 6px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 12px 12px 32px;
  color: var(--muted);
  background: #fbfcfc;
  line-height: 1.45;
}

.signature-pad {
  width: 100%;
  height: 260px;
  border: 2px dashed rgba(15, 118, 110, 0.42);
  border-radius: 8px;
  background: #fff;
  touch-action: none;
}

.tablet-record-list {
  display: grid;
  gap: 12px;
}

.tablet-record-choice {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
}

.operation-room-card {
  gap: 18px;
}

.tablet-room-header {
  display: grid;
  gap: 8px;
}

.tablet-room-header h1 {
  margin: 0;
  font-size: clamp(1.45rem, 3vw, 2.1rem);
  letter-spacing: 0;
}

.tablet-room-header p {
  margin: 0;
  color: var(--muted);
  line-height: 1.45;
}

.tablet-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.tablet-room-button {
  min-height: 74px;
  font-size: 1.08rem;
}

.tablet-room-bar {
  width: min(980px, 100%);
  margin: 0 auto 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 10px 24px rgba(24, 32, 36, 0.06);
}

.tablet-room-bar strong {
  color: var(--ink);
}

.tablet-room-identity {
  display: grid;
  gap: 2px;
}

.tablet-room-identity span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
}

.tablet-room-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.tablet-ads {
  width: min(980px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tablet-ads-after-form {
  margin-top: 4px;
}

.tablet-ads-after-list {
  margin-top: 16px;
}

.tablet-ad-box {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fbfb;
}

.tablet-ad-box-wide {
  grid-column: 1 / -1;
}

.tablet-ad-box img,
.tablet-ad-box video {
  display: block;
  width: 100%;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

.tablet-ad-box-wide img,
.tablet-ad-box-wide video {
  aspect-ratio: 18 / 7;
  object-fit: contain;
  background: #f8fbfb;
}

.tablet-ad-box [hidden] {
  display: none !important;
}

.signature-summary {
  min-height: 104px;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(15, 118, 110, 0.38);
  border-radius: 8px;
  background: #fbfcfc;
  color: var(--muted);
  font-weight: 700;
  text-align: center;
}

.signature-preview.compact {
  max-height: 96px;
  object-fit: contain;
  background: transparent;
}

.signature-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(15, 23, 42, 0.48);
}

.signature-modal {
  width: min(920px, 100%);
  display: grid;
  gap: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: clamp(16px, 3vw, 24px);
  background: #fff;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.24);
}

.signature-modal-pad {
  height: min(320px, 42vh);
}

.signature-preview {
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}

.clinical-full-details {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fbfcfc;
}

.clinical-full-details summary {
  cursor: pointer;
  font-weight: 900;
}

.clinical-full-details[open] summary {
  margin-bottom: 16px;
}

.clinical-answer-list {
  display: grid;
  gap: 8px;
}

.clinical-answer-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px 12px;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 12px;
  background: #fff;
}

.clinical-answer-row strong {
  min-width: 0;
  overflow-wrap: anywhere;
}

.clinical-answer-row p {
  grid-column: 1 / -1;
  margin: 0;
}

.tablet-submit {
  position: sticky;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  border-top: 1px solid var(--line);
  padding-top: 16px;
  background: linear-gradient(rgba(255,255,255,0.86), #fff 32%);
}

.clinical-prepare-card .tablet-submit {
  position: static;
  margin-top: 4px;
  padding-top: 16px;
  background: #fff;
}

.evolution-submit-row {
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media (orientation: portrait) and (max-width: 920px) {
  .evolution-tablet-page {
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
    padding: 8px;
  }

  .evolution-tablet-page .tablet-brand {
    display: none;
  }

  .evolution-console {
    width: 100%;
    height: 100%;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto;
    gap: 8px;
  }

  .evolution-console-header,
  .evolution-session-strip,
  .evolution-console-panel,
  .evolution-zone-entry-panel {
    box-shadow: none;
  }

  .evolution-console-header {
    padding: 8px 10px;
  }

  .evolution-client-block {
    gap: 3px;
  }

  .evolution-client-block h1 {
    font-size: 1.18rem;
  }

  .evolution-client-meta {
    gap: 5px;
    font-size: 0.78rem;
  }

  .evolution-client-meta span {
    padding: 3px 7px;
  }

  .evolution-console-header .btn {
    width: auto;
    min-height: 38px;
  }

  .evolution-session-strip {
    grid-template-columns: minmax(0, 1fr) 150px minmax(0, 1.2fr);
  }

  .evolution-strip-field {
    min-height: 42px;
    padding: 6px 8px;
  }

  .evolution-strip-field span {
    font-size: 0.68rem;
  }

  .evolution-strip-field input,
  .evolution-strip-field select {
    min-height: 28px;
    font-size: 0.92rem;
  }

  .evolution-session-stepper {
    grid-template-columns: 30px minmax(0, 1fr) 30px;
    gap: 5px;
  }

  .evolution-stepper-btn {
    min-height: 32px;
  }

  .evolution-zone-workspace {
    min-height: 0;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .evolution-zone-tabs-row {
    min-height: 38px;
  }

  .evolution-zone-tabs {
    min-height: 38px;
  }

  .evolution-zone-tab {
    min-width: 82px;
    min-height: 36px;
    padding: 0 9px;
    font-size: 0.82rem;
  }

  .evolution-zone-tab--add {
    min-width: 46px;
  }

  .evolution-zone-entry-panels,
  .evolution-zone-entry-panel.active {
    min-height: 0;
  }

  .evolution-zone-entry-panel.active {
    height: 100%;
    display: grid;
    grid-template-rows: minmax(0, 1fr);
    padding: 8px;
    overflow: hidden;
  }

  .evolution-entry-toolbar {
    margin-bottom: 6px;
  }

  .evolution-entry-actions .btn {
    width: auto;
    min-height: 34px;
    padding: 0 10px;
  }

  .evolution-panel-title {
    gap: 7px;
  }

  .evolution-panel-title span {
    width: 28px;
    height: 28px;
    font-size: 0.74rem;
  }

  .evolution-panel-title h2 {
    font-size: 0.98rem;
  }

  .evolution-zone-entry-grid {
    min-height: 0;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    gap: 8px;
    margin-top: 0;
  }

  .evolution-console-panel {
    min-height: 0;
    padding: 8px;
    gap: 8px;
  }

  .evolution-zone-picker,
  .evolution-zone-sections {
    min-height: 0;
  }

  .evolution-zone-toolbar {
    gap: 5px;
  }

  .evolution-zone-filters {
    gap: 4px;
  }

  .zone-filter-button {
    min-height: 34px;
    padding: 0 9px;
    font-size: 0.8rem;
  }

  .evolution-zone-actions > .btn {
    min-height: 34px;
    width: auto;
  }

  .evolution-zone-search-row {
    grid-template-columns: minmax(0, 1fr) 36px auto;
    gap: 6px;
  }

  .evolution-zone-search-field .input,
  .evolution-zone-search-button {
    min-height: 36px;
  }

  .evolution-zone-search-button {
    width: 36px;
    height: 36px;
  }

  .evolution-zone-sections {
    max-height: none;
    overflow: auto;
    padding-right: 2px;
  }

  .evolution-zone-section h3 {
    font-size: 0.84rem;
  }

  .evolution-zone-list {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .evolution-console .evolution-zone-choice,
  .evolution-zone-choice {
    min-height: 35px;
    padding: 7px 8px;
    font-size: 0.86rem;
  }

  .evolution-characteristics-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .evolution-select-stepper {
    min-height: 58px;
    gap: 4px;
    padding: 6px;
  }

  .evolution-select-stepper > span {
    font-size: 0.62rem;
  }

  .evolution-select-stepper-control {
    grid-template-columns: 32px minmax(0, 1fr) 32px;
    gap: 5px;
  }

  .evolution-select-stepper-control strong {
    min-height: 34px;
    padding: 3px 5px;
    font-size: 0.78rem;
  }

  .evolution-select-stepper-button {
    min-height: 34px;
    font-size: 1.06rem;
  }

  .evolution-machine-compact {
    gap: 7px;
  }

  .evolution-machine-mode {
    gap: 4px;
    padding: 6px;
  }

  .evolution-machine-mode legend {
    font-size: 0.64rem;
  }

  .evolution-machine-mode-options {
    gap: 6px;
  }

  .evolution-machine-mode-option {
    min-height: 34px;
    padding: 5px 7px;
    font-size: 0.8rem;
  }

  .evolution-fixed-tip {
    min-height: 36px;
    padding: 6px 9px;
  }

  .evolution-machine-grid {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .evolution-stepper {
    min-height: 64px;
    grid-template-columns: minmax(0, 1fr) 88px;
    gap: 7px;
    padding: 7px;
  }

  .evolution-stepper-readout span {
    font-size: 0.66rem;
  }

  .evolution-stepper-readout strong {
    font-size: 1.82rem;
  }

  .evolution-stepper-button {
    min-height: 29px;
    font-size: 1.18rem;
  }

  .evolution-notes-panel {
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
  }

  .evolution-notes-panel .evolution-panel-title,
  .evolution-notes-panel .dictation-toolbar {
    align-self: center;
  }

  .evolution-notes-panel .textarea {
    grid-column: 1 / -1;
    min-height: 52px;
    max-height: 78px;
  }

  .evolution-next-session-panel {
    margin-top: 0;
    padding: 8px;
  }

  .evolution-next-session-panel .next-session-controls {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 8px;
  }

  .evolution-next-session-panel .input {
    max-width: none;
    min-height: 36px;
  }

  .evolution-next-session-panel .meta {
    display: none;
  }

  .tablet-submit {
    position: static;
    gap: 8px;
    padding-top: 8px;
  }

  .tablet-submit .btn {
    width: auto;
    min-height: 42px;
  }
}

@media (max-width: 980px) {
  .app-shell {
    display: block;
  }

  .topbar {
    position: sticky;
    height: auto;
    display: block;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .metrics,
  .view-grid,
  .attendance-layout,
  .attendance-columns,
  .cash-billing-layout,
  .cash-shift-actions,
    .cash-sale-detail-grid,
    .settings-grid,
    .template-grid,
    .template-manager-layout,
    .filter-grid,
    .report-filter-grid,
    .evolution-dashboard-grid,
  .client-detail-grid,
  .client-form-body,
  .clinical-grid,
  .routine-workflow-grid,
  .routine-transfer-grid {
    grid-template-columns: 1fr;
  }

  .routine-transfer-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: stretch;
  }

  .client-form-fields--wide {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .topbar-inner {
    grid-template-columns: minmax(0, 1fr);
    padding: 14px 16px 10px;
  }

  .top-actions {
    grid-template-columns: 42px;
    justify-content: flex-start;
  }

  .top-actions .btn.ghost {
    grid-column: auto;
  }

  .topbar-tabs {
    padding: 0 16px 10px;
    overflow-x: auto;
  }

  .topbar-tabs .tabs {
    min-width: max-content;
    display: flex;
    gap: 6px;
    overflow: visible;
  }

  .tab-button {
    width: auto;
    justify-content: center;
  }

  .tab-button--settings {
    margin-top: 0;
  }

  .sidebar-menu-group {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 0;
    border: 0;
    padding: 0;
  }

  .sidebar-menu-heading {
    min-height: 38px;
    white-space: nowrap;
  }

  .sidebar-subtabs {
    display: flex;
    gap: 6px;
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
  }

  .template-manager-sidebar {
    position: static;
    max-height: none;
  }

  .sidebar-footer-actions {
    display: flex;
    min-width: max-content;
    margin-top: 8px;
    border-top: 0;
    padding-top: 0;
  }

  .sidebar-footer-actions .btn {
    width: auto;
  }

  .tab-button--nested {
    padding-left: 14px;
  }
}

@media (max-width: 640px) {
  .metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .two-col,
  .two-columns,
  .evolution-session-strip,
  .evolution-characteristics-grid,
  .evolution-machine-grid,
  .evolution-zone-search-row,
  .evolution-console .evolution-zone-toolbar,
  .rule-box,
  .phone-grid,
  .appointment-date-row,
  .cash-add-row,
  .cash-shift-open-form,
  .cash-shift-summary,
  .cash-edit-row,
  .cash-balance-row,
  .cash-history-row,
  .cash-sale-detail-row,
  .report-row,
  .report-breakdown-row,
  .agenda-mini-card,
  .client-balance-card,
  .client-financial-sale-card,
  .client-consumption-row,
  .quick-client-grid,
  .quick-client-permissions,
  .quick-client .consent-list,
  .client-form-fields,
  .client-form-fields--wide,
  .marketing-recipient {
    grid-template-columns: 1fr;
  }

  .cash-payment-row {
    grid-template-columns: minmax(78px, 0.85fr) minmax(0, 1fr) 32px 32px;
  }

  .evolution-zone-search-row {
    grid-template-columns: minmax(0, 1fr) 38px auto;
  }

  .evolution-zone-actions {
    grid-column: 1;
    grid-row: auto;
  }

  .field--span-2 {
    grid-column: auto;
  }

  .client-form-modal {
    width: calc(100vw - 16px);
  }

  .client-form-header,
  .client-form-actions {
    padding-inline: 12px;
  }

  .client-form-body {
    padding: 12px;
  }

  .agenda-mini-actions {
    justify-content: flex-start;
  }

  .report-row-actions {
    justify-content: flex-start;
  }

  .cash-history-meta {
    justify-content: flex-start;
  }

  .report-row-meta {
    justify-content: flex-start;
  }

  .cash-history-total,
  .report-row-total,
  .report-breakdown-row > strong {
    text-align: left;
  }

  .appointment-balance-heading,
  .appointment-balance-item {
    align-items: stretch;
    flex-direction: column;
  }

  .icon-btn.placeholder {
    display: none;
  }

  .brand span {
    white-space: normal;
  }

  .brand-logo-img {
    width: min(240px, 58vw);
    min-width: 160px;
    max-height: 42px;
  }

  .btn {
    width: 100%;
  }

  .notification-panel {
    position: fixed;
    top: 76px;
    right: 16px;
    left: 16px;
    width: auto;
    max-height: calc(100vh - 96px);
  }

  .notification-controls {
    align-items: flex-start;
  }

  .notification-controls .btn {
    width: auto;
    flex: 0 0 auto;
  }

  .notification-read-all,
  .notification-actions .btn {
    width: auto;
  }

  .notification-center-header,
  .notification-center-toolbar,
  .notification-center-item {
    grid-template-columns: 1fr;
  }

  .notification-center-header {
    align-items: stretch;
    flex-direction: column;
  }

  .notification-center-header-actions,
  .notification-center-item-actions {
    justify-content: flex-start;
  }

  .notification-center-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .notification-center-search,
  .notification-center-search .input {
    width: 100%;
  }

  .item-top,
  .clinical-day-card-grid,
  .notice,
  .appointment-client-header,
  .agenda-calendar-toolbar,
  .agenda-calendar-actions,
  .reschedule-box,
  .modal-header,
  .client-appointment-item,
  .evolution-console-header,
  .tablet-header,
  .compact-item {
    align-items: stretch;
    flex-direction: column;
    grid-template-columns: 1fr;
  }

  .client-appointment-summary {
    grid-template-columns: 32px minmax(0, 1fr);
  }

  .client-appointment-summary > .status-pill {
    grid-column: 2;
    justify-self: start;
  }

  .client-appointment-detail-grid,
  .client-appointment-financial {
    grid-template-columns: 1fr;
  }

  .clinical-day-card-grid {
    grid-template-areas:
      "time"
      "info"
      "state"
      "action";
  }

  .clinical-question {
    grid-template-columns: 1fr;
  }

  .clinical-answer-row {
    grid-template-columns: 1fr;
  }

  .clinical-answer-options {
    grid-column: 1;
    justify-content: flex-start;
    min-width: 0;
  }

  .item-actions {
    justify-content: flex-start;
  }

  .client-evolution-create,
  .client-evolution-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .client-evolution-create .field,
  .client-evolution-actions .evolution-tablet-room-select {
    width: 100%;
  }

  .evolution-tablet-room-select {
    width: 100%;
  }

  .evolution-record-header,
  .evolution-record-actions {
    grid-template-columns: 1fr;
  }

  .evolution-record-status {
    justify-content: flex-start;
  }

  .clinical-day-state,
  .clinical-day-action {
    justify-content: flex-start;
  }

  .clinical-day-time {
    justify-items: start;
    border-right: 0;
    border-bottom: 1px solid rgba(15, 118, 110, 0.16);
    padding: 0 0 8px;
  }

  .agenda-date-input,
  .agenda-nav,
  .agenda-view-switch,
  .agenda-interval-switch {
    width: 100%;
  }

  .agenda-day-row {
    grid-template-columns: 1fr;
  }

  .agenda-day-row--header .agenda-day-time,
  .agenda-day-time--end {
    display: none;
  }

  .agenda-day-slots--full {
    grid-column: 1;
  }

  .tablet-record-choice {
    grid-template-columns: 1fr;
  }

  .tablet-room-bar {
    align-items: stretch;
    flex-direction: column;
  }

  .tablet-room-switch {
    justify-content: flex-start;
  }

  .tablet-record-choice .btn,
  .clinical-answer-options .btn,
  .signature-modal .btn {
    width: auto;
  }
}

/* Client tablet mode: normal document scrolling for anamnese/review pages. */
html.tablet-app-display:not(.operation-tablet-display),
html.tablet-app-display:not(.operation-tablet-display) body,
html.tablet-app-display:not(.operation-tablet-display) #app {
  width: 100%;
  height: auto;
  min-height: 100%;
  overflow: auto;
  overscroll-behavior: auto;
}

html.tablet-app-display:not(.operation-tablet-display) .app-shell.tablet-shell {
  height: auto;
  min-height: 100vh;
  overflow: visible;
}

/* Operation tablet mode: fixed viewport, internal scrolling only. */
html.operation-tablet-display,
html.operation-tablet-display body,
html.operation-tablet-display #app {
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

html.operation-tablet-display body {
  margin: 0;
  touch-action: manipulation;
  background: #eef3f2;
}

html.operation-tablet-display .app-shell.tablet-shell {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.evolution-tablet-page {
  box-sizing: border-box;
  height: 100dvh;
  min-height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
  padding: 8px;
}

.evolution-tablet-page .tablet-brand {
  display: none;
}

.evolution-console {
  width: 100%;
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.42fr);
  grid-template-rows: auto auto minmax(0, 1fr) auto auto;
  grid-template-areas:
    "header header"
    "session session"
    "workspace workspace"
    "notes next"
    "submit submit";
  gap: 8px;
}

.evolution-console--tabbed {
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  grid-template-areas:
    "header"
    "body";
}

.evolution-console-header {
  grid-area: header;
}

.evolution-console-header--operation {
  display: grid;
  grid-template-columns: minmax(130px, 0.38fr) minmax(0, 1fr);
  align-items: center;
  justify-content: normal;
  gap: 8px;
  padding: 6px 10px;
}

.evolution-operation-client-mini {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.evolution-operation-client-mini span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.evolution-operation-client-mini strong {
  overflow: hidden;
  color: var(--ink);
  font-size: 0.96rem;
  font-weight: 900;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.evolution-main-tabs {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(118px, 1fr));
  gap: 4px;
  align-self: center;
  border: 1px solid rgba(15, 118, 110, 0.2);
  border-radius: 8px;
  padding: 4px;
  background: #eef5f4;
}

.evolution-command-bar {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 42px minmax(190px, 0.7fr) auto;
  gap: 6px;
  align-items: center;
  justify-content: end;
}

.evolution-back-button {
  min-height: 38px;
}

.evolution-main-tab {
  min-height: 38px;
  border-radius: 7px;
  padding: 0 12px;
  color: #506168;
  background: transparent;
  font-weight: 900;
}

.evolution-main-tab.active {
  color: #fff;
  background: var(--teal);
  box-shadow: 0 8px 18px rgba(15, 118, 110, 0.18);
}

.evolution-tab-panel {
  grid-area: body;
  min-height: 0;
  overflow: hidden;
}

.evolution-tab-panel[hidden] {
  display: none;
}

.evolution-operation-tab-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: minmax(0, 1fr);
  grid-template-areas: "workspace";
  gap: 8px;
}

.evolution-client-tab-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 6px;
  min-height: 0;
}

.evolution-client-tab-panel .evolution-session-strip {
  grid-area: auto;
}

.evolution-client-tab-panel .evolution-next-session-panel {
  grid-area: auto;
}

.evolution-client-overview {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.15fr);
  grid-template-rows: auto minmax(0, 1fr);
  grid-template-areas:
    "identity anamnese"
    "identity history";
  gap: 8px;
  overflow: hidden;
}

.evolution-client-card {
  min-height: 0;
  display: grid;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(24, 32, 36, 0.08);
  overflow: hidden;
}

.evolution-client-card--identity {
  grid-area: identity;
  display: flex;
  flex-direction: column;
  align-content: start;
}

.evolution-client-card--anamnese {
  grid-area: anamnese;
  grid-template-rows: auto auto minmax(0, 1fr);
}

.evolution-client-card--history {
  grid-area: history;
  grid-template-rows: auto minmax(0, 1fr);
}

.evolution-client-card-header {
  display: grid;
  gap: 4px;
}

.evolution-client-card-header span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.evolution-client-card-header strong {
  color: var(--ink);
  font-size: 1.15rem;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.evolution-client-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.evolution-client-detail-grid .client-detail-field {
  min-width: 0;
  padding: 10px;
  background: #f7faf9;
}

.evolution-client-operational-data {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 10px;
  overflow: hidden;
}

.evolution-client-mini-section {
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #f7faf9;
  overflow: hidden;
}

.evolution-client-mini-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.evolution-client-mini-header span {
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.evolution-client-mini-header strong {
  color: #0f766e;
  font-size: 0.88rem;
  font-weight: 900;
}

.evolution-client-mini-section .attendance-line-list {
  min-height: 0;
  display: grid;
  gap: 6px;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
}

.evolution-client-mini-section .attendance-line {
  min-height: auto;
  padding: 8px 10px;
}

.evolution-client-mini-section .attendance-line strong {
  font-size: 0.92rem;
}

.evolution-client-mini-section .attendance-line small {
  font-size: 0.78rem;
}

.evolution-client-mini-section .empty-state.compact {
  min-height: 0;
  padding: 12px;
}

.evolution-client-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}

.evolution-client-alert,
.evolution-anamnese-ok {
  border: 1px solid rgba(15, 118, 110, 0.22);
  border-radius: 8px;
  padding: 10px 12px;
  color: #0f5f58;
  background: #eef8f7;
  font-weight: 800;
}

.evolution-anamnese-alerts {
  min-height: 0;
  display: grid;
  gap: 8px;
  overflow: hidden;
}

.evolution-anamnese-alerts > strong {
  color: var(--bad);
}

.evolution-anamnese-alert-list,
.evolution-client-history-list {
  min-height: 0;
  display: grid;
  gap: 8px;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
}

.evolution-anamnese-alert,
.evolution-client-history-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fbfcfc;
}

.evolution-anamnese-alert {
  grid-template-columns: minmax(0, 1fr);
}

.evolution-anamnese-alert--clinic-notes {
  border-color: rgba(14, 116, 144, 0.24);
  background: #f0f9fb;
}

.evolution-anamnese-alert span,
.evolution-client-history-item span {
  color: var(--muted);
  font-size: 0.86rem;
  font-weight: 800;
}

.evolution-anamnese-alert strong,
.evolution-client-history-item strong {
  color: var(--ink);
  overflow-wrap: anywhere;
}

.evolution-client-history-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.evolution-client-history-actions .status-pill {
  min-height: 32px;
}

.evolution-client-history-actions .btn {
  min-height: 32px;
}

.evolution-session-strip {
  grid-area: session;
}

.evolution-zone-workspace {
  grid-area: workspace;
  min-height: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.evolution-zone-entry-panels,
.evolution-zone-entry-panel.active,
.evolution-zone-entry-grid,
.evolution-zones-panel,
.evolution-compact-parameters,
.evolution-zone-picker {
  min-height: 0;
}

.evolution-zone-entry-panel.active {
  height: 100%;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  overflow: hidden;
}

.evolution-zone-entry-grid {
  height: 100%;
}

.evolution-zone-sections {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.skin-cleaning-workspace {
  grid-area: workspace;
  min-height: 0;
  display: grid;
  overflow: hidden;
}

.skin-cleaning-panel {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.skin-cleaning-form-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1.28fr);
  gap: 10px;
}

.skin-cleaning-section {
  min-width: 0;
  display: grid;
  gap: 8px;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fbfcfc;
}

.skin-cleaning-section--wide {
  grid-column: 1 / -1;
}

.skin-cleaning-section legend,
.skin-cleaning-other-field span,
.skin-cleaning-observations-field span {
  padding: 0 2px;
  color: #26383e;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}

.skin-cleaning-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.skin-cleaning-section--compact .skin-cleaning-check-grid {
  grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
}

.skin-cleaning-check-grid--compact {
  grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
}

.skin-cleaning-check {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--ink);
  background: #fff;
  font-weight: 900;
}

.skin-cleaning-check input {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  accent-color: var(--teal);
}

.skin-cleaning-check.selected,
.skin-cleaning-check:has(input:checked) {
  border-color: rgba(15, 118, 110, 0.42);
  color: #0f5f58;
  background: rgba(15, 118, 110, 0.11);
}

.skin-cleaning-other-field,
.skin-cleaning-observations-field {
  display: grid;
  gap: 8px;
}

.drenagem-pain-group {
  min-width: 0;
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
}

.skin-cleaning-observations {
  min-height: 82px;
  resize: vertical;
}

.evolution-notes-dialog[hidden] {
  display: none;
}

.evolution-notes-dialog {
  z-index: 110;
}

.evolution-notes-dialog .evolution-notes-panel {
  width: min(720px, calc(100vw - 32px));
  display: grid;
  gap: 12px;
}

.evolution-notes-dialog .textarea {
  min-height: min(34vh, 260px);
  resize: vertical;
}

.evolution-history-detail-dialog[hidden] {
  display: none;
}

.evolution-history-detail-dialog {
  z-index: 112;
}

.evolution-history-detail-panel {
  width: min(980px, calc(100vw - 28px));
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
}

.evolution-history-detail-body {
  min-height: 0;
  display: grid;
  gap: 14px;
  overflow: auto;
  overscroll-behavior: contain;
  padding-right: 2px;
}

.evolution-history-detail-body .clinical-section {
  margin: 0;
}

.evolution-next-session-panel {
  grid-area: next;
  margin-top: 0;
  display: block;
  padding: 6px 10px;
  align-content: center;
}

.evolution-next-session-panel .next-session-controls {
  display: grid;
  grid-template-columns: minmax(210px, 0.42fr) minmax(0, 1fr);
  gap: 8px;
  align-items: center;
}

.evolution-next-session-date {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.evolution-next-session-date span {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 0.74rem;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.evolution-next-session-panel .input {
  max-width: none;
  width: 150px;
  min-height: 32px;
  padding: 0 8px;
}

.evolution-next-session-panel .next-session-suggestions {
  min-width: 0;
  flex-wrap: nowrap;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  padding-bottom: 1px;
}

.evolution-next-session-panel .next-session-suggestions .btn {
  min-height: 32px;
  padding: 0 10px;
  white-space: nowrap;
}

@media (max-width: 760px) {
  .evolution-console {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto minmax(0, 1fr) auto auto auto;
    grid-template-areas:
      "header"
      "session"
      "workspace"
      "notes"
      "next"
      "submit";
  }

  .evolution-operation-tab-panel {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr);
    grid-template-areas: "workspace";
  }

  .evolution-client-overview {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto minmax(0, 1fr);
    grid-template-areas:
      "identity"
      "anamnese"
      "history";
  }

  .skin-cleaning-form-grid {
    grid-template-columns: 1fr;
  }

  .skin-cleaning-section--wide {
    grid-column: auto;
  }

  .evolution-main-tabs {
    width: 100%;
    grid-column: 1 / -1;
  }
}

@media (max-width: 1180px) {
  .cash-billing-layout {
    grid-template-columns: 1fr;
  }

  .cash-summary {
    position: static;
  }
}
.daily-notes-view {
  display: grid;
  gap: 16px;
}

.daily-notes-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.daily-notes-header h2,
.daily-notes-header p,
.daily-note-content p {
  margin: 0;
}

.daily-notes-header p {
  margin-top: 4px;
  color: var(--muted);
}

.daily-notes-date-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.daily-notes-date-controls .input {
  width: 170px;
}

.daily-notes-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
}

.daily-note-form,
.daily-notes-list-panel {
  min-width: 0;
}

.daily-note-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
  gap: 12px 16px;
}

.daily-note-form .panel-heading,
.daily-note-form .daily-note-form-row,
.daily-note-form .field:has(textarea),
.daily-note-form .daily-note-form-actions {
  grid-column: 1 / -1;
}

.daily-note-form-row {
  display: grid;
  grid-template-columns: minmax(150px, 220px) minmax(150px, 220px) minmax(130px, 180px) minmax(140px, 180px);
  gap: 12px;
  align-items: end;
}

.daily-note-pin-toggle {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfa;
  font-weight: 700;
  cursor: pointer;
}

.daily-note-pin-toggle input {
  width: 18px;
  height: 18px;
  accent-color: #128276;
}

.daily-note-form-actions {
  display: flex;
  gap: 8px;
}

.daily-note-form-actions .btn {
  justify-self: start;
}

.daily-notes-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.daily-note-item {
  min-width: 0;
  min-height: 190px;
  padding: 14px;
  border: 1px solid var(--line);
  border-top: 4px solid #8a9aa1;
  border-radius: 6px;
  background: #fff;
}

.daily-note-item.is-pinned {
  box-shadow: inset 0 0 0 1px #c9dfdc;
}

.daily-note-item--important {
  border-left-color: #c88417;
  background: #fffaf0;
}

.daily-note-item--urgent {
  border-left-color: #cf3f38;
  background: #fff5f4;
}

.daily-note-item.is-completed {
  opacity: 0.72;
  background: #f5f7f7;
}

.daily-note-item.is-completed .daily-note-content p {
  text-decoration: line-through;
}

.daily-note-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.daily-note-title-row {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 6px;
}

.daily-note-title-row > strong {
  margin-right: auto;
  font-size: 1rem;
  overflow-wrap: anywhere;
}

.daily-note-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 8px;
  border-radius: 999px;
  background: #edf2f1;
  color: #556865;
  font-size: 0.75rem;
  font-weight: 800;
}

.daily-note-badge.pinned {
  background: #e4f1ef;
  color: #0f6f65;
}

.daily-note-badge.due {
  background: #fff0d5;
  color: #9a5a00;
}

.daily-note-content p {
  margin-top: 16px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  line-height: 1.45;
}

.daily-note-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.82rem;
}

.daily-note-priority {
  font-weight: 700;
}

.daily-note-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: auto;
  padding-top: 14px;
}

.daily-notes-completed {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 10px;
}

.daily-notes-completed summary {
  margin-bottom: 10px;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 900px) {
  .daily-notes-header {
    align-items: stretch;
    flex-direction: column;
  }

  .daily-notes-date-controls {
    flex-wrap: wrap;
  }

  .daily-notes-grid {
    grid-template-columns: 1fr;
  }

  .daily-note-form,
  .daily-note-form-row,
  .daily-notes-list {
    grid-template-columns: 1fr;
  }

  .daily-note-form > * {
    grid-column: 1;
  }

  .follow-up-reminder-fields {
    grid-template-columns: 1fr;
  }
}
