/*
 * ZeroDupe corporate blue-green brand system.
 * Loaded after the base and enterprise layers so one restrained palette is
 * applied consistently without changing an uploaded customer logo.
 */
:root {
  --primary: #0756D8;
  --primary-dark: #0648B8;
  --primary-soft: #EDF4FF;
  --blue: #0756D8;
  --accent: #5EEB72;
  --accent-strong: #20B557;
  --accent-dark: #0B7F3F;
  --accent-soft: #ECFDF1;
  --cyan: #12AFCB;
  --cyan-soft: #ECFBFE;
  --bg: #F4F7FB;
  --card: #FFFFFF;
  --text: #102033;
  --muted: #66758A;
  --muted-2: #94A3B8;
  --border: #DCE4EE;
  --border-strong: #C9D4E2;
  --unique: #20B557;
  --unique-soft: #ECFDF1;
  --duplicate: #F59E0B;
  --duplicate-soft: #FFF8E8;
  --danger: #D92D20;
  --danger-soft: #FEF3F2;
  --info-soft: #EDF4FF;
  --sidebar: #071A2F;
  --sidebar-text: #A9B8CB;
  --shadow-sm: 0 1px 2px rgba(16, 32, 51, .045);
  --shadow-md: 0 10px 26px rgba(16, 32, 51, .075);
  --shadow-lg: 0 22px 52px rgba(7, 26, 47, .15);
  --radius: 12px;
  --radius-sm: 8px;
  --focus-ring: 0 0 0 3px rgba(7, 86, 216, .12);
}

::selection {
  background: #CFE0FF;
  color: #063B91;
}

body,
.app-main,
.auth-page {
  background: var(--bg);
  color: var(--text);
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid #2D73E5;
  outline-offset: 2px;
}

/* Navigation and retained logo treatment */
.sidebar {
  background: var(--sidebar);
  border-right-color: #12304F;
  box-shadow: 8px 0 28px rgba(7, 26, 47, .08);
}

.sidebar .brand {
  border-bottom-color: rgba(187, 215, 241, .12);
}

.brand-mark {
  background: #0756D8;
  box-shadow: 0 8px 20px rgba(7, 86, 216, .28);
}

.brand-mark::after {
  border-top-color: var(--accent);
  border-bottom-color: var(--accent);
}

.brand-custom-logo {
  background: rgba(255, 255, 255, .96);
  border: 1px solid rgba(255, 255, 255, .18);
  padding: 2px;
}

.brand-copy strong,
.sidebar-user strong {
  color: #F7FAFD;
}

.brand-copy small,
.sidebar-user a span,
.sidebar-status span {
  color: #8296AE;
}

.nav-section {
  color: #71869F;
}

.nav-item {
  color: #A9B8CB;
}

.nav-item .icon {
  color: #8195AD;
}

.nav-item:hover {
  background: rgba(255, 255, 255, .055);
  color: #FFFFFF;
}

.nav-item.active {
  background: rgba(7, 86, 216, .24);
  color: #FFFFFF;
  box-shadow: inset 3px 0 var(--accent);
}

.nav-item.active .icon {
  color: #75EE86;
}

.sidebar-status {
  border-color: rgba(94, 235, 114, .16);
  background: rgba(94, 235, 114, .045);
}

.status-indicator {
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(94, 235, 114, .12);
}

.sidebar-status strong {
  color: #EAF3F8;
}

/* Header and page hierarchy */
.topbar {
  background: rgba(255, 255, 255, .96);
  border-bottom-color: var(--border);
  box-shadow: 0 1px 0 rgba(7, 26, 47, .015);
}

.topbar-context strong {
  color: #26394F;
}

.topbar-context i {
  background: var(--accent-strong);
}

.global-search {
  background: #F8FAFD;
  border-color: var(--border);
}

.global-search:focus-within {
  background: #FFFFFF;
  border-color: #72A1ED;
  box-shadow: var(--focus-ring);
}

.shortcut {
  background: #FFFFFF;
  border-color: var(--border);
  color: #8291A5;
}

.content {
  max-width: 1640px;
}

.page-title h1 {
  color: #0C1D31;
  font-weight: 720;
}

.page-title p {
  color: var(--muted);
}

.eyebrow,
.section-kicker,
.result-overline,
.text-link {
  color: var(--primary);
}

/* Buttons */
.btn {
  border-radius: 8px;
}

.btn-primary {
  background: var(--primary);
  color: #FFFFFF;
  box-shadow: 0 2px 6px rgba(7, 86, 216, .18);
}

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

.btn-accent {
  background: var(--accent);
  border-color: #45D95F;
  color: #06223B;
  box-shadow: 0 3px 9px rgba(32, 181, 87, .20);
}

.btn-accent:hover {
  background: #4CDD63;
  border-color: #35CB50;
  color: #041C31;
}

.btn-secondary {
  background: #FFFFFF;
  border-color: var(--border-strong);
  color: #34475B;
}

.btn-secondary:hover {
  background: #F7FAFD;
  border-color: #AEBCCD;
}

.btn-ghost:hover,
.icon-btn:hover,
.more-btn:hover {
  background: #EAF1F8;
  color: var(--primary);
}

.btn-danger {
  background: var(--danger);
}

/* Surfaces, metrics and charts */
.card,
.stat-card,
.summary-tile {
  border-color: var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.card-header {
  border-bottom-color: #ECF1F6;
}

.card-header h2,
.card-header h3,
.check-intro h2 {
  color: #13263B;
}

.stat-card {
  border-top: 2px solid var(--accent, var(--primary));
}

.stat-card::after {
  display: none;
}

.stat-icon {
  background: var(--accent-soft, var(--primary-soft));
  color: var(--accent, var(--primary));
}

.stat-value {
  color: #0B1D31;
}

.metric-tag {
  background: #F8FAFC;
  border-color: #E2E9F1;
  color: #65768A;
}

.activity-icon,
.record-icon,
.upload-icon,
.check-intro-icon {
  background: var(--primary-soft);
  color: var(--primary);
}

.progress-line,
.bar-track {
  background: #EAF0F6;
}

.progress-line i,
.bar-track i,
.progress-bar i {
  background: var(--bar, var(--primary));
}

.rate-ring {
  background: conic-gradient(var(--duplicate) var(--rate), #EAF0F6 0);
}

.segmented {
  background: #EDF2F7;
}

.segmented .active {
  color: #123150;
}

/* Forms, dropdowns and data tables */
.input,
.select,
.textarea,
.country-trigger {
  border-color: var(--border-strong);
  color: var(--text);
}

.input:focus,
.select:focus,
.textarea:focus,
.country-trigger:focus {
  border-color: #72A1ED;
  box-shadow: var(--focus-ring);
}

.input::placeholder,
.textarea::placeholder {
  color: #99A7B8;
}

.country-popover,
.dropdown-menu,
.modal,
.confirm-dialog {
  border-color: var(--border);
  box-shadow: var(--shadow-lg);
}

.country-options button:hover,
.country-options button[aria-selected="true"] {
  background: var(--primary-soft);
  color: #0648B8;
}

.data-table th {
  background: #F7F9FC;
  color: #607187;
  border-bottom-color: var(--border);
}

.data-table tbody tr:hover {
  background: #F7FAFD;
}

.table-toolbar,
.table-footer,
.form-actions {
  border-color: #E6EDF4;
}

/* Verification, import and settings workflows */
.type-option input:checked + label {
  background: var(--primary-soft);
  border-color: #72A1ED;
  color: #0648B8;
}

.check-security .icon {
  color: var(--accent-strong);
}

.result-placeholder-icon {
  background: #EDF2F7;
  color: #60758D;
}

.result-capabilities .icon {
  color: var(--accent-strong);
}

.result-state.unique .result-mark,
.success-hero .result-mark {
  background: var(--unique-soft);
  color: var(--unique);
}

.result-state.duplicate .result-mark {
  background: var(--duplicate-soft);
  color: #C96D05;
}

.upload-zone {
  background: #FAFCFE;
  border-color: #BFCEDF;
}

.upload-zone:hover,
.upload-zone.dragging {
  background: var(--primary-soft);
  border-color: #72A1ED;
}

.step.active::before {
  background: var(--primary);
  border-color: var(--primary);
}

.policy-card input:checked + label {
  background: #F2F7FF;
  border-color: #72A1ED;
  box-shadow: 0 0 0 2px rgba(7, 86, 216, .07);
}

.settings-nav a.active {
  background: var(--primary-soft);
  color: var(--primary);
}

.profile-summary {
  border-top-color: var(--primary);
}

.drawer-hero {
  background: #F7FAFD;
}

/* Authentication */
.auth-brand-panel {
  background: #071A2F;
  border-right: 1px solid #12304F;
}

.eyebrow-light,
.auth-brand-copy h1 em {
  color: #77ED87;
}

.auth-brand-copy p {
  color: #AFC0D2;
}

.auth-assurance {
  background: #173653;
  border-color: #173653;
}

.auth-assurance > div {
  background: #0B223B;
}

.auth-assurance > div > span {
  background: rgba(7, 86, 216, .22);
  color: #69A1FA;
}

.auth-assurance > div:nth-child(2) > span {
  background: rgba(94, 235, 114, .12);
  color: #77ED87;
}

.auth-assurance > div:nth-child(3) > span {
  background: rgba(18, 175, 203, .14);
  color: #5AD0E4;
}

.auth-assurance strong {
  color: #F5F9FC;
}

.auth-assurance small,
.auth-brand-panel .brand-subtitle {
  color: #91A5BB;
}

.auth-form-panel {
  background: #FFFFFF;
}

.auth-form-head h2 {
  color: #0C1D31;
}

.checkbox input {
  accent-color: var(--primary);
}

.error-code {
  color: #DDE8F8;
}

/* Feedback */
.toast-success,
.inline-alert.success {
  border-color: #B7E8C8;
}

.toast-success .toast-icon {
  color: var(--unique);
}

@media (max-width: 1100px) and (min-width: 769px) {
  .nav-item.active {
    box-shadow: inset 0 -2px var(--accent);
  }
}

@media (max-width: 768px) {
  .sidebar {
    box-shadow: 18px 0 42px rgba(7, 26, 47, .22);
  }

  .content {
    padding-top: 24px;
  }
}

@media (max-width: 480px) {
  .page-actions {
    gap: 8px;
  }

  .btn-accent {
    min-height: 46px;
  }
}