/* ============================================================================
   PetraZone — Ortaq Dizayn Sistemi (Design Tokens)
   ----------------------------------------------------------------------------
   Köhnə "Maxcart" temasının brend rəngləri (mavi #1e73be + qızılı #ffc600)
   saxlanılıb, modern icra üçün token-lərə köçürülüb.

   Bu fayl ADDITIVDIR: mövcud tema stillərini əvəz etmir, yalnız yeni
   dəyişənlər və istəyə-bağlı `pz-` komponent sinifləri təqdim edir.
   Səhifələr addım-addım bu sistemə bağlanacaq.
   ========================================================================== */

:root {
  /* ---- Brend rəngləri (əsas mavi → tünd navy rgb(30,42,120)) ---- */
  --pz-primary:        rgb(30, 42, 120);   /* əsas navy — brend rəngi */
  --pz-primary-600:    #18215f;   /* hover / tünd */
  --pz-primary-700:    #131a4c;   /* aktiv / daha tünd */
  --pz-primary-tint:   #eaebf6;   /* açıq fon çaları (navy çalarlı) */
  --pz-primary-tint-2: #d6d9ee;

  --pz-accent:         #ffc600;   /* qızılı vurğu */
  --pz-accent-600:     #e6b100;   /* qızılı hover */
  --pz-accent-tint:    #fff6d6;

  /* ---- Neytral palitra (yumşaldılmış qara/boz) ---- */
  --pz-ink:      #1d2430;   /* başlıqlar */
  --pz-body:     #454f5c;   /* əsas mətn */
  --pz-muted:    #8a94a3;   /* ikinci dərəcəli mətn */
  --pz-faint:    #aab2bd;   /* çox solğun */
  --pz-line:     #e7eaee;   /* kənarlıqlar */
  --pz-line-2:   #f0f2f5;   /* incə ayırıcı */
  --pz-bg:       #f5f7fa;   /* səhifə fonu */
  --pz-surface:  #ffffff;   /* kart / panel */
  --pz-surface-2:#fafbfc;   /* alternativ panel */

  /* ---- Semantik hallar ---- */
  --pz-success:  #1f9d57;
  --pz-success-tint: #e6f6ec;
  --pz-danger:   #e23b3b;
  --pz-danger-tint:  #fdecec;
  --pz-warning:  #f0a020;
  --pz-warning-tint: #fff4e0;
  --pz-info:     #1e73be;
  --pz-info-tint:    #e9f2fb;

  /* ---- Künc radiusu ---- */
  --pz-r-xs:   6px;
  --pz-r-sm:   9px;
  --pz-r:      13px;
  --pz-r-lg:   18px;
  --pz-r-xl:   24px;
  --pz-r-pill: 999px;

  /* ---- Kölgələr (yumşaq, təbəqəli) ---- */
  --pz-shadow-xs: 0 1px 2px rgba(29, 36, 48, .06);
  --pz-shadow-sm: 0 2px 8px rgba(29, 36, 48, .07);
  --pz-shadow:    0 6px 20px rgba(29, 36, 48, .09);
  --pz-shadow-lg: 0 14px 40px rgba(29, 36, 48, .12);
  --pz-shadow-primary: 0 8px 22px rgba(30, 42, 120, .30);
  --pz-shadow-accent:  0 8px 22px rgba(255, 198, 0, .30);

  /* ---- Aralıq şkalası (4px əsaslı) ---- */
  --pz-s-1: 4px;
  --pz-s-2: 8px;
  --pz-s-3: 12px;
  --pz-s-4: 16px;
  --pz-s-5: 24px;
  --pz-s-6: 32px;
  --pz-s-7: 48px;
  --pz-s-8: 64px;

  /* ---- Tipoqrafiya ---- */
  --pz-font: 'Inter', 'Roboto', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --pz-fs-xs:   12px;
  --pz-fs-sm:   13px;
  --pz-fs-base: 15px;
  --pz-fs-md:   17px;
  --pz-fs-lg:   20px;
  --pz-fs-xl:   26px;
  --pz-fs-2xl:  34px;
  --pz-lh:      1.6;

  /* ---- Keçidlər ---- */
  --pz-transition: .22s cubic-bezier(.4, 0, .2, 1);
  --pz-transition-fast: .15s ease;

  /* ---- Brend qradiyentləri (vau effekti üçün) ---- */
  --pz-grad-primary: linear-gradient(135deg, #2c3aa0 0%, rgb(30, 42, 120) 55%, #18215f 100%);
  --pz-grad-accent:  linear-gradient(135deg, #ffd23f 0%, #ffc600 60%, #e6b100 100%);
  --pz-grad-hero:    linear-gradient(135deg, #131a4c 0%, rgb(30, 42, 120) 100%);
}

/* ============================================================================
   İSTƏYƏ-BAĞLI KOMPONENTLƏR  (`pz-` prefiksi)
   Səhifələr bunları tədricən mövcud işarələməni əvəz etmək üçün işlədə bilər.
   ========================================================================== */

/* ---- Düymələr ---- */
.pz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--pz-s-2);
  font-family: var(--pz-font);
  font-size: var(--pz-fs-base);
  font-weight: 600;
  line-height: 1;
  padding: 12px 22px;
  border: 1px solid transparent;
  border-radius: var(--pz-r-sm);
  cursor: pointer;
  text-decoration: none;
  transition: transform var(--pz-transition-fast),
              box-shadow var(--pz-transition),
              background-color var(--pz-transition),
              color var(--pz-transition),
              border-color var(--pz-transition);
  -webkit-user-select: none;
  user-select: none;
}
.pz-btn:hover  { transform: translateY(-2px); text-decoration: none; }
.pz-btn:active { transform: translateY(0); }
.pz-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px var(--pz-primary-tint-2);
}

.pz-btn--primary {
  background: var(--pz-grad-primary);
  color: #fff;
  box-shadow: var(--pz-shadow-primary);
}
.pz-btn--primary:hover { color: #fff; box-shadow: 0 12px 28px rgba(30, 42, 120, .38); }

.pz-btn--accent {
  background: var(--pz-grad-accent);
  color: #3a2c00;
  box-shadow: var(--pz-shadow-accent);
}
.pz-btn--accent:hover { color: #3a2c00; box-shadow: 0 12px 28px rgba(255, 198, 0, .42); }

.pz-btn--ghost {
  background: var(--pz-surface);
  color: var(--pz-primary);
  border-color: var(--pz-line);
  box-shadow: var(--pz-shadow-xs);
}
.pz-btn--ghost:hover {
  color: var(--pz-primary-600);
  border-color: var(--pz-primary);
  background: var(--pz-primary-tint);
}

.pz-btn--sm { padding: 8px 15px; font-size: var(--pz-fs-sm); }
.pz-btn--lg { padding: 15px 28px; font-size: var(--pz-fs-md); }
.pz-btn--block { display: flex; width: 100%; }

/* ---- Kartlar ---- */
.pz-card {
  background: var(--pz-surface);
  border: 1px solid var(--pz-line);
  border-radius: var(--pz-r);
  box-shadow: var(--pz-shadow-sm);
  transition: transform var(--pz-transition),
              box-shadow var(--pz-transition);
}
.pz-card--hover:hover {
  transform: translateY(-4px);
  box-shadow: var(--pz-shadow-lg);
}
.pz-card__body { padding: var(--pz-s-5); }

/* ---- Nişanlar (badge) ---- */
.pz-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--pz-s-1);
  font-size: var(--pz-fs-xs);
  font-weight: 700;
  letter-spacing: .2px;
  padding: 5px 11px;
  border-radius: var(--pz-r-pill);
  line-height: 1;
}
.pz-badge--primary { background: var(--pz-primary-tint); color: var(--pz-primary-700); }
.pz-badge--accent  { background: var(--pz-accent-tint);  color: #8a6d00; }
.pz-badge--success { background: var(--pz-success-tint); color: var(--pz-success); }
.pz-badge--danger  { background: var(--pz-danger-tint);  color: var(--pz-danger); }
.pz-badge--warning { background: var(--pz-warning-tint); color: #9a6a00; }

/* ---- Form sahələri ---- */
.pz-input {
  width: 100%;
  font-family: var(--pz-font);
  font-size: var(--pz-fs-base);
  color: var(--pz-ink);
  background: var(--pz-surface);
  border: 1px solid var(--pz-line);
  border-radius: var(--pz-r-sm);
  padding: 11px 14px;
  transition: border-color var(--pz-transition), box-shadow var(--pz-transition);
}
.pz-input::placeholder { color: var(--pz-faint); }
.pz-input:focus {
  outline: none;
  border-color: var(--pz-primary);
  box-shadow: 0 0 0 3px var(--pz-primary-tint);
}

/* ---- Bölmə başlığı ---- */
.pz-section-title {
  font-family: var(--pz-font);
  font-size: var(--pz-fs-xl);
  font-weight: 800;
  color: var(--pz-ink);
  margin: 0 0 var(--pz-s-5);
  position: relative;
  padding-bottom: var(--pz-s-3);
}
.pz-section-title::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 56px; height: 3px;
  border-radius: var(--pz-r-pill);
  background: var(--pz-grad-accent);
}

/* ---- Köməkçi siniflər ---- */
.pz-surface { background: var(--pz-surface); }
.pz-muted   { color: var(--pz-muted); }
.pz-rounded { border-radius: var(--pz-r); }
.pz-shadow  { box-shadow: var(--pz-shadow); }

/* Kiçik ekranlarda düymə/başlıq uyğunlaşması */
@media (max-width: 575px) {
  :root { --pz-fs-xl: 22px; --pz-fs-2xl: 28px; }
  .pz-btn { padding: 11px 18px; }
}