/* for Pardot Form (Default Style) 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-Style.css');
*/


/* for Pardot Form 【 A-1 】【 RWD 】【 for Original Ver Style for Landing 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-RWD-Style.css');
*/


/* for Pardot Form 【 A-2 】【 RWD 】【 for Original Ver Style for Landing >> Industry Field 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Default-Landing-RWD-Style.css');
*/


/* for Pardot Form 【 B 】 【Lite Ver Style for Product Page (含 RWD) 】
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Product-Page-Style.css');
*/


/* for Pardot Form 【 C】【 RWD 】【 for Lightbox Form for Landing 】 
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Lightbox-RWD-Style.css');
*/


/* for Pardot Form 【 D 】 【Lite Ver Style for Align Left for CCPA (含 RWD) 】
@import url('https://assets.aten.com/webpage/shared/CMS_Libraries/CSS/Pardot/Form/Pardot-Form_Text-Align-RWD-Style.css');
*/






/* =============================================================================================================================
Pardot Form  >> for Rich Content Product Page Inquire (in Section) (基於 Default 樣式加強) 【 右邊 (col-md-6) 嵌入 Lite Ver Form 】
============================================================================================================================= */



/* Out-Container & .form-field + submit */
#pardot-form.form .form-field, 
#pardot-form.form .submit, 
#pardot-form.form {
  width: 100%;
  width: 94%;
  margin: 0px auto;
}


/* Out-Container > .form-field > label Name > 隱藏 */
#pardot-form.form .form-field .field-label {
  display: none !important;
}



/* .submit (Button 上層 >> 靠左) */
#pardot-form.form .submit {
  text-align: left;
  padding-bottom: 0px;
}

/* .submit > Input (Button >> 距離上面) */
#pardot-form.form .submit input {
  margin-top: 1%;
}

/* Text Area 文字輸入框 */
#pardot-form.form .form-field textarea {
  min-height: 50px;
  height: 55px;
  height: 57px;

  height: 65px;
}


/* .submit > input 藍色 (Submit Button) */
#pardot-form.form .submit input {
  font-weight: 500;
  padding: 2.5% 7%;
  padding: 3% 7%;

  border: 1px solid rgb(142, 194, 31);
  background-color: rgb(142, 194, 31);

  border: 1px solid rgb(34, 146, 211);
  background-color: rgb(34, 146, 211);

  box-shadow: 0px 15px 20px -10px rgba(0, 0, 0, 0.0);
  box-shadow: 0px 10px 10px -10px rgba(0, 0, 0, 0.3);

  transition: all 0.3s ease-in-out 0s;
}

/* .submit (Hover) > input  藍色 (Submit Button) */
#pardot-form.form .submit input:hover {
  background-color: rgba(159, 226, 40, 1.0) !important;
  border: 1px solid rgba(159, 226, 40, 1.0) !important;

  background-color: rgb(51, 51, 51) !important;
  border: 1px solid rgba(51, 51, 51) !important;

  transition: all 0.3s ease-in-out 0s;
}









  /* 總寬度 >> Out-Container + .form-field + submit */
  #pardot-form.form .form-field, 
  #pardot-form.form .submit, 
  #pardot-form.form {
  max-width: 900px; /* width=100% 時使用 */

  max-width: 475px; /* ( 舊版 Product Page ) (.col-md-6 寬度從一半算) */

  max-width: 490px; /* ( 舊版 Product Page ) (.col-md-6 寬度從一半算) */
  }

  /* Out-Container for Form */
  #pardot-form.form {
  display: flex;
  flex-wrap: wrap; /* 設為 wrap，則不會壓縮items，如果items過多就換行 (若不設定會將所有的flex items壓縮在同一行) */
  }

  /* 變兩欄式 >> .form-field + submit */
  #pardot-form.form .form-field, 
  #pardot-form.form .submit {
  flex: 1 0 42%; /* 預設佔據 50% 寬度，即兩列 >> 改為 42% 因為兩欄要 padding 空間 */
  padding: 5px 35px; /* 兩欄上下左右 padding 空間 */

  flex: 1 0 38%; /* Lite Ver Form 預設佔據 25% 寬度，即兩列 >> 改為 38% 因為兩欄要 padding 空間 */
  padding: 10px 24px; /* Lite Ver Form >> 隱藏 Label Name > Padding 加大 */

  padding: 10px 35px 10px 15px; /* Lite Ver Form >> 隱藏 Label Name > Padding 加大 */

  padding: 10px 20px 10px 20px; /* Lite Ver Form >> 隱藏 Label Name > Padding 加大 */
  }

  /*取消兩欄 (單欄排列時) >> Submit Button + Customer Type + Description + Marketing_Approval */
  /* #pardot-form.form .form-field.Customer_Type, */
  #pardot-form.form .form-field.Vegetarian, 
  #pardot-form.form .form-field.Shuttle_Service, 
  #pardot-form.form .form-field.pd-captcha, 
  #pardot-form.form .form-field.industry, 
  #pardot-form.form .form-field.Agree_Policy,
  #pardot-form.form .form-field.Description, 
  #pardot-form.form .form-field textarea, 
  #pardot-form.form .form-field.Direct_Marketing_Approval, 
  #pardot-form.form .submit {
  flex-basis: 100%; /* 不受兩列佈局的影響，佔據整行 */
  flex-basis: 94%; /* 不受兩列佈局的影響，佔據整行 (縮小% 因為要對齊 input box) */
  flex-basis: 92%; /* 不受兩列佈局的影響，佔據整行 【box-sizing: border-box】(縮小% 因為要對齊 input box) */
  flex-basis: 89%; /* (Product Page 寬度縮小) 不受兩列佈局的影響，佔據整行 【box-sizing: border-box】(縮小% 因為要對齊 input box) */
  }

  /* 兩欄排列時 >> Industry + country >> 下拉選單寬度*/
  #pardot-form.form .form-field.Customer_Type select, 
  #pardot-form.form .form-field.country select {
  /*width: 104%;
  width: calc(100% + 15px);*/
  }

  /*取消兩欄 (單欄排列時) >> Textarea 文字寬度 (兩欄排列時) */
  #pardot-form.form .form-field textarea {
  /*width: 98%;
  width: calc(100% - 15px);*/
  }

  /*取消兩欄 (單欄排列時) >> Indusy 下拉寬度 (兩欄排列時) */
  #pardot-form.form .form-field.industry select {
  /*width: 100%;
  width: calc(100% - 0px);*/
  }



  /* .submit (Button 上層 >> 靠左) */
  #pardot-form.form .submit {
  padding-top: 0px; /* 以免高度過高出現 Scroll Bar */
  }



/* reCaptcha >> Product Page 靠左 */
#pardot-form.form .g-recaptcha {
  left: 5px !important;
  left: 0px !important;
  left: 15px !important;
  text-align: left !important;
}

  /* reCaptcha >> Product Page 靠左 */
#pardot-form.form .g-recaptcha > div {
  margin: 10px 0 5px !important;
}





 /* 600 以上 */
 @Media (min-width: 600px) {

    /* 總寬度 >> Out-Container + .form-field + submit */
    #pardot-form.form .form-field, 
    #pardot-form.form .submit, 
    #pardot-form.form {
    max-width: 475px; /* ( 舊版 Product Page ) (.col-md-6 寬度從一半算) */
    max-width: 490px; /* ( 舊版 Product Page ) (.col-md-6 寬度從一半算) */
    }

    /* 變兩欄式 >> .form-field + submit */
    #pardot-form.form .form-field, 
    #pardot-form.form .submit {
    padding: 10px 35px 10px 15px; /* Lite Ver Form >> 隱藏 Label Name > Padding 加大 */
    }





    

    /* (.ATEN-Blue-Brand-Color) for Pardot Lite Ver Form (.Pardot-inSection.col-md-6) */
    .ATEN-Blue-Brand-Color #form-gsection.Pardot-inSection {
    padding: 3.2% 1.5% !important; /* ( 新版 Product Page ) (.col-md-6 寬度從一半算) */
    padding: 3.65% 1.5% !important; /* ( 新版 Product Page ) (.col-md-6 寬度從一半算) */
    }


    /* (.ATEN-Blue-Brand-Color) 總寬度 >> Out-Container + .form-field + submit */
    .ATEN-Blue-Brand-Color #pardot-form.form .form-field, 
    .ATEN-Blue-Brand-Color #pardot-form.form .submit, 
    .ATEN-Blue-Brand-Color #pardot-form.form {
    max-width: 555px; /* ( 新版 Product Page ) (.col-md-6 寬度從一半算) */
    }
    


}




 /* 500 以下 */
 @Media (max-width: 500px) {


    /* 總寬度 >> Out-Container + .form-field + submit */
    #pardot-form.form .form-field, 
    #pardot-form.form .submit, 
    #pardot-form.form {
    max-width: 490px; /* (.col-md-6 寬度從一半算) */
    }

    /* 變兩欄式 >> .form-field + submit */
    #pardot-form.form .form-field, 
    #pardot-form.form .submit {
    padding: 10px 20px 10px 8px; /* Lite Ver Form >> 隱藏 Label Name > Padding 加大 */
    }

}