/* 
 * ---------------------------------------------
 * Variables > Breakpoints
 * ---------------------------------------------
*/
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_container {
  border: none;
  flex-wrap: nowrap;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_header {
  display: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section {
  padding: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_filter_container {
  flex-wrap: nowrap;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_filter_left {
  flex-direction: column-reverse;
  gap: var(--space-m);
  align-items: flex-start;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_button_groups {
  padding: 0;
  max-width: unset;
  gap: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_button_groups .status-btn {
  border: none;
  color: var(--secondary);
  border-radius: var(--radius-l) var(--radius-l) 0 0;
  box-shadow: none;
  font-weight: 700;
  font-size: var(--text-m);
  padding-inline: var(--space-m);
  padding-block: calc(var(--space-s) * 0.85);
  line-height: 1;
  transition: 0.2s all ease-in-out;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_button_groups .status-btn.active {
  background-color: var(--secondary-dark) !important;
  color: var(--white);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_button_groups .status-btn:hover {
  color: var(--white);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .el-select {
  width: 22rem !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table {
  border: 2px solid var(--secondary-dark);
  border-radius: 0 var(--radius-l) var(--radius-l) var(--radius-l);
  padding: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table * {
  color: var(--secondary);
  line-height: 1.2;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table.wa-tab-mid, body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table.wa-tab-last {
  border-radius: var(--radius-l);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__header th {
  border-radius: 0;
  padding-block: var(--space-s);
  font-weight: 700 !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__header th * {
  color: var(--white);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__header-wrapper {
  overflow: auto;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__inner-wrapper:before {
  content: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .conversation-cell {
  width: calc(100% - 34rem) !important;
  max-width: 17rem !important;
  min-width: 17rem !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .date-cell {
  width: 1% !important;
  max-width: 17rem !important;
  min-width: 17rem !important;
  text-align: center;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .fs_status_cell {
  width: 1% !important;
  max-width: 17rem !important;
  min-width: 17rem !important;
  text-align: center;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body {
  table-layout: auto !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body .fs_ticket_title strong {
  font-weight: 700;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body .fs_ticket_title .fs_response_count {
  display: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body .el-table__row:last-of-type td {
  border-bottom: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body .conversation-cell {
  z-index: 2;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body tr {
  position: relative;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body tr:hover {
  background-color: var(--secondary-dark-trans-40) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body tr:hover .fs_tk_date, body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body tr:hover .fs_tk_preview {
  color: var(--white);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_tickets_table .el-table__body tr .fs_ticket_conversation:after {
  content: "";
  position: absolute;
  inset: 0;
  width: calc(100% + 34rem);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_status_badge {
  min-height: 4rem;
  min-width: 10rem;
  border: none;
  border-radius: var(--radius-m);
  justify-content: center;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_status_badge.closed {
  background-color: var(--secondary-dark) !important;
  color: var(--secondary) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_status_badge.active {
  background-color: #233e16 !important;
  color: #67c23a !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_status_badge.new {
  background-color: #1b3c5d !important;
  color: #4ba5ff !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_status_badge .fs_status_dot {
  display: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_pagination_container {
  flex-wrap: wrap;
  padding: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container {
  border: 2px solid var(--secondary-dark);
  border-radius: var(--radius-l);
  padding: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container * {
  color: var(--secondary);
  line-height: 1.2;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_closed_alert {
  flex-direction: column;
  gap: var(--space-xs);
  align-items: flex-start;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_closed_alert .fs_ticket_reopen {
  text-underline-offset: 2px;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_closed_alert .fs_ticket_reopen:hover {
  color: var(--action-semi-dark) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_closed_content {
  width: unset;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_refresh_btn {
  transition: 0.2s all ease-in-out;
  height: 5rem;
  border-radius: var(--radius-xs) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_ticket_refresh_btn:hover {
  border-color: var(--action-hover) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_close_ticket_title {
  color: var(--action);
  transition: 0.2s all ease-in-out;
  text-decoration: underline;
  text-underline-offset: 2px;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_heroarea .fs_close_ticket:hover .fs_close_ticket_title {
  color: var(--action-semi-dark);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_thread_message {
  align-items: flex-start;
  gap: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_thread_message a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_thread_message a:hover {
  color: var(--action-semi-dark) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_thread_actions {
  font-size: var(--text-s) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_custom_data_wrap {
  border: 2px solid var(--secondary-dark);
  border-radius: var(--radius-l);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_custom_data_wrap .fs_custom_info_label {
  color: var(--action) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_custom_data_wrap .fs_custom_check_value {
  border-radius: var(--radius-xs);
  border: none;
  padding: calc(var(--space-xs) * 0.7) var(--space-xs);
  background-color: #4f0000 !important;
  color: red;
  line-height: 2;
  white-space: nowrap;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box * {
  font-family: inherit;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box textarea {
  border-radius: var(--radius-l);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box textarea:focus, body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box textarea:hover {
  border-color: var(--action-hover) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box .error-message {
  color: red;
  font-size: var(--text-s) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box .fs_customer_response_actions p {
  color: var(--action);
  text-underline-offset: 2px;
  transition: 0.2s all ease-in-out;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box .fs_customer_response_actions p:hover {
  color: var(--action-semi-dark);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box .fs_reply_btn {
  width: unset;
  height: 5rem;
  border-radius: var(--radius-xs) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fs_ticket_response .fs_ticket_reply_box .fs_reply_btn:hover {
  border-color: var(--action-hover) !important;
  background-color: transparent !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fst_file_lists {
  margin-top: calc(var(--space-xs) * 0.5);
  padding-left: var(--space-xs);
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fst_file_lists * {
  font-size: calc(var(--text-m) * 0.85) !important;
  color: var(--action) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fst_file_lists ul {
  padding: 0;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fst_file_lists li {
  display: flex;
  gap: 4px;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket .fs_tickets_container .fst_file_lists a {
  text-decoration: none;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_create_ticket_container * {
  color: var(--secondary);
  line-height: 1.2;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_create_ticket_container .fs_ticket_form_container {
  border-radius: var(--radius-l);
  overflow: hidden;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_create_ticket_container .fs_ticket_header label {
  color: var(--action) !important;
  font-size: var(--text-l) !important;
  font-weight: 700;
}
body .wa-main #fluent_support_client_app .fs_client_portal .fs_create_ticket_container textarea {
  border-radius: var(--radius-l);
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-input__wrapper, body .wa-main #fluent_support_client_app .fs_client_portal .el-select__wrapper {
  min-height: 5rem;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-input__wrapper.is-focus, body .wa-main #fluent_support_client_app .fs_client_portal .el-input__wrapper.is-focused, body .wa-main #fluent_support_client_app .fs_client_portal .el-select__wrapper.is-focus, body .wa-main #fluent_support_client_app .fs_client_portal .el-select__wrapper.is-focused {
  box-shadow: none !important;
  border-color: var(--action) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .search-input .el-input__wrapper {
  padding: 0 12px;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button {
  min-width: 5rem;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button {
  background-color: var(--action) !important;
  border-radius: var(--radius-xs) !important;
  position: relative;
  overflow: hidden;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button span {
  color: var(--primary);
  font-weight: 700;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button:after {
  content: "";
  background: var(--white);
  position: absolute;
  height: 15.5rem;
  left: -7.5rem;
  opacity: 0.2;
  top: -50px;
  transform: rotate(35deg);
  transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);
  width: 50px;
  z-index: 10;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button:hover {
  background-color: var(--action) !important;
  box-shadow: 0px 20px 30px var(--action-trans-20);
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button:hover:after {
  left: 120%;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-button.fs_create_ticket_button:hover span {
  color: var(--primary) !important;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-alert__close-btn:hover path {
  fill: var(--action-hover);
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-pagination .el-pager li {
  height: 5rem;
  min-width: 5rem;
}
body .wa-main #fluent_support_client_app .fs_client_portal .el-pagination .el-pager li.is-active {
  color: var(--white);
}

@media (max-width: 768px) {
  body .wa-main #fluent_support_client_app .fs_client_portal .fs_ticket_wrapper .fs_tickets_container .fs_filters_section .fs_filter_container {
    flex-direction: column-reverse;
  }
  body .wa-main #fluent_support_client_app .fs_client_portal .fs_pagination_container {
    flex-direction: column;
    gap: var(--space-xs);
  }
}
@media (max-width: 480px) {
  body .wa-main #fluent_support_client_app .fs_client_portal .fs_filters_section .fs_button_groups .status-btn {
    padding-inline: calc(var(--space-xs) * 0.6);
  }
}
