/* Qura unified visual identity — 2026-09
   This file is intentionally loaded last on every platform surface.
   It maps legacy platform tokens to the approved Qura identity without
   changing operational/status semantics in JavaScript. */

:root {
  --qura-primary: #D97706;
  --qura-primary-start: #F59E0B;
  --qura-primary-dark: #B45309;
  --qura-brown: #3B2415;
  --qura-background: #FFF7E6;
  --qura-surface: #FFFFFF;
  --qura-text: #1F2937;
  --qura-border: #E5E7EB;
  --qura-muted: #6B7280;
  --qura-muted-medium: #9CA3AF;
  --qura-danger: #EF4444;
  --qura-success: #22C55E;

  /* Compatibility aliases used by the legacy/customer/admin role CSS. */
  --q-primary: var(--qura-primary);
  --q-primary-dark: var(--qura-primary-dark);
  --q-primary-soft: #FFF0D2;
  --q-orange: var(--qura-primary);
  --q-orange-dark: var(--qura-primary-dark);
  --q-brown: var(--qura-brown);
  --q-brown-deep: #2B1A0F;
  --q-brown-soft: #F8EBDD;
  --q-cream: var(--qura-background);
  --q-cream-2: #FFFBF5;
  --q-cream-3: #FFFDF9;
  --q-white: var(--qura-surface);
  --q-text: var(--qura-text);
  --q-muted: var(--qura-muted);
  --q-muted-2: var(--qura-muted-medium);
  --q-border: var(--qura-border);
  --q-border-soft: rgba(229, 231, 235, .72);
  --q-success: var(--qura-success);
  --q-success-soft: #DCFCE7;
  --q-danger: var(--qura-danger);
  --q-red: var(--qura-danger);
  --q-red-soft: #FEF2F2;
  --q-warning: var(--qura-primary);
  --q-warning-soft: #FFF7ED;
  --q-gold: #F6D9AA;
  --q-gold-soft: #F6D9AA;
  --q-soft-gold: #F6D9AA;
}

body[data-qura-surface] {
  background: var(--qura-background);
  color: var(--qura-text);
  accent-color: var(--qura-primary);
}

body[data-qura-surface] :focus-visible {
  outline: 3px solid rgba(217, 119, 6, .28);
  outline-offset: 2px;
}

/* Official Qura logo treatment. Never recreate the mark in CSS/text. */
.qura-brand-logo,
body[data-qura-surface] .logo-image,
body[data-qura-surface] .login-logo img,
body[data-qura-surface] .partner-brand img,
body[data-qura-surface] .partner-login-logo img,
body[data-qura-surface] .partner-modal-logo img,
body[data-qura-surface] .logo,
body[data-qura-surface] .mini-logo {
  object-fit: contain;
  height: auto;
  filter: none;
}

.qura-brand-logo {
  width: 118px;
  max-width: 42vw;
  display: block;
}

/* Shared branded CTA treatment. Status-specific green/red controls remain
   untouched when they use dedicated status classes. */
body[data-qura-surface] .primary,
body[data-qura-surface] .partner-primary,
body[data-qura-surface] .btn.primary {
  background: linear-gradient(135deg, var(--qura-primary-start), var(--qura-primary));
  border-color: var(--qura-primary);
  color: #fff;
  box-shadow: 0 8px 22px rgba(217, 119, 6, .18);
}

body[data-qura-surface] .primary:hover,
body[data-qura-surface] .partner-primary:hover,
body[data-qura-surface] .btn.primary:hover {
  background: linear-gradient(135deg, var(--qura-primary), var(--qura-primary-dark));
}

body[data-qura-surface] input:focus,
body[data-qura-surface] textarea:focus,
body[data-qura-surface] select:focus {
  border-color: var(--qura-primary) !important;
  box-shadow: 0 0 0 3px rgba(217, 119, 6, .12) !important;
}

/* Customer */
body[data-qura-surface="customer"] .hero {
  background: linear-gradient(135deg, var(--qura-brown), #5A351F 55%, var(--qura-primary));
}

/* Partner / Courier / Manager headers */
body[data-qura-surface="partner"] .partner-topbar,
body[data-qura-surface="courier"] .topbar,
body[data-qura-surface="manager"] .topbar,
body[data-qura-surface="intelligence"] header {
  border-bottom-color: rgba(229, 231, 235, .9);
}

/* Support has a darker operational shell; keep the same Qura identity. */
body[data-qura-surface="support"] {
  background: #F9FAFB;
}
body[data-qura-surface="support"] .auth-screen {
  background: radial-gradient(circle at top, #FFFFFF 0, var(--qura-background) 60%, #F3F4F6 100%);
}
body[data-qura-surface="support"] .sidebar {
  background: var(--qura-brown);
}
body[data-qura-surface="support"] .primary,
body[data-qura-surface="support"] .send-btn,
body[data-qura-surface="support"] .btn {
  background: linear-gradient(135deg, var(--qura-primary-start), var(--qura-primary));
  color: #fff;
  border-color: var(--qura-primary);
}
body[data-qura-surface="support"] .ticket-card.active {
  border-right-color: var(--qura-primary);
  background: #FFF7ED;
}
body[data-qura-surface="support"] .agent .bubble,
body[data-qura-surface="support"] .mine {
  background: var(--qura-brown);
  color: #fff;
}
body[data-qura-surface="support"] .eyebrow,
body[data-qura-surface="support"] .ticket-no,
body[data-qura-surface="support"] .account-stat b,
body[data-qura-surface="support"] .agent-name {
  color: var(--qura-primary);
}
body[data-qura-surface="support"] .role-note {
  background: var(--qura-background);
  color: var(--qura-brown);
}

/* Intelligence uses the real logo, not a generated letter mark. */
body[data-qura-surface="intelligence"] .brand .qura-brand-logo {
  width: 86px;
  max-width: 28vw;
}

@media (max-width: 600px) {
  .qura-brand-logo { width: 94px; }
  body[data-qura-surface="intelligence"] .brand .qura-brand-logo { width: 72px; }
}