/* UniChina brand book v1.0 (Aug 2026) — CRM + surveys only.
   Source: Бренд-бук ЮниЧайна.pdf. Do not load on the HTML marketing site.

   Palette: blue leads #0883FF, pink marks #EC1B7A, red = pain/risk #FF2D55.
   Type: Wix Madefor Display + Text (named in the book; Google Fonts URL from the book).
   Logo: /static/brand/logo-unichina.svg lockup, min height 20px, no stretch/recolor/shadow.
   Radii: chips 999px, cards 22px, FAQ 16px, inserts 14px.
   Shadows: card 0 20px 44px -30px rgba(20,23,31,.22). */

@import url("https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400;500;600;700;800&family=Wix+Madefor+Text:wght@400;500;600;700&display=swap");

:root {
    --uc-blue: #0883FF;
    --uc-pink: #EC1B7A;
    --uc-graphite: #14171F;
    --uc-negative: #FF2D55;
    --uc-negative-light: #FF5C7A;
    --uc-blue-light: #4DA9FF;
    --uc-blue-hover: #0059C9;
    --uc-text: #232733;
    --uc-text-secondary: #4A5261;
    --uc-caption: #7A8494;
    --uc-service: #8A94A6;
    --uc-inactive-outline: #B9C2CF;
    --uc-inactive-line: #DDE3EC;
    --uc-card-border: #E3E9F2;
    --uc-separator: #E9EEF5;
    --uc-pain-border: #F3D0D8;
    --uc-chip-arrow: #9AA4B2;
    --uc-faq-panel: #E6EDF6;
    --uc-bg-light: linear-gradient(155deg, #ffffff 0%, #eef4fd 56%, #e3edfa 100%);
    --uc-bg-dark: linear-gradient(160deg, #0a1220 0%, #0e1e38 55%, #0883ff 190%);
    --uc-scene: #0a0c10;
    --uc-radius-card: 22px;
    --uc-radius-faq: 16px;
    --uc-radius-insert: 14px;
    --uc-radius-chip: 999px;
    --uc-shadow-card: 0 20px 44px -30px rgba(20, 23, 31, 0.22);
    --uc-shadow-accent: 0 24px 50px -28px rgba(8, 131, 255, 0.35);
    --uc-shadow-callout: 0 24px 54px -22px rgba(8, 131, 255, 0.6);
    --uc-shadow-node: 0 8px 18px -6px rgba(8, 131, 255, 0.7);
    --uc-ease-reveal: 0.3s ease;
    --uc-ease-slide: 0.5s cubic-bezier(0.7, 0, 0.2, 1);
    --uc-logo-h: 28px;
    --uc-logo-h-min: 20px;

    --brand: #0883ff;
    --brand-hover: #0059c9;
    --brand-pressed: #0059c9;
    --brand-soft: rgba(8, 131, 255, 0.14);
    --brand-softer: rgba(8, 131, 255, 0.08);
    --brand-rgb: 8, 131, 255;
    --cta-start: #0883ff;
    --cta-end: #0059c9;
    --cta-gradient: #0883ff;
    --cta-shadow: 0 24px 54px -22px rgba(8, 131, 255, 0.45);
    --secondary: #14171f;
    --secondary-soft: rgba(20, 23, 31, 0.12);
    --uc-white: #ffffff;
    --uc-black: #14171f;
    --uc-dark: #4a5261;
    --bg: #eef4fd;
    --bg-card: #ffffff;
    --bg-hover: #f7f9fc;
    --input-bg: #f7f9fc;
    --border: #e3e9f2;
    --border-light: #e9eef5;
    --text: #232733;
    --text-secondary: #4a5261;
    --text-muted: #7a8494;
    --primary: var(--brand);
    --primary-light: var(--brand-soft);
    --primary-hover: var(--brand-hover);
    --primary-bg: var(--brand-soft);
    --primary-glow: rgba(8, 131, 255, 0.22);
    --danger: #ff2d55;
    --danger-bg: rgba(255, 45, 85, 0.1);
    --info: var(--brand);
    --info-bg: var(--brand-soft);
    --accent: var(--brand);
    --accent-bg: var(--brand-soft);
    --radius: 22px;
    --radius-sm: 16px;
    --radius-xs: 14px;
    --radius-pill: 999px;
    --radius-btn: 999px;
    --shadow-xs: 0 1px 2px rgba(20, 23, 31, 0.04);
    --shadow-sm: 0 8px 18px -12px rgba(20, 23, 31, 0.18);
    --shadow: 0 20px 44px -30px rgba(20, 23, 31, 0.22);
    --shadow-lg: 0 24px 50px -28px rgba(8, 131, 255, 0.35);
    --shadow-glow: 0 0 0 3px rgba(8, 131, 255, 0.14);
    --font: "Wix Madefor Text", "Wix Madefor Display", Manrope, system-ui, sans-serif;
    --font-headline: "Wix Madefor Display", var(--font);
}

[data-theme="dark"] {
    --bg: #0a1220;
    --bg-card: #0e1e38;
    --bg-hover: #14171f;
    --bg-sidebar: #0a1220;
    --bg-topbar: rgba(10, 18, 32, 0.94);
    --border: #232733;
    --border-light: #14171f;
    --text: #e9eef5;
    --text-secondary: #b9c2cf;
    --text-muted: #8a94a6;
    --brand-soft: rgba(77, 169, 255, 0.2);
    --brand-softer: rgba(77, 169, 255, 0.12);
    --input-bg: #14171f;
    --danger: #ff5c7a;
    --cta-gradient: #0883ff;
}

html { color-scheme: light dark; }
body {
    font-family: var(--font);
    color: var(--text);
    background: var(--uc-bg-light);
    background-attachment: fixed;
}
[data-theme="dark"] body,
body[data-theme="dark"] {
    background: var(--uc-bg-dark);
}
h1, h2, h3, h4,
.page-title h1,
.dashboard-hero-copy h2 {
    font-family: var(--font-headline);
    letter-spacing: -0.015em;
    text-wrap: balance;
}

.btn-primary {
    background: var(--brand);
    color: #fff;
    box-shadow: var(--uc-shadow-callout);
}
.btn-primary:hover {
    background: var(--brand-hover);
    opacity: 1;
    box-shadow: var(--uc-shadow-accent);
}
.btn-outline:hover {
    border-color: var(--brand);
    color: var(--brand);
    background: var(--brand-softer);
}

/* Official lockup in CRM chrome — do not reassemble wordmark */
.sidebar-brand .logo {
    width: 148px;
    height: 32px;
    min-width: 116px;
    background: url("/static/brand/logo-unichina.svg") left center / contain no-repeat;
}
.sidebar-brand .logo img {
    opacity: 0;
    width: 100%;
    height: 100%;
}
.sidebar-brand .brand-text { display: none; }
.sidebar.collapsed .sidebar-brand .logo {
    width: 32px;
    min-width: 32px;
    height: 32px;
    background-image: url("/static/brand/logo-unichina-mark.svg");
    background-size: contain;
}

.topbar {
    background: color-mix(in srgb, #ffffff 92%, transparent);
    border-bottom-color: var(--uc-separator);
}

.login-brand img {
    width: auto !important;
    height: 32px !important;
    max-width: 180px !important;
    max-height: 32px !important;
}
.login-brand-text { display: none; }

.table-card,
.sv-card,
.login-card {
    border-color: var(--uc-card-border);
    border-radius: var(--uc-radius-card);
    box-shadow: var(--uc-shadow-card);
}
