/* ==========================================================================
   Capital Paints ERP — طبقة التنسيق الموحّدة (تتحمّل بعد Tailwind في كل الصفحات)
   ========================================================================== */

/* ---- مؤشر "جاري التنفيذ" والحماية من الضغط المزدوج ---- */
.erp-spinner{display:inline-block;width:18px;height:18px;border:2.5px solid currentColor;border-inline-end-color:transparent;border-radius:999px;animation:erp-spin .7s linear infinite;vertical-align:-3px}
.erp-spinner-sm{width:14px;height:14px;border-width:2px}
@keyframes erp-spin{to{transform:rotate(360deg)}}
#erp-busy{position:fixed;inset-inline:0;bottom:22px;margin-inline:auto;width:max-content;max-width:calc(100vw - 32px);z-index:200;display:flex;align-items:center;gap:10px;padding:11px 18px;border-radius:14px;background:#0f172a;color:#fff;font-size:14px;font-weight:700;box-shadow:0 12px 30px -10px rgba(15,23,42,.5);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .2s,transform .2s}
#erp-busy.show{opacity:1;transform:none}
button[data-erp-locked],input[data-erp-locked]{opacity:.65;cursor:wait!important}

/* ---- رسائل التنبيه أعلى الصفحة ---- */
.erp-flash{display:flex;align-items:center;gap:10px;padding:12px 14px;margin-bottom:16px;border-radius:14px;font-size:14px;font-weight:700;border:1px solid}
.erp-flash span{flex:1}
.erp-flash button{font-size:20px;line-height:1;opacity:.6;padding:0 4px}
.erp-flash-warning{background:#fffbeb;border-color:#fde68a;color:#92400e}
.erp-flash-success{background:#ecfdf5;border-color:#a7f3d0;color:#065f46}
.erp-alert-error{padding:10px 14px;border-radius:12px;background:#fff1f2;border:1px solid #fecdd3;color:#be123c;font-size:14px;font-weight:700}

/* ---- مكونات موحّدة (بطاقات/حقول/أزرار) للصفحات الجديدة ---- */
.erp-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.erp-card-head{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid #f1f5f9}
.erp-card-head h2{font-size:16px;font-weight:800;color:#0f172a}
.erp-label{display:block;margin-bottom:6px;font-size:13px;font-weight:700;color:#334155}
.erp-input{width:100%}
.erp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 18px;border-radius:12px;font-size:14px;font-weight:800;white-space:nowrap;transition:background-color .15s,box-shadow .15s,transform .1s}
.erp-btn:active{transform:scale(.98)}
.erp-btn-primary{background:rgb(var(--brand-600));color:#fff;box-shadow:0 6px 14px -8px rgb(var(--brand-600))}
.erp-btn-primary:hover{background:rgb(var(--brand-700))}
.erp-btn-ghost{background:#f1f5f9;color:#334155}
.erp-btn-ghost:hover{background:#e2e8f0}
.erp-file-drop{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px dashed #cbd5e1;border-radius:14px;color:#475569;font-size:13px;font-weight:700;cursor:pointer;background:#f8fafc;transition:border-color .15s,background .15s}
.erp-file-drop:hover{border-color:rgb(var(--brand-400));background:rgb(var(--brand-50))}

/* ==========================================================================
   توحيد شكل الحقول في كل الصفحات (نفس الارتفاع والحواف والإطار والتركيز)
   ========================================================================== */
html{-webkit-text-size-adjust:100%}
body{overflow-x:clip}
main input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):not([type=range]):not([type=color]):not([type=submit]):not([type=button]):not(.erp-combo-input),
main select:not([multiple]):not([size]),
main textarea{
  border:1px solid #e2e8f0;border-radius:12px;background-color:#fff;color:#0f172a;font-size:14px;line-height:1.4;
  min-height:42px;padding-top:8px;padding-bottom:8px;padding-inline:12px;
  transition:border-color .15s,box-shadow .15s;
}
main textarea{min-height:84px}
main input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]):focus,
main select:focus,main textarea:focus{outline:none;border-color:rgb(var(--brand-500));box-shadow:0 0 0 3px rgb(var(--brand-500) / .15)}
main input::placeholder,main textarea::placeholder{color:#94a3b8}
main input[readonly],main input:disabled,main select:disabled,main textarea[readonly]{background-color:#f8fafc;color:#475569}
main input[type=checkbox],main input[type=radio]{width:17px;height:17px;accent-color:rgb(var(--brand-600));cursor:pointer;vertical-align:middle}
main input[type=file]{font-size:13px;max-width:100%}
main input[type=file]::file-selector-button{margin-inline-end:10px;padding:8px 14px;border:0;border-radius:10px;background:rgb(var(--brand-50));color:rgb(var(--brand-700));font-weight:800;font-family:inherit;cursor:pointer}
main label{line-height:1.5}
/* حقول داخل جداول الإدخال (بنود الفواتير...) أصغر شوية */
main table input:not([type=checkbox]):not([type=radio]):not([type=hidden]),main table select{min-height:38px;padding-top:6px;padding-bottom:6px;border-radius:10px}
.erp-combo-input{min-height:0!important;border-radius:12px!important;font-size:14px}
main table .erp-combo-input{border-radius:10px!important}
.erp-combo-input:focus{border-color:rgb(var(--brand-500))!important;box-shadow:0 0 0 3px rgb(var(--brand-500) / .15)!important}
/* v16: خانة الاختيار بتعرض الاسم كامل (سطر أو سطرين) بدل ما تقصه */
.erp-combo-display{border-color:#e2e8f0}
.erp-combo.editing .erp-combo-input{border-color:rgb(var(--brand-500))!important}
/* بنود الفواتير: عمود الصنف عريض كفاية لاسم الصنف كامل */
main table td.line-product-cell{min-width:300px;width:40%}
main table td.line-category-cell{min-width:150px}

/* الأزرار: نص على سطر واحد ومؤشر واضح */
main button,main a[class*="bg-"][class*="px-"],main a[class*="rounded"][class*="px-"]{white-space:nowrap}
main button:not(:disabled){cursor:pointer}
main button:focus-visible,main a:focus-visible{outline:2px solid rgb(var(--brand-500));outline-offset:2px}

/* ==========================================================================
   الجداول: رأس ثابت الشكل، مسافات موحّدة، وتمرير أفقي بدل ما الأعمدة تتكسر
   ========================================================================== */
main table{border-collapse:collapse;width:100%}
main table thead th{font-size:12.5px;font-weight:800;color:#475569;background:#f8fafc;border-bottom:1px solid #e2e8f0;white-space:nowrap;vertical-align:middle}
main table th,main table td{padding:10px 12px}
main table td{vertical-align:middle;border-bottom:1px solid #f1f5f9}
main table tbody tr:last-child td{border-bottom:0}
main table tfoot td,main table tfoot th{background:#f8fafc;font-weight:800}
.erp-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.overflow-x-auto{-webkit-overflow-scrolling:touch}
/* ظل خفيف على حافة الجدول لما يكون فيه تمرير */
.erp-table-scroll.has-scroll,.overflow-x-auto.has-scroll{background:linear-gradient(to left,#fff 30%,rgba(255,255,255,0)) left center/40px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(15,23,42,.12),rgba(15,23,42,0)) left center/12px 100% no-repeat scroll}

/* ==========================================================================
   الموبايل والتابلت
   ========================================================================== */
@media (max-width:1023px){
  main{padding:14px!important}
  main h1.text-2xl,main h1.text-3xl{font-size:1.35rem;line-height:1.9rem}
  /* الجداول تتمرر أفقيًا وكل خلية على سطر واحد عشان الأرقام والتواريخ ما تتكسرش */
  main table th,main table td{white-space:nowrap;padding:9px 10px}
  main table td.whitespace-normal,main table td .whitespace-normal{white-space:normal}
  main table input:not([type=checkbox]):not([type=radio]):not([type=hidden]),main table select,main table .erp-combo{min-width:110px}
  main table td.line-product-cell{min-width:260px}
  main table{font-size:13px}
  /* بطاقات الإحصائيات: عمودين بدل عمود واحد طويل */
  main .grid:is(.md\:grid-cols-3,.md\:grid-cols-4,.md\:grid-cols-5,.md\:grid-cols-6,.lg\:grid-cols-4,.lg\:grid-cols-5,.lg\:grid-cols-6):not(:has(input,select,textarea,table,form)){grid-template-columns:repeat(2,minmax(0,1fr))}
  /* رأس الصفحة: العنوان فوق والأزرار تحت بدل ما يتزنقوا جنب بعض */
  main .animate-fade-in>div>.flex.justify-between:first-child,
  main .animate-fade-in>.flex.justify-between:first-child{flex-wrap:wrap;row-gap:12px}
  .erp-pager{font-size:12px;padding:10px}
  #modal-overlay{padding:10px!important;align-items:flex-end!important}
  #modal-content{max-height:92vh!important;border-radius:18px!important}
}
@media (max-width:640px){
  main .flex.flex-wrap.gap-2>a,main .flex.flex-wrap.gap-2>button,main .flex.gap-2>a[class*="px-"],main .flex.gap-2>button[class*="px-"]{flex:1 1 auto;justify-content:center;text-align:center}
}

@media print{
  #erp-busy,.erp-flash,.erp-pager{display:none!important}
  .erp-table-scroll,.overflow-x-auto{overflow:visible!important}
  main table th,main table td{white-space:normal!important}
}

/* زر طيّ الفلاتر على الموبايل */
.erp-filter-toggle{display:flex;align-items:center;gap:8px;width:100%;min-height:46px;padding:0 16px;margin-bottom:10px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;color:#334155;font-size:14px;font-weight:800;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.erp-filter-toggle span{flex:1;text-align:right}
.erp-filter-toggle b{min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:rgb(var(--brand-600));color:#fff;font-size:12px;display:inline-flex;align-items:center;justify-content:center}
.erp-filter-toggle .erp-ft-chev{transition:transform .2s}
.erp-filter-toggle.open .erp-ft-chev{transform:rotate(180deg)}
form.erp-filter-collapsed{display:none!important}
@media (max-width:1023px){
  /* صفوف الأزرار (إضافة/تصدير/طباعة...) تنزل لسطر جديد بدل ما تخرج برة الشاشة */
  main .flex:has(> :is(a,button,form,label)[class*="px-"] ~ :is(a,button,form,label)){flex-wrap:wrap}
  main .grid>*{min-width:0}
}

/* ===== أداة التقارير الموحدة (assets/js/report-kit.js) ===== */
.rk-bar{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.6rem;margin-bottom:.5rem;background:#fff;border:1px solid #e2e8f0;border-radius:1rem}
.rk-search{flex:1 1 220px;min-width:0;padding:.5rem .75rem;border:1px solid #e2e8f0;border-radius:.75rem;background:#f8fafc;font-size:.85rem;outline:none}
.rk-search:focus{background:#fff;border-color:rgb(var(--brand-300))}
.rk-btns{display:flex;flex-wrap:wrap;gap:.4rem}
.rk-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem .75rem;border-radius:.75rem;font-size:.8rem;font-weight:700;background:#f1f5f9;color:#334155;transition:background-color .15s}
.rk-btn:hover{background:#e2e8f0}
.rk-btn:disabled{opacity:.45;cursor:default}
.rk-btn-excel{background:#ecfdf5;color:#047857}.rk-btn-excel:hover{background:#d1fae5}
.rk-btn-print{background:rgb(var(--brand-600));color:#fff}.rk-btn-print:hover{background:rgb(var(--brand-700))}
.rk-info{font-size:.75rem;color:#64748b;margin-inline-start:auto}
.rk-panel{position:absolute;z-index:30;top:calc(100% + .35rem);inset-inline-start:.6rem;width:min(560px,calc(100vw - 2rem));max-height:60vh;overflow:auto;background:#fff;border:1px solid #e2e8f0;border-radius:1rem;box-shadow:0 12px 30px rgba(15,23,42,.12);padding:.75rem}
.rk-panel.hidden{display:none}
.rk-panel-tools{display:flex;gap:1rem;margin-bottom:.5rem}
.rk-link{font-size:.8rem;font-weight:700;color:rgb(var(--brand-600))}
.rk-col-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.35rem}
.rk-col-item{display:flex;align-items:center;gap:.4rem;padding:.4rem .6rem;border:1px solid #e2e8f0;border-radius:.6rem;font-size:.8rem;cursor:pointer}
.rk-table .rk-sel{width:2rem;text-align:center;padding:.25rem!important}
.rk-col-hidden,.rk-row-hidden,.rk-row-filtered{display:none!important}
.rk-report-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.75rem}
@media print{
  .rk-bar,.rk-sel,.rk-panel{display:none!important}
  .rk-table{font-size:9px!important}
  .rk-table th,.rk-table td{padding:3px 4px!important;border:1px solid #ddd!important}
  #sidebar,#sidebar-overlay,.no-print,body>div.sticky{display:none!important}
  body.rk-page main form:not(:has(table)){display:none!important}
  main{margin:0!important;padding:0!important;width:100%!important}
  @page{size:A4 landscape;margin:7mm}
}
