/* =====================================================================
   KareerKomet Talent Pool
   PSK-variable theming with light fallbacks; dark mode via PSK var flip.
   Scoped !important against Hello Biz global overrides.
   ===================================================================== */

.kktp-wrap {
	font-family: "Chakra Petch", sans-serif;
	color: var(--psk-text, #111827);
	max-width: 1100px;
	margin: 0 auto;
}
.kktp-wrap * { box-sizing: border-box; }
.kktp-muted { color: var(--psk-text-muted, #6b7280); font-size: 14px; }

/* Header */
.kktp-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.kktp-title { font-size: 22px; font-weight: 800; margin: 0; color: var(--psk-text, #111827); }
.kktp-access-note { font-size: 12px; color: var(--psk-text-muted, #9ca3af); margin: 4px 0 0; }
.kktp-count { font-size: 13px; font-weight: 600; color: var(--psk-text-muted, #6b7280); white-space: nowrap; }

/* Locked state */
.kktp-locked {
	text-align: center;
	padding: 48px 24px;
	background: var(--psk-surface, #fff) !important;
	border: 1px solid var(--psk-border, #e5e7eb) !important;
	border-radius: var(--psk-radius, 14px);
	max-width: 520px;
	margin: 0 auto;
}
.kktp-locked-icon { font-size: 40px; margin-bottom: 12px; }
.kktp-locked h3 { font-size: 20px; font-weight: 800; margin: 0 0 10px; color: var(--psk-text, #111827); }
.kktp-locked p { color: var(--psk-text-muted, #6b7280); font-size: 14px; line-height: 1.6; margin: 0 0 8px; }
.kktp-locked-sub { font-size: 13px; }
.kktp-locked .kktp-btn { margin-top: 16px; }

/* Filters */
.kktp-filters { background: var(--psk-surface, #fff) !important; border: 1px solid var(--psk-border, #e5e7eb) !important; border-radius: 12px; padding: 14px; margin-bottom: 16px; display: flex; flex-direction: column; gap: 10px; }
.kktp-filter-row { display: flex; gap: 8px; flex-wrap: wrap; }
.kktp-filter-row--selects > *, .kktp-filter-row--pay > * { flex: 1 1 auto; }
.kktp-search, .kktp-input, .kktp-select {
	padding: 9px 12px;
	border: 1.5px solid var(--psk-border, #e5e7eb) !important;
	border-radius: 8px;
	background: var(--psk-bg, #f9fafb) !important;
	color: var(--psk-text, #111827) !important;
	font-family: inherit; font-size: 14px;
	min-width: 0;
}
.kktp-search { width: 100%; }
.kktp-input--pay { max-width: 110px; }
.kktp-select--period { max-width: 140px; }
.kktp-input:disabled { opacity: .5; }
.kktp-search:focus, .kktp-input:focus, .kktp-select:focus { border-color: var(--psk-primary, #0ABFA3) !important; outline: none; }

/* Grid */
.kktp-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
@media (max-width: 780px) { .kktp-grid { grid-template-columns: 1fr; } }
.kktp-grid.kktp-loading { opacity: .5; pointer-events: none; }

/* Card */
.kktp-card {
	background: var(--psk-surface, #fff) !important;
	border: 1px solid var(--psk-border, #e5e7eb) !important;
	border-radius: 12px;
	padding: 18px;
	display: flex; flex-direction: column; gap: 12px;
}
.kktp-card-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.kktp-card-name { font-size: 17px; font-weight: 800; margin: 0; color: var(--psk-text, #111827); }
.kktp-card-headline { font-size: 13px; color: var(--psk-text-muted, #6b7280); margin: 3px 0 0; line-height: 1.4; }
.kktp-card-pay { font-size: 15px; font-weight: 800; color: var(--psk-primary, #0ABFA3) !important; white-space: nowrap; }

/* Skills */
.kktp-card-skills { display: flex; flex-wrap: wrap; gap: 6px; }
.kktp-skill {
	font-size: 12px; font-weight: 600;
	padding: 3px 9px; border-radius: 999px;
	background: var(--psk-bg, #f3f4f6) !important;
	color: var(--psk-text, #374151) !important;
	border: 1px solid var(--psk-border, #e5e7eb) !important;
}
.kktp-skill--more { color: var(--psk-text-muted, #9ca3af) !important; }

/* Expanded detail */
.kktp-card-detail { border-top: 1px solid var(--psk-border, #f0f0f0); padding-top: 12px; }
.kktp-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; margin: 0; }
.kktp-detail-grid dt { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--psk-text-muted, #9ca3af); margin: 0; opacity: .85; }
.kktp-detail-grid dd { font-size: 14px; font-weight: 700; color: var(--psk-text, #111827); margin: 3px 0 0; }
.kktp-detail-grid a:link, .kktp-detail-grid a:visited { color: var(--psk-primary, #0ABFA3) !important; }
.kktp-detail-skills { margin-top: 12px; }
.kktp-detail-label { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--psk-text-muted, #9ca3af); margin-bottom: 6px; }

/* Card actions */
.kktp-card-actions { display: flex; justify-content: space-between; align-items: center; margin-top: auto; padding-top: 4px; }
.kktp-card-actions-right { display: flex; gap: 8px; }

/* Buttons */
.kktp-wrap .kktp-btn, .kktp-wrap button.kktp-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 8px 16px; border-radius: 999px;
	font-family: inherit; font-size: 13px; font-weight: 700;
	cursor: pointer; text-decoration: none !important;
	border: 1.5px solid transparent !important;
	transition: background .12s, border-color .12s, color .12s;
}
.kktp-wrap .kktp-btn-primary, .kktp-wrap a.kktp-btn-primary:link, .kktp-wrap a.kktp-btn-primary:visited {
	background: var(--psk-primary, #0ABFA3) !important;
	color: #fff !important;
	border-color: var(--psk-primary, #0ABFA3) !important;
}
.kktp-wrap .kktp-btn-outline,
.kktp-wrap button.kktp-btn-outline,
.kktp-wrap a.kktp-btn-outline:link,
.kktp-wrap a.kktp-btn-outline:visited {
	background: transparent !important;
	color: #0ABFA3 !important;          /* literal brand teal — guaranteed visible */
	border: 1.5px solid #0ABFA3 !important;
}
.kktp-wrap .kktp-btn-outline:hover,
.kktp-wrap button.kktp-btn-outline:hover,
.kktp-wrap a.kktp-btn-outline:hover {
	background: #0ABFA3 !important;
	color: #ffffff !important;
	border-color: #0ABFA3 !important;
}
.kktp-wrap .kktp-btn-ghost {
	background: transparent !important;
	color: var(--psk-text-muted, #6b7280) !important;
	border-color: transparent !important;
	padding: 8px 10px;
}
.kktp-wrap .kktp-btn-ghost:hover { color: var(--psk-primary, #0ABFA3) !important; }

/* Empty / loading */
.kktp-empty { grid-column: 1 / -1; text-align: center; padding: 40px; color: var(--psk-text-muted, #9ca3af); font-size: 14px; }

/* Pagination */
.kktp-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 20px; }
.kktp-page-btn {
	padding: 7px 16px; border-radius: 8px;
	border: 1.5px solid var(--psk-border, #e5e7eb) !important;
	background: var(--psk-surface, #fff) !important;
	color: var(--psk-text, #374151) !important;
	font-family: inherit; font-size: 13px; font-weight: 600; cursor: pointer;
}
.kktp-page-btn:hover:not(:disabled) { border-color: var(--psk-primary, #0ABFA3) !important; color: var(--psk-primary, #0ABFA3) !important; }
.kktp-page-btn:disabled { opacity: .4; cursor: default; }
.kktp-page-info { font-size: 13px; color: var(--psk-text-muted, #6b7280); }

/* Seeker stats */
.kktp-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0; }
@media (max-width: 620px) { .kktp-stats { grid-template-columns: 1fr; } }
.kktp-stat {
	background: var(--psk-surface, #fff) !important;
	border: 1px solid var(--psk-border, #e5e7eb) !important;
	border-radius: 12px; padding: 20px; text-align: center;
}
.kktp-stat--muted { opacity: .85; }
.kktp-stat-num { display: block; font-size: 34px; font-weight: 800; color: var(--psk-primary, #0ABFA3) !important; line-height: 1; }
.kktp-stat-label { display: block; font-size: 12px; color: var(--psk-text-muted, #6b7280); margin-top: 8px; line-height: 1.4; }
.kktp-stat-label small { color: var(--psk-text-muted, #9ca3af); }
.kktp-tip { font-size: 13px; color: var(--psk-text-muted, #6b7280); background: var(--psk-bg, #f9fafb); border-radius: 10px; padding: 12px 14px; margin-top: 8px; }


/* ===== Compose modal ===== */
body.kktp-modal-open { overflow: hidden; }
.kktp-modal { position: fixed; inset: 0; z-index: 99999; display: flex; align-items: center; justify-content: center; font-family: "Chakra Petch", sans-serif; }
.kktp-modal[hidden] { display: none; }
.kktp-modal-backdrop { position: absolute; inset: 0; background: rgba(13,27,42,.6); backdrop-filter: blur(2px); }
.kktp-modal-box {
	position: relative;
	width: 92%; max-width: 460px;
	background: var(--psk-surface, #ffffff) !important;
	border: 1px solid var(--psk-border, #e5e7eb) !important;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(0,0,0,.35);
	overflow: hidden;
}
.kktp-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid var(--psk-border, #eef0f2); }
.kktp-modal-title { margin: 0; font-size: 17px; font-weight: 800; color: var(--psk-text, #111827) !important; }
.kktp-modal-x { background: none !important; border: none !important; font-size: 24px; line-height: 1; cursor: pointer; color: var(--psk-text-muted, #9ca3af) !important; padding: 0 4px; }
.kktp-modal-x:hover { color: var(--psk-text, #111827) !important; }
.kktp-modal-body { padding: 18px; }
.kktp-modal-label { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--psk-text-muted, #9ca3af); margin: 0 0 6px; }
.kktp-modal-recipient { font-size: 15px; font-weight: 700; color: var(--psk-text, #111827) !important; margin-bottom: 16px; padding: 8px 12px; background: var(--psk-bg, #f3f4f6) !important; border-radius: 8px; }
.kktp-modal-textarea {
	width: 100%; box-sizing: border-box;
	padding: 11px 13px; border-radius: 10px;
	border: 1.5px solid var(--psk-border, #e5e7eb) !important;
	background: var(--psk-bg, #f9fafb) !important;
	color: var(--psk-text, #111827) !important;
	font-family: inherit; font-size: 14px; line-height: 1.5; resize: vertical;
}
.kktp-modal-textarea:focus { border-color: #0ABFA3 !important; outline: none; }
.kktp-modal-note { margin-top: 12px; font-size: 13px; padding: 8px 12px; border-radius: 8px; }
.kktp-modal-note--error { background: rgba(220,38,38,.1); color: #dc2626 !important; }
.kktp-modal-note--ok { background: rgba(10,191,163,.12); color: #0ABFA3 !important; }
.kktp-modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px; border-top: 1px solid var(--psk-border, #eef0f2); }

/* Ultra-specific resume button override — beats aggressive theme button rules */
.kktp-wrap .kktp-card .kktp-card-actions button.kktp-btn-outline[data-kktp-download] {
	color: #0ABFA3 !important;
	background: transparent !important;
	border: 1.5px solid #0ABFA3 !important;
	-webkit-text-fill-color: #0ABFA3 !important;   /* some themes set text-fill */
}
.kktp-wrap .kktp-card .kktp-card-actions button.kktp-btn-outline[data-kktp-download]:hover {
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	background: #0ABFA3 !important;
}

/* Modal buttons — beat Elementor's button styling */
#kktp-compose-modal .kktp-modal-foot button.kktp-btn-primary[data-kktp-modal-send] {
	background: #0ABFA3 !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	border: 1.5px solid #0ABFA3 !important;
}
#kktp-compose-modal .kktp-modal-foot button.kktp-btn-primary[data-kktp-modal-send]:hover {
	background: #09a892 !important;
	border-color: #09a892 !important;
}
#kktp-compose-modal .kktp-modal-foot button.kktp-btn-ghost[data-kktp-modal-close] {
	background: transparent !important;
	color: var(--psk-text-muted, #6b7280) !important;
	-webkit-text-fill-color: var(--psk-text-muted, #6b7280) !important;
	border: 1.5px solid var(--psk-border, #d1d5db) !important;
}
#kktp-compose-modal .kktp-modal-foot button.kktp-btn-ghost[data-kktp-modal-close]:hover {
	background: transparent !important;
	color: var(--psk-text, #111827) !important;
	-webkit-text-fill-color: var(--psk-text, #111827) !important;
	border-color: var(--psk-text-muted, #9ca3af) !important;
}