/* ═══════════════════════════════════════
   QFM Pre-Approval Generator v7.0.0 — Styles
   ═══════════════════════════════════════ */
#qfm-pa-app { font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 1200px; margin: 0 auto; padding: 10px 0 40px; }
#qfm-pa-app *, #qfm-pa-app *::before, #qfm-pa-app *::after { box-sizing: border-box; }

/* ── Login ── */
.qfm-pa-login-card { max-width: 460px; margin: 0 auto; background: #fff; border-radius: 16px; box-shadow: 0 6px 36px rgba(10,36,66,.10); overflow: hidden; animation: qfmSlide .5s ease; }
@keyframes qfmSlide { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }

.qfm-pa-login-header { background: linear-gradient(135deg,#0a2442,#164a8a); padding: 36px 32px 28px; text-align: center; position: relative; }
.qfm-pa-login-header::after { content:''; position:absolute; bottom:0; left:0; right:0; height:4px; background:linear-gradient(90deg,#2196F3,#5bbef5,#0a2442); }
.qfm-pa-lock-icon { width:60px;height:60px;background:rgba(255,255,255,.10);border:2px solid rgba(255,255,255,.18);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px; }
.qfm-pa-lock-icon svg { width:28px; height:28px; }
.qfm-pa-login-header h3 { color:#fff; font-size:21px; font-weight:700; margin:0 0 6px; }
.qfm-pa-login-header p { color:rgba(255,255,255,.6); font-size:13px; margin:0; }
.qfm-pa-login-body { padding: 32px; }

/* ── Shared fields ── */
.qfm-pa-field { margin-bottom: 18px; }
.qfm-pa-field label { display:block; font-size:11px; font-weight:700; color:#0a2442; text-transform:uppercase; letter-spacing:0.5px; margin-bottom:3px; }
.qfm-pa-field input, .qfm-pa-field select, .qfm-pa-field textarea { width:100%; padding:9px 12px; border:2px solid #dce4ec; border-radius:8px; font-size:14px; font-family:inherit; color:#1a2a3a; background:#f7f9fb; outline:none; transition:border-color .25s,box-shadow .25s,background .25s; }
.qfm-pa-field input:focus, .qfm-pa-field select:focus, .qfm-pa-field textarea:focus { border-color:#2196F3; background:#fff; box-shadow:0 0 0 4px rgba(33,150,243,.10); }
.qfm-pa-field input::placeholder, .qfm-pa-field textarea::placeholder { color:#a0b0c0; }
.qfm-pa-field textarea { resize: vertical; }
.qfm-pa-pw-wrap { position:relative; }
.qfm-pa-pw-wrap input { padding-right:44px; }
.qfm-pa-pw-toggle { position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#8a9ab0;padding:4px;display:flex;align-items:center; }
.qfm-pa-pw-toggle:hover { color:#164a8a; }
.qfm-req { color:#d94545; }
.qfm-pa-hint { color:#8a9ab0; font-size:12px; margin-top:4px; display:block; }
.qfm-pa-hint code { background:#edf2f7; padding:1px 5px; border-radius:3px; font-size:11px; }
.qfm-pa-static-val { font-weight:600; color:#0a2442; padding:8px 0; font-size:14px; }

/* ── Buttons ── */
.qfm-pa-btn-primary { width:100%; padding:13px 20px; background:linear-gradient(135deg,#164a8a,#0a2442); color:#fff; border:none; border-radius:10px; font-family:inherit; font-size:14px; font-weight:700; letter-spacing:.7px; text-transform:uppercase; cursor:pointer; transition:transform .2s,box-shadow .2s,opacity .2s; display:flex;align-items:center;justify-content:center; }
.qfm-pa-btn-primary:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(22,74,138,.35); }
.qfm-pa-btn-primary:disabled { opacity:.7; cursor:not-allowed; transform:none!important; box-shadow:none!important; }
.qfm-pa-btn-secondary { padding:13px 24px; background:#fff; color:#0a2442; border:2px solid #dce4ec; border-radius:10px; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; transition:border-color .2s; }
.qfm-pa-btn-secondary:hover { border-color:#2196F3; color:#164a8a; }
.qfm-pa-btn-sm { padding:7px 14px; border-radius:8px; font-family:inherit; font-size:12px; font-weight:600; cursor:pointer; border:1.5px solid #dce4ec; background:#fff; color:#0a2442; transition:all .2s; white-space:nowrap; }
.qfm-pa-btn-sm:hover { border-color:#2196F3; color:#164a8a; }
.qfm-pa-btn-sm-primary { padding:10px 20px; width:auto; font-size:13px; }
.qfm-pa-spinner { width:20px;height:20px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:qfmSpin .6s linear infinite; }
@keyframes qfmSpin { to{transform:rotate(360deg)} }
.qfm-pa-error { color:#d94545; font-size:13px; font-weight:600; text-align:center; margin-top:14px; min-height:20px; }

/* ── Panel ── */
.qfm-pa-panel { background:#fff; border-radius:16px; box-shadow:0 6px 36px rgba(10,36,66,.10); overflow:hidden; animation:qfmSlide .5s ease; }
.qfm-pa-panel-header { background:linear-gradient(135deg,#0a2442,#164a8a); padding:14px 20px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.qfm-pa-fh-left { display:flex; align-items:center; gap:12px; flex-shrink:0; }
.qfm-pa-fh-left h3 { color:#fff; font-size:16px; font-weight:700; margin:0; }
.qfm-pa-welcome { color:rgba(255,255,255,.55); font-size:12px; }
.qfm-pa-btn-signout { background:rgba(255,255,255,.10); border:1.5px solid rgba(255,255,255,.22); color:#fff; padding:7px 16px; border-radius:8px; font-family:inherit; font-size:11px; font-weight:600; letter-spacing:.5px; text-transform:uppercase; cursor:pointer; transition:background .2s; flex-shrink:0; }
.qfm-pa-btn-signout:hover { background:rgba(255,255,255,.2); }

/* ── Global Search ── */
.qfm-pa-global-search { position:relative; flex:1; max-width:280px; min-width:160px; }
.qfm-pa-global-search svg { position:absolute; left:10px; top:50%; transform:translateY(-50%); pointer-events:none; z-index:1; }
.qfm-pa-global-search input { width:100%; padding:8px 12px 8px 32px; border:1.5px solid rgba(255,255,255,.2); border-radius:8px; font-size:13px; font-family:inherit; background:rgba(255,255,255,.08); color:#fff; outline:none; transition:all .25s; }
.qfm-pa-global-search input::placeholder { color:rgba(255,255,255,.4); }
.qfm-pa-global-search input:focus { background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.4); }
.qfm-pa-gsearch-dropdown { position:absolute; top:100%; left:0; right:0; background:#fff; border-radius:10px; box-shadow:0 10px 40px rgba(0,0,0,.2); z-index:9999; margin-top:6px; overflow:hidden; max-height:300px; overflow-y:auto; }
.qfm-pa-gs-item { padding:10px 14px; cursor:pointer; font-size:13px; color:#1a2a3a; border-bottom:1px solid #f0f3f6; display:flex; align-items:center; gap:8px; }
.qfm-pa-gs-item:hover { background:#f0f6ff; }
.qfm-pa-gs-item:last-child { border-bottom:none; }
.qfm-pa-gs-sub { color:#8a9ab0; font-size:11px; margin-left:auto; }

/* ── Tabs ── */
.qfm-pa-tabs { display:flex; border-bottom:2px solid #edf2f7; padding:0 20px; background:#f4f7fb; overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-behavior:smooth; scrollbar-width:none; }
.qfm-pa-tab { padding:14px 18px; background:none; border:none; border-bottom:3px solid transparent; font-family:inherit; font-size:13px; font-weight:700; color:#4a5d72; cursor:pointer; display:flex; align-items:center; gap:7px; transition:all .2s; margin-bottom:-2px; white-space:nowrap; }
.qfm-pa-tab:hover { color:#164a8a; background:rgba(22,74,138,.04); }
.qfm-pa-tab.active { color:#fff; background:linear-gradient(135deg,#164a8a,#1e5faa); border-bottom-color:#2196F3; border-radius:8px 8px 0 0; }
.qfm-pa-tab.active svg { stroke:#fff; }
.qfm-pa-tab svg { flex-shrink:0; stroke:#5a7a98; }
.qfm-pa-tab:hover svg { stroke:#164a8a; }
.qfm-pa-tab-content { display:none; padding:20px; }
.qfm-pa-tab-content.active { display:block; }

/* ── Sections & Grid ── */
.qfm-pa-section-label { font-size:12px; font-weight:700; color:#164a8a; text-transform:uppercase; letter-spacing:.8px; margin-bottom:12px; padding-bottom:8px; border-bottom:2px solid #d0e2f7; }
.qfm-pa-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 20px; }
.qfm-pa-grid-3 { grid-template-columns:1fr 1fr 1fr; }
.qfm-pa-grid .qfm-pa-field, .qfm-pa-grid-4 .qfm-pa-field { margin-bottom:0; }
.qfm-pa-full { grid-column:1/-1; }
.qfm-pa-span2 { grid-column:span 2; }
.qfm-pa-actions { margin-top:24px; display:flex; gap:12px; }
.qfm-pa-actions .qfm-pa-btn-primary { flex:1; }

/* ── Stats ── */
.qfm-pa-stats { display:flex; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.qfm-pa-stat { background:linear-gradient(135deg,#e8f0fe,#f0f6ff); border:1.5px solid #b4cdee; border-radius:10px; padding:14px 20px; min-width:130px; max-width:220px; text-align:center; flex:1; }
.qfm-pa-stat-num { font-size:26px; font-weight:800; color:#164a8a; display:block; line-height:1.2; }
.qfm-pa-stat-label { font-size:11px; color:#4a6a8a; text-transform:uppercase; letter-spacing:.5px; font-weight:600; }

/* ── Toolbar ── */
.qfm-pa-toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; flex-wrap:wrap; }
.qfm-pa-search-wrap { position:relative; flex:1; min-width:160px; }
.qfm-pa-search-wrap svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); pointer-events:none; }
.qfm-pa-search-wrap input { width:100%; padding:9px 12px 9px 34px; border:2px solid #dce4ec; border-radius:10px; font-size:13px; font-family:inherit; background:#f7f9fb; outline:none; transition:all .25s; }
.qfm-pa-search-wrap input:focus { border-color:#2196F3; background:#fff; box-shadow:0 0 0 4px rgba(33,150,243,.10); }
.qfm-pa-toolbar-btns { display:flex; gap:8px; flex-wrap:wrap; }

/* ── Table ── */
.qfm-pa-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.qfm-pa-table { width:100%; border-collapse:collapse; font-size:13px; table-layout:auto; }
.qfm-pa-table-compact { font-size:12px; }
.qfm-pa-table-compact th { font-size:10px; padding:8px 8px; }
.qfm-pa-table-compact td { padding:10px 8px; }
.qfm-pa-table th { text-align:left; padding:10px 10px; font-size:11px; font-weight:700; color:#164a8a; text-transform:uppercase; letter-spacing:.5px; border-bottom:2px solid #edf2f7; white-space:nowrap; background:#f4f7fb; }
.qfm-pa-table td { padding:11px 10px; border-bottom:1px solid #f0f3f6; vertical-align:top; }
.qfm-pa-table tbody tr:hover { background:#f8faff; }
.qfm-pa-table .qfm-pa-name { font-weight:700; color:#0a2442; }
.qfm-pa-table .qfm-pa-sub { font-size:11px; color:#8a9ab0; display:block; }
.qfm-pa-table a { color:#164a8a; text-decoration:none; }
.qfm-pa-table a:hover { text-decoration:underline; }
.qfm-pa-empty { text-align:center; padding:40px 20px!important; color:#8a9ab0; font-style:italic; }
.qfm-pa-td-actions { white-space:nowrap; }
.qfm-pa-td-actions .qfm-pa-btn-sm { margin-right:3px; margin-bottom:3px; }
.qfm-pa-ellipsis { max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ── Pagination ── */
.qfm-pa-pagination { display:flex; justify-content:center; gap:6px; margin-top:16px; }
.qfm-pa-page-btn { padding:6px 12px; border:1.5px solid #dce4ec; border-radius:6px; background:#fff; font-family:inherit; font-size:13px; font-weight:600; color:#0a2442; cursor:pointer; transition:all .2s; }
.qfm-pa-page-btn:hover { border-color:#2196F3; }
.qfm-pa-page-btn.active { background:#164a8a; color:#fff; border-color:#164a8a; }
.qfm-pa-page-btn:disabled { opacity:.4; cursor:default; }

/* ── Modal ── */
.qfm-pa-overlay { position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,.45); z-index:99998; }
.qfm-pa-modal { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:16px; box-shadow:0 20px 60px rgba(0,0,0,.25); z-index:99999; width:520px; max-width:92vw; max-height:90vh; overflow-y:auto; }
.qfm-pa-modal-header { display:flex; justify-content:space-between; align-items:center; padding:18px 24px; border-bottom:1px solid #edf2f7; }
.qfm-pa-modal-header h3 { margin:0; font-size:17px; color:#0a2442; }
.qfm-pa-modal-close { background:none; border:none; font-size:24px; color:#8a9ab0; cursor:pointer; padding:0 4px; line-height:1; }
.qfm-pa-modal-close:hover { color:#d94545; }
.qfm-pa-modal-body { padding:20px 24px; }
.qfm-pa-modal-body .qfm-pa-field { margin-bottom:14px; }
.qfm-pa-modal-footer { padding:16px 24px; border-top:1px solid #edf2f7; display:flex; justify-content:flex-end; gap:10px; }

/* ── Toast ── */
.qfm-pa-toast { position:fixed; top:24px; right:24px; background:#1a9d5c; color:#fff; padding:14px 22px; border-radius:10px; font-family:inherit; font-weight:600; font-size:14px; box-shadow:0 8px 28px rgba(26,157,92,.3); z-index:999999; display:flex; align-items:center; gap:8px; animation:qfmToastIn .4s ease,qfmToastOut .4s ease 2.8s forwards; }
.qfm-pa-toast.error { background:#d94545; box-shadow:0 8px 28px rgba(217,69,69,.3); }
@keyframes qfmToastIn { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }
@keyframes qfmToastOut { to{opacity:0;transform:translateY(-16px)} }

/* ── Badge ── */
.qfm-pa-badge { display:inline-flex;align-items:center;justify-content:center;background:#d94545;color:#fff;font-size:11px;font-weight:700;min-width:20px;height:20px;border-radius:10px;padding:0 6px;margin-left:6px; }
.qfm-pa-badge:empty,.qfm-pa-badge[data-count="0"] { background:#8a9ab0; }

/* ── Status filter buttons ── */
.qfm-pa-status-btn { cursor:pointer; padding:8px 16px; border-radius:8px; font-size:13px; font-weight:700; transition:all .2s; border:2px solid #d0d5dc; background:#f5f7fa; color:#4a5d72; letter-spacing:0.3px; }
.qfm-pa-status-btn.active { background:#164a8a !important; color:#fff !important; border-color:#164a8a !important; }
.qfm-pa-status-btn:hover:not(.active) { background:#e8ecf2; border-color:#a0b0c4; }

/* ── From-request notice ── */
.qfm-pa-from-request { display:flex; justify-content:space-between; align-items:center; background:#fff8e1; border:1.5px solid #ffe082; border-radius:10px; padding:12px 18px; margin-bottom:18px; font-size:13px; color:#5d4037; }

/* ── Split Action Buttons ── */
.qfm-pa-actions-split { display:flex; align-items:center; gap:12px; justify-content:space-between; }
.qfm-pa-actions-main { display:flex; gap:10px; flex:1; justify-content:flex-end; }
.qfm-pa-btn-action { padding:13px 24px; border:none; border-radius:10px; font-family:inherit; font-size:13.5px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; cursor:pointer; transition:transform .2s,box-shadow .2s,opacity .2s; display:flex;align-items:center;justify-content:center; min-width:180px; }
.qfm-pa-btn-action:hover { transform:translateY(-2px); }
.qfm-pa-btn-action:disabled { opacity:.7; cursor:not-allowed; transform:none!important; box-shadow:none!important; }

/* ── Multi-Email Recipients ── */
.qfm-pa-email-recipients-wrap { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px 12px; border:2px solid #dce4ec; border-radius:10px; background:#f7f9fb; min-height:46px; cursor:text; transition:border-color .25s,box-shadow .25s; }
.qfm-pa-email-recipients-wrap:focus-within { border-color:#2196F3; background:#fff; box-shadow:0 0 0 4px rgba(33,150,243,.10); }
.qfm-pa-email-tags { display:flex; flex-wrap:wrap; gap:6px; }
.qfm-pa-email-tag { display:inline-flex; align-items:center; gap:4px; background:linear-gradient(135deg,#e8eef6,#dce6f2); color:#193260; padding:4px 8px 4px 10px; border-radius:16px; font-size:12.5px; font-weight:600; animation:qfmSlide .3s ease; }
.qfm-pa-email-tag-remove { background:none; border:none; color:#8a9ab0; cursor:pointer; font-size:14px; line-height:1; padding:0 2px; border-radius:50%; transition:color .2s; }
.qfm-pa-email-tag-remove:hover { color:#d94545; }
.qfm-pa-email-multi-input { flex:1; min-width:180px; border:none!important; background:transparent!important; padding:4px 0!important; font-size:13px; outline:none!important; box-shadow:none!important; }

/* ── Result Screen ── */
.qfm-pa-result-screen { text-align:center; padding:50px 20px; animation:qfmSlide .5s ease; }
.qfm-pa-result-icon { width:80px; height:80px; border-radius:50%; font-size:36px; display:flex; align-items:center; justify-content:center; margin:0 auto 20px; }
.qfm-pa-result-icon.success { background:#d4edda; color:#155724; }
.qfm-pa-result-icon.error { background:#f8d7da; color:#721c24; }
.qfm-pa-result-screen h3 { font-size:22px; margin:0 0 10px; }
.qfm-pa-result-screen h3.success { color:#155724; }
.qfm-pa-result-screen h3.error { color:#721c24; }
.qfm-pa-result-screen p { color:#5a6a7a; font-size:14px; max-width:500px; margin:0 auto 24px; line-height:1.6; }
.qfm-pa-result-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }

/* ── Status badges in table ── */
.qfm-pa-status { padding:3px 10px; border-radius:12px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; }
.qfm-pa-status-pending { background:#fff3cd; color:#856404; }
.qfm-pa-status-approved { background:#d4edda; color:#155724; }
.qfm-pa-status-declined { background:#f8d7da; color:#721c24; }

/* ── Public request form ── */
#qfm-pa-request-app, #qfm-pa-request-app *, #qfm-pa-request-app *::before, #qfm-pa-request-app *::after { box-sizing:border-box; }
#qfm-pa-request-app { font-family:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; }
.qfm-pa-request-card { max-width:1100px; margin:0 auto; background:#fff; border-radius:16px; box-shadow:0 6px 36px rgba(10,36,66,.10); overflow:hidden; animation:qfmSlide .5s ease; }
.qfm-pa-request-header { background:linear-gradient(135deg,#0a2442,#164a8a); padding:28px 28px 22px; display:flex; align-items:center; gap:14px; position:relative; }
.qfm-pa-request-header::after { content:''; position:absolute; bottom:0; left:0; right:0; height:4px; background:linear-gradient(90deg,#2196F3,#5bbef5,#0a2442); }
.qfm-pa-request-header h3 { color:#fff; font-size:19px; font-weight:700; margin:0; }
.qfm-pa-request-header p { color:rgba(255,255,255,.6); font-size:13px; margin:4px 0 0; }
.qfm-pa-request-body { padding:28px; }

/* ── Success message ── */
.qfm-pa-success-msg { text-align:center; padding:40px 20px; }
.qfm-pa-success-icon { width:70px; height:70px; border-radius:50%; background:#d4edda; color:#155724; font-size:32px; display:flex; align-items:center; justify-content:center; margin:0 auto 16px; font-weight:700; }
.qfm-pa-success-msg h3 { color:#155724; font-size:22px; margin:0 0 10px; }
.qfm-pa-success-msg p { color:#5a6a7a; font-size:15px; max-width:400px; margin:0 auto; line-height:1.6; }

/* ── Delete / Checkbox ── */
.qfm-pa-btn-danger{background:#fff0f0!important;color:#c00!important;border-color:#e8a0a0!important;font-weight:600;}
.qfm-pa-btn-danger:hover{background:#ffe0e0!important;}
.qfm-pa-dir-chk{width:16px;height:16px;cursor:pointer;accent-color:#164a8a;}
#qfm-pa-select-all{width:16px;height:16px;cursor:pointer;accent-color:#164a8a;}

/* ── Date filter & small inputs ── */
.qfm-pa-input-sm{padding:6px 10px;border:1.5px solid #d1d8e4;border-radius:8px;font-size:13px;font-family:inherit;background:#f7f9fb;outline:none;}
.qfm-pa-input-sm:focus{border-color:#2196F3;background:#fff;}
#qfm-pa-date-custom{display:inline-flex;align-items:center;gap:6px;}

/* ── Responsive ── */
@media (max-width:900px) {
  .qfm-pa-grid-3 { grid-template-columns:1fr 1fr; }
  .qfm-pa-span2 { grid-column:1/-1; }
}
@media (max-width:640px) {
  #qfm-pa-app { padding:10px 8px 30px; }
  .qfm-pa-grid, .qfm-pa-grid-3 { grid-template-columns:1fr; }
  .qfm-pa-span2 { grid-column:1; }
  .qfm-pa-actions { flex-direction:column; }
  .qfm-pa-actions-split { flex-direction:column; }
  .qfm-pa-actions-main { flex-direction:column; width:100%; }
  .qfm-pa-btn-action { width:100%; min-width:auto; }
  .qfm-pa-panel-header { flex-direction:column; gap:10px; text-align:center; }
  .qfm-pa-fh-left { justify-content:center; }
  .qfm-pa-global-search { max-width:100%; }
  .qfm-pa-tabs { padding:0 10px; }
  .qfm-pa-tab { padding:12px 12px; font-size:12px; }
  .qfm-pa-tab-content { padding:14px; }
  .qfm-pa-stats { flex-direction:column; }
  .qfm-pa-toolbar { flex-direction:column; }
  .qfm-pa-table-compact { font-size:11px; }
  .qfm-pa-table-compact th { font-size:9px; padding:6px 5px; }
  .qfm-pa-table-compact td { padding:8px 5px; }
}
.qfm-pa-badge-active { background:#e6f4ea; color:#1a7f37; padding:2px 10px; border-radius:10px; font-size:11px; font-weight:600; }
.qfm-pa-badge-disabled { background:#fde8e8; color:#c00; padding:2px 10px; border-radius:10px; font-size:11px; font-weight:600; }

/* ── Dashboard ── */
.qfm-pa-dash-kpi { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; margin-bottom:20px; }
.qfm-pa-kpi-card { background:#fff; border:1.5px solid #e4eaf2; border-radius:12px; padding:18px 20px; position:relative; overflow:hidden; transition:border-color .2s,box-shadow .2s; }
.qfm-pa-kpi-card:hover { border-color:#2196F3; box-shadow:0 4px 16px rgba(33,150,243,.08); }
.qfm-pa-kpi-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--kpi-color,#164a8a); border-radius:12px 12px 0 0; }
.qfm-pa-kpi-value { font-size:28px; font-weight:800; color:#0a2442; line-height:1.2; }
.qfm-pa-kpi-label { font-size:11px; color:#5a6a7a; text-transform:uppercase; letter-spacing:.5px; margin-top:4px; }
.qfm-pa-kpi-icon { position:absolute; top:14px; right:16px; width:36px; height:36px; border-radius:10px; display:flex; align-items:center; justify-content:center; opacity:.15; }
.qfm-pa-dash-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:16px; }
.qfm-pa-dash-card { background:#fff; border:1.5px solid #e4eaf2; border-radius:12px; padding:20px; }
.qfm-pa-dash-card-header { font-size:13px; font-weight:700; color:#0a2442; text-transform:uppercase; letter-spacing:.5px; margin-bottom:16px; padding-bottom:10px; border-bottom:1.5px solid #edf2f7; }
.qfm-pa-dash-chart { min-height:200px; }
.qfm-pa-chart-bar-wrap { display:flex; align-items:flex-end; gap:8px; height:180px; padding-top:10px; }
.qfm-pa-chart-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; }
.qfm-pa-chart-bar { width:100%; min-width:24px; background:linear-gradient(180deg,#2196F3,#164a8a); border-radius:6px 6px 0 0; transition:height .5s ease; position:relative; }
.qfm-pa-chart-bar:hover { opacity:.85; }
.qfm-pa-chart-val { font-size:10px; font-weight:700; color:#0a2442; }
.qfm-pa-chart-label { font-size:10px; color:#8a9ab0; white-space:nowrap; }
.qfm-pa-dash-programs { }
.qfm-pa-prog-row { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.qfm-pa-prog-label { font-size:12px; font-weight:600; color:#0a2442; min-width:80px; }
.qfm-pa-prog-bar-bg { flex:1; height:22px; background:#edf2f7; border-radius:6px; overflow:hidden; }
.qfm-pa-prog-bar { height:100%; border-radius:6px; transition:width .6s ease; display:flex; align-items:center; padding-left:8px; }
.qfm-pa-prog-bar span { font-size:10px; font-weight:700; color:#fff; }
.qfm-pa-dash-activity table { width:100%; }
.qfm-pa-dash-activity td { padding:8px 10px; border-bottom:1px solid #f0f3f6; font-size:12px; }
.qfm-pa-dash-activity tr:last-child td { border-bottom:none; }

/* ── Profile ── */
.qfm-pa-profile-wrap { max-width:700px; }
.qfm-pa-profile-header { display:flex; align-items:center; gap:16px; padding:16px 0; }
.qfm-pa-profile-avatar { width:56px; height:56px; border-radius:50%; background:linear-gradient(135deg,#164a8a,#0a2442); color:#fff; font-weight:700; font-size:18px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.qfm-pa-profile-header h3 { margin:0; font-size:18px; color:#0a2442; }
.qfm-pa-profile-header p { margin:4px 0 0; font-size:13px; color:#5a6a7a; }
.qfm-pa-sig-upload-zone { border:2px dashed #c8d6e5; border-radius:12px; padding:24px; text-align:center; cursor:pointer; background:#fafbfc; transition:border-color .2s,background .2s; min-height:100px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:8px; position:relative; }
.qfm-pa-sig-upload-zone:hover,.qfm-pa-sig-upload-zone.dragover { border-color:#2196F3; background:#f0f6ff; }
.qfm-pa-sig-placeholder { display:flex; flex-direction:column; align-items:center; gap:8px; color:#8a9ab0; font-size:13px; }
.qfm-pa-sig-img { max-width:300px; max-height:100px; border-radius:6px; }

@media (max-width:900px) {
  .qfm-pa-dash-grid { grid-template-columns:1fr; }
  .qfm-pa-dash-kpi { grid-template-columns:repeat(2,1fr); }
  .qfm-pa-kpi-row { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:640px) {
  .qfm-pa-dash-kpi { grid-template-columns:1fr; }
  .qfm-pa-kpi-row { grid-template-columns:1fr !important; }
}

/* KPI Cards */
.qfm-pa-kpi-row { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }

/* Status filter buttons */

/* ── Directory Action Buttons ── */
.qfm-pa-dir-btn { display:inline-flex; align-items:center; gap:5px; padding:6px 12px; border-radius:6px; font-family:inherit; font-size:12px; font-weight:600; cursor:pointer; border:1.5px solid; transition:all .2s; white-space:nowrap; line-height:1; }
.qfm-pa-dir-btn svg { flex-shrink:0; vertical-align:middle; }
.qfm-pa-dir-btn-letters { background:#e8f0fe; color:#164a8a; border-color:#b4cdee; }
.qfm-pa-dir-btn-letters:hover { background:#d0e2fa; border-color:#164a8a; }
.qfm-pa-dir-btn-email { background:#e6f4ea; color:#137333; border-color:#a8dab5; }
.qfm-pa-dir-btn-email:hover { background:#c8e6d0; border-color:#137333; }
.qfm-pa-dir-btn-sms { display:inline-flex; background:#fef7e0; color:#b45309; border-color:#f0dca0; }
.qfm-pa-dir-btn-sms:hover { background:#fde9b0; border-color:#b45309; }

/* ── Active tab badge override ── */
.qfm-pa-tab.active .qfm-pa-badge { background:rgba(255,255,255,.3); color:#fff; }

/* ── Request action buttons ── */
.qfm-pa-req-action { font-size:11px !important; padding:5px 10px !important; }

/* ── Table header color ── */
.qfm-pa-table tbody tr:nth-child(even) { background:#fafbfd; }

/* ── Better generate buttons ── */
.qfm-pa-btn-generate { background:linear-gradient(135deg,#164a8a,#0a2442); color:#fff; }
.qfm-pa-btn-generate:hover { box-shadow:0 6px 20px rgba(22,74,138,.35); transform:translateY(-1px); }
.qfm-pa-btn-email { background:linear-gradient(135deg,#1a7a4a,#0d5c34); color:#fff; }
.qfm-pa-btn-email:hover { box-shadow:0 6px 20px rgba(26,122,74,.35); transform:translateY(-1px); }

/* ── Team sub-tabs ── */
.qfm-pa-toolbar .qfm-pa-status-btn[data-team] { padding:8px 18px; font-size:13px; }
.qfm-pa-toolbar .qfm-pa-status-btn[data-team].active { background:#164a8a !important; color:#fff !important; border-color:#164a8a !important; }

/* ── Card form ── */
.qfm-pa-card-form { background:#f8fafc; border:1.5px solid #e2e8f0; border-radius:12px; padding:18px; margin-bottom:16px; }

/* ── Request Status Filter Buttons (dedicated class) ── */
.qfm-pa-req-status-btn { cursor:pointer; padding:8px 16px; border-radius:8px; font-size:13px; font-weight:700; transition:all .2s; border:2px solid; letter-spacing:0.3px; }
.qfm-pa-req-status-btn.active[data-status="pending"] { background:#e8a817 !important; color:#fff !important; border-color:#e8a817 !important; box-shadow:0 2px 8px rgba(232,168,23,.3); }
.qfm-pa-req-status-btn.active[data-status="completed"] { background:#137333 !important; color:#fff !important; border-color:#137333 !important; box-shadow:0 2px 8px rgba(19,115,51,.3); }
.qfm-pa-req-status-btn.active[data-status="declined"] { background:#c5221f !important; color:#fff !important; border-color:#c5221f !important; box-shadow:0 2px 8px rgba(197,34,31,.3); }
.qfm-pa-req-status-btn.active[data-status=""] { background:#164a8a !important; color:#fff !important; border-color:#164a8a !important; box-shadow:0 2px 8px rgba(22,74,138,.3); }
.qfm-pa-req-status-btn:not(.active) { background:#f5f7fa !important; color:#4a5d72 !important; border-color:#d0d5dc !important; }
.qfm-pa-req-status-btn:hover:not(.active) { background:#e8ecf2 !important; border-color:#a0b0c4 !important; }

/* ── Mobile improvements ── */
@media (max-width:768px) {
  .qfm-pa-panel-header { padding:10px 12px; }
  .qfm-pa-fh-left h3 { font-size:14px; }
  .qfm-pa-global-search { max-width:100%; min-width:0; }
  .qfm-pa-toolbar { flex-direction:column; align-items:stretch; }
  .qfm-pa-search-wrap { max-width:100% !important; }
  .qfm-pa-actions-split { flex-direction:column; }
  .qfm-pa-actions-main { justify-content:stretch; }
  .qfm-pa-btn-action { min-width:0 !important; flex:1; }
  .qfm-pa-modal { width:95vw; max-width:95vw; }
  .qfm-pa-table-compact th { font-size:9px; padding:6px 4px; }
  .qfm-pa-table-compact td { padding:8px 4px; font-size:11px; }
  .qfm-pa-req-action { padding:4px 8px !important; font-size:10px !important; }
}
@media (max-width:480px) {
  .qfm-pa-tabs { gap:0; }
  .qfm-pa-tab { padding:8px 8px; font-size:10px; gap:3px; }
  .qfm-pa-tab svg { width:14px; height:14px; }
  .qfm-pa-btn-signout { font-size:10px; padding:5px 10px; }
  .qfm-pa-req-status-btn { padding:6px 10px !important; font-size:11px !important; }
  .qfm-pa-dir-btn { padding:4px 6px; font-size:10px; }
  .qfm-pa-login-card { margin:0 8px; }
  .qfm-pa-login-header { padding:24px 20px 20px; }
  .qfm-pa-login-body { padding:20px; }
}

/* ── Touch targets ── */
@media (pointer:coarse) {
  .qfm-pa-btn-sm, .qfm-pa-dir-btn, .qfm-pa-req-action { min-height:40px; display:inline-flex; align-items:center; }
  .qfm-pa-tab { min-height:44px; }
}

/* ── Directory action buttons ── */
.qfm-pa-dir-btn-regen { background:#e8f0fe; color:#164a8a; border-color:#b4cdee; }
.qfm-pa-dir-btn-regen:hover { background:#d0e2fa; border-color:#164a8a; }
.qfm-pa-dir-btn-notes { background:#f8f9fa; color:#495057; border-color:#dee2e6; }
.qfm-pa-dir-btn-notes:hover { background:#e9ecef; border-color:#495057; }

/* ── Expiring badge ── */
.qfm-pa-expiring-badge { background:#fd7e14 !important; }

/* ── Select dropdown styling ── */
.qfm-pa-select-sm { padding:8px 12px; border:2px solid #dce4ec; border-radius:8px; font-size:13px; font-family:inherit; background:#f7f9fb; color:#1a2a3a; outline:none; cursor:pointer; }
.qfm-pa-select-sm:focus { border-color:#2196F3; }

@media (max-width:600px) {
  .qfm-pa-stat { min-width:0; padding:10px 12px; }
  .qfm-pa-stat-num { font-size:20px; }
}

/* ── Email template selector ── */
#qfm-pa-email-template { margin-bottom:4px; }

/* ── Reassign select in table ── */
.qfm-pa-reassign-sel { font-family:inherit; cursor:pointer; }
.qfm-pa-reassign-sel:focus { border-color:#2196F3; outline:none; }

/* ── Generate Form: Calc Strip ── */
.qfm-pa-calc-strip { display:flex; gap:12px; align-items:flex-end; margin-top:8px; padding:14px 16px; background:linear-gradient(135deg,#f0f4ff,#f7f9fb); border:1.5px solid #d0ddf0; border-radius:10px; flex-wrap:wrap; }
.qfm-pa-cs-item { flex:1; min-width:100px; }
.qfm-pa-cs-item label { font-size:10px; font-weight:700; color:#164a8a; text-transform:uppercase; letter-spacing:0.4px; margin-bottom:3px; display:block; }
.qfm-pa-cs-item input[type="text"] { width:100%; padding:9px 12px; border:2px solid #dce4ec; border-radius:8px; font-size:14px; font-family:inherit; background:#fff; color:#1a2a3a; }
.qfm-pa-cs-item input[type="text"]:focus { border-color:#2196F3; outline:none; }
.qfm-pa-cs-dp { min-width:180px; }
.qfm-pa-cs-ltv { min-width:70px; max-width:90px; text-align:center; }
.qfm-pa-dp-inline { display:flex; align-items:center; gap:5px; }
.qfm-pa-dp-eq { color:#8a9ab0; font-weight:700; font-size:14px; }
.qfm-pa-dp-amount { font-size:14px; font-weight:700; color:#164a8a; white-space:nowrap; }
.qfm-pa-ltv-badge { display:inline-block; padding:6px 10px; border-radius:8px; font-size:16px; font-weight:800; color:#137333; background:#e6f4ea; border:2px solid #b7dfc6; }
.qfm-pa-ltv-warn { font-size:9px; font-weight:600; color:#856404; background:#fff3cd; padding:2px 5px; border-radius:4px; margin-top:3px; text-align:center; }
@media (max-width:768px) {
  .qfm-pa-calc-strip { flex-direction:column; padding:10px; }
  .qfm-pa-cs-item { min-width:100%; }
  .qfm-pa-dp-inline { flex-wrap:wrap; }
}

/* ── DP% Input ── */
.qfm-pa-pct-wrap { display:flex; align-items:center; border:2px solid #dce4ec; border-radius:8px; background:#f7f9fb; overflow:hidden; transition:border-color .25s; }
.qfm-pa-pct-wrap input { border:none; outline:none; padding:9px 4px 9px 10px; font-size:14px; width:55px; font-family:inherit; text-align:right; -moz-appearance:textfield; }
.qfm-pa-pct-wrap input::-webkit-inner-spin-button { -webkit-appearance:none; }
.qfm-pa-pct-wrap:focus-within { border-color:#2196F3; background:#fff; }
.qfm-pa-pct-suf { padding:8px 12px 8px 4px; color:#164a8a; font-weight:700; font-size:14px; }

/* ── Request Form: Inline Calc Row ── */
.qfm-pa-calc-row { font-size:11px; color:#4a5d72; margin-top:4px; padding:5px 10px; background:#f0f4ff; border-radius:6px; border:1px solid #d0ddf0; }
.qfm-pa-calc-row strong { color:#164a8a; font-size:12px; }

/* ── Consent ── */
.qfm-pa-consent { margin-top:14px; padding:10px 16px; background:#f7f9fb; border:1px solid #e2e8f0; border-radius:8px; }
.qfm-pa-consent label { display:flex !important; align-items:flex-start !important; gap:10px; cursor:pointer; font-size:13px !important; line-height:1.5 !important; color:#4a5d72 !important; text-transform:none !important; letter-spacing:normal !important; font-weight:400 !important; margin-bottom:0 !important; }
.qfm-pa-consent input[type="checkbox"] { margin-top:3px; min-width:18px; min-height:18px; accent-color:#164a8a; flex-shrink:0; }

/* ── 4-Column Grid ── */
.qfm-pa-grid-4 { display:grid; grid-template-columns:1fr 1fr 1fr 1fr; gap:10px 16px; }
.qfm-pa-grid-4 .qfm-pa-span2 { grid-column:span 2; }
.qfm-pa-grid-4 .qfm-pa-span3 { grid-column:span 3; }
@media (max-width:900px) { .qfm-pa-grid-4 { grid-template-columns:1fr 1fr; } .qfm-pa-grid-4 .qfm-pa-span3 { grid-column:span 2; } }
@media (max-width:600px) { .qfm-pa-grid-4 { grid-template-columns:1fr; } .qfm-pa-grid-4 .qfm-pa-span2, .qfm-pa-grid-4 .qfm-pa-span3 { grid-column:span 1; } }

/* ── iOS auto-zoom prevention + Mobile touch ── */
@media (max-width:768px) {
  .qfm-pa-field input, .qfm-pa-field select, .qfm-pa-field textarea,
  .qfm-pa-cs-item input[type="text"],
  .qfm-pa-pct-wrap input,
  .qfm-pa-search-wrap input,
  .qfm-pa-global-search input,
  .qfm-pa-email-multi-input,
  .qfm-pa-reassign-sel,
  .qfm-pa-select-sm { font-size:16px !important; }
}

/* ── Tap highlight removal ── */
#qfm-pa-app button, #qfm-pa-app a, #qfm-pa-app select, #qfm-pa-app input,
#qfm-pa-request-app button, #qfm-pa-request-app a, #qfm-pa-request-app select, #qfm-pa-request-app input {
  -webkit-tap-highlight-color: transparent;
}

/* ── Touch-action for buttons ── */
.qfm-pa-btn-primary, .qfm-pa-btn-secondary, .qfm-pa-btn-sm, .qfm-pa-btn-action,
.qfm-pa-tab, .qfm-pa-dir-btn, .qfm-pa-req-action, .qfm-pa-page-btn,
.qfm-pa-status-btn, .qfm-pa-req-status-btn {
  touch-action: manipulation;
  -webkit-user-select: none;
  user-select: none;
}

/* ── Safe area for notched phones ── */
@supports (padding: env(safe-area-inset-bottom)) {
  .qfm-pa-panel { padding-bottom: env(safe-area-inset-bottom); }
  .qfm-pa-request-body { padding-bottom: max(28px, env(safe-area-inset-bottom)); }
  .qfm-pa-modal { margin-bottom: env(safe-area-inset-bottom); }
}

.qfm-pa-tabs::-webkit-scrollbar { display:none; }
