/* ═══════════════════════════════════════════════════════════════════
   NEWCOSS — Premium Design System
   "Zamonaviy, esda qolarli, professional + premium minimalizm"
   Ilhom: Aesop, Rare Beauty, Apple — ko'p bo'sh joy, tanlangan aksent
   rang, sifatli tipografiya, silliq professional animatsiyalar.
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* ── Rang palitrasi: chuqur navy + issiq oltin aksent ── */
  --nc-ink:        #0A0F1E;   /* asosiy matn / eng to'q */
  --nc-ink-soft:   #3D4759;   /* ikkinchi darajali matn */
  --nc-mist:       #8A93A6;   /* uchinchi darajali / placeholder */
  --nc-navy:       #151E4A;   /* brend rangi — logotipdagi to'q indigo-navy */
  --nc-navy-2:     #1E2A5E;
  --nc-gold:       #C9A961;   /* premium aksent rang (fon, chegara, quyuq fondagi matn uchun) */
  --nc-gold-text:  #826D3F;   /* xuddi shu oltin ranging OQ FONDA o'qilishi uchun to'qroq varianti (WCAG AA, 4.99:1) */
  --nc-gold-soft:  #E4D3A8;
  --nc-paper:      #FFFFFF;   /* fon — logotip kabi toza oq */
  --nc-paper-2:    #F4F5F9;
  --nc-line:       #E5E7F0;   /* nozik chiziqlar */
  --nc-white:      #FFFFFF;
  --nc-ok:         #1F7A56;
  --nc-warn:       #B8863B;
  --nc-err:        #B3452F;

  /* ── Dark mode ranglari (data-theme="dark" bilan almashadi) ── */
  --nc-ink-dark:      #F3F2EC;
  --nc-ink-soft-dark: #B7BECC;
  --nc-paper-dark:    #0A0F1E;
  --nc-paper-2-dark:  #10162B;
  --nc-line-dark:     #223049;
  --nc-white-dark:    #151E4A;

  /* ── Tipografiya — to'liq zamonaviy sans-serif uslub ── */
  --nc-font: 'Inter', -apple-system, system-ui, sans-serif;
  --nc-font-display: 'Outfit', 'Inter', -apple-system, sans-serif;

  /* ── Bo'shliq shkalasi (8px grid) ── */
  --nc-sp-1: 4px;  --nc-sp-2: 8px;  --nc-sp-3: 12px; --nc-sp-4: 16px;
  --nc-sp-5: 24px; --nc-sp-6: 32px; --nc-sp-7: 48px; --nc-sp-8: 64px;

  /* ── Radius va soya ── */
  --nc-r-sm: 8px; --nc-r-md: 14px; --nc-r-lg: 22px; --nc-r-pill: 999px;
  --nc-sh-sm: 0 1px 2px rgba(11,18,32,.06), 0 1px 1px rgba(11,18,32,.04);
  --nc-sh-md: 0 8px 24px rgba(11,18,32,.08), 0 2px 6px rgba(11,18,32,.04);
  --nc-sh-lg: 0 24px 64px rgba(11,18,32,.14), 0 4px 12px rgba(11,18,32,.06);
  --nc-sh-gold: 0 8px 24px rgba(201,169,97,.28);

  /* ── Harakat (motion) ── */
  --nc-ease: cubic-bezier(.22,1,.36,1);
  --nc-ease-in: cubic-bezier(.4,0,.2,1);
  --nc-t-fast: 150ms;
  --nc-t-med: 260ms;
  --nc-t-slow: 420ms;
}

[data-theme="dark"] {
  --nc-ink: var(--nc-ink-dark);
  --nc-ink-soft: var(--nc-ink-soft-dark);
  --nc-paper: var(--nc-paper-dark);
  --nc-paper-2: var(--nc-paper-2-dark);
  --nc-line: var(--nc-line-dark);
  --nc-white: var(--nc-white-dark);
  --nc-gold-text: var(--nc-gold); /* qorong'i rejimda fon to'q bo'lgani uchun asl yorqin oltin rang o'qiladi */
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; max-width: 100vw; }
body {
  font-family: var(--nc-font);
  background: var(--nc-paper);
  color: var(--nc-ink);
  -webkit-font-smoothing: antialiased;
  transition: background var(--nc-t-med) var(--nc-ease), color var(--nc-t-med) var(--nc-ease);
  overflow-x: hidden;
  max-width: 100vw;
  -webkit-tap-highlight-color: transparent;
}
button, a, input, textarea, select {
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

/* ── Responsive breakpoint yordamchilari ──
   Mobile-first: bazaviy stil telefon uchun, @media orqali kattalashtiriladi.
   Breakpointlar: 640px (katta telefon/kichik planshet), 1024px (desktop), 1440px (katta ekran) */

/* ── Umumiy silliq animatsiya klasslari ── */
.nc-fade-in { animation: ncFadeIn var(--nc-t-slow) var(--nc-ease) both; }
@keyframes ncFadeIn { from { opacity:0; transform:translateY(8px);} to {opacity:1; transform:none;} }

.nc-btn {
  cursor: pointer;
  border: none;
  font-family: inherit;
  transition: transform var(--nc-t-fast) var(--nc-ease),
              box-shadow var(--nc-t-fast) var(--nc-ease),
              background var(--nc-t-fast) var(--nc-ease),
              opacity var(--nc-t-fast) var(--nc-ease);
}
.nc-btn:active { transform: scale(.96); }
.nc-btn:hover { transform: translateY(-1px); }
.nc-btn:disabled { opacity: .5; cursor: not-allowed; transform:none; }

/* Scrollbar — nozik va premium */
::-webkit-scrollbar { width: 7px; height: 7px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--nc-line); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--nc-mist); }

/* Skeleton loading shimmer (rasm yuklanayotganda) */
.nc-skeleton {
  background: linear-gradient(90deg, var(--nc-paper-2) 25%, var(--nc-line) 50%, var(--nc-paper-2) 75%);
  background-size: 200% 100%;
  animation: ncShimmer 1.4s ease-in-out infinite;
}
@keyframes ncShimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* ═══ NC-ICO — Premium SVG icon primitive (shop + admin umumiy) ═══ */
.nc-ico {
  width: 19px; height: 19px; stroke: currentColor; stroke-width: 1.7; fill: none;
  stroke-linecap: round; stroke-linejoin: round; display: block; overflow: visible; flex-shrink: 0;
}
.nc-ico-inline { width: 16px; height: 16px; display: inline-block; vertical-align: -3px; margin-right: 3px; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 5px; vertical-align: 1px; }