:root {
  /* Global Font Variables - Unified across all pages */
  --hig-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --hig-font-mono: ui-monospace, "SFMono-Regular", Menlo, Monaco, Consolas,
    "Liberation Mono", "Courier New", monospace;

  --hig-color-background: #f5f7fb;
  --hig-color-surface: #ffffff;
  --hig-color-surface-alt: #f9fbff;
  --hig-color-primary: #0071e3;
  --hig-color-primary-hover: #0a7ff0;
  --hig-color-secondary: #1c1c1e;
  --hig-color-accent: #34c759;
  --hig-color-border: #d6d9df;
  --hig-color-divider: rgba(60, 60, 67, 0.16);
  --hig-color-text: #1d1d1f;
  --hig-color-text-secondary: rgba(29, 29, 31, 0.7);
  --hig-color-text-muted: rgba(29, 29, 31, 0.55);
  --hig-color-warning: #ff9f0a;
  --hig-color-danger: #ff3b30;
  --hig-color-focus: rgba(0, 113, 227, 0.25);

  --hig-spacing-1: 4px;
  --hig-spacing-2: 8px;
  --hig-spacing-3: 12px;
  --hig-spacing-4: 16px;
  --hig-spacing-5: 24px;
  --hig-spacing-6: 32px;
  --hig-spacing-7: 40px;

  --hig-radius-small: 8px;
  --hig-radius-medium: 12px;
  --hig-radius-large: 20px;

  --hig-shadow-quiet: 0 6px 18px rgba(15, 23, 42, 0.08);
  --hig-shadow-elevated: 0 20px 40px rgba(15, 23, 42, 0.12);

  --hig-duration-fast: 160ms;
  --hig-duration-medium: 220ms;
  --hig-easing-standard: cubic-bezier(0.24, 0.82, 0.25, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --hig-color-background: #0f1012;
    --hig-color-surface: #18191b;
    --hig-color-surface-alt: #1f2023;
    --hig-color-primary: #0a84ff;
    --hig-color-primary-hover: #4094ff;
    --hig-color-border: rgba(255, 255, 255, 0.1);
    --hig-color-divider: rgba(255, 255, 255, 0.08);
    --hig-color-text: rgba(255, 255, 255, 0.92);
    --hig-color-text-secondary: rgba(235, 235, 245, 0.7);
    --hig-color-text-muted: rgba(235, 235, 245, 0.5);
    --hig-shadow-quiet: 0 16px 32px rgba(0, 0, 0, 0.32);
    --hig-shadow-elevated: 0 40px 80px rgba(0, 0, 0, 0.4);
  }
}

body.dark-theme {
  --hig-color-background: #0f1012;
  --hig-color-surface: #18191b;
  --hig-color-surface-alt: #1f2023;
  --hig-color-primary: #0a84ff;
  --hig-color-primary-hover: #4094ff;
  --hig-color-border: rgba(255, 255, 255, 0.1);
  --hig-color-divider: rgba(255, 255, 255, 0.08);
  --hig-color-text: rgba(255, 255, 255, 0.92);
  --hig-color-text-secondary: rgba(235, 235, 245, 0.7);
  --hig-color-text-muted: rgba(235, 235, 245, 0.5);
  --hig-shadow-quiet: 0 16px 32px rgba(0, 0, 0, 0.32);
  --hig-shadow-elevated: 0 40px 80px rgba(0, 0, 0, 0.4);
}

body.light-theme {
  --hig-color-background: #f5f7fb;
  --hig-color-surface: #ffffff;
  --hig-color-surface-alt: #f9fbff;
  --hig-color-primary: #0071e3;
  --hig-color-primary-hover: #0a7ff0;
  --hig-color-border: #d6d9df;
  --hig-color-divider: rgba(60, 60, 67, 0.16);
  --hig-color-text: #1d1d1f;
  --hig-color-text-secondary: rgba(29, 29, 31, 0.7);
  --hig-color-text-muted: rgba(29, 29, 31, 0.55);
  --hig-shadow-quiet: 0 6px 18px rgba(15, 23, 42, 0.08);
  --hig-shadow-elevated: 0 20px 40px rgba(15, 23, 42, 0.12);
}

body {
  font-family: var(--hig-font-sans);
  color: var(--hig-color-text);
  background: var(--hig-color-background);
}

.hig-page {
  display: flex;
  flex-direction: column;
  gap: var(--hig-spacing-6);
}

.hig-title {
  font-weight: 700;
  font-size: 34px;
  letter-spacing: -0.02em;
  color: var(--hig-color-text);
}

.hig-subtitle {
  color: var(--hig-color-text-secondary);
  font-size: 17px;
  font-weight: 500;
  margin-top: var(--hig-spacing-2);
}

.hig-card {
  border: none !important;
  border-radius: var(--hig-radius-large);
  background: var(--hig-color-surface);
  box-shadow: var(--hig-shadow-quiet);
  overflow: hidden;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.hig-card:hover {
  box-shadow: var(--hig-shadow-elevated);
  transform: translateY(-2px);
}

.hig-card > .card-header {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.05), transparent);
  border-bottom: 1px solid var(--hig-color-divider);
  padding: var(--hig-spacing-5);
}

.hig-card > .card-body {
  padding: var(--hig-spacing-5);
  display: flex;
  flex-direction: column;
  gap: var(--hig-spacing-4);
}

.hig-card .form-label,
.hig-card label {
  font-weight: 600;
  color: var(--hig-color-text-secondary);
  margin-bottom: var(--hig-spacing-2);
  font-size: 15px;
}

.hig-card textarea,
.hig-card input[type="text"],
.hig-card input[type="email"],
.hig-card select {
  border-radius: var(--hig-radius-medium);
  border: 1px solid var(--hig-color-border);
  padding: var(--hig-spacing-3) var(--hig-spacing-4);
  background: var(--hig-color-surface-alt);
  color: var(--hig-color-text);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.hig-card textarea:focus,
.hig-card input[type="text"]:focus,
.hig-card input[type="email"]:focus,
.hig-card select:focus {
  border-color: var(--hig-color-primary);
  box-shadow: 0 0 0 4px var(--hig-color-focus);
  outline: none;
}

.hig-toggle {
  display: flex;
  align-items: center;
  gap: var(--hig-spacing-2);
  margin-bottom: var(--hig-spacing-3);
}

.hig-toggle .form-check-input {
  width: 48px;
  height: 28px;
  border-radius: 999px;
  border: 1px solid var(--hig-color-border);
  background-color: rgba(118, 118, 128, 0.16);
  transition: background-color 0.25s ease, border-color 0.25s ease;
}

.hig-toggle .form-check-input:checked {
  background-color: var(--hig-color-primary);
  border-color: var(--hig-color-primary);
}

.hig-stack {
  display: flex;
  flex-direction: column;
  gap: var(--hig-spacing-4);
}

.hig-grid {
  display: grid;
  gap: var(--hig-spacing-4);
}

@media (min-width: 768px) {
  .hig-grid--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.hig-table {
  border-radius: var(--hig-radius-medium);
  overflow: hidden;
  border: 1px solid var(--hig-color-border);
}

.hig-table table {
  margin-bottom: 0;
  background: var(--hig-color-surface);
}

.hig-table thead {
  background: rgba(15, 23, 42, 0.04);
  color: var(--hig-color-text-secondary);
}

.hig-table th,
.hig-table td {
  padding: var(--hig-spacing-3) var(--hig-spacing-4);
  vertical-align: middle;
}

.hig-table tbody tr:hover {
  background: rgba(0, 113, 227, 0.04);
}

.hig-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--hig-spacing-1);
  padding: var(--hig-spacing-1) var(--hig-spacing-3);
  border-radius: 999px;
  background: rgba(0, 113, 227, 0.12);
  color: var(--hig-color-primary);
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.hig-footer-note {
  color: var(--hig-color-text-muted);
  font-size: 14px;
}

.btn.hig-primary {
  background: var(--hig-color-primary);
  border-color: var(--hig-color-primary);
  border-radius: 999px;
  padding: var(--hig-spacing-3) var(--hig-spacing-5);
  font-weight: 600;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.btn.hig-primary:hover {
  background: var(--hig-color-primary-hover);
  border-color: var(--hig-color-primary-hover);
  box-shadow: 0 10px 24px rgba(0, 113, 227, 0.25);
}

.btn.hig-ghost {
  border-radius: 999px;
  padding: var(--hig-spacing-3) var(--hig-spacing-5);
  border: 1px solid var(--hig-color-border);
  background: transparent;
  color: var(--hig-color-text-secondary);
}

.hig-section-helper {
  background: rgba(0, 113, 227, 0.08);
  border-radius: var(--hig-radius-medium);
  padding: var(--hig-spacing-3) var(--hig-spacing-4);
  color: var(--hig-color-text-secondary);
  font-size: 14px;
}

.hig-table caption {
  caption-side: top;
  padding: 0;
  margin-bottom: var(--hig-spacing-2);
  color: var(--hig-color-text-muted);
}

.hig-table .form-check-input {
  cursor: pointer;
  width: 42px;
  height: 22px;
}

.hig-modal .modal-dialog {
  transform: translateY(24px);
  opacity: 0;
  transition: transform var(--hig-duration-medium, 220ms) var(--hig-easing-standard, ease), opacity var(--hig-duration-medium, 220ms) var(--hig-easing-standard, ease);
  will-change: transform, opacity;
}

.hig-modal.show .modal-dialog {
  transform: translateY(0);
  opacity: 1;
}

.hig-modal .modal-content {
  border-radius: var(--hig-radius-medium);
  border: 1px solid var(--hig-color-border);
  box-shadow: var(--hig-shadow-elevated);
}

body.dark-theme .hig-modal .modal-content {
  background: var(--hig-color-surface-alt);
  border-color: var(--hig-color-border);
}

@media (prefers-reduced-motion: reduce) {
  .hig-modal .modal-dialog {
    transition: none;
    transform: none !important;
  }
}

.bulk-actions-bar {
  background: var(--hig-color-surface);
  border-top: 1px solid var(--hig-color-divider);
  box-shadow: var(--hig-shadow-quiet);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  /* Removido transform e transition para prevenir piscar/movimento */
  display: none;
}

.bulk-actions-bar.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  display: block;
}

body.dark-theme .bulk-actions-bar {
  background: var(--hig-color-surface-alt);
  border-top-color: var(--hig-color-border);
  box-shadow: var(--hig-shadow-elevated);
}

body.dark-theme .bulk-actions-bar {
  background: var(--hig-color-surface-alt);
  border-top-color: var(--hig-color-border);
  box-shadow: var(--hig-shadow-elevated);
}

@media (prefers-reduced-motion: reduce) {
  .bulk-actions-bar {
    transition: none;
  }
}