:root {
  --bg: #fff7fa;
  --panel: #ffffff;
  --ink: #2f2d32;
  --muted: #6f6574;
  --line: #eadde6;
  --brand: #ef3340;
  --brand-dark: #c92330;
  --accent: #8d62b0;
  --good: #138a54;
  --warn: #b7791f;
  --bad: #c0392b;
  --orange: #d97706;
  --blue: #2563eb;
  --pink: #db2777;
  --shadow: 0 12px 32px rgba(93, 59, 89, .10);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  display: grid;
  grid-template-columns: 84px 1fr;
  min-height: 100vh;
}

body.locked {
  display: block;
}

body.locked .sidebar,
body.locked main {
  display: none;
}

.login-screen {
  position: fixed;
  inset: 0;
  background: linear-gradient(135deg, #2f2d32, #8d62b0 58%, #ef3340);
  display: none;
  place-items: center;
  padding: 22px;
  z-index: 20;
}

body.locked .login-screen {
  display: grid;
}

body.locked.session-restoring .login-screen {
  display: none;
}

.session-restore-screen {
  position: fixed;
  inset: 0;
  display: none;
  place-items: center;
  padding: 22px;
  z-index: 30;
  background: linear-gradient(135deg, #2f2d32, #8d62b0 58%, #ef3340);
}

body.session-restoring .session-restore-screen {
  display: grid;
}

.session-restore-card {
  width: min(360px, 100%);
  background: #fff;
  border-radius: 14px;
  padding: 30px 24px;
  display: grid;
  justify-items: center;
  gap: 10px;
  text-align: center;
  box-shadow: 0 24px 60px rgba(0,0,0,.22);
}

.session-restore-card .brand-logo {
  width: 88px;
  height: auto;
}

.session-restore-card strong {
  font-size: 20px;
}

.session-restore-card span {
  font-size: 14px;
  opacity: .72;
}

.session-restore-spinner {
  width: 28px;
  height: 28px;
  margin-top: 8px;
  border: 3px solid rgba(47,45,50,.18);
  border-top-color: #2f2d32;
  border-radius: 50%;
  animation: session-restore-spin .8s linear infinite;
}

@keyframes session-restore-spin {
  to { transform: rotate(360deg); }
}

.login-card {
  width: min(420px, 100%);
  background: #fff;
  border-radius: 8px;
  padding: 26px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .22);
  display: grid;
  gap: 16px;
}

.login-brand {
  color: var(--ink);
  padding: 0 0 8px;
}

.login-brand span,
.login-hint {
  color: var(--muted);
}

.login-hint {
  font-size: 13px;
  text-align: center;
}

.login-forgot {
  justify-self: center;
  margin-top: -4px;
  font-weight: 800;
}

.small-muted {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
}

.forgot-password-card,
.password-reset-card {
  background: #fff;
  border: 2px solid #d8c2e8;
  border-top: 6px solid var(--accent);
  border-radius: 10px;
  box-shadow: 0 22px 60px rgba(47, 45, 50, .24);
  display: grid;
  gap: 16px;
  margin: 7vh auto 0;
  padding: 22px;
  width: min(420px, calc(100vw - 32px));
  max-width: 420px;
}

.forgot-password-card .panel-head,
.password-reset-card .panel-head {
  background: #fbf5ff;
  border: 1px solid #eadcf4;
  border-radius: 8px;
  margin: -4px -4px 2px;
  padding: 12px;
}

.forgot-password-card .form,
.password-reset-card .form {
  background: #fffafd;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.sidebar {
  background: #1f1f24;
  color: #fff;
  padding: 18px 10px;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  width: 84px;
  z-index: 10;
  transition: width .18s ease, box-shadow .18s ease;
}

.sidebar.menu-open {
  box-shadow: 16px 0 38px rgba(0, 0, 0, .22);
  width: 260px;
}

.sidebar.force-collapsed,
.sidebar.force-collapsed:not(.menu-open) {
  box-shadow: none;
  width: 84px;
}

.brand {
  background: #1f1f24;
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 4px 4px 8px;
  min-width: 0;
  position: sticky;
  top: 0;
  z-index: 3;
}

.brand-home {
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
  text-align: left;
  width: 100%;
}

.brand-logo {
  width: 58px;
  height: 42px;
  object-fit: contain;
  border-radius: 8px;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, .75);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .16);
  padding: 4px;
}

.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--accent);
  font-weight: 800;
}

.brand span {
  display: block;
  color: #fff;
  font-size: 13px;
  margin-top: 3px;
}

.sidebar .brand > div,
.sidebar nav {
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease;
}

.sidebar.menu-open .brand > div,
.sidebar.menu-open nav {
  opacity: 1;
  pointer-events: auto;
}

.sidebar.force-collapsed:not(.menu-open) .brand > div,
.sidebar.force-collapsed:not(.menu-open) nav {
  opacity: 0;
  pointer-events: none;
}

.sidebar-hover-gear {
  background: rgba(255, 255, 255, .10);
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 8px;
  color: #fff;
  display: grid;
  font-size: 20px;
  height: 42px;
  margin: 4px auto 14px;
  place-items: center;
  position: sticky;
  top: 58px;
  z-index: 3;
  width: 58px;
}

.sidebar.menu-open .sidebar-hover-gear {
  margin-left: 4px;
  margin-right: 0;
}

nav {
  display: grid;
  gap: 5px;
}

.sidebar-search {
  align-items: center;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 8px;
  color: #fff;
  display: flex;
  gap: 8px;
  margin: 2px 0 8px;
  padding: 8px 10px;
}

.sidebar-search span {
  font-weight: 900;
}

.sidebar-search input {
  background: transparent;
  border: 0;
  color: #fff;
  min-width: 0;
  outline: 0;
  width: 100%;
}

.sidebar-search input::placeholder {
  color: rgba(255, 255, 255, .68);
}

.nav-group {
  display: grid;
  gap: 4px;
  margin: 8px 0;
  padding-top: 8px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.nav-group > span {
  align-items: center;
  color: #fff;
  cursor: pointer;
  display: flex;
  font-size: 12px;
  font-weight: 800;
  justify-content: space-between;
  padding: 4px 12px;
  text-transform: uppercase;
  user-select: none;
}

.group-label {
  align-items: center;
  display: inline-flex;
  gap: 8px;
  min-width: 0;
}

.nav-icon {
  align-items: center;
  background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 6px;
  display: inline-flex;
  flex: 0 0 24px;
  font-size: 13px;
  font-weight: 900;
  height: 24px;
  justify-content: center;
  line-height: 1;
  margin-right: 8px;
  width: 24px;
}

.group-label .nav-icon {
  margin-right: 0;
}

.nav-group > span::after {
  color: #fff;
  content: "−";
  font-size: 15px;
  line-height: 1;
}

.nav-group.collapsed > span::after {
  content: "+";
}

.nav-group.collapsed .nav-btn.sub {
  display: none;
}

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

button {
  border: 0;
  cursor: pointer;
}

.nav-btn {
  align-items: center;
  display: flex;
  gap: 0;
  text-align: left;
  color: #fff;
  background: transparent;
  border-radius: 8px;
  padding: 9px 12px;
}

.nav-btn.sub {
  padding-left: 24px;
  font-size: 14px;
}

.nav-btn:hover, .nav-btn.active {
  background: rgba(239, 51, 64, .28);
  color: #fff;
}

main {
  min-width: 0;
  padding: 28px;
}

.topbar {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  margin-bottom: 24px;
}

h1, h2, p { margin: 0; }

h1 {
  font-size: 28px;
  line-height: 1.15;
}

h2 {
  font-size: 18px;
}

.topbar p {
  color: var(--muted);
  margin-top: 6px;
}

.top-actions, .form-actions, .month-controls {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.notification-menu {
  position: relative;
}

.bell-btn {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  box-shadow: 0 8px 18px rgba(31, 41, 51, .08);
  color: var(--ink);
  display: inline-flex;
  font-size: 15px;
  gap: 6px;
  min-height: 38px;
  padding: 7px 10px;
  position: relative;
}

.bell-btn b {
  align-items: center;
  background: var(--brand);
  border-radius: 999px;
  color: #fff;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-width: 20px;
  padding: 2px 6px;
}

.notification-dropdown {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  max-height: 520px;
  min-width: min(420px, 86vw);
  overflow: auto;
  padding: 14px;
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  z-index: 20;
}

.notification-item {
  --notification-color: var(--brand);
  --notification-soft: rgba(124, 58, 237, .08);
  border: 1px solid color-mix(in srgb, var(--notification-color) 22%, var(--line));
  border-radius: 12px;
  display: grid;
  grid-template-columns: 5px 1fr;
  overflow: hidden;
  padding: 0;
  position: relative;
}

.notification-accent {
  background: var(--notification-color);
  min-height: 100%;
}

.notification-card-body {
  background: linear-gradient(90deg, var(--notification-soft), transparent 38%);
  min-width: 0;
  padding: 12px;
}

.notification-critical {
  --notification-color: #ef4444;
  --notification-soft: rgba(239, 68, 68, .10);
}

.notification-high {
  --notification-color: #f97316;
  --notification-soft: rgba(249, 115, 22, .10);
}

.notification-medium,
.notification-pending {
  --notification-color: #eab308;
  --notification-soft: rgba(234, 179, 8, .10);
}

.notification-info,
.notification-commercial {
  --notification-color: #3b82f6;
  --notification-soft: rgba(59, 130, 246, .09);
}

.notification-financial {
  --notification-color: #8b5cf6;
  --notification-soft: rgba(139, 92, 246, .10);
}

.notification-success {
  --notification-color: #22c55e;
  --notification-soft: rgba(34, 197, 94, .10);
}

.notification-heading {
  align-items: flex-start;
  display: flex;
  gap: 9px;
  min-width: 0;
}

.notification-heading > div {
  min-width: 0;
}

.notification-icon {
  align-items: center;
  background: #fff;
  border: 1px solid color-mix(in srgb, var(--notification-color) 24%, var(--line));
  border-radius: 10px;
  display: inline-flex;
  flex: 0 0 32px;
  font-size: 16px;
  height: 32px;
  justify-content: center;
}

.notification-category {
  color: var(--notification-color);
  display: block;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .07em;
  margin-bottom: 2px;
  text-transform: uppercase;
}

.notification-status-badge {
  background: var(--notification-soft);
  border: 1px solid color-mix(in srgb, var(--notification-color) 30%, transparent);
  border-radius: 999px;
  color: var(--notification-color);
  flex: 0 0 auto;
  font-size: 9px;
  font-weight: 800;
  padding: 4px 7px;
  white-space: nowrap;
}

.notification-meta {
  color: #756b7c;
  font-size: 10px;
  line-height: 1.35;
  margin: 7px 0 0 41px;
}

.notification-item .pill {
  font-size: 10px;
}

.notification-item .actions {
  margin: 7px 0 0 41px;
}

.notification-item .actions button {
  font-size: 11px;
  min-height: 30px;
  padding: 5px 9px;
}

.notification-group + .notification-group {
  border-top: 1px solid var(--line);
  margin-top: 12px;
  padding-top: 12px;
}

.notification-group-header {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: 0 2px 8px;
}

.notification-group-header h4 {
  color: var(--ink);
  font-size: 11px;
  letter-spacing: .05em;
  margin: 0;
  text-transform: uppercase;
}

.notification-group-header span {
  align-items: center;
  background: #f3f4f6;
  border-radius: 999px;
  color: var(--muted);
  display: inline-flex;
  font-size: 10px;
  font-weight: 800;
  justify-content: center;
  min-width: 21px;
  padding: 2px 6px;
}

.notification-group .notification-item + .notification-item {
  margin-top: 8px;
}

.bell-btn b.notification-count {
  background: #6b7280;
}

.bell-btn b.notification-count-critical {
  background: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .15);
}

.bell-btn b.notification-count-high {
  background: #f97316;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .15);
}

.bell-btn b.notification-count-medium,
.bell-btn b.notification-count-pending {
  background: #eab308;
  color: #422006;
}

.bell-btn b.notification-count-financial {
  background: #8b5cf6;
}

.bell-btn b.notification-count-commercial,
.bell-btn b.notification-count-info {
  background: #3b82f6;
}

.bell-btn b.notification-count-none {
  background: #9ca3af;
}

@media (max-width: 560px) {
  .notification-dropdown {
    min-width: min(360px, 92vw);
    right: -8px;
  }

  .notification-item .item-top {
    align-items: flex-start;
    gap: 7px;
  }

  .notification-status-badge,
  .notification-item .pill {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

.form-tabs {
  display: flex;
  gap: 8px;
  border-bottom: 1px solid var(--line);
  padding-bottom: 8px;
}

.form-tab {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  border-radius: 8px;
  padding: 9px 12px;
  font-weight: 800;
}

.form-tab.active {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

.form-tab-panel {
  display: none;
  gap: 13px;
}

.form-tab-panel.active {
  display: grid;
}

.technical-summary {
  border-left: 3px solid var(--brand);
  background: #f4faf9;
  padding: 10px 12px;
  border-radius: 0 8px 8px 0;
  display: grid;
  gap: 6px;
}

.technical-summary p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.technical-summary strong {
  color: var(--ink);
}

.help-box {
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #f8fafb;
  color: var(--muted);
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.45;
}

.questionnaire-box {
  display: grid;
  gap: 8px;
  border: 1px solid #f0c6d9;
  border-radius: 8px;
  background: #fff7fb;
  padding: 12px;
  margin: 10px 0 14px;
}

.questionnaire-box h3,
.questionnaire-box p {
  margin: 0;
}

.rating-options {
  display: grid;
  grid-template-columns: repeat(4, minmax(80px, 1fr));
  gap: 8px;
}

.rating-options span {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
  font-weight: 800;
  padding: 8px;
  text-align: center;
}

.survey-preview-question {
  display: grid;
  gap: 8px;
  padding: 10px 0;
  border-bottom: 1px solid #f1dce8;
}

.survey-preview-question:last-child {
  border-bottom: 0;
}

.survey-open-preview {
  border: 1px dashed var(--line);
  border-radius: 6px;
  color: var(--muted);
  padding: 10px;
}

.survey-client-question {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
}

.survey-client-question legend {
  color: var(--ink);
  font-weight: 800;
  padding: 0 6px;
}

.survey-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
}

.survey-choice {
  align-items: center;
  background: #fff8fc;
  border: 1px solid #ead8e3;
  border-radius: 7px;
  display: flex;
  gap: 8px;
  padding: 10px;
}

.survey-response-body {
  border-top: 1px solid var(--line);
  margin-top: 10px;
  padding-top: 10px;
}

.survey-link-preview {
  color: var(--muted);
  display: block;
  overflow-wrap: break-word;
  padding-top: 8px;
}

.survey-metrics {
  margin: 14px 0;
}

.survey-filters {
  background: #faf7fc;
  border: 1px solid #eadcf0;
  border-radius: 8px;
  margin: 10px 0 14px;
  padding: 12px;
}

.survey-analytics {
  margin: 12px 0 16px;
}

.survey-analysis-card {
  box-shadow: none;
  padding: 14px;
}

.survey-analysis-card h3 {
  font-size: 15px;
  margin: 0 0 12px;
}

.public-survey-screen {
  align-items: start;
  background: #f7f1f8;
  display: flex;
  inset: 0;
  justify-content: center;
  min-height: 100vh;
  overflow: auto;
  padding: 32px 18px;
  position: fixed;
  z-index: 100;
}

.public-survey-card {
  background: #fff;
  border: 1px solid #eadce8;
  border-radius: 8px;
  box-shadow: 0 18px 48px rgba(67, 45, 66, .16);
  max-width: 760px;
  padding: 24px;
  width: 100%;
}

.public-survey-brand {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 14px;
  margin-bottom: 22px;
  padding-bottom: 16px;
}

.public-survey-brand img {
  height: 62px;
  object-fit: contain;
  width: 92px;
}

.public-survey-brand div {
  display: grid;
  gap: 3px;
}

.public-survey-brand strong {
  color: var(--ink);
  font-size: 22px;
}

.public-survey-brand span,
.public-survey-intro span {
  color: var(--muted);
}

.public-survey-intro {
  display: grid;
  gap: 9px;
  margin-bottom: 22px;
}

.public-survey-intro h1,
.public-survey-intro p {
  margin: 0;
}

.public-survey-form {
  display: grid;
  gap: 18px;
}

.public-survey-message {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 24px;
  text-align: center;
}

.public-survey-message.success {
  background: #eef9f0;
  border-color: #b9dfc0;
}

.public-survey-message.bad {
  background: #fff3f3;
  border-color: #efc1c1;
}

body.public-survey-mode .toast {
  z-index: 110;
}

.warning-box {
  border: 1px solid #f2c879;
  border-radius: 8px;
  background: #fffaf0;
  display: grid;
  gap: 10px;
  padding: 12px;
}

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

.warning-list article {
  align-items: start;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  padding: 10px;
}

.warning-list p,
.warning-list small {
  color: var(--muted);
  display: block;
  margin: 4px 0 0;
}

.file-link {
  display: inline-flex;
  margin-top: 8px;
  text-decoration: none;
}

.file-missing {
  background: #fff7ed;
  border: 1px solid #fed7aa;
  border-radius: 8px;
  color: #9a3412;
  padding: 6px 8px;
}

.user-warning-history {
  border: 1px solid var(--line);
  border-radius: 8px;
  margin-top: 10px;
  padding: 10px;
}

.user-warning-history summary {
  cursor: pointer;
  font-weight: 800;
}

.client-history {
  border-top: 1px solid var(--line);
  margin-top: 10px;
  padding-top: 10px;
}

.client-history summary {
  cursor: pointer;
  font-weight: 800;
}

.user-card summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
}

.dashboard-party-card summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
}

.dashboard-party-card summary::-webkit-details-marker {
  display: none;
}

.dashboard-party-card summary::before {
  color: var(--brand);
  content: "+";
  font-weight: 900;
}

.dashboard-party-card[open] summary::before {
  content: "-";
}

.dashboard-party-card .sale-card {
  border-color: #dfe7ef;
  box-shadow: none;
  margin-top: 10px;
}

.user-card summary::-webkit-details-marker {
  display: none;
}

.user-card-head-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.user-card summary::before {
  color: var(--brand);
  content: "+";
  font-weight: 900;
}

.user-card[open] summary::before {
  content: "-";
}

.user-card-body {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}

.user-payment-history {
  border: 1px solid #cfe7d8;
  border-radius: 8px;
  margin-top: 10px;
  padding: 10px;
}

.user-payment-history summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-weight: 800;
  gap: 8px;
}

.payment-history-list {
  display: grid;
  gap: 10px;
  margin-top: 10px;
}

.payment-history-card {
  background: #fbfefc;
  border: 1px solid #dcebe2;
  border-radius: 8px;
  padding: 12px;
}

.payment-history-card p {
  margin: 4px 0;
}

.payroll-payment-card {
  background: #fff;
  border: 1px solid #ddd3e4;
  border-radius: 8px;
  padding: 18px;
}

.payment-receipt-details {
  display: grid;
  gap: 8px;
}

.contract-editor {
  position: fixed;
  inset: 0;
  z-index: 30;
  background: rgba(31, 41, 51, .45);
  padding: 24px;
  overflow: auto;
}

.contract-editor-panel {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  gap: 12px;
}

.contract-editor-actions {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 12px;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  flex-wrap: wrap;
}

.contract-editor-actions > div:first-child {
  display: grid;
  gap: 3px;
}

.contract-version-box {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  display: grid;
  gap: 10px;
  padding: 14px;
}

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

.contract-file-list article {
  align-items: center;
  background: #faf8fb;
  border: 1px solid var(--line);
  border-radius: 7px;
  display: grid;
  gap: 6px;
  grid-template-columns: 1fr auto auto;
  padding: 9px 10px;
}

.editable-contract {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  box-sizing: border-box;
  max-width: 760px;
  padding: 32px;
  min-height: 640px;
  outline: none;
  overflow-wrap: break-word;
  white-space: normal;
  width: 100%;
}

.editable-contract .document-body,
.print-doc .document-body {
  box-sizing: border-box;
  max-width: 100%;
  overflow-wrap: break-word;
  white-space: normal;
  word-break: normal;
}

.document-signature-image {
  display: block;
  width: auto;
  max-width: 240px;
  max-height: 95px;
  object-fit: contain;
  margin: 12px 0 4px;
}

.document-template-form .help-box {
  margin-top: 0;
}

.document-token-box {
  display: grid;
  gap: 10px;
}

.document-token-box strong {
  color: var(--text);
  font-size: 14px;
}

.document-token-box p {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.token-button-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.token-button-grid button {
  background: #f7f2fb;
  border: 1px solid #e4d5ef;
  border-radius: 999px;
  color: #5f3a67;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
  padding: 8px 12px;
}

.token-button-grid button:hover {
  background: #efe3f8;
  border-color: #d8c0ea;
}

.muted-help {
  background: #f7f9fb;
  color: var(--muted);
}

.document-library-list {
  align-content: start;
}

.document-card {
  border-width: 2px;
}

.document-card .actions {
  justify-content: flex-start;
}

.file-link {
  text-decoration: none;
}

.document-header {
  align-items: center;
  border-bottom: 3px solid var(--brand);
  display: grid;
  gap: 10px;
  justify-items: center;
  margin-bottom: 26px;
  padding-bottom: 16px;
  text-align: center;
}

.document-header img {
  background: #fff;
  display: block;
  height: 86px;
  object-fit: contain;
  margin: 0 auto;
  width: 220px;
}

.document-header strong {
  color: var(--ink);
  display: block;
  font-size: 22px;
  line-height: 1.1;
}

.document-header span {
  color: var(--muted);
  display: block;
  font-size: 14px;
  font-weight: 700;
  margin-top: 6px;
}

.payment-modal {
  position: fixed;
  inset: 0;
  z-index: 28;
  background: rgba(31, 41, 51, .45);
  padding: 24px;
  overflow: auto;
}

.payment-modal.hidden {
  display: none;
}

.payment-panel {
  max-width: 820px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 18px;
  display: grid;
  gap: 16px;
}

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

.payment-head h2 {
  margin: 0;
}

.payment-head p {
  color: var(--muted);
  margin-top: 6px;
}

.field-with-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px;
  gap: 8px;
  align-items: stretch;
}

.field-with-action select {
  width: 100%;
}

.field-action-btn {
  min-height: 44px;
}

.additional-service-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 46px;
  gap: 8px;
  align-items: stretch;
}

.additional-service-field select {
  min-height: 116px;
  width: 100%;
}

.additional-service-actions {
  display: grid;
  align-content: start;
  gap: 8px;
}

.additional-service-actions .icon-btn {
  font-size: 22px;
  min-height: 46px;
  width: 46px;
}

#saleServiceSelectionSummary {
  color: var(--muted);
  display: block;
  font-size: 12px;
  line-height: 1.4;
  margin-top: 6px;
}

.service-catalog-panel {
  max-width: 920px;
  margin-top: 3vh;
}

.service-catalog-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
}

.service-search-label {
  margin: 0;
}

.service-editor {
  background: #f8f4fb;
  border: 1px solid #dacbe7;
  border-radius: 8px;
  padding: 14px;
}

.service-catalog-summary {
  color: var(--muted);
  font-size: 13px;
  font-weight: 800;
}

.service-catalog-list {
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  max-height: 52vh;
  overflow: auto;
}

.service-catalog-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: 28px minmax(0, 1fr) auto auto;
  padding: 12px 14px;
}

.service-catalog-row:last-child {
  border-bottom: 0;
}

.service-catalog-row.selected {
  background: #f5effa;
}

.service-catalog-row input {
  height: 18px;
  margin: 0;
  width: 18px;
}

.service-catalog-info {
  min-width: 0;
}

.service-catalog-info strong,
.service-catalog-info small {
  display: block;
}

.service-catalog-info small {
  color: var(--muted);
  margin-top: 3px;
}

.service-catalog-price {
  color: #276b42;
  font-weight: 900;
  white-space: nowrap;
}

.service-catalog-footer {
  justify-content: flex-end;
}

.record-tracking {
  background: #f7f5f9;
  border-left: 3px solid #b8a1c9;
  color: #62586a;
  font-size: 12px;
  line-height: 1.45;
  margin: 8px 0;
  padding: 7px 10px;
}

.work-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 8px 0;
}

.work-status-actions button {
  background: #fff;
  border-color: #d8cedf;
  color: #5f5268;
  font-size: 12px;
  min-height: 34px;
  padding: 7px 11px;
}

.work-status-actions button.active {
  background: #e7f6eb;
  border-color: #a9dbb5;
  color: #276a3c;
  opacity: 1;
}

.work-status-actions button:disabled:not(.active) {
  opacity: .45;
}

.payroll-slip {
  border: 2px solid #1f2328;
  color: #111;
  font-family: Arial, sans-serif;
  font-size: 12px;
  line-height: 1.25;
}

.payroll-slip-company {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  border-bottom: 2px solid #1f2328;
}

.payroll-slip-company > div {
  display: grid;
  gap: 3px;
  padding: 10px;
}

.payroll-slip-title {
  border-left: 1px solid #1f2328;
  text-align: center;
}

.payroll-slip-title strong {
  font-size: 17px;
}

.payroll-slip-employee {
  display: grid;
  grid-template-columns: .7fr 2fr 1fr 1.25fr 1.3fr;
  border-bottom: 2px solid #1f2328;
}

.payroll-slip-employee > div,
.payroll-slip-bases > div {
  display: grid;
  gap: 4px;
  padding: 8px;
  text-align: center;
}

.payroll-slip small {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}

.payroll-slip-table {
  border-collapse: collapse;
  table-layout: fixed;
  width: 100%;
}

.payroll-slip-table th,
.payroll-slip-table td {
  border-right: 1px solid #1f2328;
  padding: 5px 7px;
}

.payroll-slip-table th:last-child,
.payroll-slip-table td:last-child {
  border-right: 0;
}

.payroll-slip-table thead {
  border-bottom: 2px solid #1f2328;
}

.payroll-slip-table th {
  text-align: center;
}

.payroll-slip-table th:nth-child(1) { width: 10%; }
.payroll-slip-table th:nth-child(2) { width: 40%; }
.payroll-slip-table th:nth-child(3) { width: 13%; }
.payroll-slip-table th:nth-child(4),
.payroll-slip-table th:nth-child(5) { width: 18.5%; }

.payroll-slip-table tbody tr {
  height: 28px;
}

.payroll-slip-table td:nth-child(1),
.payroll-slip-table td:nth-child(3) {
  text-align: center;
}

.payroll-slip-table td:nth-child(4),
.payroll-slip-table td:nth-child(5),
.payroll-slip-table tfoot td {
  text-align: right;
}

.payroll-slip-table tfoot {
  border-top: 2px solid #1f2328;
}

.payroll-slip-table tfoot tr + tr {
  border-top: 1px solid #1f2328;
}

.payroll-slip-net th,
.payroll-slip-net td {
  font-size: 15px;
  font-weight: 900;
}

.payroll-slip-bases {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border-top: 2px solid #1f2328;
}

.payroll-slip-bases > div + div {
  border-left: 1px solid #1f2328;
}

.payroll-slip-details {
  border-top: 1px solid #1f2328;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  padding: 8px 10px;
}

.payroll-slip-signature {
  border-top: 2px solid #1f2328;
  padding: 12px 18px 10px;
  text-align: center;
}

.payroll-slip-signature > div {
  display: grid;
  gap: 24px;
  grid-template-columns: 1fr 2fr;
  margin-top: 22px;
}

.payroll-slip-signature > div:last-child {
  margin-top: 3px;
}

.payroll-auto-summary {
  background: #f7f5f9;
  border: 1px solid #ddd3e4;
  border-radius: 7px;
  display: flex;
  flex-wrap: wrap;
  gap: 7px 14px;
  min-height: 42px;
  padding: 10px 12px;
}

.payroll-auto-summary:empty::before {
  color: var(--muted);
  content: "Selecione o funcionario para visualizar os calculos automaticos.";
  font-size: 12px;
}

.payroll-auto-summary span {
  color: #675d6d;
  font-size: 12px;
}

.compact-modal-card {
  max-width: 520px;
  margin: 8vh auto 0;
}

.calendar-day-panel {
  max-width: 980px;
  margin-top: 4vh;
}

.calendar-day-panel .list {
  max-height: 65vh;
  overflow: auto;
}

.user-badge {
  color: var(--muted);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 12px;
  font-size: 13px;
  font-weight: 800;
}

.hidden-by-permission {
  display: none !important;
}

.hidden-by-search {
  display: none !important;
}

.view {
  display: none;
}

.view.active {
  display: block;
}

.hidden {
  display: none !important;
}

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

.metrics article, .panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
}

.metrics article {
  padding: 18px;
}

.dashboard-click-card {
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.dashboard-click-card:hover,
.dashboard-click-card:focus-visible {
  border-color: #d7c7ea;
  box-shadow: 0 10px 28px rgba(112, 72, 142, .12);
  outline: none;
  transform: translateY(-1px);
}

.metrics span {
  color: var(--muted);
  font-size: 13px;
}

.metrics strong {
  display: block;
  font-size: 25px;
  margin-top: 8px;
}

.split {
  display: grid;
  grid-template-columns: minmax(360px, .95fr) minmax(420px, 1.2fr);
  gap: 18px;
  align-items: start;
}

#packages .split {
  grid-template-columns: minmax(760px, 1.45fr) minmax(340px, .75fr);
}

.package-tabs {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 18px;
  margin: -4px 0 18px;
}

.package-tab {
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  color: var(--muted);
  font-size: 17px;
  padding: 12px 0;
}

.package-tab.active {
  border-bottom-color: var(--accent);
  color: var(--ink);
}

.package-tab-panel {
  display: none;
}

.package-tab-panel.active {
  display: grid;
  gap: 14px;
}

.package-cost-toolbar {
  align-items: end;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.package-cost-toolbar select {
  min-height: 38px;
  min-width: 230px;
}

.dashboard-list-card {
  width: min(820px, calc(100vw - 32px));
}

.search-inline {
  min-width: 220px;
}

.package-cost-table-wrap {
  border: 1px solid var(--line);
  border-radius: 8px;
  max-height: 430px;
  overflow: auto;
}

.package-cost-table {
  border-collapse: collapse;
  min-width: 1120px;
  width: 100%;
}

.package-cost-table th,
.package-cost-table td {
  border-bottom: 1px solid var(--line);
  padding: 8px;
  text-align: left;
  vertical-align: middle;
}

.package-cost-table th {
  background: #f5f1f8;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
}

.package-cost-table input {
  min-height: 36px;
  padding: 7px 8px;
}

.package-cost-table td:nth-child(3),
.package-cost-table td:nth-child(4),
.package-cost-table td:nth-child(5) {
  display: grid;
  grid-template-columns: minmax(80px, 1fr) 58px;
  gap: 5px;
}

.package-cost-group td {
  background: #fbf8fd;
  color: var(--ink);
  font-weight: 800;
}

.package-markup-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.sales-workspace {
  display: grid;
  gap: 18px;
}

.sale-editor-panel {
  max-width: 980px;
}

.dashboard-analytics {
  margin-bottom: 18px;
}

.dashboard-category {
  margin: 16px 0 10px;
}

.dashboard-category h2 {
  margin: 0;
  font-size: 18px;
}

.dashboard-title-row {
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.dashboard-config-btn {
  background: #fff;
  border: 1px solid var(--line);
  color: var(--brand);
  font-size: 18px;
}

.dashboard-config-panel {
  max-width: 720px;
}

.compact-permission-box {
  grid-template-columns: repeat(2, minmax(180px, 1fr));
}

.backup-box {
  background: #f8fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.backup-box span {
  color: var(--muted);
  font-size: 13px;
}

.dashboard-calendar-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 10px;
}

.dashboard-calendar-grid > section {
  min-width: 0;
  border: 1px solid #ded8e7;
  border-radius: 8px;
  background: #fff;
  padding: 10px;
  box-shadow: 0 8px 18px rgba(71, 63, 82, .07);
  height: 500px;
  overflow: hidden;
}

.dashboard-calendar-grid .calendar-grid {
  border-color: #e0dbe7;
  background: #ecebed;
  box-shadow: none;
  gap: 1px;
  padding: 1px;
  grid-template-rows: 42px repeat(6, 64px);
  height: 427px;
}

.dashboard-calendar-grid .day-name {
  color: #928c96;
  background: #f2f1f3;
  border: 0;
  border-radius: 0;
}

.dashboard-calendar-grid .day {
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  min-height: 0;
  height: 64px;
  overflow: hidden;
}

.dashboard-calendar-grid .day.muted {
  background: #eeecef;
  color: #aaa5ad;
}

.dashboard-calendar-grid button.day:hover {
  background: #fbf9ff;
  box-shadow: inset 0 0 0 2px rgba(141, 98, 176, .22);
}

.dashboard-panel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 18px;
  align-items: start;
}

.filters {
  display: flex;
  align-items: end;
  gap: 10px;
  flex-wrap: wrap;
}

.filters label {
  min-width: 150px;
}

.finance-filters {
  background: #f8fafb;
  border: 1px solid var(--line);
  border-radius: 8px;
  margin: 12px 0;
  padding: 12px;
}

.event-filters {
  background: #fbf8ff;
  border: 1px solid #eadcf5;
  border-radius: 8px;
  margin: 12px 0 16px;
  padding: 12px;
}

.event-filters input,
.event-filters select {
  min-height: 38px;
}

.mini-metrics {
  margin-bottom: 16px;
}

.chart-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}

.chart-grid h3 {
  font-size: 14px;
  margin: 0 0 10px;
}

.bar-chart {
  display: grid;
  gap: 10px;
}

.bar-row {
  display: grid;
  grid-template-columns: 110px 1fr 110px;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}

.bar-row strong {
  text-align: right;
}

.bar-row.compact {
  grid-template-columns: 88px 1fr 86px;
}

.bar-track {
  height: 12px;
  border-radius: 999px;
  background: #eef2f5;
  overflow: hidden;
}

.bar-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--brand);
}

.bar-track i.receivable { background: var(--orange); }
.bar-track i.received { background: var(--blue); }
.bar-track i.paid { background: var(--good); }
.bar-track i.pending { background: var(--warn); }
.bar-track i.payable { background: var(--orange); }
.bar-track i.overdue { background: var(--bad); }

.panel {
  padding: 18px;
}

.panel:has(.calendar-popover) {
  position: relative;
}

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

.form {
  display: grid;
  gap: 13px;
}

label {
  color: var(--muted);
  font-size: 13px;
  display: grid;
  gap: 6px;
}

fieldset {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
}

legend {
  color: var(--ink);
  font-weight: 800;
  padding: 0 6px;
}

.permission-box {
  display: grid;
  gap: 8px 12px;
  grid-template-columns: 1fr;
}

.permission-box label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ink);
}

.permission-box input {
  width: auto;
}

.permission-scope-notice {
  background: #f5f0fa;
  border: 1px solid #d9c8e8;
  border-radius: 6px;
  color: #594966;
  font-size: 13px;
  line-height: 1.45;
  margin: 0;
  padding: 10px 12px;
}

.permission-muted {
  opacity: .45;
  cursor: not-allowed;
}

.permission-category {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 10px;
}

.permission-category summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  font-weight: 900;
  gap: 10px;
  justify-content: space-between;
  list-style: none;
}

.permission-category summary::-webkit-details-marker {
  display: none;
}

.permission-category-grid {
  display: grid;
  gap: 8px 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 10px;
}

.permission-locked-category {
  background: #fff7f9;
  border-color: #efcfd7;
}

.permission-locked {
  cursor: not-allowed;
  opacity: .48;
}

.permission-locked input {
  cursor: not-allowed;
}

.fee-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(5, minmax(74px, 1fr));
}

.cash-flow-grid {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.cash-flow-grid span {
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 4px;
  padding: 9px;
}

.cash-flow-grid strong {
  color: var(--ink);
  font-size: 14px;
}

input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  color: var(--ink);
  background: #fff;
  min-width: 0;
}

.locked-field input {
  background: #eef3f7;
  color: var(--muted);
  cursor: not-allowed;
}

.locked-field::after {
  content: "Controlado pelo administrador";
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
}

.conditional-field.hidden {
  display: none;
}

textarea {
  resize: vertical;
}

.two {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.primary, .secondary, .ghost, .icon-btn {
  border-radius: 8px;
  padding: 11px 14px;
  font-weight: 700;
}

.primary {
  background: var(--brand);
  color: #fff;
}

.primary:hover { background: var(--brand-dark); }

.secondary {
  background: #e8f4f3;
  color: var(--brand-dark);
}

.ghost {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}

.small {
  padding: 8px 11px;
  font-size: 13px;
}

.icon-btn {
  width: 40px;
  height: 40px;
  padding: 0;
  background: #edf2f5;
  color: var(--ink);
  font-size: 25px;
  line-height: 1;
}

.file-btn {
  position: relative;
  overflow: hidden;
}

.file-btn input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.search {
  max-width: 300px;
}

.list {
  display: grid;
  gap: 10px;
}

.event-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow-x: auto;
  background: #fff;
}

.event-table-row {
  align-items: center;
  border-bottom: 1px solid var(--line);
  color: #6b6470;
  display: grid;
  gap: 12px;
  grid-template-columns: 28px 68px 92px 102px minmax(150px, 1.3fr) minmax(130px, 1fr) minmax(130px, 1fr) 70px minmax(120px, 1fr) minmax(110px, .9fr) minmax(110px, .9fr) 110px 100px 70px 190px;
  min-height: 56px;
  min-width: 1740px;
  padding: 9px 12px;
}

.event-table-row:last-child {
  border-bottom: 0;
}

.event-table-head {
  background: #f7f4f8;
  color: #9b929e;
  font-size: 0.72rem;
  font-weight: 900;
  min-height: 42px;
  text-transform: uppercase;
}

.link-button {
  background: transparent;
  border: 0;
  color: #3979c9;
  cursor: pointer;
  font: inherit;
  font-weight: 750;
  padding: 0;
  text-align: left;
}

.event-client-name {
  line-height: 1.25;
}

.event-row-actions {
  display: flex;
  gap: 6px;
}

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

.item {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px;
  display: grid;
  gap: 9px;
  background: #fff;
}

.item.cancelled-item {
  border-color: rgba(192, 57, 43, .35);
  background: #fffafa;
}

.sale-card {
  border: 3px solid #1f2933;
  box-shadow: 0 10px 26px rgba(31, 41, 51, .12);
}

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

.item h3 {
  margin: 0;
  font-size: 16px;
}

.item p {
  color: var(--muted);
  line-height: 1.45;
}

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

.sale-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 8px;
}

.summary-cell,
.sale-detail-grid > div {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  padding: 10px;
  display: grid;
  gap: 4px;
}

.summary-cell span,
.sale-detail-grid span {
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
}

.summary-cell strong,
.sale-detail-grid strong {
  color: var(--ink);
  font-size: 14px;
}

.summary-cell.highlight {
  border-color: rgba(0, 109, 119, .25);
  background: #edf8f8;
}

.summary-cell.attention {
  border-color: rgba(183, 121, 31, .28);
  background: #fff8ea;
}

.summary-cell.ok {
  border-color: rgba(19, 138, 84, .25);
  background: #eefaf3;
}

.sale-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 8px;
}

.financial-history {
  border: 1px solid #cbd7e3;
  border-radius: 8px;
  background: #fbfdff;
  overflow: hidden;
}

.financial-history summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  list-style: none;
  padding: 11px 12px;
}

.financial-history summary::-webkit-details-marker {
  display: none;
}

.financial-history summary::before {
  content: "+";
  align-items: center;
  background: #edf2f5;
  border-radius: 999px;
  color: var(--brand);
  display: inline-grid;
  flex: 0 0 24px;
  font-weight: 900;
  height: 24px;
  place-items: center;
  width: 24px;
}

.financial-history[open] summary::before {
  content: "-";
}

.financial-history summary span {
  color: var(--ink);
  flex: 1;
  font-weight: 900;
}

.financial-history summary strong {
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}

.financial-history-body {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 8px;
  padding: 10px;
}

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

.financial-history-row strong {
  display: block;
  font-size: 13px;
}

.financial-history-row span,
.financial-history-row p {
  color: var(--muted);
  font-size: 12px;
  margin: 2px 0 0;
}

.history-amount {
  display: grid;
  gap: 6px;
  justify-items: end;
  min-width: 120px;
}

.history-amount b {
  font-size: 14px;
}

.balance-row {
  border-color: rgba(0, 109, 119, .25);
  background: #f2fbfb;
}

.cancel-box {
  border: 1px solid rgba(192, 57, 43, .25);
  border-radius: 8px;
  background: #fdeceb;
  color: var(--bad);
  padding: 12px;
  display: grid;
  gap: 5px;
}

.cancel-box p {
  color: var(--ink);
  margin: 0;
}

.cancel-box span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.pill {
  color: var(--ink);
  background: #edf2f5;
  border-radius: 999px;
  padding: 5px 9px;
  font-size: 12px;
  font-weight: 700;
}

.pill.good { color: var(--good); background: #e8f7ef; }
.pill.warn { color: var(--warn); background: #fff4dc; }
.pill.bad { color: var(--bad); background: #fdeceb; }
.pill.paid { color: var(--good); background: #e8f7ef; }
.pill.received { color: var(--blue); background: #eaf1ff; }
.pill.overdue { color: var(--bad); background: #fdeceb; }
.pill.payable { color: var(--orange); background: #fff3df; }
.pill.pending { color: var(--warn); background: #fff4dc; }
.pill.visit-closed,
.visit-closed { color: var(--good); background: #e8f7ef; }
.pill.visit-no-tasting,
.visit-no-tasting { color: var(--orange); background: #fff3df; }
.pill.visit-tasted-no-close,
.visit-tasted-no-close { color: var(--bad); background: #fdeceb; }
.pill.visit-no-return,
.visit-no-return {
  color: var(--bad);
  background: #fdeceb;
  font-weight: 900;
}

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

.actions button {
  background: #f2f5f7;
  color: var(--ink);
  border-radius: 8px;
  padding: 8px 10px;
  font-weight: 700;
}

.actions .danger {
  color: var(--bad);
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-auto-rows: minmax(0, auto);
  gap: 1px;
  border: 1px solid #ded8e7;
  border-radius: 8px;
  background: #ecebed;
  padding: 1px;
  box-shadow: 0 10px 24px rgba(71, 63, 82, .07);
  overflow: hidden;
}

.day-name {
  color: #928c96;
  font-weight: 800;
  font-size: 12px;
  text-align: center;
  background: #f2f1f3;
  border: 0;
  border-radius: 0;
  padding: 11px 4px;
}

.day {
  min-height: 126px;
  max-height: 126px;
  border: 0;
  border-radius: 0;
  background: #fff;
  padding: 9px;
  display: grid;
  align-content: start;
  gap: 7px;
  color: inherit;
  text-align: left;
  box-shadow: none;
  overflow: hidden;
}

button.day:hover {
  background: #fbf9ff;
  box-shadow: inset 0 0 0 2px rgba(141, 98, 176, .22);
}

button.day:focus-visible {
  outline: 3px solid rgba(141, 98, 176, .25);
  outline-offset: 2px;
}

.day.muted {
  background: #eeecef;
  color: #aaa5ad;
}

.day-number {
  font-weight: 800;
  font-size: 15px;
  color: #8d8890;
  text-align: center;
}

.event-chip {
  background: #f1e9fb;
  border: 0;
  border-radius: 6px;
  color: #594b5f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  padding: 4px 6px;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
}

.day .event-chip {
  max-width: 100%;
}

.event-chip.party-chip {
  background: #fff2dd;
  color: #a4610b;
}

.event-chip.holiday-chip {
  background: #fdeaf5;
  color: #a63472;
}

.calendar-popover {
  position: absolute;
  inset: 72px 18px auto 18px;
  z-index: 8;
  max-height: min(520px, calc(100vh - 170px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: var(--shadow);
  padding: 14px;
}

.calendar-popover.hidden {
  display: none;
}

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

.popover-head h3 {
  margin: 0;
  font-size: 17px;
}

.finance-chip {
  background: #edf9f2;
  color: #287548;
}

.followup-chip {
  background: #e8f4f3;
  color: #326f69;
}

.finance-chip.paid {
  background: #edf9f2;
  color: #287548;
}

.finance-chip.overdue {
  background: #fdeceb;
  color: #b42318;
}

.finance-chip.payable {
  background: #fdeceb;
  color: #b42318;
}

.finance-chip.pending {
  background: #fff3df;
  color: #a4610b;
}

.finance-chip.receivable {
  background: #fff3df;
  color: #a4610b;
}

.finance-chip.received {
  background: #eff6ff;
  color: #2f66c7;
}

.legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  color: var(--muted);
  font-size: 13px;
  margin: 8px 0 14px;
}

.legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  display: inline-block;
}

.legend-dot.green { background: var(--good); }
.legend-dot.red { background: var(--bad); }
.legend-dot.orange { background: var(--orange); }
.legend-dot.blue { background: var(--blue); }
.legend-dot.pink { background: var(--pink); }

.compact-item {
  padding: 11px;
}

.toast {
  position: fixed;
  z-index: 9999;
  left: 50%;
  right: auto;
  bottom: 28px;
  width: min(560px, calc(100vw - 32px));
  background: #16232d;
  color: #fff;
  border: 2px solid rgba(255,255,255,.92);
  border-radius: 10px;
  padding: 15px 18px;
  box-shadow: 0 12px 35px rgba(0,0,0,.38);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  opacity: 0;
  transform: translate(-50%, 12px);
  transition: .2s ease;
  pointer-events: none;
}

.toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

.button-link {
  align-items: center;
  background: #eef4ff;
  border: 1px solid #c8d9ff;
  border-radius: 8px;
  color: #1f4b99;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  min-height: 34px;
  padding: 0 12px;
  text-decoration: none;
}

.login-error {
  background: #fff1f3;
  border: 1px solid #f7b7c1;
  border-radius: 8px;
  color: #a4162d;
  font-size: 13px;
  font-weight: 800;
  margin: 0;
  padding: 10px 12px;
}

.inline-link {
  background: transparent;
  border: 0;
  color: #6d315d;
  cursor: pointer;
  font: inherit;
  font-weight: 900;
  padding: 0;
  text-align: left;
}

.inline-link:hover {
  color: #2f1428;
  text-decoration: underline;
}

.paid-name {
  color: #1f8b4c;
  font-weight: 950;
}

.client-portal-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.client-portal-shell {
  display: grid;
  gap: 22px;
}

.client-portal-tabs {
  align-items: start;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  margin-bottom: 6px;
}

.client-portal-tab {
  align-items: center;
  background: transparent;
  border: 0;
  color: #534856;
  display: inline-flex;
  flex-direction: column;
  font-size: 14px;
  font-weight: 850;
  gap: 8px;
  min-width: 86px;
  padding: 8px 10px;
}

.client-tab-image {
  align-items: center;
  background: #f4ecff;
  border: 1px solid #e6d6f6;
  border-radius: 999px;
  box-shadow: 0 8px 16px rgba(141, 98, 176, .08);
  color: #6d315d;
  display: inline-flex;
  font-size: 22px;
  height: 58px;
  justify-content: center;
  width: 58px;
}

.client-portal-tab.active .client-tab-image,
.client-portal-tab:hover .client-tab-image {
  background: #eadcf8;
  border-color: #c8aee8;
}

.client-shop-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.client-shop-card {
  align-content: start;
  gap: 10px;
  min-height: 210px;
}

.client-shop-card h3,
.client-contract-card h3 {
  margin-top: 0;
}

.client-shop-icon {
  align-items: center;
  background: #f5edf8;
  border: 1px solid #e4d4ef;
  border-radius: 999px;
  color: #6d315d;
  display: inline-flex;
  font-size: 22px;
  font-weight: 900;
  height: 52px;
  justify-content: center;
  width: 52px;
}

.client-shop-photo {
  aspect-ratio: 4 / 3;
  border: 1px solid #eadcf8;
  border-radius: 8px;
  display: block;
  height: 132px;
  object-fit: cover;
  width: 100%;
}

.record-image-thumb,
.record-image-placeholder {
  border-radius: 8px;
  flex: 0 0 58px;
  height: 58px;
  width: 58px;
}

.record-image-thumb {
  border: 1px solid var(--line);
  object-fit: cover;
}

.record-image-placeholder {
  align-items: center;
  background: #f5edf8;
  border: 1px solid #e4d4ef;
  color: #6d315d;
  display: inline-flex;
  font-weight: 900;
  justify-content: center;
}

.client-config-row {
  align-items: center;
  display: grid;
  gap: 16px;
  grid-template-columns: auto minmax(0, 1fr) auto;
}

.client-config-row h3 {
  margin-bottom: 4px;
}

.client-config-row small {
  color: var(--muted);
  display: block;
  margin-top: 4px;
}

.guest-event-card summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.guest-event-card summary::-webkit-details-marker {
  display: none;
}

.guest-list-standalone {
  gap: 18px;
}

.guest-standalone-nav {
  align-items: center;
  background: #f7f2fb;
  border: 2px solid #eadcf5;
  border-radius: 8px;
  display: flex;
  gap: 18px;
  justify-content: space-between;
  padding: 16px;
}

.guest-standalone-nav h2 {
  margin-bottom: 4px;
}

.guest-event-card-standalone {
  border-width: 2px;
}

.guest-event-card-standalone summary {
  background: #fbf8fd;
  border-radius: 8px;
  padding: 8px;
}

.guest-event-card-standalone .guest-reception-layout {
  min-height: 62vh;
}

.compact-guest-table {
  margin-top: 14px;
}

.guest-reception-layout {
  align-items: stretch;
  display: grid;
  gap: 0;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  margin-top: 14px;
}

.guest-summary-panel {
  background: #f6f4f8;
  border: 1px solid var(--line);
  border-radius: 8px 0 0 8px;
  color: #6f6774;
  overflow: hidden;
}

.guest-summary-head,
.guest-summary-row {
  display: grid;
  grid-template-columns: 1fr 56px;
  gap: 10px;
  padding: 9px 12px;
}

.guest-summary-head {
  background: #fbfaff;
  color: #928999;
  font-size: 0.72rem;
  font-weight: 900;
  text-transform: uppercase;
}

.guest-summary-row {
  border-top: 1px solid #e6e1ea;
  font-size: 0.84rem;
}

.guest-summary-row strong {
  color: #5f5667;
  text-align: right;
}

.guest-summary-row.danger-summary,
.guest-summary-row.danger-summary strong {
  color: #b91c1c;
  font-weight: 900;
}

.reception-guest-toolbar {
  align-items: center;
  background: #f7f1fb;
  border: 1px solid #eadcf8;
  border-radius: 8px;
  color: #594b5f;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  margin-top: 14px;
  padding: 10px 12px;
}

.reception-guest-toolbar span {
  color: var(--muted);
  font-size: 0.86rem;
}

.reception-guest-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow-x: auto;
}

.guest-reception-layout .reception-guest-table {
  border-left: 0;
  border-radius: 0 8px 8px 0;
  margin-top: 0;
}

.reception-guest-row {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 8px;
  grid-template-columns: 34px minmax(190px, 1.35fr) minmax(120px, .85fr) minmax(120px, .8fr) 76px repeat(5, minmax(92px, .62fr));
  min-width: 1160px;
  min-height: 48px;
  padding: 7px 10px;
}

.reception-guest-row:last-child {
  border-bottom: 0;
}

.reception-guest-header {
  background: #f5f0fa;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 900;
  min-height: 38px;
  text-transform: uppercase;
}

.guest-toggle {
  background: #f1eef4;
  border: 1px solid #ded6e5;
  border-radius: 999px;
  color: #6b5c70;
  font-size: 0.78rem;
  font-weight: 850;
  min-height: 30px;
  padding: 5px 9px;
  width: 100%;
}

.guest-toggle.active {
  background: #dff5e7;
  border-color: #9edbb2;
  color: #1d6b37;
}

.guest-age-input {
  background: #fff;
  border: 1px solid #ded6e5;
  border-radius: 8px;
  color: #514657;
  font-weight: 800;
  min-height: 32px;
  padding: 0 8px;
  width: 100%;
}

@media (max-width: 980px) {
  .guest-reception-layout {
    grid-template-columns: 1fr;
  }

  .guest-summary-panel,
  .guest-reception-layout .reception-guest-table {
    border-radius: 8px;
  }

  .guest-reception-layout .reception-guest-table {
    border-left: 1px solid var(--line);
    margin-top: 12px;
  }
}

.client-payment-row,
.client-cart-row {
  align-items: center;
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(5, minmax(80px, 1fr));
}

.inner-list {
  margin-top: 12px;
}

.inline-form {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(150px, 1fr) minmax(130px, .9fr) minmax(82px, .45fr) auto;
  margin-top: 12px;
}

.inline-form input {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  min-height: 38px;
  padding: 0 10px;
}

.client-guest-head {
  align-items: end;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(220px, 0.8fr) minmax(360px, 1.2fr);
}

.guest-add-form {
  margin-top: 0;
}

.client-guest-search {
  display: grid;
  gap: 6px;
  margin: 14px 0;
  max-width: 440px;
}

.client-guest-search span {
  color: var(--muted);
  font-size: 0.84rem;
  font-weight: 800;
}

.client-guest-search input {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  min-height: 40px;
  padding: 0 12px;
}

.client-guest-table {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: hidden;
}

.client-guest-row {
  align-items: center;
  background: #fff;
  border-bottom: 1px solid var(--line);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(150px, 1.15fr) minmax(120px, .85fr) 80px minmax(130px, .8fr) minmax(110px, .7fr) minmax(210px, 1.1fr);
  min-height: 48px;
  padding: 8px 12px;
}

.client-guest-row:last-child {
  border-bottom: 0;
}

.client-guest-header {
  background: #f5f0fa;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 900;
  min-height: 40px;
  text-transform: uppercase;
}

.main-guest strong::before {
  color: var(--brand);
  content: "□ ";
}

.companion-guest {
  background: #fbf8ff;
  padding-left: 34px;
}

.companion-form-row {
  background: #fff8fb;
  padding-left: 34px;
}

.companion-form-row input {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  min-height: 36px;
  padding: 0 10px;
}

.companion-guest strong::before {
  color: var(--muted);
  content: "└ □ ";
  font-weight: 700;
}

.companion-staff-row {
  margin-left: 18px;
  background: #fbf8ff;
}

.guest-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.action-permission-box {
  grid-template-columns: 1fr;
}

#actionPermissionList {
  display: grid;
  gap: 8px;
}

.action-permission-group {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.action-permission-row {
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(160px, 1.4fr) repeat(3, minmax(92px, 1fr));
  padding: 8px;
}

.action-permission-row label {
  margin: 0;
}

.mini-calendar {
  font-size: 12px;
  padding: 7px;
}

.compact-head {
  gap: 8px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
}

.compact-head h3 {
  margin: 0;
  min-width: 0;
  max-width: 42%;
  line-height: 1.15;
}

.compact-head .month-controls {
  flex-wrap: nowrap;
  flex: 0 0 auto;
  gap: 6px;
}

.compact-head .month-controls strong {
  min-width: 96px;
  text-align: center;
}

.mini-calendar .day {
  min-height: 0;
  height: 64px;
  padding: 5px;
  gap: 4px;
}

.mini-calendar .event-chip {
  font-size: 9px;
  line-height: 1.2;
  padding: 3px 4px;
  white-space: nowrap;
}

.mini-calendar .day-number {
  font-size: 13px;
  line-height: 1;
}

.mini-day-items {
  display: grid;
  gap: 2px;
  min-width: 0;
  overflow: hidden;
}

.mini-calendar .more-chip {
  background: #f0eef4;
  color: #766b7b;
}

@media (max-width: 1040px) {
  body {
    grid-template-columns: 1fr;
  }

  .sidebar {
    height: auto;
    position: static;
  }

  nav {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .split, .metrics, .dashboard-panel-grid, .sale-summary, .sale-detail-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 720px) {
  main {
    padding: 18px;
  }

  .topbar, .panel-head, .item-top {
    align-items: stretch;
    flex-direction: column;
  }

  nav, .split, .metrics, .two, .permission-box, .chart-grid, .dashboard-panel-grid, .sale-summary, .sale-detail-grid, .fee-grid, .cash-flow-grid, .inline-form, .client-payment-row, .client-cart-row, .client-guest-head, .client-guest-row {
    grid-template-columns: 1fr;
  }

  .client-guest-header {
    display: none;
  }

  .client-guest-row {
    align-items: start;
  }

  .companion-guest {
    padding-left: 22px;
  }

  .bar-row {
    grid-template-columns: 1fr;
  }

  .financial-history summary,
  .financial-history-row {
    grid-template-columns: 1fr;
  }

  .financial-history summary {
    align-items: flex-start;
  }

  .history-amount {
    justify-items: start;
    min-width: 0;
  }

  .bar-row strong {
    text-align: left;
  }

  .calendar-grid {
    gap: 5px;
  }

  .day {
    min-height: 92px;
    padding: 6px;
  }

  .event-chip {
    font-size: 11px;
  }

  .service-catalog-toolbar,
  .service-catalog-row {
    grid-template-columns: 1fr;
  }

  .service-catalog-row input {
    justify-self: start;
  }
}

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

  body {
    display: block;
    background: #fff;
  }

  .sidebar, .topbar, .view, .toast, .contract-editor-actions, .contract-version-box, .payment-modal {
    display: none !important;
  }

  .contract-editor {
    position: static;
    padding: 0;
    background: #fff;
  }

  .contract-editor-panel {
    max-width: none;
  }

  .print-doc {
    display: block !important;
    box-sizing: border-box;
    color: #111;
    font-family: Arial, sans-serif;
    font-size: 12px;
    max-width: none;
    margin: 0 auto;
    overflow-wrap: break-word;
    padding: 0 !important;
    line-height: 1.42;
    width: 100%;
    white-space: normal;
    word-break: normal;
  }

  .print-doc * {
    box-sizing: border-box;
    max-width: 100%;
  }

  .document-header {
    break-inside: avoid;
    margin-bottom: 24px;
    text-align: center;
  }

  .document-header img {
    display: block;
    height: 82px;
    margin: 0 auto;
    width: 220px;
  }

  .payroll-slip {
    break-inside: avoid;
    font-size: 10px;
  }

  .payroll-slip-title strong {
    font-size: 15px;
  }
}


.crm-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.crm-metric {
  padding: 16px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 14px;
  background: var(--panel, #fff);
  display: grid;
  gap: 6px;
}
.crm-metric span { font-size: .84rem; opacity: .72; }
.crm-metric strong { font-size: 1.55rem; }
.crm-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.crm-row > div:first-child { display: grid; gap: 4px; min-width: 0; }
.crm-row small { display: block; opacity: .72; }
.crm-right { text-align: right; display: grid; gap: 5px; justify-items: end; }
.good-text { color: #15803d; }
.bad-text { color: #b91c1c; }
@media (max-width: 900px) {
  .crm-metrics { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}
@media (max-width: 560px) {
  .crm-metrics { grid-template-columns: 1fr; }
  .crm-row { align-items: flex-start; flex-direction: column; }
  .crm-right { text-align: left; justify-items: start; }
}

.crm-redemption-card {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}
.crm-redemption-main {
  display: grid;
  gap: 5px;
}
.crm-redemption-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
}
.link-btn {
  border: 0;
  background: transparent;
  padding: 2px 0;
  text-decoration: underline;
  cursor: pointer;
}
@media (max-width: 700px) {
  .crm-redemption-card { flex-direction: column; }
  .crm-redemption-actions { justify-content: flex-start; }
}


.client-loyalty-shell {
  display: grid;
  gap: 18px;
}
.client-loyalty-hero {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: 16px;
}
.client-loyalty-hero > div {
  border-radius: 18px;
  padding: 22px;
  background: linear-gradient(135deg, rgba(124,58,237,.12), rgba(236,72,153,.10));
  border: 1px solid var(--line, #e5e7eb);
  display: grid;
  gap: 7px;
}
.client-loyalty-hero span,
.client-loyalty-hero small {
  opacity: .75;
}
.client-loyalty-hero strong {
  font-size: 2rem;
}
.client-referral-box strong {
  font-size: 1.35rem;
  letter-spacing: .08em;
}
.client-loyalty-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.client-reward-card,
.client-redemption-row,
.client-points-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.client-reward-card > div:first-child,
.client-redemption-row > div:first-child,
.client-points-row > div:first-child {
  display: grid;
  gap: 5px;
}
.client-reward-card small,
.client-redemption-row small,
.client-points-row small {
  display: block;
  opacity: .72;
}
.client-loyalty-info {
  margin: 0;
}
@media (max-width: 800px) {
  .client-loyalty-hero,
  .client-loyalty-columns {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .client-reward-card,
  .client-redemption-row,
  .client-points-row {
    align-items: flex-start;
    flex-direction: column;
  }
  .client-loyalty-hero strong {
    font-size: 1.55rem;
  }
}


/* Barra de pesquisa fixa na coluna lateral */
.sidebar {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.sidebar-search-sticky {
  position: sticky;
  top: 0;
  z-index: 20;
  flex: 0 0 auto;
  padding: 10px 10px 8px;
  background: inherit;
}

#navSearch {
  position: sticky;
  top: 0;
  z-index: 21;
  flex: 0 0 auto;
}

.sidebar nav,
.sidebar .nav-list,
.sidebar-menu,
nav.sidebar-nav {
  overflow-y: auto;
  min-height: 0;
  flex: 1 1 auto;
  overscroll-behavior: contain;
}

/* Evita que o campo de pesquisa role junto com os botões do menu */
.sidebar-search-sticky + nav,
.sidebar-search-sticky + .nav-list,
.sidebar-search-sticky + .sidebar-menu {
  overflow-y: auto;
  min-height: 0;
}

.relationship-pipeline{display:grid;grid-template-columns:repeat(7,minmax(120px,1fr));gap:10px;overflow-x:auto;padding-bottom:6px}
.relationship-pipeline article{border:1px solid var(--line,#e5e7eb);border-radius:12px;padding:14px;display:grid;gap:8px;min-width:120px}
.relationship-pipeline span{font-size:.82rem;opacity:.75}.relationship-pipeline strong{font-size:1.45rem}
.relationship-action{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.relationship-action>div:first-child{display:grid;gap:4px}.relationship-action small{display:block;opacity:.72}
.relationship-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.relationship-actions select{min-width:180px}
@media(max-width:760px){.relationship-action{flex-direction:column}.relationship-actions{justify-content:flex-start}.relationship-pipeline{grid-template-columns:repeat(7,150px)}}


.sale-credit-alert {
  margin: 14px 0 20px;
  padding: 16px;
  border: 1px solid rgba(22,163,74,.35);
  border-radius: 14px;
  background: rgba(22,163,74,.07);
}
.sale-credit-row,
.sale-applied-credit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
.sale-credit-row > div,
.sale-applied-credit > div {
  display: grid;
  gap: 4px;
}
.sale-credit-row small,
.sale-applied-credit small {
  opacity: .75;
}
.sale-applied-credit {
  margin-top: 12px;
  padding: 12px;
  border-radius: 12px;
  background: rgba(59,130,246,.09);
  border: 1px solid rgba(59,130,246,.25);
}
@media (max-width: 650px) {
  .sale-credit-row,
  .sale-applied-credit {
    flex-direction: column;
    align-items: flex-start;
  }
}


/* V18 — exibição explícita dos créditos na venda */
#saleClientCreditStatus:empty {
  display: none;
}

.sale-credit-row strong {
  font-size: 1.05rem;
}

.sale-credit-calculation {
  display: grid;
  gap: 5px;
}

.sale-credit-calculation span {
  display: block;
}

.sale-credit-final-total {
  margin-top: 4px;
  font-size: 1.05rem;
  color: #166534;
}

#saleAppliedCreditSummary.hidden {
  display: none !important;
}


/* V19 — filtros e ranking compacto da fidelidade */
.crm-filter-bar {
  margin-top: 16px;
  padding: 16px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 14px;
  background: rgba(255,255,255,.65);
}

.crm-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
}

.crm-filter-actions {
  margin-top: 12px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.crm-filter-hidden {
  display: none !important;
}

.crm-ranking-card {
  min-height: auto;
}

.loyalty-client-link {
  border: 0;
  padding: 0;
  background: transparent;
  font: inherit;
  font-weight: 700;
  color: inherit;
  cursor: pointer;
  text-align: left;
}

.loyalty-client-link:hover {
  text-decoration: underline;
}

.loyalty-history-panel {
  width: min(760px, 94vw);
  max-height: 88vh;
  overflow-y: auto;
}

.compact-metrics {
  grid-template-columns: repeat(3, minmax(130px, 1fr));
  margin-bottom: 16px;
}

@media (max-width: 850px) {
  .crm-filter-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 560px) {
  .crm-filter-grid,
  .compact-metrics {
    grid-template-columns: 1fr;
  }
}

.visit-filter-bar{display:grid;grid-template-columns:minmax(220px,2fr) repeat(4,minmax(145px,1fr)) auto;gap:10px;margin:14px 0 8px;align-items:center}
.visit-filter-bar input,.visit-filter-bar select,.visit-filter-bar button{width:100%}
@media(max-width:1000px){.visit-filter-bar{grid-template-columns:1fr 1fr 1fr}}
@media(max-width:620px){.visit-filter-bar{grid-template-columns:1fr}}


/* V25 — auditoria administrativa central */
.audit-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.audit-filter-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 16px;
}
.audit-central-row .meta {
  margin-top: 8px;
}
.audit-error {
  color: #b91c1c;
  margin-top: 8px;
}
@media (max-width: 850px) {
  .audit-filter-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}
@media (max-width: 560px) {
  .audit-filter-grid { grid-template-columns: 1fr; }
}


/* V27 — contexto humano nos registros de auditoria */
.audit-event-context {
  margin: 10px 0;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(59, 130, 246, .22);
  background: rgba(59, 130, 246, .07);
  display: grid;
  gap: 4px;
}
.audit-event-context strong {
  font-size: 1rem;
}
.audit-event-context span {
  opacity: .78;
}
.audit-technical-details {
  margin-top: 10px;
  opacity: .78;
}
.audit-technical-details summary {
  cursor: pointer;
  font-size: .85rem;
}
.audit-technical-details code {
  display: block;
  margin-top: 6px;
  word-break: break-all;
}

/* V28 — carteira de fidelidade por situação */
.loyalty-status-badge{display:inline-flex;width:max-content;margin-top:5px;padding:3px 8px;border-radius:999px;font-size:.76rem;font-weight:700}
.loyalty-pending{background:#fff3cd;color:#7a5200}
.loyalty-available{background:#dcfce7;color:#166534}
.loyalty-used{background:#dbeafe;color:#1e40af}
.loyalty-reversed{background:#fee2e2;color:#991b1b}
.client-wallet-mini{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.client-wallet-mini span{padding:5px 8px;border-radius:8px;background:rgba(255,255,255,.16);font-size:.82rem}


/* V29 — histórico de uso separado da auditoria */
.usage-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.usage-history-row p {
  margin-top: 6px;
}
@media (max-width: 850px) {
  .usage-filter-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}
@media (max-width: 560px) {
  .usage-filter-grid { grid-template-columns: 1fr; }
}


/* V30 — atividade completa dos usuários */
.usage-history-row details {
  margin-top: 8px;
}
.usage-history-row summary {
  cursor: pointer;
  font-size: .84rem;
  opacity: .78;
}

/* V31 — ciclo automático das indicações */
.crm-referral-card {
  display: grid;
  grid-template-columns: minmax(220px, 1.4fr) minmax(150px, .6fr);
  gap: 12px 18px;
  align-items: start;
}
.crm-referral-main,
.crm-referral-status {
  display: grid;
  gap: 5px;
}
.crm-referral-status {
  justify-items: end;
  text-align: right;
}
.crm-referral-link {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.crm-referral-link select {
  min-width: min(100%, 360px);
  flex: 1 1 260px;
}
@media (max-width: 650px) {
  .crm-referral-card { grid-template-columns: 1fr; }
  .crm-referral-status { justify-items: start; text-align: left; }
  .crm-referral-link { grid-column: 1; }
}

/* V31.1 — separação visível entre auditoria e atividade */
.admin-area-label {
  display: inline-flex;
  margin-top: 4px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 700;
  background: rgba(59,130,246,.10);
  color: #1e40af;
}

/* V31.2 */
#partyDetailTitle,#partyDetailList{scroll-margin-top:18px}


/* V31.3 — evento selecionado preservado */
#partyDetailList .item {
  animation: selected-event-fade .18s ease-out;
}
@keyframes selected-event-fade {
  from { opacity: .35; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}


/* V31.5 — Central de Cancelamento segura */
.cancel-impact-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.cancel-impact-grid article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 12px;
}

.cancel-impact-grid span {
  font-size: .78rem;
  opacity: .72;
}

.cancel-impact-grid strong {
  font-size: .98rem;
}

.cancel-impact-warnings {
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}

.cancel-impact-warning,
.cancel-impact-ok {
  padding: 11px 13px;
  border-radius: 10px;
  font-size: .9rem;
}

.cancel-impact-warning {
  background: #fff3cd;
  border: 1px solid #f2d27a;
  color: #6b4b00;
}

.cancel-impact-ok {
  background: #dcfce7;
  border: 1px solid #86efac;
  color: #166534;
}

.cancel-review-check {
  display: flex !important;
  align-items: flex-start;
  gap: 9px;
  padding: 10px;
  border-radius: 10px;
  background: rgba(127, 127, 127, .08);
}

.cancel-review-check input {
  width: auto !important;
  margin-top: 3px;
}

@media (max-width: 850px) {
  .cancel-impact-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
}

@media (max-width: 520px) {
  .cancel-impact-grid {
    grid-template-columns: 1fr;
  }
}

/* V31.6 — Documentos, assinatura, imagens e preços */
.sale-document-attachment-list{display:grid;gap:8px;margin:8px 0 14px}
.sale-document-chip{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px 11px;border:1px solid var(--line,#e5e7eb);border-radius:10px;background:rgba(148,163,184,.045)}
.sale-document-chip span{flex:1;min-width:180px}
.client-online-signature-box,.client-online-signature-status,.client-contract-upload-box{margin-top:14px}
.client-signature-canvas{display:block;width:100%;height:190px;border:2px dashed rgba(99,102,241,.4);border-radius:12px;background:#fff;touch-action:none;margin:12px 0}
.client-signature-accept{margin-top:12px;align-items:flex-start}
.client-signature-image{display:block;max-width:420px;width:100%;max-height:150px;object-fit:contain;border:1px solid var(--line,#e5e7eb);background:#fff;border-radius:10px;margin-top:10px}
.service-catalog-row .record-image-thumb,.service-catalog-row .record-image-placeholder{width:48px;height:48px;flex:0 0 48px}
.client-shop-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:rgba(148,163,184,.08)}

/* Lista de convidados compacta, historico e PDF - producao */
body.modal-open{overflow:hidden}.reception-guest-modal-card{margin:max(12px,3vh) auto 0;max-width:720px;padding:16px;width:min(720px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto}.reception-guest-form-grid{display:grid;gap:10px;grid-template-columns:2fr 1.2fr 1.1fr 80px}.reception-guest-form-grid .guest-name-field{grid-column:span 2}.reception-guest-form-grid .guest-notes-field{grid-column:1/-1}.reception-guest-options{background:#f7f2fb;border:1px solid #eadcf5;border-radius:10px;display:grid;gap:8px;grid-template-columns:repeat(4,minmax(0,1fr));padding:9px}.reception-guest-options label{align-items:center;background:#fff;border:1px solid var(--line);border-radius:8px;display:flex;font-size:.8rem;font-weight:800;gap:5px;justify-content:center;min-height:40px;padding:6px}.reception-guest-modal-actions{display:flex;gap:8px;justify-content:flex-end;position:sticky;bottom:-16px;background:#fff;padding:10px 0 2px}.guest-toolbar-actions{display:flex;gap:6px;flex-wrap:wrap}.guest-row-number{font-weight:800;text-align:center}.guest-history-panel{margin-top:12px;border:1px solid var(--line);border-radius:12px;background:#fff}.guest-history-panel>summary{cursor:pointer;font-weight:800;padding:12px}.guest-history-docs,.guest-history-list{display:grid;gap:8px;padding:0 12px 12px}.guest-history-document,.guest-history-list article{border:1px solid var(--line);border-radius:9px;padding:9px;display:grid;gap:4px}.guest-history-document span,.guest-history-list span{font-size:.75rem;color:var(--muted)}.guest-history-list p{margin:0}.guest-pdf-render-host{position:fixed;left:-10000px;top:0;width:1200px;background:#fff;z-index:-1}.guest-pdf-sheet{width:1160px;padding:24px;font-family:Arial,sans-serif;color:#111;background:#fff}.guest-pdf-sheet h1{text-align:center;font-size:22px;margin:0 0 12px}.guest-pdf-sheet p{font-size:11px;margin:5px 0}.guest-pdf-summary{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin:12px 0}.guest-pdf-summary span{border:1px solid #bbb;border-radius:5px;padding:6px;text-align:center;font-size:10px}.guest-pdf-summary b{display:block;font-size:15px}.guest-pdf-sheet table{width:100%;border-collapse:collapse;font-size:8px}.guest-pdf-sheet th,.guest-pdf-sheet td{border:1px solid #aaa;padding:4px;vertical-align:top}.guest-pdf-sheet th{background:#eee}.guest-pdf-declaration{margin-top:14px!important}.guest-pdf-code{text-align:right;font-family:monospace}
@media(max-width:900px){.guest-standalone-nav{padding:10px}.guest-event-card .meta{gap:4px}.guest-event-card .meta .pill{font-size:.66rem;padding:4px 6px}.reception-guest-toolbar{display:grid;grid-template-columns:1fr auto;gap:6px;position:sticky;top:0;z-index:4;padding:8px}.reception-guest-toolbar>span{grid-column:1/-1;order:3;font-size:.72rem}.guest-toolbar-actions{justify-content:flex-end}.guest-toolbar-actions button{padding:7px 8px;font-size:.72rem}.guest-reception-layout{display:block}.guest-summary-panel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:8px}.guest-summary-head{display:none}.guest-summary-row{min-height:48px;padding:6px;display:flex;flex-direction:column}.guest-summary-row span{font-size:.64rem}.guest-summary-row strong{text-align:left}.compact-guest-table{overflow-x:hidden}.reception-guest-row{grid-template-columns:34px minmax(180px,1.9fr) minmax(100px,1.1fr) 110px 52px 58px 68px 62px 64px 70px!important;min-width:0!important;font-size:.72rem}.reception-guest-row>span,.reception-guest-row>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.guest-toggle{font-size:0!important;width:34px;height:22px;padding:0;border-radius:20px;position:relative}.guest-toggle:after{content:"";position:absolute;width:16px;height:16px;left:3px;top:2px;background:#fff;border-radius:50%;box-shadow:0 1px 2px #777}.guest-toggle.active:after{left:14px}.guest-age-input{width:48px!important;padding:4px!important}.reception-guest-form-grid{grid-template-columns:1.4fr 1fr 1fr 72px}.guest-summary-row:nth-child(3),.guest-summary-row:nth-child(4),.guest-summary-row:nth-child(5),.guest-summary-row:nth-child(6),.guest-summary-row:nth-child(8),.guest-summary-row:nth-child(9),.guest-summary-row:nth-child(10),.guest-summary-row:nth-child(11),.guest-summary-row:nth-child(13),.guest-summary-row:nth-child(14),.guest-summary-row:nth-child(15),.guest-summary-row:nth-child(17){display:none}}
@media(max-width:700px){.reception-guest-row{grid-template-columns:30px minmax(120px,1.6fr) minmax(90px,1fr) 100px 48px 52px 58px 54px 56px 62px!important}.reception-guest-form-grid{grid-template-columns:1fr 90px}.reception-guest-form-grid label,.reception-guest-form-grid .guest-name-field,.reception-guest-form-grid .guest-notes-field{grid-column:auto}.reception-guest-form-grid .guest-name-field,.reception-guest-form-grid .guest-notes-field{grid-column:1/-1}.reception-guest-options{grid-template-columns:repeat(2,1fr)}}

/* Ajuste produção 2026-07-16: legibilidade do cadastro avulso e sigilo financeiro */
.reception-guest-form-grid label {
  color: #2f2434 !important;
  font-size: .82rem !important;
  font-weight: 900 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.reception-guest-form-grid label input {
  color: #211a25 !important;
  background: #fff !important;
  border-color: #aa93b7 !important;
  opacity: 1 !important;
}
.reception-guest-form-grid label input::placeholder {
  color: #817487 !important;
  opacity: 1 !important;
}
.reception-guest-modal-head h2 { color:#241b29 !important; font-weight:900 !important; }
.reception-guest-modal-head p { color:#5e5364 !important; opacity:1 !important; font-weight:700; }
.guest-financial-pill { font-weight:900; }
.audit-change-list{display:grid;gap:10px;margin:12px 0}.audit-change-card{border:1px solid var(--border,#dfe3ea);border-radius:10px;padding:10px 12px;background:rgba(255,255,255,.55)}.audit-change-card>strong{display:block;margin-bottom:7px}.audit-change-card>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.audit-before,.audit-after{padding:6px 9px;border-radius:8px;font-weight:700}.audit-before{background:#fff0f0;text-decoration:line-through}.audit-after{background:#eaf8ee}.audit-summary{margin:8px 0}.audit-technical-details pre{white-space:pre-wrap;overflow:auto;max-height:320px;font-size:11px}

.diagnostic-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:8px}.diagnostic-failure{border-left:4px solid #b42318}.diagnostic-row pre{white-space:pre-wrap;word-break:break-word}

/* V31.7.4 - documentos do cliente e ajuste do card financeiro */
.client-financial-card {
  grid-column: span 2;
  min-width: 0;
  overflow: hidden;
}
.client-financial-card > h3 {
  text-align: center;
}
.client-financial-card > .meta {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-inline: auto;
  max-width: 100%;
  text-align: center;
}
.client-financial-card .inner-list {
  margin-inline: auto;
  max-width: 100%;
  width: 100%;
}
.client-financial-card .client-payment-row {
  grid-template-columns: minmax(72px,.7fr) minmax(92px,.85fr) minmax(92px,.8fr) minmax(150px,1.8fr) minmax(82px,.7fr);
  min-width: 0;
  text-align: center;
}
.client-financial-card .client-payment-row > * {
  min-width: 0;
  overflow-wrap: anywhere;
}
.contract-client-documents-box {
  display: grid;
  gap: 12px;
}
.contract-client-signature-record {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: flex;
  gap: 14px;
  justify-content: space-between;
  padding: 12px;
}
.contract-client-signature-record div {
  display: grid;
  gap: 4px;
}
.contract-client-signature-record img {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: block;
  max-height: 90px;
  max-width: 240px;
  object-fit: contain;
}
@media (max-width: 860px) {
  .client-financial-card { grid-column: 1 / -1; }
  .client-financial-card .client-payment-row {
    grid-template-columns: 1fr;
    text-align: left;
  }
  .contract-client-signature-record {
    align-items: flex-start;
    flex-direction: column;
  }
  .contract-client-signature-record img { max-width: 100%; }
}

/* V31.7.5 - documentos do contrato visiveis na area do cliente */
.client-contract-documents-card {
  grid-column: 1 / -1;
}
.client-contract-documents-card h3 {
  margin: 0 0 4px;
}
.client-contract-documents-card p {
  margin: 0;
}
.client-contract-document-list {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.client-contract-document-item {
  align-items: center;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 12px;
}
.client-contract-document-item > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.client-contract-document-item strong,
.client-contract-document-item small {
  overflow-wrap: anywhere;
}
@media (max-width: 640px) {
  .client-contract-document-item {
    align-items: stretch;
    flex-direction: column;
  }
  .client-contract-document-item a,
  .client-contract-document-item button {
    text-align: center;
    width: 100%;
  }
}


/* V31.8.0 — Auditoria visual por tipo de operação */
#userActivityMetrics{grid-template-columns:repeat(6,minmax(120px,1fr))}
.audit-metric{border-left:5px solid currentColor}
.audit-colored-card{position:relative;display:grid!important;grid-template-columns:48px minmax(0,1fr);gap:14px;border-left:6px solid var(--audit-color)!important;background:linear-gradient(90deg,var(--audit-soft),rgba(255,255,255,.96) 22%)!important}
.audit-card-icon{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--audit-color);color:#fff;font-weight:900;font-size:17px;box-shadow:0 6px 16px rgba(15,23,42,.15)}
.audit-card-body{min-width:0}.audit-card-badges{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.audit-type-badge,.audit-severity-badge{padding:5px 9px;border-radius:999px;font-size:11px;font-weight:800}.audit-type-badge{background:var(--audit-color);color:#fff}.audit-severity-badge{background:var(--audit-soft);color:var(--audit-color);border:1px solid var(--audit-color)}
.audit-create{--audit-color:#168447;--audit-soft:#e7f7ed}.audit-edit{--audit-color:#d97706;--audit-soft:#fff4df}.audit-delete{--audit-color:#dc2626;--audit-soft:#ffebeb}.audit-login{--audit-color:#2563eb;--audit-soft:#eaf1ff}.audit-approval{--audit-color:#7c3aed;--audit-soft:#f2eafe}.audit-finance{--audit-color:#ca8a04;--audit-soft:#fff8d8}.audit-critical{--audit-color:#991b1b;--audit-soft:#fee2e2}
.audit-readable-details .pill{margin:4px 5px 4px 0}.audit-readable-details:empty{display:none}
.audit-change-card{border-left:4px solid var(--audit-color)!important}.audit-before{background:#fff1f1!important;color:#991b1b}.audit-after{background:#e9f9ef!important;color:#166534}
@media(max-width:1100px){#userActivityMetrics{grid-template-columns:repeat(3,minmax(120px,1fr))}}
@media(max-width:650px){#userActivityMetrics{grid-template-columns:repeat(2,minmax(110px,1fr))}.audit-colored-card{grid-template-columns:38px minmax(0,1fr);gap:10px}.audit-card-icon{width:34px;height:34px;font-size:14px}.audit-card-badges{justify-content:flex-start;margin-top:8px}.audit-colored-card .item-top{display:block}}

/* V31.8.1 — cards de auditoria clicáveis */
.audit-metric{appearance:none;text-align:left;cursor:pointer;font:inherit;color:inherit;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.audit-metric:hover{transform:translateY(-2px);box-shadow:0 9px 22px rgba(15,23,42,.12)}
.audit-metric:focus-visible{outline:3px solid color-mix(in srgb,var(--audit-color) 35%,transparent);outline-offset:2px}
.audit-metric small{display:block;margin-top:5px;font-size:10px;font-weight:700;opacity:.62}
.audit-metric.is-active{box-shadow:0 0 0 3px var(--audit-soft),0 9px 22px rgba(15,23,42,.14);transform:translateY(-2px);background:var(--audit-soft)}
.audit-metric.is-active small{opacity:1;color:var(--audit-color)}


/* =========================================================
   V31.9.1 — modernização visual segura do painel
   Somente apresentação: nenhuma regra de negócio alterada.
   ========================================================= */
#dashboard {
  --dash-purple: #74469a;
  --dash-purple-soft: #f4eef9;
  --dash-blue: #2563eb;
  --dash-green: #16835d;
  --dash-orange: #d97706;
  --dash-red: #dc2626;
}

#dashboard .dashboard-hero {
  background: linear-gradient(135deg, #ffffff 0%, #faf7fc 58%, #f1e8f7 100%);
  border: 1px solid #e6dced;
  border-radius: 16px;
  box-shadow: 0 14px 34px rgba(83, 55, 101, .08);
  margin: 4px 0 16px;
  padding: 20px 22px;
}

#dashboard .dashboard-eyebrow {
  color: var(--dash-purple);
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  margin-bottom: 5px;
  text-transform: uppercase;
}

#dashboard .dashboard-subtitle {
  color: var(--muted);
  font-size: 13px;
  margin: 5px 0 0;
}

#dashboard .dashboard-config-btn {
  border-radius: 10px;
  height: 42px;
  width: 42px;
}

#dashboard > .metrics[data-dashboard-block="summary"] {
  gap: 16px;
}

#dashboard > .metrics[data-dashboard-block="summary"] > article {
  border: 1px solid #e7e1eb;
  border-radius: 14px;
  min-height: 118px;
  overflow: hidden;
  padding: 20px 20px 18px;
  position: relative;
}

#dashboard > .metrics[data-dashboard-block="summary"] > article::before {
  align-items: center;
  background: var(--dash-purple-soft);
  border-radius: 11px;
  color: var(--dash-purple);
  content: "↗";
  display: flex;
  font-size: 18px;
  font-weight: 800;
  height: 38px;
  justify-content: center;
  position: absolute;
  right: 16px;
  top: 16px;
  width: 38px;
}

#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(2)::before {
  background: #edf4ff;
  color: var(--dash-blue);
  content: "▣";
}

#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(3)::before {
  background: #fff6e8;
  color: var(--dash-orange);
  content: "!";
}

#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(4)::before {
  background: #fff0f0;
  color: var(--dash-red);
  content: "⌛";
}

#dashboard > .metrics[data-dashboard-block="summary"] strong {
  font-size: 27px;
  letter-spacing: -.03em;
  max-width: calc(100% - 46px);
}

#dashboard .dashboard-category:not(.dashboard-hero) {
  align-items: center;
  display: flex;
  gap: 10px;
  margin: 26px 0 12px;
}

#dashboard .dashboard-category:not(.dashboard-hero)::after {
  background: linear-gradient(90deg, #dfd2e8, transparent);
  content: "";
  flex: 1;
  height: 1px;
}

#dashboard .dashboard-category:not(.dashboard-hero) h2 {
  color: #463c4c;
  font-size: 15px;
  letter-spacing: .03em;
  text-transform: uppercase;
}

#dashboard .panel.dashboard-analytics,
#dashboard .panel.dashboard-calendars,
#dashboard .dashboard-panel-grid > .panel {
  border-color: #e5dfe8;
  border-radius: 14px;
  box-shadow: 0 10px 28px rgba(63, 49, 73, .07);
}

#dashboard .panel-head h2 {
  letter-spacing: -.01em;
}

#dashboard .mini-metrics article {
  border-radius: 12px;
  box-shadow: none;
  min-height: 91px;
}

#dashboard .mini-metrics article strong {
  font-size: 21px;
}

#dashboard .chart-grid > section {
  background: #fbfafc;
  border: 1px solid #ebe6ee;
  border-radius: 12px;
  padding: 14px;
}

#dashboard .dashboard-calendar-grid > section {
  border-radius: 12px;
  box-shadow: 0 8px 22px rgba(71, 63, 82, .06);
}

#dashboard .dashboard-panel-grid > .panel {
  min-height: 280px;
}

#dashboard .dashboard-click-card:hover,
#dashboard .dashboard-click-card:focus-visible {
  border-color: #cdb8dc;
  box-shadow: 0 16px 34px rgba(112, 72, 142, .13);
  transform: translateY(-3px);
}

@media (max-width: 760px) {
  #dashboard .dashboard-hero {
    align-items: flex-start;
    padding: 17px;
  }
  #dashboard .dashboard-subtitle {
    max-width: 240px;
  }
  #dashboard > .metrics[data-dashboard-block="summary"] > article {
    min-height: 106px;
  }
}

/* =========================================================
   V31.9.6 — MENU CLEAN COM NAVEGAÇÃO FUNCIONAL
   Mudanças exclusivamente visuais. Estrutura, data-view,
   eventos e JavaScript originais preservados.
   ========================================================= */
:root {
  --pm-menu-ink: #4b4452;
  --pm-menu-muted: #756c7d;
  --pm-menu-soft: #f6f0fa;
  --pm-menu-border: #ebe3ef;
  --pm-menu-accent: #7c3aed;
}

.sidebar {
  background: linear-gradient(180deg, #ffffff 0%, #fcf9fd 100%);
  border-right: 1px solid var(--pm-menu-border);
  box-shadow: 8px 0 28px rgba(56,35,69,.055);
}
.sidebar .brand {
  border-bottom: 1px solid var(--pm-menu-border);
}
.sidebar .brand-logo {
  filter: drop-shadow(0 4px 10px rgba(124,58,237,.14));
}
.sidebar .nav-btn {
  color: var(--pm-menu-ink);
  border-radius: 10px;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.sidebar .nav-btn:hover {
  background: #f5eef9;
  color: #632a87;
  transform: translateX(2px);
}
.sidebar .nav-btn.active {
  background: linear-gradient(135deg, #7c3aed, #9333ea);
  color: #fff;
  box-shadow: 0 7px 17px rgba(124,58,237,.22);
}
.sidebar .nav-group > span {
  color: #62596a;
  font-weight: 800;
}
.sidebar .nav-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 25px;
  width: 25px;
  height: 25px;
  margin-right: 9px;
  border-radius: 8px;
  background: rgba(124,58,237,.08);
  color: #6d3b8a;
  font-size: .82rem;
  line-height: 1;
}
.sidebar .nav-btn.active .nav-icon {
  background: rgba(255,255,255,.17);
  color: #fff;
}
.sidebar .nav-btn.sub {
  border-left: 2px solid transparent;
}
.sidebar .nav-btn.sub:hover {
  border-left-color: #c084fc;
}

/* Garante visibilidade do botão original que abre o menu. */
.sidebar-toggle,
#sidebarToggle,
.menu-toggle,
button[aria-label*="menu" i],
button[title*="menu" i] {
  opacity: 1 !important;
  visibility: visible !important;
  color: #3f3746 !important;
}

/* =========================================================
   V31.9.7 — DASHBOARD EXECUTIVO PREMIUM
   Camada exclusivamente visual. Nenhum ID, data-view,
   evento, cálculo, persistência ou regra de negócio alterado.
   ========================================================= */
#dashboard {
  --dash-purple: #7c3aed;
  --dash-purple-dark: #5b21b6;
  --dash-pink: #db2777;
  --dash-blue: #2563eb;
  --dash-green: #059669;
  --dash-amber: #d97706;
  --dash-red: #dc2626;
  --dash-ink: #211827;
  --dash-muted: #756a7d;
  --dash-line: #ece5f0;
  --dash-surface: #ffffff;
  --dash-soft: #faf7fc;
  padding-bottom: 42px;
}

#dashboard .dashboard-hero {
  position: relative;
  overflow: hidden;
  min-height: 142px;
  padding: 27px 30px;
  margin-bottom: 18px;
  border: 1px solid #e8dcf0;
  border-radius: 22px;
  background:
    radial-gradient(circle at 88% 20%, rgba(219,39,119,.12), transparent 30%),
    radial-gradient(circle at 72% 105%, rgba(124,58,237,.14), transparent 38%),
    linear-gradient(135deg, #fff 0%, #faf6fd 58%, #f4ecfa 100%);
  box-shadow: 0 18px 44px rgba(67,40,82,.09);
}
#dashboard .dashboard-hero::after {
  content: "";
  position: absolute;
  right: 88px;
  top: -42px;
  width: 155px;
  height: 155px;
  border: 28px solid rgba(124,58,237,.055);
  border-radius: 50%;
  pointer-events: none;
}
#dashboard .dashboard-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(124,58,237,.09);
  color: var(--dash-purple-dark);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}
#dashboard .dashboard-eyebrow::before { content: "◆"; font-size: .55rem; }
#dashboard .dashboard-hero h2 {
  margin: 10px 0 4px;
  color: var(--dash-ink);
  font-size: clamp(1.55rem, 2.2vw, 2.15rem);
  letter-spacing: -.035em;
}
#dashboard .dashboard-subtitle {
  color: var(--dash-muted);
  font-size: .98rem;
}
#dashboard .dashboard-config-btn {
  position: relative;
  z-index: 2;
  width: 43px;
  height: 43px;
  border-radius: 13px;
  border: 1px solid #e3d7eb;
  background: rgba(255,255,255,.82);
  color: #5f3b73;
  box-shadow: 0 8px 20px rgba(78,49,94,.10);
  backdrop-filter: blur(8px);
}
#dashboard .dashboard-config-btn:hover { transform: rotate(18deg) scale(1.04); }

#dashboard > .metrics[data-dashboard-block="summary"] {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 28px;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article {
  position: relative;
  overflow: hidden;
  min-height: 132px;
  padding: 20px 19px 18px;
  border: 1px solid var(--dash-line);
  border-radius: 18px;
  background: var(--dash-surface);
  box-shadow: 0 12px 30px rgba(55,37,64,.07);
}
#dashboard > .metrics[data-dashboard-block="summary"] > article::before {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 14px;
  border-radius: 12px;
  font-size: 1.08rem;
  font-weight: 900;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article::after {
  content: "";
  position: absolute;
  right: -23px;
  bottom: -30px;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  opacity: .08;
  background: currentColor;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(1) { color: var(--dash-green); }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(1)::before { content: "R$"; color: #047857; background: #dff7ec; font-size: .82rem; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(2) { color: var(--dash-purple); }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(2)::before { content: "▣"; color: #6d28d9; background: #eee7ff; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(3) { color: var(--dash-amber); }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(3)::before { content: "!"; color: #b45309; background: #fff1d6; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(4) { color: var(--dash-blue); }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(4)::before { content: "✓"; color: #1d4ed8; background: #e3efff; }
#dashboard > .metrics[data-dashboard-block="summary"] span {
  display: block;
  color: #766d7c;
  font-size: .82rem;
  font-weight: 800;
  letter-spacing: .015em;
}
#dashboard > .metrics[data-dashboard-block="summary"] strong {
  display: block;
  margin-top: 5px;
  color: var(--dash-ink);
  font-size: clamp(1.38rem, 2vw, 1.82rem);
  letter-spacing: -.035em;
}

#dashboard .dashboard-category {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 30px 0 12px;
}
#dashboard .dashboard-category:not(.dashboard-hero)::before {
  content: "";
  width: 5px;
  height: 23px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--dash-purple), var(--dash-pink));
}
#dashboard .dashboard-category:not(.dashboard-hero) h2 {
  margin: 0;
  color: #34283b;
  font-size: 1.02rem;
  font-weight: 900;
  letter-spacing: -.01em;
}

#dashboard .panel {
  border: 1px solid var(--dash-line);
  border-radius: 18px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 12px 32px rgba(49,33,57,.065);
}
#dashboard .dashboard-analytics,
#dashboard .dashboard-calendars {
  padding: 20px;
  margin-bottom: 16px;
}
#dashboard .panel-head {
  padding-bottom: 13px;
  border-bottom: 1px solid #f0eaf3;
}
#dashboard .panel-head h2,
#dashboard .panel-head h3 { color: #33263a; letter-spacing: -.02em; }
#dashboard .panel-head .small,
#dashboard .filters .small {
  border-radius: 10px;
  font-weight: 800;
}

#dashboard .mini-metrics {
  gap: 11px;
  margin: 16px 0;
}
#dashboard .mini-metrics article {
  min-height: 92px;
  padding: 15px 16px;
  border: 1px solid #eee7f1;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #fcfafc);
  box-shadow: none;
}
#dashboard .mini-metrics article span { color: #817688; font-size: .78rem; font-weight: 800; }
#dashboard .mini-metrics article strong { color: #2e2334; font-size: 1.22rem; letter-spacing: -.025em; }

#dashboard .chart-grid { gap: 13px; }
#dashboard .chart-grid > section {
  min-height: 226px;
  padding: 16px;
  border: 1px solid #eee8f1;
  border-radius: 15px;
  background: linear-gradient(180deg, #fff 0%, #fbf9fc 100%);
}
#dashboard .chart-grid > section h3 {
  margin-bottom: 14px;
  color: #574c5d;
  font-size: .86rem;
  font-weight: 900;
}
#dashboard .bar-chart { min-height: 164px; }

#dashboard .dashboard-calendar-grid { gap: 14px; }
#dashboard .dashboard-calendar-grid > section {
  overflow: hidden;
  border: 1px solid #eae2ed;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 10px 25px rgba(56,38,65,.06);
}
#dashboard .dashboard-calendar-grid .compact-head {
  margin: 0;
  padding: 14px 15px;
  background: linear-gradient(135deg, #faf7fc, #fff);
}
#dashboard .mini-calendar { padding: 10px; }
#dashboard .mini-calendar > * { border-radius: 8px; }

#dashboard .dashboard-panel-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}
#dashboard .dashboard-panel-grid > .panel {
  position: relative;
  min-height: 310px;
  padding: 18px;
}
#dashboard .dashboard-panel-grid > .panel:nth-child(1) { border-top: 4px solid var(--dash-purple); }
#dashboard .dashboard-panel-grid > .panel:nth-child(2) { border-top: 4px solid var(--dash-amber); }
#dashboard .dashboard-panel-grid > .panel:nth-child(3) { border-top: 4px solid var(--dash-pink); }

#dashboard #upcomingList .list-item,
#dashboard #notificationList .list-item,
#dashboard #dashboardSellerGoal .list-item,
#dashboard #dashboardSalonVisitList .list-item {
  position: relative;
  margin-bottom: 9px;
  padding: 12px 12px 12px 16px;
  border: 1px solid #eee7f1;
  border-radius: 12px;
  background: #fff;
}
#dashboard #upcomingList .list-item::before,
#dashboard #notificationList .list-item::before,
#dashboard #dashboardSellerGoal .list-item::before,
#dashboard #dashboardSalonVisitList .list-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  bottom: 10px;
  width: 3px;
  border-radius: 0 5px 5px 0;
  background: linear-gradient(180deg, var(--dash-purple), var(--dash-pink));
}

#dashboard input[type="date"] {
  border-color: #e5dce9;
  border-radius: 10px;
  background: #fff;
}
#dashboard .pill {
  border: 1px solid #dfd2e7;
  background: #f7f0fb;
  color: #6b3d82;
}

@media (max-width: 1180px) {
  #dashboard > .metrics[data-dashboard-block="summary"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #dashboard .dashboard-panel-grid { grid-template-columns: 1fr 1fr; }
  #dashboard .dashboard-panel-grid > .panel:last-child { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  #dashboard .dashboard-hero { min-height: 126px; padding: 20px; border-radius: 17px; }
  #dashboard .dashboard-hero::after { display: none; }
  #dashboard > .metrics[data-dashboard-block="summary"] { grid-template-columns: 1fr 1fr; gap: 10px; }
  #dashboard > .metrics[data-dashboard-block="summary"] > article { min-height: 118px; padding: 15px; border-radius: 15px; }
  #dashboard > .metrics[data-dashboard-block="summary"] > article::before { width: 33px; height: 33px; margin-bottom: 11px; }
  #dashboard .dashboard-analytics,
  #dashboard .dashboard-calendars { padding: 14px; border-radius: 15px; }
  #dashboard .dashboard-panel-grid { grid-template-columns: 1fr; }
  #dashboard .dashboard-panel-grid > .panel:last-child { grid-column: auto; }
}
@media (max-width: 440px) {
  #dashboard > .metrics[data-dashboard-block="summary"] { grid-template-columns: 1fr; }
  #dashboard > .metrics[data-dashboard-block="summary"] > article { min-height: 105px; }
}


/* V31.9.9 — Menu lateral estilo HubSpot
   Mudança visual e comportamental isolada: o menu funciona como gaveta,
   abre sobre o conteúdo e se recolhe após escolher qualquer módulo. */
.sidebar {
  border-right: 1px solid rgba(255,255,255,.08);
  box-shadow: 4px 0 18px rgba(15,23,42,.10);
}

.sidebar.menu-open {
  width: 284px;
  box-shadow: 18px 0 48px rgba(15,23,42,.28);
}

.sidebar-hover-gear {
  background: #ff7a59;
  border: 0;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(255,122,89,.28);
  cursor: pointer;
  font-size: 22px;
  transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}
.sidebar-hover-gear:hover {
  background: #ff6846;
  box-shadow: 0 10px 24px rgba(255,122,89,.36);
  transform: translateY(-1px);
}
.sidebar.menu-open .sidebar-hover-gear {
  width: 46px;
}

.sidebar.menu-open nav {
  animation: hubspotMenuIn .16s ease both;
}
@keyframes hubspotMenuIn {
  from { opacity: 0; transform: translateX(-8px); }
  to { opacity: 1; transform: translateX(0); }
}

.sidebar.menu-open .nav-btn,
.sidebar.menu-open .nav-group > span {
  border-radius: 8px;
}
.sidebar.menu-open .nav-btn:hover,
.sidebar.menu-open .nav-group > span:hover {
  background: rgba(255,255,255,.10);
}
.sidebar.menu-open .nav-btn.active {
  background: #fff;
  color: #253342;
  box-shadow: inset 4px 0 0 #ff7a59, 0 4px 14px rgba(0,0,0,.12);
}
.sidebar.menu-open .nav-btn.active .nav-icon {
  color: #ff7a59;
}

/* O menu aberto vira uma gaveta sobre o painel, sem empurrar o conteúdo. */
@media (min-width: 901px) {
  .sidebar.menu-open {
    position: fixed;
    left: 0;
    top: 0;
  }
  .sidebar:not(.menu-open) {
    position: sticky;
  }
}

/* V31.9.10 — Correção: conteúdo principal independente do menu lateral.
   No computador, a barra compacta ocupa 84px e o menu aberto funciona como
   gaveta sobreposta. A abertura do menu nunca redimensiona nem oculta o main. */
@media (min-width: 901px) {
  body:not(.locked) {
    display: block;
    min-height: 100vh;
  }

  body:not(.locked) .sidebar,
  body:not(.locked) .sidebar:not(.menu-open),
  body:not(.locked) .sidebar.menu-open {
    position: fixed;
    inset: 0 auto 0 0;
    height: 100vh;
    z-index: 1000;
  }

  body:not(.locked) main {
    display: block;
    width: calc(100% - 84px);
    min-width: 0;
    min-height: 100vh;
    margin-left: 84px;
  }
}

/* ================================================================
   V32.0.0 — INTERFACE EXECUTIVA
   Modernização visual segura, inspirada em CRMs modernos.
   Somente CSS: nenhuma navegação, função ou regra de negócio alterada.
   ================================================================ */

:root {
  --ui-accent: #ff6f4f;
  --ui-accent-soft: #fff1ed;
  --ui-purple: #6f42c1;
  --ui-blue: #2563eb;
  --ui-green: #0f9f6e;
  --ui-amber: #d97706;
  --ui-red: #dc2626;
  --ui-ink: #273142;
  --ui-muted: #6b7280;
  --ui-line: #e8eaf0;
  --ui-surface: #ffffff;
  --ui-canvas: #f7f8fb;
  --ui-radius: 14px;
  --ui-shadow: 0 8px 28px rgba(31, 41, 55, .07);
}

body:not(.locked) {
  background: var(--ui-canvas);
  color: var(--ui-ink);
}

body:not(.locked) main {
  background:
    radial-gradient(circle at 100% 0, rgba(255,111,79,.045), transparent 26rem),
    var(--ui-canvas);
}

/* Barra superior mais limpa e consistente */
.topbar {
  min-height: 68px;
  padding: 10px 22px;
  border-bottom: 1px solid var(--ui-line);
  background: rgba(255,255,255,.94);
  box-shadow: 0 1px 0 rgba(17,24,39,.02);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.topbar h1,
.topbar h2,
.topbar strong {
  color: var(--ui-ink);
  letter-spacing: -.025em;
}

/* Superfícies */
.panel,
.card,
.modal-panel,
.payment-panel {
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
  box-shadow: var(--ui-shadow);
}

.panel-head {
  gap: 12px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f1f4;
}

.panel-head h2,
.panel-head h3 {
  color: var(--ui-ink);
  letter-spacing: -.02em;
}

/* Botões e ações */
button,
.button,
.primary,
.secondary,
.icon-btn {
  font-weight: 750;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}

button:not(:disabled):hover,
.button:not(:disabled):hover,
.primary:not(:disabled):hover,
.secondary:not(:disabled):hover,
.icon-btn:not(:disabled):hover {
  transform: translateY(-1px);
}

.primary {
  border-color: var(--ui-accent);
  background: linear-gradient(135deg, #ff7a59, #ff6545);
  box-shadow: 0 7px 18px rgba(255,111,79,.20);
}

.secondary {
  border-color: #dfe2e8;
  background: #fff;
  color: #374151;
}

.secondary:hover {
  border-color: #cdd2da;
  background: #fafafa;
}

.icon-btn {
  border-radius: 10px;
}

/* Campos */
input,
select,
textarea {
  border-color: #dfe2e8;
  border-radius: 10px;
  background: #fff;
  color: var(--ui-ink);
  transition: border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

input:focus,
select:focus,
textarea:focus {
  border-color: rgba(255,111,79,.72);
  box-shadow: 0 0 0 3px rgba(255,111,79,.12);
  outline: none;
}

label {
  color: #4b5563;
  font-weight: 700;
}

/* Tabelas com leitura semelhante a CRM */
table {
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ui-line);
  border-radius: 12px;
  background: #fff;
}

thead th {
  padding-top: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e7eb;
  background: #f8f9fb;
  color: #596273;
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
}

tbody td {
  border-bottom-color: #eef0f3;
}

tbody tr {
  transition: background .12s ease;
}

tbody tr:hover {
  background: #fff9f7;
}

/* Listas, linhas e cartões clicáveis */
.list-item,
.dashboard-click-card,
.crm-card,
.kanban-card {
  border-color: var(--ui-line);
  border-radius: 12px;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.list-item:hover,
.dashboard-click-card:hover,
.crm-card:hover,
.kanban-card:hover {
  border-color: #d9dce3;
  box-shadow: 0 8px 20px rgba(31,41,55,.07);
  transform: translateY(-1px);
}

/* Etiquetas e estados */
.badge,
.pill,
.status,
.tag {
  border-radius: 999px;
  font-weight: 800;
}

/* Menu aberto: acabamento mais profissional, sem tocar no layout */
.sidebar.menu-open {
  border-right: 1px solid rgba(255,255,255,.12);
  box-shadow: 20px 0 55px rgba(15,23,42,.30);
}

.sidebar.menu-open nav {
  scrollbar-width: thin;
}

.sidebar.menu-open .nav-btn,
.sidebar.menu-open .nav-group > span {
  min-height: 42px;
  margin: 2px 8px;
  padding-top: 9px;
  padding-bottom: 9px;
}

.sidebar.menu-open .nav-btn.active {
  box-shadow: inset 4px 0 0 var(--ui-accent), 0 5px 18px rgba(0,0,0,.12);
}

.sidebar-hover-gear {
  background: linear-gradient(135deg, #ff7a59, #ff6545);
}

/* Dashboard: acabamento executivo sem alterar a estrutura */
#dashboard {
  max-width: 1680px;
  margin-inline: auto;
}

#dashboard .dashboard-category {
  margin-top: 22px;
}

#dashboard .dashboard-hero {
  box-shadow: 0 16px 38px rgba(73,46,84,.12);
}

#dashboard > .metrics[data-dashboard-block="summary"] > article,
#dashboard .mini-metrics article {
  overflow: hidden;
  border-color: var(--ui-line);
  box-shadow: 0 7px 20px rgba(31,41,55,.055);
}

#dashboard > .metrics[data-dashboard-block="summary"] > article:hover,
#dashboard .mini-metrics article:hover {
  box-shadow: 0 13px 30px rgba(31,41,55,.09);
}

#dashboard .dashboard-analytics,
#dashboard .dashboard-calendars,
#dashboard .dashboard-panel-grid > .panel {
  border-color: var(--ui-line);
  box-shadow: var(--ui-shadow);
}

/* Modais */
.modal,
.payment-modal {
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}

.modal-panel,
.payment-panel {
  box-shadow: 0 24px 70px rgba(17,24,39,.22);
}

/* Rolagem discreta */
* {
  scrollbar-width: thin;
  scrollbar-color: #cfd3dc transparent;
}

*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  border: 2px solid transparent;
  border-radius: 999px;
  background: #cfd3dc;
  background-clip: padding-box;
}

/* Responsividade sem interferir na navegação */
@media (max-width: 900px) {
  .topbar { min-height: 60px; padding: 8px 12px; }
  .panel { border-radius: 12px; }
  table { border-radius: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* ================================================================
   V32.0.1 — CORREÇÃO DE CAMADA DAS NOTIFICAÇÕES
   Mantém o menu de notificações sempre acima dos cards e painéis.
   ================================================================ */
.topbar {
  position: relative;
  z-index: 500;
  overflow: visible;
}

.top-actions,
.notification-menu {
  position: relative;
  z-index: 510;
  overflow: visible;
}

.notification-dropdown {
  z-index: 99999 !important;
  isolation: isolate;
}

/* Evita que animações e transforms dos cards criem uma camada acima. */
.view,
#dashboard,
#dashboard .dashboard-hero,
#dashboard .metrics,
#dashboard .panel,
#dashboard article {
  isolation: auto;
}

/* ==================================================================
   V33.0.0 — EXPERIÊNCIA HUBSPOT PURA MAGIA
   Evolução exclusivamente visual. Não altera HTML, JS, IDs ou dados.
   ================================================================== */
:root {
  --v33-bg: #f5f7fa;
  --v33-surface: #ffffff;
  --v33-surface-soft: #f8fafc;
  --v33-text: #2d3e50;
  --v33-muted: #66788a;
  --v33-line: #dfe3eb;
  --v33-accent: #ff7a59;
  --v33-accent-dark: #e85f3d;
  --v33-blue: #0091ae;
  --v33-green: #00a4bd;
  --v33-purple: #6a5acd;
  --v33-warning: #f5a623;
  --v33-danger: #d94f4f;
  --v33-radius: 14px;
  --v33-shadow: 0 2px 8px rgba(45,62,80,.06), 0 12px 28px rgba(45,62,80,.05);
  --v33-shadow-hover: 0 5px 14px rgba(45,62,80,.08), 0 18px 38px rgba(45,62,80,.08);
}

body {
  background: var(--v33-bg);
  color: var(--v33-text);
}

/* Barra superior clara e consistente */
.topbar {
  min-height: 66px;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--v33-line);
  box-shadow: 0 1px 8px rgba(45,62,80,.045);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.topbar h1,
.topbar h2,
.view > h1,
.view > h2 {
  color: var(--v33-text);
  letter-spacing: -.025em;
}

/* Áreas de conteúdo */
.view {
  animation: v33-view-in .18s ease-out;
}

@keyframes v33-view-in {
  from { opacity: .6; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Painéis e cards padronizados */
.panel,
.modal-card,
.payment-panel,
.dashboard-hero,
.dashboard-analytics,
.dashboard-calendars,
.sale-editor-panel,
.service-catalog-panel {
  background: var(--v33-surface);
  border: 1px solid var(--v33-line);
  border-radius: var(--v33-radius);
  box-shadow: var(--v33-shadow);
}

.panel {
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.panel:hover {
  border-color: #cfd6e2;
  box-shadow: var(--v33-shadow-hover);
}

.panel-head {
  min-height: 50px;
  padding-bottom: 12px;
  border-bottom: 1px solid #edf0f4;
  margin-bottom: 16px;
}

.panel-head h2,
.panel-head h3,
.panel-head strong {
  color: var(--v33-text);
  letter-spacing: -.015em;
}

/* KPIs */
.metrics > article,
.mini-metrics > article,
.crm-metrics > article,
.dashboard-click-card {
  position: relative;
  background: var(--v33-surface);
  border: 1px solid var(--v33-line);
  border-radius: 13px;
  box-shadow: 0 2px 8px rgba(45,62,80,.05);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.metrics > article::before,
.mini-metrics > article::before,
.crm-metrics > article::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  border-radius: 13px 0 0 13px;
  background: var(--v33-accent);
  opacity: .92;
}

.metrics > article:nth-child(4n+2)::before,
.mini-metrics > article:nth-child(4n+2)::before,
.crm-metrics > article:nth-child(4n+2)::before { background: var(--v33-blue); }
.metrics > article:nth-child(4n+3)::before,
.mini-metrics > article:nth-child(4n+3)::before,
.crm-metrics > article:nth-child(4n+3)::before { background: var(--v33-green); }
.metrics > article:nth-child(4n+4)::before,
.mini-metrics > article:nth-child(4n+4)::before,
.crm-metrics > article:nth-child(4n+4)::before { background: var(--v33-purple); }

.metrics > article:hover,
.mini-metrics > article:hover,
.crm-metrics > article:hover,
.dashboard-click-card:hover {
  transform: translateY(-2px);
  border-color: #cfd6e2;
  box-shadow: var(--v33-shadow-hover);
}

.metrics strong,
.mini-metrics strong,
.crm-metrics strong {
  color: var(--v33-text);
  letter-spacing: -.035em;
}

.muted,
.small-muted,
.sub {
  color: var(--v33-muted);
}

/* Botões estilo CRM */
button,
.primary,
.secondary,
.ghost,
.icon-btn {
  border-radius: 8px;
  font-weight: 650;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}

button:active,
.primary:active,
.secondary:active,
.icon-btn:active {
  transform: translateY(1px);
}

.primary {
  background: var(--v33-accent);
  border-color: var(--v33-accent);
  box-shadow: 0 4px 12px rgba(255,122,89,.18);
}

.primary:hover {
  background: var(--v33-accent-dark);
  border-color: var(--v33-accent-dark);
  box-shadow: 0 6px 16px rgba(255,122,89,.24);
}

.secondary {
  background: #fff;
  border-color: #b9c2cf;
  color: #33475b;
}

.secondary:hover,
.ghost:hover,
.icon-btn:hover {
  background: #f5f8fa;
  border-color: #8f9cac;
}

.danger {
  border-radius: 8px;
}

/* Formulários */
input,
select,
textarea {
  border: 1px solid #cbd3dd;
  border-radius: 8px;
  background: #fff;
  color: var(--v33-text);
  transition: border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

input:hover,
select:hover,
textarea:hover {
  border-color: #9faaba;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--v33-blue);
  box-shadow: 0 0 0 3px rgba(0,145,174,.13);
  outline: none;
}

label {
  color: #425466;
  font-weight: 600;
}

/* Tabelas mais leves */
table {
  border: 1px solid var(--v33-line);
  border-radius: 11px;
  overflow: hidden;
  background: #fff;
}

thead th {
  background: #f5f8fa;
  color: #425466;
  border-bottom: 1px solid var(--v33-line);
  font-size: .78rem;
  letter-spacing: .025em;
  text-transform: uppercase;
}

tbody td {
  border-bottom-color: #edf0f4;
}

tbody tr {
  transition: background .12s ease;
}

tbody tr:hover {
  background: #f8fafc;
}

/* Status e etiquetas */
.pill,
.badge,
.status,
[class*="status-"] {
  border-radius: 999px;
  font-weight: 650;
  letter-spacing: .01em;
}

/* Filtros e barras de ação */
.filters,
.finance-filters,
.event-filters,
.visit-filter-bar,
.service-catalog-toolbar,
.audit-filter-grid,
.survey-filters {
  background: var(--v33-surface-soft);
  border: 1px solid #e4e8ee;
  border-radius: 11px;
  padding: 12px;
}

/* Modais com melhor hierarquia */
.modal,
.payment-modal {
  background: rgba(34,45,57,.48);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.modal-card,
.payment-panel {
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 26px 80px rgba(29,40,54,.28);
}

/* Dashboard */
#dashboard .dashboard-hero {
  background:
    radial-gradient(circle at 92% 0%, rgba(255,122,89,.12), transparent 34%),
    radial-gradient(circle at 4% 100%, rgba(0,145,174,.09), transparent 30%),
    #fff;
}

#dashboard .dashboard-category {
  color: #33475b;
  font-size: .78rem;
  font-weight: 750;
  letter-spacing: .065em;
  text-transform: uppercase;
}

/* CRM / listas / kanban sem alterar estrutura */
.list > article,
.list > li,
.warning-list > article,
.warning-list > li {
  border-radius: 10px;
  border-color: var(--v33-line);
  transition: background .12s ease, border-color .12s ease, transform .12s ease;
}

.list > article:hover,
.list > li:hover {
  background: #f8fafc;
  border-color: #cbd3dd;
  transform: translateY(-1px);
}

/* Menu lateral: apenas acabamento; comportamento da V31.9.10 preservado */
.sidebar {
  box-shadow: 8px 0 28px rgba(35,46,60,.14);
}

.sidebar.menu-open .nav-btn {
  border-radius: 7px;
}

.sidebar.menu-open .nav-btn:hover {
  background: rgba(255,255,255,.1);
}

.sidebar.menu-open .nav-btn.active {
  background: rgba(255,122,89,.16);
  box-shadow: inset 4px 0 0 var(--v33-accent);
}

.sidebar.menu-open .group-label {
  opacity: .78;
  font-size: .69rem;
  letter-spacing: .09em;
}

/* Notificações continuam acima de qualquer painel */
.topbar { z-index: 5000; overflow: visible; }
.top-actions,
.notification-menu { z-index: 5010; overflow: visible; }
.notification-dropdown {
  z-index: 999999 !important;
  border: 1px solid var(--v33-line);
  border-radius: 12px;
  box-shadow: 0 22px 65px rgba(29,40,54,.24);
}

/* Mobile */
@media (max-width: 900px) {
  .view { padding-inline: 10px; }
  .panel,
  .dashboard-hero,
  .modal-card,
  .payment-panel { border-radius: 11px; }
  .metrics > article,
  .mini-metrics > article,
  .crm-metrics > article { border-radius: 10px; }
}

/* ================================================================
   V33.0.1 — CORREÇÃO GLOBAL DE CAMADAS
   Modais e painéis abertos ficam sempre acima da barra superior.
   ================================================================ */
.modal,
.payment-modal,
[role="dialog"],
[aria-modal="true"] {
  position: fixed;
  z-index: 1000000 !important;
}

.modal-card,
.modal-panel,
.payment-panel {
  position: relative;
  z-index: 1;
}

/* A barra superior permanece acima do conteúdo comum, mas abaixo dos modais. */
.topbar {
  z-index: 5000;
}

/* Dropdown de notificações acima do conteúdo comum e abaixo de modais. */
.notification-dropdown {
  z-index: 999999 !important;
}

/* ================================================================
   V33.0.2 — CORREÇÃO DE EXPANSÃO E LARGURA
   Evita que filtros e painéis aumentem a largura da aplicação,
   desloquem o cabeçalho ou escondam conteúdo atrás da barra lateral.
   ================================================================ */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

@media (min-width: 901px) {
  body:not(.locked) main {
    box-sizing: border-box;
    max-width: calc(100vw - 84px);
    overflow-x: hidden;
  }
}

/* Filhos de grids podem encolher sem forçar expansão horizontal. */
.split,
.split > *,
.panel,
.form,
.view,
.topbar,
.topbar > *,
.panel-head,
.panel-head > * {
  min-width: 0;
  box-sizing: border-box;
}

/* A tela de visitas tinha filtros mínimos maiores que o painel. */
#salonVisits .split {
  grid-template-columns: minmax(320px, .9fr) minmax(0, 1.35fr);
}

#salonVisits .visit-filter-bar {
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(180px, 2fr) repeat(2, minmax(135px, 1fr));
}

#salonVisits .visit-filter-bar > * {
  min-width: 0;
  max-width: 100%;
}

#salonVisits #salonVisitStartFilter,
#salonVisits #salonVisitEndFilter {
  grid-column: span 1;
}

#salonVisits #salonVisitClearFilters {
  width: auto;
  justify-self: start;
}

/* Cabeçalho não ultrapassa a largura disponível. */
.topbar {
  width: 100%;
  max-width: 100%;
}

.topbar > div,
.top-actions {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 1250px) {
  #salonVisits .split {
    grid-template-columns: 1fr;
  }

  #salonVisits .visit-filter-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  #salonVisits .visit-filter-bar {
    grid-template-columns: 1fr;
  }

  #salonVisits #salonVisitClearFilters {
    width: 100%;
  }
}

/* =====================================================================
   V34.1.0 — DASHBOARD EXECUTIVO / DESIGN SYSTEM INICIAL
   Camada exclusivamente visual. Não altera IDs, navegação ou JavaScript.
   ===================================================================== */
:root {
  --v34-ink: #213343;
  --v34-muted: #657786;
  --v34-line: #dfe5ec;
  --v34-soft: #f5f8fa;
  --v34-blue: #0b74de;
  --v34-cyan: #00a4bd;
  --v34-orange: #ff7a59;
  --v34-green: #00a878;
  --v34-red: #d64545;
  --v34-purple: #7c5cff;
  --v34-shadow: 0 10px 30px rgba(33, 51, 67, .09);
  --v34-shadow-hover: 0 16px 38px rgba(33, 51, 67, .14);
}

body:not(.locked) {
  background: #f5f8fa;
  color: var(--v34-ink);
}

/* Cabeçalho mais leve e com hierarquia executiva */
.topbar {
  min-height: 84px;
  padding: 14px 22px;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--v34-line);
  box-shadow: 0 5px 18px rgba(33,51,67,.06);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.topbar h1 {
  margin: 0;
  color: var(--v34-ink);
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.1;
  letter-spacing: -.035em;
}

.topbar p {
  margin-top: 6px;
  color: var(--v34-muted);
  font-size: .93rem;
}

.top-actions {
  gap: 10px;
}

.top-actions > button,
.top-actions .user-pill,
.notification-menu > button {
  min-height: 42px;
  border-radius: 10px;
}

/* Área de conteúdo */
.view {
  padding-top: 24px;
  padding-bottom: 38px;
}

/* Hero do dashboard */
#dashboard .dashboard-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 28px 30px;
  border: 1px solid rgba(11,116,222,.12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 95% 0%, rgba(255,122,89,.20), transparent 34%),
    radial-gradient(circle at 0% 100%, rgba(0,164,189,.16), transparent 33%),
    linear-gradient(135deg, #ffffff 0%, #fbfdff 100%);
  box-shadow: var(--v34-shadow);
}

#dashboard .dashboard-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 210px;
  height: 210px;
  right: -80px;
  bottom: -120px;
  border-radius: 50%;
  border: 34px solid rgba(11,116,222,.06);
}

#dashboard .dashboard-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 8px;
  color: var(--v34-blue);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

#dashboard .dashboard-eyebrow::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--v34-green);
  box-shadow: 0 0 0 5px rgba(0,168,120,.12);
}

#dashboard .dashboard-title-row h2 {
  margin: 0;
  color: var(--v34-ink);
  font-size: clamp(1.65rem, 2.6vw, 2.35rem);
  letter-spacing: -.045em;
}

#dashboard .dashboard-subtitle {
  max-width: 720px;
  margin-top: 8px;
  color: var(--v34-muted);
  font-size: .98rem;
}

#dashboard .dashboard-config-btn {
  width: 44px;
  height: 44px;
  border: 1px solid var(--v34-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(33,51,67,.08);
}

/* KPIs executivos */
#dashboard > .metrics,
#dashboard .mini-metrics,
#dashboard .crm-metrics {
  gap: 14px;
}

#dashboard .metrics > article,
#dashboard .mini-metrics > article,
#dashboard .crm-metrics > article {
  position: relative;
  overflow: hidden;
  min-height: 132px;
  padding: 20px 20px 18px;
  border: 1px solid var(--v34-line);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 6px 20px rgba(33,51,67,.065);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

#dashboard .metrics > article::before,
#dashboard .mini-metrics > article::before,
#dashboard .crm-metrics > article::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--v34-blue);
}

#dashboard .metrics > article:nth-child(2)::before { background: var(--v34-purple); }
#dashboard .metrics > article:nth-child(3)::before { background: var(--v34-orange); }
#dashboard .metrics > article:nth-child(4)::before { background: var(--v34-green); }

#dashboard .dashboard-click-card:hover {
  transform: translateY(-3px);
  border-color: #c7d5e4;
  box-shadow: var(--v34-shadow-hover);
}

#dashboard .metrics article span,
#dashboard .mini-metrics article span,
#dashboard .crm-metrics article span {
  color: var(--v34-muted);
  font-size: .75rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

#dashboard .metrics article strong,
#dashboard .mini-metrics article strong,
#dashboard .crm-metrics article strong {
  display: block;
  margin-top: 12px;
  color: var(--v34-ink);
  font-size: clamp(1.45rem, 2vw, 2rem);
  line-height: 1.05;
  letter-spacing: -.035em;
}

/* Seções e painéis */
#dashboard .dashboard-category {
  margin-top: 28px;
  margin-bottom: 10px;
  color: var(--v34-muted);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .1em;
}

#dashboard .panel,
#dashboard .dashboard-calendars,
#dashboard .dashboard-panel-grid > section {
  border: 1px solid var(--v34-line);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 6px 22px rgba(33,51,67,.06);
}

#dashboard .panel-head {
  padding-bottom: 14px;
  border-bottom: 1px solid #edf1f5;
}

#dashboard .panel-head h2,
#dashboard .panel-head h3 {
  color: var(--v34-ink);
  letter-spacing: -.02em;
}

#dashboard .bar-chart,
#dashboard .calendar-grid,
#dashboard .list {
  border-radius: 12px;
}

/* Botões do dashboard */
#dashboard button.primary,
#dashboard .primary {
  border-radius: 10px;
  background: var(--v34-orange);
  border-color: var(--v34-orange);
  box-shadow: 0 6px 16px rgba(255,122,89,.22);
}

#dashboard button.secondary,
#dashboard .secondary {
  border-radius: 10px;
  border-color: var(--v34-line);
  background: #fff;
  color: var(--v34-ink);
}

/* Melhora leitura de listas e agenda */
#dashboard .list > article,
#dashboard .list > li {
  padding: 14px 15px;
  border: 1px solid #e6ebf0;
  border-radius: 11px;
  background: #fff;
}

#dashboard .list > article:hover,
#dashboard .list > li:hover {
  border-color: #bfd2e3;
  background: #fbfdff;
}

/* Calendários mais compactos e modernos */
#dashboard .dashboard-calendar-grid {
  gap: 14px;
}

#dashboard .dashboard-calendar-grid > section {
  padding: 16px;
  border: 1px solid #e3e9ef;
  border-radius: 14px;
  background: #fff;
}

#dashboard .mini-calendar > * {
  border-radius: 8px;
}

/* Responsividade da primeira fase V34 */
@media (max-width: 1100px) {
  #dashboard > .metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .topbar {
    min-height: auto;
    padding: 12px 14px;
  }

  #dashboard .dashboard-hero {
    padding: 22px 18px;
    border-radius: 14px;
  }

  #dashboard > .metrics {
    grid-template-columns: 1fr;
  }

  #dashboard .metrics > article,
  #dashboard .mini-metrics > article,
  #dashboard .crm-metrics > article {
    min-height: 112px;
  }
}

/* ==========================================================
   V34.2.0 — CRM PREMIUM / HUBSPOT INSPIRED
   Escopo visual isolado: Fidelidade & CRM + Relacionamento
   ========================================================== */
#loyaltyCrm,
#relationshipCrm {
  --crm-primary: #ff7a59;
  --crm-primary-dark: #e85f3d;
  --crm-navy: #243746;
  --crm-blue: #2f80ed;
  --crm-green: #27ae60;
  --crm-purple: #8b5cf6;
  --crm-yellow: #f2c94c;
  --crm-bg: #f5f8fa;
  --crm-border: #dfe3eb;
  --crm-muted: #64748b;
  --crm-shadow: 0 10px 28px rgba(36, 55, 70, .08);
  position: relative;
  padding-bottom: 32px;
}

#loyaltyCrm > .panel:first-child,
#relationshipCrm > .panel:first-child {
  background: linear-gradient(135deg, #ffffff 0%, #fff8f5 100%);
  border: 1px solid rgba(255, 122, 89, .22);
  border-radius: 18px;
  box-shadow: var(--crm-shadow);
  overflow: visible;
}

#loyaltyCrm > .panel:first-child .panel-head,
#relationshipCrm > .panel:first-child .panel-head {
  align-items: flex-start;
  gap: 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(223, 227, 235, .8);
}

#loyaltyCrm > .panel:first-child h2,
#relationshipCrm > .panel:first-child h2 {
  color: var(--crm-navy);
  font-size: clamp(1.45rem, 2vw, 2rem);
  letter-spacing: -.03em;
  margin-bottom: 6px;
}

#loyaltyCrm > .panel:first-child h2::before,
#relationshipCrm > .panel:first-child h2::before {
  content: "✦";
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-right: 10px;
  border-radius: 10px;
  background: var(--crm-primary);
  color: #fff;
  font-size: .95rem;
  vertical-align: 3px;
  box-shadow: 0 8px 18px rgba(255, 122, 89, .28);
}

#crmRefreshBtn,
#relationshipRefreshBtn {
  background: #fff;
  color: var(--crm-primary-dark);
  border: 1px solid rgba(255, 122, 89, .45);
  border-radius: 10px;
  font-weight: 700;
  padding: 11px 16px;
  box-shadow: 0 5px 14px rgba(36, 55, 70, .07);
}

#crmRefreshBtn:hover,
#relationshipRefreshBtn:hover {
  background: #fff3ef;
  border-color: var(--crm-primary);
  transform: translateY(-1px);
}

#loyaltyCrm .crm-metrics,
#relationshipCrm .crm-metrics {
  grid-template-columns: repeat(auto-fit, minmax(175px, 1fr));
  gap: 14px;
  margin-top: 20px;
}

#loyaltyCrm .crm-metric,
#relationshipCrm .crm-metric,
#loyaltyCrm .crm-metrics > article,
#relationshipCrm .crm-metrics > article {
  min-height: 112px;
  padding: 18px 18px 17px;
  border: 1px solid var(--crm-border);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 7px 20px rgba(36, 55, 70, .06);
  position: relative;
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

#loyaltyCrm .crm-metric::before,
#relationshipCrm .crm-metric::before,
#loyaltyCrm .crm-metrics > article::before,
#relationshipCrm .crm-metrics > article::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--crm-primary);
}

#loyaltyCrm .crm-metric:nth-child(4n+2)::before,
#relationshipCrm .crm-metric:nth-child(4n+2)::before { background: var(--crm-blue); }
#loyaltyCrm .crm-metric:nth-child(4n+3)::before,
#relationshipCrm .crm-metric:nth-child(4n+3)::before { background: var(--crm-green); }
#loyaltyCrm .crm-metric:nth-child(4n+4)::before,
#relationshipCrm .crm-metric:nth-child(4n+4)::before { background: var(--crm-purple); }

#loyaltyCrm .crm-metric:hover,
#relationshipCrm .crm-metric:hover,
#loyaltyCrm .crm-metrics > article:hover,
#relationshipCrm .crm-metrics > article:hover {
  transform: translateY(-3px);
  border-color: rgba(255, 122, 89, .38);
  box-shadow: 0 14px 30px rgba(36, 55, 70, .11);
}

#loyaltyCrm .crm-metric span,
#relationshipCrm .crm-metric span,
#loyaltyCrm .crm-metrics > article span,
#relationshipCrm .crm-metrics > article span {
  color: var(--crm-muted);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

#loyaltyCrm .crm-metric strong,
#relationshipCrm .crm-metric strong,
#loyaltyCrm .crm-metrics > article strong,
#relationshipCrm .crm-metrics > article strong {
  color: var(--crm-navy);
  font-size: clamp(1.45rem, 2.2vw, 2rem);
  line-height: 1.15;
  margin-top: 8px;
}

#loyaltyCrm .crm-filter-bar {
  margin-top: 20px;
  padding: 18px;
  border: 1px solid var(--crm-border);
  border-radius: 14px;
  background: rgba(255,255,255,.88);
  box-shadow: inset 0 1px 0 #fff;
}

#loyaltyCrm .crm-filter-grid {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 14px;
}

#loyaltyCrm .crm-filter-grid label {
  color: var(--crm-navy);
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .025em;
}

#loyaltyCrm .crm-filter-grid input,
#loyaltyCrm .crm-filter-grid select {
  min-height: 43px;
  margin-top: 6px;
  border-radius: 9px;
  border-color: var(--crm-border);
  background: #fff;
}

#loyaltyCrm .crm-filter-grid input:focus,
#loyaltyCrm .crm-filter-grid select:focus {
  border-color: var(--crm-primary);
  box-shadow: 0 0 0 3px rgba(255, 122, 89, .14);
}

#loyaltyCrm .crm-filter-actions {
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #edf0f5;
}

#loyaltyCrm .crm-filter-actions .primary,
#loyaltyCrm form .primary {
  background: var(--crm-primary);
  border-color: var(--crm-primary);
  box-shadow: 0 8px 18px rgba(255, 122, 89, .22);
}

#loyaltyCrm .crm-filter-actions .primary:hover,
#loyaltyCrm form .primary:hover {
  background: var(--crm-primary-dark);
  border-color: var(--crm-primary-dark);
  transform: translateY(-1px);
}

#loyaltyCrm > .split,
#relationshipCrm > .split {
  gap: 18px;
  align-items: stretch;
}

#loyaltyCrm > .split > .panel,
#relationshipCrm > .split > .panel,
#loyaltyCrm > .panel:not(:first-child),
#relationshipCrm > .panel:not(:first-child) {
  border: 1px solid var(--crm-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--crm-shadow);
  overflow: visible;
}

#loyaltyCrm .panel h2,
#relationshipCrm .panel h2 {
  color: var(--crm-navy);
  font-size: 1.05rem;
  letter-spacing: -.015em;
}

#loyaltyCrm .panel > h2,
#relationshipCrm .panel > h2 {
  display: flex;
  align-items: center;
  gap: 9px;
  padding-bottom: 12px;
  margin-bottom: 12px;
  border-bottom: 1px solid #edf0f5;
}

#loyaltyCrm .panel > h2::before,
#relationshipCrm .panel > h2::before {
  content: "";
  width: 9px;
  height: 9px;
  flex: 0 0 9px;
  border-radius: 50%;
  background: var(--crm-primary);
  box-shadow: 0 0 0 5px rgba(255,122,89,.12);
}

#loyaltyCrm .list,
#relationshipCrm .list {
  gap: 10px;
}

#loyaltyCrm .item,
#relationshipCrm .item,
#loyaltyCrm .crm-row,
#relationshipCrm .crm-row,
#loyaltyCrm .crm-redemption-card,
#loyaltyCrm .crm-referral-card {
  border: 1px solid #e6eaf0;
  border-radius: 12px;
  background: #fff;
  padding: 14px 15px;
  box-shadow: 0 4px 12px rgba(36,55,70,.045);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

#loyaltyCrm .item:hover,
#relationshipCrm .item:hover,
#loyaltyCrm .crm-row:hover,
#relationshipCrm .crm-row:hover,
#loyaltyCrm .crm-redemption-card:hover,
#loyaltyCrm .crm-referral-card:hover {
  border-color: rgba(255,122,89,.42);
  box-shadow: 0 9px 22px rgba(36,55,70,.09);
  transform: translateY(-1px);
}

#loyaltyCrm .item strong,
#relationshipCrm .item strong,
#loyaltyCrm .crm-row strong,
#relationshipCrm .crm-row strong {
  color: var(--crm-navy);
}

#loyaltyCrm .item small,
#relationshipCrm .item small,
#loyaltyCrm .muted,
#relationshipCrm .muted {
  color: var(--crm-muted);
}

#loyaltyCrm .tag,
#relationshipCrm .tag {
  border-radius: 999px;
  padding: 5px 10px;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .015em;
}

#loyaltyCrm form.panel {
  background: linear-gradient(180deg, #fff 0%, #fbfcfe 100%);
}

#loyaltyCrm form.panel label {
  color: var(--crm-navy);
  font-size: .8rem;
  font-weight: 750;
}

#loyaltyCrm form.panel input,
#loyaltyCrm form.panel select,
#loyaltyCrm form.panel textarea {
  border-radius: 9px;
  border-color: var(--crm-border);
  background: #fff;
}

#loyaltyCrm form.panel input:focus,
#loyaltyCrm form.panel select:focus,
#loyaltyCrm form.panel textarea:focus {
  border-color: var(--crm-primary);
  box-shadow: 0 0 0 3px rgba(255,122,89,.13);
}

#loyaltyCrm #crmTopClientsSection {
  background: linear-gradient(145deg, #fff 0%, #f8f5ff 100%);
}

#loyaltyCrm #crmReactivationSection {
  background: linear-gradient(145deg, #fff 0%, #fffaf0 100%);
}

#loyaltyCrm #crmTransactionsSection {
  background: linear-gradient(145deg, #fff 0%, #f3f9ff 100%);
}

#loyaltyCrm #crmRedemptionsSection {
  background: linear-gradient(145deg, #fff 0%, #fff6f3 100%);
}

#loyaltyCrm #crmRewardsSection {
  background: linear-gradient(145deg, #fff 0%, #f4fbf7 100%);
}

@media (max-width: 1100px) {
  #loyaltyCrm .crm-filter-grid { grid-template-columns: repeat(2, minmax(170px, 1fr)); }
}

@media (max-width: 720px) {
  #loyaltyCrm,
  #relationshipCrm { padding-bottom: 18px; }
  #loyaltyCrm > .panel:first-child .panel-head,
  #relationshipCrm > .panel:first-child .panel-head { flex-direction: column; }
  #crmRefreshBtn,
  #relationshipRefreshBtn { width: 100%; }
  #loyaltyCrm .crm-filter-grid { grid-template-columns: 1fr; }
  #loyaltyCrm .crm-filter-actions { align-items: stretch; }
  #loyaltyCrm .crm-filter-actions button { width: 100%; }
  #loyaltyCrm .crm-metrics,
  #relationshipCrm .crm-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 460px) {
  #loyaltyCrm .crm-metrics,
  #relationshipCrm .crm-metrics { grid-template-columns: 1fr; }
}

/* V34.2.1 — correção de sobreposição no CRM Fidelidade */
#loyaltyCrm,
#loyaltyCrm * {
  box-sizing: border-box;
}

#loyaltyCrm .crm-benefits-grid,
#loyaltyCrm .crm-two-column {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  align-items: start;
  width: 100%;
  min-width: 0;
}

#loyaltyCrm .crm-benefits-grid > *,
#loyaltyCrm .crm-two-column > * {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

#loyaltyCrm #crmRedemptionRequestForm,
#loyaltyCrm #crmRewardForm {
  position: relative;
  z-index: 1;
  margin: 0;
}

#loyaltyCrm #crmRedemptionRequestForm input,
#loyaltyCrm #crmRedemptionRequestForm select,
#loyaltyCrm #crmRedemptionRequestForm textarea,
#loyaltyCrm #crmRewardForm input,
#loyaltyCrm #crmRewardForm select,
#loyaltyCrm #crmRewardForm textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

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

#loyaltyCrm #crmRewardForm .two > * {
  min-width: 0;
}

@media (max-width: 1180px) {
  #loyaltyCrm .crm-benefits-grid,
  #loyaltyCrm .crm-two-column {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  #loyaltyCrm #crmRewardForm .two {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   V34.3.0 — DASHBOARD FINAL BASEADO NO LAYOUT APROVADO
   Camada visual isolada. IDs, JavaScript, Supabase e regras
   de negócio permanecem inalterados.
   ========================================================= */
:root {
  --v34-ink: #14263a;
  --v34-muted: #607086;
  --v34-line: #e4e9f1;
  --v34-bg: #f7f9fc;
  --v34-orange: #ff5c35;
  --v34-orange-soft: #fff0eb;
  --v34-green: #16a34a;
  --v34-purple: #7c3aed;
  --v34-blue: #2563eb;
  --v34-amber: #ea7b16;
}

body { background: var(--v34-bg); }
main { background: var(--v34-bg); }

/* Cabeçalho mais leve e horizontal, inspirado no layout aprovado */
.topbar {
  min-height: 76px;
  padding: 14px 22px;
  border: 0;
  border-bottom: 1px solid var(--v34-line);
  border-radius: 0;
  background: rgba(255,255,255,.96);
  box-shadow: 0 3px 16px rgba(31,45,61,.045);
  backdrop-filter: blur(14px);
}
.topbar h1 {
  color: var(--v34-ink);
  font-size: 1.34rem;
  letter-spacing: -.035em;
}
.topbar p { display: none; }
.top-actions { gap: 9px; }
.top-actions .ghost,
.top-actions .file-btn,
.user-badge,
.bell-btn {
  min-height: 42px;
  border-color: var(--v34-line);
  border-radius: 11px;
  background: #fff;
  box-shadow: none;
}
.top-actions .ghost:hover,
.top-actions .file-btn:hover {
  border-color: rgba(255,92,53,.35);
  background: var(--v34-orange-soft);
  color: #d94724;
}

/* Sidebar clara com item ativo laranja */
.sidebar {
  background: #fff;
  border-right: 1px solid var(--v34-line);
  box-shadow: 5px 0 22px rgba(31,45,61,.045);
}
.sidebar .brand { border-bottom-color: #eef1f5; }
.sidebar .nav-btn { color: #294057; }
.sidebar .nav-btn:hover {
  background: #f7f9fc;
  color: var(--v34-orange);
}
.sidebar .nav-btn.active {
  background: linear-gradient(135deg, #fff1ec, #fff7f4);
  color: #ef4b26;
  box-shadow: inset 3px 0 0 var(--v34-orange);
}
.sidebar .nav-btn.active .nav-icon,
.sidebar .nav-icon {
  background: transparent;
  color: inherit;
}
.sidebar-toggle,
#sidebarToggle,
.menu-toggle {
  background: var(--v34-orange) !important;
  color: #fff !important;
  border-color: var(--v34-orange) !important;
  box-shadow: 0 8px 20px rgba(255,92,53,.24) !important;
}

/* Dashboard */
#dashboard {
  max-width: 1480px;
  margin: 0 auto;
  padding: 28px 0 54px;
  color: var(--v34-ink);
}
#dashboard::before {
  content: attr(data-greeting);
  display: block;
  margin: 0 0 4px;
  color: var(--v34-ink);
  font-size: clamp(1.28rem, 2vw, 1.75rem);
  font-weight: 850;
  letter-spacing: -.035em;
}
#dashboard::after { content: none; }

#dashboard .dashboard-hero {
  min-height: 136px;
  margin: 18px 0 18px;
  padding: 25px 28px;
  border: 1px solid #dfe5ee;
  border-radius: 18px;
  background:
    radial-gradient(circle at 95% 40%, rgba(255,92,53,.11), transparent 24%),
    linear-gradient(110deg, #f1f7ff 0%, #fff 48%, #fff2ee 100%);
  box-shadow: 0 8px 24px rgba(31,45,61,.055);
}
#dashboard .dashboard-hero::before {
  content: "Aqui está o resumo da operação do seu salão.";
  position: absolute;
  left: 0;
  top: -42px;
  color: var(--v34-muted);
  font-size: .92rem;
  font-weight: 500;
  white-space: nowrap;
}
#dashboard .dashboard-hero::after {
  right: 48px;
  top: -65px;
  width: 190px;
  height: 190px;
  border-width: 26px;
  border-color: rgba(255,92,53,.045);
}
#dashboard .dashboard-eyebrow {
  background: #e9ddff;
  color: #7136d5;
}
#dashboard .dashboard-eyebrow::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22b573;
  box-shadow: 0 0 0 4px rgba(34,181,115,.13);
}
#dashboard .dashboard-hero h2 {
  margin-top: 12px;
  font-size: clamp(1.7rem, 2.6vw, 2.35rem);
  color: var(--v34-ink);
}
#dashboard .dashboard-config-btn {
  border-color: #dfe5ee;
  color: #59416f;
  background: #fff;
}

/* KPIs: ícone ao lado do título, sem cobrir o texto */
#dashboard > .metrics[data-dashboard-block="summary"] {
  gap: 14px;
  margin-bottom: 25px;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article {
  min-height: 164px;
  padding: 22px 20px 18px;
  border: 1px solid var(--v34-line);
  border-radius: 17px;
  box-shadow: 0 8px 24px rgba(31,45,61,.055);
  color: var(--v34-ink) !important;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article::before {
  position: absolute;
  left: 18px;
  top: 18px;
  width: 42px;
  height: 42px;
  margin: 0;
  border-radius: 13px;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article::after {
  right: -28px;
  bottom: -34px;
  width: 112px;
  height: 112px;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article > span {
  display: block;
  min-height: 42px;
  padding: 10px 0 0 54px;
  overflow: visible;
  color: #4c586a;
  font-size: .79rem;
  font-weight: 850;
  line-height: 1.25;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: normal;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article > strong {
  display: block;
  max-width: 100%;
  margin-top: 18px;
  color: var(--v34-ink);
  font-size: clamp(1.55rem, 2.15vw, 2rem);
  line-height: 1.08;
  white-space: normal;
}
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(1)::before { color: var(--v34-green); background: #e7f8ed; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(2)::before { color: var(--v34-purple); background: #f0eaff; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(3)::before { color: var(--v34-amber); background: #fff2df; }
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(4)::before { color: var(--v34-blue); background: #eaf2ff; content: "🛒"; font-size: 1rem; }

/* Separadores e painéis */
#dashboard .dashboard-category:not(.dashboard-hero) {
  margin: 24px 0 12px;
}
#dashboard .dashboard-category:not(.dashboard-hero)::before {
  content: "";
  width: 4px;
  height: 22px;
  border-radius: 99px;
  background: linear-gradient(180deg, #8b5cf6, #ff4f8b);
}
#dashboard .dashboard-category:not(.dashboard-hero)::after {
  background: linear-gradient(90deg, #dfe4ec, transparent);
}
#dashboard .dashboard-category:not(.dashboard-hero) h2 {
  color: #26384b;
  font-size: .91rem;
  font-weight: 900;
  letter-spacing: .02em;
}
#dashboard .panel.dashboard-analytics,
#dashboard .panel.dashboard-calendars,
#dashboard .dashboard-panel-grid > .panel {
  border: 1px solid var(--v34-line);
  border-radius: 17px;
  box-shadow: 0 8px 26px rgba(31,45,61,.055);
  background: #fff;
}
#dashboard .panel-head {
  padding-bottom: 14px;
  border-bottom: 1px solid #edf0f4;
}
#dashboard .panel-head h2 { color: var(--v34-ink); }
#dashboard .filters {
  padding: 10px;
  border: 1px solid var(--v34-line);
  border-radius: 13px;
  background: #fafbfd;
}
#dashboard .filters input,
#dashboard .filters select {
  border-color: #dfe5ed;
  border-radius: 10px;
  background: #fff;
}
#dashboard .filters button {
  border-radius: 10px;
  background: #fff;
}

/* Métricas internas inspiradas no segundo mockup */
#dashboard .mini-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 0;
  margin-top: 16px;
  border: 1px solid #edf0f4;
  border-radius: 15px;
  overflow: hidden;
  background: #fff;
}
#dashboard .mini-metrics article {
  min-height: 112px;
  padding: 18px;
  border: 0;
  border-right: 1px solid #edf0f4;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
#dashboard .mini-metrics article:last-child { border-right: 0; }
#dashboard .mini-metrics span {
  color: #5b6879;
  font-size: .78rem;
  font-weight: 750;
  line-height: 1.3;
  white-space: normal;
}
#dashboard .mini-metrics strong {
  margin-top: 13px;
  color: var(--v34-ink);
  font-size: 1.55rem;
}
#dashboard .chart-grid > section {
  border-color: #edf0f4;
  background: #fff;
}

@media (max-width: 1180px) {
  #dashboard > .metrics[data-dashboard-block="summary"] { grid-template-columns: repeat(2, minmax(0,1fr)); }
  #dashboard .mini-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #dashboard .mini-metrics article:nth-child(2) { border-right: 0; }
  #dashboard .mini-metrics article:nth-child(-n+2) { border-bottom: 1px solid #edf0f4; }
}
@media (max-width: 720px) {
  #dashboard { padding-top: 18px; }
  #dashboard::before { padding: 0 4px; }
  #dashboard .dashboard-hero::before { top: -36px; font-size: .8rem; }
  #dashboard .dashboard-hero { margin-top: 44px; padding: 20px; }
  #dashboard > .metrics[data-dashboard-block="summary"] { grid-template-columns: 1fr; }
  #dashboard .mini-metrics { grid-template-columns: 1fr; }
  #dashboard .mini-metrics article,
  #dashboard .mini-metrics article:nth-child(2) { border-right: 0; border-bottom: 1px solid #edf0f4; }
  #dashboard .mini-metrics article:last-child { border-bottom: 0; }
  .topbar { padding: 12px 14px; }
  .top-actions .ghost,
  .top-actions .file-btn { display: none; }
}

/* V34.3.1 — Ranking de pacotes mais vendidos */
.package-ranking-card {
  margin: 20px 0 22px;
  padding: 22px;
  border: 1px solid #e5e9f2;
  border-radius: 18px;
  background: linear-gradient(135deg, #ffffff 0%, #fbfcff 68%, #fff7f3 100%);
  box-shadow: 0 10px 30px rgba(25, 42, 70, .06);
}
.package-ranking-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding-bottom: 17px;
  margin-bottom: 4px;
  border-bottom: 1px solid #edf0f6;
}
.package-ranking-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #ff5c35;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.package-ranking-head h3 { margin: 0; color: #172b4d; font-size: 19px; }
.package-ranking-head p { margin: 6px 0 0; color: #667085; font-size: 13px; }
.package-ranking-total {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 999px;
  background: #fff0eb;
  color: #c53d1d;
  font-size: 12px;
  font-weight: 800;
}
.package-ranking-list { display: grid; gap: 3px; padding-top: 8px; }
.package-ranking-row {
  display: grid;
  grid-template-columns: 43px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  padding: 13px 8px;
  border-bottom: 1px solid #f0f2f7;
}
.package-ranking-row:last-child { border-bottom: 0; }
.package-ranking-position {
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  border-radius: 12px;
  background: #f1f3f9;
  color: #566074;
  font-size: 12px;
  font-weight: 900;
}
.package-ranking-position.rank-1 { background: #fff3d6; color: #9a6200; }
.package-ranking-position.rank-2 { background: #eef1f5; color: #536071; }
.package-ranking-position.rank-3 { background: #f8e7da; color: #9a4f1b; }
.package-ranking-content { min-width: 0; }
.package-ranking-labels {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 9px;
}
.package-ranking-labels strong {
  min-width: 0;
  overflow: hidden;
  color: #172b4d;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.package-ranking-labels span { flex: 0 0 auto; color: #667085; font-size: 12px; font-weight: 700; }
.package-ranking-track { height: 8px; overflow: hidden; border-radius: 999px; background: #edf0f7; }
.package-ranking-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #ff7a59, #ff5c35);
  box-shadow: 0 0 0 1px rgba(255, 92, 53, .08);
}
@media (max-width: 700px) {
  .package-ranking-card { padding: 17px; }
  .package-ranking-head { align-items: stretch; flex-direction: column; }
  .package-ranking-total { align-self: flex-start; }
  .package-ranking-labels { align-items: flex-start; flex-direction: column; gap: 4px; }
  .package-ranking-labels span { flex: initial; }
}


/* V34.3.2 — pesquisa fixa e visível no menu lateral */
.sidebar {
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.sidebar .brand,
.sidebar .sidebar-hover-gear,
.sidebar .sidebar-search-fixed {
  flex: 0 0 auto;
}

.sidebar-search-fixed {
  position: relative;
  z-index: 30;
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin: 0 12px 12px;
  padding: 11px 13px;
  min-height: 46px;
  background: #ffffff !important;
  border: 1px solid #d7deea !important;
  border-radius: 12px;
  color: #334155 !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .08);
  opacity: 1 !important;
  visibility: visible !important;
}

.sidebar-search-fixed > span {
  flex: 0 0 auto;
  color: #ff6b4a !important;
  font-size: 20px;
  line-height: 1;
}

.sidebar-search-fixed input,
#navSearch {
  display: block !important;
  width: 100% !important;
  min-width: 0;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  color: #172033 !important;
  font-size: 14px;
  font-weight: 600;
  opacity: 1 !important;
  -webkit-text-fill-color: #172033 !important;
}

.sidebar-search-fixed input::placeholder,
#navSearch::placeholder {
  color: #7b879b !important;
  opacity: 1 !important;
}

.sidebar > nav {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0 10px 18px;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}

/* Quando recolhido, esconde o campo completo sem afetar a rolagem dos itens. */
.sidebar.force-collapsed:not(.menu-open) .sidebar-search-fixed {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.sidebar.menu-open .sidebar-search-fixed {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

@media (max-width: 760px) {
  .sidebar-search-fixed {
    margin-inline: 10px;
  }
}

/* =========================================================
   V34.4.0 — PURPLE EDITION
   Identidade principal roxa. Alteração exclusivamente visual.
   ========================================================= */
:root {
  --purple-primary: #6d28d9;
  --purple-hover: #7c3aed;
  --purple-dark: #5b21b6;
  --purple-soft: #ede9fe;
  --purple-softer: #f5f3ff;
  --purple-border: #c4b5fd;

  /* compatibilidade com os temas anteriores */
  --v34-orange: var(--purple-primary);
  --v34-orange-soft: var(--purple-softer);
  --v33-accent: var(--purple-primary);
  --crm-primary: var(--purple-primary);
  --dash-orange: var(--purple-primary);
  --orange: var(--purple-primary);
}

/* Links, foco e controles principais */
a { color: var(--purple-primary); }
a:hover { color: var(--purple-hover); }
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline-color: var(--purple-primary) !important;
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--purple-border) !important;
  box-shadow: 0 0 0 3px rgba(109,40,217,.12) !important;
}

/* Botões de ação padrão */
button.primary,
.btn-primary,
.primary-btn,
.save-btn,
.confirm-btn,
.modal-actions button[type="submit"],
form button[type="submit"] {
  background: linear-gradient(135deg, var(--purple-primary), var(--purple-hover)) !important;
  border-color: var(--purple-primary) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(109,40,217,.20) !important;
}
button.primary:hover,
.btn-primary:hover,
.primary-btn:hover,
.save-btn:hover,
.confirm-btn:hover,
.modal-actions button[type="submit"]:hover,
form button[type="submit"]:hover {
  background: linear-gradient(135deg, var(--purple-dark), var(--purple-primary)) !important;
  border-color: var(--purple-dark) !important;
}

/* Cabeçalho */
.top-actions .ghost:hover,
.top-actions .file-btn:hover {
  border-color: rgba(109,40,217,.30);
  background: var(--purple-softer);
  color: var(--purple-dark);
}
.bell-btn:hover,
.user-badge:hover {
  border-color: var(--purple-border);
  background: var(--purple-softer);
}

/* Menu lateral roxo */
.sidebar .nav-btn:hover {
  background: var(--purple-softer);
  color: var(--purple-primary);
}
.sidebar .nav-btn.active {
  background: linear-gradient(135deg, #ede9fe, #f8f7ff) !important;
  color: var(--purple-dark) !important;
  box-shadow: inset 3px 0 0 var(--purple-primary) !important;
}
.sidebar .nav-btn.active .nav-icon,
.sidebar .nav-btn:hover .nav-icon {
  color: var(--purple-primary) !important;
}
.sidebar-toggle,
#sidebarToggle,
.menu-toggle {
  background: linear-gradient(135deg, var(--purple-primary), var(--purple-hover)) !important;
  border-color: var(--purple-primary) !important;
  box-shadow: 0 8px 22px rgba(109,40,217,.26) !important;
}
.sidebar-search-fixed {
  border-color: #ddd6fe !important;
  box-shadow: 0 0 0 1px rgba(109,40,217,.03), 0 5px 16px rgba(76,29,149,.05);
}
.sidebar-search-fixed:focus-within {
  border-color: var(--purple-border) !important;
  box-shadow: 0 0 0 3px rgba(109,40,217,.11) !important;
}
.sidebar-search-fixed svg,
.sidebar-search-fixed i { color: var(--purple-primary) !important; }

/* Dashboard hero e destaques */
#dashboard .dashboard-hero {
  background:
    radial-gradient(circle at 95% 40%, rgba(109,40,217,.12), transparent 25%),
    linear-gradient(110deg, #f3f6ff 0%, #fff 46%, #f5f3ff 100%);
  border-color: #ddd6fe;
}
#dashboard .dashboard-hero::after {
  border-color: rgba(109,40,217,.05);
}
#dashboard .dashboard-eyebrow {
  background: var(--purple-soft);
  color: var(--purple-dark);
}
#dashboard .dashboard-config-btn:hover {
  border-color: var(--purple-border);
  background: var(--purple-softer);
  color: var(--purple-dark);
}
#dashboard .dashboard-category:not(.dashboard-hero)::before {
  background: linear-gradient(180deg, var(--purple-primary), #a855f7);
}

/* Cards e métricas */
#dashboard > .metrics[data-dashboard-block="summary"] > article:hover,
.panel:hover,
.card:hover {
  border-color: rgba(109,40,217,.22);
}
#dashboard > .metrics[data-dashboard-block="summary"] > article:nth-child(2)::before {
  color: var(--purple-primary);
  background: var(--purple-soft);
}
.badge.active,
.pill.active,
.status.active,
.tab.active,
.tabs button.active {
  background: var(--purple-soft) !important;
  color: var(--purple-dark) !important;
  border-color: var(--purple-border) !important;
}

/* Ranking de pacotes */
.package-ranking-card {
  background: linear-gradient(135deg, #fff 0%, #fbfaff 68%, #f5f3ff 100%);
  border-color: #e4def7;
}
.package-ranking-eyebrow { color: var(--purple-primary); }
.package-ranking-total {
  background: var(--purple-soft);
  color: var(--purple-dark);
}
.package-ranking-track span {
  background: linear-gradient(90deg, var(--purple-primary), #a855f7);
  box-shadow: 0 0 0 1px rgba(109,40,217,.08);
}

/* Tabelas, paginação e seleções */
table thead th {
  color: #4c1d95;
}
table tbody tr:hover {
  background: #faf8ff;
}
.pagination .active,
.pagination button.active,
.page-btn.active {
  background: var(--purple-primary) !important;
  border-color: var(--purple-primary) !important;
  color: #fff !important;
}

/* Modais e componentes flutuantes */
.modal h2,
.modal h3,
.drawer h2,
.drawer h3 {
  color: #4c1d95;
}
.modal .modal-head,
.drawer .drawer-head {
  border-bottom-color: #ede9fe;
}
.dropdown-item:hover,
.menu-item:hover,
.option:hover {
  background: var(--purple-softer) !important;
  color: var(--purple-dark) !important;
}

/* Mantém laranja apenas para ações comerciais estratégicas */
.new-reservation-btn,
[data-action="new-reservation"],
.btn-new-reservation {
  background: linear-gradient(135deg, #f97316, #ea580c) !important;
  border-color: #f97316 !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(249,115,22,.20) !important;
}

/* ================================================================
   V34.4.2 — MODAIS E CONTRATOS ACIMA DO CABEÇALHO
   Garante que a visualização do contrato e demais documentos
   cubram integralmente a barra superior enquanto estiverem abertos.
   ================================================================ */
.contract-editor {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2000000 !important;
  isolation: isolate;
  background: rgba(20, 24, 34, .58) !important;
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.contract-editor-panel {
  position: relative;
  z-index: 2 !important;
}

.contract-editor .contract-editor-actions,
.contract-editor .print-doc,
.contract-editor .contract-version-box {
  position: relative;
  z-index: 3;
}

/* Cabeçalho e menus permanecem abaixo de qualquer modal/documento. */
body:has(.contract-editor) .topbar,
body:has(.contract-editor) .sidebar,
body:has(.contract-editor) .notification-dropdown {
  z-index: 100 !important;
}

/* Fallback para todos os demais modais do sistema. */
.payment-modal:not(.hidden),
.modal:not(.hidden),
[aria-modal="true"]:not(.hidden) {
  z-index: 1500000 !important;
}

@media print {
  .contract-editor {
    z-index: auto !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

/* V34.5.0 - Termos digitais de decoracao */
.decoration-term-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(135deg,#fff 0%,#f5f3ff 100%);border-color:#ddd6fe}
.decoration-term-hero h2{margin:.35rem 0}.decoration-term-hero .eyebrow{color:#6d28d9;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.75rem}
.decoration-term-layout{align-items:start}.decoration-signature-box{border:1px solid #ddd6fe;background:#faf8ff;border-radius:16px;padding:16px;margin-top:6px}
.decoration-signature-box h3{margin-top:0}.decoration-term-list .item{border-left:4px solid #7c3aed}.decoration-term-list .term-meta{display:flex;gap:8px;flex-wrap:wrap;margin:.5rem 0}.decoration-term-list .term-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
@media(max-width:1100px){.decoration-term-layout{grid-template-columns:1fr!important}.decoration-term-hero{align-items:flex-start}}

/* V34.5.1 — Aprovação e assinatura do termo na Área do Cliente */
.decoration-client-signing-info { background: linear-gradient(135deg,#f5f3ff,#fff); border-color:#c4b5fd; }
.client-decoration-approvals { grid-column: 1 / -1; }
.client-decoration-term { display:block; }
.client-decoration-signature-form { margin-top:14px; padding:16px; border:1px solid #ddd6fe; border-radius:14px; background:#faf8ff; }
.client-decoration-signature-canvas { width:100%; height:190px; touch-action:none; background:#fff; border:2px dashed #c4b5fd; border-radius:12px; }
@media (max-width:720px){ .client-decoration-signature-form .two{grid-template-columns:1fr;} .client-decoration-signature-canvas{height:170px;} }

/* V34.7.0 — Central de Documentos */
.document-central{margin-top:20px;border:1px solid #e9e2ff;border-radius:22px;background:#fff;overflow:hidden;box-shadow:0 18px 45px rgba(76,29,149,.08)}
.document-central-head{display:flex;justify-content:space-between;gap:24px;padding:24px;background:linear-gradient(135deg,#faf8ff,#f3efff);border-bottom:1px solid #e9e2ff}.document-central-head h2{margin:4px 0 2px}.document-central-head .eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800;color:#6d28d9}
.document-central-metrics{display:grid;grid-template-columns:repeat(4,minmax(86px,1fr));gap:10px}.document-central-metrics article{min-width:92px;padding:12px 14px;border:1px solid #e4dcff;border-radius:15px;background:rgba(255,255,255,.86);text-align:center}.document-central-metrics strong{display:block;font-size:1.3rem;color:#4c1d95}.document-central-metrics span{font-size:.72rem;color:#6b7280}
.document-central-toolbar{padding:16px 20px;border-bottom:1px solid #eee8ff}.document-search{display:flex;align-items:center;gap:8px;border:1px solid #ddd6fe;border-radius:12px;padding:0 12px;background:#fff}.document-search input{width:100%;border:0!important;outline:0;padding:11px 0;background:transparent}.document-filters{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.document-filters button{border:1px solid #ddd6fe;background:#fff;color:#5b21b6;border-radius:999px;padding:7px 12px}.document-filters button.active{background:#6d28d9;color:#fff;border-color:#6d28d9}
.document-central-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;min-height:300px}.document-grid{padding:18px;display:grid;gap:12px;align-content:start}.document-card{display:flex;gap:14px;padding:16px;border:1px solid #ece7f8;border-radius:16px;background:#fff;transition:.18s ease}.document-card:hover{border-color:#c4b5fd;box-shadow:0 8px 24px rgba(76,29,149,.08);transform:translateY(-1px)}.document-card-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:#f5f3ff;font-size:1.35rem;flex:0 0 auto}.document-card-main{min-width:0;flex:1}.document-card-title{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.document-card-main small{display:block;margin-top:4px;color:#6b7280}.document-card-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.document-status{font-size:.7rem;font-weight:800;border-radius:999px;padding:4px 8px;white-space:nowrap;background:#f3f4f6;color:#4b5563}.document-status.signed{background:#dcfce7;color:#166534}.document-status.pending{background:#fef3c7;color:#92400e}.document-status.available{background:#ede9fe;color:#5b21b6}
.document-timeline{padding:20px;border-left:1px solid #eee8ff;background:#fcfbff}.document-timeline-title{margin-bottom:16px}.document-timeline-title strong,.document-timeline-title small{display:block}.document-timeline article{position:relative;display:flex;gap:10px;padding:0 0 18px}.document-timeline article:not(:last-child):after{content:"";position:absolute;left:10px;top:25px;bottom:2px;width:1px;background:#ddd6fe}.document-timeline article>span{position:relative;z-index:1;width:22px;height:22px;display:grid;place-items:center;background:#fcfbff;font-size:.9rem}.document-timeline article strong,.document-timeline article small{display:block}.document-timeline article strong{font-size:.84rem}.document-timeline article small{font-size:.72rem;color:#6b7280;margin-top:3px}
.document-empty-filter{padding:24px;text-align:center}.hidden{display:none!important}
@media(max-width:1050px){.document-central-head{flex-direction:column}.document-central-metrics{grid-template-columns:repeat(4,1fr)}.document-central-layout{grid-template-columns:1fr}.document-timeline{border-left:0;border-top:1px solid #eee8ff}}
@media(max-width:700px){.document-central-head{padding:18px}.document-central-metrics{grid-template-columns:repeat(2,1fr)}.document-central-toolbar{padding:14px}.document-grid{padding:12px}.document-card-title{flex-direction:column;gap:6px}.document-timeline{padding:16px}}


/* V34.7.2 — impressão fiel e visualização do contrato assinado */
.contract-print-frame{position:fixed!important;left:-10000px!important;top:0!important;width:794px!important;height:1123px!important;border:0!important;visibility:hidden!important;pointer-events:none!important}
.official-contract-signature{margin-top:32px;padding-top:22px;border-top:1px solid #a1a1aa;break-inside:avoid;page-break-inside:avoid;background:#fff}
.official-contract-signature h3{margin:0 0 14px}.official-contract-signature p{margin:5px 0}.official-contract-signature-image{display:block;max-width:280px;max-height:110px;object-fit:contain;margin:14px 0;border:0}
.official-contract-signature-missing{padding:18px;border:1px dashed #a1a1aa;border-radius:8px;margin:12px 0;color:#52525b}

/* Central de Diagnóstico V37.0.0 */
.diag-command-center{display:grid;gap:18px;margin-bottom:22px}.diag-health-grid{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:12px}.diag-health-card{border:1px solid var(--border,#e5e7eb);border-radius:16px;padding:16px;background:#fff;display:grid;gap:6px;box-shadow:0 8px 22px rgba(15,23,42,.05)}.diag-health-card span{font-size:12px;color:#64748b;text-transform:uppercase;font-weight:800;letter-spacing:.04em}.diag-health-card strong{font-size:19px;color:#0f172a}.diag-health-card small{color:#64748b}.diag-health-card.ok{border-left:4px solid #16a34a}.diag-health-card.warn{border-left:4px solid #d97706}.diag-health-card.bad{border-left:4px solid #dc2626}.diag-two-columns{display:grid;grid-template-columns:1fr 1fr;gap:16px}.diag-block{border:1px solid var(--border,#e5e7eb);border-radius:16px;padding:16px;background:#fff}.diag-block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.diag-block-head h3{margin:0}.diag-status-list,.diag-log-list{display:grid;gap:8px}.diag-status-row,.diag-log-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;background:#f8fafc;border:1px solid #eef2f7}.diag-status-row span:last-child,.diag-log-row span{color:#64748b;font-size:12px}.diag-dot{width:10px;height:10px;border-radius:50%;background:#94a3b8}.diag-dot.ok{background:#16a34a}.diag-dot.warn{background:#d97706}.diag-dot.bad{background:#dc2626}.diag-error{display:block}.diag-error summary{display:flex;justify-content:space-between;cursor:pointer}.diag-error p{color:#b91c1c}.diag-error code{display:block;white-space:pre-wrap;overflow-wrap:anywhere}.diag-legacy-title{display:flex;align-items:end;justify-content:space-between;border-top:1px solid #e5e7eb;padding-top:20px;margin:5px 0 14px}.diag-legacy-title span{color:#64748b;font-size:12px}@media(max-width:1200px){.diag-health-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.diag-health-grid{grid-template-columns:1fr 1fr}.diag-two-columns{grid-template-columns:1fr}}@media(max-width:480px){.diag-health-grid{grid-template-columns:1fr}}

/* Centro de Operações V38.0.0 */
.operations-center-view{--op-purple:#6d37e8;--op-green:#17a85b;--op-red:#dc3545;--op-amber:#df9a12}.operations-hero{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:26px 28px;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f4efff 100%);border:1px solid #e9e0ff;margin-bottom:18px}.operations-hero h2{font-size:32px;margin:5px 0}.operations-hero p{margin:0;color:#667085}.operations-eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:var(--op-purple)}.operations-hero-actions{display:flex;align-items:center;gap:14px}.operations-last-update{font-size:12px;color:#667085}.operations-health-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.operations-health{display:flex;gap:11px;align-items:center;padding:15px 17px;background:#fff;border:1px solid #e8eaf0;border-radius:17px}.operations-health>span{font-size:18px}.operations-health.ok>span{color:var(--op-green)}.operations-health.warn>span{color:var(--op-amber)}.operations-health small,.operations-health strong{display:block}.operations-health small{font-size:11px;text-transform:uppercase;color:#7b8494;font-weight:800}.operations-health strong{margin-top:2px}.operations-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.operations-kpi-card{font:inherit;text-align:left;appearance:none;width:100%;background:#fff;border:1px solid #e7e9ef;border-radius:20px;padding:20px;box-shadow:0 7px 24px rgba(26,35,58,.04);cursor:pointer;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;position:relative}.operations-kpi-card:hover,.operations-kpi-card:focus-visible{transform:translateY(-2px);border-color:#cdbffc;box-shadow:0 12px 30px rgba(56,37,103,.11);outline:none}.operations-kpi-card span,.operations-kpi-card small{display:block;color:#687386}.operations-kpi-card strong{display:block;font-size:28px;margin:7px 0;color:#182230}.operations-kpi-card small{font-size:12px}.operations-kpi-card em{display:block;margin-top:12px;font-style:normal;font-size:11px;font-weight:800;color:var(--op-purple)}.operations-kpi-card.urgent{border-top:4px solid var(--op-red)}.operations-kpi-card.important{border-top:4px solid var(--op-amber)}.operations-kpi-card.upcoming{border-top:4px solid var(--op-purple)}.operations-kpi-card.receivable{border-top:4px solid var(--op-green)}.operations-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}.operations-grid .panel{margin:0;min-width:0}.operations-list{display:grid;gap:9px}.operations-list-item{width:100%;border:1px solid #e8eaf0;background:#fafbfc;border-radius:15px;padding:13px 15px;display:grid;grid-template-columns:auto 1fr auto;gap:12px;text-align:left;align-items:center;color:#172033}.operations-list-item button{font:inherit}.operations-list-item:hover{border-color:#cfc2f8;background:#faf8ff}.operations-list-item.urgent{border-left:4px solid var(--op-red)}.operations-list-item.important{border-left:4px solid var(--op-amber)}.operations-list-item strong,.operations-list-item small,.operations-list-item em{display:block}.operations-list-item small{color:#687386;margin-top:3px}.operations-list-item em{font-style:normal;font-size:11px;color:var(--op-purple);margin-top:5px;font-weight:700}.operations-item-icon{width:34px;height:34px;border-radius:11px;background:#f0ebff;display:grid;place-items:center;font-weight:900;color:var(--op-purple)}.operations-date-box{width:45px;height:47px;border-radius:12px;background:#efe9ff;color:var(--op-purple);display:grid;place-content:center;text-align:center;line-height:1}.operations-date-box b{font-size:18px}.operations-date-box small{font-size:10px;text-transform:uppercase;margin-top:4px}.operations-list-item.timeline{cursor:default}.operations-list-item.timeline time{font-size:11px;color:#7b8494}.operations-empty{text-align:center;padding:30px 15px;border:1px dashed #dce0e8;border-radius:16px;color:#667085}.operations-empty strong,.operations-empty span{display:block}.operations-empty span{font-size:13px;margin-top:5px}.operations-finance-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.operations-finance-summary article{padding:18px;border-radius:16px;background:#f7f8fa;border:1px solid #e7e9ef}.operations-finance-summary span,.operations-finance-summary strong{display:block}.operations-finance-summary span{font-size:12px;color:#687386}.operations-finance-summary strong{font-size:21px;margin-top:7px}.operations-finance-summary article.danger{background:#fff4f5;border-color:#ffd5da}.operations-finance-summary article.danger strong{color:#c3293b}.operations-finance-summary article.ok{background:#f2fbf6;border-color:#caefd9}.operations-finance-summary article.ok strong{color:#138a4a}@media(max-width:1050px){.operations-health-strip,.operations-kpis{grid-template-columns:repeat(2,1fr)}.operations-grid{grid-template-columns:1fr}}@media(max-width:680px){.operations-hero{align-items:flex-start;flex-direction:column}.operations-hero-actions{width:100%;flex-direction:column;align-items:stretch}.operations-health-strip,.operations-kpis,.operations-finance-summary{grid-template-columns:1fr}.operations-hero h2{font-size:26px}}


/* V38.0.2 — cards acionáveis do Centro de Operações */
.operations-health,
#operationsFinanceSummary > button { cursor:pointer; text-align:left; font:inherit; }
.operations-health b { margin-left:auto; font-size:1.15rem; }
#operationsFinanceSummary > button { border:0; width:100%; }
#operationsFinanceSummary > button small { display:block; margin-top:.35rem; opacity:.72; font-weight:700; }
.operations-health:hover, #operationsFinanceSummary > button:hover, .operations-list-item:hover { transform:translateY(-1px); filter:brightness(.99); }
.operations-health:focus-visible, #operationsFinanceSummary > button:focus-visible, .operations-list-item:focus-visible { outline:3px solid rgba(109,40,217,.28); outline-offset:2px; }

.operations-detail-overlay{position:fixed;inset:0;background:rgba(17,24,39,.42);z-index:12000;display:flex;justify-content:flex-end;backdrop-filter:blur(2px)}.operations-detail-drawer{width:min(560px,94vw);height:100%;background:#fff;box-shadow:-18px 0 50px rgba(15,23,42,.2);display:flex;flex-direction:column;animation:operationsDrawerIn .2s ease}.operations-detail-head{padding:22px 24px 17px;border-bottom:1px solid #e8eaf0;display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.operations-detail-head h2{margin:0;font-size:23px;color:#172033}.operations-detail-head p{margin:5px 0 0;color:#687386;font-size:13px}.operations-detail-close{border:1px solid #e2e5eb;background:#fff;width:38px;height:38px;border-radius:12px;font-size:24px;cursor:pointer}.operations-detail-summary{display:flex;gap:10px;flex-wrap:wrap;padding:14px 24px;border-bottom:1px solid #edf0f4;background:#fafbfc}.operations-detail-summary span{padding:7px 10px;border-radius:999px;background:#f0ebff;color:#6330d5;font-size:12px;font-weight:800}.operations-detail-body{padding:18px 20px 28px;overflow:auto;display:grid;gap:10px}.operations-detail-body .operations-list-item{background:#fff}.operations-detail-footer{padding:14px 20px;border-top:1px solid #e8eaf0;display:flex;justify-content:flex-end;background:#fff}.operations-detail-footer button{border:0;border-radius:12px;padding:11px 16px;background:#6d37e8;color:#fff;font-weight:800;cursor:pointer}@keyframes operationsDrawerIn{from{transform:translateX(35px);opacity:.65}to{transform:translateX(0);opacity:1}}@media(max-width:680px){.operations-detail-drawer{width:100%}.operations-detail-head{padding:18px}.operations-detail-summary{padding:12px 18px}.operations-detail-body{padding:14px}}

/* V39.0.0 — Motor de Regras */
.automation-rules-view{display:none}.automation-rules-view.active{display:block}.automation-hero{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:28px;border:1px solid #e8ddff;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f8f3ff 100%);margin-bottom:18px}.automation-eyebrow{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6f2de1}.automation-hero h2{font-size:34px;margin:8px 0}.automation-hero p{margin:0;color:#64748b}.automation-hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:flex-end}.automation-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.automation-kpis article{background:#fff;border:1px solid #e6eaf0;border-radius:18px;padding:20px;box-shadow:0 8px 24px rgba(15,23,42,.04)}.automation-kpis span,.automation-kpis small{display:block;color:#64748b}.automation-kpis strong{display:block;font-size:28px;margin:8px 0;color:#182235}.automation-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:18px}.automation-history-panel{grid-column:1/-1}.automation-rules-list,.automation-findings-list,.automation-history-list{display:grid;gap:12px}.automation-rule-card{display:grid;grid-template-columns:auto auto 1fr auto;gap:14px;align-items:start;padding:17px;border:1px solid #e5e9f0;border-radius:16px;background:#fff}.automation-rule-card.inactive{opacity:.62}.automation-rule-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#f4edff;font-size:21px}.automation-rule-copy strong{font-size:16px}.automation-rule-copy p{margin:5px 0 12px;color:#64748b;font-size:13px;line-height:1.45}.automation-rule-config{display:flex;gap:12px;flex-wrap:wrap}.automation-rule-config label{display:flex;align-items:center;gap:7px;font-size:12px;color:#64748b}.automation-rule-config input,.automation-rule-config select{border:1px solid #dce2ea;border-radius:9px;padding:7px 9px;background:#fff}.automation-rule-config input{width:68px}.automation-rule-status{font-size:11px;font-weight:800;text-transform:uppercase;color:#6f2de1;background:#f4edff;padding:6px 9px;border-radius:999px}.automation-switch input{display:none}.automation-switch span{display:block;width:42px;height:24px;border-radius:99px;background:#cbd5e1;position:relative;cursor:pointer}.automation-switch span:after{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:white;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:.2s}.automation-switch input:checked+span{background:#6f2de1}.automation-switch input:checked+span:after{transform:translateX(18px)}.automation-finding{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:13px;align-items:center;text-align:left;border:1px solid #e5e9f0;border-left:4px solid #f59e0b;border-radius:15px;background:#fff;padding:15px;cursor:pointer}.automation-finding.critical{border-left-color:#dc2626}.automation-finding.high{border-left-color:#f59e0b}.automation-finding.medium{border-left-color:#2563eb}.automation-finding.low{border-left-color:#16a34a}.automation-finding-icon{width:38px;height:38px;display:grid;place-items:center;background:#f8fafc;border-radius:11px}.automation-finding strong,.automation-finding small,.automation-finding em{display:block}.automation-finding small{color:#64748b;margin-top:4px}.automation-finding em{font-style:normal;font-size:11px;font-weight:800;text-transform:uppercase;color:#7c3aed;margin-top:6px}.automation-history-row{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:13px 4px;border-bottom:1px solid #edf0f4}.automation-history-row>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#eafaf0;color:#16a34a}.automation-history-row small{display:block;color:#64748b;margin-top:3px}.automation-history-row time{color:#64748b;font-size:12px}.automation-empty{text-align:center;padding:34px 16px;color:#64748b}.automation-empty strong,.automation-empty span{display:block}.automation-empty strong{color:#334155;margin-bottom:5px}@media(max-width:1000px){.automation-kpis{grid-template-columns:repeat(2,1fr)}.automation-layout{grid-template-columns:1fr}.automation-history-panel{grid-column:auto}}@media(max-width:650px){.automation-hero{align-items:flex-start;flex-direction:column}.automation-hero-actions{justify-content:flex-start}.automation-kpis{grid-template-columns:1fr}.automation-rule-card{grid-template-columns:auto 1fr}.automation-rule-copy{grid-column:2}.automation-rule-status{grid-column:2}.automation-history-row{grid-template-columns:auto 1fr}.automation-history-row time{grid-column:2}}


/* Central de Tarefas V39.1.1 */
.tasks-center-view{display:none}.tasks-center-view.active{display:block}.tasks-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px;border:1px solid #e8ddff;border-radius:24px;background:linear-gradient(135deg,#fff 0%,#f8f3ff 100%);margin-bottom:18px}.tasks-eyebrow{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6f2de1}.tasks-hero h2{font-size:34px;margin:8px 0}.tasks-hero p{margin:0;color:#64748b}.tasks-hero-actions{display:flex;gap:10px;flex-wrap:wrap}.tasks-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.tasks-kpis button{appearance:none;text-align:left;background:#fff;border:1px solid #e6eaf0;border-radius:18px;padding:18px;box-shadow:0 8px 24px rgba(15,23,42,.04);cursor:pointer}.tasks-kpis button:hover{border-color:#b997ff;transform:translateY(-1px)}.tasks-kpis span,.tasks-kpis small{display:block;color:#64748b}.tasks-kpis strong{display:block;font-size:28px;margin:7px 0;color:#182235}.tasks-toolbar{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:18px;padding:15px}.tasks-toolbar label{display:grid;gap:6px;color:#64748b;font-size:12px}.tasks-toolbar label:first-child{flex:1;min-width:220px}.tasks-toolbar input,.tasks-toolbar select{min-height:40px;border:1px solid #dce2ea;border-radius:10px;padding:8px 10px;background:#fff}.tasks-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}.tasks-column{border:1px solid #e5e9f0;border-radius:18px;background:#f8fafc;min-height:360px;overflow:hidden}.tasks-column>header{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;background:#fff;border-bottom:1px solid #e5e9f0}.tasks-column>header>div{display:flex;align-items:center;gap:8px}.tasks-column>header b{background:#eef2f7;color:#475569;border-radius:999px;padding:4px 9px;font-size:12px}.tasks-dot{width:10px;height:10px;border-radius:50%;display:inline-block}.tasks-dot.open{background:#f59e0b}.tasks-dot.progress{background:#2563eb}.tasks-dot.done{background:#16a34a}.tasks-list{display:grid;gap:10px;padding:12px}.task-card{background:#fff;border:1px solid #e5e9f0;border-left:4px solid #94a3b8;border-radius:14px;padding:14px;box-shadow:0 5px 15px rgba(15,23,42,.04)}.task-card.critical{border-left-color:#dc2626}.task-card.high{border-left-color:#f59e0b}.task-card.medium{border-left-color:#2563eb}.task-card.low{border-left-color:#16a34a}.task-card.overdue{box-shadow:0 0 0 2px rgba(220,38,38,.08)}.task-card-head{display:flex;justify-content:space-between;gap:10px;align-items:start}.task-card h3{font-size:15px;margin:0;color:#1e293b}.task-priority{font-size:10px;font-weight:800;text-transform:uppercase;border-radius:999px;padding:4px 7px;background:#f1f5f9;color:#475569}.task-card p{font-size:12px;line-height:1.45;color:#64748b;margin:8px 0}.task-meta{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0}.task-meta span{font-size:11px;background:#f8fafc;border:1px solid #e9edf2;border-radius:8px;padding:5px 7px;color:#475569}.task-meta .task-overdue{background:#fff1f2;color:#be123c;border-color:#fecdd3}.task-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}.task-actions button{font-size:11px;padding:7px 9px;border-radius:8px}.task-empty{text-align:center;color:#94a3b8;padding:34px 10px;font-size:13px}.task-origin{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#7c3aed;font-weight:800}.task-done h3{text-decoration:line-through;color:#64748b}@media(max-width:1050px){.tasks-kpis{grid-template-columns:repeat(2,1fr)}.tasks-board{grid-template-columns:1fr}}@media(max-width:650px){.tasks-hero{align-items:flex-start;flex-direction:column}.tasks-kpis{grid-template-columns:1fr}.tasks-toolbar{display:grid}.tasks-toolbar label:first-child{min-width:0}}

/* V39.2.0 — conclusão do fluxo de automações e tarefas */
.tasks-intelligence-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:16px;margin:16px 0}
.tasks-intelligence-grid .panel{margin:0}
.tasks-summary-list,.tasks-sla-list{display:grid;gap:10px}
.tasks-summary-row,.tasks-sla-row{display:grid;grid-template-columns:minmax(120px,1fr) auto auto;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--border-color,#e6e6ef);border-radius:12px;background:var(--surface,#fff)}
.tasks-summary-row strong,.tasks-sla-row strong{font-size:14px}
.tasks-summary-row span,.tasks-sla-row span{font-size:12px;color:var(--muted,#69707d)}
.tasks-progress-track{height:7px;border-radius:999px;background:#ececf4;overflow:hidden;min-width:90px}
.tasks-progress-fill{height:100%;background:linear-gradient(90deg,#6d28d9,#9333ea);border-radius:inherit}
.task-sla{display:inline-flex;align-items:center;border-radius:999px;padding:4px 8px;font-size:11px;font-weight:800}
.task-sla.ok{background:#ecfdf3;color:#167342}.task-sla.attention{background:#fff7ed;color:#b45309}.task-sla.breached{background:#fff1f2;color:#be123c}.task-sla.done{background:#f0fdf4;color:#15803d}
.task-card.sla-breached{box-shadow:inset 4px 0 0 #e11d48}
.task-card.sla-attention{box-shadow:inset 4px 0 0 #f59e0b}
.tasks-empty-insight{padding:18px;text-align:center;color:var(--muted,#69707d);border:1px dashed var(--border-color,#ddd);border-radius:12px}
@media(max-width:900px){.tasks-intelligence-grid{grid-template-columns:1fr}.tasks-summary-row,.tasks-sla-row{grid-template-columns:1fr auto}.tasks-progress-track{grid-column:1/-1}}

/* V39.2.4 - carregamento visual dos calendários */
.calendar-loading {
  min-height: 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 24px;
  text-align: center;
  color: var(--muted);
  border: 1px solid var(--line);
  border-radius: 12px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 247, 252, .98));
}

.calendar-loading-logo {
  display: block;
  width: min(150px, 55%);
  max-height: 76px;
  object-fit: contain;
  margin-bottom: 6px;
}

.calendar-loading strong {
  color: var(--text);
  font-size: 1rem;
  line-height: 1.25;
}

.calendar-loading span {
  font-size: .84rem;
}

.calendar-loading-dots {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 18px;
  margin-top: 4px;
}

.calendar-loading-dots i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: .3;
  animation: calendar-loading-pulse 1.15s ease-in-out infinite;
}

.calendar-loading-dots i:nth-child(2) { animation-delay: .15s; }
.calendar-loading-dots i:nth-child(3) { animation-delay: .3s; }

@keyframes calendar-loading-pulse {
  0%, 70%, 100% { transform: translateY(0); opacity: .3; }
  35% { transform: translateY(-5px); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .calendar-loading-dots i { animation: none; opacity: .65; }
}

.guest-edit-button{min-width:58px;padding:6px 8px;font-size:.74rem}


/* V39.4.5 - botão de edição sempre visível ao lado do nome */
.guest-name-with-edit{display:flex;align-items:center;gap:8px;min-width:0}
.guest-name-with-edit>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.guest-inline-edit-button{border:1px solid #7c3aed;background:#f5f0ff;color:#5b21b6;border-radius:7px;padding:5px 8px;font-size:.7rem;font-weight:800;white-space:nowrap;cursor:pointer;flex:0 0 auto}
.guest-inline-edit-button:hover{background:#ede9fe}
@media(max-width:700px){.guest-inline-edit-button{font-size:0;padding:5px 7px}.guest-inline-edit-button::before{content:"✏️";font-size:.82rem}}

/* V39.4.8 - substituicao segura do arquivo vigente do contrato */
.contract-replace-option{display:flex;gap:10px;align-items:flex-start;margin:10px 0;padding:10px 12px;border:1px solid var(--border,#d9d9e3);border-radius:10px;background:rgba(124,58,237,.05);cursor:pointer}
.contract-replace-option input{margin-top:3px}
.contract-replace-option span{display:flex;flex-direction:column;gap:2px}
.contract-replace-option small{display:block;color:var(--muted,#667085)}
.document-status.current,.status-current{font-weight:700}

/* V40.1.15.3 — gestão visível do Clube Pura Magia */
#crmLoyaltyRulesSection .four {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
#crmLoyaltyRulesSection label small {
  display: block;
  margin-top: 6px;
}
.input-suffix {
  display: flex;
  align-items: center;
  gap: 8px;
}
.input-suffix input {
  flex: 1;
}
.input-suffix span {
  white-space: nowrap;
}
.crm-settings-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
}
.crm-settings-summary strong {
  width: 100%;
}
.crm-settings-summary span {
  font-size: 0.9rem;
}
@media (max-width: 1000px) {
  #crmLoyaltyRulesSection .four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  #crmLoyaltyRulesSection .four {
    grid-template-columns: 1fr;
  }
}