@charset "utf-8";

/*
 * WorkDirect application refresh
 * Scoped to the recruiter dashboard, jobseeker dashboard and job search.
 * Update, 2026-08-01
 */

:root {
  --wd-app-ink: #10213f;
  --wd-app-muted: #66748d;
  --wd-app-line: rgba(139, 160, 197, 0.2);
  --wd-app-blue: #2f6df6;
  --wd-app-blue-2: #5a8cff;
  --wd-app-violet: #7557f4;
  --wd-app-surface: rgba(255, 255, 255, 0.96);
  --wd-app-soft: #f4f7fd;
  --wd-app-shadow: 0 18px 50px rgba(24, 47, 88, 0.1);
  --wd-app-shadow-hover: 0 22px 60px rgba(38, 79, 164, 0.17);
}

.wd-dashboard,
.wd-search-page,
.wd-job-results {
  color: var(--wd-app-ink);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.wd-dashboard {
  position: relative;
  max-width: 1440px;
  padding-top: 1.25rem;
  padding-bottom: 3rem;
}

.wd-dashboard::before,
.wd-search-page::before {
  position: absolute;
  z-index: -1;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(67, 121, 255, 0.12);
  filter: blur(70px);
  content: "";
  pointer-events: none;
}

.wd-dashboard::before {
  top: 70px;
  right: 3%;
}

/* Dashboard heading */
.wd-dashboard .dash-heading-row {
  position: relative;
  overflow: hidden;
  min-height: 116px;
  margin: 0 0 1.4rem !important;
  padding: 1.45rem 1.6rem;
  border: 1px solid rgba(119, 157, 255, 0.24);
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 20%, rgba(119, 162, 255, 0.38), transparent 28%),
    linear-gradient(128deg, #10264d 0%, #173e7c 55%, #255bc7 100%);
  box-shadow: 0 22px 55px rgba(17, 48, 104, 0.22);
}

.wd-dashboard .dash-heading-row::after {
  position: absolute;
  right: 4%;
  bottom: -88px;
  width: 230px;
  height: 230px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 50%;
  box-shadow:
    0 0 0 26px rgba(255, 255, 255, 0.04),
    0 0 0 54px rgba(255, 255, 255, 0.025);
  content: "";
  pointer-events: none;
}

.wd-dashboard .dash-heading-row h1 {
  position: relative;
  z-index: 1;
  color: #fff !important;
  font-size: clamp(1.55rem, 2.2vw, 2.05rem) !important;
  font-weight: 750 !important;
  letter-spacing: -0.035em;
}

.wd-dashboard .dash-heading-row h1 i {
  color: #8bb4ff !important;
}

.wd-dashboard .dash-heading-row > div {
  position: relative;
  z-index: 1;
}

.wd-dashboard .dash-heading-row .btn {
  min-height: 42px;
  padding: 0.58rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.11) !important;
  box-shadow: none !important;
  color: #fff !important;
  font-size: 0.78rem;
  font-weight: 650;
  backdrop-filter: blur(12px);
  transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease !important;
}

.wd-dashboard .dash-heading-row .btn:hover,
.wd-dashboard .dash-heading-row .btn:focus-visible {
  border-color: rgba(255, 255, 255, 0.54) !important;
  background: rgba(255, 255, 255, 0.2) !important;
  color: #fff !important;
  transform: translateY(-2px);
}

.wd-dashboard .dash-heading-row .btn-primary {
  border-color: #fff !important;
  background: #fff !important;
  color: #2457bb !important;
}

.wd-dashboard .dash-heading-row .btn-primary:hover,
.wd-dashboard .dash-heading-row .btn-primary:focus-visible {
  background: #edf4ff !important;
  color: #1648aa !important;
}

/* Dashboard sidebar */
.dashboard-left-nav {
  position: sticky;
  top: 92px;
  overflow: hidden;
  border: 1px solid var(--wd-app-line);
  border-radius: 22px !important;
  background: var(--wd-app-surface);
  box-shadow: var(--wd-app-shadow);
}

.dashboard-left-nav > .accordion-item:first-child {
  border: 0 !important;
  border-radius: 0 !important;
  background:
    linear-gradient(145deg, rgba(235, 242, 255, 0.95), rgba(249, 251, 255, 0.98)) !important;
}

.dashboard-left-nav .accordion-item {
  border: 0 !important;
  border-bottom: 1px solid rgba(139, 160, 197, 0.14) !important;
  background: transparent !important;
}

.dashboard-left-nav .accordion-item:last-child {
  border-bottom: 0 !important;
}

.dashboard-left-nav .accordion-button,
.dashboard-left-nav .accordion-button2 {
  min-height: 48px;
  padding: 0.8rem 1rem !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #243653 !important;
  font-size: 0.86rem;
  font-weight: 640;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.dashboard-left-nav .accordion-button:hover,
.dashboard-left-nav .accordion-button2:hover {
  background: #eef4ff !important;
  color: #275fd4 !important;
  transform: translateX(2px);
}

.dashboard-left-nav .card-dashboard2 {
  margin: 0.45rem;
  background: linear-gradient(135deg, #2f6df6, #5b7df7) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(47, 109, 246, 0.24) !important;
}

.dashboard-left-nav .card-dashboard2:hover {
  color: #fff !important;
}

.dashboard-left-nav .accordion-body {
  padding: 0.25rem 1rem 0.8rem !important;
  background: rgba(245, 248, 254, 0.72);
}

.dashboard-left-nav .accordion-body .style39,
.dashboard-left-nav .accordion-body .postjob {
  margin-left: 1.45rem !important;
}

.dashboard-left-nav .accordion-body a {
  display: block;
  padding: 0.3rem 0.4rem;
  border-radius: 8px;
  color: #687690 !important;
  font-size: 0.79rem;
  font-weight: 520;
  text-decoration: none !important;
}

.dashboard-left-nav .accordion-body a:hover {
  background: #e8f0ff;
  color: #245fd3 !important;
}

.dashboard-left-nav .no-pic img,
.dashboard-left-nav .candidate-pic img {
  width: 78px !important;
  height: 78px !important;
  border: 4px solid #fff;
  border-radius: 22px !important;
  background: #edf3ff;
  box-shadow: 0 12px 28px rgba(45, 84, 151, 0.18);
  object-fit: cover;
}

.dashboard-left-nav .text-xs {
  color: #8592a8;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dashboard-left-nav .complete-profile-link {
  display: inline-flex;
  align-items: center;
  padding: 0.48rem 0.8rem;
  border-radius: 999px;
  background: #e8f0ff;
  color: #2f66d8 !important;
  font-size: 0.72rem;
  font-weight: 650;
  text-decoration: none !important;
}

/* Dashboard surfaces */
.wd-dashboard .dash-stat-card,
.wd-dashboard .dash-chart-card,
.wd-dashboard .dash-info-card,
.wd-dashboard .dashboard-plan-panel {
  border: 1px solid var(--wd-app-line) !important;
  background: var(--wd-app-surface) !important;
  box-shadow: 0 12px 35px rgba(29, 54, 101, 0.075) !important;
}

.wd-dashboard .dash-stat-card {
  position: relative;
  overflow: hidden;
  min-height: 98px;
  padding: 1.15rem !important;
  border-radius: 19px !important;
}

.wd-dashboard .dash-stat-card::after {
  position: absolute;
  right: -24px;
  bottom: -35px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: rgba(68, 116, 245, 0.055);
  content: "";
}

.wd-dashboard .dash-stat-card:hover {
  border-color: rgba(69, 113, 236, 0.28) !important;
  box-shadow: var(--wd-app-shadow-hover) !important;
  transform: translateY(-4px) !important;
}

.wd-dashboard .dash-stat-icon {
  width: 50px !important;
  height: 50px !important;
  border-radius: 15px !important;
  font-size: 1.25rem !important;
}

.wd-dashboard .dash-stat-icon.ic-indigo {
  background: linear-gradient(145deg, #eee9ff, #e4eaff) !important;
  color: #6d55e8 !important;
}

.wd-dashboard .dash-stat-icon.ic-green {
  background: linear-gradient(145deg, #e3f8ef, #dff6f1) !important;
  color: #1a9e76 !important;
}

.wd-dashboard .dash-stat-icon.ic-blue {
  background: linear-gradient(145deg, #e1ecff, #e8f2ff) !important;
  color: #3678e9 !important;
}

.wd-dashboard .dash-stat-icon.ic-orange {
  background: linear-gradient(145deg, #fff1db, #fff4e6) !important;
  color: #e59a2d !important;
}

.wd-dashboard .dash-stat-value {
  color: var(--wd-app-ink) !important;
  font-size: 1.72rem !important;
  font-weight: 760 !important;
  letter-spacing: -0.04em !important;
}

.wd-dashboard .dash-stat-label {
  color: var(--wd-app-muted) !important;
  font-size: 0.76rem !important;
}

.wd-dashboard .dash-chart-card,
.wd-dashboard .dash-info-card {
  border-radius: 21px !important;
}

.wd-dashboard .dash-chart-header,
.wd-dashboard .dash-info-header {
  min-height: 54px;
  max-height: none !important;
  padding: 0.9rem 1.15rem !important;
  border-bottom: 1px solid rgba(139, 160, 197, 0.16) !important;
  background: linear-gradient(180deg, #fff, #fbfcff) !important;
}

.wd-dashboard .dash-chart-title,
.wd-dashboard .dash-info-header {
  color: #1d3152 !important;
  font-size: 0.87rem !important;
  font-weight: 680 !important;
}

.wd-dashboard .dash-chart-body,
.wd-dashboard .dash-info-body {
  padding: 1.1rem 1.2rem 1.25rem !important;
}

.wd-dashboard .dashboard-plan-panel {
  padding: 1.1rem 1.3rem !important;
  border-radius: 19px !important;
  background:
    radial-gradient(circle at 92% 20%, rgba(85, 137, 255, 0.14), transparent 28%),
    linear-gradient(135deg, #f8faff, #eef4ff) !important;
}

.wd-dashboard .rj-item {
  margin: 0 -0.5rem;
  padding: 0.85rem 0.5rem !important;
  border-radius: 12px;
}

.wd-dashboard .rj-item:hover {
  background: #f3f7ff;
}

.wd-dashboard .rj-logo,
.wd-dashboard .tc-logo-grid {
  border-color: rgba(139, 160, 197, 0.2) !important;
  background: #f5f8fe !important;
  box-shadow: 0 8px 20px rgba(31, 62, 115, 0.08);
}

.wd-dashboard .tc-item-grid {
  height: 100%;
  padding: 0.9rem 0.5rem;
  border: 1px solid rgba(139, 160, 197, 0.16);
  border-radius: 15px;
  background: #fbfcff;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.wd-dashboard .tc-item-grid:hover {
  box-shadow: 0 12px 28px rgba(31, 62, 115, 0.12);
  transform: translateY(-3px);
}

/* Search page */
.wd-search-page {
  position: relative;
  max-width: 1180px;
  padding-top: 2rem;
  padding-bottom: 4rem;
}

.wd-search-page::before {
  top: 10px;
  left: 10%;
}

.wd-search-page .card-custom {
  overflow: visible;
  border: 1px solid rgba(124, 153, 205, 0.22) !important;
  border-radius: 26px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0 25px 70px rgba(24, 52, 103, 0.13) !important;
}

.wd-search-page .card-header {
  position: relative;
  overflow: hidden;
  min-height: 118px;
  padding: 1.7rem 2rem !important;
  border: 0 !important;
  border-radius: 25px 25px 0 0 !important;
  background:
    radial-gradient(circle at 90% 20%, rgba(125, 167, 255, 0.42), transparent 32%),
    linear-gradient(128deg, #112954, #245cbf) !important;
}

.wd-search-page .card-header::after {
  position: absolute;
  right: 7%;
  bottom: -55px;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  box-shadow: 0 0 0 24px rgba(255, 255, 255, 0.045);
  content: "";
}

.wd-search-page .main-heading {
  position: relative;
  z-index: 1;
  color: #fff !important;
  font-size: clamp(1.55rem, 3vw, 2rem) !important;
  font-weight: 760 !important;
  letter-spacing: -0.035em;
}

.wd-search-page .card-body-custom {
  padding: 1.8rem 2rem 2rem !important;
}

.wd-search-page .form-group,
.wd-search-page .form-groupd {
  margin: 0 !important;
  padding: 0.7rem 0;
  border-bottom: 1px solid rgba(139, 160, 197, 0.13);
}

.wd-search-page .form-group:last-of-type {
  border-bottom: 0;
}

.wd-search-page .col-form-label,
.wd-search-page label {
  color: #425574;
  font-size: 0.8rem;
  font-weight: 650;
}

.wd-search-page .form-control,
.wd-search-page .form-select,
.wd-search-page .select2-selection {
  min-height: 46px !important;
  border: 1px solid rgba(120, 145, 190, 0.28) !important;
  border-radius: 12px !important;
  background-color: #f9fbff !important;
  color: #1b2d4b !important;
  box-shadow: none !important;
  font-size: 0.88rem !important;
}

.wd-search-page .select2-selection__rendered {
  line-height: 44px !important;
}

.wd-search-page .select2-selection__arrow {
  height: 44px !important;
}

.wd-search-page .form-control:focus,
.wd-search-page .form-select:focus,
.wd-search-page .select2-container--open .select2-selection {
  border-color: rgba(47, 109, 246, 0.65) !important;
  background: #fff !important;
  box-shadow: 0 0 0 4px rgba(47, 109, 246, 0.1) !important;
}

.wd-search-page small {
  color: #7a879d;
  line-height: 1.55;
}

.wd-search-page button[type="submit"],
.wd-search-page input[type="submit"] {
  min-width: 160px;
  min-height: 48px;
  border: 0 !important;
  border-radius: 13px !important;
  background: linear-gradient(135deg, var(--wd-app-blue), var(--wd-app-blue-2)) !important;
  box-shadow: 0 12px 26px rgba(47, 109, 246, 0.25);
  color: #fff !important;
  font-size: 0.86rem;
  font-weight: 700;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.wd-search-page button[type="submit"]:hover,
.wd-search-page input[type="submit"]:hover {
  box-shadow: 0 16px 34px rgba(47, 109, 246, 0.34);
  transform: translateY(-2px);
}

/* Search results and filters */
.filters-bar-job-result.wd-job-results {
  position: sticky;
  z-index: 1010;
  top: 66px;
  padding: 0.75rem 0;
  border: 0 !important;
  background: rgba(246, 249, 255, 0.92);
  box-shadow: 0 8px 30px rgba(24, 52, 103, 0.08);
  backdrop-filter: blur(18px);
}

.wd-job-results {
  max-width: 1440px;
}

.wd-job-results.container {
  padding-top: 1.25rem;
  padding-bottom: 3rem;
}

.wd-job-results .form-control,
.wd-job-results .form-select,
.wd-job-results .btn,
.filters-bar-job-result.wd-job-results .form-control,
.filters-bar-job-result.wd-job-results .form-select,
.filters-bar-job-result.wd-job-results .btn {
  min-height: 42px;
  border-radius: 11px !important;
}

.wd-job-results .card-custom {
  overflow: hidden;
  border: 1px solid var(--wd-app-line) !important;
  border-radius: 22px !important;
  background: var(--wd-app-surface) !important;
  box-shadow: var(--wd-app-shadow) !important;
}

.wd-job-results .card-custom > .card-body {
  padding: 1rem !important;
}

.wd-job-results .previewBox {
  position: relative;
  margin: 0.65rem 0;
  padding: 1rem !important;
  border: 1px solid rgba(139, 160, 197, 0.17) !important;
  border-radius: 17px;
  background: #fbfcff;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.wd-job-results .previewBox:hover,
.wd-job-results .previewBox.active {
  border-color: rgba(47, 109, 246, 0.4) !important;
  background: #f4f8ff;
  box-shadow: 0 12px 30px rgba(35, 73, 143, 0.11);
  transform: translateY(-2px);
}

.wd-job-results .job-result-img {
  overflow: hidden;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(139, 160, 197, 0.19);
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 8px 18px rgba(31, 62, 115, 0.1);
}

.wd-job-results .job-result-img img {
  width: 100% !important;
  height: 100% !important;
  border-radius: 14px !important;
  object-fit: cover;
}

.wd-job-results .previewBox h6 {
  color: #142746;
  font-size: 0.94rem;
  font-weight: 720;
  line-height: 1.35;
}

.wd-job-results .previewBox .cname,
.wd-job-results .previewBox .location,
.wd-job-results .previewBox .posted {
  color: #728097;
  font-size: 0.76rem;
  line-height: 1.55;
}

.wd-job-results #previewDiv > .card,
.wd-job-results #previewDiv > div {
  border-radius: 22px !important;
}

.wd-job-results #previewDiv {
  position: sticky;
  top: 142px;
  align-self: flex-start;
  max-height: calc(100vh - 165px);
  overflow: auto;
  scrollbar-color: rgba(70, 101, 158, 0.42) transparent;
  scrollbar-width: thin;
}

.wd-job-results #previewDiv::-webkit-scrollbar {
  width: 6px;
}

.wd-job-results #previewDiv::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(70, 101, 158, 0.38);
}

.wd-job-results #loadMoreJobsBtn,
.wd-job-results .btn-primary,
.wd-job-results .btn-primary-sm {
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, var(--wd-app-blue), var(--wd-app-blue-2)) !important;
  box-shadow: 0 10px 24px rgba(47, 109, 246, 0.22);
  color: #fff !important;
  font-weight: 680;
}

/* Full-width job map */
.wd-job-results #map-view-toggle-btn {
  display: inline-flex !important;
  min-height: 42px;
  align-items: center;
  gap: 0.42rem;
  padding: 0.58rem 0.95rem;
  border: 1px solid rgba(117, 87, 244, 0.22);
  border-radius: 13px;
  background: linear-gradient(135deg, rgba(117, 87, 244, 0.1), rgba(47, 109, 246, 0.08));
  box-shadow: 0 8px 22px rgba(77, 73, 180, 0.11);
  color: #6146da !important;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.wd-job-results #map-view-toggle-btn:hover {
  border-color: rgba(117, 87, 244, 0.42);
  box-shadow: 0 12px 28px rgba(77, 73, 180, 0.18);
  transform: translateY(-2px);
}

.wd-job-results #map-view-toggle-btn i,
.wd-job-results #map-view-toggle-btn svg {
  color: #7557f4;
  filter: drop-shadow(0 4px 7px rgba(117, 87, 244, 0.3));
}

.wd-job-results #job-search-map-row {
  position: relative;
  left: 50%;
  width: calc(100vw - 32px);
  max-width: 1840px;
  margin-right: 0;
  margin-left: 0;
  transform: translateX(-50%);
}

.wd-job-results #job-search-map-row > .col-12 {
  padding: 0;
}

.wd-job-results .wd-map-card {
  overflow: hidden;
  border: 1px solid rgba(125, 146, 188, 0.2) !important;
  border-radius: 26px !important;
  background: rgba(255, 255, 255, 0.84) !important;
  box-shadow: 0 24px 70px rgba(27, 55, 105, 0.16), 0 4px 16px rgba(57, 71, 112, 0.08) !important;
}

.wd-job-results .wd-map-card > .card-body {
  padding: 10px !important;
}

.wd-job-results #inline-map-container {
  width: 100%;
  height: clamp(520px, 68vh, 760px);
  min-height: 0;
  overflow: hidden;
  border-radius: 18px;
  background: #dceaf1;
}

.wd-job-results #inline-map-container #map-canvas {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  border-radius: inherit;
}

.wd-job-results .wd-map-close {
  top: 24px;
  right: 24px;
  z-index: 1000;
  width: 44px;
  min-height: 44px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.88) !important;
  box-shadow: 0 10px 28px rgba(21, 37, 69, 0.2);
  color: #142746 !important;
  backdrop-filter: blur(12px);
}

.wd-job-results .wd-map-close:hover {
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(42, 54, 91, 0.25);
  color: #7557f4 !important;
  transform: translateY(-2px);
}

.wd-job-results .wd-map-close i {
  font-size: 1rem;
}

.wd-job-results #inline-map-container .custom-div-icon {
  overflow: visible !important;
}

.wd-job-results #inline-map-container .custom-div-icon > div {
  position: relative;
  width: 34px !important;
  height: 34px !important;
  border: 3px solid rgba(255, 255, 255, 0.96) !important;
  background: linear-gradient(135deg, #9b7cff 0%, #6f4cf4 55%, #5132c7 100%) !important;
  box-shadow: 0 8px 18px rgba(74, 48, 188, 0.38) !important;
  animation: wd-map-pin-float 1.7s ease-in-out infinite;
  transform-origin: 50% 78%;
}

.wd-job-results #inline-map-container .custom-div-icon > div::after {
  position: absolute;
  z-index: -1;
  right: -8px;
  bottom: -8px;
  width: 44px;
  height: 44px;
  border: 2px solid rgba(117, 87, 244, 0.7);
  border-radius: 50%;
  content: "";
  animation: wd-map-pin-pulse 1.7s ease-out infinite;
}

@keyframes wd-map-pin-float {
  0%, 100% {
    transform: translateY(0) rotate(-45deg);
  }
  50% {
    transform: translateY(-10px) rotate(-45deg);
  }
}

@keyframes wd-map-pin-pulse {
  0% {
    opacity: 0.75;
    transform: scale(0.45);
  }
  80%, 100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

/* Tablet */
@media (max-width: 991.98px) {
  .wd-dashboard {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .wd-dashboard .dash-heading-row {
    min-height: 108px;
  }

  .dashboard-left-nav {
    top: 82px;
  }

  .filters-bar-job-result.wd-job-results {
    position: relative;
    top: auto;
  }

  .filters-bar-job-result.wd-job-results .col-md-12 {
    align-items: stretch !important;
    flex-direction: column;
    gap: 0.65rem;
  }

  .filters-bar-job-result.wd-job-results .job-result-alert-input {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
  }

  .filters-bar-job-result.wd-job-results .text-dark.d-flex,
  .filters-bar-job-result.wd-job-results .job-result-keyword-input,
  .filters-bar-job-result.wd-job-results .job-result-alert-input > div,
  .filters-bar-job-result.wd-job-results form,
  .filters-bar-job-result.wd-job-results .input-group {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable::-webkit-scrollbar {
    display: none;
  }

  .wd-job-results #job-search-results-row > .col-md-5,
  .wd-job-results #job-search-results-row > .col-md-7 {
    width: 100%;
  }

  .wd-job-results #previewDiv {
    display: none;
  }

  .wd-job-results #job-search-map-row {
    width: calc(100vw - 24px);
  }

  .wd-job-results #inline-map-container {
    height: clamp(460px, 64vh, 650px);
  }
}

/* Phones */
@media (max-width: 767.98px) {
  .wd-dashboard,
  .wd-search-page,
  .wd-job-results.container {
    width: 100%;
    padding-right: 14px;
    padding-left: 14px;
  }

  .wd-dashboard {
    padding-top: 0.9rem;
    padding-bottom: 2rem;
  }

  .wd-dashboard .dash-heading-row {
    min-height: auto;
    align-items: flex-start;
    flex-direction: column;
    padding: 1.2rem !important;
    border-radius: 20px;
  }

  .wd-dashboard .dash-heading-row > div {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    width: 100%;
  }

  .wd-dashboard .dash-heading-row .btn {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }

  .wd-dashboard .dash-heading-row .btn:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .wd-dashboard .row > .col-md-9 {
    width: 100%;
  }

  .wd-dashboard .dash-chart-card,
  .wd-dashboard .dash-info-card,
  .wd-dashboard .dashboard-plan-panel {
    border-radius: 18px !important;
  }

  .wd-dashboard .dashboard-plan-panel {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 0.85rem 1rem !important;
    align-items: start !important;
  }

  .wd-dashboard .dashboard-plan-panel > div {
    min-width: 0;
  }

  .wd-dashboard .dash-chart-body[style*="height"] {
    height: 205px !important;
  }

  .wd-search-page {
    padding-top: 1rem;
    padding-bottom: 2.5rem;
  }

  .wd-search-page .card-custom {
    border-radius: 21px !important;
  }

  .wd-search-page .card-header {
    min-height: 94px;
    padding: 1.25rem 1.2rem !important;
    border-radius: 20px 20px 0 0 !important;
  }

  .wd-search-page .card-body-custom {
    padding: 1rem 1.05rem 1.35rem !important;
  }

  .wd-search-page .form-group,
  .wd-search-page .form-groupd {
    gap: 0.42rem;
    padding: 0.72rem 0;
  }

  .wd-search-page .col-form-label {
    padding-top: 0;
    padding-bottom: 0.18rem;
  }

  .wd-search-page button[type="submit"],
  .wd-search-page input[type="submit"] {
    width: 100%;
  }

  .filters-bar-job-result.wd-job-results {
    width: calc(100% - 20px);
    max-width: calc(100% - 20px);
    height: auto !important;
    min-height: 0 !important;
    margin: 12px auto 0;
    padding: 0.65rem 10px;
    overflow: visible;
    border-radius: 16px;
  }

  .filters-bar-job-result.wd-job-results > .container {
    width: 100%;
    max-width: 100%;
    padding: 0;
  }

  .filters-bar-job-result.wd-job-results .col-md-12 {
    width: 100%;
    min-width: 0;
    gap: 10px;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable > .dropdown,
  .filters-bar-job-result.wd-job-results .filter-tags-scrollable > div {
    width: 100%;
    min-width: 0;
    margin: 0 !important;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable > .dropdown:last-child {
    grid-column: 1 / -1;
  }

  .filters-bar-job-result.wd-job-results .filter-tags-scrollable .btn-job-filter {
    width: 100%;
    min-width: 0;
    padding-right: 10px;
    padding-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .filters-bar-job-result.wd-job-results .dropdown-menu {
    width: min(340px, calc(100vw - 32px)) !important;
    max-width: calc(100vw - 32px) !important;
  }

  .filters-bar-job-result.wd-job-results .job-result-keyword-input,
  .filters-bar-job-result.wd-job-results .job-result-alert-input,
  .filters-bar-job-result.wd-job-results .input-group {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* Keep the mobile search controls in normal flow. The legacy theme positions
     the keyword field absolutely, which covered the final Company filter. */
  .filters-bar-job-result.wd-job-results .job-result-keyword-input {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  .filters-bar-job-result.wd-job-results .job-result-alert-input {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
    transform: none !important;
  }

  .filters-bar-job-result.wd-job-results input.form-control {
    min-width: 0;
  }

  .wd-job-results.container {
    width: 100%;
    max-width: 100%;
    padding-top: 0.85rem;
    overflow-x: clip;
  }

  .wd-job-results .card-custom > .card-body {
    padding: 0.75rem !important;
  }

  .wd-job-results .card-custom > .card-body > .mb-2.d-flex {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    width: 100%;
  }

  .wd-job-results .card-custom > .card-body > .mb-2.d-flex > * {
    min-width: 0;
    margin: 0 !important;
  }

  .wd-job-results .card-custom > .card-body > .mb-2.d-flex .btn {
    max-width: 100%;
    white-space: normal;
  }

  .wd-job-results .previewBox {
    margin: 0.55rem 0;
    padding: 0.85rem 0.75rem !important;
    min-height: 0;
  }

  .wd-job-results .previewBox > .flex-shrink-1 {
    margin-left: 0 !important;
  }

  .wd-job-results .job-result-img {
    width: 48px;
    height: 48px;
  }

  .wd-job-results #job-search-map-row {
    left: auto;
    width: 100%;
    max-width: 100%;
    margin-right: 0;
    margin-left: 0;
    transform: none;
  }

  .wd-job-results .wd-map-card {
    border-radius: 20px !important;
  }

  .wd-job-results .wd-map-card > .card-body {
    padding: 7px !important;
  }

  .wd-job-results #inline-map-container {
    width: 100%;
    max-width: 100%;
    height: clamp(390px, 62svh, 560px);
    border-radius: 14px;
  }

  .wd-job-results .wd-map-close {
    top: 18px;
    right: 18px;
    width: 40px;
    min-height: 40px;
  }
}

.wd-salary-period {
  font-size: 0.72em;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .wd-dashboard .dash-heading-row > div {
    grid-template-columns: 1fr;
  }

  .wd-dashboard .dash-heading-row .btn {
    grid-column: 1 !important;
  }

  .wd-dashboard .row.mb-4.g-3 > [class*="col-"],
  .wd-jobseeker-dashboard .row.mb-3.g-3:first-of-type > [class*="col-"] {
    width: 50%;
  }

  .wd-dashboard .dash-stat-card {
    min-height: 132px;
    align-items: flex-start !important;
    flex-direction: column;
    gap: 0.7rem !important;
    padding: 0.9rem !important;
  }

  .wd-dashboard .dash-stat-icon {
    width: 44px !important;
    height: 44px !important;
  }

  .wd-dashboard .dash-stat-value {
    font-size: 1.45rem !important;
  }

  .wd-dashboard .dashboard-plan-panel {
    grid-template-columns: 1fr;
  }

  .wd-dashboard .tc-item-grid {
    padding: 0.7rem 0.35rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wd-dashboard *,
  .wd-search-page *,
  .wd-job-results * {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }

  .wd-job-results #inline-map-container .custom-div-icon > div,
  .wd-job-results #inline-map-container .custom-div-icon > div::after {
    animation: none !important;
  }
}

/* WorkDirect production repair — 2026-07-31
   Narrow selectors only: preserve legacy page structure and business logic. */

:root {
  --wd-repair-blue: #2f6df6;
  --wd-repair-navy: #10213f;
  --wd-repair-muted: #64748b;
  --wd-repair-line: rgba(92, 116, 158, .22);
}

/* Uploaded company logos retain their natural proportions. */
.company-logo img,
.employer-logo img,
.job-logo img,
.featured-logo img,
.profile-logo img,
img.company-logo,
img.employer-logo,
img.job-logo {
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center;
  aspect-ratio: auto !important;
}

/* Missing-logo areas remain polished without changing template output. */
.company-logo:empty,
.employer-logo:empty,
.job-logo:empty,
.featured-logo:empty,
[class*="company-logo"]:empty,
[class*="employer-logo"]:empty {
  display: grid;
  place-items: center;
  min-width: 72px;
  min-height: 72px;
  color: #315da8;
  background: linear-gradient(145deg,#eef4ff,#dfeaff);
  border: 1px solid rgba(47,109,246,.18);
  border-radius: 16px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9),0 8px 20px rgba(15,31,61,.08);
}
.company-logo:empty::before,
.employer-logo:empty::before,
.job-logo:empty::before,
.featured-logo:empty::before,
[class*="company-logo"]:empty::before,
[class*="employer-logo"]:empty::before {
  content: "WD";
  font: 800 1rem/1 system-ui,sans-serif;
  letter-spacing: .08em;
}

/* Legacy alerts keep their internal table/div layout intact. */
.alert:not(.cookiealert) {
  position: relative;
  display: block !important;
  float: none !important;
  clear: both;
  width: auto !important;
  max-width: 1180px;
  min-height: 0;
  margin: 16px auto !important;
  padding: 16px 18px !important;
  color: #5b3208 !important;
  background: linear-gradient(145deg,#fff9e9,#ffefbf) !important;
  border: 1px solid #efcf7a !important;
  border-left: 5px solid #d97706 !important;
  border-radius: 15px !important;
  box-shadow: 0 12px 28px rgba(109,72,8,.12) !important;
  line-height: 1.55;
  overflow: visible !important;
  transform: none !important;
}
.alert:not(.cookiealert)::before { content: none !important; display: none !important; }
.alert:not(.cookiealert) > div,
.alert:not(.cookiealert) table,
.alert:not(.cookiealert) tbody,
.alert:not(.cookiealert) tr,
.alert:not(.cookiealert) td {
  max-width: 100%;
}

.alert:not(.cookiealert) > div {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.alert:not(.cookiealert) > div a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  margin-top: 12px;
  padding: 8px 15px !important;
  color: #fff !important;
  background: linear-gradient(135deg,#2563eb,#4f67e8) !important;
  border: 0 !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  font-weight: 800;
}

.alert-danger,
.alert-error {
  color: #52151d !important;
  background: linear-gradient(145deg,#fff3f4,#ffe3e6) !important;
  border-color: #efb0b8 !important;
  border-left-color: #b42335 !important;
}
.alert-success {
  color: #0b5135 !important;
  background: linear-gradient(145deg,#effcf6,#dff7ea) !important;
  border-color: #a4dfc4 !important;
  border-left-color: #138a57 !important;
}
.alert-info {
  color: #153a86 !important;
  background: linear-gradient(145deg,#f1f6ff,#e1ebff) !important;
  border-color: #b8ccf5 !important;
  border-left-color: #2563eb !important;
}
.messageStack,
.message-stack {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  float: none !important;
  clear: both !important;
}
.messageStack::before,
.message-stack::before { content: none !important; display: none !important; }

/* Five-step checkout progress, scoped to its explicit class. */
.wd-checkout-steps {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 8px;
  width: min(920px,calc(100% - 32px));
  margin: 22px auto 30px;
  padding: 8px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(64,101,176,.18);
  border-radius: 18px;
  box-shadow: 0 14px 32px rgba(15,31,61,.10);
}
.wd-checkout-steps > * {
  min-width: 0;
  padding: 10px 8px;
  color: #64748b;
  background: #eef3fb;
  border-radius: 11px;
  font-weight: 750;
  text-align: center;
}
.wd-checkout-steps .active,
.wd-checkout-steps .current {
  color: #fff;
  background: linear-gradient(135deg,#2563eb,#635bdf);
  box-shadow: 0 8px 18px rgba(37,99,235,.22);
}
.wd-checkout-steps .complete,
.wd-checkout-steps .completed {
  color: #087a4c;
  background: #dcfce7;
}

/* Explicit checkout/resume wrappers receive modern controls; global forms do not. */
.wd-checkout-shell,
.wd-checkout-card,
.wd-coupon-shell,
.wd-resume-workspace {
  min-width: 0;
}
.wd-checkout-shell input:not([type="checkbox"]):not([type="radio"]),
.wd-checkout-shell select,
.wd-checkout-shell textarea,
.wd-coupon-shell input:not([type="checkbox"]):not([type="radio"]),
.wd-coupon-shell select,
.wd-coupon-shell textarea,
.wd-resume-workspace input:not([type="checkbox"]):not([type="radio"]),
.wd-resume-workspace select,
.wd-resume-workspace textarea {
  max-width: 100%;
}

@media (max-width: 767.98px) {
  .wd-checkout-steps {
    grid-template-columns: repeat(5,minmax(104px,1fr));
    width: calc(100% - 24px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }
  .alert:not(.cookiealert) {
    width: calc(100% - 24px) !important;
    margin: 12px auto !important;
    padding: 14px !important;
    border-radius: 13px !important;
    font-size: .93rem;
  }
  .company-logo:empty,
  .employer-logo:empty,
  .job-logo:empty,
  .featured-logo:empty,
  [class*="company-logo"]:empty,
  [class*="employer-logo"]:empty {
    min-width: 60px;
    min-height: 60px;
    border-radius: 14px;
  }
}


/* WORKDIRECT RESUME WORKSPACE
   I keep every resume step consistent here so the forms stay easy to maintain. */
.wd-resume-workspace {
  --wd-resume-blue: #2563eb;
  --wd-resume-purple: #6d5dfc;
  --wd-resume-ink: #0f172a;
  --wd-resume-muted: #64748b;
  padding-top: 28px;
  padding-bottom: 52px;
}
.wd-resume-workspace .col-md-9 {
  min-width: 0;
}
.wd-resume-workspace .card.card-custom {
  overflow: hidden;
  border: 1px solid rgba(37,99,235,.14) !important;
  border-radius: 24px !important;
  background: linear-gradient(145deg,rgba(255,255,255,.99),rgba(244,247,255,.95)) !important;
  box-shadow: 0 26px 64px rgba(15,23,42,.10),0 9px 24px rgba(37,99,235,.08) !important;
}
.wd-resume-workspace .card.card-custom::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg,var(--wd-resume-blue),var(--wd-resume-purple),#60a5fa);
}
.wd-resume-workspace .card-body-custom {
  padding: clamp(22px,3vw,40px) !important;
}
.wd-resume-workspace h1,
.wd-resume-workspace h2,
.wd-resume-workspace h3,
.wd-resume-workspace .main-heading,
.wd-resume-workspace .card-title {
  color: var(--wd-resume-ink) !important;
  letter-spacing: -.025em;
}
.wd-resume-workspace .form-group {
  margin-bottom: 22px !important;
  padding: 18px !important;
  border: 1px solid rgba(148,163,184,.20);
  border-radius: 16px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 7px 20px rgba(15,23,42,.035);
}
.wd-resume-workspace label,
.wd-resume-workspace .control-label {
  color: #334155 !important;
  font-weight: 750 !important;
  letter-spacing: .005em;
}
.wd-resume-workspace input[type="text"],
.wd-resume-workspace input[type="url"],
.wd-resume-workspace input[type="email"],
.wd-resume-workspace input[type="number"],
.wd-resume-workspace input[type="tel"],
.wd-resume-workspace input[type="date"],
.wd-resume-workspace select,
.wd-resume-workspace textarea,
.wd-resume-workspace .form-control {
  width: 100%;
  min-height: 52px;
  border: 1px solid #d7deeb !important;
  border-radius: 13px !important;
  background: #fff !important;
  color: var(--wd-resume-ink) !important;
  font-size: 15px;
  box-shadow: inset 0 1px 2px rgba(15,23,42,.035) !important;
  transition: border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.wd-resume-workspace textarea,
.wd-resume-workspace .tox-tinymce {
  min-height: 150px;
}
.wd-resume-workspace input:focus,
.wd-resume-workspace select:focus,
.wd-resume-workspace textarea:focus,
.wd-resume-workspace .form-control:focus {
  outline: 0 !important;
  border-color: var(--wd-resume-blue) !important;
  box-shadow: 0 0 0 4px rgba(37,99,235,.11),0 8px 18px rgba(37,99,235,.08) !important;
}
.wd-resume-workspace input[type="file"] {
  width: 100%;
  padding: 11px;
  border: 1px dashed #b8c5dc;
  border-radius: 13px;
  background: #f8faff;
  color: #475569;
}
.wd-resume-workspace input[type="file"]::file-selector-button {
  margin-right: 12px;
  padding: 9px 14px;
  border: 0;
  border-radius: 10px;
  background: #e8efff;
  color: #1d4ed8;
  font-weight: 800;
  cursor: pointer;
}
.wd-resume-workspace .btn,
.wd-resume-workspace button[type="submit"],
.wd-resume-workspace input[type="submit"] {
  min-height: 48px;
  padding: 11px 24px !important;
  border-radius: 13px !important;
  font-weight: 800 !important;
  transition: transform .18s ease,box-shadow .18s ease;
}
.wd-resume-workspace .btn-primary,
.wd-resume-workspace button[type="submit"],
.wd-resume-workspace input[type="submit"] {
  border: 0 !important;
  background: linear-gradient(135deg,var(--wd-resume-blue),var(--wd-resume-purple)) !important;
  color: #fff !important;
  box-shadow: 0 11px 24px rgba(37,99,235,.22) !important;
}
.wd-resume-workspace .btn:hover,
.wd-resume-workspace button[type="submit"]:hover,
.wd-resume-workspace input[type="submit"]:hover {
  transform: translateY(-1px);
}
.wd-resume-workspace .arrow-steps,
.wd-resume-workspace .step-navigation,
.wd-resume-workspace .resume-navigation {
  display: flex;
  gap: 7px;
  max-width: 100%;
  overflow-x: auto;
  padding: 4px 2px 10px;
  scrollbar-width: thin;
}
.wd-resume-workspace .arrow-steps .step,
.wd-resume-workspace .step-navigation > *,
.wd-resume-workspace .resume-navigation > * {
  flex: 0 0 auto;
}
.wd-resume-workspace .wd-video-label {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  margin-bottom: 10px;
  color: #334155;
  font-weight: 700;
}
.wd-resume-workspace .wd-youtube-word {
  color: #dc2626;
  font-weight: 900;
}
.wd-resume-workspace .wd-drive-word {
  font-weight: 900;
  background: linear-gradient(90deg,#0f9d58 0 32%,#f4b400 32% 64%,#4285f4 64% 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
@media (max-width: 767px) {
  .wd-resume-workspace {
    padding-top: 14px;
    padding-bottom: 34px;
  }
  .wd-resume-workspace > .row {
    margin-left: -6px;
    margin-right: -6px;
  }
  .wd-resume-workspace .card.card-custom {
    border-radius: 18px !important;
  }
  .wd-resume-workspace .card-body-custom {
    padding: 18px !important;
  }
  .wd-resume-workspace .form-group {
    margin-bottom: 16px !important;
    padding: 14px !important;
  }
  .wd-resume-workspace .form-group > [class*="col-"],
  .wd-resume-workspace .row > [class*="col-"] {
    max-width: 100%;
  }
  .wd-resume-workspace input,
  .wd-resume-workspace select,
  .wd-resume-workspace textarea,
  .wd-resume-workspace .form-control {
    font-size: 16px !important;
  }
  .wd-resume-workspace .btn,
  .wd-resume-workspace button[type="submit"],
  .wd-resume-workspace input[type="submit"] {
    width: 100%;
  }
  .wd-resume-workspace .arrow-steps,
  .wd-resume-workspace .step-navigation,
  .wd-resume-workspace .resume-navigation {
    margin-inline: -4px;
  }
}

/* Targeted production repairs — homepage alert controls and warning icon. */
.text-center .input-group:has(.alertInput) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: stretch;
  gap: 14px;
  width: 100%;
  max-width: 860px;
  margin-inline: auto;
}
.text-center .input-group:has(.alertInput) .alertInput {
  width: 100% !important;
  min-width: 0;
  height: 54px;
  margin: 0 !important;
  border-radius: 12px !important;
}
.text-center .input-group:has(.alertInput) .alertButton {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 148px;
  height: 54px;
  margin: 0 !important;
  border-radius: 12px !important;
  white-space: nowrap;
}
.alert-warning:not(.cookiealert)::before {
  content: "!" !important;
  position: absolute;
  top: 14px;
  left: 18px;
  z-index: 2;
  display: grid !important;
  place-items: center;
  width: 32px;
  height: 32px;
  color: #fff;
  background: linear-gradient(145deg,#f6b625,#d97706);
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 10px;
  box-shadow: 0 6px 14px rgba(180,105,8,.24);
  font: 800 1rem/1 system-ui,sans-serif;
}
.alert-warning:not(.cookiealert) > div > strong:first-child {
  display: block;
  min-height: 32px;
  padding-left: 44px;
  line-height: 32px;
  margin-bottom: 2px;
}
@media (max-width: 767.98px) {
  .text-center .input-group:has(.alertInput) {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }
  .text-center .input-group:has(.alertInput) .alertInput,
  .text-center .input-group:has(.alertInput) .alertButton {
    width: 100% !important;
  }
  .alert-warning:not(.cookiealert)::before {
    top: 12px;
    left: 14px;
    width: 30px;
    height: 30px;
  }
  .alert-warning:not(.cookiealert) > div > strong:first-child {
    min-height: 30px;
    padding-left: 40px;
    line-height: 30px;
  }
}

/* Hide only the obsolete message-stack warning bitmap; the modern icon remains. */
.alert-warning:not(.cookiealert) > img[src*="/image/warning"],
.alert-warning:not(.cookiealert) > img[src$="warning.gif"] {
  display: none !important;
}


/* Mobile job results, company directory and job maps only. */
@media (max-width: 767.98px) {
  .previewBox {
    min-width: 0;
    border: 1px solid rgba(37, 99, 235, 0.16) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, #ffffff 0%, #f6f9ff 100%) !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08),
                0 4px 10px rgba(37, 99, 235, 0.06) !important;
    overflow: hidden !important;
  }

  .previewBox .job_search_title,
  .previewBox h6,
  .previewBox .cname,
  .previewBox .location {
    max-width: 100%;
    word-break: normal !important;
    overflow-wrap: anywhere;
  }

  .previewBox .hide-on-desktop a.btn-sm.text-primary.fw-bold,
  .previewBox .hide-on-desktop .btn {
    min-height: 46px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0.72rem 1rem !important;
    border: 1px solid rgba(255, 255, 255, 0.34) !important;
    border-radius: 13px !important;
    background: linear-gradient(135deg, #2563eb 0%, #4f6ff1 100%) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 9px 18px rgba(37, 99, 235, 0.24),
                inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
  }

  .card.card-custom.card-hover {
    width: 100%;
    min-width: 0;
    border: 1px solid rgba(37, 99, 235, 0.14) !important;
    border-radius: 18px !important;
    background: linear-gradient(145deg, #ffffff 0%, #f7f9ff 100%) !important;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.08),
                0 4px 10px rgba(37, 99, 235, 0.06) !important;
  }

  .card-custom .logo-img {
    width: 64px !important;
    min-width: 64px !important;
    height: 64px !important;
    flex: 0 0 64px !important;
    display: grid !important;
    place-items: center;
    overflow: hidden !important;
    border: 1px solid rgba(37, 99, 235, 0.12);
    border-radius: 16px !important;
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.09);
  }

  .card-custom .logo-img img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    border-radius: 14px !important;
    object-fit: contain !important;
  }

  .card-custom .jobs-by-company-title,
  .card-custom .jobs-by-company-title a {
    min-width: 0;
    max-width: 100%;
    word-break: normal !important;
    overflow-wrap: anywhere;
    line-height: 1.3 !important;
  }

  .card-custom .btn-main {
    min-height: 44px;
    padding: 0.68rem 1rem !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #2563eb 0%, #4f6ff1 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(37, 99, 235, 0.22),
                inset 0 1px 0 rgba(255, 255, 255, 0.3) !important;
  }

  #map-canvas,
  .leaflet-container {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 300px;
    border-radius: 16px !important;
  }
}

/* Premium holder for every uploaded Featured Jobs logo; source images remain unchanged. */
.featured-job-tag img.featured-logo {
  display: block !important;
  width: 55px !important;
  height: 55px !important;
  min-width: 55px;
  min-height: 55px !important;
  max-width: 55px !important;
  max-height: 55px !important;
  padding: 8px !important;
  object-fit: contain !important;
  object-position: center;
  box-sizing: border-box;
  background: linear-gradient(145deg,#fff 0%,#eef4ff 42%,#dbeafe 100%) !important;
  border: 1px solid rgba(37,99,235,.12) !important;
  border-radius: 18px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -8px 16px rgba(37,99,235,.06),
    0 12px 24px rgba(37,99,235,.14),
    0 5px 10px rgba(15,31,61,.08) !important;
}

/* Round the uploaded artwork inside its premium holder. */
.featured-job-tag .d-flex.align-items-start > .flex-shrink-0:has(> img.featured-logo) {
  display: grid;
  place-items: center;
  width: 55px;
  height: 55px;
  min-width: 55px;
  overflow: hidden;
  background: linear-gradient(145deg,#fff 0%,#eef4ff 42%,#dbeafe 100%);
  border: 1px solid rgba(37,99,235,.12);
  border-radius: 18px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    inset 0 -8px 16px rgba(37,99,235,.06),
    0 12px 24px rgba(37,99,235,.14),
    0 5px 10px rgba(15,31,61,.08);
}
.featured-job-tag .d-flex.align-items-start > .flex-shrink-0 > img.featured-logo {
  width: 39px !important;
  height: 39px !important;
  min-width: 39px;
  min-height: 39px !important;
  max-width: 39px !important;
  max-height: 39px !important;
  padding: 0 !important;
  object-fit: contain !important;
  overflow: hidden;
  background: #fff !important;
  border: 0 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 7px rgba(15,31,61,.10) !important;
}

/* Uploaded artwork itself is circular, not only the surrounding holder. */
.featured-job-tag .d-flex.align-items-start > .flex-shrink-0 > img.featured-logo:not([src*="ui-avatars.com"]) {
  border-radius: 50% !important;
  clip-path: circle(50% at 50% 50%);
}



/* WorkDirect global company-logo shape */
.card-custom .logo-img,
.logo-img {
  width: 64px !important;
  min-width: 64px !important;
  height: 64px !important;
  flex: 0 0 64px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 2px solid rgba(79, 70, 229, 0.16) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.card-custom .logo-img img,
.logo-img img {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: 60px !important;
  height: 60px !important;
  min-width: 60px !important;
  min-height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 50% !important;
  clip-path: circle(50% at 50% 50%);
  background: #ffffff !important;
}

img[src*="image.php?image_name=logo/"] {
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 50% !important;
  clip-path: circle(50% at 50% 50%);
}