/* =========================================
   MyNextJobs - Ultimate Member Account Page Design
   New scope for /account/ UM tabs
========================================= */

.um.um-account {
  width: 100% !important;
  max-width: 1120px !important;
  margin: 0 auto !important;
  font-family: inherit !important;
}

/* Main UM form wrapper */
.um.um-account .um-form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Layout: sidebar + content */
.um.um-account .um-form > form {
  display: grid !important;
  grid-template-columns: 260px minmax(0, 1fr) !important;
  gap: 28px !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Hide mobile meta duplicate on desktop layout */
.um.um-account .um-account-meta.uimob340-show,
.um.um-account .um-account-meta.uimob500-show,
.um.um-account .um_request_name,
.um.um-account .um-clear:empty {
  display: none !important;
}

/* Left UM account sidebar */
.um.um-account .um-account-side {
  width: 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
  float: none !important;
  margin: 0 !important;
  padding: 16px !important;
  background: #ffffff !important;
  border: 1px solid #e7ecf7 !important;
  border-top: 5px solid #6d84ff !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.06) !important;
  position: sticky !important;
  top: 22px !important;
}

/* Keep profile/avatar in sidebar but make it clean */
.um.um-account .um-account-side .um-account-meta {
  display: block !important;
  margin: 0 0 16px !important;
  padding: 10px 0 18px !important;
  border-bottom: 1px solid #edf1f8 !important;
  text-align: center !important;
}

.um.um-account .um-account-side .um-account-meta-img img {
  width: 130px !important;
  height: 130px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  background: #f1f5f9 !important;
}

.um.um-account .um-account-name a {
  display: block !important;
  margin-top: 10px !important;
  color: #111827 !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.um.um-account .um-account-profile-link a {
  display: inline-flex !important;
  margin-top: 4px !important;
  color: #2563eb !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

/* Sidebar menu list */
.um.um-account .um-account-side ul {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

.um.um-account .um-account-side ul li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}

/* Hide duplicate tooltip/icon-only menu */
.um.um-account .um-account-side .um-account-icontip,
.um.um-account .um-account-side .uimob800-show {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Keep normal icon/title visible */
.um.um-account .um-account-side .uimob800-hide,
.um.um-account .um-account-side .um-account-icon,
.um.um-account .um-account-side .um-account-title {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Sidebar links */
.um.um-account .um-account-side .um-account-link {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  /*width: 100% !important;*/
  /*min-height: 46px !important;*/
  padding: 10px 12px !important;
  border-radius: 14px !important;
  background: transparent !important;
  color: #334155 !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  border: none !important;
  transition: 0.18s ease !important;
}

/* Active / hover link */
.um.um-account .um-account-side .um-account-link:hover,
.um.um-account .um-account-side .um-account-link.current {
  background: #eef3ff !important;
  color: #2447ff !important;
}

/* Icon box */
.um.um-account .um-account-side .um-account-icon {
  width: 28px !important;
  height: 28px !important;
  padding: 0px !important;
  min-width: 28px !important;
  border-radius: 25px !important;
  background: #366dff21 !important;
  color: #596edf !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
}

/* Menu title */
.um.um-account .um-account-side .um-account-title {
  color: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  padding-left: 0px !important;
  /*line-height: 1.25 !important;*/
}

/* Keep right arrow like professional menu */
.um.um-account .um-account-side .um-account-arrow {
  display: inline-flex !important;
  margin-left: auto !important;
  color: #94a3b8 !important;
  top: 14px !important;
  font-size: 16px !important;
}

/* Main content */
.um.um-account .um-account-main {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

/* Each account tab content */
.um.um-account .um-account-tab {
  padding: 26px !important;
  background: #ffffff !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 22px !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.05) !important;
}

/* Tab heading */
.um.um-account .um-account-heading {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 0 22px !important;
  padding: 0 !important;
  color: #111827 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  line-height: 1.2 !important;
}

.um.um-account .um-account-heading i {
  width: 32px !important;
  height: 32px !important;
  border-radius: 999px !important;
  background: #eef3ff !important;
  color: #2563ed !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  margin-right: 0 !important;
  top: 0 !important;
}

/* Field spacing */
.um.um-account .um-field {
  margin: 0 0 18px !important;
  padding: 0 !important;
  position: relative !important;
}

/* Labels */
.um.um-account .um-field-label {
  display: block !important;
  margin: 0 0 7px !important;
  padding: 0 !important;
}

.um.um-account .um-field-label label {
  color: #334155 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
}

/* Inputs */
.um.um-account .um-form-field,
.um.um-account .um-field-area input,
.um.um-account .um-field-area textarea,
.um.um-account .um-field-area select {
  border: 1px solid #dbe4f3 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #111827 !important;
  padding: 0 15px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  box-shadow: none !important;
  outline: none !important;
  transition: 0.18s ease !important;
}

.um.um-account .um-field-area textarea {
  min-height: 130px !important;
  padding: 14px 15px !important;
  resize: vertical !important;
}

.um.um-account .um-form-field:focus,
.um.um-account .um-field-area input:focus,
.um.um-account .um-field-area textarea:focus,
.um.um-account .um-field-area select:focus {
  border-color: #2447ff !important;
  box-shadow: 0 0 0 4px rgba(36, 71, 255, 0.08) !important;
}

/* Disabled inactive UM fields */
.um.um-account .um-form-field:disabled,
.um.um-account .um-form-field[disabled],
.um.um-account .um_account_inactive {
  background: #f8fafc !important;
  color: #94a3b8 !important;
}

/* Submit area */
.um.um-account .um-col-alt,
.um.um-account .um-col-alt-b {
  margin: 24px 0 0 !important;
  padding: 0 !important;
}

.um.um-account .um-left {
  width: 100% !important;
  float: none !important;
}

/* Buttons */
.um.um-account .um-button,
.um.um-account input[type="submit"].um-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  padding: 0 26px !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #86a4e1, #2563eb) !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  box-shadow: 0 12px 28px rgba(36, 71, 255, 0.18) !important;
  cursor: pointer !important;
  transition: 0.18s ease !important;
}

.um.um-account .um-button:hover,
.um.um-account input[type="submit"].um-button:hover {
  transform: translateY(-1px) !important;
}

.um.um-account .um-button:disabled,
.um.um-account input[type="submit"].um-button:disabled {
  background: #cbd5e1 !important;
  color: #ffffff !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Privacy radio */
.um.um-account .um-field-radio-option {
  color: #334155 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.um.um-account .um-field-radio.active:not(.um-field-radio-state-disabled) i {
  color: #2563eb !important;
}

/* Request data buttons */
.um.um-account .um-request-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  border-radius: 10px !important;
  background: #eef3ff !important;
  color: #2563ed !important;
  border: 1px solid #c7d2fe !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
  margin-top: 10px !important;
}

/* Error messages */
.um.um-account .um-field-error {
  background: #fff1f2 !important;
  color: #e11d48 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  margin-top: 8px !important;
}

/* Mobile accordion nav */
.um.um-account .um-account-nav {
  margin: 0 0 10px !important;
}

.um.um-account .um-account-nav a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 48px !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  background: #eef3ff !important;
  color: #2447ff !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

/* MyNextJobs custom tab content */
.um.um-account .mnj-um-wrap {
  width: 100% !important;
  max-width: 100% !important;
}

.um.um-account .mnj-um-panel {
  background: #ffffff !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 18px !important;
  padding: 22px !important;
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.04) !important;
}

.um.um-account .mnj-um-panel h3 {
  margin: 0 0 12px !important;
  color: #111827 !important;
  font-size: 22px !important;
  font-weight: 900 !important;
}

.um.um-account .mnj-um-empty {
  padding: 22px !important;
  border: 1px dashed #cbd5e1 !important;
  border-radius: 16px !important;
  color: #64748b !important;
  text-align: center !important;
  font-weight: 700 !important;
}

/* Reuse your old dashboard card design inside UM tabs */
.um.um-account .mnjd-hero {
  background: linear-gradient(135deg, #6d84ff 0%, #5875ff 100%) !important;
  color: #ffffff !important;
  border-radius: 24px !important;
  padding: 26px !important;
  margin-bottom: 18px !important;
  box-shadow: 0 18px 48px rgba(36, 71, 255, 0.18) !important;
}

.um.um-account .mnjd-hero h1 {
  color: #ffffff !important;
  margin: 0 0 8px !important;
  font-size: 30px !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
}

.um.um-account .mnjd-hero p {
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 15px !important;
}

.um.um-account .mnjd-hero-actions {
  margin-top: 18px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.um.um-account .mnjd-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #2447ff !important;
  text-decoration: none !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.um.um-account .mnjd-btn-outline {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
}

.um.um-account .mnjd-stats {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
  margin-bottom: 18px !important;
}

.um.um-account .mnjd-stat {
  background: #ffffff !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 18px !important;
  padding: 18px !important;
  box-shadow: 0 12px 34px rgba(15, 23, 42, 0.05) !important;
}

.um.um-account .mnjd-stat strong {
  display: block !important;
  margin-bottom: 8px !important;
  color: #2447ff !important;
  font-size: 28px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

.um.um-account .mnjd-stat span {
  color: #64748b !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}

.um.um-account .mnjd-cards {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

.um.um-account .mnjd-card {
  display: block !important;
  min-height: 145px !important;
  padding: 22px !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  color: #111827 !important;
  text-decoration: none !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.05) !important;
  transition: 0.18s ease !important;
}

.um.um-account .mnjd-card:hover {
  transform: translateY(-3px) !important;
  border-color: #b8c7ff !important;
  box-shadow: 0 18px 48px rgba(36, 71, 255, 0.10) !important;
}

.um.um-account .mnjd-icon {
  width: 42px !important;
  height: 42px !important;
  margin-bottom: 14px !important;
  border-radius: 15px !important;
  background: #eef3ff !important;
  color: #2447ff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

.um.um-account .mnjd-card h3 {
  margin: 0 0 8px !important;
  color: #111827 !important;
  font-size: 18px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
}

.um.um-account .mnjd-card p {
  margin: 0 !important;
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  font-weight: 600 !important;
}

/* Hide old headings from feature shortcodes inside UM tab */
.um.um-account .mnj-um-shortcode-wrap .mnjf-wrap,
.um.um-account .mnj-um-shortcode-wrap .mnj-saved-jobs-list {
  max-width: 100% !important;
}

.um.um-account .mnj-um-shortcode-wrap .mnjf-head {
  display: none !important;
}

/* Tablet */
@media (max-width: 980px) {
  .um.um-account .um-form > form {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }

  .um.um-account .um-account-side {
    position: static !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }

  .um.um-account .um-account-side ul {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .um.um-account .mnjd-stats,
  .um.um-account .mnjd-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 620px) {
  .um.um-account .um-account-side ul,
  .um.um-account .mnjd-stats,
  .um.um-account .mnjd-cards {
    grid-template-columns: 1fr !important;
  }

  .um.um-account .um-account-tab {
    padding: 20px !important;
  }

  .um.um-account .um-account-heading {
    font-size: 21px !important;
  }

  .um.um-account .um-button,
  .um.um-account input[type="submit"].um-button {
    width: 100% !important;
  }

  .um.um-account .mnjd-hero {
    padding: 22px !important;
  }

  .um.um-account .mnjd-hero h1 {
    font-size: 25px !important;
  }
}

/* MNJ - Ultimate Member Radio Layout Fix */
/*.um.um-account .um-field-type_radio .um-field-area {*/
/*  display: flex !important;*/
/*  align-items: center !important;*/
/*  gap: 70px !important;*/
/*  flex-wrap: wrap !important;*/
/*}*/

.um.um-account .um-field-type_radio label.um-field-radio,
.um.um-account .um-field-type_radio label.um-field-radio.um-field-half,
.um.um-account .um-field-type_radio label.um-field-radio.right {
  float: none !important;
  /*width: auto !important;*/
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

.um.um-account .um-field-type_radio label.um-field-radio input[type="radio"] {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.um.um-account .um-field-type_radio .um-field-radio-state {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  cursor: pointer !important;
}

.um.um-account .um-field-type_radio .um-field-radio-state i {
  font-size: 22px !important;
  color: #94a3b8 !important;
}

.um.um-account .um-field-type_radio label.um-field-radio.active .um-field-radio-state i {
  color: #2563eb !important;
}

.um.um-account .um-field-type_radio .um-field-radio-option {
  color: #334155 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
}

.um.um-account .um-field-type_radio .um-clear {
  display: none !important;
}


/* =========================================
   MNJ - Ultimate Member Select2 Field Design
   Safe scoped for UM Account page only
========================================= */

.um.um-account .um-field-type_select {
  margin-bottom: 20px !important;
}

.um.um-account .um-field-type_select .um-field-label {
  margin-bottom: 8px !important;
}

.um.um-account .um-field-type_select .um-field-label label {
  color: #334155 !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.3 !important;
}

/* Help icon beside label */
.um.um-account .um-field-type_select .um-tip i {
  color: #94a3b8 !important;
  font-size: 15px !important;
}

/* Select2 full width */
.um.um-account .um-field-type_select .select2-container {
  width: 100% !important;
  max-width: 100% !important;
}

/* Main select box */
.um.um-account .um-field-type_select .select2-container--default .select2-selection--single {
  height: 42px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  border: 1px solid #dbe4f3 !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  box-shadow: none !important;
  outline: none !important;
  transition: 0.18s ease !important;
}

/* Selected text */
.um.um-account .um-field-type_select .select2-container--default .select2-selection--single .select2-selection__rendered {
  width: 100% !important;
  padding-left: 15px !important;
  padding-right: 45px !important;
  color: #334155 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  line-height: 52px !important;
}

/* Placeholder / empty value */
.um.um-account .um-field-type_select .select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #94a3b8 !important;
  font-weight: 600 !important;
}

/* Arrow area */
.um.um-account .um-field-type_select .select2-container--default .select2-selection--single .select2-selection__arrow {
  width: 42px !important;
  /*height: 52px !important;*/
  top: 4px !important;
  right: 0px !important;
}

/* Arrow icon */
.um.um-account .um-field-type_select .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #94a3b8 transparent transparent transparent !important;
  border-width: 6px 5px 0 5px !important;
  margin-left: -5px !important;
  margin-top: -2px !important;
}

/* Focus / open state */
.um.um-account .um-field-type_select .select2-container--open .select2-selection--single,
.um.um-account .um-field-type_select .select2-container--focus .select2-selection--single {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.08) !important;
}

/* Disabled state */
.um.um-account .um-field-type_select .select2-container--default.select2-container--disabled .select2-selection--single {
  background: #f8fafc !important;
  color: #94a3b8 !important;
  cursor: not-allowed !important;
}

.um-field .select2.select2-container .select2-selection .select2-selection__arrow:before{
    font-size:18px !important;
}


/* =========================================
   MNJ - My Profile Tab Action Buttons
   Safe scoped, no conflict
========================================= */

.um.um-account .um-account-tab-profile .mnj-um-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 18px !important;
  align-items: center !important;
}

/* Base button */
.um.um-account .um-account-tab-profile .mnj-um-actions a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 44px !important;
  padding: 0 18px !important;
  border-radius: 14px !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
  box-shadow: 0 12px 26px rgba(37, 99, 235, 0.14) !important;
  transition: 0.18s ease !important;
  cursor: pointer !important;
}

/* First button: Open Account */
.um.um-account .um-account-tab-profile .mnj-um-actions a:first-child {
  background: linear-gradient(135deg, #2563eb, #315cff) !important;
  color: #ffffff !important;
  border-color: #2563eb !important;
}

/* Second button: Change Password */
.um.um-account .um-account-tab-profile .mnj-um-actions a:nth-child(2) {
  background: #eef3ff !important;
  color: #2563eb !important;
  border-color: #dbe6ff !important;
  box-shadow: none !important;
}

/* Hover effect */
.um.um-account .um-account-tab-profile .mnj-um-actions a:hover {
  transform: translateY(-2px) !important;
}

.um.um-account .um-account-tab-profile .mnj-um-actions a:first-child:hover {
  box-shadow: 0 16px 32px rgba(37, 99, 235, 0.22) !important;
}

.um.um-account .um-account-tab-profile .mnj-um-actions a:nth-child(2):hover {
  background: #e3ebff !important;
  border-color: #c7d8ff !important;
}

/* Mobile */
@media (max-width: 620px) {
  .um.um-account .um-account-tab-profile .mnj-um-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .um.um-account .um-account-tab-profile .mnj-um-actions a {
    width: 100% !important;
  }
}



/* My Profile panel polish */
.um.um-account .um-account-tab-profile .mnj-um-panel {
  padding: 26px !important;
  border-radius: 22px !important;
}

.um.um-account .um-account-tab-profile .mnj-um-panel p {
  margin: 0 !important;
  color: #475569 !important;
  font-size: 15px !important;
  line-height: 1.7 !important;
  font-weight: 600 !important;
}

/* =========================================
   MNJ - Modern UM Account Profile Card + Camera Upload
========================================= */

.um.um-account .um-account-side .um-account-meta {
  position: relative !important;
  overflow: hidden !important;
  padding: 20px 14px 22px !important;
  margin: 0 0 18px !important;
  border-radius: 22px !important;
  border: 1px solid #e7ecf7 !important;
  background:
    radial-gradient(circle at top left, rgba(37, 99, 235, 0.14), transparent 34%),
    linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
  box-shadow: 0 16px 38px rgba(15, 23, 42, 0.06) !important;
  text-align: center !important;
}

/* Decorative top glow */
.um.um-account .um-account-side .um-account-meta::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 72px !important;
  background: linear-gradient(135deg, #6d84ff, #2563eb) !important;
  opacity: 0.12 !important;
  pointer-events: none !important;
}

/* Avatar box */
.um.um-account .um-account-side .mnj-profile-photo-box,
.um.um-account .um-account-side .um-account-meta-img,
.um.um-account .um-account-side .um-account-meta-img-b {
  position: relative !important;
  width: 132px !important;
  height: 132px !important;
  /*display: flex !important;*/
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto 14px !important;
  z-index: 2 !important;
}

/* Avatar image */
.um.um-account .um-account-side .um-account-meta-img img,
.um.um-account .um-account-side .um-account-meta-img-b img {
  width: 126px !important;
  height: 126px !important;
  min-width: 126px !important;
  min-height: 126px !important;
  max-width: 126px !important;
  max-height: 126px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  background: #eef2f7 !important;
  border: 5px solid #ffffff !important;
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.14) !important;
}

/* =========================================
   MNJ - Avatar Hover UI: Camera or Remove
========================================= */

.um.um-account .um-account-side .mnj-profile-photo-box {
  position: relative !important;
  overflow: visible !important;
}

.um.um-account .um-account-side .mnj-profile-photo-click {
  display: block !important;
  cursor: pointer !important;
  position: relative !important;
  border-radius: 999px !important;
}

/* Hover overlay */
.um.um-account .um-account-side .mnj-photo-hover-layer {
  position: absolute !important;
  inset: 4px !important;
  z-index: 12 !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.46) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: scale(0.96) !important;
  transition: 0.22s ease !important;
  pointer-events: none !important;
}

.um.um-account .um-account-side .mnj-profile-photo-box:hover .mnj-photo-hover-layer {
  opacity: 1 !important;
  visibility: visible !important;
  transform: scale(1) !important;
  pointer-events: auto !important;
}

/* Both buttons base */
.um.um-account .um-account-side .mnj-profile-camera,
.um.um-account .um-account-side .mnj-profile-remove {
  position: static !important;
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border-radius: 999px !important;
  border: 2px solid rgba(255, 255, 255, 0.92) !important;
  color: #ffffff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  transition: 0.18s ease !important;
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.28) !important;
}

.um.um-account .um-account-side .mnj-profile-camera svg,
.um.um-account .um-account-side .mnj-profile-remove svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
}

/* Blue upload */
.um.um-account .um-account-side .mnj-profile-camera {
  background: linear-gradient(135deg, #2563eb, #315cff) !important;
}

/* Red remove */
.um.um-account .um-account-side .mnj-profile-remove {
  background: linear-gradient(135deg, #ef4444, #dc2626) !important;
}

/* Show only one icon based on photo state */
.um.um-account .um-account-side .um-account-meta.mnj-no-photo .mnj-profile-camera {
  display: inline-flex !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-no-photo .mnj-profile-remove {
  display: none !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-has-photo .mnj-profile-camera {
  display: none !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-has-photo .mnj-profile-remove {
  display: inline-flex !important;
}

.um.um-account .um-account-side .mnj-profile-camera:hover,
.um.um-account .um-account-side .mnj-profile-remove:hover {
  transform: translateY(-2px) scale(1.06) !important;
}

/* Dynamic hint */
.um.um-account .um-account-side .mnj-profile-photo-box::after {
  position: absolute !important;
  left: 50% !important;
  bottom: -30px !important;
  transform: translateX(-50%) translateY(4px) !important;
  z-index: 15 !important;
  min-width: 104px !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.88) !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  text-align: center !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: 0.18s ease !important;
  pointer-events: none !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-no-photo .mnj-profile-photo-box::after {
  content: "Upload photo" !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-has-photo .mnj-profile-photo-box::after {
  content: "Remove photo" !important;
}

.um.um-account .um-account-side .mnj-profile-photo-box:hover::after {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(0) !important;
}

/* Uploading state */
.um.um-account .um-account-side .um-account-meta.mnj-photo-uploading .mnj-photo-hover-layer {
  opacity: 1 !important;
  visibility: visible !important;
  background: rgba(15, 23, 42, 0.64) !important;
}

.um.um-account .um-account-side .um-account-meta.mnj-photo-uploading .mnj-photo-hover-layer::after {
  content: "Uploading..." !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  background: rgba(15, 23, 42, 0.78) !important;
  border-radius: 999px !important;
  padding: 7px 12px !important;
}

/* Profile link remains separate */
.um.um-account .um-account-side .um-account-profile-link a {
  cursor: pointer !important;
}


/* =========================================
   MNJ - Perfect Avatar Overlay Alignment Fix
========================================= */

/* Overlay exactly over photo */
.um.um-account .um-account-side .mnj-photo-hover-layer {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  width: 132px !important;
  height: 132px !important;
  border-radius: 999px !important;
  z-index: 20 !important;
  background: rgba(15, 23, 42, 0.46) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate(0, 0) scale(0.96) !important;
  transform-origin: center center !important;
  transition: 0.22s ease !important;
  pointer-events: none !important;
  box-sizing: border-box !important;
}

.um.um-account .um-account-side .mnj-profile-photo-box:hover .mnj-photo-hover-layer {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translate(0, 0) scale(1) !important;
  pointer-events: auto !important;
}

/* Uploading state */
.um.um-account .um-account-side .um-account-meta.mnj-photo-uploading::after {
  content: "Uploading..." !important;
  position: absolute !important;
  left: 50% !important;
  top: 72px !important;
  transform: translateX(-50%) !important;
  z-index: 20 !important;
  padding: 7px 12px !important;
  border-radius: 999px !important;
  background: rgba(15, 23, 42, 0.88) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}

/* Name */
.um.um-account .um-account-side .um-account-name {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 0 !important;
  padding: 0 !important;
}

.um.um-account .um-account-side .um-account-name > a {
  display: block !important;
  margin: 0 0 5px !important;
  color: #0f172a !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
}

/* View profile pill */
.um.um-account .um-account-side .um-account-profile-link {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
}

.um.um-account .um-account-side .um-account-profile-link a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  background: #eef3ff !important;
  color: #2563eb !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  border: 1px solid #dbe6ff !important;
}

/* Mobile */
@media (max-width: 620px) {
  .um.um-account .um-account-side .um-account-meta {
    padding: 18px 12px 20px !important;
  }

  .um.um-account .um-account-side .mnj-profile-photo-box,
  .um.um-account .um-account-side .um-account-meta-img,
  .um.um-account .um-account-side .um-account-meta-img-b {
    width: 118px !important;
    height: 118px !important;
  }

  .um.um-account .um-account-side .um-account-meta-img img,
  .um.um-account .um-account-side .um-account-meta-img-b img {
    width: 112px !important;
    height: 112px !important;
    min-width: 112px !important;
    min-height: 112px !important;
  }

  .um.um-account .um-account-side .mnj-profile-camera {
    width: 34px !important;
    height: 34px !important;
  }
}


/* Avatar image no profile link, only upload action */
.um.um-account .um-account-side .mnj-profile-photo-click {
  display: block !important;
  cursor: pointer !important;
  position: relative !important;
  border-radius: 999px !important;
  line-height: 0 !important;
}

/* View profile button goes to /account/profile/ */
.um.um-account .um-account-side .um-account-profile-link a {
  cursor: pointer !important;
}


/* =========================================
   MyNextJobs - WP Job Manager Dashboard
   Safe scoped inside UM Account Manage Jobs tab
========================================= */

.um.um-account .mnj-um-job-dashboard {
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.um.um-account .mnj-um-job-dashboard #job-manager-job-dashboard {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
}

/* Top search + add job row */
.um.um-account .mnj-um-job-dashboard .jm-dashboard__intro {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin: 0 0 20px !important;
  padding: 18px !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 20px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.05) !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard__filters {
  flex: 1 !important;
  min-width: 0 !important;
}

.um.um-account .mnj-um-job-dashboard input[type="search"],
.um.um-account .mnj-um-job-dashboard .jm-ui-input--search-icon {
  width: 100% !important;
  max-width: 360px !important;
  min-height: 46px !important;
  padding: 0 16px !important;
  border: 1px solid #dbe4f3 !important;
  border-radius: 14px !important;
  background: #f8fafc !important;
  color: #111827 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  outline: none !important;
  box-shadow: none !important;
}

.um.um-account .mnj-um-job-dashboard input[type="search"]:focus {
  border-color: #2563eb !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.08) !important;
}

/* Add Job button */
.um.um-account .mnj-um-job-dashboard .jm-dashboard__actions .jm-ui-button,
.um.um-account .mnj-um-job-dashboard .jm-ui-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 46px !important;
  padding: 0 18px !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #2563eb, #315cff) !important;
  color: #ffffff !important;
  border: none !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  box-shadow: 0 14px 30px rgba(37, 99, 235, 0.18) !important;
  transition: 0.18s ease !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard__actions .jm-ui-button:hover,
.um.um-account .mnj-um-job-dashboard .jm-ui-button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 18px 36px rgba(37, 99, 235, 0.24) !important;
}

/* Table wrapper */
.um.um-account .mnj-um-job-dashboard .job-manager-jobs {
  width: 100% !important;
  overflow: visible !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 22px !important;
  background: #ffffff !important;
  box-shadow: 0 14px 38px rgba(15, 23, 42, 0.05) !important;
}

/* Header row */
.um.um-account .mnj-um-job-dashboard .jm-dashboard-header {
  display: grid !important;
  grid-template-columns: 90px 1.7fr 1fr 1fr 150px !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 16px 18px !important;
  border-bottom: 1px solid #edf1f8 !important;
  background: #f8fafc !important;
  border-radius: 22px 22px 0 0 !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard-header .jm-dashboard-job-column-label {
  color: #64748b !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

/* Rows */
.um.um-account .mnj-um-job-dashboard .jm-dashboard-rows {
  display: flex !important;
  flex-direction: column !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard-job {
  display: grid !important;
  grid-template-columns: 90px 1.7fr 1fr 1fr 150px !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 18px !important;
  border-bottom: 1px solid #edf1f8 !important;
  background: #ffffff !important;
  transition: 0.18s ease !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard-job:last-child {
  border-bottom: none !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard-job:hover {
  background: #f8fbff !important;
}

/* Hide repeated mobile labels on desktop */
.um.um-account .mnj-um-job-dashboard .jm-dashboard-job .jm-dashboard-job-column-label {
  display: none !important;
}

/* Company logo */
.um.um-account .mnj-um-job-dashboard .company_logo {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 16px !important;
  object-fit: cover !important;
  background: #f1f5f9 !important;
  border: 1px solid #e7ecf7 !important;
  padding: 5px !important;
}

/* Job title */
.um.um-account .mnj-um-job-dashboard .job_title .job-title {
  display: inline-block !important;
  color: #0f172a !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  margin-bottom: 8px !important;
}

.um.um-account .mnj-um-job-dashboard .job_title .job-title:hover {
  color: #2563eb !important;
}

/* Status badges */
.um.um-account .mnj-um-job-dashboard .job-status {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin: 0 !important;
}

.um.um-account .mnj-um-job-dashboard .job-status span {
  display: inline-flex !important;
  align-items: center !important;
  min-height: 26px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.um.um-account .mnj-um-job-dashboard .job-status-publish {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border: 1px solid #a7f3d0 !important;
}

.um.um-account .mnj-um-job-dashboard .job-status-expired {
  background: #fff7ed !important;
  color: #c2410c !important;
  border: 1px solid #fed7aa !important;
}

/* Date and views */
.um.um-account .mnj-um-job-dashboard .date,
.um.um-account .mnj-um-job-dashboard .stats {
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1.5 !important;
}

.um.um-account .mnj-um-job-dashboard .date small,
.um.um-account .mnj-um-job-dashboard .stats small {
  display: block !important;
  margin-top: 3px !important;
  color: #94a3b8 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

/* Actions column */
.um.um-account .mnj-um-job-dashboard .job-dashboard-job-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  position: relative !important;
}

/* Primary small action */
.um.um-account .mnj-um-job-dashboard .jm-dashboard-action--primary,
.um.um-account .mnj-um-job-dashboard .jm-ui-button--outline {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 34px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
  background: #eef3ff !important;
  color: #2563eb !important;
  border: 1px solid #dbe6ff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

.um.um-account .mnj-um-job-dashboard .jm-dashboard-action--primary:hover,
.um.um-account .mnj-um-job-dashboard .jm-ui-button--outline:hover {
  background: #e3ebff !important;
  border-color: #c7d8ff !important;
}

/* Three-dot menu */
.um.um-account .mnj-um-job-dashboard .jm-ui-actions-menu {
  position: relative !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-actions-menu summary {
  list-style: none !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-actions-menu summary::-webkit-details-marker {
  display: none !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__open-button {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 12px !important;
  background: #f8fafc !important;
  border: 1px solid #e7ecf7 !important;
  color: #334155 !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Dots icon fallback */
.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__open-button::before {
  content: "⋯" !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  color: #64748b !important;
}

/* Dropdown */
.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content {
  position: absolute !important;
  right: 0 !important;
  top: 44px !important;
  z-index: 999 !important;
  min-width: 180px !important;
  padding: 8px !important;
  border: 1px solid #e7ecf7 !important;
  border-radius: 16px !important;
  background: #ffffff !important;
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.14) !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content a {
  display: flex !important;
  align-items: center !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  border-radius: 10px !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content a:hover {
  background: #f8fafc !important;
  color: #2563eb !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content .job-dashboard-action-delete {
  color: #dc2626 !important;
}

.um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content .job-dashboard-action-delete:hover {
  background: #fff1f2 !important;
  color: #dc2626 !important;
}

/* Pagination */
.um.um-account .mnj-um-job-dashboard .job-manager-pagination {
  margin: 22px 0 0 !important;
}

.um.um-account .mnj-um-job-dashboard .page-numbers {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: center !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.um.um-account .mnj-um-job-dashboard .page-numbers li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.um.um-account .mnj-um-job-dashboard .page-numbers a,
.um.um-account .mnj-um-job-dashboard .page-numbers span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 38px !important;
  height: 38px !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  border: 1px solid #e7ecf7 !important;
  color: #334155 !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  text-decoration: none !important;
}

.um.um-account .mnj-um-job-dashboard .page-numbers .current {
  background: #2563eb !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

/* Tablet responsive */
@media (max-width: 980px) {
  .um.um-account .mnj-um-job-dashboard .jm-dashboard__intro {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .um.um-account .mnj-um-job-dashboard input[type="search"],
  .um.um-account .mnj-um-job-dashboard .jm-ui-input--search-icon {
    max-width: 100% !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-header {
    display: none !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job {
    display: grid !important;
    grid-template-columns: 60px minmax(0, 1fr) !important;
    gap: 12px 14px !important;
    padding: 18px !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .company {
    grid-row: span 3 !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .job_title,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .date,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .stats,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .actions {
    grid-column: 2 !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .actions {
    justify-content: flex-start !important;
    margin-top: 4px !important;
  }

  .um.um-account .mnj-um-job-dashboard .company_logo {
    width: 50px !important;
    height: 50px !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .jm-dashboard-job-column-label {
    display: block !important;
    margin-bottom: 4px !important;
    color: #94a3b8 !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
  }
}

/* Mobile */
@media (max-width: 620px) {
  .um.um-account .mnj-um-job-dashboard .jm-dashboard__intro {
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .um.um-account .mnj-um-job-dashboard .job-manager-jobs {
    border-radius: 18px !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .company,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .job_title,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .date,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .stats,
  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .actions {
    grid-column: 1 !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-dashboard-job .company {
    grid-row: auto !important;
  }

  .um.um-account .mnj-um-job-dashboard .job-dashboard-job-actions {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }

  .um.um-account .mnj-um-job-dashboard .jm-ui-action-menu__content {
    right: auto !important;
    left: 0 !important;
  }
}
