/* ============================================================ Workeera Smart Applicant Match — score badges + reason popup ============================================================ */ /* ── Score badge (employer + admin applicant lists) ──────── */ /* The main plugin renders the applicant name as a block element, which would push the badge onto its own line. Inline-block (with max-width so the ellipsis truncation keeps working) lets the badge sit right after the name; the job-title/meta rows below stay untouched. */ .workeera-empapps-applicant-info > .workeera-empapps-applicant-name, .workeera-admin-empapps-applicant-info > .workeera-admin-empapps-applicant-name { display: inline-block; max-width: 100%; vertical-align: middle; } .workeera-page .wsam-score-badge { display: inline-flex; align-items: center; gap: 4px; margin-left: 8px; padding: 2px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; line-height: 1.6; vertical-align: middle; white-space: nowrap; } .workeera-page .wsam-score-high { background: var(--workeera-lightsuccess-color, #d1fae5); color: var(--workeera-success-color, #047857); } .workeera-page .wsam-score-mid { background: var(--workeera-lightwarning-color, #fef3c7); color: #92400e; } .workeera-page .wsam-score-low { background: var(--workeera-lightdanger-color, #fee2e2); color: var(--workeera-danger-color, #b91c1c); } /* ── "Why?" reason button ────────────────────────────────── */ .workeera-page .wsam-reason-btn { display: inline-block; margin-left: 4px; padding: 0; border: none; background: none; color: var(--workeera-primary-color, #2271b1); font-size: 11.5px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; vertical-align: middle; } .workeera-page .wsam-reason-btn:hover, .workeera-page .wsam-reason-btn:focus { color: var(--workeera-primary-color-hover, #135e96); background: none; border: none; box-shadow: none; outline: none; } /* ── Reason popup content (AJAX-loaded) ────────────────────── The popup renders inside the main plugin's confirm modal, which is appended to — selectors here must NOT rely on .workeera-page. */ .workeera-confirmsg-modal .wsam-reason-popup { position: relative; /* anchors the absolute default loader overlay */ display: block; min-height: 96px; text-align: left; } /* Header row: colored score chip + applicant name, divided from the text */ .workeera-confirmsg-modal .wsam-reason-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--workeera-border-color, #e2e8f0); } .workeera-confirmsg-modal .wsam-reason-score { display: inline-flex; align-items: center; padding: 5px 14px; border-radius: 999px; font-size: 13px; font-weight: 700; white-space: nowrap; } .workeera-confirmsg-modal .wsam-level-high { background: var(--workeera-lightsuccess-color, #d1fae5); color: var(--workeera-success-color, #047857); } .workeera-confirmsg-modal .wsam-level-mid { background: var(--workeera-lightwarning-color, #fef3c7); color: #92400e; } .workeera-confirmsg-modal .wsam-level-low { background: var(--workeera-lightdanger-color, #fee2e2); color: var(--workeera-danger-color, #b91c1c); } .workeera-confirmsg-modal .wsam-reason-title { font-size: 15.5px; font-weight: 700; color: var(--workeera-primary-textcolor, #0f172a); overflow-wrap: anywhere; } /* AI reasoning in a soft accent box */ .workeera-confirmsg-modal .wsam-reason-text { margin: 0; padding: 12px 14px; font-size: 13.5px; line-height: 1.65; color: var(--workeera-text-muted, #475569); white-space: pre-line; background: var(--workeera-bg-soft, #f8fafc); border-left: 3px solid var(--workeera-primary-color, #4f46e5); border-radius: 0 8px 8px 0; } .workeera-confirmsg-modal .wsam-reason-error { margin: 0; font-size: 13.5px; color: var(--workeera-danger-color, #b91c1c); } /* Colored close button (brand primary, in the modal's button row) */ .workeera-confirm-popup-btns .workeera-confirm-button.wsam-reason-close-btn { background: var(--workeera-primary-color, #4f46e5); color: #ffffff; border: none; box-shadow: 0 2px 8px rgba(79, 70, 229, 0.35); transition: background 0.18s, box-shadow 0.18s; } .workeera-confirm-popup-btns .workeera-confirm-button.wsam-reason-close-btn:hover, .workeera-confirm-popup-btns .workeera-confirm-button.wsam-reason-close-btn:focus { background: var(--workeera-primary-color-hover, #4338ca); color: #ffffff; box-shadow: 0 3px 10px rgba(79, 70, 229, 0.45); outline: none; }