/* ================================================================
   NHẬT KÝ ROSE ORBIT — CSS Variables (variables.css)
   ================================================================ */
:root {
  /* ── Color Palette: Rose Orbit (default) ───── */
  --nkro-primary:        #F05C8A;
  --nkro-primary-light:  #F5A0BC;
  --nkro-primary-dark:   #C4386A;
  --nkro-secondary:      #FFD6E3;
  --nkro-accent:         #B98CFF;
  --nkro-accent-light:   #D4BAFF;
  --nkro-accent-dark:    #9060E0;
  --nkro-bg:             #FFF9F7;
  --nkro-bg-card:        #FFFFFF;
  --nkro-bg-glass:       rgba(255,249,247,0.85);
  --nkro-text:           #2B2228;
  --nkro-text-secondary: #74656E;
  --nkro-text-muted:     #9E8E96;
  --nkro-dark:           #241426;
  --nkro-border:         rgba(240,92,138,0.18);
  --nkro-border-strong:  rgba(240,92,138,0.35);

  /* ── Shadows ──────────────────────────────── */
  --nkro-shadow-xs:  0 1px 4px rgba(176,56,106,0.06);
  --nkro-shadow-sm:  0 2px 8px rgba(176,56,106,0.10);
  --nkro-shadow-md:  0 8px 24px rgba(176,56,106,0.14);
  --nkro-shadow-lg:  0 16px 48px rgba(176,56,106,0.18);
  --nkro-shadow-xl:  0 32px 80px rgba(176,56,106,0.22);
  --nkro-glow:       0 0 20px rgba(240,92,138,0.35);

  /* ── Typography ───────────────────────────── */
  --nkro-font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --nkro-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --nkro-font-script:  'Dancing Script', 'Brush Script MT', cursive;

  --nkro-fs-xs:   0.75rem;    /* 12px */
  --nkro-fs-sm:   0.875rem;   /* 14px */
  --nkro-fs-base: 1rem;       /* 16px */
  --nkro-fs-md:   1.125rem;   /* 18px */
  --nkro-fs-lg:   1.25rem;    /* 20px */
  --nkro-fs-xl:   1.5rem;     /* 24px */
  --nkro-fs-2xl:  2rem;       /* 32px */
  --nkro-fs-3xl:  2.5rem;     /* 40px */
  --nkro-fs-4xl:  3.5rem;     /* 56px */
  --nkro-fs-5xl:  5rem;       /* 80px */

  /* ── Spacing ──────────────────────────────── */
  --sp-1:  0.25rem;
  --sp-2:  0.5rem;
  --sp-3:  0.75rem;
  --sp-4:  1rem;
  --sp-5:  1.25rem;
  --sp-6:  1.5rem;
  --sp-8:  2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;

  /* ── Radius ───────────────────────────────── */
  --nkro-r-sm:   6px;
  --nkro-r-md:   12px;
  --nkro-r-lg:   20px;
  --nkro-r-xl:   32px;
  --nkro-r-full: 9999px;

  /* ── Transitions ──────────────────────────── */
  --nkro-ease:       cubic-bezier(.4,0,.2,1);
  --nkro-ease-out:   cubic-bezier(0,0,.2,1);
  --nkro-ease-in:    cubic-bezier(.4,0,1,1);
  --nkro-ease-spring: cubic-bezier(.34,1.56,.64,1);
  --nkro-t-fast:     150ms var(--nkro-ease);
  --nkro-t-base:     300ms var(--nkro-ease);
  --nkro-t-slow:     500ms var(--nkro-ease-out);

  /* ── Z-index ──────────────────────────────── */
  --z-base:    1;
  --z-card:    10;
  --z-sticky:  100;
  --z-modal:   1000;
  --z-drawer:  900;
  --z-toast:   2000;
  --z-loading: 9999;

  /* ── Layout ───────────────────────────────── */
  --nkro-max-w:     1240px;
  --nkro-header-h:  64px;
  --nkro-sidebar-w: 260px;

  /* ── Hero ─────────────────────────────────── */
  --hero-height: 75vh;
}

/* ── Dark mode (Midnight Rose) ─────────────── */
@media (prefers-color-scheme: dark) {
  :root {
    --nkro-bg:             #1A0D1A;
    --nkro-bg-card:        #2A1A2A;
    --nkro-bg-glass:       rgba(26,13,26,0.85);
    --nkro-text:           #F5E6EE;
    --nkro-text-secondary: #C4A8B8;
    --nkro-text-muted:     #906880;
    --nkro-dark:           #0D060D;
    --nkro-secondary:      #4A1E35;
    --nkro-border:         rgba(240,92,138,0.25);
  }
}

/* ── Reduced motion ────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  :root {
    --nkro-t-fast: 0ms;
    --nkro-t-base: 0ms;
    --nkro-t-slow: 0ms;
  }
}