/* ═══════════════════════════════════════════════════════════════════
   Easy BOQ — Base Stylesheet
   Moved out of index.html inline <style> to support strict CSP
   ═══════════════════════════════════════════════════════════════════ */

:root{
  --bg:#0f172a; --panel:#111827; --border:#1f2937;
  --text:#e5e7eb; --sub:#9ca3af;
  --blue:#3b82f6; --green:#10b981; --red:#ef4444; --yellow:#f59e0b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Segoe UI",Sarabun,sans-serif}
#root{min-height:100vh}
.loading{display:flex;align-items:center;justify-content:center;min-height:100vh;color:#9ca3af;font-size:14px}
table{border-collapse:collapse;width:100%}
input,button,select,textarea{font-family:inherit}

/* ═══════════════════════════════════════════════════════════════════
   Analyze BOQ — "ซุมเข้าซุมออก + มือชี้" เพื่อให้ผู้ใช้หาปุ่มเจอง่าย
   ═══════════════════════════════════════════════════════════════════ */
@keyframes boq-pulse {
  0%, 100% { transform: scale(1);   box-shadow: 0 6px 20px rgba(16,185,129,.35), 0 0 0 0 rgba(16,185,129,.55); }
  50%      { transform: scale(1.04); box-shadow: 0 10px 32px rgba(16,185,129,.55), 0 0 0 14px rgba(16,185,129,0); }
}
@keyframes boq-point-bounce {
  0%, 100% { transform: translateY(0);    }
  50%      { transform: translateY(10px); }
}
@keyframes boq-shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position:  200% 0; }
}
@keyframes boq-arrow-fade {
  0%, 100% { opacity: .3; transform: translateY(0); }
  50%      { opacity: 1;  transform: translateY(6px); }
}

.boq-analyze-btn{
  display:flex; align-items:center; justify-content:center; gap:12px;
  width:100%;
  padding:22px 28px;
  font-size:20px; font-weight:900; letter-spacing:.5px;
  color:#fff;
  background: linear-gradient(135deg,#10b981 0%, #059669 50%, #047857 100%);
  background-size: 200% 100%;
  border: 3px solid #065f46;
  border-radius: 16px;
  cursor: pointer;
  animation: boq-pulse 1.8s ease-in-out infinite, boq-shimmer 3s linear infinite;
  transition: transform .15s ease, filter .15s ease;
  position: relative;
  overflow: hidden;
}
.boq-analyze-btn:hover{ filter: brightness(1.08); transform: scale(1.06); }
.boq-analyze-btn:active{ transform: scale(.98); }

/* Disabled state — แสดงตลอด แต่เป็นสีเทา ไม่กะพริบ (ยังคลิกได้ = เปิด file picker) */
.boq-analyze-btn--disabled{
  background: linear-gradient(135deg,#e5e7eb,#d1d5db) !important;
  background-size: 100% 100% !important;
  color: #6b7280 !important;
  border-color: #9ca3af !important;
  animation: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.08) !important;
  cursor: pointer;
}
.boq-analyze-btn--disabled:hover{ filter:brightness(1.02); transform: scale(1.01); }
.boq-analyze-btn--disabled .boq-btn-icon{ animation: none; }
.boq-analyze-btn .boq-btn-icon{
  display:inline-block; font-size:28px;
  animation: boq-point-bounce 1.2s ease-in-out infinite;
}
.boq-pointer-row{
  display:flex; align-items:center; justify-content:center; gap:10px;
  margin: 8px 0 4px 0;
  font-size:14px; color:#059669; font-weight:800;
  animation: boq-arrow-fade 1.2s ease-in-out infinite;
}
.boq-pointer-row .ptr-arrow{ font-size:18px; }

/* ═══════════════════════════════════════════════════════════════════
   Drop Zone Pulse — ชี้มาที่พื้นที่ "ลาก PDF มาวางที่นี่" จริงๆ
   เด่นตั้งแต่เข้าหน้า ก่อนจะมีไฟล์ (พอมีไฟล์แล้ว class นี้ถูกถอด)
   ═══════════════════════════════════════════════════════════════════ */
@keyframes boq-drop-pulse {
  0%, 100% {
    border-color: #3b82f6;
    box-shadow: 0 0 0 0 rgba(59,130,246,.55), 0 6px 22px rgba(59,130,246,.18);
    transform: scale(1);
  }
  50% {
    border-color: #60a5fa;
    box-shadow: 0 0 0 16px rgba(59,130,246,0), 0 12px 34px rgba(59,130,246,.38);
    transform: scale(1.015);
  }
}
@keyframes boq-drop-text-pulse {
  0%, 100% { color:#1d4ed8; transform: scale(1);    text-shadow: 0 2px 10px rgba(59,130,246,.25); }
  50%      { color:#2563eb; transform: scale(1.06); text-shadow: 0 4px 18px rgba(59,130,246,.55); }
}
.boq-drop-zone{
  border:3px dashed #3b82f6 !important;
  border-radius:14px !important;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 50%, #eff6ff 100%) !important;
  background-size: 200% 100% !important;
  animation:
    boq-drop-pulse 1.8s ease-in-out infinite,
    boq-shimmer 4s linear infinite;
  position:relative;
  overflow:hidden;
}
.boq-drop-zone::before{
  content: "👇";
  position:absolute;
  top:4px; left:50%; transform: translateX(-50%);
  font-size: 22px;
  animation: boq-point-bounce 1.2s ease-in-out infinite;
  pointer-events:none;
  filter: drop-shadow(0 2px 4px rgba(59,130,246,.4));
}
.boq-drop-zone::after{
  content: "👆";
  position:absolute;
  bottom:4px; left:50%; transform: translateX(-50%);
  font-size: 22px;
  animation: boq-point-bounce 1.2s ease-in-out infinite reverse;
  pointer-events:none;
  filter: drop-shadow(0 2px 4px rgba(59,130,246,.4));
}
.boq-drop-zone-title{
  animation: boq-drop-text-pulse 1.6s ease-in-out infinite;
  font-weight:900 !important;
  color:#1d4ed8 !important;
}
.boq-drop-zone-sub{
  color:#2563eb !important;
  font-weight:600 !important;
}