/* Wigope design tokens — aligned with Wigope_website (orange #dd5511, gray-900 text, Poppins) */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap");

:root {
  --wigope-orange: #dd5511;
  --wigope-orange-hover: #c44a0e;
  --wigope-orange-soft: rgba(221, 85, 17, 0.1);
  --wigope-orange-ring: rgba(221, 85, 17, 0.15);
  --wigope-ink: #111827;
  --wigope-heading: #171717;
  --wigope-muted: #6b7280;
  --wigope-muted-2: #4b5563;
  --wigope-paper: #f9fafb;
  --wigope-line: #e5e7eb;
  --wigope-white: #ffffff;
  --wigope-nav-glass: rgba(255, 255, 255, 0.55);
  --wigope-nav-border: rgba(255, 255, 255, 0.3);
  --wigope-shadow-nav: 0 4px 16px rgba(0, 0, 0, 0.05);

  --primary: var(--wigope-orange);
  --primary-dark: var(--wigope-orange-hover);
  --primary-light: #f0895c;
  --primary-glow: var(--wigope-orange-ring);
  --dark: var(--wigope-ink);
  --dark-soft: #1f2937;
  --dark-lighter: #374151;
  --pi-primary: var(--wigope-orange);
  --pi-primary-hover: var(--wigope-orange-hover);
  --pi-primary-light: var(--wigope-orange-soft);
  --pi-dark: var(--wigope-ink);
  --pi-dark-hover: #1f2937;
  --pi-bg: var(--wigope-paper);
  --v2-ink: var(--wigope-ink);
  --v2-green: var(--wigope-orange);
  --v2-lime: var(--wigope-orange);
  --v2-paper: var(--wigope-paper);
  --v2-line: var(--wigope-line);
  --v2-muted: var(--wigope-muted);
}

body,
body.auth-page,
body.dashboard-body,
body.payment-body,
.admin-body {
  font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  color: var(--wigope-ink);
}

/* Retail Connect logo image (primary brand mark) */
.wigope-logo-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}

.wigope-logo--header {
  max-height: 48px;
  width: auto;
}

.wigope-logo--header-dark,
.wigope-logo--footer {
  max-height: 52px;
  width: auto;
}

.wigope-logo--sidebar {
  max-height: 54px;
  width: auto;
}

.wigope-logo--auth {
  max-width: min(280px, 88vw);
  margin: 0 auto 10px;
}

.wigope-logo--compact {
  max-height: 36px;
  width: auto;
}

a.brand .wigope-logo-img,
a.logo-link .wigope-logo-img {
  pointer-events: none;
}

.auth-brand .brand-icon,
.login-card .logo-icon {
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 auto 12px !important;
  display: block !important;
}

.auth-brand .brand-icon img,
.login-card .logo-icon img {
  margin: 0 auto;
}

.admin-sidebar .sidebar-brand {
  flex-wrap: wrap;
}

/* Legacy text wordmark (unused when image logo is included) */
.wigope-wordmark {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.05;
  letter-spacing: -0.03em;
  text-decoration: none;
  color: inherit;
}

.wigope-wordmark__brand {
  font-weight: 800;
  font-size: 1.125rem;
  color: var(--wigope-heading, #171717);
}

.wigope-wordmark__product {
  font-weight: 600;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--wigope-orange);
  margin-top: 2px;
}

.wigope-wordmark--header .wigope-wordmark__brand {
  font-size: 1.25rem;
}

.wigope-wordmark--header-dark .wigope-wordmark__brand,
.wigope-wordmark--footer .wigope-wordmark__brand {
  color: #f9fafb;
}

.wigope-wordmark--header-dark .wigope-wordmark__product,
.wigope-wordmark--footer .wigope-wordmark__product {
  color: #ffb088;
}

.wigope-wordmark--sidebar {
  align-items: flex-start;
}

.wigope-wordmark--sidebar .wigope-wordmark__brand {
  font-size: 1rem;
  font-weight: 500;
  color: var(--wm-primary, hsl(25, 100%, 50%));
}

.wigope-wordmark--sidebar .wigope-wordmark__product {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: var(--wm-fg, hsl(0, 0%, 3.9%));
}

.wigope-wordmark--auth {
  align-items: center;
  text-align: center;
  margin: 0 auto 6px;
}

.wigope-wordmark--auth .wigope-wordmark__brand {
  font-size: 1.45rem;
}

.wigope-wordmark--auth .wigope-wordmark__product {
  font-size: 0.75rem;
  margin-top: 4px;
}

a.brand .wigope-wordmark,
a.logo-link .wigope-wordmark,
.navbar-brand .wigope-wordmark {
  pointer-events: none;
}

.admin-sidebar {
  background: linear-gradient(180deg, #1f2937, #111827) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* Merchant sidebar theming: assets/css/merchant-shell.css */

.sidebar-logo .logo-link {
  align-items: center;
  gap: 10px;
}

.sidebar-logo .logo-text {
  font-weight: 700;
  font-size: 13px;
  line-height: 1.25;
  color: #111827 !important;
}

.admin-sidebar .nav-link.active {
  background: var(--wigope-orange-soft) !important;
  border-color: rgba(221, 85, 17, 0.35) !important;
  color: #ffb088 !important;
}

.btn-primary-custom,
.btn-auth-primary,
.btn-pi-primary,
.checkout-button,
.btn-success-custom {
  background: var(--wigope-orange) !important;
  border-color: var(--wigope-orange) !important;
  color: #fff !important;
}

.btn-primary-custom:hover,
.btn-auth-primary:hover,
.btn-pi-primary:hover,
.checkout-button:hover {
  background: var(--wigope-orange-hover) !important;
  border-color: var(--wigope-orange-hover) !important;
}

.form-control-custom:focus,
.form-select:focus,
.form-control:focus,
.auth-form .form-control:focus {
  border-color: var(--wigope-orange) !important;
  box-shadow: 0 0 0 3px var(--wigope-orange-ring) !important;
}

body:not(.dashboard-body) .stat-card:before {
  background: linear-gradient(90deg, var(--wigope-orange), #f0895c) !important;
}

body.auth-page {
  background: linear-gradient(145deg, #f9fafb 0%, #fff 35%, #fef3eb 100%) !important;
}

.auth-card {
  border: 1px solid var(--wigope-line) !important;
  box-shadow: 0 25px 60px rgba(17, 24, 39, 0.08) !important;
}

.auth-brand .brand-icon {
  background: transparent !important;
  box-shadow: none !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
}

.auth-brand h1 span {
  color: var(--wigope-orange) !important;
}

.auth-checkbox .checkmark {
  border-color: var(--wigope-orange) !important;
}

.auth-checkbox input:checked + .checkmark {
  background: var(--wigope-orange) !important;
  border-color: var(--wigope-orange) !important;
}

.payment-body {
  background: var(--wigope-paper) !important;
  background-image: linear-gradient(to right, rgba(17, 24, 39, 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(17, 24, 39, 0.06) 1px, transparent 1px) !important;
  background-size: 44px 44px !important;
}

.particle {
  display: none !important;
}

.admin-sidebar .sidebar-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 1rem 1.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.admin-sidebar .brand-info span {
  color: #9ca3af;
  font-size: 11px;
  display: block;
  margin-top: 6px;
}

/* Remove legacy green/lime brand surfaces — Wigope orange + neutral UI only */
.btn-lime,
.btn-success:not(.btn-outline-success),
.btn-success-custom {
  background: var(--wigope-orange) !important;
  border-color: var(--wigope-orange) !important;
  color: #fff !important;
}

.btn-lime:hover,
.btn-success:not(.btn-outline-success):hover {
  background: var(--wigope-orange-hover) !important;
  border-color: var(--wigope-orange-hover) !important;
}

.stat-icon.lime,
.bg-lime-soft,
.text-lime,
.badge.bg-success-subtle.text-success {
  background: var(--wigope-orange-soft) !important;
  color: var(--wigope-orange) !important;
}

.dashboard-sidebar,
.admin-sidebar,
.sidebar-menu-link:hover {
  background-image: none;
}

.admin-sidebar .nav-link.active {
  color: var(--wigope-orange) !important;
}

.badge-success,
.status-success,
.text-success:not(.form-text) {
  color: #b45309 !important;
}

.bg-success,
.alert-success {
  background-color: #fff7ed !important;
  border-color: #fed7aa !important;
  color: #9a3412 !important;
}

#settingsTabs.settings-tabs .nav-link:hover {
  border-color: #fdba74 !important;
  background: #fff7ed !important;
  color: var(--wigope-orange) !important;
}

#settingsTabs.settings-tabs .nav-link.active {
  border-color: #fdba74 !important;
  background: linear-gradient(135deg, #fff7ed, #fff) !important;
  color: var(--wigope-orange) !important;
  box-shadow: 0 0 0 2px rgba(221, 85, 17, 0.15) !important;
}