@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700&display=swap');


/* =========================
   Global Typography
========================= */
body,
p,
span,
a,
li,
input,
textarea,
select,
button {
    font-weight: 400 !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.navbar,
.top-bar,
.bg-footer {
    font-family: "Cairo", sans-serif !important;
    font-weight: 600 !important;
}

/* =========================
   Company Logos
========================= */
.card-body img {
    max-width: 180px;
}

/* =========================
   Beta Badge Beside Logo
========================= */
.navbar-brand {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.navbar-brand::after {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #283139;
    background-color: #f5c542;
    background-image: url("https://job.cab/storage/global/f90748d5-2724-4f81-8f76-8ac9f23b0d8f.webp");
    background-repeat: no-repeat;
    background-size: 25px;
    border-radius: 4px;
    line-height: 1;
    white-space: nowrap;
}

html[lang^="ar"] .navbar-brand::after {
    content: "تشغيل تجريبي";
    padding: 10px 12px 10px 42px;
    background-position: left 8px center;
}

html[lang^="en"] .navbar-brand::after {
    content: "Testing Mode";
    padding: 10px 42px 10px 12px;
    background-position: right 8px center;
}

/* =========================
   Home Page Hero
========================= */
.bg-home2 {
    background: url('https://job.cab/storage/global/2abc6ca1-949a-4969-97c6-d05e92ff673e.jpg') center center / cover no-repeat !important;
}

.home-img {
    width: 450px;
}

.modal {
    z-index: 9999 !important;
}

.modal-backdrop {
    z-index: 9998 !important;
}

/* Top bar فوق الجميع في الهوم */
body#page-home .top-bar {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1100 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
}

/* Navbar في أعلى الهوم */
body#page-home .navbar {
    position: absolute !important;
    top: 40px;
    left: 0;
    width: 100%;
    z-index: 1090 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    transition: all 0.35s ease;
}

/* ألوان العناصر في الهوم */
body#page-home .top-bar,
body#page-home .top-bar a,
body#page-home .navbar .nav-link,
body#page-home .navbar .dropdown-toggle,
body#page-home .navbar .navbar-brand,
body#page-home .navbar .navbar-brand span,
body#page-home .navbar .navbar-brand strong,
body#page-home .navbar .navbar-nav .nav-link {
    color: #1f2937 !important;
    transition: all 0.35s ease;
}

/* الأيقونات في الهوم */
body#page-home .navbar .nav-link i,
body#page-home .navbar .dropdown-toggle i,
body#page-home .top-bar i,
body#page-home .top-bar svg,
body#page-home .navbar svg {
    color: #1f2937 !important;
    fill: #1f2937 !important;
}

/* زر نشر الوظيفة */
body#page-home .navbar .btn,
body#page-home .navbar .btn-post,
body#page-home .navbar .post-job-btn {
    position: relative;
    z-index: 1091 !important;
}

/* حالات الـ sticky */
body#page-home .navbar.is-sticky,
body#page-home .mobile-sticky.sticky,
body#page-home .navbar.fixed-top,
body#page-home nav.navbar[style*="position: fixed"] {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    width: 100%;
    z-index: 1200 !important;
    background: rgba(255, 255, 255, 0.10) !important;
    background-color: rgba(255, 255, 255, 0.10) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08) !important;
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}

/* نصوص الـ sticky */
body#page-home .navbar.is-sticky .nav-link,
body#page-home .mobile-sticky.sticky .nav-link,
body#page-home .navbar.fixed-top .nav-link,
body#page-home nav.navbar[style*="position: fixed"] .nav-link,
body#page-home .navbar.is-sticky .dropdown-toggle,
body#page-home .mobile-sticky.sticky .dropdown-toggle,
body#page-home .navbar.fixed-top .dropdown-toggle,
body#page-home nav.navbar[style*="position: fixed"] .dropdown-toggle,
body#page-home .navbar.is-sticky .navbar-brand,
body#page-home .mobile-sticky.sticky .navbar-brand,
body#page-home .navbar.fixed-top .navbar-brand,
body#page-home nav.navbar[style*="position: fixed"] .navbar-brand,
body#page-home .navbar.is-sticky .navbar-brand span,
body#page-home .mobile-sticky.sticky .navbar-brand span,
body#page-home .navbar.fixed-top .navbar-brand span,
body#page-home nav.navbar[style*="position: fixed"] .navbar-brand span {
    color: #1f2937 !important;
}

/* أيقونات الـ sticky */
body#page-home .navbar.is-sticky .nav-link i,
body#page-home .mobile-sticky.sticky .nav-link i,
body#page-home .navbar.fixed-top .nav-link i,
body#page-home nav.navbar[style*="position: fixed"] .nav-link i,
body#page-home .navbar.is-sticky .dropdown-toggle i,
body#page-home .mobile-sticky.sticky .dropdown-toggle i,
body#page-home .navbar.fixed-top .dropdown-toggle i,
body#page-home nav.navbar[style*="position: fixed"] .dropdown-toggle i,
body#page-home .navbar.is-sticky svg,
body#page-home .mobile-sticky.sticky svg,
body#page-home .navbar.fixed-top svg,
body#page-home nav.navbar[style*="position: fixed"] svg {
    color: #1f2937 !important;
    fill: #1f2937 !important;
}

/* =========================
   Global Header Sizes
========================= */
 .top-bar {
    background: #F5F7FA !important;
    font-size: 13px;
}
.navbar {
    padding: 8px 0 !important;
}
.page-title-box {
    padding: 90px 0 30px 0 !important;
    min-height: 120px !important;
}


/* =========================
   Employer Control Panel
========================= */
.ps-copyright img {
    max-height: 74px !important;
}

/* =========================
   Login / Signup Page
========================= */
.bg-auth .auth-box > .row.align-items-center {
    align-items: flex-start !important;
}

.auth-box .col-lg-6.text-center .card-body {
    padding-top: 50px !important;
}

.auth-box .col-lg-6.text-center .mt-5 {
    margin-top: 40px !important;
}

.auth-box .col-lg-6.text-center img.img-fluid {
    max-width: 100% !important;
    transform: scale(1.1);
}

.auth-box .col-lg-6.text-center a {
    display: block;
    margin-bottom: 10px;
}

/* Back Button */
.bg-auth .back-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    font-size: 12px;
    background: #f5c542;
    color: #283139;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 10px;
    margin-bottom: 12px;
    font-family: "Cairo", sans-serif;
}

/* RTL auth form icons */
body[dir="rtl"] .auth-form .auth-input-icon {
    left: auto !important;
    right: 1px !important;
}

body[dir="rtl"] input.form-control {
    padding-right: 45px !important;
    padding-left: 15px !important;
}

/* Phone input */
body[dir="rtl"] .iti input {
    direction: ltr !important;
    text-align: right !important;
}

body[dir="rtl"] .iti input.js-phone-number-mask {
    padding-right: 42px !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 18px 18px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.86 19.86 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.46-1.15a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") !important;
}

body[dir="rtl"] .bg-auth .iti input.js-phone-number-mask {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-opacity='0.75' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.86 19.86 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.86 19.86 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.46-1.15a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") !important;
}

/* X Button */
a.x {
    background-color: #000 !important;
    border: 1px solid #000 !important;
    color: #fff !important;
}

a.x:hover {
    background-color: #111 !important;
    border-color: #111 !important;
}

/* =========================
   Contact Page Form Icons
========================= */
#botble-contact-forms-fronts-contact-form input.form-control:not(.js-phone-number-mask) {
    background-repeat: no-repeat !important;
    background-size: 18px 18px !important;
}

/* Direction-based spacing */
body[dir="rtl"] #botble-contact-forms-fronts-contact-form input#name,
body[dir="rtl"] #botble-contact-forms-fronts-contact-form input#email,
body[dir="rtl"] #botble-contact-forms-fronts-contact-form input#address,
body[dir="rtl"] #botble-contact-forms-fronts-contact-form input#subject {
    padding-right: 42px !important;
    background-position: right 14px center !important;
}

body:not([dir="rtl"]) #botble-contact-forms-fronts-contact-form input#name,
body:not([dir="rtl"]) #botble-contact-forms-fronts-contact-form input#email,
body:not([dir="rtl"]) #botble-contact-forms-fronts-contact-form input#address,
body:not([dir="rtl"]) #botble-contact-forms-fronts-contact-form input#subject {
    padding-left: 42px !important;
    background-position: left 14px center !important;
}

/* Shared field icons */
#botble-contact-forms-fronts-contact-form input#name {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 7a4 4 0 1 0 8 0a4 4 0 0 0 -8 0'/%3E%3Cpath d='M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2'/%3E%3C/svg%3E") !important;
}

#botble-contact-forms-fronts-contact-form input#email {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10'/%3E%3Cpath d='M3 7l9 6l9 -6'/%3E%3C/svg%3E") !important;
}

#botble-contact-forms-fronts-contact-form input#address {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6 -5.686 -6 -10a6 6 0 1 1 12 0c0 4.314 -6 10 -6 10z'/%3E%3Cpath d='M12 11a2 2 0 1 0 0 .01'/%3E%3C/svg%3E") !important;
}

#botble-contact-forms-fronts-contact-form input#subject {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 8h10'/%3E%3Cpath d='M7 12h8'/%3E%3Cpath d='M7 16h6'/%3E%3Cpath d='M5 4h14a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-12a2 2 0 0 1 2 -2z'/%3E%3C/svg%3E") !important;
}

/* =========================
   OMR Icon
========================= */
@font-face {
    font-family: "jobcab";
    src: url("/fonts/jobcab.woff2") format("woff2"),
         url("/fonts/jobcab.woff") format("woff"),
         url("/fonts/jobcab.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* OMR Icon */
.omr-icon {
    display: inline-block;
    font-family: "jobcab";
    font-style: normal;
    font-weight: normal;
    font-size: 0.85em;
    line-height: 1;

    color: inherit;
    fill: currentColor;

    vertical-align: -0.01em;
    margin: 0 2px;
}

.omr-icon::before {
    content: "\e900";
}
/* //OMR Icon */


/* =========================
   Jobs Pages
========================= */
/* Add space between company profile image and company name */
.job-details-company-profile .mt-2 {
  padding-top: 30px;
}
/* View More Button Full Width */
.text-center.mt-4 .primary-link {
    display: block;
    width: 100%;
    padding: 12px 16px;
    background-color: var(--bs-primary);
    color: #fff !important;
    text-align: center;
    border-radius: 6px;
    font-weight: 500;
    text-decoration: none;
    transition: 0.2s ease;
}
.text-center.mt-4 .primary-link:hover {
    background-color: rgba(var(--bs-primary-rgb), 0.9);
}
 .text-center.mt-4 .primary-link i {
    display: none;
}
/* Map Info Font */
/* Leaflet popup font control */
.leaflet-popup-content .infomarker {
    font-family: "IBM Plex Sans Arabic", sans-serif;
}

/* Title only (h5) */
.leaflet-popup-content .infomarker h5,
.leaflet-popup-content .infomarker h5 a {
    font-family: "Cairo", sans-serif;
}


/* =========================
   Footer
========================= */
.footer-item p.text-white-50,
.footer-item .footer-list li a {
    font-family: "IBM Plex Sans Arabic", sans-serif !important;
}
.col-lg-12 .text-white-50,
.col-lg-12 .text-white-50 a {
	font-size: 12px;
    font-family: "Cairo", sans-serif !important;
}