/* DCC_WHITE_LABEL_CORE_R1
   Shared visual core for DCC white-label applications.
   Brand values are injected by dcc-theme-config-v1.js.
*/
:root {
  --dcc-bg: #f4f8ff;
  --dcc-surface: #ffffff;
  --dcc-surface-soft: #f8fbff;
  --dcc-surface-muted: #eef4fb;
  --dcc-line: #dce6f2;
  --dcc-line-strong: #cbd8e8;
  --dcc-text: #16243a;
  --dcc-muted: #66758a;
  --dcc-primary: #1769e0;
  --dcc-primary-hover: #0f56bd;
  --dcc-primary-strong: #0c438f;
  --dcc-primary-soft: #e8f2ff;
  --dcc-data-blue: #4f8fd3;
  --dcc-success: #138a5b;
  --dcc-warning: #c38322;
  --dcc-danger: #c64655;
  --dcc-info: #3f7fc7;
  --dcc-radius-sm: 9px;
  --dcc-radius: 14px;
  --dcc-radius-lg: 18px;
  --dcc-shadow: 0 9px 30px rgba(34, 69, 111, .075);
  --dcc-shadow-soft: 0 3px 14px rgba(34, 69, 111, .055);
  --dcc-font-ui: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

html[data-dcc-theme="r1"] {
  color-scheme: light;
  --bg: var(--dcc-bg);
  --surface: var(--dcc-surface);
  --panel: var(--dcc-surface);
  --panel-2: var(--dcc-surface-soft);
  --panel-3: var(--dcc-surface-muted);
  --line: var(--dcc-line);
  --line-soft: var(--dcc-line);
  --text: var(--dcc-text);
  --muted: var(--dcc-muted);
  --faint: var(--dcc-muted);
  --red: var(--dcc-primary);
  --red-strong: var(--dcc-primary-hover);
  --red-dark: var(--dcc-primary-strong);
  --red-soft: var(--dcc-primary-soft);
  --green: var(--dcc-success);
  --yellow: var(--dcc-warning);
  --blue: var(--dcc-data-blue);
  --danger: var(--dcc-danger);
}

html[data-dcc-theme="r1"],
html[data-dcc-theme="r1"] body {
  background: var(--dcc-bg) !important;
  color: var(--dcc-text) !important;
  font-family: var(--dcc-font-ui) !important;
}

html[data-dcc-theme="r1"] body,
html[data-dcc-theme="r1"] .app-shell,
html[data-dcc-theme="r1"] .workspace,
html[data-dcc-theme="r1"] .setup-shell,
html[data-dcc-theme="r1"] main {
  background-color: var(--dcc-bg) !important;
}

html[data-dcc-theme="r1"] h1,
html[data-dcc-theme="r1"] h2,
html[data-dcc-theme="r1"] h3,
html[data-dcc-theme="r1"] h4,
html[data-dcc-theme="r1"] strong,
html[data-dcc-theme="r1"] label {
  color: var(--dcc-text);
}

html[data-dcc-theme="r1"] p,
html[data-dcc-theme="r1"] small,
html[data-dcc-theme="r1"] .muted,
html[data-dcc-theme="r1"] .subtitle,
html[data-dcc-theme="r1"] .page-subtitle,
html[data-dcc-theme="r1"] .setup-subtitle {
  color: var(--dcc-muted) !important;
}

/* Shells */
html[data-dcc-theme="r1"] .sidebar,
html[data-dcc-theme="r1"] .topbar,
html[data-dcc-theme="r1"] .setup-sidebar,
html[data-dcc-theme="r1"] .setup-topbar,
html[data-dcc-theme="r1"] .setup-footer,
html[data-dcc-theme="r1"] .mobile-nav {
  background: rgba(255,255,255,.97) !important;
  border-color: var(--dcc-line) !important;
  color: var(--dcc-text) !important;
  box-shadow: none;
}

html[data-dcc-theme="r1"] .topbar,
html[data-dcc-theme="r1"] .setup-topbar {
  box-shadow: 0 1px 0 var(--dcc-line), 0 8px 30px rgba(40,70,105,.035) !important;
}

html[data-dcc-theme="r1"] .sidebar-brand,
html[data-dcc-theme="r1"] .brand-block,
html[data-dcc-theme="r1"] .sidebar-user {
  border-color: var(--dcc-line) !important;
}

html[data-dcc-theme="r1"] .sidebar-brand strong,
html[data-dcc-theme="r1"] .brand-block strong {
  color: var(--dcc-text) !important;
}

html[data-dcc-theme="r1"] .sidebar-brand small,
html[data-dcc-theme="r1"] .brand-block small {
  color: var(--dcc-muted) !important;
}

/* Navigation */
html[data-dcc-theme="r1"] .nav-item,
html[data-dcc-theme="r1"] .mobile-nav button,
html[data-dcc-theme="r1"] .setup-step {
  color: var(--dcc-muted) !important;
  border-color: transparent !important;
}

html[data-dcc-theme="r1"] .nav-item:hover,
html[data-dcc-theme="r1"] .nav-item.active,
html[data-dcc-theme="r1"] .mobile-nav button.active,
html[data-dcc-theme="r1"] .setup-step.active {
  background: var(--dcc-primary-soft) !important;
  color: var(--dcc-primary) !important;
  -webkit-text-fill-color: var(--dcc-primary) !important;
}

/* Surfaces */
html[data-dcc-theme="r1"] .card,
html[data-dcc-theme="r1"] .kpi,
html[data-dcc-theme="r1"] .metric,
html[data-dcc-theme="r1"] .market-card,
html[data-dcc-theme="r1"] .check-card,
html[data-dcc-theme="r1"] .mapping-panel,
html[data-dcc-theme="r1"] .integration-detail-top,
html[data-dcc-theme="r1"] .directory-empty.compact,
html[data-dcc-theme="r1"] .modal,
html[data-dcc-theme="r1"] .modal-card,
html[data-dcc-theme="r1"] .drawer,
html[data-dcc-theme="r1"] .drawer-panel,
html[data-dcc-theme="r1"] .auth-panel,
html[data-dcc-theme="r1"] .panel,
html[data-dcc-theme="r1"] article.card,
html[data-dcc-theme="r1"] section.card {
  background: var(--dcc-surface) !important;
  color: var(--dcc-text) !important;
  border-color: var(--dcc-line) !important;
  border-radius: var(--dcc-radius) !important;
  box-shadow: var(--dcc-shadow-soft) !important;
}

html[data-dcc-theme="r1"] .mapping-row,
html[data-dcc-theme="r1"] .directory-type,
html[data-dcc-theme="r1"] .upload-zone,
html[data-dcc-theme="r1"] .list-row,
html[data-dcc-theme="r1"] .table-wrap {
  background: var(--dcc-surface-soft) !important;
  border-color: var(--dcc-line) !important;
  color: var(--dcc-text) !important;
}

/* Controls */
html[data-dcc-theme="r1"] input,
html[data-dcc-theme="r1"] select,
html[data-dcc-theme="r1"] textarea,
html[data-dcc-theme="r1"] .directory-search {
  background: var(--dcc-surface) !important;
  color: var(--dcc-text) !important;
  border-color: var(--dcc-line-strong) !important;
  border-radius: var(--dcc-radius-sm) !important;
}

html[data-dcc-theme="r1"] input:focus,
html[data-dcc-theme="r1"] select:focus,
html[data-dcc-theme="r1"] textarea:focus,
html[data-dcc-theme="r1"] .directory-search:focus-within {
  border-color: var(--dcc-primary) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--dcc-primary) 13%, transparent) !important;
  outline: 0 !important;
}

html[data-dcc-theme="r1"] .btn,
html[data-dcc-theme="r1"] button.btn,
html[data-dcc-theme="r1"] .button {
  border-radius: 10px !important;
  border-color: var(--dcc-line-strong) !important;
  background: var(--dcc-surface) !important;
  color: var(--dcc-text) !important;
  box-shadow: none !important;
}

html[data-dcc-theme="r1"] .btn.primary,
html[data-dcc-theme="r1"] .button.primary,
html[data-dcc-theme="r1"] button.primary:not(.nav-item) {
  background: var(--dcc-primary) !important;
  border-color: var(--dcc-primary) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

html[data-dcc-theme="r1"] .btn.primary:hover,
html[data-dcc-theme="r1"] .button.primary:hover,
html[data-dcc-theme="r1"] button.primary:not(.nav-item):hover {
  background: var(--dcc-primary-hover) !important;
  border-color: var(--dcc-primary-hover) !important;
}

html[data-dcc-theme="r1"] .btn.success,
html[data-dcc-theme="r1"] .button.success {
  background: color-mix(in srgb, var(--dcc-success) 10%, #fff) !important;
  border-color: color-mix(in srgb, var(--dcc-success) 35%, var(--dcc-line)) !important;
  color: var(--dcc-success) !important;
}

html[data-dcc-theme="r1"] .btn.danger,
html[data-dcc-theme="r1"] .button.danger {
  background: color-mix(in srgb, var(--dcc-danger) 9%, #fff) !important;
  border-color: color-mix(in srgb, var(--dcc-danger) 35%, var(--dcc-line)) !important;
  color: var(--dcc-danger) !important;
}

/* Tables */
html[data-dcc-theme="r1"] table,
html[data-dcc-theme="r1"] th,
html[data-dcc-theme="r1"] td {
  border-color: var(--dcc-line) !important;
}
html[data-dcc-theme="r1"] th {
  color: var(--dcc-muted) !important;
  background: var(--dcc-surface-soft) !important;
}
html[data-dcc-theme="r1"] td { color: var(--dcc-text) !important; }
html[data-dcc-theme="r1"] tbody tr:hover { background: var(--dcc-primary-soft) !important; }

/* Authentication */
html[data-dcc-theme="r1"] .auth-screen,
html[data-dcc-theme="r1"] .access-shell {
  background: var(--dcc-bg) !important;
}

html[data-dcc-theme="r1"] .auth-visual,
html[data-dcc-theme="r1"] .visual-side {
  background:
    radial-gradient(circle at 32% 30%, color-mix(in srgb, var(--dcc-primary) 16%, transparent), transparent 34%),
    linear-gradient(145deg, var(--dcc-primary-soft), #fff 68%) !important;
  border-color: var(--dcc-line) !important;
}

html[data-dcc-theme="r1"] .auth-brand strong,
html[data-dcc-theme="r1"] .hero-brand strong,
html[data-dcc-theme="r1"] .hero-caption strong {
  color: var(--dcc-text) !important;
}

html[data-dcc-theme="r1"] .auth-brand small,
html[data-dcc-theme="r1"] .hero-brand span,
html[data-dcc-theme="r1"] .hero-caption span {
  color: var(--dcc-muted) !important;
}

html[data-dcc-theme="r1"] .auth-footer {
  background: rgba(255,255,255,.96) !important;
  color: var(--dcc-muted) !important;
  border-color: var(--dcc-line) !important;
}

html[data-dcc-theme="r1"] .auth-avatar,
html[data-dcc-theme="r1"] .setup-avatar,
html[data-dcc-theme="r1"] .brand-avatar,
html[data-dcc-theme="r1"] .mini-avatar {
  border-color: var(--dcc-primary) !important;
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--dcc-primary) 9%, transparent) !important;
}

/* ASIE R27 shell */
html[data-dcc-theme="r1"] body #asieR27Nav.asie-r27-nav {
  background: rgba(255,255,255,.985) !important;
  color: var(--dcc-text) !important;
  border-right-color: var(--dcc-line) !important;
  box-shadow: 12px 0 30px rgba(32,64,102,.055) !important;
}

html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-brand {
  border-bottom-color: var(--dcc-line) !important;
}

html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-mark,
html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-toggle,
html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-assistant {
  background: var(--dcc-surface-soft) !important;
  color: var(--dcc-text) !important;
  -webkit-text-fill-color: var(--dcc-text) !important;
  border-color: var(--dcc-line-strong) !important;
}

html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-brandtext strong,
html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-label,
html[data-dcc-theme="r1"] body #asieR27Nav a,
html[data-dcc-theme="r1"] body #asieR27Nav button {
  color: var(--dcc-text) !important;
  -webkit-text-fill-color: var(--dcc-text) !important;
}

html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-brandtext small,
html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-role,
html[data-dcc-theme="r1"] body #asieR27Nav .asie-r27-group-title {
  color: var(--dcc-muted) !important;
  -webkit-text-fill-color: var(--dcc-muted) !important;
}

html[data-dcc-theme="r1"] body #asieR27Nav a:hover,
html[data-dcc-theme="r1"] body #asieR27Nav button:hover,
html[data-dcc-theme="r1"] body #asieR27Nav .active,
html[data-dcc-theme="r1"] body #asieR27Nav [aria-current="page"] {
  background: var(--dcc-primary-soft) !important;
  color: var(--dcc-primary) !important;
  -webkit-text-fill-color: var(--dcc-primary) !important;
}

/* Product personality */
html[data-dcc-product="asie"] {
  --dcc-product-accent: var(--dcc-info);
}
html[data-dcc-product="vynny"] {
  --dcc-product-accent: var(--dcc-primary);
}
html[data-dcc-product="asie"] .automatic-discovery-card::after,
html[data-dcc-product="asie"] .badge.intelligence,
html[data-dcc-product="asie"] [data-intelligence-badge] {
  color: var(--dcc-product-accent) !important;
  border-color: color-mix(in srgb, var(--dcc-product-accent) 35%, var(--dcc-line)) !important;
  background: color-mix(in srgb, var(--dcc-product-accent) 8%, #fff) !important;
}

/* Scrollbars */
html[data-dcc-theme="r1"] * {
  scrollbar-color: var(--dcc-line-strong) transparent;
}
html[data-dcc-theme="r1"] *::-webkit-scrollbar { width: 10px; height: 10px; }
html[data-dcc-theme="r1"] *::-webkit-scrollbar-thumb { background: var(--dcc-line-strong); border-radius: 99px; border: 2px solid transparent; background-clip: padding-box; }

@media (max-width: 760px) {
  html[data-dcc-theme="r1"] .card,
  html[data-dcc-theme="r1"] .kpi,
  html[data-dcc-theme="r1"] .metric,
  html[data-dcc-theme="r1"] .market-card {
    border-radius: 12px !important;
  }
}