/* =========================
   LOGIN SECTION
========================= */
.co-login-sec{
   min-height: 100vh;
   position: relative;
   overflow: hidden;
   
}

/*MAIN CONTAINER */
.co-login-sec .co-login-container.ast-container{
   position: relative;
   z-index: 5;
   width: 100%;
   min-height: 100vh;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   padding: 40px 20px;
   margin: 0 auto;
   box-sizing: border-box;
}
/*TOP BACKGROUND*/
.co-login-bg-top{
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 50vh;
   background: linear-gradient(
      to right,
      #DA3027 0%,
      #E68724 100%
   );
}

/*BOTTOM BACKGROUND*/
.co-login-bg-bot{
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 50vh;
   background: #F5F0E9;
}

/*LOGO */
.co-logo-wrap{
   margin-bottom: 30px;
   text-align: center;
}

.co-logo-wrap img{
   width: 260px;
   height: auto;
   filter: brightness(0) invert(1);
   display: block;
   margin: 0 auto;
   margin-bottom: inherit;
}

/*WHITE LOGIN BOX*/
.co-login-sec .co-login-div{
   width: 100%;
   max-width: 560px;
   background: #FFFFFF;
   padding: 55px 50px;
   border-radius: 24px;
   box-shadow: 0 15px 40px rgba(0,0,0,0.08);
   box-sizing: border-box;
}

/*TITLE */
.co-login-sec .clbd-title{
   margin: 0 0 30px;
   font-family: "Open Sans", sans-serif;
   font-size: 25px;
   font-weight: 700;
   color: #242424;
   text-align: center;
   line-height: 1.2;
}

/*FORM*/
.co-login-sec #co-login-form{
   width: 100%;
   max-width: 400px;
   margin: 0 auto;
}

/*INPUT GROUP*/
.co-login-sec .login-username,
.co-login-sec .login-password{
   position: relative;
   margin-bottom: 20px;
}

/* LABEL*/
.co-login-sec .login-username,
.co-login-sec .login-password{
   position: relative;
   margin-bottom: 20px;
}

/* LABEL */
.co-login-sec #co-login-form label{
   position: absolute;
   top: 10px;
   left: 22px;
   font-size: 12px;
   font-weight: 600;
   color: #666;
   pointer-events: none;
   z-index: 2;
}

/* RED STAR */
.co-login-sec #co-login-form label::after{
   content: " *";
   color: #DA3027;
}

/* INPUT */
.co-login-sec #co-login-form input.input{
   width: 100%;
   height: 58px;
   padding: 30px 22px 8px;
   background: #EFEFEF;
   border: none;
   border-radius: 999px;
   font-size: 15px;
   box-sizing: border-box;
   transition: 0.3s ease;
}


.co-login-sec #co-login-form input.input:focus{
   outline: none;
   background: #EEEEEE;
}

/* FORGOT PASSWORD - Login Page*/
.co-login-sec .co-forgot-password-wrap{
   margin-top: -15px;
   margin-bottom: 22px;
}

.co-login-sec .co-forgot-password-link{
   font-size: 13px;
   color: #DA3027;
}

/* BUTTON*/
.co-login-sec #wp-submit{
   width: 100%;
   height: 48px;
   border: none;
   border-radius: 999px;
    background: linear-gradient(to right,#F28C28,#D65A00);
   color: #FFFFFF;
   font-size: 15px;
   font-weight: 600;
   cursor: pointer;
   transition: 0.3s ease;
   margin-bottom: 25px;
}

.co-login-sec #wp-submit:hover{
   transform: translateY(-1px);
   opacity: 0.95;
   background:#242424;
}

/*SIGN UP*/
.co-login-sec .clbd-sign-up-div{
   text-align: center;
}

.co-login-sec .clbd-sign-up-text{
   font-size: 14px;
   color: #242424;
}

.co-login-sec .clbd-sign-up-text a{
   color: #DA3027;
   text-decoration: none;
   font-weight: 600;
}
.co-login-sec .co-forgot-password-link{
   font-size: 13px;
   color: #DA3027;
   text-decoration: none;
   transition: all 0.25s ease;
}

/* HOVER EFFECT */
.co-login-sec .co-forgot-password-link:hover{
   color: #F28C28;
   letter-spacing: 0.3px;
   text-decoration: underline;
}
/*RESPONSIVE*/
/*MOBILE RESPONSIVE*/
@media (max-width: 768px){

   .co-login-sec{
      min-height: 100vh;
      overflow: hidden;
   }

   /* MAIN CONTAINER */
   .co-login-sec .co-login-container.ast-container{
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: 20px 15px;
      box-sizing: border-box;
   }

   /* LOGO */
   .co-logo-wrap{
      margin-bottom: 18px;
   }

   .co-logo-wrap img{
      width: 170px;
      height: auto;
      margin-bottom: 20px;
   }

   /* LOGIN BOX */
   .co-login-sec .co-login-div{
      width: 100%;
      padding: 35px 22px;
      border-radius: 24px;
      box-sizing: border-box;
   }

   /* TITLE */
   .co-login-sec .clbd-title{
      font-size: 20px;
      line-height: 1.2;
      margin-bottom: 12px;
   }
 /* FORM */
   .co-login-sec #co-login-form{
      width: 100%;
      max-width: 100%;
   }

   /* INPUT */
   .co-login-sec #co-login-form input.input{
      height: 42px;
      font-size: 14px;
      padding: 20px 20px 8px;
   }

   /* BUTTON */
   .co-login-sec #wp-submit{
      height: 45px;
      font-size: 15px;
   }

   /* SIGNUP TEXT */
   .co-login-sec .clbd-sign-up-text{
      font-size: 14px;
      line-height: 1.3;
   }
/* ACTIVE FLOAT */
.co-login-sec #co-login-form label.active{
   top: 2px;
   transform: translateY(0);
   font-size: 11px;
   font-weight: 600;
}
}
.co-login-error .cle-text{
  color: #d93025;
   font-size: 13px;
   margin: 0 15px 10px 27px;
   font-weight: 500;
    letter-spacing: 0.2px;
}
/* =========================
   Forgot Password Section
========================= */
.page-template-template-co-forgot-password .co-login-div .clbd-title{
   margin: 0 0 20px;
   font-family: "Open Sans", sans-serif;
   font-size: 25px;
   font-weight: 700;
   color: #242424;
   text-align: center;
   line-height: 1.2;
}
.clbd-description{
    font-size: 16px;
    text-align: center; 
}
/* FORM FIELD*/
.clbd-field-div{
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-bottom: 20px;
}

/* LABEL */
.clbd-field-label{
   font-size: 13px;
   color: #242424;
   padding-left: 25px;
   font-weight: 500;
   line-height: 1;
}

/* INPUT */
.clbd-field{
   width: 100%;
   height: 58px;
   border: none;
   border-radius: 999px;
   background: #F3F3F3;
   padding: 0 28px;
   font-size: 16px;
   color: #333;
   outline: none;
   box-sizing: border-box;
   transition: all 0.25s ease;
}

/* PLACEHOLDER */
.clbd-field::placeholder{
   color: #A0A0A0;
   transition: opacity 0.2s ease;
}

/*BUTTON */
#co_forgot_password_submit{
   width: 100%;
   height: 58px;
   border: none;
   border-radius: 999px;
   background: linear-gradient(to right,#F28C28,#D65A00);
   color: #fff;
   font-size: 16px;
   font-weight: 600;
   cursor: pointer;
   transition: 0.25s ease;
   box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}
#co_forgot_password_submit:hover{
   transform: translateY(-1px);
   opacity: 0.95;
   background:#242424;
}
/* DEFAULT LABEL */
.co-login-sec #co-login-form label{
   position: absolute;
   top: 50%;
   left: 22px;
   transform: translateY(-50%);
   font-size: 15px;
   font-weight: 500;
   color: #242424;
   transition: all 0.25s ease;
   pointer-events: none;
   z-index: 2;
}

/* ACTIVE FLOAT */
.co-login-sec #co-login-form label.active{
   top: 5px;
   transform: translateY(0);
   font-size: 11px;
   font-weight: 600;
}
@media (max-width: 768px){
    
.page-template-template-co-forgot-password .clbd-description {
    font-size: 14px;
    text-align: center;
}

#co_forgot_password_submit,
.page-template-template-co-forgot-password .clbd-field {
    height: 45px;
}
}
/* ==================================================
   COMPANY REGISTER PAGE
================================================== */

.page-template-template-co-register .co-login-container.ast-container{
    max-width: 1150px;
    width: 100%;
}

.page-template-template-co-register .co-login-div{
    max-width: 1240px;
    width: 100%;
    margin: auto;
}

/* ==================================================
   FORM LAYOUT
================================================== */

.page-template-template-co-register .co-register-form{
   display: flex;
   flex-wrap: wrap;
   column-gap: 20px;
    
}
.page-template-template-co-register  .clbd-field-div {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 15px;
}
/* FULL WIDTH */

.page-template-template-co-register .clbd-title,
.page-template-template-co-register .clbd-description,
.page-template-template-co-register .clbd-field-hr,
.page-template-template-co-register .clbd-document-upload-sec,
.page-template-template-co-register .clbd-tnc-field-div,
.page-template-template-co-register .clbd-submit-div,
.page-template-template-co-register .clbd-sign-up-div{
    width: 100%;
}

/* HALF WIDTH */

.page-template-template-co-register .clbd-half-field-div{
    width: calc(50% - 10px);
}

/* FULL WIDTH FIELD */
.page-template-template-co-register .clbd-field-div:not(.clbd-half-field-div){
    width: 100%;
}

/* COMMON FIELD WRAPPER */

.page-template-template-co-register .clbd-field-div,
.page-template-template-co-register .clbd-half-field-div{
    position: relative;
}

/* ==================================================
   INPUT & SELECT
================================================== */

.page-template-template-co-register .clbd-field{
    width: 100%;
    height: 58px;
    padding: 18px 22px;
    background: #F3F3F3;
    border: 1px solid #F3F3F3;
    border-radius: 999px;
    font-size: 15px;
    line-height: 1.25;
    color: #1f2a44;
    box-sizing: border-box;
    transition: all 0.25s ease;
    outline: none;
    appearance: none;
    -webkit-appearance: none;
    font-family: inherit;
}
/* =========================
   HIDE DEFAULT SELECT TEXT
========================= */
/* FIRST OPTION HIDDEN */
/* BILA USER FOCUS */
.page-template-template-co-register select.clbd-field:focus{
    color: #1f2a44;
} 
.page-template-template-co-register 
select.clbd-field option[value=""]{
    display: none;
}

/* AFTER USER SELECT */

.page-template-template-co-register 
select.clbd-field:valid{
    color: #1f2a44;
}
/* INPUT PLACEHOLDER */

.page-template-template-co-register input.clbd-field::placeholder{
    color: transparent;
}

/* SELECT DEFAULT */

.page-template-template-co-register select.clbd-field{
    color: transparent;
    text-shadow: 0 0 0 transparent;
}

/* SELECT AFTER CHOOSE */

.page-template-template-co-register select.clbd-field:valid{
    color: #1f2a44;
}

/* FOCUS */

.page-template-template-co-register .clbd-field:focus{
    border-color: #DA3027;
    background: #fff;
    box-shadow: 0 0 6px rgb(0 0 0 / 10%);
}

/* ==================================================
   FLOATING LABEL
================================================== */

.page-template-template-co-register .clbd-field-label{
    position: absolute;
    top: 50%;
    left: 22px;
    transform: translateY(-50%);
    font-size: 14px;
    color: #5a6e8a;
    pointer-events: none;
    transition: all 0.25s ease;
    white-space: nowrap;
    z-index: 2;
    padding: 0 4px;
}

/* ACTIVE FLOAT */

.page-template-template-co-register .clbd-field-div:focus-within .clbd-field-label,
.page-template-template-co-register .clbd-half-field-div:focus-within .clbd-field-label,
.page-template-template-co-register input.clbd-field:not(:placeholder-shown) + .clbd-field-label,
.page-template-template-co-register select.clbd-field:valid + .clbd-field-label{
    top: -7px;
    left: 27px;
    transform: translateY(0);
    font-size: 12px;
    line-height: 1.2;
    background: #fff;
    padding: 0 4px;
}

/* LABEL COLOR */

/* FOCUS = RED */

.page-template-template-co-register .clbd-field-div:focus-within .clbd-field-label,
.page-template-template-co-register .clbd-half-field-div:focus-within .clbd-field-label{
    
   color: #DA3027;
     padding: 0 4px;
}


/* ==================================================
   SELECT STYLE
================================================== */

/* CUSTOM ARROW */

/* DEFAULT SELECT */
.page-template-template-co-register 
.clbd-half-field-div:not(.co_secondary_biz_nature):has(select)::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 24px;
    width: 8px;
    height: 8px;
    border-right: 2px solid #E68724;
    border-bottom: 2px solid #E68724;
    transform: translateY(-60%) rotate(45deg);
    pointer-events: none;
    transition: 0.25s ease;
}

/* SECONDARY-ONLY WHEN Primary SELECT ACTIVE */
.page-template-template-co-register 
.co_secondary_biz_nature:has(.co_secondary_biz_nature_div.active select.co_biz_nature)::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 24px;
    width: 8px;
    height: 8px;
    border-right: 2px solid #E68724;
    border-bottom: 2px solid #E68724;
    transform: translateY(-60%) rotate(45deg);
    pointer-events: none;
    transition: 0.25s ease;
}
.page-template-template-co-register 
.co_secondary_biz_nature select{
    padding-right: 50px;
}
/* ACTIVE ARROW */

.page-template-template-co-register .clbd-half-field-div:focus-within::after{
    transform: translateY(-40%) rotate(225deg);
    border-color: #DA3027;
}
/* ==================================================
   SECONDARY BUSINESS NATURE
================================================== */

.page-template-template-co-register .co_secondary_biz_nature{
    min-height: 58px;
}

.page-template-template-co-register .co_secondary_biz_nature_div{
    position: relative;
}

/* HIDE NON ACTIVE */

.page-template-template-co-register .co_secondary_biz_nature_div:not(.active){
    display: none;
}
.page-template-template-co-register .co_secondary_biz_nature .co_biz_nature_dummy_text {
    min-height: 58px;
    background: #F3F3F3;
    border-radius: 999px;
    text-align: center;
}
/* ==================================================
   DOCUMENT UPLOAD
================================================== */

.page-template-template-co-register .clbd-document-upload-sec{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.page-template-template-co-register .clbd-file-field-div{
    flex: 1;
    min-width: 220px;
}

.page-template-template-co-register .clbd-file-upload-box{
    display: block;
    padding: 35px 20px;
    border: 2px dashed #D8D8D8;
    border-radius: 16px;
    background: #FAFAFA;
    text-align: center;
    cursor: pointer;
    transition: 0.3s ease;
}

.page-template-template-co-register .clbd-file-upload-box:hover{
    border-color: #E52A24;
    background: #FFF8F7;
}

.page-template-template-co-register .clbd-file-upload-box input{
    display: none;
}

.page-template-template-co-register .clbd-file-label{
    font-size: 14px;
    color: #666;
}
.clbd-file-upload-box.active{
    border: 2px dashed #4CAF50 !important;
    background: #F5FFF5 !important;
}
.page-template-template-co-register 
.clbd-file-upload-box.active{
    border: 2px dashed #4CAF50 !important;
    background: #F5FFF5 !important;
}
.clbd-upload-status{
    display: block;
    margin-top: 10px;
    font-size: 13px;
    color: #8A8A8A;
}

.clbd-file-upload-box.active .clbd-upload-status{
    color: #4CAF50;
}
.clbd-file-upload-box{
    width: 330px;
    height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 25px;
    box-sizing: border-box;
    border: 2px dashed #D8D8D8;
    border-radius: 16px;
    background: #FAFAFA;
    text-align: center;
    cursor: pointer;
    transition: 0.3s ease;
}
.clbd-file-label{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.4;
}
/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 768px){

    .page-template-template-co-register .clbd-half-field-div{
        width: 100%;
    }

    .page-template-template-co-register .co-register-form{
        gap: 16px;
    }

    .page-template-template-co-register .clbd-document-upload-sec{
        flex-direction: column;
    }
}