/* Novel Pipeline v3 — Front-end — Arabic RTL */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap');

/* ══════════════════════════════════════════════════
   NUCLEAR OPTION: Force all text dark inside our wrap
   This overrides ANY theme dark mode CSS
══════════════════════════════════════════════════ */
#npm-front-wrap { direction:rtl; font-family:'Tajawal','Segoe UI',Tahoma,sans-serif; max-width:680px; margin:0 auto; padding:0 16px 40px; }

/* Cards always white background */
#npm-request-form { background:#ffffff !important; border-radius:20px; padding:28px; border:1px solid #e8eaf6; box-shadow:0 4px 24px rgba(79,70,229,.07); margin-bottom:28px; }
.npm-my-requests  { background:#ffffff !important; border-radius:20px; padding:24px 28px; border:1px solid #e8eaf6; }

/* Every text element inside form — force dark */
#npm-request-form,
#npm-request-form *:not(button):not(.npm-source-badge):not(.npm-tooltip-box):not(.npm-tooltip-box *) {
    color:#1a1a2e !important;
}

/* Labels specifically */
.npm-field-label,
label.npm-field-label {
    display:block !important;
    font-size:14px !important;
    font-weight:600 !important;
    margin-bottom:8px !important;
    color:#1a1a2e !important;
}
.req { color:#EF4444 !important; }

/* My requests section text */
.npm-my-title { font-size:17px !important; font-weight:700 !important; margin:0 0 18px !important; color:#1a1a2e !important; padding-bottom:14px; border-bottom:1px solid #f0f0f0; }
.npm-my-req-title { font-size:14px !important; font-weight:600 !important; color:#1a1a2e !important; }
.npm-my-req-date  { font-size:12px !important; color:#9ca3af !important; }
.npm-my-req-reason { font-size:12px !important; color:#DC2626 !important; margin-top:3px; display:block; font-weight:500; }

/* INPUTS — the most aggressive possible override */
.npm-input,
input.npm-input,
textarea.npm-input {
    display:block !important;
    width:100% !important;
    padding:12px 16px !important;
    border:1.5px solid #e5e7eb !important;
    border-radius:12px !important;
    font-size:14px !important;
    font-family:'Tajawal',sans-serif !important;
    color:#1a1a2e !important;
    background-color:#f5f5fb !important;
    -webkit-text-fill-color:#1a1a2e !important;
    caret-color:#4F46E5 !important;
    box-sizing:border-box !important;
    outline:none !important;
    transition:border-color .2s,box-shadow .2s;
    resize:vertical;
}
.npm-textarea { min-height:100px; }

.npm-input::placeholder {
    color:#a0aec0 !important;
    -webkit-text-fill-color:#a0aec0 !important;
    opacity:1 !important;
}

.npm-input:focus {
    border-color:#4F46E5 !important;
    background-color:#ffffff !important;
    color:#1a1a2e !important;
    -webkit-text-fill-color:#1a1a2e !important;
    box-shadow:0 0 0 4px rgba(79,70,229,.08) !important;
}

/* Autofill */
.npm-input:-webkit-autofill,
.npm-input:-webkit-autofill:hover,
.npm-input:-webkit-autofill:focus {
    -webkit-text-fill-color:#1a1a2e !important;
    -webkit-box-shadow:0 0 0 1000px #f5f5fb inset !important;
    caret-color:#4F46E5 !important;
}

/* Login gate */
.npm-front-login { text-align:center; padding:60px 30px; background:linear-gradient(135deg,#f8f7ff,#f0f4ff); border-radius:20px; border:1px solid #e0e7ff; }
.npm-front-login-icon { font-size:52px; margin-bottom:16px; }
.npm-front-login h2 { font-size:22px; font-weight:700; margin:0 0 10px; color:#1a1a2e !important; }
.npm-front-login p  { font-size:15px; color:#6b7280 !important; line-height:1.7; margin:0 0 24px; }

/* Header */
.npm-front-header { display:flex; align-items:center; gap:14px; background:linear-gradient(135deg,#4F46E5,#7C3AED); border-radius:16px; padding:18px 22px; margin-bottom:28px; color:#fff; }
.npm-front-avatar { width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.25); display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:700; flex-shrink:0; overflow:hidden; color:#fff !important; }
.npm-front-avatar img { width:48px; height:48px; border-radius:50%; object-fit:cover; display:block; }
.npm-front-welcome { font-size:17px; font-weight:700; color:#fff !important; }
.npm-front-limit   { font-size:13px; opacity:.85; margin-top:2px; color:#fff !important; }

/* Field wrapper */
.npm-front-field { margin-bottom:22px; }

/* Label row */
.npm-label-row { display:flex; align-items:center; gap:7px; margin-bottom:8px; }
.npm-label-row .npm-field-label { margin-bottom:0 !important; }

/* Tooltip */
.npm-tooltip-wrap { position:relative; display:inline-flex; align-items:center; }
.npm-tooltip-icon { width:18px; height:18px; border-radius:50%; background:#4F46E5; color:#fff !important; -webkit-text-fill-color:#fff !important; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; cursor:pointer; flex-shrink:0; user-select:none; transition:background .2s; }
.npm-tooltip-icon:hover { background:#4338CA; }
.npm-tooltip-box { position:absolute; top:calc(100% + 8px); right:0; background:#1e1b4b !important; border-radius:12px; padding:14px 16px; font-size:13px; line-height:1.8; width:260px; box-shadow:0 8px 24px rgba(0,0,0,.25); z-index:9999; white-space:normal; }
.npm-tooltip-box * { color:#fff !important; -webkit-text-fill-color:#fff !important; }
.npm-tooltip-title { font-weight:700; margin-bottom:8px; color:#fff !important; }
.npm-tooltip-site  { display:flex; align-items:center; gap:6px; color:#fff !important; }
.npm-tooltip-site span { font-weight:700; color:#fff !important; }
.npm-tooltip-note  { margin-top:8px; font-size:12px; opacity:.8; color:#fff !important; }
.npm-tooltip-box::before { content:''; position:absolute; top:-6px; right:6px; border:6px solid transparent; border-bottom-color:#1e1b4b; border-top:none; }

/* Source badge */
.npm-source-badge { display:inline-flex; align-items:center; gap:6px; margin-top:8px; padding:5px 14px; border-radius:20px; font-size:13px; font-weight:600; }
.npm-source-novelfull   { background:#D1FAE5 !important; color:#065F46 !important; -webkit-text-fill-color:#065F46 !important; }
.npm-source-royalroad   { background:#DBEAFE !important; color:#1E40AF !important; -webkit-text-fill-color:#1E40AF !important; }
.npm-source-scribblehub { background:#FCE7F3 !important; color:#9D174D !important; -webkit-text-fill-color:#9D174D !important; }
.npm-source-other       { background:#FEF3C7 !important; color:#92400E !important; -webkit-text-fill-color:#92400E !important; }

/* Form status */
#npm-form-status { padding:12px 16px; border-radius:10px; font-size:14px; font-weight:500; margin-bottom:16px; }
#npm-form-status.success { background:#D1FAE5 !important; color:#065F46 !important; -webkit-text-fill-color:#065F46 !important; border:1px solid #A7F3D0; }
#npm-form-status.error   { background:#FEE2E2 !important; color:#991B1B !important; -webkit-text-fill-color:#991B1B !important; border:1px solid #FECACA; }
#npm-form-status.loading { background:#EEF2FF !important; color:#3730A3 !important; -webkit-text-fill-color:#3730A3 !important; border:1px solid #C7D2FE; }

/* Submit button */
.npm-front-btn { display:inline-flex; align-items:center; justify-content:center; padding:0 28px; height:48px; border-radius:12px; font-size:15px; font-weight:700; font-family:'Tajawal',sans-serif; cursor:pointer; border:none; background:linear-gradient(135deg,#4F46E5,#7C3AED); color:#fff !important; -webkit-text-fill-color:#fff !important; text-decoration:none; transition:.2s; box-shadow:0 4px 14px rgba(79,70,229,.3); }
.npm-front-btn:hover { opacity:.9; transform:translateY(-1px); }
.npm-front-btn:active { transform:translateY(0); }
.npm-submit-btn { width:100%; }
.npm-submit-btn:disabled { opacity:.5; cursor:not-allowed; transform:none; }

/* My requests list */
.npm-my-req-item { display:flex; align-items:flex-start; justify-content:space-between; padding:12px 0; border-bottom:1px solid #f5f5f5; gap:10px; }
.npm-my-req-item:last-child { border-bottom:none; }
.npm-my-req-status { font-size:11px; font-weight:700; padding:3px 10px; border-radius:20px; white-space:nowrap; flex-shrink:0; }
.status-pending  { background:#EEF2FF !important; color:#4338CA !important; -webkit-text-fill-color:#4338CA !important; }
.status-accepted { background:#D1FAE5 !important; color:#065F46 !important; -webkit-text-fill-color:#065F46 !important; }
.status-rejected { background:#FEE2E2 !important; color:#991B1B !important; -webkit-text-fill-color:#991B1B !important; }

.npm-loading     { text-align:center; color:#9ca3af !important; font-size:14px; padding:20px 0; }
.npm-no-requests { text-align:center; color:#9ca3af !important; font-size:14px; padding:20px 0; }

/* Login buttons row */
.npm-login-btns {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 4px;
}
.npm-btn-outline {
    background: transparent !important;
    border: 2px solid #4F46E5 !important;
    color: #4F46E5 !important;
    -webkit-text-fill-color: #4F46E5 !important;
    box-shadow: none !important;
}
.npm-btn-outline:hover {
    background: #4F46E5 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}
