/* =========================================================================
   CorporateERP — Vahid Dizayn Tokenləri
   Canlı nümunədə (Claude Design) təsdiqlənmiş rənglər və qaydalar əsasında.
   Bu fayl CorporateERP.Web VƏ CorporateERP.Web.Client-in hər ikisində
   yüklənməlidir (bax QURASDIRMA.txt).
   ========================================================================= */

:root {
  /* --- Əsas rənglər (təsdiqlənmiş) --- */
  --erp-menu-bg: #fbfbf9;      /* Sol menü fonu, cədvəl başlıq fonu */
  --erp-page-bg: #fcfcfb;      /* Səhifə fonu, sətir hover fonu */
  --erp-text: #333333;         /* Əsas mətn rəngi */
  --erp-border: #d8d8d3;       /* Sərhədlər */
  --erp-border-soft: rgba(216, 216, 211, 0.7); /* Nazik ayırıcı xətlər üçün */
  --erp-accent: #14b8a6;       /* Vurğu rəngi — əsas düymələr üçün */
  --erp-accent-contrast: #ffffff;

  /* --- Köməkçi tonlar (neytral boz çalarlar) --- */
  --erp-muted: #8a8a84;        /* Qrup başlıqları, alt qeydlər */
  --erp-muted-2: #6b6b66;      /* İzahat mətnləri */
  --erp-white: #ffffff;

  /* --- Şrift --- */
  --erp-font: -apple-system, "Segoe UI", Arial, sans-serif;

  /* --- Sürüklənən menü ölçüləri --- */
  --erp-sidebar-min: 260px;    /* Ən uzun menü mətninə görə hesablanmalı — real menyuda dəyişə bilər */
  --erp-sidebar-max: 420px;
  --erp-sidebar-default: 260px;
}

/* =========================================================================
   BOOTSTRAP DƏYİŞƏNLƏRİNİ ÖZÜMÜZÜNKÜLƏRLƏ ƏVƏZ ET
   Bootstrap-ın öz CSS dəyişənlərini override edirik ki, mövcud
   bootstrap-class-lı markup (btn-primary, bg-light və s.) heç bir
   səhifə dəyişmədən yeni rəngləri irsən alsın.
   ========================================================================= */
:root {
  --bs-primary: var(--erp-accent);
  --bs-primary-rgb: 20, 184, 166;
  --bs-body-color: var(--erp-text);
  --bs-body-bg: var(--erp-page-bg);
  --bs-border-color: var(--erp-border);
  --bs-font-sans-serif: var(--erp-font);
  --bs-body-font-family: var(--erp-font);

  /* Bold-u qlobal söndürürük */
  --bs-body-font-weight: 400;

  /* QEYD: --bs-danger/--bs-success/--bs-warning/--bs-info kök dəyişənlərini
     BURADA DƏYİŞMİRİK — Bootstrap-ın "text-danger"/"text-success" mətn
     rəngi klasları da bu dəyişənlərdən istifadə edir (məs. hesabatlarda
     mənfi/müsbət rəqəmlər), ona görə onları toxunulmaz saxlayıb əsl
     qırmızı/yaşıl mənasını qoruyuruq. Düymələr üçün rəng aşağıda
     ".btn-danger" və s. üzərində birbaşa (background-color ilə) verilir. */
}

body {
  font-family: var(--erp-font);
  background: var(--erp-page-bg);
  color: var(--erp-text);
}

/* =========================================================================
   BOLD-UN QLOBAL SÖNDÜRÜLMƏSİ
   İstisna: yalnız menü qrup başlıqları (.erp-nav-group-title) bold qala bilər.
   ========================================================================= */
b, strong, .fw-bold,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 400 !important;
}

/* İSTİSNA: menü qrup başlıqları bold qalır (təsdiqlənmiş istisna) */
.erp-nav-group-title {
  font-weight: 600 !important;
}

/* =========================================================================
   DÜYMƏLƏR
   ========================================================================= */
.btn-primary,
.btn-danger,
.btn-success,
.btn-warning,
.btn-info {
  background-color: var(--erp-accent) !important;
  border-color: var(--erp-accent) !important;
  color: var(--erp-accent-contrast) !important;
  transition: filter 0.12s ease;
}
.btn-primary:hover,
.btn-danger:hover,
.btn-success:hover,
.btn-warning:hover,
.btn-info:hover {
  filter: brightness(1.06);
}
.btn-outline-secondary,
.btn-secondary {
  background-color: var(--erp-white) !important;
  border-color: var(--erp-border) !important;
  color: var(--erp-text) !important;
}

/* =========================================================================
   XƏBƏRDARLIQ/XƏTA MESAJLARI (alert) — daha kompakt hündürlük
   ========================================================================= */
.alert {
  padding: 0.5rem 0.9rem !important;
  font-size: 13px;
  margin-bottom: 0.75rem;
}

/* =========================================================================
   CƏDVƏLLƏR (ümumi görünüş — sütun sürüklənməsi table-resize.js-də)
   ========================================================================= */
table.table {
  font-size: 13px;
  color: var(--erp-text);
  border-collapse: collapse;
}
table.table thead th {
  background: var(--erp-menu-bg);
  font-weight: 400;
  border: 1px solid var(--erp-border) !important;
}
table.table td, table.table th {
  border: 1px solid var(--erp-border) !important;
}
table.table tbody tr:hover {
  background: var(--erp-page-bg);
}
/* Sütun sürükləmə tutacağının görünə bilməsi üçün th mövqeyi */
table.table thead th {
  position: relative;
}

/* =========================================================================
   CƏDVƏL ƏMƏLİYYAT DÜYMƏLƏRİ (📁 ✏️ 🗑️ tipli kiçik ikon-düymələr)
   Layihə boyu bütün "btn-sm" ölçülü düymələr (adətən cədvəllərdə
   "Əməliyyatlar" sütununda emoji ikonlarla) buradan VAHİD ölçüyə
   gətirilir — hər səhifədə ayrıca dəyişməyə ehtiyac qalmır.
   ========================================================================= */
.btn-sm {
  font-size: 13px !important;
  padding: 0.2rem 0.5rem !important;
  line-height: 1.3 !important;
}

/* Sırf emoji-ikonlu (mətnsiz) əməliyyat düymələri — 📁 ✏️ 🗑️ və s.
   Bunlar .btn-sm-dən də ~25-30% kiçikdir. Bu klası hər hansı səhifədə
   eyni tipli ikon-düyməyə əlavə etmək kifayətdir. */
.erp-icon-btn {
  font-size: 9.5px !important;
  line-height: 1 !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  /* Neytral, "qabarıq" görünüş — bütün üç düymə (icra növündən asılı olmayaraq) eyni tondadır */
  background: #f0f0ec !important;
  border: 1px solid var(--erp-border) !important;
  color: var(--erp-text) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: background 0.12s ease, box-shadow 0.12s ease, border-color 0.12s ease;
}
.erp-icon-btn:hover {
  /* "Sıxılmış" effekt — fon bir az açılır, kənar cüzi qalınlaşıb tündləşir, kölgə içəri dönür */
  background: #f8f8f5 !important;
  border: 1.5px solid var(--erp-muted) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.14);
}

/* =========================================================================
   SIDEBAR / NAVMENU
   ========================================================================= */
.erp-sidebar {
  background: var(--erp-menu-bg);
  border-right: 1px solid var(--erp-border);
  overflow: hidden;
  position: relative;
}

.erp-sidebar-resize-handle {
  position: absolute;
  top: 0;
  right: -3px;
  width: 6px;
  height: 100%;
  cursor: col-resize;
  z-index: 5;
}

.erp-nav-group-title {
  position: relative;
  min-height: 36px;
  padding: 6px 44px 6px 20px;
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--erp-muted);
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Ox: başlığın sağ kənarına nisbətən SABİT mövqedə (menyunun məzmunundan asılı deyil) */
.erp-nav-group-arrow {
  position: absolute;
  right: 12px;
  top: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  margin-top: -12px;
  font-size: 24px;
  line-height: 1;
  color: var(--erp-muted);
  transform: rotate(0deg);
  transform-origin: 50% 50%;
  transition: transform 0.15s ease;
}
.erp-nav-group-arrow.erp-nav-group-arrow-kapali {
  color: #6f4e37;
  transform: rotate(0deg);
}
.erp-nav-group-arrow.erp-nav-group-arrow-acig {
  color: #2e7d32;
  transform: rotate(90deg);
}

.erp-navitem {
  border-radius: 6px;
  margin: 0 8px;
  padding: 6px 12px;
  font-size: 13px;
  color: var(--erp-text);
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: background 0.1s ease;
  background: transparent;
  text-decoration: none !important;
}
.erp-navitem:hover {
  background: var(--erp-white);
  text-decoration: none !important;
}
.erp-navitem.active,
.erp-navitem.erp-navitem-secilmis {
  background: var(--erp-white);
}
.erp-navitem.active:hover {
  background: var(--erp-white);
}

/* =========================================================================
   SIDEBAR-IN DAXİLİ SÜRÜŞDÜRMƏ ZOLAĞI — nazik görünüş (Chrome/Edge)
   ========================================================================= */
/* Əsas səbəb: Bootstrap .nav = flex-wrap:wrap. Sütun istiqamətli çoxsətirli flex-də
   sətrin eni ən uzun elementin eninə görə hesablanırdı və başlıq (ox) onunla sürüşürdü.
   nowrap ilə bütün elementlər həmişə konteynerin eni qədər olur. */
.erp-sidebar .nav {
  flex-wrap: nowrap !important;
  min-width: 0;
}
.erp-sidebar .nav > div,
.erp-sidebar .nav .erp-navitem {
  min-width: 0;
}
.erp-sidebar .erp-navitem {
  margin-right: 8px;
}
.erp-sidebar .overflow-auto {
  overflow-x: hidden !important;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: var(--erp-border) transparent;
}
.erp-sidebar .overflow-auto::-webkit-scrollbar {
  width: 6px;
}
.erp-sidebar .overflow-auto::-webkit-scrollbar-track {
  background: transparent;
}
.erp-sidebar .overflow-auto::-webkit-scrollbar-thumb {
  background: var(--erp-border);
  border-radius: 3px;
}

.erp-separator {
  height: 1px;
  background: var(--erp-border-soft);
  margin: 0 20px 12px 20px;
  transform: scaleY(0.5);
  transform-origin: top;
}

/* ---- TarixInput: gg.aa.iiii yazı sahəsi + təqvim düyməsi ---- */
.tarix-input { display: flex; align-items: stretch; width: 100%; gap: 2px; }
.tarix-input > input[type="text"] { flex: 1 1 auto; min-width: 0; }
.tarix-input > .tarix-secici { flex: 0 0 34px; width: 34px; min-width: 34px; padding-left: 2px; padding-right: 2px; cursor: pointer; }
.tarix-secici::-webkit-datetime-edit { display: none; }
.tarix-secici::-webkit-calendar-picker-indicator { margin: 0 auto; cursor: pointer; }
