/* ==========================================================================
   BulkLens AI - Core Stylesheet
   ========================================================================== */

/* --- 1. Dashboard Styles --- */
.v4-wrap { font-family: 'Inter', sans-serif; color: #1e293b; background:#f8fafc; padding:30px; border-radius:30px; border:1px solid #e2e8f0; }
.v4-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-bottom: 25px; }
.v4-card { background: #fff; padding: 20px; border-radius: 20px; border: 1px solid #e2e8f0; box-shadow: 0 4px 10px rgba(0,0,0,0.02); }
.v4-table { width: 100%; border-collapse: separate; border-spacing: 0 10px; }
.v4-table td { padding: 15px; background: #fff; border-top: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; font-size: 13px; }
.v4-table tr td:first-child { border-left: 1px solid #f1f5f9; border-top-left-radius: 12px; border-bottom-left-radius: 12px; }
.v4-table tr td:last-child { border-right: 1px solid #f1f5f9; border-top-right-radius: 12px; border-bottom-right-radius: 12px; }
.col-hidden { display: none !important; }
.v4-drop { position: relative; display: inline-block; }
.v4-drop-content { display: none; position: absolute; right: 0; background: #fff; min-width: 250px; max-height: 400px; overflow-y: auto; box-shadow: 0 10px 25px rgba(0,0,0,0.1); border-radius: 12px; padding: 15px; z-index: 99; border: 1px solid #e2e8f0; }
.v4-drop:hover .v4-drop-content { display: block; }
.dup-flag { display: block; font-size: 8px; font-weight: 900; color: #ef4444; margin-top: 4px; text-transform: uppercase; }
.credibility-badge { background:#eff6ff; color:#3b82f6; padding:4px 8px; border-radius:6px; font-weight:800; font-size:11px; display:inline-block; }

/* --- 2. Welcome & Placeholder Banners --- */
.inv-welcome { background: linear-gradient(135deg, #1e293b 0%, #334155 100%); color: #fff; padding: 40px; border-radius: 24px; margin-bottom: 25px; font-family: 'Inter', sans-serif; }
.inv-welcome h1 { margin:0; font-size: 2rem; color: #fff; }
.inv-welcome p { opacity: 0.8; margin: 10px 0 0 0; }
.inv-placeholder-box { background:#fff; border: 2px dashed #e2e8f0; border-radius:24px; padding:60px 40px; text-align:center; font-family:'Inter', sans-serif; margin-bottom:30px; }
.inv-placeholder-box h3 { margin:0; color:#1e293b; font-weight:800; }
.inv-placeholder-box p { color:rgba(0,0,0,0.2); font-size:14px; margin:10px 0 20px 0; }

/* --- 3. Frontend Table Overrides --- */
.wptm_table.tablesorter-bootstrap, 
#wptmTbl4_wrapper { display: none !important; opacity: 0; pointer-events: none; }
.show-table .wptm_table.tablesorter-bootstrap,
.show-table #wptmTbl4_wrapper { display: table !important; opacity: 1 !important; pointer-events: auto !important; height: auto !important; }

/* --- 4. Loading Overlay & Spinner --- */
#bl-ai-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(15,23,42,0.85); backdrop-filter: blur(10px); z-index:10000000; display:none; flex-direction:column; align-items:center; justify-content:center; color:#fff; font-family:'Inter', sans-serif; }
.bl-spinner { width: 60px; height: 60px; border: 5px solid rgba(255,255,255,0.1); border-top: 5px solid #6366f1; border-radius: 50%; animation: blspin 1s linear infinite; margin-bottom: 20px; }
@keyframes blspin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.bl-loading-text { font-weight:800; font-size:14px; letter-spacing:2px; text-transform:uppercase; margin-bottom: 15px; }
.bl-progress-container { width: 300px; background: rgba(255,255,255,0.1); height: 10px; border-radius: 20px; overflow: hidden; margin-bottom: 10px; border: 1px solid rgba(255,255,255,0.2); }
#bl-progress-bar { width: 0%; height: 100%; background: #6366f1; transition: width 0.3s ease; }
#bl-progress-counter { font-size: 12px; font-weight: 700; color: #94a3b8; }

/* --- 5. Data Mapping Modal --- */
.bl-inv-modal { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(15,23,42,0.95); z-index:9999999; display:flex; align-items:center; justify-content:center; font-family:'Inter', sans-serif; }
.bl-modal-container { text-align:left; width: 100%; max-width: 500px; max-height:90vh; overflow-y:auto; background: #fff; border-radius: 24px; padding: 40px; }
.bl-close-btn { cursor:pointer; float:right; font-size:24px; font-weight:bold; color:#94a3b8; line-height: 1; }
.bl-close-btn:hover { color: #1e293b; }
.bl-modal-title { margin-top:0; color:#1e293b; font-size: 22px; }
.bl-modal-subtitle { font-size:14px; color:#64748b; margin-bottom:20px; }

.bl-input-label { font-weight:700; font-size:13px; color:#334155; display: block; margin-top: 10px; }
.bl-inv-select { width:100%; padding:10px; margin:8px 0 15px 0; border-radius:8px; border:1px solid #cbd5e1; font-size: 13px; color: #1e293b; }

.bl-modal-divider { border:0; border-top:1px solid #e2e8f0; margin:20px 0; }

.bl-adv-box { background:#f8fafc; padding:15px; border-radius:12px; border: 1px solid #e2e8f0; }
.bl-adv-tag { font-weight:800; font-size:11px; text-transform:uppercase; color:#64748b; letter-spacing:0.5px; }
.bl-adv-label { font-weight:600; font-size:12px; display:block; margin-top:12px; color:#475569; }
.bl-adv-select { width:100%; padding:8px; margin-top:5px; border-radius:6px; font-size:12px; border:1px solid #cbd5e1; color:#475569; }

.bl-brand-section { margin-top:18px; padding-top:15px; border-top:1px dashed #cbd5e1; }
.bl-brand-desc { font-size:11px; color:#94a3b8; margin:4px 0 10px 0; }
.bl-brand-grid { display:flex; flex-wrap:wrap; gap:8px; }
.bl-brand-item { flex:1 1 30%; }

.bl-btn-primary { width:100%; background:#6366f1; color:white; border:none; padding:15px; border-radius:12px; cursor:pointer; font-weight:800; margin-top:20px; transition: background 0.2s; }
.bl-btn-primary:hover { background:#4f46e5; }
.bl-btn-success { background:#10b981; color:#fff; border-radius:12px; padding:10px 20px; border:none; cursor:pointer; font-weight:700; margin-left:10px; }