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

/* Login Page Styles */

body {
  display: flex !important;
  justify-content: center !important;
  font-family: 'Roboto', sans-serif !important;
  height: auto !important;
}

/* Change autocomplete styles in WebKit */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important;
}

@media screen and (min-width: 577px) {
  .fzYINk {
    width: 100% !important;
  }
}

@media screen and (min-width: 769px) {
  .fzYINk {
    width: 480px !important;
  }
}

@media screen and (min-width: 1200px) {
  .kcESSu {
    width: 50% !important;
    height: 58% !important;
  }

  .hZzKCo {
    display: block !important;
  }

  .fzYINk {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .sc-fGjrnr .ISOjS {
    width: 167px !important;
    height: 47px !important;
    position: absolute !important;
    left: 0px !important;
    margin-left: 35% !important;
    margin-top: 100px !important;
  }
}

@media screen and (min-width: 1566px) {
  .hZzKCo,
  .fzYINk {
    width: 50% !important;
    background-color: white !important;
  }
}

/* React Select Style Customization Start */
.css-1uy8qsf-control {
  box-shadow: 0 0 0 1px #ffffff !important;
}

.css-1jqq78o-placeholder {
  /* display: none; */
  font-size: 14px !important;
  color: #898a9a !important;
}
/* React Select Style Customization End */

.csBXWs {
  background-color: white !important;
  height: 48px !important;
}

.hZzKCo,
.fzYINk {
  background-color: white !important;
}

/* .ISOjS {
    width: 167px !important;
    height: 47px !important;
} */

.fqGemd {
  height: 48px !important;
  border-radius: 8px !important;
}

.gKIMkJ {
  visibility: hidden !important;
}

/* General Styles */
.hJUERu {
  background-color: #f5fbf6 !important;
  color: #009b5b !important;
}

/* Hover Effects */
.fermcI:hover {
  background-color: rgb(247, 247, 247) !important;
}

/* Specific Class Styles */
.cvvOAe {
  background-color: #009b5b !important;
}

/* .jLnlDZ {
  background: rgb(255, 255, 255) !important;
} */

/* Shared Styles */
.bpcGYZ,
.crFvUi,
.bppTPz:hover,
.jhsgXV:hover {
  border-color: #009b5b !important;
  color: #009b5b !important;
}

.bpcGYZ:hover,
.crFvUi:hover,
.hNokpH:hover,
.cxiFPe:hover {
  background-color: #f5fbf6 !important;
}

/* Other Class Styles */
.jHaNOf {
  border-color: #eeeeef !important;
  padding: 4px !important;
  border-radius: 8px !important;
}

.cxiFPe,
.hNokpH {
  color: #009b5b !important;
}

.gGQMaR,
.grTLTH,
.fqGemd {
  background-color: #009b5b !important;
  border-color: #009b5b !important;
}

.fqGemd:hover {
  background-color: #038850 !important;
  border-color: #038850 !important;
}

/* .jNOOKd {
  padding: 0 !important;
} */

.kiWtTE {
  border: transparent !important;
}

td {
  border-top: none !important;
}

table {
  border-radius: 4px;
  overflow-x: auto !important;
  width: 100% !important;
  max-width: 100vw !important;
}

.jrACBM:not(.selected):hover {
  background: #f4fbf6 !important;
  transition: 0.3s !important;
}

.WHCAL:hover,
.jyJIPH {
  color: #009b5b !important;
}

.haenfI {
  background-color: #009b5b !important;
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.csQxTD,
.iaimlm,
.fHYlJC {
  border-radius: 4px;
}

.iaimlm .adminjs_Icon,
.fHYlJC .adminjs_Icon {
  color: #898a9a !important;
}

.fHYlJC .adminjs_DropDownItemAction {
  color: black !important;
}

/* Hover Effects for Dropdown Items */
.iaimlm:hover,
.fHYlJC:hover {
  background-color: #009b5b !important;
}

.iaimlm .adminjs_DropDownItemAction:hover,
.fHYlJC .adminjs_DropDownItemAction:hover {
  color: rgb(255, 255, 255) !important;
}

/* Input Styles */
input {
  border-radius: 8px !important;
}

input:focus {
  border-color: #009b5b !important;
}

.hZzKCo {
  display: none !important;
}

.kcESSu,
.hZzKCo,
.fzYINk {
  border-radius: 24px !important;
}

.dRhYcc::before {
  content: '' !important;
}

/* .bTovaB {
    margin-top: 30px;
} */

.bulzpw {
  height: 100px !important;
}

.eOGlIj {
  font-size: 16px !important;
  font-weight: 600 !important;
}

.css-p6wpjx-control,
.css-1u4nhqf-control {
  border-radius: 8px !important;
  height: 48px !important;
}

.css-1u4nhqf-control:hover {
  border-color: #009b5b !important;
}

.css-eglc4o-menu {
  border-radius: 8px !important;
}

.dToggm {
  display: none !important;
}

.fsTujr {
  width: 12px !important;
  height: 12px !important;
}

.kAGMyk {
  display: none !important;
}

.sZaIG {
  /* visibility: hidden !important; */
  display: none !important;
}

.grTLTH {
  width: 12px !important;
  height: 12px !important;
}

.dashboardContainer {
  height: 100%;
  padding: 24px;
}

.heading {
  font-size: 16px;
  font-weight: 500;
}

.statusHeading {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 16px;
}

.topBar {
  height: auto;
  padding-top: 24px;
  padding-bottom: 24px;
  margin-bottom: 24px;
  display: flex;
  justify-content: space-between;
}

.currentStatus {
  margin-bottom: 32px;
}

.cardContainer {
  display: flex;
  justify-content: space-between;
  gap: 24px;
}

.cardSection {
  height: 168px;
  width: 100%;
  background-color: white;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.sortSelect {
  width: auto;
  height: auto;
  padding: 8px 16px 8px 16px;
  border-radius: 4px;
  background-color: transparent;
  border-color: #eeeeef;
}

.sortSelect:focus {
  border-color: #eeeeef;
}

.cardHeading {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 8px;
}

.cardIcon {
  width: 40px;
  height: 40px;
  border-radius: 999999px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.my-custom-icon {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAAsTAAALEwEAmpwYAAABZWlDQ1BEaXNwbGF5IFAzAAB4nHWQvUvDUBTFT6tS0DqIDh0cMolD1NIKdnFoKxRFMFQFq1OafgltfCQpUnETVyn4H1jBWXCwiFRwcXAQRAcR3Zw6KbhoeN6XVNoi3sfl/Ticc7lcwBtQGSv2AijplpFMxKS11Lrke4OHnlOqZrKooiwK/v276/PR9d5PiFlNu3YQ2U9cl84ul3aeAlN//V3Vn8maGv3f1EGNGRbgkYmVbYsJ3iUeMWgp4qrgvMvHgtMunzuelWSc+JZY0gpqhrhJLKc79HwHl4plrbWD2N6f1VeXxRzqUcxhEyYYilBRgQQF4X/8044/ji1yV2BQLo8CLMpESRETssTz0KFhEjJxCEHqkLhz634PrfvJbW3vFZhtwM4v2tpCAzidoZPV29p4BBgaAG7qTDVUR+qh9uZywPsJMJgChu8os2HmwiF3e38M6Hvh/GMM8B0CdpXzryPO7RqFn4Er/QfBIQM2AAABN0lEQVR4Ac1SQU6DQBR9w8Baj8AFjPYE4gVM2KmYCEnTxJ2ewK073ZkWE3BRdYnxAJUT0MQLcAO70U0r45+h0nZaSLvrS+bn8eG///jzgSY8+DYiOg0wat88ehcwJxkm40zxGvCV2dC7o3gLJrrUIyV+j+M94P0z1T9l0C2b44jSBxDFNTrP8VTwiuINnRym5SKI82WB8NyhjlHp6/cIwWu+KH5iw+IDxQvhkvhQ0nIGvTMfEAMUbAj+3VoqlrikHLdaEEjBWIbuqXQFs/TBHAjxhk7fRROCeETRR8/bBTf2ZwLKC/uquHRksEOt/APt/tP0x0dV2cpO0hHgzGX05wom6iE7BoqFXqzdF5odbIBtEhCwsS4E2/mn5WjkFspF2gSscNF+SWazlavKDWetYusnQZCoXfgDRGlXD7Q53XEAAAAASUVORK5CYII=');
  background-size: cover; /* or 'contain', depending on your preference /
    width: 24px; / Adjust the width and height based on your image size */
  height: 24px;
}

#description {
  background-color: white !important;
  height: 100px !important;
  border-radius: 8px !important;
  resize: none;
}

#descriptionBn {
  background-color: white !important;
  height: 100px !important;
  border-radius: 8px !important;
  resize: none;
}

#facilities {
  background-color: white !important;
  height: 100px !important;
  border-radius: 8px !important;
  resize: none;
}

#facilitiesBn {
  background-color: white !important;
  height: 100px !important;
  border-radius: 8px !important;
  resize: none;
}

[data-css='Job-edit-country'] {
  width: 48% !important;
  float: left;
  margin-right: 4%;
}

[data-css='Job-edit-currency'] {
  width: 12% !important;
  float: left;
  margin-right: 1%;
}

[data-css='Job-edit-salary'] {
  width: 35% !important;
  float: left;
}

[data-css='Job-edit-skillCategory'] {
  width: 48% !important;
  float: left;
  margin-right: 4%;
}

[data-css='Job-edit-skill'] {
  width: 48% !important;
  float: left;
}

.gMsCSH.duDtti.adminjs_Box {
  display: flex;
  justify-content: center;
}

[data-css='Job-show-drawer-content'] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

[data-css='Job-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

[data-css='Applicant-show-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
}

[data-css='Applicant-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

[data-css='Job-show-fileUrl'] {
  flex: none !important;
  width: 100%;
}

/*Agency Request */
[data-css='AgencyRequest-show-drawer-content'] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

[data-css='AgencyRequest-show-tradeLicense'] {
  grid-column: 1 / -1;
}

[data-css='AgencyRequest-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

[data-css='Agency-show-drawer-content'] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

[data-css='Agency-show-tradeLicense'] {
  grid-column: 1 / -1;
}

[data-css='Agency-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

/*Agent Request */
[data-css='AgentRequest-show-drawer-content'] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

[data-css='AgentRequest-show-agentNid'] {
  grid-column: 1 / -1;
}

[data-css='AgentRequest-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

[data-css='Agent-show-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
}

[data-css='Agent-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

/*Medical Center */
[data-css='MedicalCenter-show-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
}

[data-css='MedicalCenter-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

[data-css='data-entry-user-show-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
}

[data-css='data-entry-user-show-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

/* [data-css='Employer-new-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
} */

[data-css='Employer-new-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

/* [data-css='Employer-edit-drawer-content'] {
  display: flex;
  flex-wrap: wrap;
  gap: 16px; /* Adjust the gap between columns and rows as needed */
} */

[data-css='Employer-edit-drawer-content'] > section {
  flex: 1 1 calc(50% - 16px); /* Adjust the width of each section, considering the gap */
  box-sizing: border-box; /* Ensure padding and border are included in the width calculation */
}

/* [data-css='Employer-show-drawer-content'] {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
} */

/* [data-css='Employer-show-drawer-content'] > section {
  flex: 1 1 calc(25% - 16px); 
  box-sizing: border-box; 
}  */

[data-css='data-entry-user-show-drawer-content'] > section > section {
  word-wrap: break-word;
}

[data-css='AgencyRequest-reject-button'] {
  color: rgb(194, 0, 18) !important;
  border: 1px solid rgb(194, 0, 18) !important;
}

[data-css='AgentRequest-reject-button'] {
  color: rgb(194, 0, 18) !important;
  border: 1px solid rgb(194, 0, 18) !important;
}

[data-css='Job-getCurrentAdminRole-button'] {
  display: none !important;
}

.sc-gjTGSA.duDtti.adminjs_Text {
  display: none;
}

@media (max-width: 768px) {
  .responsive-flex {
    flex-direction: column;
  }
}

/* Grid wrapper that changes column count responsively */
.form-wrapper {
  background-color: white;
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.grid-2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.grid-3 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
.grid-4 {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-width: 768px) {
  .grid-2 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid-3 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid-4 {
    grid-template-columns: repeat(4, 1fr);
  }
}

.center-submit {
  display: flex;
  justify-content: center;
}

.login-forgot-password {
  margin-top: 1rem;
  color: #4a5568;
  font-size: 0.875rem;
  text-align: center;
}

.container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background-color: #f3f4f6;
}

.box {
  background-color: #ffffff;
  padding: 3rem;
  border-radius: 24px;
  box-shadow: rgba(137, 138, 154, 0.15) 0px 15px 24px 0px;
  width: 100%;
  max-width: 480px;
  box-sizing: border-box;
  margin: 32px;
}

.img_container {
  display: flex;
  justify-content: start;
  object-fit: contain;
  width: 100%;
  margin-bottom: 32px;
}

.centeredText {
  text-align: center;
}

.fullWidthButton {
  width: 100%;
}

.button_container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
  flex-direction: column;
}

.forgot_password {
  color: #009b5b;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-family: Roboto, sans-serif;
}

.login {
  background-color: #009b5b;
  padding: 0.75rem 1.5rem;
  height: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  border-radius: 0.375rem;
  width: 140px;
  font-family: Roboto, sans-serif;
}

.login:hover {
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Media query for larger screens */
@media (min-width: 1024px) {
  .box {
    max-width: 744px;
  }

  .img_container {
    justify-content: center;
  }
}

.blojkt {
  background: none;
  border-top: none rgb(48, 64, 214);
  border-right: none rgb(48, 64, 214);
  border-left: none rgb(48, 64, 214);
  border-image: initial;
  padding: 16px 8px !important;
  cursor: pointer;
  border-bottom: 2px solid #009b5b !important;
  user-select: none;
  font-family: Roboto, sans-serif;
  font-size: 14px;
  line-height: 24px;
  color: #009b5b !important;
}

/* Phone Verification Banner */
.welcome-banner-text-container {
  display: flex;
  flex-direction: column;
  max-width: 54%;
}

@media (max-width: 767px) {
  .welcome-banner-text-container {
    max-width: 100%;
  }
}

.welcome-banner-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #009b5b;
}

.welcome-banner-heading {
  font-family: 'Roboto', sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.2;
  color: #222;
  margin: 12px 0 8px 0;
}

.welcome-banner-subheading {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.4;
  color: #646f76;
}

/* Login Page New Styles */
.login-page-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background-color: #f7fafc; /* A light gray background like in the image */
}

.login-card {
  display: flex;
  background-color: #ffffff;
  border-radius: 24px;
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -2px rgba(0, 0, 0, 0.05);
  overflow: hidden;
  max-width: 960px; /* Adjust as needed */
  width: 90%;
  margin: 2rem;
}

.login-logo-wrapper {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  position: relative;
  background-color: #fff; /* White background for the logo part */
  border-right: none;
  border-bottom: 1px solid #e2e8f0;
}

.login-logo-img {
  max-width: 220px;
  height: auto;
  z-index: 1;
}

.login-logo-decoration {
  position: absolute;
  bottom: -60px;
  left: -60px;
  width: 200px;
  height: 200px;
  border: 1px solid #d1e7dd;
  border-radius: 50%;
  z-index: 0;
}

.login-logo-decoration::after {
  content: '';
  position: absolute;
  bottom: 15px;
  left: 15px;
  width: 170px;
  height: 170px;
  border: 1px solid #d1e7dd;
  border-radius: 50%;
}

.login-form-wrapper {
  flex: 1;
  padding: 1.5rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.login-form {
  width: 100%;
  max-width: 360px; /* Limit form width */
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.login-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 100%;
  letter-spacing: 0%;
  margin-bottom: 0.5rem;
  color: #1a202c;
  align-self: flex-start;
}

.login-subtitle {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 100%;
  letter-spacing: 0%;
  color: #718096;
  margin-bottom: 2rem;
  align-self: flex-start;
}

.login-inputs-container {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  width: 100%;
  margin-bottom: 1rem;
}

.login-inputs-container .flex.flex-col.gap-2 > .text-sm {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0%;
  vertical-align: middle;
}

.login-button {
  width: 100%;
  background-color: #009b5b !important;
  color: white !important;
  padding: 0.75rem;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s;
  margin-top: 1rem;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 1%;
}

.login-button:hover {
  background-color: #009b5b70;
}

.login-button:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
}

.login-forgot-password {
  margin-top: 1rem;
  color: #4a5568;
  font-size: 0.875rem;
  text-decoration: none;
  align-self: center;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 100%;
  letter-spacing: 1%;
}

.login-forgot-password:hover {
  text-decoration: underline;
}

/* Responsive styles */
@media (max-width: 860px) {
  .login-page-container {
    background-color: #fff;
  }

  .login-card {
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    margin: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .login-logo-wrapper {
    padding: 2.5rem;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
  }

  .login-form-wrapper {
    padding: 2rem;
    flex-grow: 1;
    justify-content: center;
  }

  .login-form {
    align-items: center;
  }

  .login-title,
  .login-subtitle {
    align-self: center;
    text-align: center;
  }
}

@media (max-width: 480px) {
  .login-logo-wrapper {
    padding: 1.5rem;
  }

  .login-form-wrapper {
    padding: 1.5rem;
  }

  .login-title {
    font-size: 1.75rem;
  }

  .login-subtitle {
    font-size: 0.9rem;
  }

  .login-logo-decoration {
    bottom: 0;
  }

  .login-logo-wrapper {
    flex-grow: 0;
  }

  .login-form-wrapper {
    flex-grow: 0;
  }
}

/* Forgot Password & Reset Password Page */
.fp-form {
  width: 100%;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.fp-logo-container {
  margin-bottom: 2rem;
}

.fp-logo-container img {
  max-width: 180px;
}

.fp-title {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 20px;
  color: #009b5b;
  margin-bottom: 2.5rem;
}

.fp-input-group {
  width: 100%;
  max-width: 360px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
}

.fp-input-group label {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 12px;
}

.fp-input-group input {
  width: 100%;
  height: 48px;
  padding: 0 1rem;
  border-radius: 8px;
  border: 1px solid #c5c6cd;
  font-size: 14px;
}

.fp-input-group input:focus {
  border-color: #009b5b;
  outline: none;
}

.fp-button {
  width: 100%;
  max-width: 360px;
  background-color: #009b5b;
  color: white;
  padding: 0.75rem;
  border: none;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  transition: background-color 0.3s;
}

.fp-button:hover {
  background-color: #00824b;
}

.fp-back-link {
  margin-top: 1.5rem;
  color: #009b5b;
  font-size: 0.875rem;
  text-decoration: none;
  display: flex;
  align-items: center;
}

.fp-back-link:hover {
  text-decoration: underline;
}

.fp-subtitle {
  text-align: center;
  font-family: 'Roboto', sans-serif;
  color: #646f76;
}

.hidden {
  display: none;
}
/*
 * Job List Table Responsive Cell Width
 * Restricts the width of each cell in the job list table to prevent overflow and ensure a clean, consistent appearance.
 * Applies ellipsis for overflowed text and keeps content on a single line for better readability.
 */
[data-css='Job-list-table-wrapper'] [data-css^='Job-list-'] {
  max-width: 180px !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  /* display: block !important; */
  overflow: hidden !important;
  line-height: 1.8 !important;
  vertical-align: middle !important;
}

[data-css='Application-list-table-wrapper'] [data-css^='Application-list-'] {
  width: 80px !important;
  /* white-space: nowrap !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important; */
  line-height: 1.8 !important;
  vertical-align: middle !important;
}

[data-css='Application-list-applicantPassportNumber'] {
  width: 40px !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  overflow: hidden !important;
  line-height: 1.8 !important;
  vertical-align: middle !important;
}

/*
 * Job List Table Wrapper
 * Enables horizontal scrolling for the job list table and adds spacing below the table for layout consistency.
 */
[data-css='Job-list-table-wrapper'],
[data-css='Application-list-table-wrapper'] {
  overflow-x: auto !important;
  width: 100%;
  margin-bottom: 32px !important;
}

/*
 * Checkbox Cell Styling in Job List Table
 * Sets a fixed width for the checkbox column to keep checkboxes aligned and compact.
 */
[data-css='Job-list-table-wrapper'] [data-css='Job-checkbox-table-cell'] {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  text-align: center;
  padding: 0;
}

[data-css='Application-list-table-wrapper']
  [data-css='Application-checkbox-table-cell'] {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  text-align: center;
  padding: 0;
}

/*
 * Job Table Layout
 * Ensures the job table uses a fixed layout for consistent column sizing.
 */
[data-css='Job-table'],
[data-css='Application-table'] {
  table-layout: fixed;
  width: 100%;
}

/*
 * Job Table Head Row Cell Sizing
 * Sets a fixed width for header cells to align with the body cells and prevent layout shifts.
 */
[data-css='Job-table-head-row'] > td,
[data-css='Application-table-head-row'] > td {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
  text-align: start;
  overflow: hidden;
  text-overflow: ellipsis !important;
}

[data-css='Job-table-head-row'] > td > a,
[data-css='Application-table-head-row'] > td > a {
  width: 60px;
  min-width: 60px;
  max-width: 60px;
  text-align: start;
  overflow: hidden;
  text-overflow: ellipsis !important;
}

/*
 * Robust Word Breaking and Ellipsis for Job List Table Cells
 * Ensures that all content within job list table cells and their children is truncated with ellipsis if it overflows,
 * and prevents text from wrapping to a new line. This keeps the table compact and readable even with long content.
 */
section[data-css^='Job-list-'],
section[data-css^='Employer-list-'] {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
section[data-css^='Job-list-'] > *,
section[data-css^='Job-list-'] > * > *,
section[data-css^='Employer-list-'] > *,
section[data-css^='Employer-list-'] > * > * {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: break-all;
}

[data-css='Application-list-job'] > *,
[data-css='Application-list-recruiteStage'] > * {
  text-align: start !important;
}

.adminjs_ResourceTableWrapper,
.adminjs_Box,
.table-container {
  overflow: visible !important;
}

.iyZiPe {
  border: none !important;
}

/* src/components/CustomCandidateList.css */
.candidate-list-container {
  width: 100%;
  padding: 32px;
  background-color: #ffffff;
  border-radius: 4px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 32px;
}

.list-header {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media (max-width: 1024px) {
  .list-header {
    flex-direction: column;
    gap: 16px;
    align-items: stretch;
  }
}

.list-title {
  font-size: 20px;
  font-weight: 400;
}

.list-controls {
  display: flex;
  gap: 16px;
  align-items: center;
}

.iYABDt {
  background-color: #ffffff !important;
}

.fPJgux {
  background-color: #009b5b !important;
  border-color: #009b5b !important;
}

.dlISEV {
  background-color: #ed2939 !important;
  border-color: #ed2939 !important;
}

thead {
  background-color: #f5fbf6 !important;
}

[data-css='notice-wrapper'] {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 1000;
}
