.btn.btn-xl {
  font-size: 22px; }

.card.customer_card .card-body .media {
  display: flex; }

.customer_portal_page h1, .customer_portal_page h2, .customer_portal_page h3 {
  margin-top: 1rem;
  margin-bottom: 1rem;
  line-height: 1.2; }

.customer_portal_page h4, .customer_portal_page h5, .customer_portal_page h6 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem; }

.customer_portal_page h1 {
  margin-top: 1.5rem;
  font-size: 26.04px; }

.customer_portal_page h2 {
  font-size: 20.02px; }

.customer_portal_page h3 {
  font-size: 18.06px; }

.customer_portal_page h4 {
  font-size: 14px; }

.customer_portal_page h5 h6 {
  font-size: 14px; }

.customer_portal_page p {
  margin-top: 1rem; }

.customer_portal_page blockquote {
  background-color: rgba(63, 77, 103, 0.1);
  display: inline-block;
  margin-left: 1rem;
  padding-left: 1rem;
  padding-right: 1rem; }

.h5_sizing {
  font-size: 18.06px; }

body {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  color: #888;
  font-weight: 400;
  background: #f4f7fa;
  position: relative; }

h1, h2, h3, h4, h5, h6 {
  color: #111;
  font-weight: 400; }

h1 {
  font-size: 48.02px; }

h2 {
  font-size: 43.96px;
  color: #3f4d67; }

h3, h4, h5, h6 {
  color: gray; }

h3 {
  font-size: 26.04px; }

h4 {
  font-size: 20.02px; }

h5 {
  font-size: 18.06px; }

h6 {
  font-size: 14px; }

p {
  font-size: 14px; }

strong {
  font-weight: 600; }

.cursor-pointer {
  cursor: pointer; }

.support_ticket .modal-header .modal-title {
  font-size: 26.04px;
  color: var(--bs-primary);
  margin: auto; }

.support_ticket .modal-header button.btn-close {
  margin: unset; }

.support_ticket .modal-body .mb-3 {
  margin-bottom: 1.5rem !important; }

.support_ticket .modal-body .btn-primary {
  float: right; }

.support_ticket .modal-body .form-label {
  font-size: 18.06px;
  margin-top: .5rem; }

.support_ticket .modal-body .file_group {
  border: 1px solid var(--bs-border-color);
  padding: 1rem;
  border-radius: 8px;
  margin: 3rem 0; }
  .support_ticket .modal-body .file_group div:first-child {
    margin-top: unset; }
    .support_ticket .modal-body .file_group div:first-child > div {
      padding-top: 1rem; }
  .support_ticket .modal-body .file_group + div {
    padding-top: 0.5rem; }

.manage-permissions .modal-header .modal-title {
  font-size: 26.04px;
  color: var(--bs-primary);
  margin: auto;
  font-weight: 600; }

.manage-permissions .modal-header button.btn-close {
  margin: unset; }

.manage-permissions .modal-body {
  padding: 2rem; }
  .manage-permissions .modal-body h6 {
    font-size: 18.06px;
    margin-bottom: 1.5rem; }
  .manage-permissions .modal-body .form-check-label strong {
    font-size: 18.06px;
    display: block;
    margin-bottom: 0.25rem; }
  .manage-permissions .modal-body .form-check-label small {
    font-size: 14px;
    color: #6c757d;
    line-height: 1.5; }
  .manage-permissions .modal-body .form-check {
    padding: 1.25rem;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    transition: all 0.2s ease; }
    .manage-permissions .modal-body .form-check:hover {
      background: #fff;
      border-color: var(--bs-primary);
      box-shadow: 0 2px 8px rgba(4, 169, 245, 0.1); }
  .manage-permissions .modal-body .form-check-input {
    width: 3rem;
    height: 1.5rem;
    margin-top: 1rem; }
    .manage-permissions .modal-body .form-check-input:checked {
      background-color: var(--bs-primary);
      border-color: var(--bs-primary); }
  .manage-permissions .modal-body .btn {
    padding: 0.625rem 1.5rem;
    font-size: 18.06px;
    font-weight: 500; }
  .manage-permissions .modal-body .alert {
    font-size: 14px;
    border-radius: 8px; }

.sub_modal {
  margin-top: 120px; }

.notify-self-service .modal-title {
  font-size: 20.02px; }

.notify-self-service .modal-footer .btn {
  min-width: 120px; }

.self-service-confirmation .modal-body {
  overflow-x: hidden; }
  .self-service-confirmation .modal-body .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch; }
  .self-service-confirmation .modal-body table {
    table-layout: fixed;
    width: 100%; }
    .self-service-confirmation .modal-body table th:nth-child(1), .self-service-confirmation .modal-body table td:nth-child(1) {
      width: 45%; }
    .self-service-confirmation .modal-body table th:nth-child(2), .self-service-confirmation .modal-body table td:nth-child(2) {
      width: 15%; }
    .self-service-confirmation .modal-body table th:nth-child(3), .self-service-confirmation .modal-body table td:nth-child(3) {
      width: 20%; }
    .self-service-confirmation .modal-body table th:nth-child(4), .self-service-confirmation .modal-body table td:nth-child(4) {
      width: 20%; }
    .self-service-confirmation .modal-body table .description-cell {
      word-wrap: break-word;
      overflow-wrap: break-word;
      word-break: break-word;
      hyphens: auto;
      white-space: normal;
      max-width: 0; }

.skeleton-box {
  background: linear-gradient(90deg, #e2e8f0 0%, #f1f5f9 50%, #e2e8f0 100%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: 6px;
  height: 20px; }
  .skeleton-box.skeleton-name {
    width: 60%; }
  .skeleton-box.skeleton-switch {
    width: 52px;
    margin-left: auto;
    margin-right: auto; }

@keyframes shimmer {
  0% {
    background-position: 200% 0; }
  100% {
    background-position: -200% 0; } }

.permissions-table tbody tr {
  animation: fadeInRow 0.4s ease backwards; }

.permissions-table tbody tr:nth-child(1) {
  animation-delay: 0.05s; }

.permissions-table tbody tr:nth-child(2) {
  animation-delay: 0.08s; }

.permissions-table tbody tr:nth-child(3) {
  animation-delay: 0.11s; }

.permissions-table tbody tr:nth-child(4) {
  animation-delay: 0.14s; }

.permissions-table tbody tr:nth-child(5) {
  animation-delay: 0.17s; }

@keyframes fadeInRow {
  from {
    opacity: 0;
    transform: translateY(-4px); }
  to {
    opacity: 1;
    transform: translateY(0); } }

.empty-state-icon {
  font-size: 3rem;
  opacity: 0.3;
  margin-bottom: 1rem; }

.permissions-table .form-check-input {
  width: 3rem;
  height: 1.5rem;
  cursor: pointer; }

input[type="checkbox"] {
  cursor: pointer; }
  input[type="checkbox"] + label {
    cursor: pointer; }