/* ===== Khaleejy HR — واجهة الوظائف العامة، بألوان الهوية، خفيفة بدون أي مكتبة خارجية ===== */

:root{
	--kg-primary:#0860a9;
	--kg-secondary:#e21f35;
	--kg-ink:#14213d;
}

.kg-jobs-wrap,.kg-apply-wrap{
	max-width:1200px;margin:0 auto;padding:48px 24px 72px;direction:rtl;box-sizing:border-box;
}

.kg-jobs-header{ text-align:center; margin-bottom:32px; }
.kg-jobs-header h1{ font-size:clamp(1.7rem,3vw,2.3rem); font-weight:800; color:var(--kg-primary); margin:0 0 10px; }
.kg-jobs-header p{ color:#5b6b7c; font-size:1rem; }

.kg-jobs-filters{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:32px; }
.kg-jobs-filters select{
	-webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
	display:inline-block !important; box-sizing:border-box !important;
	width:auto; min-width:180px; height:46px !important; line-height:44px !important;
	margin:0 !important; padding:0 40px 0 16px !important;
	border-radius:10px !important; border:1px solid #dbe4ee !important; background-color:#fff !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%230860a9' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
	background-repeat:no-repeat !important; background-position:left 16px center !important; background-size:12px 8px !important;
	font-family:inherit !important; font-size:.94rem !important; color:var(--kg-ink) !important;
	direction:rtl; text-align:right; cursor:pointer;
}
.kg-jobs-filters select::-ms-expand{ display:none; }
.kg-clear-filters{ align-self:center; color:var(--kg-secondary); font-weight:700; text-decoration:none; }

.kg-jobs-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.kg-job-card{
	display:block; background:#fff; border:1px solid #e6ecf2; border-radius:16px; padding:26px 22px;
	text-decoration:none; transition:transform .2s ease, box-shadow .2s ease; box-shadow:0 6px 18px rgba(8,96,169,.06);
}
.kg-job-card:hover{ transform:translateY(-4px); box-shadow:0 14px 30px rgba(8,96,169,.14); }
.kg-job-thumb{
	aspect-ratio:1/1; width:100%; overflow:hidden; border-radius:12px; margin-bottom:18px; background:#eef4fb;
}
.kg-job-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.kg-job-card h3{ margin:0 0 12px; font-size:1.15rem; font-weight:800; color:var(--kg-ink); }
.kg-job-meta{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; }
.kg-job-meta span{ background:rgba(8,96,169,.08); color:var(--kg-primary); font-size:.78rem; font-weight:700; padding:5px 12px; border-radius:999px; }
.kg-job-apply-cta{ color:var(--kg-secondary); font-weight:800; font-size:.92rem; }
.kg-no-jobs{ text-align:center; color:#6b7a89; padding:40px 0; }

/* ===== صفحة التقديم ===== */
.kg-breadcrumb{ font-size:.88rem; color:#6b7a89; margin-bottom:24px; }
.kg-breadcrumb a{ color:var(--kg-primary); text-decoration:none; }

.kg-apply-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:40px; align-items:start; }
.kg-job-image{
	aspect-ratio:1/1; max-width:420px; width:100%; overflow:hidden; border-radius:16px; margin-bottom:22px;
	background:#eef4fb; box-shadow:0 6px 18px rgba(8,96,169,.08);
}
.kg-job-image img{ width:100%; height:100%; object-fit:cover; display:block; }
.kg-job-details h1{ font-size:clamp(1.5rem,2.6vw,2rem); font-weight:800; color:var(--kg-ink); margin:0 0 14px; }
.kg-job-details .kg-job-meta{ margin-bottom:22px; }
.kg-job-description{ color:#3a4657; line-height:1.9; margin-bottom:24px; }
.kg-job-details h3{ font-size:1.05rem; font-weight:800; color:var(--kg-ink); margin:0 0 12px; }
.kg-skills-list{ display:flex; flex-wrap:wrap; gap:8px; }
.kg-skill-pill{ background:#eef4fb; color:var(--kg-primary); font-size:.82rem; font-weight:700; padding:6px 14px; border-radius:999px; }

.kg-apply-form-wrap{ background:#fff; border:1px solid #e6ecf2; border-radius:18px; padding:30px; box-shadow:0 10px 28px rgba(8,96,169,.08); }
.kg-apply-form-wrap h2{ font-size:1.25rem; font-weight:800; color:var(--kg-primary); margin:0 0 22px; }

.kg-form-row{ margin-bottom:16px; }
.kg-form-row--2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.kg-form-row label{ display:block; font-size:.88rem; font-weight:700; color:var(--kg-ink); margin-bottom:6px; }
.kg-form-row input,.kg-form-row select,.kg-form-row textarea{
	width:100%; padding:11px 14px; border-radius:10px; border:1px solid #dbe4ee; font-family:inherit; font-size:.94rem; box-sizing:border-box;
}
.kg-form-row select{
	-webkit-appearance:none !important; -moz-appearance:none !important; appearance:none !important;
	display:block !important; height:46px !important; line-height:44px !important;
	margin:0 !important; padding:0 40px 0 16px !important;
	background-color:#fff !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%230860a9' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>") !important;
	background-repeat:no-repeat !important; background-position:left 16px center !important; background-size:12px 8px !important;
	direction:rtl; text-align:right; cursor:pointer;
}
.kg-form-row select::-ms-expand{ display:none; }
.kg-form-row input:focus,.kg-form-row select:focus,.kg-form-row textarea:focus{ outline:none; border-color:var(--kg-primary); }

.kg-honeypot{ position:absolute !important; left:-9999px !important; width:1px; height:1px; overflow:hidden; }

.kg-submit-btn{
	width:100%; background:var(--kg-secondary); color:#fff; border:none; border-radius:10px; padding:15px; font-size:1rem;
	font-weight:800; cursor:pointer; margin-top:8px; transition:background .2s ease, transform .2s ease;
}
.kg-submit-btn:hover{ background:#c81a2e; transform:translateY(-2px); }

.kg-success-box{ text-align:center; padding:24px 12px; }
.kg-success-box h3{ color:var(--kg-primary); font-size:1.2rem; margin-bottom:10px; }
.kg-success-box p{ color:#5b6b7c; }

@media (max-width:960px){
	.kg-jobs-grid{ grid-template-columns:repeat(2,1fr); }
	.kg-apply-grid{ grid-template-columns:1fr; }
}
@media (max-width:640px){
	.kg-jobs-grid{ grid-template-columns:1fr; }
	.kg-form-row--2{ grid-template-columns:1fr; }
	.kg-jobs-filters select{ width:100%; }
}