.elementor-9218 .elementor-element.elementor-element-8eb91ec{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--padding-top:0px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-9218 .elementor-element.elementor-element-8eb91ec:not(.elementor-motion-effects-element-type-background), .elementor-9218 .elementor-element.elementor-element-8eb91ec > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #57C2FF 0%, var( --e-global-color-d0f3297 ) 65%);}.elementor-9218 .elementor-element.elementor-element-9025d71{margin:30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;text-align:center;}.elementor-9218 .elementor-element.elementor-element-9025d71.elementor-element{--align-self:center;}.elementor-9218 .elementor-element.elementor-element-9025d71 .elementor-heading-title{font-family:"Arial";font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:2.8px;-webkit-text-stroke-color:#000;stroke:#000;color:var( --e-global-color-84ae244 );}.elementor-9218 .elementor-element.elementor-element-cb6f4d9{--divider-border-style:solid;--divider-color:var( --e-global-color-accent );--divider-border-width:1.4px;}.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider-separator{width:45%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider__text{color:var( --e-global-color-secondary );font-family:"Arial";font-size:22px;font-weight:700;text-transform:uppercase;}.elementor-9218 .elementor-element.elementor-element-e39836f{--divider-border-style:solid;--divider-color:var( --e-global-color-accent );--divider-border-width:1.4px;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider-separator{width:45%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider__text{color:var( --e-global-color-secondary );font-family:"Arial";font-size:22px;font-weight:700;text-transform:uppercase;}.elementor-9218 .elementor-element.elementor-element-43ffeb8{--divider-border-style:solid;--divider-color:var( --e-global-color-accent );--divider-border-width:1.4px;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider-separator{width:45%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider__text{color:var( --e-global-color-secondary );font-family:"Arial";font-size:22px;font-weight:700;text-transform:uppercase;}.elementor-9218 .elementor-element.elementor-element-08bfdaf{width:auto;max-width:auto;background-color:var( --e-global-color-d0f3297 );margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:40px 40px 40px 40px;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-fc6a8bb );border-radius:4px 4px 4px 4px;box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.14);text-align:center;}.elementor-9218 .elementor-element.elementor-element-08bfdaf.elementor-element{--align-self:center;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider-separator{width:69%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-cb6f4d9 .elementor-divider__text{font-size:22px;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider-separator{width:69%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-e39836f .elementor-divider__text{font-size:22px;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider-separator{width:69%;margin:0 auto;margin-center:0;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider{text-align:center;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider__text{font-size:22px;}}@media(min-width:768px){.elementor-9218 .elementor-element.elementor-element-8eb91ec{--content-width:1200px;}}@media(max-width:767px){.elementor-9218 .elementor-element.elementor-element-8eb91ec{--padding-top:0px;--padding-bottom:29px;--padding-left:0px;--padding-right:0px;}.elementor-9218 .elementor-element.elementor-element-9025d71 .elementor-heading-title{font-size:11px;}.elementor-9218 .elementor-element.elementor-element-43ffeb8{margin:30px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider-separator{width:87%;}.elementor-9218 .elementor-element.elementor-element-43ffeb8 .elementor-divider__text{font-size:22px;}.elementor-9218 .elementor-element.elementor-element-08bfdaf{padding:0px 0px 0px 0px;}}/* Start custom CSS for text-editor, class: .elementor-element-08bfdaf */.elementor-widget-container > p:first-of-type {
  font-size: 0.85em;
  padding-bottom: -13px;
 
  
}

.fst_login_wrapper form#loginform label {
  margin-top: 25px;
  display: inline-block;
  font-size: 13px;
 font-weight: 300;
  color: #1F4364;
  
  
}

.fst_login_wrapper form#loginform .input {
  margin-top: -15px!important;
  border: 1px solid #00A2FF;
}


.fst_login_wrapper form#loginform .login-remember label {
  font-size: 0.9em;
  
  
}

.fst_login_wrapper form#loginform .login-remember label {
  font-size: 0.9em;
  font-weight: 400;

  display: flex;
  align-items: center;
  gap: 5px;
}

.fst_login_wrapper form#loginform .login-remember label::after {
 
  position: relative;
  top: -2px; /* move text up slightly */
 
}

/* Change "Username or Email Address" to just "Email Address" */
label[for="user_login"] {
  visibility: hidden;
  position: relative;
}

label[for="user_login"]::before {
  content: "Email Address";
  font-size: 14px;
  font-weight: 400;
  color: #1F4364;
  visibility: visible;
  position: absolute;
  top: 0;
  left: 0;
}

/* Style the bottom text and links */
p[style*="text-align: center"] {
  font-size: 12px;
  color: #1F4364;
}

/* Change "Username or Email Address" to just "Email Address" */
label[for="user_login"] {
  visibility: hidden;
  position: relative;
}

label[for="user_login"]::before {
  content: "Email Address";
  font-size: 13px;
  font-weight: 500;
  color: #1F4364;
  visibility: visible;
  position: absolute;
  top: 0;
  left: 0;
}

/* Align bottom text to the left + styling */
p[style*="text-align: center"] {
  text-align: left !important;
/* Match your input/button alignment */
  font-size: 12px;
  color: #1F4364;
}

/* Style bottom links */
p[style*="text-align: center"] a#fs_show_signup,
a#fs_show_reset_password {
  color: #00A2FF;
  font-size: 12px;
  font-weight: 400;
  text-decoration: none;
}

a#fs_show_signup:hover,
a#fs_show_reset_password:hover {
  text-decoration: none;
}

/* Target only the second paragraph (Reset password) */
p[style*="text-align: center"]:has(a#fs_show_reset_password) {
  margin-top: -9px; /* Decrease spacing */
}
/* Login Button */
.fst_login_wrapper input#wp-submit.button.button-primary {
  all: unset;
  display: inline-block !important;
  background: #00A2FF !important;
  border-radius: 3px !important;
  color: #fff !important;
  padding: 8px 31px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-align: center !important;
  cursor: pointer !important;
  border: none !important;
}

/* Signup Button */
.fst_registration_wrapper #fst_submit {
  all: unset;
  display: inline-block !important;
  background: #5bc0de !important;
  border-radius: 4px !important;
  color: #fff !important;
  padding: 12px 32px !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  text-align: center !important;
  cursor: pointer !important;
  border: none !important;
}



.fst_login_wrapper label,
.fst_registration_wrapper label,
.fst_reset_pass_wrapper label {
  font-size: 13px;
  font-weight: 500;
  color: #1F4364;
}

.fst_field_label label {
  display: inline-block;
  position: relative;
  top: 5px;
}

.fst_registration_fields {
  margin-top: 1px;
}

.fst_registration_wrapper {
  margin-top: 30px;
}

.fs_input_wrap input[type="email"]#fst_email,
.fs_input_wrap input[type="password"]#fst_password {
  border: 1px solid #00A2FF;
  border-radius: 3px;
 
}

#fst_first_name::placeholder {
  color: transparent;
}
#fst_last_name::placeholder,
#fst_username::placeholder,
#fst_email::placeholder,
#fst_password::placeholder {
  color: transparent;
}





.my-custom-signup-btn {

  border: none !important;
  width: 0% !important;
 
  
 
}

.my-custom-signup-btn span {
  background: #00A2FF!important;
  padding: 8px 31px;
  border-radius: 3px;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  
  text-align: center;
  cursor: pointer;
}
.fst_registration_wrapper #fst_submit{
    background: #88CFF6 !important;
    padding: 0px 0px!important;
    margin-top: 12px!important;
}


p[style="text-align: center"]:has(#fs_show_login) {
  margin-top: -10px !important;
}

#fs_show_login {
  color: #00A2FF !important;
  text-decoration: none !important;
  padding-left: 1px;
}

.fs_client_portal .fs_ticket_wrapper .fs_tickets_container .fs_tickets_header .fs_create_ticket_btn {
  background-color: #00A2FF !important;
  border-radius: 4px !important;
}


#fluent_support_client_app * {
  border-radius: 4px !important;

}

.fs_client_portal .fs_ticket_wrapper .fs_tickets_container .fs_tickets_table .el-table .el-table__header th {
  background-color: #00A2FF !important;
  color: white !important;
}

.fs_client_portal .fs_ticket_wrapper .fs_tickets_container .fs_tickets_table .el-table .el-table__body .fs_ticket_row td.conversation-cell .fs_ticket_conversation .fs_ticket_title strong {
  color: #00A2FF !important;
  text-transform: capitalize !important;
}


input[type="text"]{
    border: none !important;

}

.fst_login_wrapper form#loginform .input{
     border: none !important;
}

.fs_input_wrap input[type="email"]#fst_email, .fs_input_wrap input[type="password"]#fst_password{
     border: none !important;
}

.mce-flow-layout {
  padding-top: 12px !important;
}

.fs_client_portal .fs_ticket_details_label {
  position: relative;
  top: 27px !important;
  left: 10px;
}

.fs_client_portal .fs_submit_button_container .fs_create_ticket_button {
  color: white !important;
  background-color: #00A2FF !important;
}

.fs_client_portal .fs-file-uploader .el-upload .fs-upload-content .fc-upload-text .fs_upload_button {
  color: white !important;
  background-color: #00A2FF !important;
  
}

.upload-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 12px; /* optional spacing between elements */
}

.upload-container * {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.fs_submit_button_container .el-form-item__content {
  text-align: center !important;
}

/* Make sure the entire container is visible and centered */
.fs_client_portal .fs_submit_button_container {
  width: 100% !important;
  overflow: visible !important;
  text-align: center !important;
  display: block !important;
  margin-top: 20px !important;
}

/* Style and center the Create Ticket button */
.fs_client_portal .fs_submit_button_container .fs_create_ticket_button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 auto !important;
  background-color: #00A2FF !important;
  color: white !important;
  border-radius: 6px !important;
  padding: 19px 17px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  text-align: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  border: none !important;
}

/* Ensure mobile visibility */
@media (max-width: 767px) {
  .fs_client_portal .fs_submit_button_container {
    display: block !important;
  }

  .fs_client_portal .fs_submit_button_container .fs_create_ticket_button {
    width: auto !important;
    max-width: 100% !important;
  }
}

@media (max-width: 767px) {
  .fs_client_portal .fs-file-uploader .el-upload .fs-upload-content .fc-upload-text .fs_upload_button {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}


@media (max-width: 767px) {
  #fluent_support_client_app {
    max-width: 110% !important;  /* 5% smaller */
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  .fs_tickets_container {
    padding: 5px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767px) {
  .elementor-9218 .elementor-element.elementor-element-08bfdaf > .elementor-widget-container {
    max-width: 95% !important;
    margin: 0 auto !important;
    padding: 0px !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 767px) {
  .fs_client_portal .fs_ticket_header label {
    font-size: 18px !important;
font-weight :600!important;
      text-transform: uppercase !important;
      color:#1F4364!important;
  }
}

.elementor-9218 .elementor-element.elementor-element-08bfdaf{
    text-align: left!important;
}

.fs_client_portal .fs_ticket_details_label{
    margin-top:2px!important;
    padding-bottom: 2px !important;
}

@media (max-width: 767px) {
  .fs_client_portal .fs_customer_response_actions {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  .fs_client_portal .fs_customer_response_actions .fs_reply_btn {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
   
    color: white !important;
    border: none !important;
    border-radius: 5px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-align: center !important;
  }
}

.fs_client_portal .fs_customer_response_actions .fs_reply_btn{
    background: #00A2FF!important;
}

.fs_client_portal .fs_ticket_reply_box h3 {
  position: relative !important;
  z-index: 999 !important;

}

/* Force Upload & Reply buttons to show on all devices */
.fs_client_portal .fs-file-uploader .el-upload .fs-upload-content .fc-upload-text .fs_upload_button,
.fs_client_portal .fs_customer_response_actions .fs_reply_btn {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Extra support for tablet screens */
@media (min-width: 768px) and (max-width: 1024px) {
  .fs_client_portal .fs-file-uploader .el-upload .fs-upload-content .fc-upload-text .fs_upload_button,
  .fs_client_portal .fs_customer_response_actions .fs_reply_btn {
    display: inline-block !important;
  }
}


@media (max-width: 767px) {
  .elementor-9218 .elementor-element.elementor-element-08bfdaf #loginform {
    padding: 0px 27px 22px 27px !important;
    box-sizing: border-box;
  }
}


@media (max-width: 767px) {
  .elementor-9218 .elementor-element.elementor-element-08bfdaf .elementor-widget-container > p:first-of-type {
    padding: 25px 27px 0px 27px !important;
    box-sizing: border-box;
  }
}

@media (max-width: 767px) {
  .elementor-9218 .elementor-element.elementor-element-08bfdaf .elementor-widget-container p[style*="text-align: center"] {
    padding: 0px 27px 10px 27px !important;
    box-sizing: border-box;
    margin-top:-20px
    !important;
  }
}


@media (max-width: 767px) {
  .elementor-9218 .elementor-element.elementor-element-08bfdaf .fs_registration_form {
    padding: 25px 27px 0px 27px !important;
    box-sizing: border-box;
    margin-top:-28px
    !important;
  }
}

@media only screen and (max-width: 767px) {
  .elementor-element-08bfdaf {
    margin-left: 12px !important;
    margin-right: 12px !important;
    width: auto !important;
    max-width: calc(100% - 40px) !important;
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  #content > div > div > div > div > div.elementor-element.elementor-element-08bfdaf.elementor-widget__width-auto.elementor-widget.elementor-widget-text-editor > p {
    padding-left: 28px !important;
    padding-right: 28px !important;
    padding-top:15px;
  }
}


 @media only screen and (max-width: 767px) {
  /* Login notice paragraph above the form */
  #content > div > div > div > div > div.elementor-element.elementor-element-08bfdaf.elementor-widget__width-auto.elementor-widget.elementor-widget-text-editor > p {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  /* Paragraph: Not registered? */
  #fst_login_form > p:nth-child(2) {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  /* Paragraph: Forgot your password? */
  #fst_login_form > p:nth-child(3) {
    padding-left: 28px !important;
    padding-right: 28px !important;
    margin-top: -12px !important;
  }
}


@media only screen and (max-width: 767px) {
  #content > div > div > div > div > div.elementor-element.elementor-element-08bfdaf.elementor-widget__width-auto.elementor-widget.elementor-widget-text-editor > p {
    font-size: 13px !important;
  
  }
}

@media (max-width: 767px) {
  /* ✅ Hide default table headers */
  .el-table__header,
  .el-table__body thead {
    display: none !important;
  }

  /* ✅ Each ticket row becomes a card */
  .el-table__body .el-table__row {
    display: block !important;
    margin-bottom: 16px;
  border: 1px solid #00A2FF !important;
    border-radius: 6px;
    overflow: hidden;
    width: 52% !important;
    background-color: rgba(255, 255, 255, 0.795) !important;
  }

  /* ✅ Clear default cell layout */
  .el-table__cell {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    border-bottom: none !important;
  }

  /* ✅ Top: Blue section with DATE and STATUS */
  .el-table_1_column_2,
  .el-table_1_column_3 {
    display: inline-block;
    width: 50%;
    box-sizing: border-box;
    padding: 12px !important;
    vertical-align: top;
  }

  .el-table_1_column_2 .cell::before {
    content: "DATE";
    font-weight: 700;
    color: #00A2FF;
    display: block;
    font-size: 13px;
    margin-bottom: 4px;
    text-transform: uppercase;
  }

  .el-table_1_column_3 .cell::before {
    content: "STATUS";
    font-weight: 700;
    color: #00A2FF;
    display: block;
    font-size: 13px;
    margin-bottom: 4px;
    text-transform: uppercase;
  }

  /* ✅ Bottom section: CONVERSATION title, ticket subject, and text */
  .el-table_1_column_1 {
    padding: 12px !important;
    border-top: 1px solid #e0e0e0;
  }

  .el-table_1_column_1 .fs_ticket_title::before {
    content: "CONVERSATION";
    display: block; /* ✅ Forces it to appear on its own line */
    font-size: 13px;
    font-weight: 700;
    color: #00A2FF;
    text-transform: uppercase;
    margin-bottom: 4px;
    
  }

  .el-table_1_column_1 .fs_ticket_title {
    font-size: 15px;
    font-weight: 600;
    color: #222;
    margin-bottom: 4px;
  }

  .el-table_1_column_1 .fs_ticket_preview {
    font-size: 13px;
    color: #292929;
    margin: 0;
  }

  /* ✅ Apply red background to ALL conversation rows */
  .fs_tickets_table .el-table_1_column_1.conversation-cell {
    background-color: #D4EBF8 !important;
    
  }
  .fs_client_portal .fs_ticket_wrapper .fs_tickets_container 
.fs_tickets_table .el-table .el-table__body .fs_ticket_row td.conversation-cell 
.fs_ticket_conversation .fs_ticket_title {
  display: flex;
  flex-direction: column !important;
  align-items: flex-start !important; /* ✅ Align both header + title to the left */
  gap: 0;
  margin-bottom: 4px;
  word-break: break-word;
  text-align: left !important; /* ✅ (Extra safe for any text inside) */
}

#fluent_support_client_app * {
  border-radius: 0 !important;
}

.fs_client_portal .fs_ticket_wrapper .fs_tickets_container 
  .fs_tickets_table .el-table .el-table__body .fs_ticket_row 
  td.conversation-cell .fs_ticket_conversation .fs_ticket_title strong {
    color: rgb(67, 67, 67) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    margin-top: -6px!important;
  }

 @media (max-width: 767px) {
  .fs_ticket_title span {
    background-color: #9cd5f5 !important;
    color: rgb(21, 21, 21) !important;
    font-size: 10px !important;
  }
}
.el-table_1_column_2.date-cell .cell {
    color: rgb(67, 67, 67) !important;
    font-size: 12px!important;
  }
@media (max-width: 767px) {
  /* Expand table row container */
  .el-table__body .el-table__row {
    width: 100% !important; /* Make it full width */
    max-width: 100% !important;
    
  }

  /* Force table itself to fit container */
  .el-table__body {
    width: 100% !important;
    table-layout: auto !important;
  }

  /* Optional: force wrapper to stretch */
  .el-scrollbar__wrap,
  .el-scrollbar__view,
  .el-table__body-wrapper {
    width: 100% !important;
  }

  /* Set each column full width block style */
  .el-table__cell {
    display: block !important;
    width: 100% !important;
  }

  /* Prevent forced column width (from <col>) */
  .el-table__body col {
    width: 100% !important;
  }

  /* Optional: container padding */
  #fluent_support_client_app .fs_tickets_table {
    padding: 0 10px;
  }
}
@media (max-width: 767px) {
  .el-table__body .el-table__row {
    margin-top: 15px !important;
  }

  .el-table__body .el-table__row:first-child {
    margin-top: 20px !important;
  }
}

}/* End custom CSS */