/* ========================================
   ESTILOS COMPARTIDOS
   ======================================== */

/* Desktop-only utility class */
.desktop-only {
    @media (max-width: 768px) {
        display: none !important;
    }

    @media (min-width: 769px) {
        display: flex !important;
    }
}

/* ========================================
   ESTILOS ESPECÍFICOS PARA COMPANY (DESACTIVADA)
   ======================================== */

.deactivated-company {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: white !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

.deactivated-company .main {
    width: 100% !important;
    max-width: 42rem !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
}

.deactivated-company .main {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
}

.deactivated-company .main>div {
    height: auto !important;
    width: 100% !important;
}

/* ========================================
   ESTILOS ESPECÍFICOS PARA LOCATION (DESACTIVADA)
   ======================================== */

body:has(.deactivated-location) {
    overflow-x: hidden !important;
}
#flash {
    position: fixed;
    top: 60px;
    right: 20px;
    left: 20px;
    z-index: 2000;
    width: auto;
    max-width: 560px;
    margin-left: auto;
    pointer-events: none;
}

#flash .flash {
    pointer-events: auto;
    margin: 0;
}
/* app/assets/stylesheets/components/services_header.css */
@import 'application';

@media (max-width: 767px) {
  .services-header {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  
  .services-header .d-flex.align-items-center.gap-2 {
    flex-wrap: wrap;
  }
  
  .normal-mode-buttons .d-flex.align-items-center.gap-2,
  .edit-mode-buttons .d-flex.align-items-center.gap-2 {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  
  .btn.bg-success-new.btn-sm {
    min-width: 100px;
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
  }
  
  .dropdown.actions-dropdown .btn {
    min-width: 70px;
    font-size: 0.75rem;
  }
}
/* app/assets/stylesheets/priority_select.css */
.priority-select {
  color: #374151; /* texto gris oscuro por defecto */
}

.priority-select option {
  padding: 8px 12px;
}

.priority-select option[value="urgent"] {
  color: #dc2626; /* rojo */
  font-weight: 500;
}

.priority-select option[value="high"] {
  color: #f97316; /* naranja */
  font-weight: 500;
}

.priority-select option[value="normal"] {
  color: #3b82f6; /* azul */
  font-weight: 500;
}

.priority-select option[value="low"] {
  color: #6b7280; /* gris */
}

.priority-select option[value=""] {
  color: #6b7280; /* gris para "Select priority" */
}

/* Para cuando se muestra la opción seleccionada */
.priority-select:has(option:checked[value="urgent"]) {
  color: #dc2626;
}

.priority-select:has(option:checked[value="high"]) {
  color: #f97316;
}

.priority-select:has(option:checked[value="normal"]) {
  color: #3b82f6;
}

.priority-select:has(option:checked[value="low"]) {
  color: #6b7280;
}
  .note-form-container {
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
  }

  .note-form-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
  }

  .note-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .note-form {
    width: 100%;
  }

  .note-input-wrapper {
    position: relative;
  }

  .note-textarea {
    width: 100%;
    min-height: 80px !important;
    height: auto !important;
    padding: 0.75rem;
    padding-right: 3rem;
    border: 1px solid #d1d5db;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    resize: vertical;
  }

  .note-textarea:focus {
    outline: none;
    border-color: #3b82f6;
  }

  .note-submit-btn {
    position: absolute;
    right: 0.5rem;
    bottom: 0.5rem;
    width: 2.75rem;
    height: 2.75rem;
    background-color: #2563eb !important;
    border: none !important;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white !important;
    cursor: pointer;
  }

  .note-submit-btn:hover {
    background-color: #1d4ed8 !important;
  }

  /* Mobile adjustments */
  @media (max-width: 576px) {
    .note-form-container {
      padding: 0.75rem;
    }

    .note-form-header {
      flex-direction: column;
      align-items: flex-start;
    }

    .note-form-actions {
      width: 100%;
      justify-content: flex-start;
    }

    .note-form-actions button {
      flex: 1;
      justify-content: center;
      min-width: 0;
    }

    .note-textarea {
      min-height: 100px !important;
      font-size: 16px;
      /* Prevents zoom on iOS */
    }
  }
/* app/assets/stylesheets/activities.css */
.activity-item {
  display: flex;
  gap: 1rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid #e5e7eb;
}

.activity-avatar-wrapper {
  position: relative;
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
}

.activity-avatar {
  width: 100%;
  height: 100%;
  border-radius: 9999px;
  overflow: hidden;
}

.avatar-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.avatar-initials {
  width: 100%;
  height: 100%;
  border-radius: 9999px;
  background-color: #3b82f6;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 500;
}

.avatar-icon.system {
  width: 100%;
  height: 100%;
  border-radius: 9999px;
  background-color: #9ca3af;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avatar-icon.system .lucide-icon {
  width: 1.5rem;
  height: 1.5rem;
}

.activity-icon {
  position: absolute;
  bottom: -2px;
  right: -2px;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background-color: white;
  border: 2px solid white;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.activity-icon .lucide-icon {
  width: 0.75rem;
  height: 0.75rem;
  color: #6b7280;
}

.activity-content {
  flex: 1;
}

.activity-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.25rem;
}

.activity-title {
  font-size: 0.9375rem;
}

.user-name {
  font-weight: 600;
  color: #111827;
}

.action-text {
  color: #4b5563;
  margin-left: 0.25rem;
}

.activity-timestamp {
  font-size: 0.75rem;
  color: #6b7280;
  white-space: nowrap;
}

.activity-body {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.5;
}

.activity-note {
  background-color: #f9fafb;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  margin-top: 1rem;
  color: #4b5563;
}

.activity-description {
  margin-top: 0.25rem;
}

.activity-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

/* Force square thumbnails on desktop. The partial uses Tailwind `w-32 h-32`
   but `w-32` isn't emitted by the JIT build, so the image would collapse to
   its intrinsic width and render as a tall narrow strip. */
.activity-attachments > .cursor-pointer {
  width: 8rem;
  height: 8rem;
  flex-shrink: 0;
}

.activity-attachments > .cursor-pointer > img,
.activity-attachments > .cursor-pointer > video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
}

/* Estilos para el formulario de notas */
.note-form-container {
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  padding: 1.25rem;
  margin-bottom: 1.5rem;
}

.note-form-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}

.note-form-actions {
  display: flex;
  gap: 0.5rem;
}

.note-form-actions .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
  border: 1px solid #d1d5db;
  background-color: white;
  border-radius: 0.375rem;
  color: #374151;
}

.note-form-actions .btn:hover {
  background-color: #f3f4f6;
}

.note-form-actions .lucide-icon {
  width: 16px;
  height: 16px;
}

.note-input-wrapper {
  position: relative;
  margin-bottom: 0.75rem;
}

.note-textarea {
  width: 100%;
  padding: 0.75rem 3rem 0.75rem 1rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  resize: vertical;
  min-height: 100px;
}

.note-textarea:focus {
  outline: none;
  border-color: #3b82f6;
  ring: 2px solid #3b82f6;
}

.note-submit-btn {
  position: absolute;
  right: 0.5rem;
  bottom: 0.5rem;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3b82f6;
  border: none;
  border-radius: 0.5rem;
  color: white;
  cursor: pointer;
}

.note-submit-btn:hover {
  background-color: #2563eb;
}

.note-submit-btn .lucide-icon {
  width: 20px;
  height: 20px;
}

.note-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

/* ==========================================================================
   Activity Assignment Pills - Mobile Responsive
   ========================================================================== */

.activity-assignment {
  flex-wrap: wrap;
}

.activity-assignment>span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Progress change pills */
.activity-progress-change {
  flex-wrap: wrap;
}

/* Priority change pills */
.activity-priority-change {
  flex-wrap: wrap;
}

/* Mobile adjustments */
@media (max-width: 576px) {

  .activity-assignment,
  .activity-progress-change,
  .activity-priority-change {
    gap: 0.25rem;
  }

  .activity-assignment>span,
  .activity-progress-change>span,
  .activity-priority-change>span {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem;
  }

  /* Allow longer names on mobile before truncating; parent .activity-assignment
     has flex-wrap so very long names will wrap rather than overflow. */
  .activity-assignment>span>span:last-child {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: middle;
  }

  /* Arrow icon smaller on mobile */
  .activity-assignment>svg,
  .activity-progress-change>svg,
  .activity-priority-change>svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
  }

  /* Attachments: 2 per row on mobile */
  .activity-attachments,
  .note-attachments {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .activity-attachments .cursor-pointer,
  .activity-attachments img,
  .note-attachments img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }
}

/* ==========================================================================
   Completion Card Sections
   Rendered inside the activity card when a service is marked complete.
   Replaces the generic "changed the status" row + separate note card with a
   single sectioned layout: Status transition, progress transition, notes,
   attachments — each section hidden when empty, no dividers.
   ========================================================================== */

.completion-card-sections {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  margin-top: 0.25rem;
}

.completion-section {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.completion-section-label {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  color: #9ca3af;
  font-size: 0.8125rem;
  font-weight: 400;
}

.completion-section-label .completion-section-icon {
  color: #9ca3af;
  stroke: #9ca3af;
  flex-shrink: 0;
}

.completion-section-content {
  color: #374151;
  font-size: 0.875rem;
  line-height: 1.5;
}

.completion-section-content p {
  margin-bottom: 0;
}
.activity-feed {
  margin-top: 1.5rem;
}

.activity-items-wrapper {
  display: block;
}

.activity-date-group {
  margin-bottom: 0;
}

.activity-feed-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}

.activity-feed-header h4 {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
}

.activity-feed-header p {
  font-size: 0.75rem;
  color: #6b7280;
}

/* Date group divider with centered pill */
.activity-date-divider {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 0.75rem 0;
}

.activity-date-divider::before,
.activity-date-divider::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid #dee2e6;
}

.activity-date-pill {
  display: inline-block;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: #6b7280;
  background-color: #f3f4f6;
  border: 1px solid #dee2e6;
  border-radius: 9999px;
  white-space: nowrap;
  margin: 0 0.75rem;
}

/* Estilos para attachments */
.attachment-preview {
  position: relative;
  width: 112px;
  height: 112px;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  overflow: visible;
}

.attachment-preview > .relative,
.attachment-preview > div:first-child {
  width: 100%;
  height: 100%;
  border-radius: 0.375rem;
  overflow: hidden;
}

.attachment-preview img,
.attachment-preview video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.attachment-preview .remove-attachment {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 24px;
  height: 24px;
  background-color: #ef4444;
  border: 2px solid #ffffff;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  z-index: 2;
}

.attachment-preview .remove-attachment:hover {
  background-color: #dc2626;
  color: #ffffff;
}
.chat-unread-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background-color: #dc3545;
  color: #fff;
  border-radius: 50%;
  min-width: 18px;
  height: 18px;
  font-size: 11px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
}
.feature-disabled-page-wrapper {
  min-height: calc(100vh - 72px);
}
/* ------------------------------------------
   Lucide Icons – Global Styles
------------------------------------------- */

/* Base class for all lucide icons */
.lucide-icon {
  width: 20px;
  height: 20px;
  display: inline-block;
  stroke-width: 2;
  vertical-align: middle;
  cursor: pointer;

  /* Improve visual interaction */
  transition: stroke 0.2s ease, transform 0.2s ease;

  &:hover {
    transform: scale(1.1);
  }
}

/* Optional Several sizes */
.lucide-icon.sm {
  width: 18px;
  height: 18px;
}

.lucide-icon.md {
  width: 22px;
  height: 22px;
}

.lucide-icon.lg {
  width: 28px;
  height: 28px;
}

.margin-left {
  margin-left: 20px;
}

/* Required to be able to see icon as gray and displaying tooltip */
svg.lucide-icon {
  stroke: #6e7985 !important;
  display: inline-block !important;
  pointer-events: auto !important;
}

svg.lucide-icon-blue {
  stroke: #0067B3 !important;
  display: inline-block !important;
  pointer-events: auto !important;
}

svg.lucide-icon:hover {
  stroke: #555 !important;
}
/*
* Remix Icon v2.5.0
* https://remixicon.com
* https://github.com/Remix-Design/RemixIcon
*
* Copyright RemixIcon.com
* Released under the Apache License Version 2.0
*
* Date: 2020-05-23
*/
@font-face {
  font-family: "remixicon";
  src: url(/assets/remixicon-9ec1723f207a4945dfaee350960a1834d8ee560ef767066fad86eb3c21c36745.woff2?t=1590207869815) format("woff2"),
  url(/assets/remixicon-ece6bff4445c24c37c0649ca3e86160624c86b96d4f7ce662a5f581331e77cfe.woff?t=1590207869815) format("woff"),
  url(/assets/remixicon-ab5769a97382874bc49bad18d49800149ba19f86ec3cb3d7cfcbb55045ea41cc.ttf?t=1590207869815) format('truetype');
  font-display: swap;
}

[class^="ri-"], [class*=" ri-"] {
  font-family: 'remixicon' !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.ri-lg { font-size: 1.3333em; line-height: 0.75em; vertical-align: -.0667em; }
.ri-xl { font-size: 1.5em; line-height: 0.6666em; vertical-align: -.075em; }
.ri-xxs { font-size: .5em; }
.ri-xs { font-size: .75em; }
.ri-sm { font-size: .875em }
.ri-1x { font-size: 1em; }
.ri-2x { font-size: 2em; }
.ri-3x { font-size: 3em; }
.ri-4x { font-size: 4em; }
.ri-5x { font-size: 5em; }
.ri-6x { font-size: 6em; }
.ri-7x { font-size: 7em; }
.ri-8x { font-size: 8em; }
.ri-9x { font-size: 9em; }
.ri-10x { font-size: 10em; }
.ri-fw { text-align: center; width: 1.25em; }

.ri-24-hours-fill:before { content: "\ea01"; }
.ri-24-hours-line:before { content: "\ea02"; }
.ri-4k-fill:before { content: "\ea03"; }
.ri-4k-line:before { content: "\ea04"; }
.ri-a-b:before { content: "\ea05"; }
.ri-account-box-fill:before { content: "\ea06"; }
.ri-account-box-line:before { content: "\ea07"; }
.ri-account-circle-fill:before { content: "\ea08"; }
.ri-account-circle-line:before { content: "\ea09"; }
.ri-account-pin-box-fill:before { content: "\ea0a"; }
.ri-account-pin-box-line:before { content: "\ea0b"; }
.ri-account-pin-circle-fill:before { content: "\ea0c"; }
.ri-account-pin-circle-line:before { content: "\ea0d"; }
.ri-add-box-fill:before { content: "\ea0e"; }
.ri-add-box-line:before { content: "\ea0f"; }
.ri-add-circle-fill:before { content: "\ea10"; }
.ri-add-circle-line:before { content: "\ea11"; }
.ri-add-fill:before { content: "\ea12"; }
.ri-add-line:before { content: "\ea13"; }
.ri-admin-fill:before { content: "\ea14"; }
.ri-admin-line:before { content: "\ea15"; }
.ri-advertisement-fill:before { content: "\ea16"; }
.ri-advertisement-line:before { content: "\ea17"; }
.ri-airplay-fill:before { content: "\ea18"; }
.ri-airplay-line:before { content: "\ea19"; }
.ri-alarm-fill:before { content: "\ea1a"; }
.ri-alarm-line:before { content: "\ea1b"; }
.ri-alarm-warning-fill:before { content: "\ea1c"; }
.ri-alarm-warning-line:before { content: "\ea1d"; }
.ri-album-fill:before { content: "\ea1e"; }
.ri-album-line:before { content: "\ea1f"; }
.ri-alert-fill:before { content: "\ea20"; }
.ri-alert-line:before { content: "\ea21"; }
.ri-aliens-fill:before { content: "\ea22"; }
.ri-aliens-line:before { content: "\ea23"; }
.ri-align-bottom:before { content: "\ea24"; }
.ri-align-center:before { content: "\ea25"; }
.ri-align-justify:before { content: "\ea26"; }
.ri-align-left:before { content: "\ea27"; }
.ri-align-right:before { content: "\ea28"; }
.ri-align-top:before { content: "\ea29"; }
.ri-align-vertically:before { content: "\ea2a"; }
.ri-alipay-fill:before { content: "\ea2b"; }
.ri-alipay-line:before { content: "\ea2c"; }
.ri-amazon-fill:before { content: "\ea2d"; }
.ri-amazon-line:before { content: "\ea2e"; }
.ri-anchor-fill:before { content: "\ea2f"; }
.ri-anchor-line:before { content: "\ea30"; }
.ri-ancient-gate-fill:before { content: "\ea31"; }
.ri-ancient-gate-line:before { content: "\ea32"; }
.ri-ancient-pavilion-fill:before { content: "\ea33"; }
.ri-ancient-pavilion-line:before { content: "\ea34"; }
.ri-android-fill:before { content: "\ea35"; }
.ri-android-line:before { content: "\ea36"; }
.ri-angularjs-fill:before { content: "\ea37"; }
.ri-angularjs-line:before { content: "\ea38"; }
.ri-anticlockwise-2-fill:before { content: "\ea39"; }
.ri-anticlockwise-2-line:before { content: "\ea3a"; }
.ri-anticlockwise-fill:before { content: "\ea3b"; }
.ri-anticlockwise-line:before { content: "\ea3c"; }
.ri-app-store-fill:before { content: "\ea3d"; }
.ri-app-store-line:before { content: "\ea3e"; }
.ri-apple-fill:before { content: "\ea3f"; }
.ri-apple-line:before { content: "\ea40"; }
.ri-apps-2-fill:before { content: "\ea41"; }
.ri-apps-2-line:before { content: "\ea42"; }
.ri-apps-fill:before { content: "\ea43"; }
.ri-apps-line:before { content: "\ea44"; }
.ri-archive-drawer-fill:before { content: "\ea45"; }
.ri-archive-drawer-line:before { content: "\ea46"; }
.ri-archive-fill:before { content: "\ea47"; }
.ri-archive-line:before { content: "\ea48"; }
.ri-arrow-down-circle-fill:before { content: "\ea49"; }
.ri-arrow-down-circle-line:before { content: "\ea4a"; }
.ri-arrow-down-fill:before { content: "\ea4b"; }
.ri-arrow-down-line:before { content: "\ea4c"; }
.ri-arrow-down-s-fill:before { content: "\ea4d"; }
.ri-arrow-down-s-line:before { content: "\ea4e"; }
.ri-arrow-drop-down-fill:before { content: "\ea4f"; }
.ri-arrow-drop-down-line:before { content: "\ea50"; }
.ri-arrow-drop-left-fill:before { content: "\ea51"; }
.ri-arrow-drop-left-line:before { content: "\ea52"; }
.ri-arrow-drop-right-fill:before { content: "\ea53"; }
.ri-arrow-drop-right-line:before { content: "\ea54"; }
.ri-arrow-drop-up-fill:before { content: "\ea55"; }
.ri-arrow-drop-up-line:before { content: "\ea56"; }
.ri-arrow-go-back-fill:before { content: "\ea57"; }
.ri-arrow-go-back-line:before { content: "\ea58"; }
.ri-arrow-go-forward-fill:before { content: "\ea59"; }
.ri-arrow-go-forward-line:before { content: "\ea5a"; }
.ri-arrow-left-circle-fill:before { content: "\ea5b"; }
.ri-arrow-left-circle-line:before { content: "\ea5c"; }
.ri-arrow-left-down-fill:before { content: "\ea5d"; }
.ri-arrow-left-down-line:before { content: "\ea5e"; }
.ri-arrow-left-fill:before { content: "\ea5f"; }
.ri-arrow-left-line:before { content: "\ea60"; }
.ri-arrow-left-right-fill:before { content: "\ea61"; }
.ri-arrow-left-right-line:before { content: "\ea62"; }
.ri-arrow-left-s-fill:before { content: "\ea63"; }
.ri-arrow-left-s-line:before { content: "\ea64"; }
.ri-arrow-left-up-fill:before { content: "\ea65"; }
.ri-arrow-left-up-line:before { content: "\ea66"; }
.ri-arrow-right-circle-fill:before { content: "\ea67"; }
.ri-arrow-right-circle-line:before { content: "\ea68"; }
.ri-arrow-right-down-fill:before { content: "\ea69"; }
.ri-arrow-right-down-line:before { content: "\ea6a"; }
.ri-arrow-right-fill:before { content: "\ea6b"; }
.ri-arrow-right-line:before { content: "\ea6c"; }
.ri-arrow-right-s-fill:before { content: "\ea6d"; }
.ri-arrow-right-s-line:before { content: "\ea6e"; }
.ri-arrow-right-up-fill:before { content: "\ea6f"; }
.ri-arrow-right-up-line:before { content: "\ea70"; }
.ri-arrow-up-circle-fill:before { content: "\ea71"; }
.ri-arrow-up-circle-line:before { content: "\ea72"; }
.ri-arrow-up-down-fill:before { content: "\ea73"; }
.ri-arrow-up-down-line:before { content: "\ea74"; }
.ri-arrow-up-fill:before { content: "\ea75"; }
.ri-arrow-up-line:before { content: "\ea76"; }
.ri-arrow-up-s-fill:before { content: "\ea77"; }
.ri-arrow-up-s-line:before { content: "\ea78"; }
.ri-artboard-2-fill:before { content: "\ea79"; }
.ri-artboard-2-line:before { content: "\ea7a"; }
.ri-artboard-fill:before { content: "\ea7b"; }
.ri-artboard-line:before { content: "\ea7c"; }
.ri-article-fill:before { content: "\ea7d"; }
.ri-article-line:before { content: "\ea7e"; }
.ri-aspect-ratio-fill:before { content: "\ea7f"; }
.ri-aspect-ratio-line:before { content: "\ea80"; }
.ri-asterisk:before { content: "\ea81"; }
.ri-at-fill:before { content: "\ea82"; }
.ri-at-line:before { content: "\ea83"; }
.ri-attachment-2:before { content: "\ea84"; }
.ri-attachment-fill:before { content: "\ea85"; }
.ri-attachment-line:before { content: "\ea86"; }
.ri-auction-fill:before { content: "\ea87"; }
.ri-auction-line:before { content: "\ea88"; }
.ri-award-fill:before { content: "\ea89"; }
.ri-award-line:before { content: "\ea8a"; }
.ri-baidu-fill:before { content: "\ea8b"; }
.ri-baidu-line:before { content: "\ea8c"; }
.ri-ball-pen-fill:before { content: "\ea8d"; }
.ri-ball-pen-line:before { content: "\ea8e"; }
.ri-bank-card-2-fill:before { content: "\ea8f"; }
.ri-bank-card-2-line:before { content: "\ea90"; }
.ri-bank-card-fill:before { content: "\ea91"; }
.ri-bank-card-line:before { content: "\ea92"; }
.ri-bank-fill:before { content: "\ea93"; }
.ri-bank-line:before { content: "\ea94"; }
.ri-bar-chart-2-fill:before { content: "\ea95"; }
.ri-bar-chart-2-line:before { content: "\ea96"; }
.ri-bar-chart-box-fill:before { content: "\ea97"; }
.ri-bar-chart-box-line:before { content: "\ea98"; }
.ri-bar-chart-fill:before { content: "\ea99"; }
.ri-bar-chart-grouped-fill:before { content: "\ea9a"; }
.ri-bar-chart-grouped-line:before { content: "\ea9b"; }
.ri-bar-chart-horizontal-fill:before { content: "\ea9c"; }
.ri-bar-chart-horizontal-line:before { content: "\ea9d"; }
.ri-bar-chart-line:before { content: "\ea9e"; }
.ri-barcode-box-fill:before { content: "\ea9f"; }
.ri-barcode-box-line:before { content: "\eaa0"; }
.ri-barcode-fill:before { content: "\eaa1"; }
.ri-barcode-line:before { content: "\eaa2"; }
.ri-barricade-fill:before { content: "\eaa3"; }
.ri-barricade-line:before { content: "\eaa4"; }
.ri-base-station-fill:before { content: "\eaa5"; }
.ri-base-station-line:before { content: "\eaa6"; }
.ri-basketball-fill:before { content: "\eaa7"; }
.ri-basketball-line:before { content: "\eaa8"; }
.ri-battery-2-charge-fill:before { content: "\eaa9"; }
.ri-battery-2-charge-line:before { content: "\eaaa"; }
.ri-battery-2-fill:before { content: "\eaab"; }
.ri-battery-2-line:before { content: "\eaac"; }
.ri-battery-charge-fill:before { content: "\eaad"; }
.ri-battery-charge-line:before { content: "\eaae"; }
.ri-battery-fill:before { content: "\eaaf"; }
.ri-battery-line:before { content: "\eab0"; }
.ri-battery-low-fill:before { content: "\eab1"; }
.ri-battery-low-line:before { content: "\eab2"; }
.ri-battery-saver-fill:before { content: "\eab3"; }
.ri-battery-saver-line:before { content: "\eab4"; }
.ri-battery-share-fill:before { content: "\eab5"; }
.ri-battery-share-line:before { content: "\eab6"; }
.ri-bear-smile-fill:before { content: "\eab7"; }
.ri-bear-smile-line:before { content: "\eab8"; }
.ri-behance-fill:before { content: "\eab9"; }
.ri-behance-line:before { content: "\eaba"; }
.ri-bell-fill:before { content: "\eabb"; }
.ri-bell-line:before { content: "\eabc"; }
.ri-bike-fill:before { content: "\eabd"; }
.ri-bike-line:before { content: "\eabe"; }
.ri-bilibili-fill:before { content: "\eabf"; }
.ri-bilibili-line:before { content: "\eac0"; }
.ri-bill-fill:before { content: "\eac1"; }
.ri-bill-line:before { content: "\eac2"; }
.ri-billiards-fill:before { content: "\eac3"; }
.ri-billiards-line:before { content: "\eac4"; }
.ri-bit-coin-fill:before { content: "\eac5"; }
.ri-bit-coin-line:before { content: "\eac6"; }
.ri-blaze-fill:before { content: "\eac7"; }
.ri-blaze-line:before { content: "\eac8"; }
.ri-bluetooth-connect-fill:before { content: "\eac9"; }
.ri-bluetooth-connect-line:before { content: "\eaca"; }
.ri-bluetooth-fill:before { content: "\eacb"; }
.ri-bluetooth-line:before { content: "\eacc"; }
.ri-blur-off-fill:before { content: "\eacd"; }
.ri-blur-off-line:before { content: "\eace"; }
.ri-body-scan-fill:before { content: "\eacf"; }
.ri-body-scan-line:before { content: "\ead0"; }
.ri-bold:before { content: "\ead1"; }
.ri-book-2-fill:before { content: "\ead2"; }
.ri-book-2-line:before { content: "\ead3"; }
.ri-book-3-fill:before { content: "\ead4"; }
.ri-book-3-line:before { content: "\ead5"; }
.ri-book-fill:before { content: "\ead6"; }
.ri-book-line:before { content: "\ead7"; }
.ri-book-mark-fill:before { content: "\ead8"; }
.ri-book-mark-line:before { content: "\ead9"; }
.ri-book-open-fill:before { content: "\eada"; }
.ri-book-open-line:before { content: "\eadb"; }
.ri-book-read-fill:before { content: "\eadc"; }
.ri-book-read-line:before { content: "\eadd"; }
.ri-booklet-fill:before { content: "\eade"; }
.ri-booklet-line:before { content: "\eadf"; }
.ri-bookmark-2-fill:before { content: "\eae0"; }
.ri-bookmark-2-line:before { content: "\eae1"; }
.ri-bookmark-3-fill:before { content: "\eae2"; }
.ri-bookmark-3-line:before { content: "\eae3"; }
.ri-bookmark-fill:before { content: "\eae4"; }
.ri-bookmark-line:before { content: "\eae5"; }
.ri-boxing-fill:before { content: "\eae6"; }
.ri-boxing-line:before { content: "\eae7"; }
.ri-braces-fill:before { content: "\eae8"; }
.ri-braces-line:before { content: "\eae9"; }
.ri-brackets-fill:before { content: "\eaea"; }
.ri-brackets-line:before { content: "\eaeb"; }
.ri-briefcase-2-fill:before { content: "\eaec"; }
.ri-briefcase-2-line:before { content: "\eaed"; }
.ri-briefcase-3-fill:before { content: "\eaee"; }
.ri-briefcase-3-line:before { content: "\eaef"; }
.ri-briefcase-4-fill:before { content: "\eaf0"; }
.ri-briefcase-4-line:before { content: "\eaf1"; }
.ri-briefcase-5-fill:before { content: "\eaf2"; }
.ri-briefcase-5-line:before { content: "\eaf3"; }
.ri-briefcase-fill:before { content: "\eaf4"; }
.ri-briefcase-line:before { content: "\eaf5"; }
.ri-bring-forward:before { content: "\eaf6"; }
.ri-bring-to-front:before { content: "\eaf7"; }
.ri-broadcast-fill:before { content: "\eaf8"; }
.ri-broadcast-line:before { content: "\eaf9"; }
.ri-brush-2-fill:before { content: "\eafa"; }
.ri-brush-2-line:before { content: "\eafb"; }
.ri-brush-3-fill:before { content: "\eafc"; }
.ri-brush-3-line:before { content: "\eafd"; }
.ri-brush-4-fill:before { content: "\eafe"; }
.ri-brush-4-line:before { content: "\eaff"; }
.ri-brush-fill:before { content: "\eb00"; }
.ri-brush-line:before { content: "\eb01"; }
.ri-bubble-chart-fill:before { content: "\eb02"; }
.ri-bubble-chart-line:before { content: "\eb03"; }
.ri-bug-2-fill:before { content: "\eb04"; }
.ri-bug-2-line:before { content: "\eb05"; }
.ri-bug-fill:before { content: "\eb06"; }
.ri-bug-line:before { content: "\eb07"; }
.ri-building-2-fill:before { content: "\eb08"; }
.ri-building-2-line:before { content: "\eb09"; }
.ri-building-3-fill:before { content: "\eb0a"; }
.ri-building-3-line:before { content: "\eb0b"; }
.ri-building-4-fill:before { content: "\eb0c"; }
.ri-building-4-line:before { content: "\eb0d"; }
.ri-building-fill:before { content: "\eb0e"; }
.ri-building-line:before { content: "\eb0f"; }
.ri-bus-2-fill:before { content: "\eb10"; }
.ri-bus-2-line:before { content: "\eb11"; }
.ri-bus-fill:before { content: "\eb12"; }
.ri-bus-line:before { content: "\eb13"; }
.ri-bus-wifi-fill:before { content: "\eb14"; }
.ri-bus-wifi-line:before { content: "\eb15"; }
.ri-cactus-fill:before { content: "\eb16"; }
.ri-cactus-line:before { content: "\eb17"; }
.ri-cake-2-fill:before { content: "\eb18"; }
.ri-cake-2-line:before { content: "\eb19"; }
.ri-cake-3-fill:before { content: "\eb1a"; }
.ri-cake-3-line:before { content: "\eb1b"; }
.ri-cake-fill:before { content: "\eb1c"; }
.ri-cake-line:before { content: "\eb1d"; }
.ri-calculator-fill:before { content: "\eb1e"; }
.ri-calculator-line:before { content: "\eb1f"; }
.ri-calendar-2-fill:before { content: "\eb20"; }
.ri-calendar-2-line:before { content: "\eb21"; }
.ri-calendar-check-fill:before { content: "\eb22"; }
.ri-calendar-check-line:before { content: "\eb23"; }
.ri-calendar-event-fill:before { content: "\eb24"; }
.ri-calendar-event-line:before { content: "\eb25"; }
.ri-calendar-fill:before { content: "\eb26"; }
.ri-calendar-line:before { content: "\eb27"; }
.ri-calendar-todo-fill:before { content: "\eb28"; }
.ri-calendar-todo-line:before { content: "\eb29"; }
.ri-camera-2-fill:before { content: "\eb2a"; }
.ri-camera-2-line:before { content: "\eb2b"; }
.ri-camera-3-fill:before { content: "\eb2c"; }
.ri-camera-3-line:before { content: "\eb2d"; }
.ri-camera-fill:before { content: "\eb2e"; }
.ri-camera-lens-fill:before { content: "\eb2f"; }
.ri-camera-lens-line:before { content: "\eb30"; }
.ri-camera-line:before { content: "\eb31"; }
.ri-camera-off-fill:before { content: "\eb32"; }
.ri-camera-off-line:before { content: "\eb33"; }
.ri-camera-switch-fill:before { content: "\eb34"; }
.ri-camera-switch-line:before { content: "\eb35"; }
.ri-capsule-fill:before { content: "\eb36"; }
.ri-capsule-line:before { content: "\eb37"; }
.ri-car-fill:before { content: "\eb38"; }
.ri-car-line:before { content: "\eb39"; }
.ri-car-washing-fill:before { content: "\eb3a"; }
.ri-car-washing-line:before { content: "\eb3b"; }
.ri-caravan-fill:before { content: "\eb3c"; }
.ri-caravan-line:before { content: "\eb3d"; }
.ri-cast-fill:before { content: "\eb3e"; }
.ri-cast-line:before { content: "\eb3f"; }
.ri-cellphone-fill:before { content: "\eb40"; }
.ri-cellphone-line:before { content: "\eb41"; }
.ri-celsius-fill:before { content: "\eb42"; }
.ri-celsius-line:before { content: "\eb43"; }
.ri-centos-fill:before { content: "\eb44"; }
.ri-centos-line:before { content: "\eb45"; }
.ri-character-recognition-fill:before { content: "\eb46"; }
.ri-character-recognition-line:before { content: "\eb47"; }
.ri-charging-pile-2-fill:before { content: "\eb48"; }
.ri-charging-pile-2-line:before { content: "\eb49"; }
.ri-charging-pile-fill:before { content: "\eb4a"; }
.ri-charging-pile-line:before { content: "\eb4b"; }
.ri-chat-1-fill:before { content: "\eb4c"; }
.ri-chat-1-line:before { content: "\eb4d"; }
.ri-chat-2-fill:before { content: "\eb4e"; }
.ri-chat-2-line:before { content: "\eb4f"; }
.ri-chat-3-fill:before { content: "\eb50"; }
.ri-chat-3-line:before { content: "\eb51"; }
.ri-chat-4-fill:before { content: "\eb52"; }
.ri-chat-4-line:before { content: "\eb53"; }
.ri-chat-check-fill:before { content: "\eb54"; }
.ri-chat-check-line:before { content: "\eb55"; }
.ri-chat-delete-fill:before { content: "\eb56"; }
.ri-chat-delete-line:before { content: "\eb57"; }
.ri-chat-download-fill:before { content: "\eb58"; }
.ri-chat-download-line:before { content: "\eb59"; }
.ri-chat-follow-up-fill:before { content: "\eb5a"; }
.ri-chat-follow-up-line:before { content: "\eb5b"; }
.ri-chat-forward-fill:before { content: "\eb5c"; }
.ri-chat-forward-line:before { content: "\eb5d"; }
.ri-chat-heart-fill:before { content: "\eb5e"; }
.ri-chat-heart-line:before { content: "\eb5f"; }
.ri-chat-history-fill:before { content: "\eb60"; }
.ri-chat-history-line:before { content: "\eb61"; }
.ri-chat-new-fill:before { content: "\eb62"; }
.ri-chat-new-line:before { content: "\eb63"; }
.ri-chat-off-fill:before { content: "\eb64"; }
.ri-chat-off-line:before { content: "\eb65"; }
.ri-chat-poll-fill:before { content: "\eb66"; }
.ri-chat-poll-line:before { content: "\eb67"; }
.ri-chat-private-fill:before { content: "\eb68"; }
.ri-chat-private-line:before { content: "\eb69"; }
.ri-chat-quote-fill:before { content: "\eb6a"; }
.ri-chat-quote-line:before { content: "\eb6b"; }
.ri-chat-settings-fill:before { content: "\eb6c"; }
.ri-chat-settings-line:before { content: "\eb6d"; }
.ri-chat-smile-2-fill:before { content: "\eb6e"; }
.ri-chat-smile-2-line:before { content: "\eb6f"; }
.ri-chat-smile-3-fill:before { content: "\eb70"; }
.ri-chat-smile-3-line:before { content: "\eb71"; }
.ri-chat-smile-fill:before { content: "\eb72"; }
.ri-chat-smile-line:before { content: "\eb73"; }
.ri-chat-upload-fill:before { content: "\eb74"; }
.ri-chat-upload-line:before { content: "\eb75"; }
.ri-chat-voice-fill:before { content: "\eb76"; }
.ri-chat-voice-line:before { content: "\eb77"; }
.ri-check-double-fill:before { content: "\eb78"; }
.ri-check-double-line:before { content: "\eb79"; }
.ri-check-fill:before { content: "\eb7a"; }
.ri-check-line:before { content: "\eb7b"; }
.ri-checkbox-blank-circle-fill:before { content: "\eb7c"; }
.ri-checkbox-blank-circle-line:before { content: "\eb7d"; }
.ri-checkbox-blank-fill:before { content: "\eb7e"; }
.ri-checkbox-blank-line:before { content: "\eb7f"; }
.ri-checkbox-circle-fill:before { content: "\eb80"; }
.ri-checkbox-circle-line:before { content: "\eb81"; }
.ri-checkbox-fill:before { content: "\eb82"; }
.ri-checkbox-indeterminate-fill:before { content: "\eb83"; }
.ri-checkbox-indeterminate-line:before { content: "\eb84"; }
.ri-checkbox-line:before { content: "\eb85"; }
.ri-checkbox-multiple-blank-fill:before { content: "\eb86"; }
.ri-checkbox-multiple-blank-line:before { content: "\eb87"; }
.ri-checkbox-multiple-fill:before { content: "\eb88"; }
.ri-checkbox-multiple-line:before { content: "\eb89"; }
.ri-china-railway-fill:before { content: "\eb8a"; }
.ri-china-railway-line:before { content: "\eb8b"; }
.ri-chrome-fill:before { content: "\eb8c"; }
.ri-chrome-line:before { content: "\eb8d"; }
.ri-clapperboard-fill:before { content: "\eb8e"; }
.ri-clapperboard-line:before { content: "\eb8f"; }
.ri-clipboard-fill:before { content: "\eb90"; }
.ri-clipboard-line:before { content: "\eb91"; }
.ri-clockwise-2-fill:before { content: "\eb92"; }
.ri-clockwise-2-line:before { content: "\eb93"; }
.ri-clockwise-fill:before { content: "\eb94"; }
.ri-clockwise-line:before { content: "\eb95"; }
.ri-close-circle-fill:before { content: "\eb96"; }
.ri-close-circle-line:before { content: "\eb97"; }
.ri-close-fill:before { content: "\eb98"; }
.ri-close-line:before { content: "\eb99"; }
.ri-closed-captioning-fill:before { content: "\eb9a"; }
.ri-closed-captioning-line:before { content: "\eb9b"; }
.ri-cloud-fill:before { content: "\eb9c"; }
.ri-cloud-line:before { content: "\eb9d"; }
.ri-cloud-off-fill:before { content: "\eb9e"; }
.ri-cloud-off-line:before { content: "\eb9f"; }
.ri-cloud-windy-fill:before { content: "\eba0"; }
.ri-cloud-windy-line:before { content: "\eba1"; }
.ri-cloudy-2-fill:before { content: "\eba2"; }
.ri-cloudy-2-line:before { content: "\eba3"; }
.ri-cloudy-fill:before { content: "\eba4"; }
.ri-cloudy-line:before { content: "\eba5"; }
.ri-code-box-fill:before { content: "\eba6"; }
.ri-code-box-line:before { content: "\eba7"; }
.ri-code-fill:before { content: "\eba8"; }
.ri-code-line:before { content: "\eba9"; }
.ri-code-s-fill:before { content: "\ebaa"; }
.ri-code-s-line:before { content: "\ebab"; }
.ri-code-s-slash-fill:before { content: "\ebac"; }
.ri-code-s-slash-line:before { content: "\ebad"; }
.ri-code-view:before { content: "\ebae"; }
.ri-codepen-fill:before { content: "\ebaf"; }
.ri-codepen-line:before { content: "\ebb0"; }
.ri-coin-fill:before { content: "\ebb1"; }
.ri-coin-line:before { content: "\ebb2"; }
.ri-coins-fill:before { content: "\ebb3"; }
.ri-coins-line:before { content: "\ebb4"; }
.ri-collage-fill:before { content: "\ebb5"; }
.ri-collage-line:before { content: "\ebb6"; }
.ri-command-fill:before { content: "\ebb7"; }
.ri-command-line:before { content: "\ebb8"; }
.ri-community-fill:before { content: "\ebb9"; }
.ri-community-line:before { content: "\ebba"; }
.ri-compass-2-fill:before { content: "\ebbb"; }
.ri-compass-2-line:before { content: "\ebbc"; }
.ri-compass-3-fill:before { content: "\ebbd"; }
.ri-compass-3-line:before { content: "\ebbe"; }
.ri-compass-4-fill:before { content: "\ebbf"; }
.ri-compass-4-line:before { content: "\ebc0"; }
.ri-compass-discover-fill:before { content: "\ebc1"; }
.ri-compass-discover-line:before { content: "\ebc2"; }
.ri-compass-fill:before { content: "\ebc3"; }
.ri-compass-line:before { content: "\ebc4"; }
.ri-compasses-2-fill:before { content: "\ebc5"; }
.ri-compasses-2-line:before { content: "\ebc6"; }
.ri-compasses-fill:before { content: "\ebc7"; }
.ri-compasses-line:before { content: "\ebc8"; }
.ri-computer-fill:before { content: "\ebc9"; }
.ri-computer-line:before { content: "\ebca"; }
.ri-contacts-book-2-fill:before { content: "\ebcb"; }
.ri-contacts-book-2-line:before { content: "\ebcc"; }
.ri-contacts-book-fill:before { content: "\ebcd"; }
.ri-contacts-book-line:before { content: "\ebce"; }
.ri-contacts-book-upload-fill:before { content: "\ebcf"; }
.ri-contacts-book-upload-line:before { content: "\ebd0"; }
.ri-contacts-fill:before { content: "\ebd1"; }
.ri-contacts-line:before { content: "\ebd2"; }
.ri-contrast-2-fill:before { content: "\ebd3"; }
.ri-contrast-2-line:before { content: "\ebd4"; }
.ri-contrast-drop-2-fill:before { content: "\ebd5"; }
.ri-contrast-drop-2-line:before { content: "\ebd6"; }
.ri-contrast-drop-fill:before { content: "\ebd7"; }
.ri-contrast-drop-line:before { content: "\ebd8"; }
.ri-contrast-fill:before { content: "\ebd9"; }
.ri-contrast-line:before { content: "\ebda"; }
.ri-copper-coin-fill:before { content: "\ebdb"; }
.ri-copper-coin-line:before { content: "\ebdc"; }
.ri-copper-diamond-fill:before { content: "\ebdd"; }
.ri-copper-diamond-line:before { content: "\ebde"; }
.ri-copyleft-fill:before { content: "\ebdf"; }
.ri-copyleft-line:before { content: "\ebe0"; }
.ri-copyright-fill:before { content: "\ebe1"; }
.ri-copyright-line:before { content: "\ebe2"; }
.ri-coreos-fill:before { content: "\ebe3"; }
.ri-coreos-line:before { content: "\ebe4"; }
.ri-coupon-2-fill:before { content: "\ebe5"; }
.ri-coupon-2-line:before { content: "\ebe6"; }
.ri-coupon-3-fill:before { content: "\ebe7"; }
.ri-coupon-3-line:before { content: "\ebe8"; }
.ri-coupon-4-fill:before { content: "\ebe9"; }
.ri-coupon-4-line:before { content: "\ebea"; }
.ri-coupon-5-fill:before { content: "\ebeb"; }
.ri-coupon-5-line:before { content: "\ebec"; }
.ri-coupon-fill:before { content: "\ebed"; }
.ri-coupon-line:before { content: "\ebee"; }
.ri-cpu-fill:before { content: "\ebef"; }
.ri-cpu-line:before { content: "\ebf0"; }
.ri-creative-commons-by-fill:before { content: "\ebf1"; }
.ri-creative-commons-by-line:before { content: "\ebf2"; }
.ri-creative-commons-fill:before { content: "\ebf3"; }
.ri-creative-commons-line:before { content: "\ebf4"; }
.ri-creative-commons-nc-fill:before { content: "\ebf5"; }
.ri-creative-commons-nc-line:before { content: "\ebf6"; }
.ri-creative-commons-nd-fill:before { content: "\ebf7"; }
.ri-creative-commons-nd-line:before { content: "\ebf8"; }
.ri-creative-commons-sa-fill:before { content: "\ebf9"; }
.ri-creative-commons-sa-line:before { content: "\ebfa"; }
.ri-creative-commons-zero-fill:before { content: "\ebfb"; }
.ri-creative-commons-zero-line:before { content: "\ebfc"; }
.ri-criminal-fill:before { content: "\ebfd"; }
.ri-criminal-line:before { content: "\ebfe"; }
.ri-crop-2-fill:before { content: "\ebff"; }
.ri-crop-2-line:before { content: "\ec00"; }
.ri-crop-fill:before { content: "\ec01"; }
.ri-crop-line:before { content: "\ec02"; }
.ri-css3-fill:before { content: "\ec03"; }
.ri-css3-line:before { content: "\ec04"; }
.ri-cup-fill:before { content: "\ec05"; }
.ri-cup-line:before { content: "\ec06"; }
.ri-currency-fill:before { content: "\ec07"; }
.ri-currency-line:before { content: "\ec08"; }
.ri-cursor-fill:before { content: "\ec09"; }
.ri-cursor-line:before { content: "\ec0a"; }
.ri-customer-service-2-fill:before { content: "\ec0b"; }
.ri-customer-service-2-line:before { content: "\ec0c"; }
.ri-customer-service-fill:before { content: "\ec0d"; }
.ri-customer-service-line:before { content: "\ec0e"; }
.ri-dashboard-2-fill:before { content: "\ec0f"; }
.ri-dashboard-2-line:before { content: "\ec10"; }
.ri-dashboard-3-fill:before { content: "\ec11"; }
.ri-dashboard-3-line:before { content: "\ec12"; }
.ri-dashboard-fill:before { content: "\ec13"; }
.ri-dashboard-line:before { content: "\ec14"; }
.ri-database-2-fill:before { content: "\ec15"; }
.ri-database-2-line:before { content: "\ec16"; }
.ri-database-fill:before { content: "\ec17"; }
.ri-database-line:before { content: "\ec18"; }
.ri-delete-back-2-fill:before { content: "\ec19"; }
.ri-delete-back-2-line:before { content: "\ec1a"; }
.ri-delete-back-fill:before { content: "\ec1b"; }
.ri-delete-back-line:before { content: "\ec1c"; }
.ri-delete-bin-2-fill:before { content: "\ec1d"; }
.ri-delete-bin-2-line:before { content: "\ec1e"; }
.ri-delete-bin-3-fill:before { content: "\ec1f"; }
.ri-delete-bin-3-line:before { content: "\ec20"; }
.ri-delete-bin-4-fill:before { content: "\ec21"; }
.ri-delete-bin-4-line:before { content: "\ec22"; }
.ri-delete-bin-5-fill:before { content: "\ec23"; }
.ri-delete-bin-5-line:before { content: "\ec24"; }
.ri-delete-bin-6-fill:before { content: "\ec25"; }
.ri-delete-bin-6-line:before { content: "\ec26"; }
.ri-delete-bin-7-fill:before { content: "\ec27"; }
.ri-delete-bin-7-line:before { content: "\ec28"; }
.ri-delete-bin-fill:before { content: "\ec29"; }
.ri-delete-bin-line:before { content: "\ec2a"; }
.ri-delete-column:before { content: "\ec2b"; }
.ri-delete-row:before { content: "\ec2c"; }
.ri-device-fill:before { content: "\ec2d"; }
.ri-device-line:before { content: "\ec2e"; }
.ri-device-recover-fill:before { content: "\ec2f"; }
.ri-device-recover-line:before { content: "\ec30"; }
.ri-dingding-fill:before { content: "\ec31"; }
.ri-dingding-line:before { content: "\ec32"; }
.ri-direction-fill:before { content: "\ec33"; }
.ri-direction-line:before { content: "\ec34"; }
.ri-disc-fill:before { content: "\ec35"; }
.ri-disc-line:before { content: "\ec36"; }
.ri-discord-fill:before { content: "\ec37"; }
.ri-discord-line:before { content: "\ec38"; }
.ri-discuss-fill:before { content: "\ec39"; }
.ri-discuss-line:before { content: "\ec3a"; }
.ri-dislike-fill:before { content: "\ec3b"; }
.ri-dislike-line:before { content: "\ec3c"; }
.ri-disqus-fill:before { content: "\ec3d"; }
.ri-disqus-line:before { content: "\ec3e"; }
.ri-divide-fill:before { content: "\ec3f"; }
.ri-divide-line:before { content: "\ec40"; }
.ri-donut-chart-fill:before { content: "\ec41"; }
.ri-donut-chart-line:before { content: "\ec42"; }
.ri-door-closed-fill:before { content: "\ec43"; }
.ri-door-closed-line:before { content: "\ec44"; }
.ri-door-fill:before { content: "\ec45"; }
.ri-door-line:before { content: "\ec46"; }
.ri-door-lock-box-fill:before { content: "\ec47"; }
.ri-door-lock-box-line:before { content: "\ec48"; }
.ri-door-lock-fill:before { content: "\ec49"; }
.ri-door-lock-line:before { content: "\ec4a"; }
.ri-door-open-fill:before { content: "\ec4b"; }
.ri-door-open-line:before { content: "\ec4c"; }
.ri-dossier-fill:before { content: "\ec4d"; }
.ri-dossier-line:before { content: "\ec4e"; }
.ri-douban-fill:before { content: "\ec4f"; }
.ri-douban-line:before { content: "\ec50"; }
.ri-double-quotes-l:before { content: "\ec51"; }
.ri-double-quotes-r:before { content: "\ec52"; }
.ri-download-2-fill:before { content: "\ec53"; }
.ri-download-2-line:before { content: "\ec54"; }
.ri-download-cloud-2-fill:before { content: "\ec55"; }
.ri-download-cloud-2-line:before { content: "\ec56"; }
.ri-download-cloud-fill:before { content: "\ec57"; }
.ri-download-cloud-line:before { content: "\ec58"; }
.ri-download-fill:before { content: "\ec59"; }
.ri-download-line:before { content: "\ec5a"; }
.ri-draft-fill:before { content: "\ec5b"; }
.ri-draft-line:before { content: "\ec5c"; }
.ri-drag-drop-fill:before { content: "\ec5d"; }
.ri-drag-drop-line:before { content: "\ec5e"; }
.ri-drag-move-2-fill:before { content: "\ec5f"; }
.ri-drag-move-2-line:before { content: "\ec60"; }
.ri-drag-move-fill:before { content: "\ec61"; }
.ri-drag-move-line:before { content: "\ec62"; }
.ri-dribbble-fill:before { content: "\ec63"; }
.ri-dribbble-line:before { content: "\ec64"; }
.ri-drive-fill:before { content: "\ec65"; }
.ri-drive-line:before { content: "\ec66"; }
.ri-drizzle-fill:before { content: "\ec67"; }
.ri-drizzle-line:before { content: "\ec68"; }
.ri-drop-fill:before { content: "\ec69"; }
.ri-drop-line:before { content: "\ec6a"; }
.ri-dropbox-fill:before { content: "\ec6b"; }
.ri-dropbox-line:before { content: "\ec6c"; }
.ri-dual-sim-1-fill:before { content: "\ec6d"; }
.ri-dual-sim-1-line:before { content: "\ec6e"; }
.ri-dual-sim-2-fill:before { content: "\ec6f"; }
.ri-dual-sim-2-line:before { content: "\ec70"; }
.ri-dv-fill:before { content: "\ec71"; }
.ri-dv-line:before { content: "\ec72"; }
.ri-dvd-fill:before { content: "\ec73"; }
.ri-dvd-line:before { content: "\ec74"; }
.ri-e-bike-2-fill:before { content: "\ec75"; }
.ri-e-bike-2-line:before { content: "\ec76"; }
.ri-e-bike-fill:before { content: "\ec77"; }
.ri-e-bike-line:before { content: "\ec78"; }
.ri-earth-fill:before { content: "\ec79"; }
.ri-earth-line:before { content: "\ec7a"; }
.ri-earthquake-fill:before { content: "\ec7b"; }
.ri-earthquake-line:before { content: "\ec7c"; }
.ri-edge-fill:before { content: "\ec7d"; }
.ri-edge-line:before { content: "\ec7e"; }
.ri-edit-2-fill:before { content: "\ec7f"; }
.ri-edit-2-line:before { content: "\ec80"; }
.ri-edit-box-fill:before { content: "\ec81"; }
.ri-edit-box-line:before { content: "\ec82"; }
.ri-edit-circle-fill:before { content: "\ec83"; }
.ri-edit-circle-line:before { content: "\ec84"; }
.ri-edit-fill:before { content: "\ec85"; }
.ri-edit-line:before { content: "\ec86"; }
.ri-eject-fill:before { content: "\ec87"; }
.ri-eject-line:before { content: "\ec88"; }
.ri-emotion-2-fill:before { content: "\ec89"; }
.ri-emotion-2-line:before { content: "\ec8a"; }
.ri-emotion-fill:before { content: "\ec8b"; }
.ri-emotion-happy-fill:before { content: "\ec8c"; }
.ri-emotion-happy-line:before { content: "\ec8d"; }
.ri-emotion-laugh-fill:before { content: "\ec8e"; }
.ri-emotion-laugh-line:before { content: "\ec8f"; }
.ri-emotion-line:before { content: "\ec90"; }
.ri-emotion-normal-fill:before { content: "\ec91"; }
.ri-emotion-normal-line:before { content: "\ec92"; }
.ri-emotion-sad-fill:before { content: "\ec93"; }
.ri-emotion-sad-line:before { content: "\ec94"; }
.ri-emotion-unhappy-fill:before { content: "\ec95"; }
.ri-emotion-unhappy-line:before { content: "\ec96"; }
.ri-empathize-fill:before { content: "\ec97"; }
.ri-empathize-line:before { content: "\ec98"; }
.ri-emphasis-cn:before { content: "\ec99"; }
.ri-emphasis:before { content: "\ec9a"; }
.ri-english-input:before { content: "\ec9b"; }
.ri-equalizer-fill:before { content: "\ec9c"; }
.ri-equalizer-line:before { content: "\ec9d"; }
.ri-eraser-fill:before { content: "\ec9e"; }
.ri-eraser-line:before { content: "\ec9f"; }
.ri-error-warning-fill:before { content: "\eca0"; }
.ri-error-warning-line:before { content: "\eca1"; }
.ri-evernote-fill:before { content: "\eca2"; }
.ri-evernote-line:before { content: "\eca3"; }
.ri-exchange-box-fill:before { content: "\eca4"; }
.ri-exchange-box-line:before { content: "\eca5"; }
.ri-exchange-cny-fill:before { content: "\eca6"; }
.ri-exchange-cny-line:before { content: "\eca7"; }
.ri-exchange-dollar-fill:before { content: "\eca8"; }
.ri-exchange-dollar-line:before { content: "\eca9"; }
.ri-exchange-fill:before { content: "\ecaa"; }
.ri-exchange-funds-fill:before { content: "\ecab"; }
.ri-exchange-funds-line:before { content: "\ecac"; }
.ri-exchange-line:before { content: "\ecad"; }
.ri-external-link-fill:before { content: "\ecae"; }
.ri-external-link-line:before { content: "\ecaf"; }
.ri-eye-2-fill:before { content: "\ecb0"; }
.ri-eye-2-line:before { content: "\ecb1"; }
.ri-eye-close-fill:before { content: "\ecb2"; }
.ri-eye-close-line:before { content: "\ecb3"; }
.ri-eye-fill:before { content: "\ecb4"; }
.ri-eye-line:before { content: "\ecb5"; }
.ri-eye-off-fill:before { content: "\ecb6"; }
.ri-eye-off-line:before { content: "\ecb7"; }
.ri-facebook-box-fill:before { content: "\ecb8"; }
.ri-facebook-box-line:before { content: "\ecb9"; }
.ri-facebook-circle-fill:before { content: "\ecba"; }
.ri-facebook-circle-line:before { content: "\ecbb"; }
.ri-facebook-fill:before { content: "\ecbc"; }
.ri-facebook-line:before { content: "\ecbd"; }
.ri-fahrenheit-fill:before { content: "\ecbe"; }
.ri-fahrenheit-line:before { content: "\ecbf"; }
.ri-feedback-fill:before { content: "\ecc0"; }
.ri-feedback-line:before { content: "\ecc1"; }
.ri-file-2-fill:before { content: "\ecc2"; }
.ri-file-2-line:before { content: "\ecc3"; }
.ri-file-3-fill:before { content: "\ecc4"; }
.ri-file-3-line:before { content: "\ecc5"; }
.ri-file-4-fill:before { content: "\ecc6"; }
.ri-file-4-line:before { content: "\ecc7"; }
.ri-file-add-fill:before { content: "\ecc8"; }
.ri-file-add-line:before { content: "\ecc9"; }
.ri-file-chart-2-fill:before { content: "\ecca"; }
.ri-file-chart-2-line:before { content: "\eccb"; }
.ri-file-chart-fill:before { content: "\eccc"; }
.ri-file-chart-line:before { content: "\eccd"; }
.ri-file-cloud-fill:before { content: "\ecce"; }
.ri-file-cloud-line:before { content: "\eccf"; }
.ri-file-code-fill:before { content: "\ecd0"; }
.ri-file-code-line:before { content: "\ecd1"; }
.ri-file-copy-2-fill:before { content: "\ecd2"; }
.ri-file-copy-2-line:before { content: "\ecd3"; }
.ri-file-copy-fill:before { content: "\ecd4"; }
.ri-file-copy-line:before { content: "\ecd5"; }
.ri-file-damage-fill:before { content: "\ecd6"; }
.ri-file-damage-line:before { content: "\ecd7"; }
.ri-file-download-fill:before { content: "\ecd8"; }
.ri-file-download-line:before { content: "\ecd9"; }
.ri-file-edit-fill:before { content: "\ecda"; }
.ri-file-edit-line:before { content: "\ecdb"; }
.ri-file-excel-2-fill:before { content: "\ecdc"; }
.ri-file-excel-2-line:before { content: "\ecdd"; }
.ri-file-excel-fill:before { content: "\ecde"; }
.ri-file-excel-line:before { content: "\ecdf"; }
.ri-file-fill:before { content: "\ece0"; }
.ri-file-forbid-fill:before { content: "\ece1"; }
.ri-file-forbid-line:before { content: "\ece2"; }
.ri-file-gif-fill:before { content: "\ece3"; }
.ri-file-gif-line:before { content: "\ece4"; }
.ri-file-history-fill:before { content: "\ece5"; }
.ri-file-history-line:before { content: "\ece6"; }
.ri-file-hwp-fill:before { content: "\ece7"; }
.ri-file-hwp-line:before { content: "\ece8"; }
.ri-file-info-fill:before { content: "\ece9"; }
.ri-file-info-line:before { content: "\ecea"; }
.ri-file-line:before { content: "\eceb"; }
.ri-file-list-2-fill:before { content: "\ecec"; }
.ri-file-list-2-line:before { content: "\eced"; }
.ri-file-list-3-fill:before { content: "\ecee"; }
.ri-file-list-3-line:before { content: "\ecef"; }
.ri-file-list-fill:before { content: "\ecf0"; }
.ri-file-list-line:before { content: "\ecf1"; }
.ri-file-lock-fill:before { content: "\ecf2"; }
.ri-file-lock-line:before { content: "\ecf3"; }
.ri-file-mark-fill:before { content: "\ecf4"; }
.ri-file-mark-line:before { content: "\ecf5"; }
.ri-file-music-fill:before { content: "\ecf6"; }
.ri-file-music-line:before { content: "\ecf7"; }
.ri-file-paper-2-fill:before { content: "\ecf8"; }
.ri-file-paper-2-line:before { content: "\ecf9"; }
.ri-file-paper-fill:before { content: "\ecfa"; }
.ri-file-paper-line:before { content: "\ecfb"; }
.ri-file-pdf-fill:before { content: "\ecfc"; }
.ri-file-pdf-line:before { content: "\ecfd"; }
.ri-file-ppt-2-fill:before { content: "\ecfe"; }
.ri-file-ppt-2-line:before { content: "\ecff"; }
.ri-file-ppt-fill:before { content: "\ed00"; }
.ri-file-ppt-line:before { content: "\ed01"; }
.ri-file-reduce-fill:before { content: "\ed02"; }
.ri-file-reduce-line:before { content: "\ed03"; }
.ri-file-search-fill:before { content: "\ed04"; }
.ri-file-search-line:before { content: "\ed05"; }
.ri-file-settings-fill:before { content: "\ed06"; }
.ri-file-settings-line:before { content: "\ed07"; }
.ri-file-shield-2-fill:before { content: "\ed08"; }
.ri-file-shield-2-line:before { content: "\ed09"; }
.ri-file-shield-fill:before { content: "\ed0a"; }
.ri-file-shield-line:before { content: "\ed0b"; }
.ri-file-shred-fill:before { content: "\ed0c"; }
.ri-file-shred-line:before { content: "\ed0d"; }
.ri-file-text-fill:before { content: "\ed0e"; }
.ri-file-text-line:before { content: "\ed0f"; }
.ri-file-transfer-fill:before { content: "\ed10"; }
.ri-file-transfer-line:before { content: "\ed11"; }
.ri-file-unknow-fill:before { content: "\ed12"; }
.ri-file-unknow-line:before { content: "\ed13"; }
.ri-file-upload-fill:before { content: "\ed14"; }
.ri-file-upload-line:before { content: "\ed15"; }
.ri-file-user-fill:before { content: "\ed16"; }
.ri-file-user-line:before { content: "\ed17"; }
.ri-file-warning-fill:before { content: "\ed18"; }
.ri-file-warning-line:before { content: "\ed19"; }
.ri-file-word-2-fill:before { content: "\ed1a"; }
.ri-file-word-2-line:before { content: "\ed1b"; }
.ri-file-word-fill:before { content: "\ed1c"; }
.ri-file-word-line:before { content: "\ed1d"; }
.ri-file-zip-fill:before { content: "\ed1e"; }
.ri-file-zip-line:before { content: "\ed1f"; }
.ri-film-fill:before { content: "\ed20"; }
.ri-film-line:before { content: "\ed21"; }
.ri-filter-2-fill:before { content: "\ed22"; }
.ri-filter-2-line:before { content: "\ed23"; }
.ri-filter-3-fill:before { content: "\ed24"; }
.ri-filter-3-line:before { content: "\ed25"; }
.ri-filter-fill:before { content: "\ed26"; }
.ri-filter-line:before { content: "\ed27"; }
.ri-filter-off-fill:before { content: "\ed28"; }
.ri-filter-off-line:before { content: "\ed29"; }
.ri-find-replace-fill:before { content: "\ed2a"; }
.ri-find-replace-line:before { content: "\ed2b"; }
.ri-finder-fill:before { content: "\ed2c"; }
.ri-finder-line:before { content: "\ed2d"; }
.ri-fingerprint-2-fill:before { content: "\ed2e"; }
.ri-fingerprint-2-line:before { content: "\ed2f"; }
.ri-fingerprint-fill:before { content: "\ed30"; }
.ri-fingerprint-line:before { content: "\ed31"; }
.ri-fire-fill:before { content: "\ed32"; }
.ri-fire-line:before { content: "\ed33"; }
.ri-firefox-fill:before { content: "\ed34"; }
.ri-firefox-line:before { content: "\ed35"; }
.ri-first-aid-kit-fill:before { content: "\ed36"; }
.ri-first-aid-kit-line:before { content: "\ed37"; }
.ri-flag-2-fill:before { content: "\ed38"; }
.ri-flag-2-line:before { content: "\ed39"; }
.ri-flag-fill:before { content: "\ed3a"; }
.ri-flag-line:before { content: "\ed3b"; }
.ri-flashlight-fill:before { content: "\ed3c"; }
.ri-flashlight-line:before { content: "\ed3d"; }
.ri-flask-fill:before { content: "\ed3e"; }
.ri-flask-line:before { content: "\ed3f"; }
.ri-flight-land-fill:before { content: "\ed40"; }
.ri-flight-land-line:before { content: "\ed41"; }
.ri-flight-takeoff-fill:before { content: "\ed42"; }
.ri-flight-takeoff-line:before { content: "\ed43"; }
.ri-flood-fill:before { content: "\ed44"; }
.ri-flood-line:before { content: "\ed45"; }
.ri-flow-chart:before { content: "\ed46"; }
.ri-flutter-fill:before { content: "\ed47"; }
.ri-flutter-line:before { content: "\ed48"; }
.ri-focus-2-fill:before { content: "\ed49"; }
.ri-focus-2-line:before { content: "\ed4a"; }
.ri-focus-3-fill:before { content: "\ed4b"; }
.ri-focus-3-line:before { content: "\ed4c"; }
.ri-focus-fill:before { content: "\ed4d"; }
.ri-focus-line:before { content: "\ed4e"; }
.ri-foggy-fill:before { content: "\ed4f"; }
.ri-foggy-line:before { content: "\ed50"; }
.ri-folder-2-fill:before { content: "\ed51"; }
.ri-folder-2-line:before { content: "\ed52"; }
.ri-folder-3-fill:before { content: "\ed53"; }
.ri-folder-3-line:before { content: "\ed54"; }
.ri-folder-4-fill:before { content: "\ed55"; }
.ri-folder-4-line:before { content: "\ed56"; }
.ri-folder-5-fill:before { content: "\ed57"; }
.ri-folder-5-line:before { content: "\ed58"; }
.ri-folder-add-fill:before { content: "\ed59"; }
.ri-folder-add-line:before { content: "\ed5a"; }
.ri-folder-chart-2-fill:before { content: "\ed5b"; }
.ri-folder-chart-2-line:before { content: "\ed5c"; }
.ri-folder-chart-fill:before { content: "\ed5d"; }
.ri-folder-chart-line:before { content: "\ed5e"; }
.ri-folder-download-fill:before { content: "\ed5f"; }
.ri-folder-download-line:before { content: "\ed60"; }
.ri-folder-fill:before { content: "\ed61"; }
.ri-folder-forbid-fill:before { content: "\ed62"; }
.ri-folder-forbid-line:before { content: "\ed63"; }
.ri-folder-history-fill:before { content: "\ed64"; }
.ri-folder-history-line:before { content: "\ed65"; }
.ri-folder-info-fill:before { content: "\ed66"; }
.ri-folder-info-line:before { content: "\ed67"; }
.ri-folder-keyhole-fill:before { content: "\ed68"; }
.ri-folder-keyhole-line:before { content: "\ed69"; }
.ri-folder-line:before { content: "\ed6a"; }
.ri-folder-lock-fill:before { content: "\ed6b"; }
.ri-folder-lock-line:before { content: "\ed6c"; }
.ri-folder-music-fill:before { content: "\ed6d"; }
.ri-folder-music-line:before { content: "\ed6e"; }
.ri-folder-open-fill:before { content: "\ed6f"; }
.ri-folder-open-line:before { content: "\ed70"; }
.ri-folder-received-fill:before { content: "\ed71"; }
.ri-folder-received-line:before { content: "\ed72"; }
.ri-folder-reduce-fill:before { content: "\ed73"; }
.ri-folder-reduce-line:before { content: "\ed74"; }
.ri-folder-settings-fill:before { content: "\ed75"; }
.ri-folder-settings-line:before { content: "\ed76"; }
.ri-folder-shared-fill:before { content: "\ed77"; }
.ri-folder-shared-line:before { content: "\ed78"; }
.ri-folder-shield-2-fill:before { content: "\ed79"; }
.ri-folder-shield-2-line:before { content: "\ed7a"; }
.ri-folder-shield-fill:before { content: "\ed7b"; }
.ri-folder-shield-line:before { content: "\ed7c"; }
.ri-folder-transfer-fill:before { content: "\ed7d"; }
.ri-folder-transfer-line:before { content: "\ed7e"; }
.ri-folder-unknow-fill:before { content: "\ed7f"; }
.ri-folder-unknow-line:before { content: "\ed80"; }
.ri-folder-upload-fill:before { content: "\ed81"; }
.ri-folder-upload-line:before { content: "\ed82"; }
.ri-folder-user-fill:before { content: "\ed83"; }
.ri-folder-user-line:before { content: "\ed84"; }
.ri-folder-warning-fill:before { content: "\ed85"; }
.ri-folder-warning-line:before { content: "\ed86"; }
.ri-folder-zip-fill:before { content: "\ed87"; }
.ri-folder-zip-line:before { content: "\ed88"; }
.ri-folders-fill:before { content: "\ed89"; }
.ri-folders-line:before { content: "\ed8a"; }
.ri-font-color:before { content: "\ed8b"; }
.ri-font-size-2:before { content: "\ed8c"; }
.ri-font-size:before { content: "\ed8d"; }
.ri-football-fill:before { content: "\ed8e"; }
.ri-football-line:before { content: "\ed8f"; }
.ri-footprint-fill:before { content: "\ed90"; }
.ri-footprint-line:before { content: "\ed91"; }
.ri-forbid-2-fill:before { content: "\ed92"; }
.ri-forbid-2-line:before { content: "\ed93"; }
.ri-forbid-fill:before { content: "\ed94"; }
.ri-forbid-line:before { content: "\ed95"; }
.ri-format-clear:before { content: "\ed96"; }
.ri-fridge-fill:before { content: "\ed97"; }
.ri-fridge-line:before { content: "\ed98"; }
.ri-fullscreen-exit-fill:before { content: "\ed99"; }
.ri-fullscreen-exit-line:before { content: "\ed9a"; }
.ri-fullscreen-fill:before { content: "\ed9b"; }
.ri-fullscreen-line:before { content: "\ed9c"; }
.ri-function-fill:before { content: "\ed9d"; }
.ri-function-line:before { content: "\ed9e"; }
.ri-functions:before { content: "\ed9f"; }
.ri-funds-box-fill:before { content: "\eda0"; }
.ri-funds-box-line:before { content: "\eda1"; }
.ri-funds-fill:before { content: "\eda2"; }
.ri-funds-line:before { content: "\eda3"; }
.ri-gallery-fill:before { content: "\eda4"; }
.ri-gallery-line:before { content: "\eda5"; }
.ri-gallery-upload-fill:before { content: "\eda6"; }
.ri-gallery-upload-line:before { content: "\eda7"; }
.ri-game-fill:before { content: "\eda8"; }
.ri-game-line:before { content: "\eda9"; }
.ri-gamepad-fill:before { content: "\edaa"; }
.ri-gamepad-line:before { content: "\edab"; }
.ri-gas-station-fill:before { content: "\edac"; }
.ri-gas-station-line:before { content: "\edad"; }
.ri-gatsby-fill:before { content: "\edae"; }
.ri-gatsby-line:before { content: "\edaf"; }
.ri-genderless-fill:before { content: "\edb0"; }
.ri-genderless-line:before { content: "\edb1"; }
.ri-ghost-2-fill:before { content: "\edb2"; }
.ri-ghost-2-line:before { content: "\edb3"; }
.ri-ghost-fill:before { content: "\edb4"; }
.ri-ghost-line:before { content: "\edb5"; }
.ri-ghost-smile-fill:before { content: "\edb6"; }
.ri-ghost-smile-line:before { content: "\edb7"; }
.ri-gift-2-fill:before { content: "\edb8"; }
.ri-gift-2-line:before { content: "\edb9"; }
.ri-gift-fill:before { content: "\edba"; }
.ri-gift-line:before { content: "\edbb"; }
.ri-git-branch-fill:before { content: "\edbc"; }
.ri-git-branch-line:before { content: "\edbd"; }
.ri-git-commit-fill:before { content: "\edbe"; }
.ri-git-commit-line:before { content: "\edbf"; }
.ri-git-merge-fill:before { content: "\edc0"; }
.ri-git-merge-line:before { content: "\edc1"; }
.ri-git-pull-request-fill:before { content: "\edc2"; }
.ri-git-pull-request-line:before { content: "\edc3"; }
.ri-git-repository-commits-fill:before { content: "\edc4"; }
.ri-git-repository-commits-line:before { content: "\edc5"; }
.ri-git-repository-fill:before { content: "\edc6"; }
.ri-git-repository-line:before { content: "\edc7"; }
.ri-git-repository-private-fill:before { content: "\edc8"; }
.ri-git-repository-private-line:before { content: "\edc9"; }
.ri-github-fill:before { content: "\edca"; }
.ri-github-line:before { content: "\edcb"; }
.ri-gitlab-fill:before { content: "\edcc"; }
.ri-gitlab-line:before { content: "\edcd"; }
.ri-global-fill:before { content: "\edce"; }
.ri-global-line:before { content: "\edcf"; }
.ri-globe-fill:before { content: "\edd0"; }
.ri-globe-line:before { content: "\edd1"; }
.ri-goblet-fill:before { content: "\edd2"; }
.ri-goblet-line:before { content: "\edd3"; }
.ri-google-fill:before { content: "\edd4"; }
.ri-google-line:before { content: "\edd5"; }
.ri-google-play-fill:before { content: "\edd6"; }
.ri-google-play-line:before { content: "\edd7"; }
.ri-government-fill:before { content: "\edd8"; }
.ri-government-line:before { content: "\edd9"; }
.ri-gps-fill:before { content: "\edda"; }
.ri-gps-line:before { content: "\eddb"; }
.ri-gradienter-fill:before { content: "\eddc"; }
.ri-gradienter-line:before { content: "\eddd"; }
.ri-grid-fill:before { content: "\edde"; }
.ri-grid-line:before { content: "\eddf"; }
.ri-group-2-fill:before { content: "\ede0"; }
.ri-group-2-line:before { content: "\ede1"; }
.ri-group-fill:before { content: "\ede2"; }
.ri-group-line:before { content: "\ede3"; }
.ri-guide-fill:before { content: "\ede4"; }
.ri-guide-line:before { content: "\ede5"; }
.ri-h-1:before { content: "\ede6"; }
.ri-h-2:before { content: "\ede7"; }
.ri-h-3:before { content: "\ede8"; }
.ri-h-4:before { content: "\ede9"; }
.ri-h-5:before { content: "\edea"; }
.ri-h-6:before { content: "\edeb"; }
.ri-hail-fill:before { content: "\edec"; }
.ri-hail-line:before { content: "\eded"; }
.ri-hammer-fill:before { content: "\edee"; }
.ri-hammer-line:before { content: "\edef"; }
.ri-hand-coin-fill:before { content: "\edf0"; }
.ri-hand-coin-line:before { content: "\edf1"; }
.ri-hand-heart-fill:before { content: "\edf2"; }
.ri-hand-heart-line:before { content: "\edf3"; }
.ri-hand-sanitizer-fill:before { content: "\edf4"; }
.ri-hand-sanitizer-line:before { content: "\edf5"; }
.ri-handbag-fill:before { content: "\edf6"; }
.ri-handbag-line:before { content: "\edf7"; }
.ri-hard-drive-2-fill:before { content: "\edf8"; }
.ri-hard-drive-2-line:before { content: "\edf9"; }
.ri-hard-drive-fill:before { content: "\edfa"; }
.ri-hard-drive-line:before { content: "\edfb"; }
.ri-hashtag:before { content: "\edfc"; }
.ri-haze-2-fill:before { content: "\edfd"; }
.ri-haze-2-line:before { content: "\edfe"; }
.ri-haze-fill:before { content: "\edff"; }
.ri-haze-line:before { content: "\ee00"; }
.ri-hd-fill:before { content: "\ee01"; }
.ri-hd-line:before { content: "\ee02"; }
.ri-heading:before { content: "\ee03"; }
.ri-headphone-fill:before { content: "\ee04"; }
.ri-headphone-line:before { content: "\ee05"; }
.ri-health-book-fill:before { content: "\ee06"; }
.ri-health-book-line:before { content: "\ee07"; }
.ri-heart-2-fill:before { content: "\ee08"; }
.ri-heart-2-line:before { content: "\ee09"; }
.ri-heart-3-fill:before { content: "\ee0a"; }
.ri-heart-3-line:before { content: "\ee0b"; }
.ri-heart-add-fill:before { content: "\ee0c"; }
.ri-heart-add-line:before { content: "\ee0d"; }
.ri-heart-fill:before { content: "\ee0e"; }
.ri-heart-line:before { content: "\ee0f"; }
.ri-heart-pulse-fill:before { content: "\ee10"; }
.ri-heart-pulse-line:before { content: "\ee11"; }
.ri-hearts-fill:before { content: "\ee12"; }
.ri-hearts-line:before { content: "\ee13"; }
.ri-heavy-showers-fill:before { content: "\ee14"; }
.ri-heavy-showers-line:before { content: "\ee15"; }
.ri-history-fill:before { content: "\ee16"; }
.ri-history-line:before { content: "\ee17"; }
.ri-home-2-fill:before { content: "\ee18"; }
.ri-home-2-line:before { content: "\ee19"; }
.ri-home-3-fill:before { content: "\ee1a"; }
.ri-home-3-line:before { content: "\ee1b"; }
.ri-home-4-fill:before { content: "\ee1c"; }
.ri-home-4-line:before { content: "\ee1d"; }
.ri-home-5-fill:before { content: "\ee1e"; }
.ri-home-5-line:before { content: "\ee1f"; }
.ri-home-6-fill:before { content: "\ee20"; }
.ri-home-6-line:before { content: "\ee21"; }
.ri-home-7-fill:before { content: "\ee22"; }
.ri-home-7-line:before { content: "\ee23"; }
.ri-home-8-fill:before { content: "\ee24"; }
.ri-home-8-line:before { content: "\ee25"; }
.ri-home-fill:before { content: "\ee26"; }
.ri-home-gear-fill:before { content: "\ee27"; }
.ri-home-gear-line:before { content: "\ee28"; }
.ri-home-heart-fill:before { content: "\ee29"; }
.ri-home-heart-line:before { content: "\ee2a"; }
.ri-home-line:before { content: "\ee2b"; }
.ri-home-smile-2-fill:before { content: "\ee2c"; }
.ri-home-smile-2-line:before { content: "\ee2d"; }
.ri-home-smile-fill:before { content: "\ee2e"; }
.ri-home-smile-line:before { content: "\ee2f"; }
.ri-home-wifi-fill:before { content: "\ee30"; }
.ri-home-wifi-line:before { content: "\ee31"; }
.ri-honor-of-kings-fill:before { content: "\ee32"; }
.ri-honor-of-kings-line:before { content: "\ee33"; }
.ri-honour-fill:before { content: "\ee34"; }
.ri-honour-line:before { content: "\ee35"; }
.ri-hospital-fill:before { content: "\ee36"; }
.ri-hospital-line:before { content: "\ee37"; }
.ri-hotel-bed-fill:before { content: "\ee38"; }
.ri-hotel-bed-line:before { content: "\ee39"; }
.ri-hotel-fill:before { content: "\ee3a"; }
.ri-hotel-line:before { content: "\ee3b"; }
.ri-hotspot-fill:before { content: "\ee3c"; }
.ri-hotspot-line:before { content: "\ee3d"; }
.ri-hq-fill:before { content: "\ee3e"; }
.ri-hq-line:before { content: "\ee3f"; }
.ri-html5-fill:before { content: "\ee40"; }
.ri-html5-line:before { content: "\ee41"; }
.ri-ie-fill:before { content: "\ee42"; }
.ri-ie-line:before { content: "\ee43"; }
.ri-image-2-fill:before { content: "\ee44"; }
.ri-image-2-line:before { content: "\ee45"; }
.ri-image-add-fill:before { content: "\ee46"; }
.ri-image-add-line:before { content: "\ee47"; }
.ri-image-edit-fill:before { content: "\ee48"; }
.ri-image-edit-line:before { content: "\ee49"; }
.ri-image-fill:before { content: "\ee4a"; }
.ri-image-line:before { content: "\ee4b"; }
.ri-inbox-archive-fill:before { content: "\ee4c"; }
.ri-inbox-archive-line:before { content: "\ee4d"; }
.ri-inbox-fill:before { content: "\ee4e"; }
.ri-inbox-line:before { content: "\ee4f"; }
.ri-inbox-unarchive-fill:before { content: "\ee50"; }
.ri-inbox-unarchive-line:before { content: "\ee51"; }
.ri-increase-decrease-fill:before { content: "\ee52"; }
.ri-increase-decrease-line:before { content: "\ee53"; }
.ri-indent-decrease:before { content: "\ee54"; }
.ri-indent-increase:before { content: "\ee55"; }
.ri-indeterminate-circle-fill:before { content: "\ee56"; }
.ri-indeterminate-circle-line:before { content: "\ee57"; }
.ri-information-fill:before { content: "\ee58"; }
.ri-information-line:before { content: "\ee59"; }
.ri-infrared-thermometer-fill:before { content: "\ee5a"; }
.ri-infrared-thermometer-line:before { content: "\ee5b"; }
.ri-ink-bottle-fill:before { content: "\ee5c"; }
.ri-ink-bottle-line:before { content: "\ee5d"; }
.ri-input-cursor-move:before { content: "\ee5e"; }
.ri-input-method-fill:before { content: "\ee5f"; }
.ri-input-method-line:before { content: "\ee60"; }
.ri-insert-column-left:before { content: "\ee61"; }
.ri-insert-column-right:before { content: "\ee62"; }
.ri-insert-row-bottom:before { content: "\ee63"; }
.ri-insert-row-top:before { content: "\ee64"; }
.ri-instagram-fill:before { content: "\ee65"; }
.ri-instagram-line:before { content: "\ee66"; }
.ri-install-fill:before { content: "\ee67"; }
.ri-install-line:before { content: "\ee68"; }
.ri-invision-fill:before { content: "\ee69"; }
.ri-invision-line:before { content: "\ee6a"; }
.ri-italic:before { content: "\ee6b"; }
.ri-kakao-talk-fill:before { content: "\ee6c"; }
.ri-kakao-talk-line:before { content: "\ee6d"; }
.ri-key-2-fill:before { content: "\ee6e"; }
.ri-key-2-line:before { content: "\ee6f"; }
.ri-key-fill:before { content: "\ee70"; }
.ri-key-line:before { content: "\ee71"; }
.ri-keyboard-box-fill:before { content: "\ee72"; }
.ri-keyboard-box-line:before { content: "\ee73"; }
.ri-keyboard-fill:before { content: "\ee74"; }
.ri-keyboard-line:before { content: "\ee75"; }
.ri-keynote-fill:before { content: "\ee76"; }
.ri-keynote-line:before { content: "\ee77"; }
.ri-knife-blood-fill:before { content: "\ee78"; }
.ri-knife-blood-line:before { content: "\ee79"; }
.ri-knife-fill:before { content: "\ee7a"; }
.ri-knife-line:before { content: "\ee7b"; }
.ri-landscape-fill:before { content: "\ee7c"; }
.ri-landscape-line:before { content: "\ee7d"; }
.ri-layout-2-fill:before { content: "\ee7e"; }
.ri-layout-2-line:before { content: "\ee7f"; }
.ri-layout-3-fill:before { content: "\ee80"; }
.ri-layout-3-line:before { content: "\ee81"; }
.ri-layout-4-fill:before { content: "\ee82"; }
.ri-layout-4-line:before { content: "\ee83"; }
.ri-layout-5-fill:before { content: "\ee84"; }
.ri-layout-5-line:before { content: "\ee85"; }
.ri-layout-6-fill:before { content: "\ee86"; }
.ri-layout-6-line:before { content: "\ee87"; }
.ri-layout-bottom-2-fill:before { content: "\ee88"; }
.ri-layout-bottom-2-line:before { content: "\ee89"; }
.ri-layout-bottom-fill:before { content: "\ee8a"; }
.ri-layout-bottom-line:before { content: "\ee8b"; }
.ri-layout-column-fill:before { content: "\ee8c"; }
.ri-layout-column-line:before { content: "\ee8d"; }
.ri-layout-fill:before { content: "\ee8e"; }
.ri-layout-grid-fill:before { content: "\ee8f"; }
.ri-layout-grid-line:before { content: "\ee90"; }
.ri-layout-left-2-fill:before { content: "\ee91"; }
.ri-layout-left-2-line:before { content: "\ee92"; }
.ri-layout-left-fill:before { content: "\ee93"; }
.ri-layout-left-line:before { content: "\ee94"; }
.ri-layout-line:before { content: "\ee95"; }
.ri-layout-masonry-fill:before { content: "\ee96"; }
.ri-layout-masonry-line:before { content: "\ee97"; }
.ri-layout-right-2-fill:before { content: "\ee98"; }
.ri-layout-right-2-line:before { content: "\ee99"; }
.ri-layout-right-fill:before { content: "\ee9a"; }
.ri-layout-right-line:before { content: "\ee9b"; }
.ri-layout-row-fill:before { content: "\ee9c"; }
.ri-layout-row-line:before { content: "\ee9d"; }
.ri-layout-top-2-fill:before { content: "\ee9e"; }
.ri-layout-top-2-line:before { content: "\ee9f"; }
.ri-layout-top-fill:before { content: "\eea0"; }
.ri-layout-top-line:before { content: "\eea1"; }
.ri-leaf-fill:before { content: "\eea2"; }
.ri-leaf-line:before { content: "\eea3"; }
.ri-lifebuoy-fill:before { content: "\eea4"; }
.ri-lifebuoy-line:before { content: "\eea5"; }
.ri-lightbulb-fill:before { content: "\eea6"; }
.ri-lightbulb-flash-fill:before { content: "\eea7"; }
.ri-lightbulb-flash-line:before { content: "\eea8"; }
.ri-lightbulb-line:before { content: "\eea9"; }
.ri-line-chart-fill:before { content: "\eeaa"; }
.ri-line-chart-line:before { content: "\eeab"; }
.ri-line-fill:before { content: "\eeac"; }
.ri-line-height:before { content: "\eead"; }
.ri-line-line:before { content: "\eeae"; }
.ri-link-m:before { content: "\eeaf"; }
.ri-link-unlink-m:before { content: "\eeb0"; }
.ri-link-unlink:before { content: "\eeb1"; }
.ri-link:before { content: "\eeb2"; }
.ri-linkedin-box-fill:before { content: "\eeb3"; }
.ri-linkedin-box-line:before { content: "\eeb4"; }
.ri-linkedin-fill:before { content: "\eeb5"; }
.ri-linkedin-line:before { content: "\eeb6"; }
.ri-links-fill:before { content: "\eeb7"; }
.ri-links-line:before { content: "\eeb8"; }
.ri-list-check-2:before { content: "\eeb9"; }
.ri-list-check:before { content: "\eeba"; }
.ri-list-ordered:before { content: "\eebb"; }
.ri-list-settings-fill:before { content: "\eebc"; }
.ri-list-settings-line:before { content: "\eebd"; }
.ri-list-unordered:before { content: "\eebe"; }
.ri-live-fill:before { content: "\eebf"; }
.ri-live-line:before { content: "\eec0"; }
.ri-loader-2-fill:before { content: "\eec1"; }
.ri-loader-2-line:before { content: "\eec2"; }
.ri-loader-3-fill:before { content: "\eec3"; }
.ri-loader-3-line:before { content: "\eec4"; }
.ri-loader-4-fill:before { content: "\eec5"; }
.ri-loader-4-line:before { content: "\eec6"; }
.ri-loader-5-fill:before { content: "\eec7"; }
.ri-loader-5-line:before { content: "\eec8"; }
.ri-loader-fill:before { content: "\eec9"; }
.ri-loader-line:before { content: "\eeca"; }
.ri-lock-2-fill:before { content: "\eecb"; }
.ri-lock-2-line:before { content: "\eecc"; }
.ri-lock-fill:before { content: "\eecd"; }
.ri-lock-line:before { content: "\eece"; }
.ri-lock-password-fill:before { content: "\eecf"; }
.ri-lock-password-line:before { content: "\eed0"; }
.ri-lock-unlock-fill:before { content: "\eed1"; }
.ri-lock-unlock-line:before { content: "\eed2"; }
.ri-login-box-fill:before { content: "\eed3"; }
.ri-login-box-line:before { content: "\eed4"; }
.ri-login-circle-fill:before { content: "\eed5"; }
.ri-login-circle-line:before { content: "\eed6"; }
.ri-logout-box-fill:before { content: "\eed7"; }
.ri-logout-box-line:before { content: "\eed8"; }
.ri-logout-box-r-fill:before { content: "\eed9"; }
.ri-logout-box-r-line:before { content: "\eeda"; }
.ri-logout-circle-fill:before { content: "\eedb"; }
.ri-logout-circle-line:before { content: "\eedc"; }
.ri-logout-circle-r-fill:before { content: "\eedd"; }
.ri-logout-circle-r-line:before { content: "\eede"; }
.ri-luggage-cart-fill:before { content: "\eedf"; }
.ri-luggage-cart-line:before { content: "\eee0"; }
.ri-luggage-deposit-fill:before { content: "\eee1"; }
.ri-luggage-deposit-line:before { content: "\eee2"; }
.ri-lungs-fill:before { content: "\eee3"; }
.ri-lungs-line:before { content: "\eee4"; }
.ri-mac-fill:before { content: "\eee5"; }
.ri-mac-line:before { content: "\eee6"; }
.ri-macbook-fill:before { content: "\eee7"; }
.ri-macbook-line:before { content: "\eee8"; }
.ri-magic-fill:before { content: "\eee9"; }
.ri-magic-line:before { content: "\eeea"; }
.ri-mail-add-fill:before { content: "\eeeb"; }
.ri-mail-add-line:before { content: "\eeec"; }
.ri-mail-check-fill:before { content: "\eeed"; }
.ri-mail-check-line:before { content: "\eeee"; }
.ri-mail-close-fill:before { content: "\eeef"; }
.ri-mail-close-line:before { content: "\eef0"; }
.ri-mail-download-fill:before { content: "\eef1"; }
.ri-mail-download-line:before { content: "\eef2"; }
.ri-mail-fill:before { content: "\eef3"; }
.ri-mail-forbid-fill:before { content: "\eef4"; }
.ri-mail-forbid-line:before { content: "\eef5"; }
.ri-mail-line:before { content: "\eef6"; }
.ri-mail-lock-fill:before { content: "\eef7"; }
.ri-mail-lock-line:before { content: "\eef8"; }
.ri-mail-open-fill:before { content: "\eef9"; }
.ri-mail-open-line:before { content: "\eefa"; }
.ri-mail-send-fill:before { content: "\eefb"; }
.ri-mail-send-line:before { content: "\eefc"; }
.ri-mail-settings-fill:before { content: "\eefd"; }
.ri-mail-settings-line:before { content: "\eefe"; }
.ri-mail-star-fill:before { content: "\eeff"; }
.ri-mail-star-line:before { content: "\ef00"; }
.ri-mail-unread-fill:before { content: "\ef01"; }
.ri-mail-unread-line:before { content: "\ef02"; }
.ri-mail-volume-fill:before { content: "\ef03"; }
.ri-mail-volume-line:before { content: "\ef04"; }
.ri-map-2-fill:before { content: "\ef05"; }
.ri-map-2-line:before { content: "\ef06"; }
.ri-map-fill:before { content: "\ef07"; }
.ri-map-line:before { content: "\ef08"; }
.ri-map-pin-2-fill:before { content: "\ef09"; }
.ri-map-pin-2-line:before { content: "\ef0a"; }
.ri-map-pin-3-fill:before { content: "\ef0b"; }
.ri-map-pin-3-line:before { content: "\ef0c"; }
.ri-map-pin-4-fill:before { content: "\ef0d"; }
.ri-map-pin-4-line:before { content: "\ef0e"; }
.ri-map-pin-5-fill:before { content: "\ef0f"; }
.ri-map-pin-5-line:before { content: "\ef10"; }
.ri-map-pin-add-fill:before { content: "\ef11"; }
.ri-map-pin-add-line:before { content: "\ef12"; }
.ri-map-pin-fill:before { content: "\ef13"; }
.ri-map-pin-line:before { content: "\ef14"; }
.ri-map-pin-range-fill:before { content: "\ef15"; }
.ri-map-pin-range-line:before { content: "\ef16"; }
.ri-map-pin-time-fill:before { content: "\ef17"; }
.ri-map-pin-time-line:before { content: "\ef18"; }
.ri-map-pin-user-fill:before { content: "\ef19"; }
.ri-map-pin-user-line:before { content: "\ef1a"; }
.ri-mark-pen-fill:before { content: "\ef1b"; }
.ri-mark-pen-line:before { content: "\ef1c"; }
.ri-markdown-fill:before { content: "\ef1d"; }
.ri-markdown-line:before { content: "\ef1e"; }
.ri-markup-fill:before { content: "\ef1f"; }
.ri-markup-line:before { content: "\ef20"; }
.ri-mastercard-fill:before { content: "\ef21"; }
.ri-mastercard-line:before { content: "\ef22"; }
.ri-mastodon-fill:before { content: "\ef23"; }
.ri-mastodon-line:before { content: "\ef24"; }
.ri-medal-2-fill:before { content: "\ef25"; }
.ri-medal-2-line:before { content: "\ef26"; }
.ri-medal-fill:before { content: "\ef27"; }
.ri-medal-line:before { content: "\ef28"; }
.ri-medicine-bottle-fill:before { content: "\ef29"; }
.ri-medicine-bottle-line:before { content: "\ef2a"; }
.ri-medium-fill:before { content: "\ef2b"; }
.ri-medium-line:before { content: "\ef2c"; }
.ri-men-fill:before { content: "\ef2d"; }
.ri-men-line:before { content: "\ef2e"; }
.ri-mental-health-fill:before { content: "\ef2f"; }
.ri-mental-health-line:before { content: "\ef30"; }
.ri-menu-2-fill:before { content: "\ef31"; }
.ri-menu-2-line:before { content: "\ef32"; }
.ri-menu-3-fill:before { content: "\ef33"; }
.ri-menu-3-line:before { content: "\ef34"; }
.ri-menu-4-fill:before { content: "\ef35"; }
.ri-menu-4-line:before { content: "\ef36"; }
.ri-menu-5-fill:before { content: "\ef37"; }
.ri-menu-5-line:before { content: "\ef38"; }
.ri-menu-add-fill:before { content: "\ef39"; }
.ri-menu-add-line:before { content: "\ef3a"; }
.ri-menu-fill:before { content: "\ef3b"; }
.ri-menu-fold-fill:before { content: "\ef3c"; }
.ri-menu-fold-line:before { content: "\ef3d"; }
.ri-menu-line:before { content: "\ef3e"; }
.ri-menu-unfold-fill:before { content: "\ef3f"; }
.ri-menu-unfold-line:before { content: "\ef40"; }
.ri-merge-cells-horizontal:before { content: "\ef41"; }
.ri-merge-cells-vertical:before { content: "\ef42"; }
.ri-message-2-fill:before { content: "\ef43"; }
.ri-message-2-line:before { content: "\ef44"; }
.ri-message-3-fill:before { content: "\ef45"; }
.ri-message-3-line:before { content: "\ef46"; }
.ri-message-fill:before { content: "\ef47"; }
.ri-message-line:before { content: "\ef48"; }
.ri-messenger-fill:before { content: "\ef49"; }
.ri-messenger-line:before { content: "\ef4a"; }
.ri-meteor-fill:before { content: "\ef4b"; }
.ri-meteor-line:before { content: "\ef4c"; }
.ri-mic-2-fill:before { content: "\ef4d"; }
.ri-mic-2-line:before { content: "\ef4e"; }
.ri-mic-fill:before { content: "\ef4f"; }
.ri-mic-line:before { content: "\ef50"; }
.ri-mic-off-fill:before { content: "\ef51"; }
.ri-mic-off-line:before { content: "\ef52"; }
.ri-mickey-fill:before { content: "\ef53"; }
.ri-mickey-line:before { content: "\ef54"; }
.ri-microscope-fill:before { content: "\ef55"; }
.ri-microscope-line:before { content: "\ef56"; }
.ri-microsoft-fill:before { content: "\ef57"; }
.ri-microsoft-line:before { content: "\ef58"; }
.ri-mind-map:before { content: "\ef59"; }
.ri-mini-program-fill:before { content: "\ef5a"; }
.ri-mini-program-line:before { content: "\ef5b"; }
.ri-mist-fill:before { content: "\ef5c"; }
.ri-mist-line:before { content: "\ef5d"; }
.ri-money-cny-box-fill:before { content: "\ef5e"; }
.ri-money-cny-box-line:before { content: "\ef5f"; }
.ri-money-cny-circle-fill:before { content: "\ef60"; }
.ri-money-cny-circle-line:before { content: "\ef61"; }
.ri-money-dollar-box-fill:before { content: "\ef62"; }
.ri-money-dollar-box-line:before { content: "\ef63"; }
.ri-money-dollar-circle-fill:before { content: "\ef64"; }
.ri-money-dollar-circle-line:before { content: "\ef65"; }
.ri-money-euro-box-fill:before { content: "\ef66"; }
.ri-money-euro-box-line:before { content: "\ef67"; }
.ri-money-euro-circle-fill:before { content: "\ef68"; }
.ri-money-euro-circle-line:before { content: "\ef69"; }
.ri-money-pound-box-fill:before { content: "\ef6a"; }
.ri-money-pound-box-line:before { content: "\ef6b"; }
.ri-money-pound-circle-fill:before { content: "\ef6c"; }
.ri-money-pound-circle-line:before { content: "\ef6d"; }
.ri-moon-clear-fill:before { content: "\ef6e"; }
.ri-moon-clear-line:before { content: "\ef6f"; }
.ri-moon-cloudy-fill:before { content: "\ef70"; }
.ri-moon-cloudy-line:before { content: "\ef71"; }
.ri-moon-fill:before { content: "\ef72"; }
.ri-moon-foggy-fill:before { content: "\ef73"; }
.ri-moon-foggy-line:before { content: "\ef74"; }
.ri-moon-line:before { content: "\ef75"; }
.ri-more-2-fill:before { content: "\ef76"; }
.ri-more-2-line:before { content: "\ef77"; }
.ri-more-fill:before { content: "\ef78"; }
.ri-more-line:before { content: "\ef79"; }
.ri-motorbike-fill:before { content: "\ef7a"; }
.ri-motorbike-line:before { content: "\ef7b"; }
.ri-mouse-fill:before { content: "\ef7c"; }
.ri-mouse-line:before { content: "\ef7d"; }
.ri-movie-2-fill:before { content: "\ef7e"; }
.ri-movie-2-line:before { content: "\ef7f"; }
.ri-movie-fill:before { content: "\ef80"; }
.ri-movie-line:before { content: "\ef81"; }
.ri-music-2-fill:before { content: "\ef82"; }
.ri-music-2-line:before { content: "\ef83"; }
.ri-music-fill:before { content: "\ef84"; }
.ri-music-line:before { content: "\ef85"; }
.ri-mv-fill:before { content: "\ef86"; }
.ri-mv-line:before { content: "\ef87"; }
.ri-navigation-fill:before { content: "\ef88"; }
.ri-navigation-line:before { content: "\ef89"; }
.ri-netease-cloud-music-fill:before { content: "\ef8a"; }
.ri-netease-cloud-music-line:before { content: "\ef8b"; }
.ri-netflix-fill:before { content: "\ef8c"; }
.ri-netflix-line:before { content: "\ef8d"; }
.ri-newspaper-fill:before { content: "\ef8e"; }
.ri-newspaper-line:before { content: "\ef8f"; }
.ri-node-tree:before { content: "\ef90"; }
.ri-notification-2-fill:before { content: "\ef91"; }
.ri-notification-2-line:before { content: "\ef92"; }
.ri-notification-3-fill:before { content: "\ef93"; }
.ri-notification-3-line:before { content: "\ef94"; }
.ri-notification-4-fill:before { content: "\ef95"; }
.ri-notification-4-line:before { content: "\ef96"; }
.ri-notification-badge-fill:before { content: "\ef97"; }
.ri-notification-badge-line:before { content: "\ef98"; }
.ri-notification-fill:before { content: "\ef99"; }
.ri-notification-line:before { content: "\ef9a"; }
.ri-notification-off-fill:before { content: "\ef9b"; }
.ri-notification-off-line:before { content: "\ef9c"; }
.ri-npmjs-fill:before { content: "\ef9d"; }
.ri-npmjs-line:before { content: "\ef9e"; }
.ri-number-0:before { content: "\ef9f"; }
.ri-number-1:before { content: "\efa0"; }
.ri-number-2:before { content: "\efa1"; }
.ri-number-3:before { content: "\efa2"; }
.ri-number-4:before { content: "\efa3"; }
.ri-number-5:before { content: "\efa4"; }
.ri-number-6:before { content: "\efa5"; }
.ri-number-7:before { content: "\efa6"; }
.ri-number-8:before { content: "\efa7"; }
.ri-number-9:before { content: "\efa8"; }
.ri-numbers-fill:before { content: "\efa9"; }
.ri-numbers-line:before { content: "\efaa"; }
.ri-nurse-fill:before { content: "\efab"; }
.ri-nurse-line:before { content: "\efac"; }
.ri-oil-fill:before { content: "\efad"; }
.ri-oil-line:before { content: "\efae"; }
.ri-omega:before { content: "\efaf"; }
.ri-open-arm-fill:before { content: "\efb0"; }
.ri-open-arm-line:before { content: "\efb1"; }
.ri-open-source-fill:before { content: "\efb2"; }
.ri-open-source-line:before { content: "\efb3"; }
.ri-opera-fill:before { content: "\efb4"; }
.ri-opera-line:before { content: "\efb5"; }
.ri-order-play-fill:before { content: "\efb6"; }
.ri-order-play-line:before { content: "\efb7"; }
.ri-organization-chart:before { content: "\efb8"; }
.ri-outlet-2-fill:before { content: "\efb9"; }
.ri-outlet-2-line:before { content: "\efba"; }
.ri-outlet-fill:before { content: "\efbb"; }
.ri-outlet-line:before { content: "\efbc"; }
.ri-page-separator:before { content: "\efbd"; }
.ri-pages-fill:before { content: "\efbe"; }
.ri-pages-line:before { content: "\efbf"; }
.ri-paint-brush-fill:before { content: "\efc0"; }
.ri-paint-brush-line:before { content: "\efc1"; }
.ri-paint-fill:before { content: "\efc2"; }
.ri-paint-line:before { content: "\efc3"; }
.ri-palette-fill:before { content: "\efc4"; }
.ri-palette-line:before { content: "\efc5"; }
.ri-pantone-fill:before { content: "\efc6"; }
.ri-pantone-line:before { content: "\efc7"; }
.ri-paragraph:before { content: "\efc8"; }
.ri-parent-fill:before { content: "\efc9"; }
.ri-parent-line:before { content: "\efca"; }
.ri-parentheses-fill:before { content: "\efcb"; }
.ri-parentheses-line:before { content: "\efcc"; }
.ri-parking-box-fill:before { content: "\efcd"; }
.ri-parking-box-line:before { content: "\efce"; }
.ri-parking-fill:before { content: "\efcf"; }
.ri-parking-line:before { content: "\efd0"; }
.ri-passport-fill:before { content: "\efd1"; }
.ri-passport-line:before { content: "\efd2"; }
.ri-patreon-fill:before { content: "\efd3"; }
.ri-patreon-line:before { content: "\efd4"; }
.ri-pause-circle-fill:before { content: "\efd5"; }
.ri-pause-circle-line:before { content: "\efd6"; }
.ri-pause-fill:before { content: "\efd7"; }
.ri-pause-line:before { content: "\efd8"; }
.ri-pause-mini-fill:before { content: "\efd9"; }
.ri-pause-mini-line:before { content: "\efda"; }
.ri-paypal-fill:before { content: "\efdb"; }
.ri-paypal-line:before { content: "\efdc"; }
.ri-pen-nib-fill:before { content: "\efdd"; }
.ri-pen-nib-line:before { content: "\efde"; }
.ri-pencil-fill:before { content: "\efdf"; }
.ri-pencil-line:before { content: "\efe0"; }
.ri-pencil-ruler-2-fill:before { content: "\efe1"; }
.ri-pencil-ruler-2-line:before { content: "\efe2"; }
.ri-pencil-ruler-fill:before { content: "\efe3"; }
.ri-pencil-ruler-line:before { content: "\efe4"; }
.ri-percent-fill:before { content: "\efe5"; }
.ri-percent-line:before { content: "\efe6"; }
.ri-phone-camera-fill:before { content: "\efe7"; }
.ri-phone-camera-line:before { content: "\efe8"; }
.ri-phone-fill:before { content: "\efe9"; }
.ri-phone-find-fill:before { content: "\efea"; }
.ri-phone-find-line:before { content: "\efeb"; }
.ri-phone-line:before { content: "\efec"; }
.ri-phone-lock-fill:before { content: "\efed"; }
.ri-phone-lock-line:before { content: "\efee"; }
.ri-picture-in-picture-2-fill:before { content: "\efef"; }
.ri-picture-in-picture-2-line:before { content: "\eff0"; }
.ri-picture-in-picture-exit-fill:before { content: "\eff1"; }
.ri-picture-in-picture-exit-line:before { content: "\eff2"; }
.ri-picture-in-picture-fill:before { content: "\eff3"; }
.ri-picture-in-picture-line:before { content: "\eff4"; }
.ri-pie-chart-2-fill:before { content: "\eff5"; }
.ri-pie-chart-2-line:before { content: "\eff6"; }
.ri-pie-chart-box-fill:before { content: "\eff7"; }
.ri-pie-chart-box-line:before { content: "\eff8"; }
.ri-pie-chart-fill:before { content: "\eff9"; }
.ri-pie-chart-line:before { content: "\effa"; }
.ri-pin-distance-fill:before { content: "\effb"; }
.ri-pin-distance-line:before { content: "\effc"; }
.ri-ping-pong-fill:before { content: "\effd"; }
.ri-ping-pong-line:before { content: "\effe"; }
.ri-pinterest-fill:before { content: "\efff"; }
.ri-pinterest-line:before { content: "\f000"; }
.ri-pinyin-input:before { content: "\f001"; }
.ri-pixelfed-fill:before { content: "\f002"; }
.ri-pixelfed-line:before { content: "\f003"; }
.ri-plane-fill:before { content: "\f004"; }
.ri-plane-line:before { content: "\f005"; }
.ri-plant-fill:before { content: "\f006"; }
.ri-plant-line:before { content: "\f007"; }
.ri-play-circle-fill:before { content: "\f008"; }
.ri-play-circle-line:before { content: "\f009"; }
.ri-play-fill:before { content: "\f00a"; }
.ri-play-line:before { content: "\f00b"; }
.ri-play-list-2-fill:before { content: "\f00c"; }
.ri-play-list-2-line:before { content: "\f00d"; }
.ri-play-list-add-fill:before { content: "\f00e"; }
.ri-play-list-add-line:before { content: "\f00f"; }
.ri-play-list-fill:before { content: "\f010"; }
.ri-play-list-line:before { content: "\f011"; }
.ri-play-mini-fill:before { content: "\f012"; }
.ri-play-mini-line:before { content: "\f013"; }
.ri-playstation-fill:before { content: "\f014"; }
.ri-playstation-line:before { content: "\f015"; }
.ri-plug-2-fill:before { content: "\f016"; }
.ri-plug-2-line:before { content: "\f017"; }
.ri-plug-fill:before { content: "\f018"; }
.ri-plug-line:before { content: "\f019"; }
.ri-polaroid-2-fill:before { content: "\f01a"; }
.ri-polaroid-2-line:before { content: "\f01b"; }
.ri-polaroid-fill:before { content: "\f01c"; }
.ri-polaroid-line:before { content: "\f01d"; }
.ri-police-car-fill:before { content: "\f01e"; }
.ri-police-car-line:before { content: "\f01f"; }
.ri-price-tag-2-fill:before { content: "\f020"; }
.ri-price-tag-2-line:before { content: "\f021"; }
.ri-price-tag-3-fill:before { content: "\f022"; }
.ri-price-tag-3-line:before { content: "\f023"; }
.ri-price-tag-fill:before { content: "\f024"; }
.ri-price-tag-line:before { content: "\f025"; }
.ri-printer-cloud-fill:before { content: "\f026"; }
.ri-printer-cloud-line:before { content: "\f027"; }
.ri-printer-fill:before { content: "\f028"; }
.ri-printer-line:before { content: "\f029"; }
.ri-product-hunt-fill:before { content: "\f02a"; }
.ri-product-hunt-line:before { content: "\f02b"; }
.ri-profile-fill:before { content: "\f02c"; }
.ri-profile-line:before { content: "\f02d"; }
.ri-projector-2-fill:before { content: "\f02e"; }
.ri-projector-2-line:before { content: "\f02f"; }
.ri-projector-fill:before { content: "\f030"; }
.ri-projector-line:before { content: "\f031"; }
.ri-psychotherapy-fill:before { content: "\f032"; }
.ri-psychotherapy-line:before { content: "\f033"; }
.ri-pulse-fill:before { content: "\f034"; }
.ri-pulse-line:before { content: "\f035"; }
.ri-pushpin-2-fill:before { content: "\f036"; }
.ri-pushpin-2-line:before { content: "\f037"; }
.ri-pushpin-fill:before { content: "\f038"; }
.ri-pushpin-line:before { content: "\f039"; }
.ri-qq-fill:before { content: "\f03a"; }
.ri-qq-line:before { content: "\f03b"; }
.ri-qr-code-fill:before { content: "\f03c"; }
.ri-qr-code-line:before { content: "\f03d"; }
.ri-qr-scan-2-fill:before { content: "\f03e"; }
.ri-qr-scan-2-line:before { content: "\f03f"; }
.ri-qr-scan-fill:before { content: "\f040"; }
.ri-qr-scan-line:before { content: "\f041"; }
.ri-question-answer-fill:before { content: "\f042"; }
.ri-question-answer-line:before { content: "\f043"; }
.ri-question-fill:before { content: "\f044"; }
.ri-question-line:before { content: "\f045"; }
.ri-question-mark:before { content: "\f046"; }
.ri-questionnaire-fill:before { content: "\f047"; }
.ri-questionnaire-line:before { content: "\f048"; }
.ri-quill-pen-fill:before { content: "\f049"; }
.ri-quill-pen-line:before { content: "\f04a"; }
.ri-radar-fill:before { content: "\f04b"; }
.ri-radar-line:before { content: "\f04c"; }
.ri-radio-2-fill:before { content: "\f04d"; }
.ri-radio-2-line:before { content: "\f04e"; }
.ri-radio-button-fill:before { content: "\f04f"; }
.ri-radio-button-line:before { content: "\f050"; }
.ri-radio-fill:before { content: "\f051"; }
.ri-radio-line:before { content: "\f052"; }
.ri-rainbow-fill:before { content: "\f053"; }
.ri-rainbow-line:before { content: "\f054"; }
.ri-rainy-fill:before { content: "\f055"; }
.ri-rainy-line:before { content: "\f056"; }
.ri-reactjs-fill:before { content: "\f057"; }
.ri-reactjs-line:before { content: "\f058"; }
.ri-record-circle-fill:before { content: "\f059"; }
.ri-record-circle-line:before { content: "\f05a"; }
.ri-record-mail-fill:before { content: "\f05b"; }
.ri-record-mail-line:before { content: "\f05c"; }
.ri-recycle-fill:before { content: "\f05d"; }
.ri-recycle-line:before { content: "\f05e"; }
.ri-red-packet-fill:before { content: "\f05f"; }
.ri-red-packet-line:before { content: "\f060"; }
.ri-reddit-fill:before { content: "\f061"; }
.ri-reddit-line:before { content: "\f062"; }
.ri-refresh-fill:before { content: "\f063"; }
.ri-refresh-line:before { content: "\f064"; }
.ri-refund-2-fill:before { content: "\f065"; }
.ri-refund-2-line:before { content: "\f066"; }
.ri-refund-fill:before { content: "\f067"; }
.ri-refund-line:before { content: "\f068"; }
.ri-registered-fill:before { content: "\f069"; }
.ri-registered-line:before { content: "\f06a"; }
.ri-remixicon-fill:before { content: "\f06b"; }
.ri-remixicon-line:before { content: "\f06c"; }
.ri-remote-control-2-fill:before { content: "\f06d"; }
.ri-remote-control-2-line:before { content: "\f06e"; }
.ri-remote-control-fill:before { content: "\f06f"; }
.ri-remote-control-line:before { content: "\f070"; }
.ri-repeat-2-fill:before { content: "\f071"; }
.ri-repeat-2-line:before { content: "\f072"; }
.ri-repeat-fill:before { content: "\f073"; }
.ri-repeat-line:before { content: "\f074"; }
.ri-repeat-one-fill:before { content: "\f075"; }
.ri-repeat-one-line:before { content: "\f076"; }
.ri-reply-all-fill:before { content: "\f077"; }
.ri-reply-all-line:before { content: "\f078"; }
.ri-reply-fill:before { content: "\f079"; }
.ri-reply-line:before { content: "\f07a"; }
.ri-reserved-fill:before { content: "\f07b"; }
.ri-reserved-line:before { content: "\f07c"; }
.ri-rest-time-fill:before { content: "\f07d"; }
.ri-rest-time-line:before { content: "\f07e"; }
.ri-restart-fill:before { content: "\f07f"; }
.ri-restart-line:before { content: "\f080"; }
.ri-restaurant-2-fill:before { content: "\f081"; }
.ri-restaurant-2-line:before { content: "\f082"; }
.ri-restaurant-fill:before { content: "\f083"; }
.ri-restaurant-line:before { content: "\f084"; }
.ri-rewind-fill:before { content: "\f085"; }
.ri-rewind-line:before { content: "\f086"; }
.ri-rewind-mini-fill:before { content: "\f087"; }
.ri-rewind-mini-line:before { content: "\f088"; }
.ri-rhythm-fill:before { content: "\f089"; }
.ri-rhythm-line:before { content: "\f08a"; }
.ri-riding-fill:before { content: "\f08b"; }
.ri-riding-line:before { content: "\f08c"; }
.ri-road-map-fill:before { content: "\f08d"; }
.ri-road-map-line:before { content: "\f08e"; }
.ri-roadster-fill:before { content: "\f08f"; }
.ri-roadster-line:before { content: "\f090"; }
.ri-robot-fill:before { content: "\f091"; }
.ri-robot-line:before { content: "\f092"; }
.ri-rocket-2-fill:before { content: "\f093"; }
.ri-rocket-2-line:before { content: "\f094"; }
.ri-rocket-fill:before { content: "\f095"; }
.ri-rocket-line:before { content: "\f096"; }
.ri-rotate-lock-fill:before { content: "\f097"; }
.ri-rotate-lock-line:before { content: "\f098"; }
.ri-rounded-corner:before { content: "\f099"; }
.ri-route-fill:before { content: "\f09a"; }
.ri-route-line:before { content: "\f09b"; }
.ri-router-fill:before { content: "\f09c"; }
.ri-router-line:before { content: "\f09d"; }
.ri-rss-fill:before { content: "\f09e"; }
.ri-rss-line:before { content: "\f09f"; }
.ri-ruler-2-fill:before { content: "\f0a0"; }
.ri-ruler-2-line:before { content: "\f0a1"; }
.ri-ruler-fill:before { content: "\f0a2"; }
.ri-ruler-line:before { content: "\f0a3"; }
.ri-run-fill:before { content: "\f0a4"; }
.ri-run-line:before { content: "\f0a5"; }
.ri-safari-fill:before { content: "\f0a6"; }
.ri-safari-line:before { content: "\f0a7"; }
.ri-safe-2-fill:before { content: "\f0a8"; }
.ri-safe-2-line:before { content: "\f0a9"; }
.ri-safe-fill:before { content: "\f0aa"; }
.ri-safe-line:before { content: "\f0ab"; }
.ri-sailboat-fill:before { content: "\f0ac"; }
.ri-sailboat-line:before { content: "\f0ad"; }
.ri-save-2-fill:before { content: "\f0ae"; }
.ri-save-2-line:before { content: "\f0af"; }
.ri-save-3-fill:before { content: "\f0b0"; }
.ri-save-3-line:before { content: "\f0b1"; }
.ri-save-fill:before { content: "\f0b2"; }
.ri-save-line:before { content: "\f0b3"; }
.ri-scales-2-fill:before { content: "\f0b4"; }
.ri-scales-2-line:before { content: "\f0b5"; }
.ri-scales-3-fill:before { content: "\f0b6"; }
.ri-scales-3-line:before { content: "\f0b7"; }
.ri-scales-fill:before { content: "\f0b8"; }
.ri-scales-line:before { content: "\f0b9"; }
.ri-scan-2-fill:before { content: "\f0ba"; }
.ri-scan-2-line:before { content: "\f0bb"; }
.ri-scan-fill:before { content: "\f0bc"; }
.ri-scan-line:before { content: "\f0bd"; }
.ri-scissors-2-fill:before { content: "\f0be"; }
.ri-scissors-2-line:before { content: "\f0bf"; }
.ri-scissors-cut-fill:before { content: "\f0c0"; }
.ri-scissors-cut-line:before { content: "\f0c1"; }
.ri-scissors-fill:before { content: "\f0c2"; }
.ri-scissors-line:before { content: "\f0c3"; }
.ri-screenshot-2-fill:before { content: "\f0c4"; }
.ri-screenshot-2-line:before { content: "\f0c5"; }
.ri-screenshot-fill:before { content: "\f0c6"; }
.ri-screenshot-line:before { content: "\f0c7"; }
.ri-sd-card-fill:before { content: "\f0c8"; }
.ri-sd-card-line:before { content: "\f0c9"; }
.ri-sd-card-mini-fill:before { content: "\f0ca"; }
.ri-sd-card-mini-line:before { content: "\f0cb"; }
.ri-search-2-fill:before { content: "\f0cc"; }
.ri-search-2-line:before { content: "\f0cd"; }
.ri-search-eye-fill:before { content: "\f0ce"; }
.ri-search-eye-line:before { content: "\f0cf"; }
.ri-search-fill:before { content: "\f0d0"; }
.ri-search-line:before { content: "\f0d1"; }
.ri-secure-payment-fill:before { content: "\f0d2"; }
.ri-secure-payment-line:before { content: "\f0d3"; }
.ri-seedling-fill:before { content: "\f0d4"; }
.ri-seedling-line:before { content: "\f0d5"; }
.ri-send-backward:before { content: "\f0d6"; }
.ri-send-plane-2-fill:before { content: "\f0d7"; }
.ri-send-plane-2-line:before { content: "\f0d8"; }
.ri-send-plane-fill:before { content: "\f0d9"; }
.ri-send-plane-line:before { content: "\f0da"; }
.ri-send-to-back:before { content: "\f0db"; }
.ri-sensor-fill:before { content: "\f0dc"; }
.ri-sensor-line:before { content: "\f0dd"; }
.ri-separator:before { content: "\f0de"; }
.ri-server-fill:before { content: "\f0df"; }
.ri-server-line:before { content: "\f0e0"; }
.ri-service-fill:before { content: "\f0e1"; }
.ri-service-line:before { content: "\f0e2"; }
.ri-settings-2-fill:before { content: "\f0e3"; }
.ri-settings-2-line:before { content: "\f0e4"; }
.ri-settings-3-fill:before { content: "\f0e5"; }
.ri-settings-3-line:before { content: "\f0e6"; }
.ri-settings-4-fill:before { content: "\f0e7"; }
.ri-settings-4-line:before { content: "\f0e8"; }
.ri-settings-5-fill:before { content: "\f0e9"; }
.ri-settings-5-line:before { content: "\f0ea"; }
.ri-settings-6-fill:before { content: "\f0eb"; }
.ri-settings-6-line:before { content: "\f0ec"; }
.ri-settings-fill:before { content: "\f0ed"; }
.ri-settings-line:before { content: "\f0ee"; }
.ri-shape-2-fill:before { content: "\f0ef"; }
.ri-shape-2-line:before { content: "\f0f0"; }
.ri-shape-fill:before { content: "\f0f1"; }
.ri-shape-line:before { content: "\f0f2"; }
.ri-share-box-fill:before { content: "\f0f3"; }
.ri-share-box-line:before { content: "\f0f4"; }
.ri-share-circle-fill:before { content: "\f0f5"; }
.ri-share-circle-line:before { content: "\f0f6"; }
.ri-share-fill:before { content: "\f0f7"; }
.ri-share-forward-2-fill:before { content: "\f0f8"; }
.ri-share-forward-2-line:before { content: "\f0f9"; }
.ri-share-forward-box-fill:before { content: "\f0fa"; }
.ri-share-forward-box-line:before { content: "\f0fb"; }
.ri-share-forward-fill:before { content: "\f0fc"; }
.ri-share-forward-line:before { content: "\f0fd"; }
.ri-share-line:before { content: "\f0fe"; }
.ri-shield-check-fill:before { content: "\f0ff"; }
.ri-shield-check-line:before { content: "\f100"; }
.ri-shield-cross-fill:before { content: "\f101"; }
.ri-shield-cross-line:before { content: "\f102"; }
.ri-shield-fill:before { content: "\f103"; }
.ri-shield-flash-fill:before { content: "\f104"; }
.ri-shield-flash-line:before { content: "\f105"; }
.ri-shield-keyhole-fill:before { content: "\f106"; }
.ri-shield-keyhole-line:before { content: "\f107"; }
.ri-shield-line:before { content: "\f108"; }
.ri-shield-star-fill:before { content: "\f109"; }
.ri-shield-star-line:before { content: "\f10a"; }
.ri-shield-user-fill:before { content: "\f10b"; }
.ri-shield-user-line:before { content: "\f10c"; }
.ri-ship-2-fill:before { content: "\f10d"; }
.ri-ship-2-line:before { content: "\f10e"; }
.ri-ship-fill:before { content: "\f10f"; }
.ri-ship-line:before { content: "\f110"; }
.ri-shirt-fill:before { content: "\f111"; }
.ri-shirt-line:before { content: "\f112"; }
.ri-shopping-bag-2-fill:before { content: "\f113"; }
.ri-shopping-bag-2-line:before { content: "\f114"; }
.ri-shopping-bag-3-fill:before { content: "\f115"; }
.ri-shopping-bag-3-line:before { content: "\f116"; }
.ri-shopping-bag-fill:before { content: "\f117"; }
.ri-shopping-bag-line:before { content: "\f118"; }
.ri-shopping-basket-2-fill:before { content: "\f119"; }
.ri-shopping-basket-2-line:before { content: "\f11a"; }
.ri-shopping-basket-fill:before { content: "\f11b"; }
.ri-shopping-basket-line:before { content: "\f11c"; }
.ri-shopping-cart-2-fill:before { content: "\f11d"; }
.ri-shopping-cart-2-line:before { content: "\f11e"; }
.ri-shopping-cart-fill:before { content: "\f11f"; }
.ri-shopping-cart-line:before { content: "\f120"; }
.ri-showers-fill:before { content: "\f121"; }
.ri-showers-line:before { content: "\f122"; }
.ri-shuffle-fill:before { content: "\f123"; }
.ri-shuffle-line:before { content: "\f124"; }
.ri-shut-down-fill:before { content: "\f125"; }
.ri-shut-down-line:before { content: "\f126"; }
.ri-side-bar-fill:before { content: "\f127"; }
.ri-side-bar-line:before { content: "\f128"; }
.ri-signal-tower-fill:before { content: "\f129"; }
.ri-signal-tower-line:before { content: "\f12a"; }
.ri-signal-wifi-1-fill:before { content: "\f12b"; }
.ri-signal-wifi-1-line:before { content: "\f12c"; }
.ri-signal-wifi-2-fill:before { content: "\f12d"; }
.ri-signal-wifi-2-line:before { content: "\f12e"; }
.ri-signal-wifi-3-fill:before { content: "\f12f"; }
.ri-signal-wifi-3-line:before { content: "\f130"; }
.ri-signal-wifi-error-fill:before { content: "\f131"; }
.ri-signal-wifi-error-line:before { content: "\f132"; }
.ri-signal-wifi-fill:before { content: "\f133"; }
.ri-signal-wifi-line:before { content: "\f134"; }
.ri-signal-wifi-off-fill:before { content: "\f135"; }
.ri-signal-wifi-off-line:before { content: "\f136"; }
.ri-sim-card-2-fill:before { content: "\f137"; }
.ri-sim-card-2-line:before { content: "\f138"; }
.ri-sim-card-fill:before { content: "\f139"; }
.ri-sim-card-line:before { content: "\f13a"; }
.ri-single-quotes-l:before { content: "\f13b"; }
.ri-single-quotes-r:before { content: "\f13c"; }
.ri-sip-fill:before { content: "\f13d"; }
.ri-sip-line:before { content: "\f13e"; }
.ri-skip-back-fill:before { content: "\f13f"; }
.ri-skip-back-line:before { content: "\f140"; }
.ri-skip-back-mini-fill:before { content: "\f141"; }
.ri-skip-back-mini-line:before { content: "\f142"; }
.ri-skip-forward-fill:before { content: "\f143"; }
.ri-skip-forward-line:before { content: "\f144"; }
.ri-skip-forward-mini-fill:before { content: "\f145"; }
.ri-skip-forward-mini-line:before { content: "\f146"; }
.ri-skull-2-fill:before { content: "\f147"; }
.ri-skull-2-line:before { content: "\f148"; }
.ri-skull-fill:before { content: "\f149"; }
.ri-skull-line:before { content: "\f14a"; }
.ri-skype-fill:before { content: "\f14b"; }
.ri-skype-line:before { content: "\f14c"; }
.ri-slack-fill:before { content: "\f14d"; }
.ri-slack-line:before { content: "\f14e"; }
.ri-slice-fill:before { content: "\f14f"; }
.ri-slice-line:before { content: "\f150"; }
.ri-slideshow-2-fill:before { content: "\f151"; }
.ri-slideshow-2-line:before { content: "\f152"; }
.ri-slideshow-3-fill:before { content: "\f153"; }
.ri-slideshow-3-line:before { content: "\f154"; }
.ri-slideshow-4-fill:before { content: "\f155"; }
.ri-slideshow-4-line:before { content: "\f156"; }
.ri-slideshow-fill:before { content: "\f157"; }
.ri-slideshow-line:before { content: "\f158"; }
.ri-smartphone-fill:before { content: "\f159"; }
.ri-smartphone-line:before { content: "\f15a"; }
.ri-snapchat-fill:before { content: "\f15b"; }
.ri-snapchat-line:before { content: "\f15c"; }
.ri-snowy-fill:before { content: "\f15d"; }
.ri-snowy-line:before { content: "\f15e"; }
.ri-sort-asc:before { content: "\f15f"; }
.ri-sort-desc:before { content: "\f160"; }
.ri-sound-module-fill:before { content: "\f161"; }
.ri-sound-module-line:before { content: "\f162"; }
.ri-soundcloud-fill:before { content: "\f163"; }
.ri-soundcloud-line:before { content: "\f164"; }
.ri-space-ship-fill:before { content: "\f165"; }
.ri-space-ship-line:before { content: "\f166"; }
.ri-space:before { content: "\f167"; }
.ri-spam-2-fill:before { content: "\f168"; }
.ri-spam-2-line:before { content: "\f169"; }
.ri-spam-3-fill:before { content: "\f16a"; }
.ri-spam-3-line:before { content: "\f16b"; }
.ri-spam-fill:before { content: "\f16c"; }
.ri-spam-line:before { content: "\f16d"; }
.ri-speaker-2-fill:before { content: "\f16e"; }
.ri-speaker-2-line:before { content: "\f16f"; }
.ri-speaker-3-fill:before { content: "\f170"; }
.ri-speaker-3-line:before { content: "\f171"; }
.ri-speaker-fill:before { content: "\f172"; }
.ri-speaker-line:before { content: "\f173"; }
.ri-spectrum-fill:before { content: "\f174"; }
.ri-spectrum-line:before { content: "\f175"; }
.ri-speed-fill:before { content: "\f176"; }
.ri-speed-line:before { content: "\f177"; }
.ri-speed-mini-fill:before { content: "\f178"; }
.ri-speed-mini-line:before { content: "\f179"; }
.ri-split-cells-horizontal:before { content: "\f17a"; }
.ri-split-cells-vertical:before { content: "\f17b"; }
.ri-spotify-fill:before { content: "\f17c"; }
.ri-spotify-line:before { content: "\f17d"; }
.ri-spy-fill:before { content: "\f17e"; }
.ri-spy-line:before { content: "\f17f"; }
.ri-stack-fill:before { content: "\f180"; }
.ri-stack-line:before { content: "\f181"; }
.ri-stack-overflow-fill:before { content: "\f182"; }
.ri-stack-overflow-line:before { content: "\f183"; }
.ri-stackshare-fill:before { content: "\f184"; }
.ri-stackshare-line:before { content: "\f185"; }
.ri-star-fill:before { content: "\f186"; }
.ri-star-half-fill:before { content: "\f187"; }
.ri-star-half-line:before { content: "\f188"; }
.ri-star-half-s-fill:before { content: "\f189"; }
.ri-star-half-s-line:before { content: "\f18a"; }
.ri-star-line:before { content: "\f18b"; }
.ri-star-s-fill:before { content: "\f18c"; }
.ri-star-s-line:before { content: "\f18d"; }
.ri-star-smile-fill:before { content: "\f18e"; }
.ri-star-smile-line:before { content: "\f18f"; }
.ri-steam-fill:before { content: "\f190"; }
.ri-steam-line:before { content: "\f191"; }
.ri-steering-2-fill:before { content: "\f192"; }
.ri-steering-2-line:before { content: "\f193"; }
.ri-steering-fill:before { content: "\f194"; }
.ri-steering-line:before { content: "\f195"; }
.ri-stethoscope-fill:before { content: "\f196"; }
.ri-stethoscope-line:before { content: "\f197"; }
.ri-sticky-note-2-fill:before { content: "\f198"; }
.ri-sticky-note-2-line:before { content: "\f199"; }
.ri-sticky-note-fill:before { content: "\f19a"; }
.ri-sticky-note-line:before { content: "\f19b"; }
.ri-stock-fill:before { content: "\f19c"; }
.ri-stock-line:before { content: "\f19d"; }
.ri-stop-circle-fill:before { content: "\f19e"; }
.ri-stop-circle-line:before { content: "\f19f"; }
.ri-stop-fill:before { content: "\f1a0"; }
.ri-stop-line:before { content: "\f1a1"; }
.ri-stop-mini-fill:before { content: "\f1a2"; }
.ri-stop-mini-line:before { content: "\f1a3"; }
.ri-store-2-fill:before { content: "\f1a4"; }
.ri-store-2-line:before { content: "\f1a5"; }
.ri-store-3-fill:before { content: "\f1a6"; }
.ri-store-3-line:before { content: "\f1a7"; }
.ri-store-fill:before { content: "\f1a8"; }
.ri-store-line:before { content: "\f1a9"; }
.ri-strikethrough-2:before { content: "\f1aa"; }
.ri-strikethrough:before { content: "\f1ab"; }
.ri-subscript-2:before { content: "\f1ac"; }
.ri-subscript:before { content: "\f1ad"; }
.ri-subtract-fill:before { content: "\f1ae"; }
.ri-subtract-line:before { content: "\f1af"; }
.ri-subway-fill:before { content: "\f1b0"; }
.ri-subway-line:before { content: "\f1b1"; }
.ri-subway-wifi-fill:before { content: "\f1b2"; }
.ri-subway-wifi-line:before { content: "\f1b3"; }
.ri-suitcase-2-fill:before { content: "\f1b4"; }
.ri-suitcase-2-line:before { content: "\f1b5"; }
.ri-suitcase-3-fill:before { content: "\f1b6"; }
.ri-suitcase-3-line:before { content: "\f1b7"; }
.ri-suitcase-fill:before { content: "\f1b8"; }
.ri-suitcase-line:before { content: "\f1b9"; }
.ri-sun-cloudy-fill:before { content: "\f1ba"; }
.ri-sun-cloudy-line:before { content: "\f1bb"; }
.ri-sun-fill:before { content: "\f1bc"; }
.ri-sun-foggy-fill:before { content: "\f1bd"; }
.ri-sun-foggy-line:before { content: "\f1be"; }
.ri-sun-line:before { content: "\f1bf"; }
.ri-superscript-2:before { content: "\f1c0"; }
.ri-superscript:before { content: "\f1c1"; }
.ri-surgical-mask-fill:before { content: "\f1c2"; }
.ri-surgical-mask-line:before { content: "\f1c3"; }
.ri-surround-sound-fill:before { content: "\f1c4"; }
.ri-surround-sound-line:before { content: "\f1c5"; }
.ri-survey-fill:before { content: "\f1c6"; }
.ri-survey-line:before { content: "\f1c7"; }
.ri-swap-box-fill:before { content: "\f1c8"; }
.ri-swap-box-line:before { content: "\f1c9"; }
.ri-swap-fill:before { content: "\f1ca"; }
.ri-swap-line:before { content: "\f1cb"; }
.ri-switch-fill:before { content: "\f1cc"; }
.ri-switch-line:before { content: "\f1cd"; }
.ri-sword-fill:before { content: "\f1ce"; }
.ri-sword-line:before { content: "\f1cf"; }
.ri-syringe-fill:before { content: "\f1d0"; }
.ri-syringe-line:before { content: "\f1d1"; }
.ri-t-box-fill:before { content: "\f1d2"; }
.ri-t-box-line:before { content: "\f1d3"; }
.ri-t-shirt-2-fill:before { content: "\f1d4"; }
.ri-t-shirt-2-line:before { content: "\f1d5"; }
.ri-t-shirt-air-fill:before { content: "\f1d6"; }
.ri-t-shirt-air-line:before { content: "\f1d7"; }
.ri-t-shirt-fill:before { content: "\f1d8"; }
.ri-t-shirt-line:before { content: "\f1d9"; }
.ri-table-2:before { content: "\f1da"; }
.ri-table-alt-fill:before { content: "\f1db"; }
.ri-table-alt-line:before { content: "\f1dc"; }
.ri-table-fill:before { content: "\f1dd"; }
.ri-table-line:before { content: "\f1de"; }
.ri-tablet-fill:before { content: "\f1df"; }
.ri-tablet-line:before { content: "\f1e0"; }
.ri-takeaway-fill:before { content: "\f1e1"; }
.ri-takeaway-line:before { content: "\f1e2"; }
.ri-taobao-fill:before { content: "\f1e3"; }
.ri-taobao-line:before { content: "\f1e4"; }
.ri-tape-fill:before { content: "\f1e5"; }
.ri-tape-line:before { content: "\f1e6"; }
.ri-task-fill:before { content: "\f1e7"; }
.ri-task-line:before { content: "\f1e8"; }
.ri-taxi-fill:before { content: "\f1e9"; }
.ri-taxi-line:before { content: "\f1ea"; }
.ri-taxi-wifi-fill:before { content: "\f1eb"; }
.ri-taxi-wifi-line:before { content: "\f1ec"; }
.ri-team-fill:before { content: "\f1ed"; }
.ri-team-line:before { content: "\f1ee"; }
.ri-telegram-fill:before { content: "\f1ef"; }
.ri-telegram-line:before { content: "\f1f0"; }
.ri-temp-cold-fill:before { content: "\f1f1"; }
.ri-temp-cold-line:before { content: "\f1f2"; }
.ri-temp-hot-fill:before { content: "\f1f3"; }
.ri-temp-hot-line:before { content: "\f1f4"; }
.ri-terminal-box-fill:before { content: "\f1f5"; }
.ri-terminal-box-line:before { content: "\f1f6"; }
.ri-terminal-fill:before { content: "\f1f7"; }
.ri-terminal-line:before { content: "\f1f8"; }
.ri-terminal-window-fill:before { content: "\f1f9"; }
.ri-terminal-window-line:before { content: "\f1fa"; }
.ri-test-tube-fill:before { content: "\f1fb"; }
.ri-test-tube-line:before { content: "\f1fc"; }
.ri-text-direction-l:before { content: "\f1fd"; }
.ri-text-direction-r:before { content: "\f1fe"; }
.ri-text-spacing:before { content: "\f1ff"; }
.ri-text-wrap:before { content: "\f200"; }
.ri-text:before { content: "\f201"; }
.ri-thermometer-fill:before { content: "\f202"; }
.ri-thermometer-line:before { content: "\f203"; }
.ri-thumb-down-fill:before { content: "\f204"; }
.ri-thumb-down-line:before { content: "\f205"; }
.ri-thumb-up-fill:before { content: "\f206"; }
.ri-thumb-up-line:before { content: "\f207"; }
.ri-thunderstorms-fill:before { content: "\f208"; }
.ri-thunderstorms-line:before { content: "\f209"; }
.ri-ticket-2-fill:before { content: "\f20a"; }
.ri-ticket-2-line:before { content: "\f20b"; }
.ri-ticket-fill:before { content: "\f20c"; }
.ri-ticket-line:before { content: "\f20d"; }
.ri-time-fill:before { content: "\f20e"; }
.ri-time-line:before { content: "\f20f"; }
.ri-timer-2-fill:before { content: "\f210"; }
.ri-timer-2-line:before { content: "\f211"; }
.ri-timer-fill:before { content: "\f212"; }
.ri-timer-flash-fill:before { content: "\f213"; }
.ri-timer-flash-line:before { content: "\f214"; }
.ri-timer-line:before { content: "\f215"; }
.ri-todo-fill:before { content: "\f216"; }
.ri-todo-line:before { content: "\f217"; }
.ri-toggle-fill:before { content: "\f218"; }
.ri-toggle-line:before { content: "\f219"; }
.ri-tools-fill:before { content: "\f21a"; }
.ri-tools-line:before { content: "\f21b"; }
.ri-tornado-fill:before { content: "\f21c"; }
.ri-tornado-line:before { content: "\f21d"; }
.ri-trademark-fill:before { content: "\f21e"; }
.ri-trademark-line:before { content: "\f21f"; }
.ri-traffic-light-fill:before { content: "\f220"; }
.ri-traffic-light-line:before { content: "\f221"; }
.ri-train-fill:before { content: "\f222"; }
.ri-train-line:before { content: "\f223"; }
.ri-train-wifi-fill:before { content: "\f224"; }
.ri-train-wifi-line:before { content: "\f225"; }
.ri-translate-2:before { content: "\f226"; }
.ri-translate:before { content: "\f227"; }
.ri-travesti-fill:before { content: "\f228"; }
.ri-travesti-line:before { content: "\f229"; }
.ri-treasure-map-fill:before { content: "\f22a"; }
.ri-treasure-map-line:before { content: "\f22b"; }
.ri-trello-fill:before { content: "\f22c"; }
.ri-trello-line:before { content: "\f22d"; }
.ri-trophy-fill:before { content: "\f22e"; }
.ri-trophy-line:before { content: "\f22f"; }
.ri-truck-fill:before { content: "\f230"; }
.ri-truck-line:before { content: "\f231"; }
.ri-tumblr-fill:before { content: "\f232"; }
.ri-tumblr-line:before { content: "\f233"; }
.ri-tv-2-fill:before { content: "\f234"; }
.ri-tv-2-line:before { content: "\f235"; }
.ri-tv-fill:before { content: "\f236"; }
.ri-tv-line:before { content: "\f237"; }
.ri-twitch-fill:before { content: "\f238"; }
.ri-twitch-line:before { content: "\f239"; }
.ri-twitter-fill:before { content: "\f23a"; }
.ri-twitter-line:before { content: "\f23b"; }
.ri-typhoon-fill:before { content: "\f23c"; }
.ri-typhoon-line:before { content: "\f23d"; }
.ri-u-disk-fill:before { content: "\f23e"; }
.ri-u-disk-line:before { content: "\f23f"; }
.ri-ubuntu-fill:before { content: "\f240"; }
.ri-ubuntu-line:before { content: "\f241"; }
.ri-umbrella-fill:before { content: "\f242"; }
.ri-umbrella-line:before { content: "\f243"; }
.ri-underline:before { content: "\f244"; }
.ri-uninstall-fill:before { content: "\f245"; }
.ri-uninstall-line:before { content: "\f246"; }
.ri-unsplash-fill:before { content: "\f247"; }
.ri-unsplash-line:before { content: "\f248"; }
.ri-upload-2-fill:before { content: "\f249"; }
.ri-upload-2-line:before { content: "\f24a"; }
.ri-upload-cloud-2-fill:before { content: "\f24b"; }
.ri-upload-cloud-2-line:before { content: "\f24c"; }
.ri-upload-cloud-fill:before { content: "\f24d"; }
.ri-upload-cloud-line:before { content: "\f24e"; }
.ri-upload-fill:before { content: "\f24f"; }
.ri-upload-line:before { content: "\f250"; }
.ri-usb-fill:before { content: "\f251"; }
.ri-usb-line:before { content: "\f252"; }
.ri-user-2-fill:before { content: "\f253"; }
.ri-user-2-line:before { content: "\f254"; }
.ri-user-3-fill:before { content: "\f255"; }
.ri-user-3-line:before { content: "\f256"; }
.ri-user-4-fill:before { content: "\f257"; }
.ri-user-4-line:before { content: "\f258"; }
.ri-user-5-fill:before { content: "\f259"; }
.ri-user-5-line:before { content: "\f25a"; }
.ri-user-6-fill:before { content: "\f25b"; }
.ri-user-6-line:before { content: "\f25c"; }
.ri-user-add-fill:before { content: "\f25d"; }
.ri-user-add-line:before { content: "\f25e"; }
.ri-user-fill:before { content: "\f25f"; }
.ri-user-follow-fill:before { content: "\f260"; }
.ri-user-follow-line:before { content: "\f261"; }
.ri-user-heart-fill:before { content: "\f262"; }
.ri-user-heart-line:before { content: "\f263"; }
.ri-user-line:before { content: "\f264"; }
.ri-user-location-fill:before { content: "\f265"; }
.ri-user-location-line:before { content: "\f266"; }
.ri-user-received-2-fill:before { content: "\f267"; }
.ri-user-received-2-line:before { content: "\f268"; }
.ri-user-received-fill:before { content: "\f269"; }
.ri-user-received-line:before { content: "\f26a"; }
.ri-user-search-fill:before { content: "\f26b"; }
.ri-user-search-line:before { content: "\f26c"; }
.ri-user-settings-fill:before { content: "\f26d"; }
.ri-user-settings-line:before { content: "\f26e"; }
.ri-user-shared-2-fill:before { content: "\f26f"; }
.ri-user-shared-2-line:before { content: "\f270"; }
.ri-user-shared-fill:before { content: "\f271"; }
.ri-user-shared-line:before { content: "\f272"; }
.ri-user-smile-fill:before { content: "\f273"; }
.ri-user-smile-line:before { content: "\f274"; }
.ri-user-star-fill:before { content: "\f275"; }
.ri-user-star-line:before { content: "\f276"; }
.ri-user-unfollow-fill:before { content: "\f277"; }
.ri-user-unfollow-line:before { content: "\f278"; }
.ri-user-voice-fill:before { content: "\f279"; }
.ri-user-voice-line:before { content: "\f27a"; }
.ri-video-add-fill:before { content: "\f27b"; }
.ri-video-add-line:before { content: "\f27c"; }
.ri-video-chat-fill:before { content: "\f27d"; }
.ri-video-chat-line:before { content: "\f27e"; }
.ri-video-download-fill:before { content: "\f27f"; }
.ri-video-download-line:before { content: "\f280"; }
.ri-video-fill:before { content: "\f281"; }
.ri-video-line:before { content: "\f282"; }
.ri-video-upload-fill:before { content: "\f283"; }
.ri-video-upload-line:before { content: "\f284"; }
.ri-vidicon-2-fill:before { content: "\f285"; }
.ri-vidicon-2-line:before { content: "\f286"; }
.ri-vidicon-fill:before { content: "\f287"; }
.ri-vidicon-line:before { content: "\f288"; }
.ri-vimeo-fill:before { content: "\f289"; }
.ri-vimeo-line:before { content: "\f28a"; }
.ri-vip-crown-2-fill:before { content: "\f28b"; }
.ri-vip-crown-2-line:before { content: "\f28c"; }
.ri-vip-crown-fill:before { content: "\f28d"; }
.ri-vip-crown-line:before { content: "\f28e"; }
.ri-vip-diamond-fill:before { content: "\f28f"; }
.ri-vip-diamond-line:before { content: "\f290"; }
.ri-vip-fill:before { content: "\f291"; }
.ri-vip-line:before { content: "\f292"; }
.ri-virus-fill:before { content: "\f293"; }
.ri-virus-line:before { content: "\f294"; }
.ri-visa-fill:before { content: "\f295"; }
.ri-visa-line:before { content: "\f296"; }
.ri-voice-recognition-fill:before { content: "\f297"; }
.ri-voice-recognition-line:before { content: "\f298"; }
.ri-voiceprint-fill:before { content: "\f299"; }
.ri-voiceprint-line:before { content: "\f29a"; }
.ri-volume-down-fill:before { content: "\f29b"; }
.ri-volume-down-line:before { content: "\f29c"; }
.ri-volume-mute-fill:before { content: "\f29d"; }
.ri-volume-mute-line:before { content: "\f29e"; }
.ri-volume-off-vibrate-fill:before { content: "\f29f"; }
.ri-volume-off-vibrate-line:before { content: "\f2a0"; }
.ri-volume-up-fill:before { content: "\f2a1"; }
.ri-volume-up-line:before { content: "\f2a2"; }
.ri-volume-vibrate-fill:before { content: "\f2a3"; }
.ri-volume-vibrate-line:before { content: "\f2a4"; }
.ri-vuejs-fill:before { content: "\f2a5"; }
.ri-vuejs-line:before { content: "\f2a6"; }
.ri-walk-fill:before { content: "\f2a7"; }
.ri-walk-line:before { content: "\f2a8"; }
.ri-wallet-2-fill:before { content: "\f2a9"; }
.ri-wallet-2-line:before { content: "\f2aa"; }
.ri-wallet-3-fill:before { content: "\f2ab"; }
.ri-wallet-3-line:before { content: "\f2ac"; }
.ri-wallet-fill:before { content: "\f2ad"; }
.ri-wallet-line:before { content: "\f2ae"; }
.ri-water-flash-fill:before { content: "\f2af"; }
.ri-water-flash-line:before { content: "\f2b0"; }
.ri-webcam-fill:before { content: "\f2b1"; }
.ri-webcam-line:before { content: "\f2b2"; }
.ri-wechat-2-fill:before { content: "\f2b3"; }
.ri-wechat-2-line:before { content: "\f2b4"; }
.ri-wechat-fill:before { content: "\f2b5"; }
.ri-wechat-line:before { content: "\f2b6"; }
.ri-wechat-pay-fill:before { content: "\f2b7"; }
.ri-wechat-pay-line:before { content: "\f2b8"; }
.ri-weibo-fill:before { content: "\f2b9"; }
.ri-weibo-line:before { content: "\f2ba"; }
.ri-whatsapp-fill:before { content: "\f2bb"; }
.ri-whatsapp-line:before { content: "\f2bc"; }
.ri-wheelchair-fill:before { content: "\f2bd"; }
.ri-wheelchair-line:before { content: "\f2be"; }
.ri-wifi-fill:before { content: "\f2bf"; }
.ri-wifi-line:before { content: "\f2c0"; }
.ri-wifi-off-fill:before { content: "\f2c1"; }
.ri-wifi-off-line:before { content: "\f2c2"; }
.ri-window-2-fill:before { content: "\f2c3"; }
.ri-window-2-line:before { content: "\f2c4"; }
.ri-window-fill:before { content: "\f2c5"; }
.ri-window-line:before { content: "\f2c6"; }
.ri-windows-fill:before { content: "\f2c7"; }
.ri-windows-line:before { content: "\f2c8"; }
.ri-windy-fill:before { content: "\f2c9"; }
.ri-windy-line:before { content: "\f2ca"; }
.ri-wireless-charging-fill:before { content: "\f2cb"; }
.ri-wireless-charging-line:before { content: "\f2cc"; }
.ri-women-fill:before { content: "\f2cd"; }
.ri-women-line:before { content: "\f2ce"; }
.ri-wubi-input:before { content: "\f2cf"; }
.ri-xbox-fill:before { content: "\f2d0"; }
.ri-xbox-line:before { content: "\f2d1"; }
.ri-xing-fill:before { content: "\f2d2"; }
.ri-xing-line:before { content: "\f2d3"; }
.ri-youtube-fill:before { content: "\f2d4"; }
.ri-youtube-line:before { content: "\f2d5"; }
.ri-zcool-fill:before { content: "\f2d6"; }
.ri-zcool-line:before { content: "\f2d7"; }
.ri-zhihu-fill:before { content: "\f2d8"; }
.ri-zhihu-line:before { content: "\f2d9"; }
.ri-zoom-in-fill:before { content: "\f2da"; }
.ri-zoom-in-line:before { content: "\f2db"; }
.ri-zoom-out-fill:before { content: "\f2dc"; }
.ri-zoom-out-line:before { content: "\f2dd"; }
.ri-zzz-fill:before { content: "\f2de"; }
.ri-zzz-line:before { content: "\f2df"; }

.fc-icon,.fc-unselectable{-moz-user-select:none;-ms-user-select:none}.fc .fc-button,.fc-icon{text-transform:none;font-weight:400}.fc-not-allowed,.fc-not-allowed .fc-event{cursor:not-allowed}.fc .fc-button:not(:disabled),.fc a[data-navlink],.fc-event.fc-event-draggable,.fc-event[href]{cursor:pointer}.fc-unselectable{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.fc{display:flex;flex-direction:column;font-size:1em}.fc .fc-button,.fc-icon{display:inline-block;text-align:center}.fc,.fc *,.fc :after,.fc :before{box-sizing:border-box}.fc table{border-collapse:collapse;border-spacing:0;font-size:1em}.fc th{text-align:center}.fc td,.fc th{vertical-align:top;padding:0}.fc .fc-button,.fc .fc-button .fc-icon,.fc .fc-button-group,.fc .fc-timegrid-slot-label{vertical-align:middle}.fc a[data-navlink]:hover{text-decoration:underline}.fc .fc-button:hover,.fc .fc-list-event-title a,a.fc-event,a.fc-event:hover{text-decoration:none}.fc-direction-ltr{direction:ltr;text-align:left}.fc-direction-rtl{direction:rtl;text-align:right}.fc-theme-standard td,.fc-theme-standard th{border:1px solid #ddd;border:1px solid var(--fc-border-color,#ddd)}.fc-liquid-hack td,.fc-liquid-hack th{position:relative}@font-face{font-family:fcicons;src:url("data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBfAAAAC8AAAAYGNtYXAXVtKNAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5ZgYydxIAAAF4AAAFNGhlYWQUJ7cIAAAGrAAAADZoaGVhB20DzAAABuQAAAAkaG10eCIABhQAAAcIAAAALGxvY2ED4AU6AAAHNAAAABhtYXhwAA8AjAAAB0wAAAAgbmFtZXsr690AAAdsAAABhnBvc3QAAwAAAAAI9AAAACAAAwPAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADpBgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6Qb//f//AAAAAAAg6QD//f//AAH/4xcEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAWIAjQKeAskAEwAAJSc3NjQnJiIHAQYUFwEWMjc2NCcCnuLiDQ0MJAz/AA0NAQAMJAwNDcni4gwjDQwM/wANIwz/AA0NDCMNAAAAAQFiAI0CngLJABMAACUBNjQnASYiBwYUHwEHBhQXFjI3AZ4BAA0N/wAMJAwNDeLiDQ0MJAyNAQAMIw0BAAwMDSMM4uINIwwNDQAAAAIA4gC3Ax4CngATACcAACUnNzY0JyYiDwEGFB8BFjI3NjQnISc3NjQnJiIPAQYUHwEWMjc2NCcB87e3DQ0MIw3VDQ3VDSMMDQ0BK7e3DQ0MJAzVDQ3VDCQMDQ3zuLcMJAwNDdUNIwzWDAwNIwy4twwkDA0N1Q0jDNYMDA0jDAAAAgDiALcDHgKeABMAJwAAJTc2NC8BJiIHBhQfAQcGFBcWMjchNzY0LwEmIgcGFB8BBwYUFxYyNwJJ1Q0N1Q0jDA0Nt7cNDQwjDf7V1Q0N1QwkDA0Nt7cNDQwkDLfWDCMN1Q0NDCQMt7gMIw0MDNYMIw3VDQ0MJAy3uAwjDQwMAAADAFUAAAOrA1UAMwBoAHcAABMiBgcOAQcOAQcOARURFBYXHgEXHgEXHgEzITI2Nz4BNz4BNz4BNRE0JicuAScuAScuASMFITIWFx4BFx4BFx4BFREUBgcOAQcOAQcOASMhIiYnLgEnLgEnLgE1ETQ2Nz4BNz4BNz4BMxMhMjY1NCYjISIGFRQWM9UNGAwLFQkJDgUFBQUFBQ4JCRULDBgNAlYNGAwLFQkJDgUFBQUFBQ4JCRULDBgN/aoCVgQIBAQHAwMFAQIBAQIBBQMDBwQECAT9qgQIBAQHAwMFAQIBAQIBBQMDBwQECASAAVYRGRkR/qoRGRkRA1UFBAUOCQkVDAsZDf2rDRkLDBUJCA4FBQUFBQUOCQgVDAsZDQJVDRkLDBUJCQ4FBAVVAgECBQMCBwQECAX9qwQJAwQHAwMFAQICAgIBBQMDBwQDCQQCVQUIBAQHAgMFAgEC/oAZEhEZGRESGQAAAAADAFUAAAOrA1UAMwBoAIkAABMiBgcOAQcOAQcOARURFBYXHgEXHgEXHgEzITI2Nz4BNz4BNz4BNRE0JicuAScuAScuASMFITIWFx4BFx4BFx4BFREUBgcOAQcOAQcOASMhIiYnLgEnLgEnLgE1ETQ2Nz4BNz4BNz4BMxMzFRQWMzI2PQEzMjY1NCYrATU0JiMiBh0BIyIGFRQWM9UNGAwLFQkJDgUFBQUFBQ4JCRULDBgNAlYNGAwLFQkJDgUFBQUFBQ4JCRULDBgN/aoCVgQIBAQHAwMFAQIBAQIBBQMDBwQECAT9qgQIBAQHAwMFAQIBAQIBBQMDBwQECASAgBkSEhmAERkZEYAZEhIZgBEZGREDVQUEBQ4JCRUMCxkN/asNGQsMFQkIDgUFBQUFBQ4JCBUMCxkNAlUNGQsMFQkJDgUEBVUCAQIFAwIHBAQIBf2rBAkDBAcDAwUBAgICAgEFAwMHBAMJBAJVBQgEBAcCAwUCAQL+gIASGRkSgBkSERmAEhkZEoAZERIZAAABAOIAjQMeAskAIAAAExcHBhQXFjI/ARcWMjc2NC8BNzY0JyYiDwEnJiIHBhQX4uLiDQ0MJAzi4gwkDA0N4uINDQwkDOLiDCQMDQ0CjeLiDSMMDQ3h4Q0NDCMN4uIMIw0MDOLiDAwNIwwAAAABAAAAAQAAa5n0y18PPPUACwQAAAAAANivOVsAAAAA2K85WwAAAAADqwNVAAAACAACAAAAAAAAAAEAAAPA/8AAAAQAAAAAAAOrAAEAAAAAAAAAAAAAAAAAAAALBAAAAAAAAAAAAAAAAgAAAAQAAWIEAAFiBAAA4gQAAOIEAABVBAAAVQQAAOIAAAAAAAoAFAAeAEQAagCqAOoBngJkApoAAQAAAAsAigADAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABAAcAAAABAAAAAAACAAcAYAABAAAAAAADAAcANgABAAAAAAAEAAcAdQABAAAAAAAFAAsAFQABAAAAAAAGAAcASwABAAAAAAAKABoAigADAAEECQABAA4ABwADAAEECQACAA4AZwADAAEECQADAA4APQADAAEECQAEAA4AfAADAAEECQAFABYAIAADAAEECQAGAA4AUgADAAEECQAKADQApGZjaWNvbnMAZgBjAGkAYwBvAG4Ac1ZlcnNpb24gMS4wAFYAZQByAHMAaQBvAG4AIAAxAC4AMGZjaWNvbnMAZgBjAGkAYwBvAG4Ac2ZjaWNvbnMAZgBjAGkAYwBvAG4Ac1JlZ3VsYXIAUgBlAGcAdQBsAGEAcmZjaWNvbnMAZgBjAGkAYwBvAG4Ac0ZvbnQgZ2VuZXJhdGVkIGJ5IEljb01vb24uAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=") format('truetype');font-weight:400;font-style:normal}.fc-icon{width:1em;height:1em;-webkit-user-select:none;user-select:none;font-family:fcicons!important;speak:none;font-style:normal;font-variant:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fc-icon-chevron-left:before{content:"\e900"}.fc-icon-chevron-right:before{content:"\e901"}.fc-icon-chevrons-left:before{content:"\e902"}.fc-icon-chevrons-right:before{content:"\e903"}.fc-icon-minus-square:before{content:"\e904"}.fc-icon-plus-square:before{content:"\e905"}.fc-icon-x:before{content:"\e906"}.fc .fc-button{overflow:visible;text-transform:none;margin:0;font-family:inherit}.fc .fc-button::-moz-focus-inner{padding:0;border-style:none}.fc .fc-button{-webkit-appearance:button;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.4em .65em;font-size:1em;line-height:1.5;border-radius:.25em}.fc .fc-button:focus{outline:0;box-shadow:0 0 0 .2rem rgba(44,62,80,.25)}.fc .fc-button-primary:focus,.fc .fc-button-primary:not(:disabled).fc-button-active:focus,.fc .fc-button-primary:not(:disabled):active:focus{box-shadow:0 0 0 .2rem rgba(76,91,106,.5)}.fc .fc-button:disabled{opacity:.65}.fc .fc-button-primary{color:#fff;color:var(--fc-button-text-color,#fff);background-color:#2C3E50;background-color:var(--fc-button-bg-color,#2C3E50);border-color:#2C3E50;border-color:var(--fc-button-border-color,#2C3E50)}.fc .fc-button-primary:hover{color:#fff;color:var(--fc-button-text-color,#fff);background-color:#1e2b37;background-color:var(--fc-button-hover-bg-color,#1e2b37);border-color:#1a252f;border-color:var(--fc-button-hover-border-color,#1a252f)}.fc .fc-button-primary:disabled{color:#fff;color:var(--fc-button-text-color,#fff);background-color:#2C3E50;background-color:var(--fc-button-bg-color,#2C3E50);border-color:#2C3E50;border-color:var(--fc-button-border-color,#2C3E50)}.fc .fc-button-primary:not(:disabled).fc-button-active,.fc .fc-button-primary:not(:disabled):active{color:#fff;color:var(--fc-button-text-color,#fff);background-color:#1a252f;background-color:var(--fc-button-active-bg-color,#1a252f);border-color:#151e27;border-color:var(--fc-button-active-border-color,#151e27)}.fc .fc-button .fc-icon{font-size:1.5em}.fc .fc-button-group{position:relative;display:inline-flex}.fc .fc-button-group>.fc-button{position:relative;flex:1 1 auto}.fc .fc-button-group>.fc-button.fc-button-active,.fc .fc-button-group>.fc-button:active,.fc .fc-button-group>.fc-button:focus,.fc .fc-button-group>.fc-button:hover{z-index:1}.fc-direction-ltr .fc-button-group>.fc-button:not(:first-child){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}.fc-direction-ltr .fc-button-group>.fc-button:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.fc-direction-rtl .fc-button-group>.fc-button:not(:first-child){margin-right:-1px;border-top-right-radius:0;border-bottom-right-radius:0}.fc-direction-rtl .fc-button-group>.fc-button:not(:last-child){border-top-left-radius:0;border-bottom-left-radius:0}.fc .fc-toolbar{display:flex;justify-content:space-between;align-items:center}.fc .fc-toolbar.fc-header-toolbar{margin-bottom:1.5em}.fc .fc-toolbar.fc-footer-toolbar{margin-top:1.5em}.fc .fc-toolbar-title{font-size:1.75em;margin:0}.fc-direction-ltr .fc-toolbar>*>:not(:first-child){margin-left:.75em}.fc-direction-rtl .fc-toolbar>*>:not(:first-child){margin-right:.75em}.fc-direction-rtl .fc-toolbar-ltr{flex-direction:row-reverse}.fc .fc-scroller{-webkit-overflow-scrolling:touch;position:relative}.fc .fc-scroller-liquid{height:100%}.fc .fc-scroller-liquid-absolute{position:absolute;top:0;right:0;left:0;bottom:0}.fc .fc-scroller-harness{position:relative;overflow:hidden;direction:ltr}.fc .fc-scroller-harness-liquid{height:100%}.fc-direction-rtl .fc-scroller-harness>.fc-scroller{direction:rtl}.fc-theme-standard .fc-scrollgrid{border:1px solid #ddd;border:1px solid var(--fc-border-color,#ddd)}.fc .fc-scrollgrid,.fc .fc-scrollgrid-section-footer>*,.fc .fc-scrollgrid-section-header>*{border-bottom-width:0}.fc .fc-scrollgrid,.fc .fc-scrollgrid table{width:100%;table-layout:fixed}.fc .fc-scrollgrid table{border-top-style:hidden;border-left-style:hidden;border-right-style:hidden}.fc .fc-scrollgrid{border-collapse:separate;border-right-width:0}.fc .fc-scrollgrid-liquid{height:100%}.fc .fc-scrollgrid-section,.fc .fc-scrollgrid-section table,.fc .fc-scrollgrid-section>td{height:1px}.fc .fc-scrollgrid-section-liquid>td{height:100%}.fc .fc-scrollgrid-section>*{border-top-width:0;border-left-width:0}.fc .fc-scrollgrid-section-body table,.fc .fc-scrollgrid-section-footer table{border-bottom-style:hidden}.fc .fc-scrollgrid-section-sticky>*{background:var(--fc-page-bg-color,#fff);position:sticky;z-index:3}.fc .fc-scrollgrid-section-header.fc-scrollgrid-section-sticky>*{top:0}.fc .fc-scrollgrid-section-footer.fc-scrollgrid-section-sticky>*{bottom:0}.fc .fc-scrollgrid-sticky-shim{height:1px;margin-bottom:-1px}.fc-sticky{position:sticky}.fc .fc-view-harness{flex-grow:1;position:relative}.fc .fc-bg-event,.fc .fc-highlight,.fc .fc-non-business,.fc .fc-view-harness-active>.fc-view{position:absolute;top:0;left:0;right:0;bottom:0}.fc .fc-col-header-cell-cushion{display:inline-block;padding:2px 4px}.fc .fc-non-business{background:rgba(215,215,215,.3);background:var(--fc-non-business-color,rgba(215,215,215,.3))}.fc .fc-bg-event{background:var(--fc-bg-event-color,#8fdf82);opacity:.3;opacity:var(--fc-bg-event-opacity,.3)}.fc .fc-bg-event .fc-event-title{margin:.5em;font-size:.85em;font-size:var(--fc-small-font-size,.85em);font-style:italic}.fc .fc-highlight{background:rgba(188,232,241,.3);background:var(--fc-highlight-color,rgba(188,232,241,.3))}.fc .fc-cell-shaded,.fc .fc-day-disabled{background:rgba(208,208,208,.3);background:var(--fc-neutral-bg-color,rgba(208,208,208,.3))}.fc-event .fc-event-main{position:relative;z-index:2}.fc-event-dragging:not(.fc-event-selected){opacity:.75}.fc-event-dragging.fc-event-selected{box-shadow:0 2px 7px rgba(0,0,0,.3)}.fc-event .fc-event-resizer{display:none;position:absolute;z-index:4}.fc-event-selected .fc-event-resizer,.fc-event:hover .fc-event-resizer,.fc-h-event,.fc-v-event{display:block}.fc-event-selected .fc-event-resizer{border-radius:4px;border-radius:calc(var(--fc-event-resizer-dot-total-width,8px)/ 2);border-width:1px;border-width:var(--fc-event-resizer-dot-border-width,1px);width:8px;width:var(--fc-event-resizer-dot-total-width,8px);height:8px;height:var(--fc-event-resizer-dot-total-width,8px);border-style:solid;border-color:inherit;background:var(--fc-page-bg-color,#fff)}.fc-event-selected .fc-event-resizer:before{content:'';position:absolute;top:-20px;left:-20px;right:-20px;bottom:-20px}.fc-event-selected,.fc-event:focus{box-shadow:0 2px 5px rgba(0,0,0,.2)}.fc-event-selected:before,.fc-event:focus:before{content:"";position:absolute;z-index:3;top:0;left:0;right:0;bottom:0}.fc-event-selected:after,.fc-event:focus:after{content:"";background:rgba(0,0,0,.25);background:var(--fc-event-selected-overlay-color,rgba(0,0,0,.25));position:absolute;z-index:1;top:-1px;left:-1px;right:-1px;bottom:-1px}.fc-h-event{border:1px solid #3788d8;border:1px solid var(--fc-event-border-color,#3788d8);background-color:#3788d8;background-color:var(--fc-event-bg-color,#3788d8)}.fc-h-event .fc-event-main{color:#fff;color:var(--fc-event-text-color,#fff)}.fc-h-event .fc-event-main-frame{display:flex}.fc-h-event .fc-event-time{max-width:100%;overflow:hidden}.fc-h-event .fc-event-title-container{flex-grow:1;flex-shrink:1;min-width:0}.fc-h-event .fc-event-title{display:inline-block;vertical-align:top;left:0;right:0;max-width:100%;overflow:hidden}.fc-h-event.fc-event-selected:before{top:-10px;bottom:-10px}.fc-direction-ltr .fc-daygrid-block-event:not(.fc-event-start),.fc-direction-rtl .fc-daygrid-block-event:not(.fc-event-end){border-top-left-radius:0;border-bottom-left-radius:0;border-left-width:0}.fc-direction-ltr .fc-daygrid-block-event:not(.fc-event-end),.fc-direction-rtl .fc-daygrid-block-event:not(.fc-event-start){border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}.fc-h-event:not(.fc-event-selected) .fc-event-resizer{top:0;bottom:0;width:8px;width:var(--fc-event-resizer-thickness,8px)}.fc-direction-ltr .fc-h-event:not(.fc-event-selected) .fc-event-resizer-start,.fc-direction-rtl .fc-h-event:not(.fc-event-selected) .fc-event-resizer-end{cursor:w-resize;left:-4px;left:calc(-.5 * var(--fc-event-resizer-thickness,8px))}.fc-direction-ltr .fc-h-event:not(.fc-event-selected) .fc-event-resizer-end,.fc-direction-rtl .fc-h-event:not(.fc-event-selected) .fc-event-resizer-start{cursor:e-resize;right:-4px;right:calc(-.5 * var(--fc-event-resizer-thickness,8px))}.fc-h-event.fc-event-selected .fc-event-resizer{top:50%;margin-top:-4px;margin-top:calc(-.5 * var(--fc-event-resizer-dot-total-width,8px))}.fc-direction-ltr .fc-h-event.fc-event-selected .fc-event-resizer-start,.fc-direction-rtl .fc-h-event.fc-event-selected .fc-event-resizer-end{left:-4px;left:calc(-.5 * var(--fc-event-resizer-dot-total-width,8px))}.fc-direction-ltr .fc-h-event.fc-event-selected .fc-event-resizer-end,.fc-direction-rtl .fc-h-event.fc-event-selected .fc-event-resizer-start{right:-4px;right:calc(-.5 * var(--fc-event-resizer-dot-total-width,8px))}.fc .fc-popover{position:absolute;z-index:9999;box-shadow:0 2px 6px rgba(0,0,0,.15)}.fc .fc-popover-header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:3px 4px}.fc .fc-popover-title{margin:0 2px}.fc .fc-popover-close{cursor:pointer;opacity:.65;font-size:1.1em}.fc-theme-standard .fc-popover{border:1px solid #ddd;border:1px solid var(--fc-border-color,#ddd);background:var(--fc-page-bg-color,#fff)}.fc-theme-standard .fc-popover-header{background:rgba(208,208,208,.3);background:var(--fc-neutral-bg-color,rgba(208,208,208,.3))}:root{--fc-daygrid-event-dot-width:8px;--fc-list-event-dot-width:10px;--fc-list-event-hover-bg-color:#f5f5f5}.fc-daygrid-day-events:after,.fc-daygrid-day-events:before,.fc-daygrid-day-frame:after,.fc-daygrid-day-frame:before,.fc-daygrid-event-harness:after,.fc-daygrid-event-harness:before{content:"";clear:both;display:table}.fc .fc-daygrid-body{position:relative;z-index:1}.fc .fc-daygrid-day.fc-day-today{background-color:rgba(255,220,40,.15);background-color:var(--fc-today-bg-color,rgba(255,220,40,.15))}.fc .fc-daygrid-day-frame{position:relative;min-height:100%}.fc .fc-daygrid-day-top{display:flex;flex-direction:row-reverse}.fc .fc-day-other .fc-daygrid-day-top{opacity:.3}.fc .fc-daygrid-day-number{position:relative;z-index:4;padding:4px}.fc .fc-daygrid-day-events{margin-top:1px}.fc .fc-daygrid-body-balanced .fc-daygrid-day-events{position:absolute;left:0;right:0}.fc .fc-daygrid-body-unbalanced .fc-daygrid-day-events{position:relative;min-height:2em}.fc .fc-daygrid-body-natural .fc-daygrid-day-events{margin-bottom:1em}.fc .fc-daygrid-event-harness{position:relative}.fc .fc-daygrid-event-harness-abs{position:absolute;top:0;left:0;right:0}.fc .fc-daygrid-bg-harness{position:absolute;top:0;bottom:0}.fc .fc-daygrid-day-bg .fc-non-business{z-index:1}.fc .fc-daygrid-day-bg .fc-bg-event{z-index:2}.fc .fc-daygrid-day-bg .fc-highlight{z-index:3}.fc .fc-daygrid-event{z-index:6;margin-top:1px}.fc .fc-daygrid-event.fc-event-mirror{z-index:7}.fc .fc-daygrid-day-bottom{font-size:.85em;padding:2px 3px 0}.fc .fc-daygrid-day-bottom:before{content:"";clear:both;display:table}.fc .fc-daygrid-more-link{position:relative;z-index:4;cursor:pointer}.fc .fc-daygrid-week-number{position:absolute;z-index:5;top:0;padding:2px;min-width:1.5em;text-align:center;background-color:rgba(208,208,208,.3);background-color:var(--fc-neutral-bg-color,rgba(208,208,208,.3));color:grey;color:var(--fc-neutral-text-color,grey)}.fc .fc-more-popover .fc-popover-body{min-width:220px;padding:10px}.fc-direction-ltr .fc-daygrid-event.fc-event-start,.fc-direction-rtl .fc-daygrid-event.fc-event-end{margin-left:2px}.fc-direction-ltr .fc-daygrid-event.fc-event-end,.fc-direction-rtl .fc-daygrid-event.fc-event-start{margin-right:2px}.fc-direction-ltr .fc-daygrid-week-number{left:0;border-radius:0 0 3px}.fc-direction-rtl .fc-daygrid-week-number{right:0;border-radius:0 0 0 3px}.fc-liquid-hack .fc-daygrid-day-frame{position:static}.fc-daygrid-event{position:relative;white-space:nowrap;border-radius:3px;font-size:.85em;font-size:var(--fc-small-font-size,.85em)}.fc-daygrid-block-event .fc-event-time{font-weight:700}.fc-daygrid-block-event .fc-event-time,.fc-daygrid-block-event .fc-event-title{padding:1px}.fc-daygrid-dot-event{display:flex;align-items:center;padding:2px 0}.fc-daygrid-dot-event .fc-event-title{flex-grow:1;flex-shrink:1;min-width:0;overflow:hidden;font-weight:700}.fc-daygrid-dot-event.fc-event-mirror,.fc-daygrid-dot-event:hover{background:rgba(0,0,0,.1)}.fc-daygrid-dot-event.fc-event-selected:before{top:-10px;bottom:-10px}.fc-daygrid-event-dot{margin:0 4px;box-sizing:content-box;width:0;height:0;border:4px solid #3788d8;border:calc(var(--fc-daygrid-event-dot-width,8px)/ 2) solid var(--fc-event-border-color,#3788d8);border-radius:4px;border-radius:calc(var(--fc-daygrid-event-dot-width,8px)/ 2)}.fc-direction-ltr .fc-daygrid-event .fc-event-time{margin-right:3px}.fc-direction-rtl .fc-daygrid-event .fc-event-time{margin-left:3px}.fc-v-event{border:1px solid #3788d8;border:1px solid var(--fc-event-border-color,#3788d8);background-color:#3788d8;background-color:var(--fc-event-bg-color,#3788d8)}.fc-v-event .fc-event-main{color:#fff;color:var(--fc-event-text-color,#fff);height:100%}.fc-v-event .fc-event-main-frame{height:100%;display:flex;flex-direction:column}.fc-v-event .fc-event-time{flex-grow:0;flex-shrink:0;max-height:100%;overflow:hidden}.fc-v-event .fc-event-title-container{flex-grow:1;flex-shrink:1;min-height:0}.fc-v-event .fc-event-title{top:0;bottom:0;max-height:100%;overflow:hidden}.fc-v-event:not(.fc-event-start){border-top-width:0;border-top-left-radius:0;border-top-right-radius:0}.fc-v-event:not(.fc-event-end){border-bottom-width:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.fc-v-event.fc-event-selected:before{left:-10px;right:-10px}.fc-v-event .fc-event-resizer-start{cursor:n-resize}.fc-v-event .fc-event-resizer-end{cursor:s-resize}.fc-v-event:not(.fc-event-selected) .fc-event-resizer{height:8px;height:var(--fc-event-resizer-thickness,8px);left:0;right:0}.fc-v-event:not(.fc-event-selected) .fc-event-resizer-start{top:-4px;top:calc(var(--fc-event-resizer-thickness,8px)/ -2)}.fc-v-event:not(.fc-event-selected) .fc-event-resizer-end{bottom:-4px;bottom:calc(var(--fc-event-resizer-thickness,8px)/ -2)}.fc-v-event.fc-event-selected .fc-event-resizer{left:50%;margin-left:-4px;margin-left:calc(var(--fc-event-resizer-dot-total-width,8px)/ -2)}.fc-v-event.fc-event-selected .fc-event-resizer-start{top:-4px;top:calc(var(--fc-event-resizer-dot-total-width,8px)/ -2)}.fc-v-event.fc-event-selected .fc-event-resizer-end{bottom:-4px;bottom:calc(var(--fc-event-resizer-dot-total-width,8px)/ -2)}.fc .fc-timegrid .fc-daygrid-body{z-index:2}.fc .fc-timegrid-axis-chunk>table,.fc .fc-timegrid-body,.fc .fc-timegrid-slots{position:relative;z-index:1}.fc .fc-timegrid-divider{padding:0 0 2px}.fc .fc-timegrid-body{min-height:100%}.fc .fc-timegrid-axis-chunk{position:relative}.fc .fc-timegrid-slot{height:1.5em;border-bottom:0}.fc .fc-timegrid-slot:empty:before{content:'\00a0'}.fc .fc-timegrid-slot-minor{border-top-style:dotted}.fc .fc-timegrid-slot-label-cushion{display:inline-block;white-space:nowrap}.fc .fc-timegrid-axis-cushion,.fc .fc-timegrid-slot-label-cushion{padding:0 4px}.fc .fc-timegrid-axis-frame-liquid{height:100%}.fc .fc-timegrid-axis-frame{overflow:hidden;display:flex;align-items:center;justify-content:flex-end}.fc .fc-timegrid-axis-cushion{max-width:60px;flex-shrink:0}.fc-direction-ltr .fc-timegrid-slot-label-frame{text-align:right}.fc-direction-rtl .fc-timegrid-slot-label-frame{text-align:left}.fc-liquid-hack .fc-timegrid-axis-frame-liquid{height:auto;position:absolute;top:0;right:0;bottom:0;left:0}.fc .fc-timegrid-col.fc-day-today{background-color:rgba(255,220,40,.15);background-color:var(--fc-today-bg-color,rgba(255,220,40,.15))}.fc .fc-timegrid-col-frame{min-height:100%;position:relative}.fc-media-screen.fc-liquid-hack .fc-timegrid-col-frame{height:auto;position:absolute;top:0;right:0;bottom:0;left:0}.fc-media-screen .fc-timegrid-cols{position:absolute;top:0;left:0;right:0;bottom:0}.fc-media-screen .fc-timegrid-cols>table{height:100%}.fc-media-screen .fc-timegrid-col-bg,.fc-media-screen .fc-timegrid-col-events,.fc-media-screen .fc-timegrid-now-indicator-container{position:absolute;top:0;left:0;right:0}.fc .fc-timegrid-col-bg{z-index:2}.fc .fc-timegrid-col-bg .fc-non-business{z-index:1}.fc .fc-timegrid-col-bg .fc-bg-event{z-index:2}.fc .fc-timegrid-col-bg .fc-highlight,.fc .fc-timegrid-col-events{z-index:3}.fc .fc-timegrid-bg-harness{position:absolute;left:0;right:0}.fc .fc-timegrid-now-indicator-container{bottom:0;overflow:hidden}.fc-direction-ltr .fc-timegrid-col-events{margin:0 2.5% 0 2px}.fc-direction-rtl .fc-timegrid-col-events{margin:0 2px 0 2.5%}.fc-timegrid-event-harness{position:absolute}.fc-timegrid-event-harness>.fc-timegrid-event{position:absolute;top:0;bottom:0;left:0;right:0}.fc-timegrid-event-harness-inset .fc-timegrid-event,.fc-timegrid-event.fc-event-mirror,.fc-timegrid-more-link{box-shadow:0 0 0 1px #fff;box-shadow:0 0 0 1px var(--fc-page-bg-color,#fff)}.fc-timegrid-event,.fc-timegrid-more-link{font-size:.85em;font-size:var(--fc-small-font-size,.85em);border-radius:3px}.fc-timegrid-event{margin-bottom:1px}.fc-timegrid-event .fc-event-main{padding:1px 1px 0}.fc-timegrid-event .fc-event-time{white-space:nowrap;font-size:.85em;font-size:var(--fc-small-font-size,.85em);margin-bottom:1px}.fc-timegrid-event-short .fc-event-main-frame{flex-direction:row;overflow:hidden}.fc-timegrid-event-short .fc-event-time:after{content:'\00a0-\00a0'}.fc-timegrid-event-short .fc-event-title{font-size:.85em;font-size:var(--fc-small-font-size,.85em)}.fc-timegrid-more-link{position:absolute;z-index:9999;color:inherit;color:var(--fc-more-link-text-color,inherit);background:var(--fc-more-link-bg-color,#d0d0d0);cursor:pointer;margin-bottom:1px}.fc-timegrid-more-link-inner{padding:3px 2px;top:0}.fc-direction-ltr .fc-timegrid-more-link{right:0}.fc-direction-rtl .fc-timegrid-more-link{left:0}.fc .fc-timegrid-now-indicator-line{position:absolute;z-index:4;left:0;right:0;border-style:solid;border-color:red;border-color:var(--fc-now-indicator-color,red);border-width:1px 0 0}.fc .fc-timegrid-now-indicator-arrow{position:absolute;z-index:4;margin-top:-5px;border-style:solid;border-color:red;border-color:var(--fc-now-indicator-color,red)}.fc-direction-ltr .fc-timegrid-now-indicator-arrow{left:0;border-width:5px 0 5px 6px;border-top-color:transparent;border-bottom-color:transparent}.fc-direction-rtl .fc-timegrid-now-indicator-arrow{right:0;border-width:5px 6px 5px 0;border-top-color:transparent;border-bottom-color:transparent}.fc-theme-standard .fc-list{border:1px solid #ddd;border:1px solid var(--fc-border-color,#ddd)}.fc .fc-list-empty{background-color:rgba(208,208,208,.3);background-color:var(--fc-neutral-bg-color,rgba(208,208,208,.3));height:100%;display:flex;justify-content:center;align-items:center}.fc .fc-list-empty-cushion{margin:5em 0}.fc .fc-list-table{width:100%;border-style:hidden}.fc .fc-list-table tr>*{border-left:0;border-right:0}.fc .fc-list-sticky .fc-list-day>*{position:sticky;top:0;background:var(--fc-page-bg-color,#fff)}.fc .fc-list-table thead{position:absolute;left:-10000px}.fc .fc-list-table tbody>tr:first-child th{border-top:0}.fc .fc-list-table th{padding:0}.fc .fc-list-day-cushion,.fc .fc-list-table td{padding:8px 14px}.fc .fc-list-day-cushion:after{content:"";clear:both;display:table}.fc-theme-standard .fc-list-day-cushion{background-color:rgba(208,208,208,.3);background-color:var(--fc-neutral-bg-color,rgba(208,208,208,.3))}.fc-direction-ltr .fc-list-day-text,.fc-direction-rtl .fc-list-day-side-text{float:left}.fc-direction-ltr .fc-list-day-side-text,.fc-direction-rtl .fc-list-day-text{float:right}.fc-direction-ltr .fc-list-table .fc-list-event-graphic{padding-right:0}.fc-direction-rtl .fc-list-table .fc-list-event-graphic{padding-left:0}.fc .fc-list-event.fc-event-forced-url{cursor:pointer}.fc .fc-list-event:hover td{background-color:#f5f5f5;background-color:var(--fc-list-event-hover-bg-color,#f5f5f5)}.fc .fc-list-event-graphic,.fc .fc-list-event-time{white-space:nowrap;width:1px}.fc .fc-list-event-dot{display:inline-block;box-sizing:content-box;width:0;height:0;border:5px solid #3788d8;border:calc(var(--fc-list-event-dot-width,10px)/ 2) solid var(--fc-event-border-color,#3788d8);border-radius:5px;border-radius:calc(var(--fc-list-event-dot-width,10px)/ 2)}.fc .fc-list-event-title a{color:inherit}.fc .fc-list-event.fc-event-forced-url:hover a{text-decoration:underline}.fc-theme-bootstrap a:not([href]){color:inherit}.fc-theme-bootstrap5 a:not([href]){color:inherit;text-decoration:inherit}.fc-theme-bootstrap5 .fc-list,.fc-theme-bootstrap5 .fc-scrollgrid,.fc-theme-bootstrap5 td,.fc-theme-bootstrap5 th{border:1px solid var(--bs-gray-400)}.fc-theme-bootstrap5 .fc-scrollgrid{border-right-width:0;border-bottom-width:0}.fc-theme-bootstrap5-shaded{background-color:var(--bs-gray-200)}
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(/assets/material-icons-regular-d7f083631d2357fe2c2c75d353cb1d6deaceb0249e07d00a59f9cdffbbccf35a.woff2) format('woff2'),
    url(/assets/material-icons-regular-a9f2f380dd4aab1414f47620e68d9bf7d45cece149be7fec8a94e532e1660cb1.woff) format('woff');
}

/* Base class */
.material-icons,
.mi {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  font-feature-settings: "liga";
  -moz-osx-font-smoothing: grayscale;
}

.material-icons.completed {
  color: #FFFFFF;
  background-color: #00BD13;
  border: 1px solid #00BD13;
  border-radius: 25px;
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  padding-top: 2px;
  padding-left: 2px;
}

@font-face {
  font-family: 'Material Icons Outlined';
  font-style: normal;
  font-weight: 400;
  src: local('Material Icons Outlined'),
    local('MaterialIconsOutlined-Regular '),
    url(/assets/material-icons-outlined-d3e78343a497af3765b6667951b118e5306aa9638c23d1c75981201fa96bcb67.woff2) format('woff2'),
    url(/assets/material-icons-outlined-a25d8d4d249395ba17511661070b904077b78c2561d044014aadab2217c9e191.woff) format('woff');
}

/* Add outlined styles */
.material-icons.outlined,
.mi.outlined {
  font-family: 'Material Icons Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  font-feature-settings: "liga";
  -moz-osx-font-smoothing: grayscale;
}
/*!
Template Name: Dashbyte - Premium Admin & Dashboard Template
Author: Themepixels
Version: 1.0.2
Website: http://themepixels.me/demo/dashbyte
Contact: themepixels@gmail.com
*/@import"https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap";@import"https://fonts.googleapis.com/css2?family=Archivo:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;600&display=swap";/*!
 * Bootstrap  v5.2.3 (https://getbootstrap.com/)
 * Copyright 2011-2022 The Bootstrap Authors
 * Copyright 2011-2022 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */:root{--bs-blue: #0d6efd;--bs-indigo: #6610f2;--bs-purple: #6f42c1;--bs-pink: #ea4c89;--bs-red: #dc3545;--bs-orange: #fd7e14;--bs-yellow: #ffc107;--bs-green: #198754;--bs-teal: #33d685;--bs-cyan: #0dcaf0;--bs-black: #000;--bs-white: #fff;--bs-gray: #6e7985;--bs-gray-dark: #313c47;--bs-gray-100: #f8f9fc;--bs-gray-200: #f3f5f9;--bs-gray-300: #e2e5ec;--bs-gray-400: #ccd2da;--bs-gray-500: #9ea7b1;--bs-gray-600: #6e7985;--bs-gray-700: #41505f;--bs-gray-800: #313c47;--bs-gray-900: #212830;--bs-primary: #506fd9;--bs-secondary: #6e7985;--bs-success: #0cb785;--bs-info: #0dcaf0;--bs-warning: #ffc107;--bs-danger: #dc3545;--bs-light: #f8f9fc;--bs-dark: #212830;--bs-primary-rgb: 80, 111, 217;--bs-secondary-rgb: 110, 121, 133;--bs-success-rgb: 12, 183, 133;--bs-info-rgb: 13, 202, 240;--bs-warning-rgb: 255, 193, 7;--bs-danger-rgb: 220, 53, 69;--bs-light-rgb: 248, 249, 252;--bs-dark-rgb: 33, 40, 48;--bs-white-rgb: 255, 255, 255;--bs-black-rgb: 0, 0, 0;--bs-body-color-rgb: 65, 80, 95;--bs-body-bg-rgb: 251, 252, 254;--bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family: Open Sans, sans-serif;--bs-body-font-size:0.875rem;--bs-body-font-weight: 400;--bs-body-line-height: 1.5;--bs-body-color: #41505f;--bs-body-bg: #fbfcfe;--bs-border-width: 1px;--bs-border-style: solid;--bs-border-color: #e2e5ec;--bs-border-color-translucent: rgba(0, 0, 0, 0.175);--bs-border-radius: 0.25rem;--bs-border-radius-sm: 0.25rem;--bs-border-radius-lg: 0.5rem;--bs-border-radius-xl: 1rem;--bs-border-radius-2xl: 2rem;--bs-border-radius-pill: 50rem;--bs-link-color: #506fd9;--bs-link-hover-color: #4059ae;--bs-code-color: #ea4c89;--bs-highlight-bg: #fff3cd}*,*::before,*::after{box-sizing:border-box}@media(prefers-reduced-motion: no-preference){:root{scroll-behavior:smooth}}body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0)}hr{margin:1rem 0;color:inherit;border:0;border-top:1px solid;opacity:.25}h6,.h6,h5,.h5,h4,.h4,h3,.h3,h2,.h2,h1,.h1{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2}h1,.h1{font-size:calc(1.34375rem + 1.125vw)}@media(min-width: 1200px){h1,.h1{font-size:2.1875rem}}h2,.h2{font-size:calc(1.3rem + 0.6vw)}@media(min-width: 1200px){h2,.h2{font-size:1.75rem}}h3,.h3{font-size:calc(1.278125rem + 0.3375vw)}@media(min-width: 1200px){h3,.h3{font-size:1.53125rem}}h4,.h4{font-size:calc(1.25625rem + 0.075vw)}@media(min-width: 1200px){h4,.h4{font-size:1.3125rem}}h5,.h5{font-size:1.09375rem}h6,.h6{font-size:0.875rem}p{margin-top:0;margin-bottom:1rem}abbr[title]{text-decoration:underline dotted;cursor:help;text-decoration-skip-ink:none}address{margin-bottom:1rem;font-style:normal;line-height:inherit}ol,ul{padding-left:2rem}ol,ul,dl{margin-top:0;margin-bottom:1rem}ol ol,ul ul,ol ul,ul ol{margin-bottom:0}dt{font-weight:700}dd{margin-bottom:.5rem;margin-left:0}blockquote{margin:0 0 1rem}b,strong{font-weight:bolder}small,.small{font-size:0.875em}mark,.mark{padding:.1875em;background-color:var(--bs-highlight-bg)}sub,sup{position:relative;font-size:0.75em;line-height:0;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}a{color:var(--bs-link-color);text-decoration:none}a:hover{color:var(--bs-link-hover-color)}a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none}pre,code,kbd,samp{font-family:var(--bs-font-monospace);font-size:1em}pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:0.875em}pre code{font-size:inherit;color:inherit;word-break:normal}code{font-size:0.875em;color:var(--bs-code-color);word-wrap:break-word}a>code{color:inherit}kbd{padding:.1875rem .375rem;font-size:0.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:.25rem}kbd kbd{padding:0;font-size:1em}figure{margin:0 0 1rem}img,svg{vertical-align:middle}table{caption-side:bottom;border-collapse:collapse}caption{padding-top:.5rem;padding-bottom:.5rem;color:#6e7985;text-align:left}th{text-align:inherit;text-align:-webkit-match-parent}thead,tbody,tfoot,tr,td,th{border-color:inherit;border-style:solid;border-width:0}label{display:inline-block}button{border-radius:0}button:focus:not(:focus-visible){outline:0}input,button,select,optgroup,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit}button,select{text-transform:none}[role=button]{cursor:pointer}select{word-wrap:normal}select:disabled{opacity:1}[list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none !important}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button:not(:disabled),[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled){cursor:pointer}::-moz-focus-inner{padding:0;border-style:none}textarea{resize:vertical}fieldset{min-width:0;padding:0;margin:0;border:0}legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + 0.3vw);line-height:inherit}@media(min-width: 1200px){legend{font-size:1.5rem}}legend+*{clear:left}::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-text,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-year-field{padding:0}::-webkit-inner-spin-button{height:auto}[type=search]{outline-offset:-2px;-webkit-appearance:textfield}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-color-swatch-wrapper{padding:0}::file-selector-button{font:inherit;-webkit-appearance:button}output{display:inline-block}iframe{border:0}summary{display:list-item;cursor:pointer}progress{vertical-align:baseline}[hidden]{display:none !important}.lead{font-size:1.09375rem;font-weight:300}.display-1{font-size:calc(1.625rem + 4.5vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-1{font-size:5rem}}.display-2{font-size:calc(1.575rem + 3.9vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-2{font-size:4.5rem}}.display-3{font-size:calc(1.525rem + 3.3vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-3{font-size:4rem}}.display-4{font-size:calc(1.475rem + 2.7vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-4{font-size:3.5rem}}.display-5{font-size:calc(1.425rem + 2.1vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-5{font-size:3rem}}.display-6{font-size:calc(1.375rem + 1.5vw);font-weight:300;line-height:1.2}@media(min-width: 1200px){.display-6{font-size:2.5rem}}.list-unstyled{padding-left:0;list-style:none}.list-inline{padding-left:0;list-style:none}.list-inline-item{display:inline-block}.list-inline-item:not(:last-child){margin-right:.5rem}.initialism{font-size:0.875em;text-transform:uppercase}.blockquote{margin-bottom:1rem;font-size:1.09375rem}.blockquote>:last-child{margin-bottom:0}.blockquote-footer{margin-top:-1rem;margin-bottom:1rem;font-size:0.875em;color:#6e7985}.blockquote-footer::before{content:"— "}.img-fluid{max-width:100%;height:auto}.img-thumbnail{padding:.25rem;background-color:#fbfcfe;border:1px solid var(--bs-border-color);border-radius:.25rem;max-width:100%;height:auto}.figure{display:inline-block}.figure-img{margin-bottom:.5rem;line-height:1}.figure-caption{font-size:0.875em;color:#6e7985}.container,.container-fluid,.container-xxl,.container-xl,.container-lg,.container-md,.container-sm{--bs-gutter-x: 1.5rem;--bs-gutter-y: 0;width:100%;padding-right:calc(var(--bs-gutter-x)*.5);padding-left:calc(var(--bs-gutter-x)*.5);margin-right:auto;margin-left:auto}@media(min-width: 576px){.container-sm,.container{max-width:540px}}@media(min-width: 768px){.container-md,.container-sm,.container{max-width:720px}}@media(min-width: 992px){.container-lg,.container-md,.container-sm,.container{max-width:960px}}@media(min-width: 1200px){.container-xl,.container-lg,.container-md,.container-sm,.container{max-width:1140px}}@media(min-width: 1400px){.container-xxl,.container-xl,.container-lg,.container-md,.container-sm,.container{max-width:1320px}}.row{--bs-gutter-x: 1.5rem;--bs-gutter-y: 0;display:flex;flex-wrap:wrap;margin-top:calc(-1*var(--bs-gutter-y));margin-right:calc(-0.5*var(--bs-gutter-x));margin-left:calc(-0.5*var(--bs-gutter-x))}.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:calc(var(--bs-gutter-x)*.5);padding-left:calc(var(--bs-gutter-x)*.5);margin-top:var(--bs-gutter-y)}.col{flex:1 0 0%}.row-cols-auto>*{flex:0 0 auto;width:auto}.row-cols-1>*{flex:0 0 auto;width:100%}.row-cols-2>*{flex:0 0 auto;width:50%}.row-cols-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-4>*{flex:0 0 auto;width:25%}.row-cols-5>*{flex:0 0 auto;width:20%}.row-cols-6>*{flex:0 0 auto;width:16.6666666667%}.col-auto{flex:0 0 auto;width:auto}.col-1{flex:0 0 auto;width:8.33333333%}.col-2{flex:0 0 auto;width:16.66666667%}.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.33333333%}.col-5{flex:0 0 auto;width:41.66666667%}.col-6{flex:0 0 auto;width:50%}.col-7{flex:0 0 auto;width:58.33333333%}.col-8{flex:0 0 auto;width:66.66666667%}.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.33333333%}.col-11{flex:0 0 auto;width:91.66666667%}.col-12{flex:0 0 auto;width:100%}.offset-1{margin-left:8.33333333%}.offset-2{margin-left:16.66666667%}.offset-3{margin-left:25%}.offset-4{margin-left:33.33333333%}.offset-5{margin-left:41.66666667%}.offset-6{margin-left:50%}.offset-7{margin-left:58.33333333%}.offset-8{margin-left:66.66666667%}.offset-9{margin-left:75%}.offset-10{margin-left:83.33333333%}.offset-11{margin-left:91.66666667%}.g-0,.gx-0{--bs-gutter-x: 0}.g-0,.gy-0{--bs-gutter-y: 0}.g-1,.gx-1{--bs-gutter-x: 0.25rem}.g-1,.gy-1{--bs-gutter-y: 0.25rem}.g-2,.gx-2{--bs-gutter-x: 0.5rem}.g-2,.gy-2{--bs-gutter-y: 0.5rem}.g-3,.gx-3{--bs-gutter-x: 1rem}.g-3,.gy-3{--bs-gutter-y: 1rem}.g-4,.gx-4{--bs-gutter-x: 1.5rem}.g-4,.gy-4{--bs-gutter-y: 1.5rem}.g-5,.gx-5{--bs-gutter-x: 3rem}.g-5,.gy-5{--bs-gutter-y: 3rem}@media(min-width: 576px){.col-sm{flex:1 0 0%}.row-cols-sm-auto>*{flex:0 0 auto;width:auto}.row-cols-sm-1>*{flex:0 0 auto;width:100%}.row-cols-sm-2>*{flex:0 0 auto;width:50%}.row-cols-sm-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-sm-4>*{flex:0 0 auto;width:25%}.row-cols-sm-5>*{flex:0 0 auto;width:20%}.row-cols-sm-6>*{flex:0 0 auto;width:16.6666666667%}.col-sm-auto{flex:0 0 auto;width:auto}.col-sm-1{flex:0 0 auto;width:8.33333333%}.col-sm-2{flex:0 0 auto;width:16.66666667%}.col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.33333333%}.col-sm-5{flex:0 0 auto;width:41.66666667%}.col-sm-6{flex:0 0 auto;width:50%}.col-sm-7{flex:0 0 auto;width:58.33333333%}.col-sm-8{flex:0 0 auto;width:66.66666667%}.col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.33333333%}.col-sm-11{flex:0 0 auto;width:91.66666667%}.col-sm-12{flex:0 0 auto;width:100%}.offset-sm-0{margin-left:0}.offset-sm-1{margin-left:8.33333333%}.offset-sm-2{margin-left:16.66666667%}.offset-sm-3{margin-left:25%}.offset-sm-4{margin-left:33.33333333%}.offset-sm-5{margin-left:41.66666667%}.offset-sm-6{margin-left:50%}.offset-sm-7{margin-left:58.33333333%}.offset-sm-8{margin-left:66.66666667%}.offset-sm-9{margin-left:75%}.offset-sm-10{margin-left:83.33333333%}.offset-sm-11{margin-left:91.66666667%}.g-sm-0,.gx-sm-0{--bs-gutter-x: 0}.g-sm-0,.gy-sm-0{--bs-gutter-y: 0}.g-sm-1,.gx-sm-1{--bs-gutter-x: 0.25rem}.g-sm-1,.gy-sm-1{--bs-gutter-y: 0.25rem}.g-sm-2,.gx-sm-2{--bs-gutter-x: 0.5rem}.g-sm-2,.gy-sm-2{--bs-gutter-y: 0.5rem}.g-sm-3,.gx-sm-3{--bs-gutter-x: 1rem}.g-sm-3,.gy-sm-3{--bs-gutter-y: 1rem}.g-sm-4,.gx-sm-4{--bs-gutter-x: 1.5rem}.g-sm-4,.gy-sm-4{--bs-gutter-y: 1.5rem}.g-sm-5,.gx-sm-5{--bs-gutter-x: 3rem}.g-sm-5,.gy-sm-5{--bs-gutter-y: 3rem}}@media(min-width: 768px){.col-md{flex:1 0 0%}.row-cols-md-auto>*{flex:0 0 auto;width:auto}.row-cols-md-1>*{flex:0 0 auto;width:100%}.row-cols-md-2>*{flex:0 0 auto;width:50%}.row-cols-md-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-md-4>*{flex:0 0 auto;width:25%}.row-cols-md-5>*{flex:0 0 auto;width:20%}.row-cols-md-6>*{flex:0 0 auto;width:16.6666666667%}.col-md-auto{flex:0 0 auto;width:auto}.col-md-1{flex:0 0 auto;width:8.33333333%}.col-md-2{flex:0 0 auto;width:16.66666667%}.col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.33333333%}.col-md-5{flex:0 0 auto;width:41.66666667%}.col-md-6{flex:0 0 auto;width:50%}.col-md-7{flex:0 0 auto;width:58.33333333%}.col-md-8{flex:0 0 auto;width:66.66666667%}.col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.33333333%}.col-md-11{flex:0 0 auto;width:91.66666667%}.col-md-12{flex:0 0 auto;width:100%}.offset-md-0{margin-left:0}.offset-md-1{margin-left:8.33333333%}.offset-md-2{margin-left:16.66666667%}.offset-md-3{margin-left:25%}.offset-md-4{margin-left:33.33333333%}.offset-md-5{margin-left:41.66666667%}.offset-md-6{margin-left:50%}.offset-md-7{margin-left:58.33333333%}.offset-md-8{margin-left:66.66666667%}.offset-md-9{margin-left:75%}.offset-md-10{margin-left:83.33333333%}.offset-md-11{margin-left:91.66666667%}.g-md-0,.gx-md-0{--bs-gutter-x: 0}.g-md-0,.gy-md-0{--bs-gutter-y: 0}.g-md-1,.gx-md-1{--bs-gutter-x: 0.25rem}.g-md-1,.gy-md-1{--bs-gutter-y: 0.25rem}.g-md-2,.gx-md-2{--bs-gutter-x: 0.5rem}.g-md-2,.gy-md-2{--bs-gutter-y: 0.5rem}.g-md-3,.gx-md-3{--bs-gutter-x: 1rem}.g-md-3,.gy-md-3{--bs-gutter-y: 1rem}.g-md-4,.gx-md-4{--bs-gutter-x: 1.5rem}.g-md-4,.gy-md-4{--bs-gutter-y: 1.5rem}.g-md-5,.gx-md-5{--bs-gutter-x: 3rem}.g-md-5,.gy-md-5{--bs-gutter-y: 3rem}}@media(min-width: 992px){.col-lg{flex:1 0 0%}.row-cols-lg-auto>*{flex:0 0 auto;width:auto}.row-cols-lg-1>*{flex:0 0 auto;width:100%}.row-cols-lg-2>*{flex:0 0 auto;width:50%}.row-cols-lg-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-lg-4>*{flex:0 0 auto;width:25%}.row-cols-lg-5>*{flex:0 0 auto;width:20%}.row-cols-lg-6>*{flex:0 0 auto;width:16.6666666667%}.col-lg-auto{flex:0 0 auto;width:auto}.col-lg-1{flex:0 0 auto;width:8.33333333%}.col-lg-2{flex:0 0 auto;width:16.66666667%}.col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.33333333%}.col-lg-5{flex:0 0 auto;width:41.66666667%}.col-lg-6{flex:0 0 auto;width:50%}.col-lg-7{flex:0 0 auto;width:58.33333333%}.col-lg-8{flex:0 0 auto;width:66.66666667%}.col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.33333333%}.col-lg-11{flex:0 0 auto;width:91.66666667%}.col-lg-12{flex:0 0 auto;width:100%}.offset-lg-0{margin-left:0}.offset-lg-1{margin-left:8.33333333%}.offset-lg-2{margin-left:16.66666667%}.offset-lg-3{margin-left:25%}.offset-lg-4{margin-left:33.33333333%}.offset-lg-5{margin-left:41.66666667%}.offset-lg-6{margin-left:50%}.offset-lg-7{margin-left:58.33333333%}.offset-lg-8{margin-left:66.66666667%}.offset-lg-9{margin-left:75%}.offset-lg-10{margin-left:83.33333333%}.offset-lg-11{margin-left:91.66666667%}.g-lg-0,.gx-lg-0{--bs-gutter-x: 0}.g-lg-0,.gy-lg-0{--bs-gutter-y: 0}.g-lg-1,.gx-lg-1{--bs-gutter-x: 0.25rem}.g-lg-1,.gy-lg-1{--bs-gutter-y: 0.25rem}.g-lg-2,.gx-lg-2{--bs-gutter-x: 0.5rem}.g-lg-2,.gy-lg-2{--bs-gutter-y: 0.5rem}.g-lg-3,.gx-lg-3{--bs-gutter-x: 1rem}.g-lg-3,.gy-lg-3{--bs-gutter-y: 1rem}.g-lg-4,.gx-lg-4{--bs-gutter-x: 1.5rem}.g-lg-4,.gy-lg-4{--bs-gutter-y: 1.5rem}.g-lg-5,.gx-lg-5{--bs-gutter-x: 3rem}.g-lg-5,.gy-lg-5{--bs-gutter-y: 3rem}}@media(min-width: 1200px){.col-xl{flex:1 0 0%}.row-cols-xl-auto>*{flex:0 0 auto;width:auto}.row-cols-xl-1>*{flex:0 0 auto;width:100%}.row-cols-xl-2>*{flex:0 0 auto;width:50%}.row-cols-xl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xl-4>*{flex:0 0 auto;width:25%}.row-cols-xl-5>*{flex:0 0 auto;width:20%}.row-cols-xl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xl-auto{flex:0 0 auto;width:auto}.col-xl-1{flex:0 0 auto;width:8.33333333%}.col-xl-2{flex:0 0 auto;width:16.66666667%}.col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.33333333%}.col-xl-5{flex:0 0 auto;width:41.66666667%}.col-xl-6{flex:0 0 auto;width:50%}.col-xl-7{flex:0 0 auto;width:58.33333333%}.col-xl-8{flex:0 0 auto;width:66.66666667%}.col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.33333333%}.col-xl-11{flex:0 0 auto;width:91.66666667%}.col-xl-12{flex:0 0 auto;width:100%}.offset-xl-0{margin-left:0}.offset-xl-1{margin-left:8.33333333%}.offset-xl-2{margin-left:16.66666667%}.offset-xl-3{margin-left:25%}.offset-xl-4{margin-left:33.33333333%}.offset-xl-5{margin-left:41.66666667%}.offset-xl-6{margin-left:50%}.offset-xl-7{margin-left:58.33333333%}.offset-xl-8{margin-left:66.66666667%}.offset-xl-9{margin-left:75%}.offset-xl-10{margin-left:83.33333333%}.offset-xl-11{margin-left:91.66666667%}.g-xl-0,.gx-xl-0{--bs-gutter-x: 0}.g-xl-0,.gy-xl-0{--bs-gutter-y: 0}.g-xl-1,.gx-xl-1{--bs-gutter-x: 0.25rem}.g-xl-1,.gy-xl-1{--bs-gutter-y: 0.25rem}.g-xl-2,.gx-xl-2{--bs-gutter-x: 0.5rem}.g-xl-2,.gy-xl-2{--bs-gutter-y: 0.5rem}.g-xl-3,.gx-xl-3{--bs-gutter-x: 1rem}.g-xl-3,.gy-xl-3{--bs-gutter-y: 1rem}.g-xl-4,.gx-xl-4{--bs-gutter-x: 1.5rem}.g-xl-4,.gy-xl-4{--bs-gutter-y: 1.5rem}.g-xl-5,.gx-xl-5{--bs-gutter-x: 3rem}.g-xl-5,.gy-xl-5{--bs-gutter-y: 3rem}}@media(min-width: 1400px){.col-xxl{flex:1 0 0%}.row-cols-xxl-auto>*{flex:0 0 auto;width:auto}.row-cols-xxl-1>*{flex:0 0 auto;width:100%}.row-cols-xxl-2>*{flex:0 0 auto;width:50%}.row-cols-xxl-3>*{flex:0 0 auto;width:33.3333333333%}.row-cols-xxl-4>*{flex:0 0 auto;width:25%}.row-cols-xxl-5>*{flex:0 0 auto;width:20%}.row-cols-xxl-6>*{flex:0 0 auto;width:16.6666666667%}.col-xxl-auto{flex:0 0 auto;width:auto}.col-xxl-1{flex:0 0 auto;width:8.33333333%}.col-xxl-2{flex:0 0 auto;width:16.66666667%}.col-xxl-3{flex:0 0 auto;width:25%}.col-xxl-4{flex:0 0 auto;width:33.33333333%}.col-xxl-5{flex:0 0 auto;width:41.66666667%}.col-xxl-6{flex:0 0 auto;width:50%}.col-xxl-7{flex:0 0 auto;width:58.33333333%}.col-xxl-8{flex:0 0 auto;width:66.66666667%}.col-xxl-9{flex:0 0 auto;width:75%}.col-xxl-10{flex:0 0 auto;width:83.33333333%}.col-xxl-11{flex:0 0 auto;width:91.66666667%}.col-xxl-12{flex:0 0 auto;width:100%}.offset-xxl-0{margin-left:0}.offset-xxl-1{margin-left:8.33333333%}.offset-xxl-2{margin-left:16.66666667%}.offset-xxl-3{margin-left:25%}.offset-xxl-4{margin-left:33.33333333%}.offset-xxl-5{margin-left:41.66666667%}.offset-xxl-6{margin-left:50%}.offset-xxl-7{margin-left:58.33333333%}.offset-xxl-8{margin-left:66.66666667%}.offset-xxl-9{margin-left:75%}.offset-xxl-10{margin-left:83.33333333%}.offset-xxl-11{margin-left:91.66666667%}.g-xxl-0,.gx-xxl-0{--bs-gutter-x: 0}.g-xxl-0,.gy-xxl-0{--bs-gutter-y: 0}.g-xxl-1,.gx-xxl-1{--bs-gutter-x: 0.25rem}.g-xxl-1,.gy-xxl-1{--bs-gutter-y: 0.25rem}.g-xxl-2,.gx-xxl-2{--bs-gutter-x: 0.5rem}.g-xxl-2,.gy-xxl-2{--bs-gutter-y: 0.5rem}.g-xxl-3,.gx-xxl-3{--bs-gutter-x: 1rem}.g-xxl-3,.gy-xxl-3{--bs-gutter-y: 1rem}.g-xxl-4,.gx-xxl-4{--bs-gutter-x: 1.5rem}.g-xxl-4,.gy-xxl-4{--bs-gutter-y: 1.5rem}.g-xxl-5,.gx-xxl-5{--bs-gutter-x: 3rem}.g-xxl-5,.gy-xxl-5{--bs-gutter-y: 3rem}}.table{--bs-table-color: var(--bs-body-color);--bs-table-bg: transparent;--bs-table-border-color: var(--bs-border-color);--bs-table-accent-bg: transparent;--bs-table-striped-color: var(--bs-body-color);--bs-table-striped-bg: rgba(0, 0, 0, 0.05);--bs-table-active-color: var(--bs-body-color);--bs-table-active-bg: rgba(0, 0, 0, 0.1);--bs-table-hover-color: var(--bs-body-color);--bs-table-hover-bg: rgba(0, 0, 0, 0.075);width:100%;margin-bottom:1rem;color:var(--bs-table-color);vertical-align:top;border-color:var(--bs-table-border-color)}.table>:not(caption)>*>*{padding:.5rem .5rem;background-color:var(--bs-table-bg);border-bottom-width:1px;box-shadow:inset 0 0 0 9999px var(--bs-table-accent-bg)}.table>tbody{vertical-align:inherit}.table>thead{vertical-align:bottom}.table-group-divider{border-top:2px solid currentcolor}.caption-top{caption-side:top}.table-sm>:not(caption)>*>*{padding:.25rem .25rem}.table-bordered>:not(caption)>*{border-width:1px 0}.table-bordered>:not(caption)>*>*{border-width:0 1px}.table-borderless>:not(caption)>*>*{border-bottom-width:0}.table-borderless>:not(:first-child){border-top-width:0}.table-striped>tbody>tr:nth-of-type(odd)>*{--bs-table-accent-bg: var(--bs-table-striped-bg);color:var(--bs-table-striped-color)}.table-striped-columns>:not(caption)>tr>:nth-child(even){--bs-table-accent-bg: var(--bs-table-striped-bg);color:var(--bs-table-striped-color)}.table-active{--bs-table-accent-bg: var(--bs-table-active-bg);color:var(--bs-table-active-color)}.table-hover>tbody>tr:hover>*{--bs-table-accent-bg: var(--bs-table-hover-bg);color:var(--bs-table-hover-color)}.table-primary{--bs-table-color: #000;--bs-table-bg: #dce2f7;--bs-table-border-color: #c6cbde;--bs-table-striped-bg: #d1d7eb;--bs-table-striped-color: #000;--bs-table-active-bg: #c6cbde;--bs-table-active-color: #000;--bs-table-hover-bg: #ccd1e4;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-secondary{--bs-table-color: #000;--bs-table-bg: #e2e4e7;--bs-table-border-color: #cbcdd0;--bs-table-striped-bg: #d7d9db;--bs-table-striped-color: #000;--bs-table-active-bg: #cbcdd0;--bs-table-active-color: #000;--bs-table-hover-bg: #d1d3d6;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-success{--bs-table-color: #000;--bs-table-bg: #cef1e7;--bs-table-border-color: #b9d9d0;--bs-table-striped-bg: #c4e5db;--bs-table-striped-color: #000;--bs-table-active-bg: #b9d9d0;--bs-table-active-color: #000;--bs-table-hover-bg: #bfdfd6;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-info{--bs-table-color: #000;--bs-table-bg: #cff4fc;--bs-table-border-color: #badce3;--bs-table-striped-bg: #c5e8ef;--bs-table-striped-color: #000;--bs-table-active-bg: #badce3;--bs-table-active-color: #000;--bs-table-hover-bg: #bfe2e9;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-warning{--bs-table-color: #000;--bs-table-bg: #fff3cd;--bs-table-border-color: #e6dbb9;--bs-table-striped-bg: #f2e7c3;--bs-table-striped-color: #000;--bs-table-active-bg: #e6dbb9;--bs-table-active-color: #000;--bs-table-hover-bg: #ece1be;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-danger{--bs-table-color: #000;--bs-table-bg: #f8d7da;--bs-table-border-color: #dfc2c4;--bs-table-striped-bg: #eccccf;--bs-table-striped-color: #000;--bs-table-active-bg: #dfc2c4;--bs-table-active-color: #000;--bs-table-hover-bg: #e5c7ca;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-light{--bs-table-color: #000;--bs-table-bg: #f8f9fc;--bs-table-border-color: #dfe0e3;--bs-table-striped-bg: #ecedef;--bs-table-striped-color: #000;--bs-table-active-bg: #dfe0e3;--bs-table-active-color: #000;--bs-table-hover-bg: #e5e6e9;--bs-table-hover-color: #000;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-dark{--bs-table-color: #fff;--bs-table-bg: #212830;--bs-table-border-color: #373e45;--bs-table-striped-bg: #2c333a;--bs-table-striped-color: #fff;--bs-table-active-bg: #373e45;--bs-table-active-color: #fff;--bs-table-hover-bg: #323840;--bs-table-hover-color: #fff;color:var(--bs-table-color);border-color:var(--bs-table-border-color)}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}@media(max-width: 575.98px){.table-responsive-sm{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width: 767.98px){.table-responsive-md{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width: 991.98px){.table-responsive-lg{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width: 1199.98px){.table-responsive-xl{overflow-x:auto;-webkit-overflow-scrolling:touch}}@media(max-width: 1399.98px){.table-responsive-xxl{overflow-x:auto;-webkit-overflow-scrolling:touch}}.form-label{margin-bottom:.5rem}.col-form-label{padding-top:calc(0.406rem + 1px);padding-bottom:calc(0.406rem + 1px);margin-bottom:0;font-size:inherit;line-height:1.5}.col-form-label-lg{padding-top:calc(0.5rem + 1px);padding-bottom:calc(0.5rem + 1px);font-size:1.09375rem}.col-form-label-sm{padding-top:calc(0.25rem + 1px);padding-bottom:calc(0.25rem + 1px);font-size:0.8125rem}.form-text{margin-top:.25rem;font-size:0.875em;color:#6e7985}.form-control,.gridjs-input{display:block;width:100%;padding:.406rem .75rem;font-size:0.875rem;font-weight:400;line-height:1.5;color:#41505f;background-color:#fff;background-clip:padding-box;border:1px solid #ccd2da;appearance:none;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-control,.gridjs-input{transition:none}}.form-control[type=file],[type=file].gridjs-input{overflow:hidden}.form-control[type=file]:not(:disabled):not([readonly]),[type=file].gridjs-input:not(:disabled):not([readonly]){cursor:pointer}.form-control:focus,.gridjs-input:focus{color:#41505f;background-color:#fff;border-color:#a8b7ec;outline:0;box-shadow:0 0 0 .25rem rgba(80,111,217,.25)}.form-control::-webkit-date-and-time-value,.gridjs-input::-webkit-date-and-time-value{height:1.5em}.form-control::placeholder,.gridjs-input::placeholder{color:#6e7985;opacity:1}.form-control:disabled,.gridjs-input:disabled{background-color:#f3f5f9;opacity:1}.form-control::file-selector-button,.gridjs-input::file-selector-button{padding:.406rem .75rem;margin:-0.406rem -0.75rem;margin-inline-end:.75rem;color:#41505f;background-color:#f3f5f9;pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:1px;border-radius:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-control::file-selector-button,.gridjs-input::file-selector-button{transition:none}}.form-control:hover:not(:disabled):not([readonly])::file-selector-button,.gridjs-input:hover:not(:disabled):not([readonly])::file-selector-button{background-color:#e7e9ed}.form-control-plaintext{display:block;width:100%;padding:.406rem 0;margin-bottom:0;line-height:1.5;color:#41505f;background-color:rgba(0,0,0,0);border:solid rgba(0,0,0,0);border-width:1px 0}.form-control-plaintext:focus{outline:0}.form-control-plaintext.form-control-sm,.form-control-plaintext.form-control-lg{padding-right:0;padding-left:0}.form-control-sm{min-height:calc(1.5em + 0.5rem + 2px);padding:.25rem .5rem;font-size:0.8125rem;border-radius:.25rem}.form-control-sm::file-selector-button{padding:.25rem .5rem;margin:-0.25rem -0.5rem;margin-inline-end:.5rem}.form-control-lg{min-height:calc(1.5em + 1rem + 2px);padding:.5rem 1rem;font-size:1.09375rem;border-radius:.5rem}.form-control-lg::file-selector-button{padding:.5rem 1rem;margin:-0.5rem -1rem;margin-inline-end:1rem}textarea.form-control,textarea.gridjs-input{min-height:calc(1.5em + 0.812rem + 2px)}textarea.form-control-sm{min-height:calc(1.5em + 0.5rem + 2px)}textarea.form-control-lg{min-height:calc(1.5em + 1rem + 2px)}.form-control-color{width:3rem;height:calc(1.5em + 0.812rem + 2px);padding:.406rem}.form-control-color:not(:disabled):not([readonly]){cursor:pointer}.form-control-color::-moz-color-swatch{border:0 !important;border-radius:.25rem}.form-control-color::-webkit-color-swatch{border-radius:.25rem}.form-control-color.form-control-sm{height:calc(1.5em + 0.5rem + 2px)}.form-control-color.form-control-lg{height:calc(1.5em + 1rem + 2px)}.form-select{display:block;width:100%;padding:.406rem 2.25rem .406rem .75rem;-moz-padding-start:calc(0.75rem - 3px);font-size:0.875rem;font-weight:400;line-height:1.5;color:#41505f;background-color:#fff;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23313c47' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px;border:1px solid #ccd2da;border-radius:.25rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.form-select{transition:none}}.form-select:focus{border-color:#a8b7ec;outline:0;box-shadow:0 0 0 .25rem rgba(80,111,217,.25)}.form-select[multiple],.form-select[size]:not([size="1"]){padding-right:.75rem;background-image:none}.form-select:disabled{background-color:#f3f5f9}.form-select:-moz-focusring{color:rgba(0,0,0,0);text-shadow:0 0 0 #41505f}.form-select-sm{padding-top:.25rem;padding-bottom:.25rem;padding-left:.5rem;font-size:0.8125rem;border-radius:.25rem}.form-select-lg{padding-top:.5rem;padding-bottom:.5rem;padding-left:1rem;font-size:1.09375rem;border-radius:.5rem}.form-check{display:block;min-height:1.3125rem;padding-left:1.5em;margin-bottom:.125rem}.form-check .form-check-input{float:left;margin-left:-1.5em}.form-check-reverse{padding-right:1.5em;padding-left:0;text-align:right}.form-check-reverse .form-check-input{float:right;margin-right:-1.5em;margin-left:0}.form-check-input{width:1em;height:1em;margin-top:.25em;vertical-align:top;background-color:#fff;background-repeat:no-repeat;background-position:center;background-size:contain;border:1px solid rgba(0,0,0,.25);appearance:none;print-color-adjust:exact}.form-check-input[type=checkbox]{border-radius:.25em}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:#a8b7ec;outline:0;box-shadow:0 0 0 .25rem rgba(80,111,217,.25)}.form-check-input:checked{background-color:#506fd9;border-color:#506fd9}.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-input[type=checkbox]:indeterminate{background-color:#506fd9;border-color:#506fd9;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e")}.form-check-input:disabled{pointer-events:none;filter:none;opacity:.5}.form-check-input[disabled]~.form-check-label,.form-check-input:disabled~.form-check-label{cursor:default;opacity:.5}.form-switch{padding-left:2.5em}.form-switch .form-check-input{width:2em;margin-left:-2.5em;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");background-position:left center;border-radius:2em;transition:background-position .15s ease-in-out}@media(prefers-reduced-motion: reduce){.form-switch .form-check-input{transition:none}}.form-switch .form-check-input:focus{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23a8b7ec'/%3e%3c/svg%3e")}.form-switch .form-check-input:checked{background-position:right center;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")}.form-switch.form-check-reverse{padding-right:2.5em;padding-left:0}.form-switch.form-check-reverse .form-check-input{margin-right:-2.5em;margin-left:0}.form-check-inline{display:inline-block;margin-right:1rem}.btn-check{position:absolute;clip:rect(0, 0, 0, 0);pointer-events:none}.btn-check[disabled]+.btn,.ui-datepicker-buttonpane .btn-check[disabled]+button,.gridjs-pages .btn-check[disabled]+button,.btn-check:disabled+.btn,.ui-datepicker-buttonpane .btn-check:disabled+button,.gridjs-pages .btn-check:disabled+button{pointer-events:none;filter:none;opacity:.65}.form-range{width:100%;height:1.5rem;padding:0;background-color:rgba(0,0,0,0);appearance:none}.form-range:focus{outline:0}.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fbfcfe,0 0 0 .25rem rgba(80,111,217,.25)}.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fbfcfe,0 0 0 .25rem rgba(80,111,217,.25)}.form-range::-moz-focus-outer{border:0}.form-range::-webkit-slider-thumb{width:1rem;height:1rem;margin-top:-0.25rem;background-color:#506fd9;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.form-range::-webkit-slider-thumb{transition:none}}.form-range::-webkit-slider-thumb:active{background-color:#cbd4f4}.form-range::-webkit-slider-runnable-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#e2e5ec;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range::-moz-range-thumb{width:1rem;height:1rem;background-color:#506fd9;border:0;border-radius:1rem;transition:background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;appearance:none}@media(prefers-reduced-motion: reduce){.form-range::-moz-range-thumb{transition:none}}.form-range::-moz-range-thumb:active{background-color:#cbd4f4}.form-range::-moz-range-track{width:100%;height:.5rem;color:rgba(0,0,0,0);cursor:pointer;background-color:#e2e5ec;border-color:rgba(0,0,0,0);border-radius:1rem}.form-range:disabled{pointer-events:none}.form-range:disabled::-webkit-slider-thumb{background-color:#9ea7b1}.form-range:disabled::-moz-range-thumb{background-color:#9ea7b1}.form-floating{position:relative}.form-floating>.form-control,.form-floating>.gridjs-input,.form-floating>.form-control-plaintext,.form-floating>.form-select{height:calc(3.5rem + 2px);line-height:1.25}.form-floating>label{position:absolute;top:0;left:0;width:100%;height:100%;padding:1rem .75rem;overflow:hidden;text-align:start;text-overflow:ellipsis;white-space:nowrap;pointer-events:none;border:1px solid rgba(0,0,0,0);transform-origin:0 0;transition:opacity .1s ease-in-out,transform .1s ease-in-out}@media(prefers-reduced-motion: reduce){.form-floating>label{transition:none}}.form-floating>.form-control,.form-floating>.gridjs-input,.form-floating>.form-control-plaintext{padding:1rem .75rem}.form-floating>.form-control::placeholder,.form-floating>.gridjs-input::placeholder,.form-floating>.form-control-plaintext::placeholder{color:rgba(0,0,0,0)}.form-floating>.form-control:focus,.form-floating>.gridjs-input:focus,.form-floating>.form-control:not(:placeholder-shown),.form-floating>.gridjs-input:not(:placeholder-shown),.form-floating>.form-control-plaintext:focus,.form-floating>.form-control-plaintext:not(:placeholder-shown){padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control:-webkit-autofill,.form-floating>.gridjs-input:-webkit-autofill,.form-floating>.form-control-plaintext:-webkit-autofill{padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-select{padding-top:1.625rem;padding-bottom:.625rem}.form-floating>.form-control:focus~label,.form-floating>.gridjs-input:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label,.form-floating>.gridjs-input:not(:placeholder-shown)~label,.form-floating>.form-control-plaintext~label,.form-floating>.form-select~label{opacity:.65;transform:scale(0.85) translateY(-0.5rem) translateX(0.15rem)}.form-floating>.form-control:-webkit-autofill~label,.form-floating>.gridjs-input:-webkit-autofill~label{opacity:.65;transform:scale(0.85) translateY(-0.5rem) translateX(0.15rem)}.form-floating>.form-control-plaintext~label{border-width:1px 0}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control,.input-group>.gridjs-input,.input-group>.form-select,.input-group>.form-floating{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group>.form-control:focus,.input-group>.gridjs-input:focus,.input-group>.form-select:focus,.input-group>.form-floating:focus-within{z-index:5}.input-group .btn,.input-group .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .input-group button,.input-group .gridjs-pages button,.gridjs-pages .input-group button{position:relative;z-index:2}.input-group .btn:focus,.input-group .ui-datepicker-buttonpane button:focus,.ui-datepicker-buttonpane .input-group button:focus,.input-group .gridjs-pages button:focus,.gridjs-pages .input-group button:focus{z-index:5}.input-group-text{display:flex;align-items:center;padding:.406rem .75rem;font-size:0.875rem;font-weight:400;line-height:1.5;color:#41505f;text-align:center;white-space:nowrap;background-color:#f3f5f9;border:1px solid #ccd2da;border-radius:.25rem}.input-group-lg>.form-control,.input-group-lg>.gridjs-input,.input-group-lg>.form-select,.input-group-lg>.input-group-text,.input-group-lg>.btn,.ui-datepicker-buttonpane .input-group-lg>button,.gridjs-pages .input-group-lg>button{padding:.5rem 1rem;font-size:1.09375rem;border-radius:.5rem}.input-group-sm>.form-control,.input-group-sm>.gridjs-input,.input-group-sm>.form-select,.input-group-sm>.input-group-text,.input-group-sm>.btn,.ui-datepicker-buttonpane .input-group-sm>button,.gridjs-pages .input-group-sm>button{padding:.25rem .5rem;font-size:0.8125rem;border-radius:.25rem}.input-group-lg>.form-select,.input-group-sm>.form-select{padding-right:3rem}.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3),.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-control,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.gridjs-input,.input-group:not(.has-validation)>.form-floating:not(:last-child)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group.has-validation>:nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating),.input-group.has-validation>.dropdown-toggle:nth-last-child(n+4),.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-control,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.gridjs-input,.input-group.has-validation>.form-floating:nth-last-child(n+3)>.form-select{border-top-right-radius:0;border-bottom-right-radius:0}.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.form-floating:not(:first-child)>.form-control,.input-group>.form-floating:not(:first-child)>.gridjs-input,.input-group>.form-floating:not(:first-child)>.form-select{border-top-left-radius:0;border-bottom-left-radius:0}.valid-feedback{display:none;width:100%;margin-top:.25rem;font-size:0.875em;color:#0cb785}.valid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:0.8125rem;color:#000;background-color:rgba(12,183,133,.9);border-radius:.25rem}.was-validated :valid~.valid-feedback,.was-validated :valid~.valid-tooltip,.is-valid~.valid-feedback,.is-valid~.valid-tooltip{display:block}.was-validated .form-control:valid,.was-validated .gridjs-input:valid,.form-control.is-valid,.is-valid.gridjs-input{border-color:#0cb785;padding-right:calc(1.5em + 0.812rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%230cb785' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(0.375em + 0.203rem) center;background-size:calc(0.75em + 0.406rem) calc(0.75em + 0.406rem)}.was-validated .form-control:valid:focus,.was-validated .gridjs-input:valid:focus,.form-control.is-valid:focus,.is-valid.gridjs-input:focus{border-color:#0cb785;box-shadow:0 0 0 .25rem rgba(12,183,133,.25)}.was-validated textarea.form-control:valid,.was-validated textarea.gridjs-input:valid,textarea.form-control.is-valid,textarea.is-valid.gridjs-input{padding-right:calc(1.5em + 0.812rem);background-position:top calc(0.375em + 0.203rem) right calc(0.375em + 0.203rem)}.was-validated .form-select:valid,.form-select.is-valid{border-color:#0cb785}.was-validated .form-select:valid:not([multiple]):not([size]),.was-validated .form-select:valid:not([multiple])[size="1"],.form-select.is-valid:not([multiple]):not([size]),.form-select.is-valid:not([multiple])[size="1"]{padding-right:4.125rem;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23313c47' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%230cb785' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(0.75em + 0.406rem) calc(0.75em + 0.406rem)}.was-validated .form-select:valid:focus,.form-select.is-valid:focus{border-color:#0cb785;box-shadow:0 0 0 .25rem rgba(12,183,133,.25)}.was-validated .form-control-color:valid,.form-control-color.is-valid{width:calc(3rem + calc(1.5em + 0.812rem))}.was-validated .form-check-input:valid,.form-check-input.is-valid{border-color:#0cb785}.was-validated .form-check-input:valid:checked,.form-check-input.is-valid:checked{background-color:#0cb785}.was-validated .form-check-input:valid:focus,.form-check-input.is-valid:focus{box-shadow:0 0 0 .25rem rgba(12,183,133,.25)}.was-validated .form-check-input:valid~.form-check-label,.form-check-input.is-valid~.form-check-label{color:#0cb785}.form-check-inline .form-check-input~.valid-feedback{margin-left:.5em}.was-validated .input-group>.form-control:not(:focus):valid,.was-validated .input-group>.gridjs-input:not(:focus):valid,.input-group>.form-control:not(:focus).is-valid,.input-group>.gridjs-input:not(:focus).is-valid,.was-validated .input-group>.form-select:not(:focus):valid,.input-group>.form-select:not(:focus).is-valid,.was-validated .input-group>.form-floating:not(:focus-within):valid,.input-group>.form-floating:not(:focus-within).is-valid{z-index:3}.invalid-feedback{display:none;width:100%;margin-top:.25rem;font-size:0.875em;color:#dc3545}.invalid-tooltip{position:absolute;top:100%;z-index:5;display:none;max-width:100%;padding:.25rem .5rem;margin-top:.1rem;font-size:0.8125rem;color:#fff;background-color:rgba(220,53,69,.9);border-radius:.25rem}.was-validated :invalid~.invalid-feedback,.was-validated :invalid~.invalid-tooltip,.is-invalid~.invalid-feedback,.is-invalid~.invalid-tooltip{display:block}.was-validated .form-control:invalid,.was-validated .gridjs-input:invalid,.form-control.is-invalid,.is-invalid.gridjs-input{border-color:#dc3545;padding-right:calc(1.5em + 0.812rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(0.375em + 0.203rem) center;background-size:calc(0.75em + 0.406rem) calc(0.75em + 0.406rem)}.was-validated .form-control:invalid:focus,.was-validated .gridjs-input:invalid:focus,.form-control.is-invalid:focus,.is-invalid.gridjs-input:focus{border-color:#dc3545;box-shadow:0 0 0 .25rem rgba(220,53,69,.25)}.was-validated textarea.form-control:invalid,.was-validated textarea.gridjs-input:invalid,textarea.form-control.is-invalid,textarea.is-invalid.gridjs-input{padding-right:calc(1.5em + 0.812rem);background-position:top calc(0.375em + 0.203rem) right calc(0.375em + 0.203rem)}.was-validated .form-select:invalid,.form-select.is-invalid{border-color:#dc3545}.was-validated .form-select:invalid:not([multiple]):not([size]),.was-validated .form-select:invalid:not([multiple])[size="1"],.form-select.is-invalid:not([multiple]):not([size]),.form-select.is-invalid:not([multiple])[size="1"]{padding-right:4.125rem;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23313c47' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"),url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");background-position:right .75rem center,center right 2.25rem;background-size:16px 12px,calc(0.75em + 0.406rem) calc(0.75em + 0.406rem)}.was-validated .form-select:invalid:focus,.form-select.is-invalid:focus{border-color:#dc3545;box-shadow:0 0 0 .25rem rgba(220,53,69,.25)}.was-validated .form-control-color:invalid,.form-control-color.is-invalid{width:calc(3rem + calc(1.5em + 0.812rem))}.was-validated .form-check-input:invalid,.form-check-input.is-invalid{border-color:#dc3545}.was-validated .form-check-input:invalid:checked,.form-check-input.is-invalid:checked{background-color:#dc3545}.was-validated .form-check-input:invalid:focus,.form-check-input.is-invalid:focus{box-shadow:0 0 0 .25rem rgba(220,53,69,.25)}.was-validated .form-check-input:invalid~.form-check-label,.form-check-input.is-invalid~.form-check-label{color:#dc3545}.form-check-inline .form-check-input~.invalid-feedback{margin-left:.5em}.was-validated .input-group>.form-control:not(:focus):invalid,.was-validated .input-group>.gridjs-input:not(:focus):invalid,.input-group>.form-control:not(:focus).is-invalid,.input-group>.gridjs-input:not(:focus).is-invalid,.was-validated .input-group>.form-select:not(:focus):invalid,.input-group>.form-select:not(:focus).is-invalid,.was-validated .input-group>.form-floating:not(:focus-within):invalid,.input-group>.form-floating:not(:focus-within).is-invalid{z-index:4}.btn,.ui-datepicker-buttonpane button,.gridjs-pages button{--bs-btn-padding-x: 0.75rem;--bs-btn-padding-y: 0.406rem;--bs-btn-font-family: ;--bs-btn-font-size:0.875rem;--bs-btn-font-weight: 400;--bs-btn-line-height: 1.5;--bs-btn-color: #41505f;--bs-btn-bg: transparent;--bs-btn-border-width: 1px;--bs-btn-border-color: transparent;--bs-btn-border-radius: 0.25rem;--bs-btn-hover-border-color: transparent;--bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity: 0.65;--bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;vertical-align:middle;cursor:pointer;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.btn,.ui-datepicker-buttonpane button,.gridjs-pages button{transition:none}}.btn:hover,.ui-datepicker-buttonpane button:hover,.gridjs-pages button:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)}.btn-check+.btn:hover,.ui-datepicker-buttonpane .btn-check+button:hover,.gridjs-pages .btn-check+button:hover{color:var(--bs-btn-color);background-color:var(--bs-btn-bg);border-color:var(--bs-btn-border-color)}.btn:focus-visible,.ui-datepicker-buttonpane button:focus-visible,.gridjs-pages button:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:focus-visible+.btn,.ui-datepicker-buttonpane .btn-check:focus-visible+button,.gridjs-pages .btn-check:focus-visible+button{border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)}.btn-check:checked+.btn,.ui-datepicker-buttonpane .btn-check:checked+button,.gridjs-pages .btn-check:checked+button,:not(.btn-check)+.btn:active,.ui-datepicker-buttonpane :not(.btn-check)+button:active,.gridjs-pages :not(.btn-check)+button:active,.btn:first-child:active,.ui-datepicker-buttonpane button:first-child:active,.gridjs-pages button:first-child:active,.btn.active,.ui-datepicker-buttonpane button.active,.gridjs-pages button.active,.btn.show,.ui-datepicker-buttonpane button.show,.gridjs-pages button.show{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)}.btn-check:checked+.btn:focus-visible,.ui-datepicker-buttonpane .btn-check:checked+button:focus-visible,.gridjs-pages .btn-check:checked+button:focus-visible,:not(.btn-check)+.btn:active:focus-visible,.ui-datepicker-buttonpane :not(.btn-check)+button:active:focus-visible,.gridjs-pages :not(.btn-check)+button:active:focus-visible,.btn:first-child:active:focus-visible,.ui-datepicker-buttonpane button:first-child:active:focus-visible,.gridjs-pages button:first-child:active:focus-visible,.btn.active:focus-visible,.ui-datepicker-buttonpane button.active:focus-visible,.gridjs-pages button.active:focus-visible,.btn.show:focus-visible,.ui-datepicker-buttonpane button.show:focus-visible,.gridjs-pages button.show:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)}.btn:disabled,.ui-datepicker-buttonpane button:disabled,.gridjs-pages button:disabled,.btn.disabled,.ui-datepicker-buttonpane button.disabled,.gridjs-pages button.disabled,fieldset:disabled .btn,fieldset:disabled .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane fieldset:disabled button,fieldset:disabled .gridjs-pages button,.gridjs-pages fieldset:disabled button{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)}.btn-primary{--bs-btn-color: #fff;--bs-btn-bg: #506fd9;--bs-btn-border-color: #506fd9;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #445eb8;--bs-btn-hover-border-color: #4059ae;--bs-btn-focus-shadow-rgb: 106, 133, 223;--bs-btn-active-color: #fff;--bs-btn-active-bg: #4059ae;--bs-btn-active-border-color: #3c53a3;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #506fd9;--bs-btn-disabled-border-color: #506fd9}.btn-secondary,.ui-datepicker-buttonpane button{--bs-btn-color: #000;--bs-btn-bg: #6e7985;--bs-btn-border-color: #6e7985;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #848d97;--bs-btn-hover-border-color: #7d8691;--bs-btn-focus-shadow-rgb: 94, 103, 113;--bs-btn-active-color: #000;--bs-btn-active-bg: #8b949d;--bs-btn-active-border-color: #7d8691;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #6e7985;--bs-btn-disabled-border-color: #6e7985}.btn-success{--bs-btn-color: #000;--bs-btn-bg: #0cb785;--bs-btn-border-color: #0cb785;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #30c297;--bs-btn-hover-border-color: #24be91;--bs-btn-focus-shadow-rgb: 10, 156, 113;--bs-btn-active-color: #000;--bs-btn-active-bg: #3dc59d;--bs-btn-active-border-color: #24be91;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #0cb785;--bs-btn-disabled-border-color: #0cb785}.btn-info{--bs-btn-color: #000;--bs-btn-bg: #0dcaf0;--bs-btn-border-color: #0dcaf0;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #31d2f2;--bs-btn-hover-border-color: #25cff2;--bs-btn-focus-shadow-rgb: 11, 172, 204;--bs-btn-active-color: #000;--bs-btn-active-bg: #3dd5f3;--bs-btn-active-border-color: #25cff2;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #0dcaf0;--bs-btn-disabled-border-color: #0dcaf0}.btn-warning{--bs-btn-color: #000;--bs-btn-bg: #ffc107;--bs-btn-border-color: #ffc107;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #ffca2c;--bs-btn-hover-border-color: #ffc720;--bs-btn-focus-shadow-rgb: 217, 164, 6;--bs-btn-active-color: #000;--bs-btn-active-bg: #ffcd39;--bs-btn-active-border-color: #ffc720;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #ffc107;--bs-btn-disabled-border-color: #ffc107}.btn-danger{--bs-btn-color: #fff;--bs-btn-bg: #dc3545;--bs-btn-border-color: #dc3545;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #bb2d3b;--bs-btn-hover-border-color: #b02a37;--bs-btn-focus-shadow-rgb: 225, 83, 97;--bs-btn-active-color: #fff;--bs-btn-active-bg: #b02a37;--bs-btn-active-border-color: #a52834;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #dc3545;--bs-btn-disabled-border-color: #dc3545}.btn-light{--bs-btn-color: #000;--bs-btn-bg: #f8f9fc;--bs-btn-border-color: #f8f9fc;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #d3d4d6;--bs-btn-hover-border-color: #c6c7ca;--bs-btn-focus-shadow-rgb: 211, 212, 214;--bs-btn-active-color: #000;--bs-btn-active-bg: #c6c7ca;--bs-btn-active-border-color: #babbbd;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #000;--bs-btn-disabled-bg: #f8f9fc;--bs-btn-disabled-border-color: #f8f9fc}.btn-dark{--bs-btn-color: #fff;--bs-btn-bg: #212830;--bs-btn-border-color: #212830;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #42484f;--bs-btn-hover-border-color: #373e45;--bs-btn-focus-shadow-rgb: 66, 72, 79;--bs-btn-active-color: #fff;--bs-btn-active-bg: #4d5359;--bs-btn-active-border-color: #373e45;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #212830;--bs-btn-disabled-border-color: #212830}.btn-outline-primary{--bs-btn-color: #506fd9;--bs-btn-border-color: #506fd9;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #506fd9;--bs-btn-hover-border-color: #506fd9;--bs-btn-focus-shadow-rgb: 80, 111, 217;--bs-btn-active-color: #fff;--bs-btn-active-bg: #506fd9;--bs-btn-active-border-color: #506fd9;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #506fd9;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #506fd9;--bs-gradient: none}.btn-outline-secondary{--bs-btn-color: #6e7985;--bs-btn-border-color: #6e7985;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #6e7985;--bs-btn-hover-border-color: #6e7985;--bs-btn-focus-shadow-rgb: 110, 121, 133;--bs-btn-active-color: #000;--bs-btn-active-bg: #6e7985;--bs-btn-active-border-color: #6e7985;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #6e7985;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #6e7985;--bs-gradient: none}.btn-outline-success{--bs-btn-color: #0cb785;--bs-btn-border-color: #0cb785;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #0cb785;--bs-btn-hover-border-color: #0cb785;--bs-btn-focus-shadow-rgb: 12, 183, 133;--bs-btn-active-color: #000;--bs-btn-active-bg: #0cb785;--bs-btn-active-border-color: #0cb785;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #0cb785;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #0cb785;--bs-gradient: none}.btn-outline-info{--bs-btn-color: #0dcaf0;--bs-btn-border-color: #0dcaf0;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #0dcaf0;--bs-btn-hover-border-color: #0dcaf0;--bs-btn-focus-shadow-rgb: 13, 202, 240;--bs-btn-active-color: #000;--bs-btn-active-bg: #0dcaf0;--bs-btn-active-border-color: #0dcaf0;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #0dcaf0;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #0dcaf0;--bs-gradient: none}.btn-outline-warning{--bs-btn-color: #ffc107;--bs-btn-border-color: #ffc107;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #ffc107;--bs-btn-hover-border-color: #ffc107;--bs-btn-focus-shadow-rgb: 255, 193, 7;--bs-btn-active-color: #000;--bs-btn-active-bg: #ffc107;--bs-btn-active-border-color: #ffc107;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #ffc107;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #ffc107;--bs-gradient: none}.btn-outline-danger{--bs-btn-color: #dc3545;--bs-btn-border-color: #dc3545;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #dc3545;--bs-btn-hover-border-color: #dc3545;--bs-btn-focus-shadow-rgb: 220, 53, 69;--bs-btn-active-color: #fff;--bs-btn-active-bg: #dc3545;--bs-btn-active-border-color: #dc3545;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #dc3545;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #dc3545;--bs-gradient: none}.btn-outline-light{--bs-btn-color: #f8f9fc;--bs-btn-border-color: #f8f9fc;--bs-btn-hover-color: #000;--bs-btn-hover-bg: #f8f9fc;--bs-btn-hover-border-color: #f8f9fc;--bs-btn-focus-shadow-rgb: 248, 249, 252;--bs-btn-active-color: #000;--bs-btn-active-bg: #f8f9fc;--bs-btn-active-border-color: #f8f9fc;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #f8f9fc;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #f8f9fc;--bs-gradient: none}.btn-outline-dark{--bs-btn-color: #212830;--bs-btn-border-color: #212830;--bs-btn-hover-color: #fff;--bs-btn-hover-bg: #212830;--bs-btn-hover-border-color: #212830;--bs-btn-focus-shadow-rgb: 33, 40, 48;--bs-btn-active-color: #fff;--bs-btn-active-bg: #212830;--bs-btn-active-border-color: #212830;--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #212830;--bs-btn-disabled-bg: transparent;--bs-btn-disabled-border-color: #212830;--bs-gradient: none}.btn-link{--bs-btn-font-weight: 400;--bs-btn-color: var(--bs-link-color);--bs-btn-bg: transparent;--bs-btn-border-color: transparent;--bs-btn-hover-color: var(--bs-link-hover-color);--bs-btn-hover-border-color: transparent;--bs-btn-active-color: var(--bs-link-hover-color);--bs-btn-active-border-color: transparent;--bs-btn-disabled-color: #6e7985;--bs-btn-disabled-border-color: transparent;--bs-btn-box-shadow: none;--bs-btn-focus-shadow-rgb: 106, 133, 223;text-decoration:none}.btn-link:focus-visible{color:var(--bs-btn-color)}.btn-link:hover{color:var(--bs-btn-hover-color)}.btn-lg,.btn-group-lg>.btn,.ui-datepicker-buttonpane .btn-group-lg>button,.gridjs-pages .btn-group-lg>button{--bs-btn-padding-y: 0.5rem;--bs-btn-padding-x: 1rem;--bs-btn-font-size:1.09375rem;--bs-btn-border-radius: 0.5rem}.btn-sm,.ui-datepicker-buttonpane button,.btn-group-sm>.btn,.ui-datepicker-buttonpane .btn-group-sm>button,.gridjs-pages .btn-group-sm>button{--bs-btn-padding-y: 0.25rem;--bs-btn-padding-x: 0.5rem;--bs-btn-font-size:0.8125rem;--bs-btn-border-radius: 0.25rem}.fade{transition:opacity .15s linear}@media(prefers-reduced-motion: reduce){.fade{transition:none}}.fade:not(.show){opacity:0}.collapse:not(.show){display:none}.collapsing{height:0;overflow:hidden;transition:height .35s ease}@media(prefers-reduced-motion: reduce){.collapsing{transition:none}}.collapsing.collapse-horizontal{width:0;height:auto;transition:width .35s ease}@media(prefers-reduced-motion: reduce){.collapsing.collapse-horizontal{transition:none}}.dropup,.dropend,.dropdown,.dropstart,.dropup-center,.dropdown-center{position:relative}.dropdown-toggle{white-space:nowrap}.dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid;border-right:.3em solid rgba(0,0,0,0);border-bottom:0;border-left:.3em solid rgba(0,0,0,0)}.dropdown-toggle:empty::after{margin-left:0}.dropdown-menu{--bs-dropdown-zindex: 1000;--bs-dropdown-min-width: 10rem;--bs-dropdown-padding-x: 0;--bs-dropdown-padding-y: 0.5rem;--bs-dropdown-spacer: 0.125rem;--bs-dropdown-font-size:0.875rem;--bs-dropdown-color: #41505f;--bs-dropdown-bg: #fff;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-border-radius: 0.25rem;--bs-dropdown-border-width: 1px;--bs-dropdown-inner-border-radius: calc(0.25rem - 1px);--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-divider-margin-y: 0.5rem;--bs-dropdown-box-shadow: 0 0.5rem 1rem rgba(33, 40, 48, 0.15);--bs-dropdown-link-color: #212830;--bs-dropdown-link-hover-color: #1e242b;--bs-dropdown-link-hover-bg: #f3f5f9;--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #506fd9;--bs-dropdown-link-disabled-color: #9ea7b1;--bs-dropdown-item-padding-x: 1rem;--bs-dropdown-item-padding-y: 0.25rem;--bs-dropdown-header-color: #6e7985;--bs-dropdown-header-padding-x: 1rem;--bs-dropdown-header-padding-y: 0.5rem;position:absolute;z-index:var(--bs-dropdown-zindex);display:none;min-width:var(--bs-dropdown-min-width);padding:var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);margin:0;font-size:var(--bs-dropdown-font-size);color:var(--bs-dropdown-color);text-align:left;list-style:none;background-color:var(--bs-dropdown-bg);background-clip:padding-box;border:var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);border-radius:var(--bs-dropdown-border-radius)}.dropdown-menu[data-bs-popper]{top:100%;left:0;margin-top:var(--bs-dropdown-spacer)}.dropdown-menu-start{--bs-position: start}.dropdown-menu-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-end{--bs-position: end}.dropdown-menu-end[data-bs-popper]{right:0;left:auto}@media(min-width: 576px){.dropdown-menu-sm-start{--bs-position: start}.dropdown-menu-sm-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-sm-end{--bs-position: end}.dropdown-menu-sm-end[data-bs-popper]{right:0;left:auto}}@media(min-width: 768px){.dropdown-menu-md-start{--bs-position: start}.dropdown-menu-md-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-md-end{--bs-position: end}.dropdown-menu-md-end[data-bs-popper]{right:0;left:auto}}@media(min-width: 992px){.dropdown-menu-lg-start{--bs-position: start}.dropdown-menu-lg-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-lg-end{--bs-position: end}.dropdown-menu-lg-end[data-bs-popper]{right:0;left:auto}}@media(min-width: 1200px){.dropdown-menu-xl-start{--bs-position: start}.dropdown-menu-xl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xl-end{--bs-position: end}.dropdown-menu-xl-end[data-bs-popper]{right:0;left:auto}}@media(min-width: 1400px){.dropdown-menu-xxl-start{--bs-position: start}.dropdown-menu-xxl-start[data-bs-popper]{right:auto;left:0}.dropdown-menu-xxl-end{--bs-position: end}.dropdown-menu-xxl-end[data-bs-popper]{right:0;left:auto}}.dropup .dropdown-menu[data-bs-popper]{top:auto;bottom:100%;margin-top:0;margin-bottom:var(--bs-dropdown-spacer)}.dropup .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:0;border-right:.3em solid rgba(0,0,0,0);border-bottom:.3em solid;border-left:.3em solid rgba(0,0,0,0)}.dropup .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-menu[data-bs-popper]{top:0;right:auto;left:100%;margin-top:0;margin-left:var(--bs-dropdown-spacer)}.dropend .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:"";border-top:.3em solid rgba(0,0,0,0);border-right:0;border-bottom:.3em solid rgba(0,0,0,0);border-left:.3em solid}.dropend .dropdown-toggle:empty::after{margin-left:0}.dropend .dropdown-toggle::after{vertical-align:0}.dropstart .dropdown-menu[data-bs-popper]{top:0;right:100%;left:auto;margin-top:0;margin-right:var(--bs-dropdown-spacer)}.dropstart .dropdown-toggle::after{display:inline-block;margin-left:.255em;vertical-align:.255em;content:""}.dropstart .dropdown-toggle::after{display:none}.dropstart .dropdown-toggle::before{display:inline-block;margin-right:.255em;vertical-align:.255em;content:"";border-top:.3em solid rgba(0,0,0,0);border-right:.3em solid;border-bottom:.3em solid rgba(0,0,0,0)}.dropstart .dropdown-toggle:empty::after{margin-left:0}.dropstart .dropdown-toggle::before{vertical-align:0}.dropdown-divider{height:0;margin:var(--bs-dropdown-divider-margin-y) 0;overflow:hidden;border-top:1px solid var(--bs-dropdown-divider-bg);opacity:1}.dropdown-item{display:block;width:100%;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);clear:both;font-weight:400;color:var(--bs-dropdown-link-color);text-align:inherit;white-space:nowrap;background-color:rgba(0,0,0,0);border:0}.dropdown-item:hover,.dropdown-item:focus{color:var(--bs-dropdown-link-hover-color);background-color:var(--bs-dropdown-link-hover-bg)}.dropdown-item.active,.dropdown-item:active{color:var(--bs-dropdown-link-active-color);text-decoration:none;background-color:var(--bs-dropdown-link-active-bg)}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--bs-dropdown-link-disabled-color);pointer-events:none;background-color:rgba(0,0,0,0)}.dropdown-menu.show{display:block}.dropdown-header{display:block;padding:var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);margin-bottom:0;font-size:0.8125rem;color:var(--bs-dropdown-header-color);white-space:nowrap}.dropdown-item-text{display:block;padding:var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);color:var(--bs-dropdown-link-color)}.dropdown-menu-dark{--bs-dropdown-color: #e2e5ec;--bs-dropdown-bg: #313c47;--bs-dropdown-border-color: var(--bs-border-color-translucent);--bs-dropdown-box-shadow: ;--bs-dropdown-link-color: #e2e5ec;--bs-dropdown-link-hover-color: #fff;--bs-dropdown-divider-bg: var(--bs-border-color-translucent);--bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15);--bs-dropdown-link-active-color: #fff;--bs-dropdown-link-active-bg: #506fd9;--bs-dropdown-link-disabled-color: #9ea7b1;--bs-dropdown-header-color: #9ea7b1}.btn-group,.btn-group-vertical{position:relative;display:inline-flex;vertical-align:middle}.btn-group>.btn,.ui-datepicker-buttonpane .btn-group>button,.gridjs-pages .btn-group>button,.btn-group-vertical>.btn,.ui-datepicker-buttonpane .btn-group-vertical>button,.gridjs-pages .btn-group-vertical>button{position:relative;flex:1 1 auto}.btn-group>.btn-check:checked+.btn,.ui-datepicker-buttonpane .btn-group>.btn-check:checked+button,.gridjs-pages .btn-group>.btn-check:checked+button,.btn-group>.btn-check:focus+.btn,.ui-datepicker-buttonpane .btn-group>.btn-check:focus+button,.gridjs-pages .btn-group>.btn-check:focus+button,.btn-group>.btn:hover,.ui-datepicker-buttonpane .btn-group>button:hover,.gridjs-pages .btn-group>button:hover,.btn-group>.btn:focus,.ui-datepicker-buttonpane .btn-group>button:focus,.gridjs-pages .btn-group>button:focus,.btn-group>.btn:active,.ui-datepicker-buttonpane .btn-group>button:active,.gridjs-pages .btn-group>button:active,.btn-group>.btn.active,.ui-datepicker-buttonpane .btn-group>button.active,.gridjs-pages .btn-group>button.active,.btn-group-vertical>.btn-check:checked+.btn,.ui-datepicker-buttonpane .btn-group-vertical>.btn-check:checked+button,.gridjs-pages .btn-group-vertical>.btn-check:checked+button,.btn-group-vertical>.btn-check:focus+.btn,.ui-datepicker-buttonpane .btn-group-vertical>.btn-check:focus+button,.gridjs-pages .btn-group-vertical>.btn-check:focus+button,.btn-group-vertical>.btn:hover,.ui-datepicker-buttonpane .btn-group-vertical>button:hover,.gridjs-pages .btn-group-vertical>button:hover,.btn-group-vertical>.btn:focus,.ui-datepicker-buttonpane .btn-group-vertical>button:focus,.gridjs-pages .btn-group-vertical>button:focus,.btn-group-vertical>.btn:active,.ui-datepicker-buttonpane .btn-group-vertical>button:active,.gridjs-pages .btn-group-vertical>button:active,.btn-group-vertical>.btn.active,.ui-datepicker-buttonpane .btn-group-vertical>button.active,.gridjs-pages .btn-group-vertical>button.active{z-index:1}.btn-toolbar{display:flex;flex-wrap:wrap;justify-content:flex-start}.btn-toolbar .input-group{width:auto}.btn-group{border-radius:.25rem}.btn-group>:not(.btn-check:first-child)+.btn,.ui-datepicker-buttonpane .btn-group>:not(.btn-check:first-child)+button,.gridjs-pages .btn-group>:not(.btn-check:first-child)+button,.btn-group>.btn-group:not(:first-child){margin-left:-1px}.btn-group>.btn:not(:last-child):not(.dropdown-toggle),.ui-datepicker-buttonpane .btn-group>button:not(:last-child):not(.dropdown-toggle),.gridjs-pages .btn-group>button:not(:last-child):not(.dropdown-toggle),.btn-group>.btn.dropdown-toggle-split:first-child,.ui-datepicker-buttonpane .btn-group>button.dropdown-toggle-split:first-child,.gridjs-pages .btn-group>button.dropdown-toggle-split:first-child,.btn-group>.btn-group:not(:last-child)>.btn,.ui-datepicker-buttonpane .btn-group>.btn-group:not(:last-child)>button,.gridjs-pages .btn-group>.btn-group:not(:last-child)>button{border-top-right-radius:0;border-bottom-right-radius:0}.btn-group>.btn:nth-child(n+3),.ui-datepicker-buttonpane .btn-group>button:nth-child(n+3),.gridjs-pages .btn-group>button:nth-child(n+3),.btn-group>:not(.btn-check)+.btn,.ui-datepicker-buttonpane .btn-group>:not(.btn-check)+button,.gridjs-pages .btn-group>:not(.btn-check)+button,.btn-group>.btn-group:not(:first-child)>.btn,.ui-datepicker-buttonpane .btn-group>.btn-group:not(:first-child)>button,.gridjs-pages .btn-group>.btn-group:not(:first-child)>button{border-top-left-radius:0;border-bottom-left-radius:0}.dropdown-toggle-split{padding-right:.5625rem;padding-left:.5625rem}.dropdown-toggle-split::after,.dropup .dropdown-toggle-split::after,.dropend .dropdown-toggle-split::after{margin-left:0}.dropstart .dropdown-toggle-split::before{margin-right:0}.btn-sm+.dropdown-toggle-split,.ui-datepicker-buttonpane button+.dropdown-toggle-split,.btn-group-sm>.btn+.dropdown-toggle-split,.ui-datepicker-buttonpane .btn-group-sm>button+.dropdown-toggle-split,.gridjs-pages .btn-group-sm>button+.dropdown-toggle-split{padding-right:.375rem;padding-left:.375rem}.btn-lg+.dropdown-toggle-split,.btn-group-lg>.btn+.dropdown-toggle-split,.ui-datepicker-buttonpane .btn-group-lg>button+.dropdown-toggle-split,.gridjs-pages .btn-group-lg>button+.dropdown-toggle-split{padding-right:.75rem;padding-left:.75rem}.btn-group-vertical{flex-direction:column;align-items:flex-start;justify-content:center}.btn-group-vertical>.btn,.ui-datepicker-buttonpane .btn-group-vertical>button,.gridjs-pages .btn-group-vertical>button,.btn-group-vertical>.btn-group{width:100%}.btn-group-vertical>.btn:not(:first-child),.ui-datepicker-buttonpane .btn-group-vertical>button:not(:first-child),.gridjs-pages .btn-group-vertical>button:not(:first-child),.btn-group-vertical>.btn-group:not(:first-child){margin-top:-1px}.btn-group-vertical>.btn:not(:last-child):not(.dropdown-toggle),.ui-datepicker-buttonpane .btn-group-vertical>button:not(:last-child):not(.dropdown-toggle),.gridjs-pages .btn-group-vertical>button:not(:last-child):not(.dropdown-toggle),.btn-group-vertical>.btn-group:not(:last-child)>.btn,.ui-datepicker-buttonpane .btn-group-vertical>.btn-group:not(:last-child)>button,.gridjs-pages .btn-group-vertical>.btn-group:not(:last-child)>button{border-bottom-right-radius:0;border-bottom-left-radius:0}.btn-group-vertical>.btn~.btn,.ui-datepicker-buttonpane .btn-group-vertical>button~.btn,.ui-datepicker-buttonpane .btn-group-vertical>.btn~button,.ui-datepicker-buttonpane .btn-group-vertical>button~button,.gridjs-pages .btn-group-vertical>button~.btn,.gridjs-pages .btn-group-vertical>.btn~button,.gridjs-pages .btn-group-vertical>button~button,.btn-group-vertical>.btn-group:not(:first-child)>.btn,.ui-datepicker-buttonpane .btn-group-vertical>.btn-group:not(:first-child)>button,.gridjs-pages .btn-group-vertical>.btn-group:not(:first-child)>button{border-top-left-radius:0;border-top-right-radius:0}.nav{--bs-nav-link-padding-x: 1rem;--bs-nav-link-padding-y: 0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-link-color);--bs-nav-link-hover-color: var(--bs-link-hover-color);--bs-nav-link-disabled-color: #6e7985;display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none}.nav-link{display:block;padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);font-size:var(--bs-nav-link-font-size);font-weight:var(--bs-nav-link-font-weight);color:var(--bs-nav-link-color);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out}@media(prefers-reduced-motion: reduce){.nav-link{transition:none}}.nav-link:hover,.nav-link:focus{color:var(--bs-nav-link-hover-color)}.nav-link.disabled{color:var(--bs-nav-link-disabled-color);pointer-events:none;cursor:default}.nav-tabs{--bs-nav-tabs-border-width: 1px;--bs-nav-tabs-border-color: #e2e5ec;--bs-nav-tabs-border-radius: 0.25rem;--bs-nav-tabs-link-hover-border-color: #f3f5f9 #f3f5f9 #e2e5ec;--bs-nav-tabs-link-active-color: #41505f;--bs-nav-tabs-link-active-bg: #fbfcfe;--bs-nav-tabs-link-active-border-color: #e2e5ec #e2e5ec #fbfcfe;border-bottom:var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)}.nav-tabs .nav-link{margin-bottom:calc(-1*var(--bs-nav-tabs-border-width));background:none;border:var(--bs-nav-tabs-border-width) solid rgba(0,0,0,0);border-top-left-radius:var(--bs-nav-tabs-border-radius);border-top-right-radius:var(--bs-nav-tabs-border-radius)}.nav-tabs .nav-link:hover,.nav-tabs .nav-link:focus{isolation:isolate;border-color:var(--bs-nav-tabs-link-hover-border-color)}.nav-tabs .nav-link.disabled,.nav-tabs .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.nav-tabs .nav-link.active,.nav-tabs .nav-item.show .nav-link{color:var(--bs-nav-tabs-link-active-color);background-color:var(--bs-nav-tabs-link-active-bg);border-color:var(--bs-nav-tabs-link-active-border-color)}.nav-tabs .dropdown-menu{margin-top:calc(-1*var(--bs-nav-tabs-border-width));border-top-left-radius:0;border-top-right-radius:0}.nav-pills{--bs-nav-pills-border-radius: 0.25rem;--bs-nav-pills-link-active-color: #fff;--bs-nav-pills-link-active-bg: #506fd9}.nav-pills .nav-link{background:none;border:0;border-radius:var(--bs-nav-pills-border-radius)}.nav-pills .nav-link:disabled{color:var(--bs-nav-link-disabled-color);background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.nav-pills .nav-link.active,.nav-pills .show>.nav-link{color:var(--bs-nav-pills-link-active-color);background-color:var(--bs-nav-pills-link-active-bg)}.nav-fill>.nav-link,.nav-fill .nav-item{flex:1 1 auto;text-align:center}.nav-justified>.nav-link,.nav-justified .nav-item{flex-basis:0;flex-grow:1;text-align:center}.nav-fill .nav-item .nav-link,.nav-justified .nav-item .nav-link{width:100%}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.navbar{--bs-navbar-padding-x: 0;--bs-navbar-padding-y: 0.5rem;--bs-navbar-color: rgba(0, 0, 0, 0.55);--bs-navbar-hover-color: rgba(0, 0, 0, 0.7);--bs-navbar-disabled-color: rgba(0, 0, 0, 0.3);--bs-navbar-active-color: rgba(0, 0, 0, 0.9);--bs-navbar-brand-padding-y: 0.3359375rem;--bs-navbar-brand-margin-end: 1rem;--bs-navbar-brand-font-size: 1.09375rem;--bs-navbar-brand-color: rgba(0, 0, 0, 0.9);--bs-navbar-brand-hover-color: rgba(0, 0, 0, 0.9);--bs-navbar-nav-link-padding-x: 0.5rem;--bs-navbar-toggler-padding-y: 0.25rem;--bs-navbar-toggler-padding-x: 0.75rem;--bs-navbar-toggler-font-size: 1.09375rem;--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");--bs-navbar-toggler-border-color: rgba(0, 0, 0, 0.1);--bs-navbar-toggler-border-radius: 0.25rem;--bs-navbar-toggler-focus-width: 0.25rem;--bs-navbar-toggler-transition: box-shadow 0.15s ease-in-out;position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:var(--bs-navbar-padding-y) var(--bs-navbar-padding-x)}.navbar>.container,.navbar>.container-fluid,.navbar>.container-sm,.navbar>.container-md,.navbar>.container-lg,.navbar>.container-xl,.navbar>.container-xxl{display:flex;flex-wrap:inherit;align-items:center;justify-content:space-between}.navbar-brand{padding-top:var(--bs-navbar-brand-padding-y);padding-bottom:var(--bs-navbar-brand-padding-y);margin-right:var(--bs-navbar-brand-margin-end);font-size:var(--bs-navbar-brand-font-size);color:var(--bs-navbar-brand-color);white-space:nowrap}.navbar-brand:hover,.navbar-brand:focus{color:var(--bs-navbar-brand-hover-color)}.navbar-nav{--bs-nav-link-padding-x: 0;--bs-nav-link-padding-y: 0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color: var(--bs-navbar-color);--bs-nav-link-hover-color: var(--bs-navbar-hover-color);--bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);display:flex;flex-direction:column;padding-left:0;margin-bottom:0;list-style:none}.navbar-nav .show>.nav-link,.navbar-nav .nav-link.active{color:var(--bs-navbar-active-color)}.navbar-nav .dropdown-menu{position:static}.navbar-text{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-navbar-color)}.navbar-text a,.navbar-text a:hover,.navbar-text a:focus{color:var(--bs-navbar-active-color)}.navbar-collapse{flex-basis:100%;flex-grow:1;align-items:center}.navbar-toggler{padding:var(--bs-navbar-toggler-padding-y) var(--bs-navbar-toggler-padding-x);font-size:var(--bs-navbar-toggler-font-size);line-height:1;color:var(--bs-navbar-color);background-color:rgba(0,0,0,0);border:var(--bs-border-width) solid var(--bs-navbar-toggler-border-color);border-radius:var(--bs-navbar-toggler-border-radius);transition:var(--bs-navbar-toggler-transition)}@media(prefers-reduced-motion: reduce){.navbar-toggler{transition:none}}.navbar-toggler:hover{text-decoration:none}.navbar-toggler:focus{text-decoration:none;outline:0;box-shadow:0 0 0 var(--bs-navbar-toggler-focus-width)}.navbar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;background-image:var(--bs-navbar-toggler-icon-bg);background-repeat:no-repeat;background-position:center;background-size:100%}.navbar-nav-scroll{max-height:var(--bs-scroll-height, 75vh);overflow-y:auto}@media(min-width: 576px){.navbar-expand-sm{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-sm .navbar-nav{flex-direction:row}.navbar-expand-sm .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-sm .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-sm .navbar-nav-scroll{overflow:visible}.navbar-expand-sm .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand-sm .navbar-toggler{display:none}.navbar-expand-sm .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand-sm .offcanvas .offcanvas-header{display:none}.navbar-expand-sm .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media(min-width: 768px){.navbar-expand-md{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-md .navbar-nav{flex-direction:row}.navbar-expand-md .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-md .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-md .navbar-nav-scroll{overflow:visible}.navbar-expand-md .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand-md .navbar-toggler{display:none}.navbar-expand-md .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand-md .offcanvas .offcanvas-header{display:none}.navbar-expand-md .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media(min-width: 992px){.navbar-expand-lg{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-lg .navbar-nav{flex-direction:row}.navbar-expand-lg .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-lg .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-lg .navbar-nav-scroll{overflow:visible}.navbar-expand-lg .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand-lg .navbar-toggler{display:none}.navbar-expand-lg .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand-lg .offcanvas .offcanvas-header{display:none}.navbar-expand-lg .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media(min-width: 1200px){.navbar-expand-xl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xl .navbar-nav{flex-direction:row}.navbar-expand-xl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xl .navbar-nav-scroll{overflow:visible}.navbar-expand-xl .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand-xl .navbar-toggler{display:none}.navbar-expand-xl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand-xl .offcanvas .offcanvas-header{display:none}.navbar-expand-xl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}@media(min-width: 1400px){.navbar-expand-xxl{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand-xxl .navbar-nav{flex-direction:row}.navbar-expand-xxl .navbar-nav .dropdown-menu{position:absolute}.navbar-expand-xxl .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand-xxl .navbar-nav-scroll{overflow:visible}.navbar-expand-xxl .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand-xxl .navbar-toggler{display:none}.navbar-expand-xxl .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand-xxl .offcanvas .offcanvas-header{display:none}.navbar-expand-xxl .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}}.navbar-expand{flex-wrap:nowrap;justify-content:flex-start}.navbar-expand .navbar-nav{flex-direction:row}.navbar-expand .navbar-nav .dropdown-menu{position:absolute}.navbar-expand .navbar-nav .nav-link{padding-right:var(--bs-navbar-nav-link-padding-x);padding-left:var(--bs-navbar-nav-link-padding-x)}.navbar-expand .navbar-nav-scroll{overflow:visible}.navbar-expand .navbar-collapse{display:flex !important;flex-basis:auto}.navbar-expand .navbar-toggler{display:none}.navbar-expand .offcanvas{position:static;z-index:auto;flex-grow:1;width:auto !important;height:auto !important;visibility:visible !important;background-color:rgba(0,0,0,0) !important;border:0 !important;transform:none !important;transition:none}.navbar-expand .offcanvas .offcanvas-header{display:none}.navbar-expand .offcanvas .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible}.navbar-dark{--bs-navbar-color: rgba(255, 255, 255, 0.55);--bs-navbar-hover-color: rgba(255, 255, 255, 0.75);--bs-navbar-disabled-color: rgba(255, 255, 255, 0.25);--bs-navbar-active-color: #fff;--bs-navbar-brand-color: #fff;--bs-navbar-brand-hover-color: #fff;--bs-navbar-toggler-border-color: rgba(255, 255, 255, 0.1);--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}.card{--bs-card-spacer-y: 1rem;--bs-card-spacer-x: 1rem;--bs-card-title-spacer-y: 0.5rem;--bs-card-border-width: 1px;--bs-card-border-color: var(--bs-border-color-translucent);--bs-card-border-radius: 0.25rem;--bs-card-box-shadow: ;--bs-card-inner-border-radius: calc(0.25rem - 1px);--bs-card-cap-padding-y: 0.5rem;--bs-card-cap-padding-x: 1rem;--bs-card-cap-bg: rgba(0, 0, 0, 0.03);--bs-card-cap-color: ;--bs-card-height: ;--bs-card-color: ;--bs-card-bg: #fff;--bs-card-img-overlay-padding: 1rem;--bs-card-group-margin: 0.75rem;position:relative;display:flex;flex-direction:column;min-width:0;height:var(--bs-card-height);word-wrap:break-word;background-color:var(--bs-card-bg);background-clip:border-box;border:var(--bs-card-border-width) solid var(--bs-card-border-color);border-radius:var(--bs-card-border-radius)}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card>.card-header+.list-group,.card>.list-group+.card-footer{border-top:0}.card-body{flex:1 1 auto;padding:var(--bs-card-spacer-y) var(--bs-card-spacer-x);color:var(--bs-card-color)}.card-title{margin-bottom:var(--bs-card-title-spacer-y)}.card-subtitle{margin-top:calc(-0.5*var(--bs-card-title-spacer-y));margin-bottom:0}.card-text:last-child{margin-bottom:0}.card-link+.card-link{margin-left:var(--bs-card-spacer-x)}.card-header{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);margin-bottom:0;color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-bottom:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-header:first-child{border-radius:var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0}.card-footer{padding:var(--bs-card-cap-padding-y) var(--bs-card-cap-padding-x);color:var(--bs-card-cap-color);background-color:var(--bs-card-cap-bg);border-top:var(--bs-card-border-width) solid var(--bs-card-border-color)}.card-footer:last-child{border-radius:0 0 var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius)}.card-header-tabs{margin-right:calc(-0.5*var(--bs-card-cap-padding-x));margin-bottom:calc(-1*var(--bs-card-cap-padding-y));margin-left:calc(-0.5*var(--bs-card-cap-padding-x));border-bottom:0}.card-header-tabs .nav-link.active{background-color:var(--bs-card-bg);border-bottom-color:var(--bs-card-bg)}.card-header-pills{margin-right:calc(-0.5*var(--bs-card-cap-padding-x));margin-left:calc(-0.5*var(--bs-card-cap-padding-x))}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:var(--bs-card-img-overlay-padding);border-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-top,.card-img-bottom{width:100%}.card-img,.card-img-top{border-top-left-radius:var(--bs-card-inner-border-radius);border-top-right-radius:var(--bs-card-inner-border-radius)}.card-img,.card-img-bottom{border-bottom-right-radius:var(--bs-card-inner-border-radius);border-bottom-left-radius:var(--bs-card-inner-border-radius)}.card-group>.card{margin-bottom:var(--bs-card-group-margin)}@media(min-width: 576px){.card-group{display:flex;flex-flow:row wrap}.card-group>.card{flex:1 0 0%;margin-bottom:0}.card-group>.card+.card{margin-left:0;border-left:0}.card-group>.card:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:not(:last-child) .card-img-top,.card-group>.card:not(:last-child) .card-header{border-top-right-radius:0}.card-group>.card:not(:last-child) .card-img-bottom,.card-group>.card:not(:last-child) .card-footer{border-bottom-right-radius:0}.card-group>.card:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:not(:first-child) .card-img-top,.card-group>.card:not(:first-child) .card-header{border-top-left-radius:0}.card-group>.card:not(:first-child) .card-img-bottom,.card-group>.card:not(:first-child) .card-footer{border-bottom-left-radius:0}}.accordion{--bs-accordion-color: #41505f;--bs-accordion-bg: #fbfcfe;--bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;--bs-accordion-border-color: var(--bs-border-color);--bs-accordion-border-width: 1px;--bs-accordion-border-radius: 0.25rem;--bs-accordion-inner-border-radius: calc(0.25rem - 1px);--bs-accordion-btn-padding-x: 1.25rem;--bs-accordion-btn-padding-y: 1rem;--bs-accordion-btn-color: #41505f;--bs-accordion-btn-bg: var(--bs-accordion-bg);--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2341505f'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");--bs-accordion-btn-icon-width: 1.25rem;--bs-accordion-btn-icon-transform: rotate(-180deg);--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%234864c3'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");--bs-accordion-btn-focus-border-color: #a8b7ec;--bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(80, 111, 217, 0.25);--bs-accordion-body-padding-x: 1.25rem;--bs-accordion-body-padding-y: 1rem;--bs-accordion-active-color: #4864c3;--bs-accordion-active-bg: #eef1fb}.accordion-button{position:relative;display:flex;align-items:center;width:100%;padding:var(--bs-accordion-btn-padding-y) var(--bs-accordion-btn-padding-x);font-size:0.875rem;color:var(--bs-accordion-btn-color);text-align:left;background-color:var(--bs-accordion-btn-bg);border:0;border-radius:0;overflow-anchor:none;transition:var(--bs-accordion-transition)}@media(prefers-reduced-motion: reduce){.accordion-button{transition:none}}.accordion-button:not(.collapsed){color:var(--bs-accordion-active-color);background-color:var(--bs-accordion-active-bg);box-shadow:inset 0 calc(-1*var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color)}.accordion-button:not(.collapsed)::after{background-image:var(--bs-accordion-btn-active-icon);transform:var(--bs-accordion-btn-icon-transform)}.accordion-button::after{flex-shrink:0;width:var(--bs-accordion-btn-icon-width);height:var(--bs-accordion-btn-icon-width);margin-left:auto;content:"";background-image:var(--bs-accordion-btn-icon);background-repeat:no-repeat;background-size:var(--bs-accordion-btn-icon-width);transition:var(--bs-accordion-btn-icon-transition)}@media(prefers-reduced-motion: reduce){.accordion-button::after{transition:none}}.accordion-button:hover{z-index:2}.accordion-button:focus{z-index:3;border-color:var(--bs-accordion-btn-focus-border-color);outline:0;box-shadow:var(--bs-accordion-btn-focus-box-shadow)}.accordion-header{margin-bottom:0}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)}.accordion-item:first-of-type{border-top-left-radius:var(--bs-accordion-border-radius);border-top-right-radius:var(--bs-accordion-border-radius)}.accordion-item:first-of-type .accordion-button{border-top-left-radius:var(--bs-accordion-inner-border-radius);border-top-right-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:not(:first-of-type){border-top:0}.accordion-item:last-of-type{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-item:last-of-type .accordion-button.collapsed{border-bottom-right-radius:var(--bs-accordion-inner-border-radius);border-bottom-left-radius:var(--bs-accordion-inner-border-radius)}.accordion-item:last-of-type .accordion-collapse{border-bottom-right-radius:var(--bs-accordion-border-radius);border-bottom-left-radius:var(--bs-accordion-border-radius)}.accordion-body{padding:var(--bs-accordion-body-padding-y) var(--bs-accordion-body-padding-x)}.accordion-flush .accordion-collapse{border-width:0}.accordion-flush .accordion-item{border-right:0;border-left:0;border-radius:0}.accordion-flush .accordion-item:first-child{border-top:0}.accordion-flush .accordion-item:last-child{border-bottom:0}.accordion-flush .accordion-item .accordion-button,.accordion-flush .accordion-item .accordion-button.collapsed{border-radius:0}.breadcrumb{--bs-breadcrumb-padding-x: 0;--bs-breadcrumb-padding-y: 0;--bs-breadcrumb-margin-bottom: 1rem;--bs-breadcrumb-bg: ;--bs-breadcrumb-border-radius: ;--bs-breadcrumb-divider-color: #6e7985;--bs-breadcrumb-item-padding-x: 0.5rem;--bs-breadcrumb-item-active-color: #6e7985;display:flex;flex-wrap:wrap;padding:var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);margin-bottom:var(--bs-breadcrumb-margin-bottom);font-size:var(--bs-breadcrumb-font-size);list-style:none;background-color:var(--bs-breadcrumb-bg);border-radius:var(--bs-breadcrumb-border-radius)}.breadcrumb-item+.breadcrumb-item{padding-left:var(--bs-breadcrumb-item-padding-x)}.breadcrumb-item+.breadcrumb-item::before{float:left;padding-right:var(--bs-breadcrumb-item-padding-x);color:var(--bs-breadcrumb-divider-color);content:var(--bs-breadcrumb-divider, "/") /* rtl: var(--bs-breadcrumb-divider, "/") */}.breadcrumb-item.active{color:var(--bs-breadcrumb-item-active-color)}.pagination{--bs-pagination-padding-x: 0.75rem;--bs-pagination-padding-y: 0.375rem;--bs-pagination-font-size:0.875rem;--bs-pagination-color: var(--bs-link-color);--bs-pagination-bg: #fff;--bs-pagination-border-width: 1px;--bs-pagination-border-color: #e2e5ec;--bs-pagination-border-radius: 0.25rem;--bs-pagination-hover-color: var(--bs-link-hover-color);--bs-pagination-hover-bg: #f3f5f9;--bs-pagination-hover-border-color: #e2e5ec;--bs-pagination-focus-color: var(--bs-link-hover-color);--bs-pagination-focus-bg: #f3f5f9;--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(80, 111, 217, 0.25);--bs-pagination-active-color: #fff;--bs-pagination-active-bg: #506fd9;--bs-pagination-active-border-color: #506fd9;--bs-pagination-disabled-color: #6e7985;--bs-pagination-disabled-bg: #fff;--bs-pagination-disabled-border-color: #e2e5ec;display:flex;padding-left:0;list-style:none}.page-link{position:relative;display:block;padding:var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);font-size:var(--bs-pagination-font-size);color:var(--bs-pagination-color);background-color:var(--bs-pagination-bg);border:var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media(prefers-reduced-motion: reduce){.page-link{transition:none}}.page-link:hover{z-index:2;color:var(--bs-pagination-hover-color);background-color:var(--bs-pagination-hover-bg);border-color:var(--bs-pagination-hover-border-color)}.page-link:focus{z-index:3;color:var(--bs-pagination-focus-color);background-color:var(--bs-pagination-focus-bg);outline:0;box-shadow:var(--bs-pagination-focus-box-shadow)}.page-link.active,.active>.page-link{z-index:3;color:var(--bs-pagination-active-color);background-color:var(--bs-pagination-active-bg);border-color:var(--bs-pagination-active-border-color)}.page-link.disabled,.disabled>.page-link{color:var(--bs-pagination-disabled-color);pointer-events:none;background-color:var(--bs-pagination-disabled-bg);border-color:var(--bs-pagination-disabled-border-color)}.page-item:not(:first-child) .page-link{margin-left:-1px}.page-item:first-child .page-link{border-top-left-radius:var(--bs-pagination-border-radius);border-bottom-left-radius:var(--bs-pagination-border-radius)}.page-item:last-child .page-link{border-top-right-radius:var(--bs-pagination-border-radius);border-bottom-right-radius:var(--bs-pagination-border-radius)}.pagination-lg{--bs-pagination-padding-x: 1.5rem;--bs-pagination-padding-y: 0.75rem;--bs-pagination-font-size:1.09375rem;--bs-pagination-border-radius: 0.5rem}.pagination-sm{--bs-pagination-padding-x: 0.5rem;--bs-pagination-padding-y: 0.25rem;--bs-pagination-font-size:0.8125rem;--bs-pagination-border-radius: 0.25rem}.badge{--bs-badge-padding-x: 0.65em;--bs-badge-padding-y: 0.35em;--bs-badge-font-size:0.75em;--bs-badge-font-weight: 700;--bs-badge-color: #fff;--bs-badge-border-radius: 0.25rem;display:inline-block;padding:var(--bs-badge-padding-y) var(--bs-badge-padding-x);font-size:var(--bs-badge-font-size);font-weight:var(--bs-badge-font-weight);line-height:1;color:var(--bs-badge-color);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:var(--bs-badge-border-radius)}.badge:empty{display:none}.btn .badge,.ui-datepicker-buttonpane button .badge,.gridjs-pages button .badge{position:relative;top:-1px}.alert{--bs-alert-bg: transparent;--bs-alert-padding-x: 1rem;--bs-alert-padding-y: 1rem;--bs-alert-margin-bottom: 1rem;--bs-alert-color: inherit;--bs-alert-border-color: transparent;--bs-alert-border: 1px solid var(--bs-alert-border-color);--bs-alert-border-radius: 0.25rem;position:relative;padding:var(--bs-alert-padding-y) var(--bs-alert-padding-x);margin-bottom:var(--bs-alert-margin-bottom);color:var(--bs-alert-color);background-color:var(--bs-alert-bg);border:var(--bs-alert-border);border-radius:var(--bs-alert-border-radius)}.alert-heading{color:inherit}.alert-link{font-weight:700}.alert-dismissible{padding-right:3rem}.alert-dismissible .btn-close{position:absolute;top:0;right:0;z-index:2;padding:1.25rem 1rem}.alert-primary{--bs-alert-color: #304382;--bs-alert-bg: #dce2f7;--bs-alert-border-color: #cbd4f4}.alert-primary .alert-link{color:#263668}.alert-secondary{--bs-alert-color: #424950;--bs-alert-bg: #e2e4e7;--bs-alert-border-color: #d4d7da}.alert-secondary .alert-link{color:#353a40}.alert-success{--bs-alert-color: #076e50;--bs-alert-bg: #cef1e7;--bs-alert-border-color: #b6e9da}.alert-success .alert-link{color:#065840}.alert-info{--bs-alert-color: #055160;--bs-alert-bg: #cff4fc;--bs-alert-border-color: #b6effb}.alert-info .alert-link{color:#04414d}.alert-warning{--bs-alert-color: #664d03;--bs-alert-bg: #fff3cd;--bs-alert-border-color: #ffecb5}.alert-warning .alert-link{color:#523e02}.alert-danger{--bs-alert-color: #842029;--bs-alert-bg: #f8d7da;--bs-alert-border-color: #f5c2c7}.alert-danger .alert-link{color:#6a1a21}.alert-light{--bs-alert-color: #636465;--bs-alert-bg: #fefefe;--bs-alert-border-color: #fdfdfe}.alert-light .alert-link{color:#4f5051}.alert-dark{--bs-alert-color: #14181d;--bs-alert-bg: #d3d4d6;--bs-alert-border-color: #bcbfc1}.alert-dark .alert-link{color:#101317}@keyframes progress-bar-stripes{0%{background-position-x:1rem}}.progress{--bs-progress-height: 1rem;--bs-progress-font-size:0.65625rem;--bs-progress-bg: #f3f5f9;--bs-progress-border-radius: 0.25rem;--bs-progress-box-shadow: inset 0 1px 2px rgba(33, 40, 48, 0.075);--bs-progress-bar-color: #fff;--bs-progress-bar-bg: #506fd9;--bs-progress-bar-transition: width 0.6s ease;display:flex;height:var(--bs-progress-height);overflow:hidden;font-size:var(--bs-progress-font-size);background-color:var(--bs-progress-bg);border-radius:var(--bs-progress-border-radius)}.progress-bar{display:flex;flex-direction:column;justify-content:center;overflow:hidden;color:var(--bs-progress-bar-color);text-align:center;white-space:nowrap;background-color:var(--bs-progress-bar-bg);transition:var(--bs-progress-bar-transition)}@media(prefers-reduced-motion: reduce){.progress-bar{transition:none}}.progress-bar-striped{background-image:linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);background-size:var(--bs-progress-height) var(--bs-progress-height)}.progress-bar-animated{animation:1s linear infinite progress-bar-stripes}@media(prefers-reduced-motion: reduce){.progress-bar-animated{animation:none}}.list-group{--bs-list-group-color: #212830;--bs-list-group-bg: #fff;--bs-list-group-border-color: rgba(0, 0, 0, 0.125);--bs-list-group-border-width: 1px;--bs-list-group-border-radius: 0.25rem;--bs-list-group-item-padding-x: 1rem;--bs-list-group-item-padding-y: 0.5rem;--bs-list-group-action-color: #41505f;--bs-list-group-action-hover-color: #41505f;--bs-list-group-action-hover-bg: #f8f9fc;--bs-list-group-action-active-color: #41505f;--bs-list-group-action-active-bg: #f3f5f9;--bs-list-group-disabled-color: #6e7985;--bs-list-group-disabled-bg: #fff;--bs-list-group-active-color: #fff;--bs-list-group-active-bg: #506fd9;--bs-list-group-active-border-color: #506fd9;display:flex;flex-direction:column;padding-left:0;margin-bottom:0;border-radius:var(--bs-list-group-border-radius)}.list-group-numbered{list-style-type:none;counter-reset:section}.list-group-numbered>.list-group-item::before{content:counters(section, ".") ". ";counter-increment:section}.list-group-item-action{width:100%;color:var(--bs-list-group-action-color);text-align:inherit}.list-group-item-action:hover,.list-group-item-action:focus{z-index:1;color:var(--bs-list-group-action-hover-color);text-decoration:none;background-color:var(--bs-list-group-action-hover-bg)}.list-group-item-action:active{color:var(--bs-list-group-action-active-color);background-color:var(--bs-list-group-action-active-bg)}.list-group-item{position:relative;display:block;padding:var(--bs-list-group-item-padding-y) var(--bs-list-group-item-padding-x);color:var(--bs-list-group-color);background-color:var(--bs-list-group-bg);border:var(--bs-list-group-border-width) solid var(--bs-list-group-border-color)}.list-group-item:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.list-group-item:last-child{border-bottom-right-radius:inherit;border-bottom-left-radius:inherit}.list-group-item.disabled,.list-group-item:disabled{color:var(--bs-list-group-disabled-color);pointer-events:none;background-color:var(--bs-list-group-disabled-bg)}.list-group-item.active{z-index:2;color:var(--bs-list-group-active-color);background-color:var(--bs-list-group-active-bg);border-color:var(--bs-list-group-active-border-color)}.list-group-item+.list-group-item{border-top-width:0}.list-group-item+.list-group-item.active{margin-top:calc(-1*var(--bs-list-group-border-width));border-top-width:var(--bs-list-group-border-width)}.list-group-horizontal{flex-direction:row}.list-group-horizontal>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal>.list-group-item.active{margin-top:0}.list-group-horizontal>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}@media(min-width: 576px){.list-group-horizontal-sm{flex-direction:row}.list-group-horizontal-sm>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-sm>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-sm>.list-group-item.active{margin-top:0}.list-group-horizontal-sm>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-sm>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media(min-width: 768px){.list-group-horizontal-md{flex-direction:row}.list-group-horizontal-md>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-md>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-md>.list-group-item.active{margin-top:0}.list-group-horizontal-md>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-md>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media(min-width: 992px){.list-group-horizontal-lg{flex-direction:row}.list-group-horizontal-lg>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-lg>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-lg>.list-group-item.active{margin-top:0}.list-group-horizontal-lg>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-lg>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media(min-width: 1200px){.list-group-horizontal-xl{flex-direction:row}.list-group-horizontal-xl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xl>.list-group-item.active{margin-top:0}.list-group-horizontal-xl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xl>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}@media(min-width: 1400px){.list-group-horizontal-xxl{flex-direction:row}.list-group-horizontal-xxl>.list-group-item:first-child:not(:last-child){border-bottom-left-radius:var(--bs-list-group-border-radius);border-top-right-radius:0}.list-group-horizontal-xxl>.list-group-item:last-child:not(:first-child){border-top-right-radius:var(--bs-list-group-border-radius);border-bottom-left-radius:0}.list-group-horizontal-xxl>.list-group-item.active{margin-top:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item{border-top-width:var(--bs-list-group-border-width);border-left-width:0}.list-group-horizontal-xxl>.list-group-item+.list-group-item.active{margin-left:calc(-1*var(--bs-list-group-border-width));border-left-width:var(--bs-list-group-border-width)}}.list-group-flush{border-radius:0}.list-group-flush>.list-group-item{border-width:0 0 var(--bs-list-group-border-width)}.list-group-flush>.list-group-item:last-child{border-bottom-width:0}.list-group-item-primary{color:#304382;background-color:#dce2f7}.list-group-item-primary.list-group-item-action:hover,.list-group-item-primary.list-group-item-action:focus{color:#304382;background-color:#c6cbde}.list-group-item-primary.list-group-item-action.active{color:#fff;background-color:#304382;border-color:#304382}.list-group-item-secondary{color:#424950;background-color:#e2e4e7}.list-group-item-secondary.list-group-item-action:hover,.list-group-item-secondary.list-group-item-action:focus{color:#424950;background-color:#cbcdd0}.list-group-item-secondary.list-group-item-action.active{color:#fff;background-color:#424950;border-color:#424950}.list-group-item-success{color:#076e50;background-color:#cef1e7}.list-group-item-success.list-group-item-action:hover,.list-group-item-success.list-group-item-action:focus{color:#076e50;background-color:#b9d9d0}.list-group-item-success.list-group-item-action.active{color:#fff;background-color:#076e50;border-color:#076e50}.list-group-item-info{color:#055160;background-color:#cff4fc}.list-group-item-info.list-group-item-action:hover,.list-group-item-info.list-group-item-action:focus{color:#055160;background-color:#badce3}.list-group-item-info.list-group-item-action.active{color:#fff;background-color:#055160;border-color:#055160}.list-group-item-warning{color:#664d03;background-color:#fff3cd}.list-group-item-warning.list-group-item-action:hover,.list-group-item-warning.list-group-item-action:focus{color:#664d03;background-color:#e6dbb9}.list-group-item-warning.list-group-item-action.active{color:#fff;background-color:#664d03;border-color:#664d03}.list-group-item-danger{color:#842029;background-color:#f8d7da}.list-group-item-danger.list-group-item-action:hover,.list-group-item-danger.list-group-item-action:focus{color:#842029;background-color:#dfc2c4}.list-group-item-danger.list-group-item-action.active{color:#fff;background-color:#842029;border-color:#842029}.list-group-item-light{color:#636465;background-color:#fefefe}.list-group-item-light.list-group-item-action:hover,.list-group-item-light.list-group-item-action:focus{color:#636465;background-color:#e5e5e5}.list-group-item-light.list-group-item-action.active{color:#fff;background-color:#636465;border-color:#636465}.list-group-item-dark{color:#14181d;background-color:#d3d4d6}.list-group-item-dark.list-group-item-action:hover,.list-group-item-dark.list-group-item-action:focus{color:#14181d;background-color:#bebfc1}.list-group-item-dark.list-group-item-action.active{color:#fff;background-color:#14181d;border-color:#14181d}.btn-close{box-sizing:content-box;width:1em;height:1em;padding:.25em .25em;color:#000;background:rgba(0,0,0,0) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;border:0;border-radius:.25rem;opacity:.5}.btn-close:hover{color:#000;text-decoration:none;opacity:.75}.btn-close:focus{outline:0;box-shadow:0 0 0 .25rem rgba(80,111,217,.25);opacity:1}.btn-close:disabled,.btn-close.disabled{pointer-events:none;user-select:none;opacity:.25}.btn-close-white{filter:invert(1) grayscale(100%) brightness(200%)}.toast{--bs-toast-zindex: 1090;--bs-toast-padding-x: 0.75rem;--bs-toast-padding-y: 0.5rem;--bs-toast-spacing: 1.5rem;--bs-toast-max-width: 350px;--bs-toast-font-size:0.875rem;--bs-toast-color: ;--bs-toast-bg: rgba(255, 255, 255, 0.85);--bs-toast-border-width: 1px;--bs-toast-border-color: var(--bs-border-color-translucent);--bs-toast-border-radius: 0.25rem;--bs-toast-box-shadow: 0 0.5rem 1rem rgba(33, 40, 48, 0.15);--bs-toast-header-color: #6e7985;--bs-toast-header-bg: rgba(255, 255, 255, 0.85);--bs-toast-header-border-color: rgba(0, 0, 0, 0.05);width:var(--bs-toast-max-width);max-width:100%;font-size:var(--bs-toast-font-size);color:var(--bs-toast-color);pointer-events:auto;background-color:var(--bs-toast-bg);background-clip:padding-box;border:var(--bs-toast-border-width) solid var(--bs-toast-border-color);box-shadow:var(--bs-toast-box-shadow);border-radius:var(--bs-toast-border-radius)}.toast.showing{opacity:0}.toast:not(.show){display:none}.toast-container{--bs-toast-zindex: 1090;position:absolute;z-index:var(--bs-toast-zindex);width:max-content;max-width:100%;pointer-events:none}.toast-container>:not(:last-child){margin-bottom:var(--bs-toast-spacing)}.toast-header{display:flex;align-items:center;padding:var(--bs-toast-padding-y) var(--bs-toast-padding-x);color:var(--bs-toast-header-color);background-color:var(--bs-toast-header-bg);background-clip:padding-box;border-bottom:var(--bs-toast-border-width) solid var(--bs-toast-header-border-color);border-top-left-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width));border-top-right-radius:calc(var(--bs-toast-border-radius) - var(--bs-toast-border-width))}.toast-header .btn-close{margin-right:calc(-0.5*var(--bs-toast-padding-x));margin-left:var(--bs-toast-padding-x)}.toast-body{padding:var(--bs-toast-padding-x);word-wrap:break-word}.modal{--bs-modal-zindex: 1055;--bs-modal-width: 500px;--bs-modal-padding: 1rem;--bs-modal-margin: 0.5rem;--bs-modal-color: ;--bs-modal-bg: #fff;--bs-modal-border-color: var(--bs-border-color-translucent);--bs-modal-border-width: 1px;--bs-modal-border-radius: 0.5rem;--bs-modal-box-shadow: 0 0.125rem 0.25rem rgba(33, 40, 48, 0.075);--bs-modal-inner-border-radius: calc(0.5rem - 1px);--bs-modal-header-padding-x: 1rem;--bs-modal-header-padding-y: 1rem;--bs-modal-header-padding: 1rem 1rem;--bs-modal-header-border-color: var(--bs-border-color);--bs-modal-header-border-width: 1px;--bs-modal-title-line-height: 1.5;--bs-modal-footer-gap: 0.5rem;--bs-modal-footer-bg: ;--bs-modal-footer-border-color: var(--bs-border-color);--bs-modal-footer-border-width: 1px;position:fixed;top:0;left:0;z-index:var(--bs-modal-zindex);display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0}.modal-dialog{position:relative;width:auto;margin:var(--bs-modal-margin);pointer-events:none}.modal.fade .modal-dialog{transition:transform .3s ease-out;transform:translate(0, -50px)}@media(prefers-reduced-motion: reduce){.modal.fade .modal-dialog{transition:none}}.modal.show .modal-dialog{transform:none}.modal.modal-static .modal-dialog{transform:scale(1.02)}.modal-dialog-scrollable{height:calc(100% - var(--bs-modal-margin)*2)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - var(--bs-modal-margin)*2)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;color:var(--bs-modal-color);pointer-events:auto;background-color:var(--bs-modal-bg);background-clip:padding-box;border:var(--bs-modal-border-width) solid var(--bs-modal-border-color);border-radius:var(--bs-modal-border-radius);outline:0}.modal-backdrop{--bs-backdrop-zindex: 1050;--bs-backdrop-bg: #000;--bs-backdrop-opacity: 0.5;position:fixed;top:0;left:0;z-index:var(--bs-backdrop-zindex);width:100vw;height:100vh;background-color:var(--bs-backdrop-bg)}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:var(--bs-backdrop-opacity)}.modal-header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;padding:var(--bs-modal-header-padding);border-bottom:var(--bs-modal-header-border-width) solid var(--bs-modal-header-border-color);border-top-left-radius:var(--bs-modal-inner-border-radius);border-top-right-radius:var(--bs-modal-inner-border-radius)}.modal-header .btn-close{padding:calc(var(--bs-modal-header-padding-y)*.5) calc(var(--bs-modal-header-padding-x)*.5);margin:calc(-0.5*var(--bs-modal-header-padding-y)) calc(-0.5*var(--bs-modal-header-padding-x)) calc(-0.5*var(--bs-modal-header-padding-y)) auto}.modal-title{margin-bottom:0;line-height:var(--bs-modal-title-line-height)}.modal-body{position:relative;flex:1 1 auto;padding:var(--bs-modal-padding)}.modal-footer{display:flex;flex-shrink:0;flex-wrap:wrap;align-items:center;justify-content:flex-end;padding:calc(var(--bs-modal-padding) - var(--bs-modal-footer-gap)*.5);background-color:var(--bs-modal-footer-bg);border-top:var(--bs-modal-footer-border-width) solid var(--bs-modal-footer-border-color);border-bottom-right-radius:var(--bs-modal-inner-border-radius);border-bottom-left-radius:var(--bs-modal-inner-border-radius)}.modal-footer>*{margin:calc(var(--bs-modal-footer-gap)*.5)}@media(min-width: 576px){.modal{--bs-modal-margin: 1.75rem;--bs-modal-box-shadow: 0 0.5rem 1rem rgba(33, 40, 48, 0.15)}.modal-dialog{max-width:var(--bs-modal-width);margin-right:auto;margin-left:auto}.modal-sm{--bs-modal-width: 300px}}@media(min-width: 992px){.modal-lg,.modal-xl{--bs-modal-width: 800px}}@media(min-width: 1200px){.modal-xl{--bs-modal-width: 1140px}}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-header,.modal-fullscreen .modal-footer{border-radius:0}.modal-fullscreen .modal-body{overflow-y:auto}@media(max-width: 575.98px){.modal-fullscreen-sm-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-sm-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-sm-down .modal-header,.modal-fullscreen-sm-down .modal-footer{border-radius:0}.modal-fullscreen-sm-down .modal-body{overflow-y:auto}}@media(max-width: 767.98px){.modal-fullscreen-md-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-md-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-md-down .modal-header,.modal-fullscreen-md-down .modal-footer{border-radius:0}.modal-fullscreen-md-down .modal-body{overflow-y:auto}}@media(max-width: 991.98px){.modal-fullscreen-lg-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-lg-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-lg-down .modal-header,.modal-fullscreen-lg-down .modal-footer{border-radius:0}.modal-fullscreen-lg-down .modal-body{overflow-y:auto}}@media(max-width: 1199.98px){.modal-fullscreen-xl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xl-down .modal-header,.modal-fullscreen-xl-down .modal-footer{border-radius:0}.modal-fullscreen-xl-down .modal-body{overflow-y:auto}}@media(max-width: 1399.98px){.modal-fullscreen-xxl-down{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen-xxl-down .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen-xxl-down .modal-header,.modal-fullscreen-xxl-down .modal-footer{border-radius:0}.modal-fullscreen-xxl-down .modal-body{overflow-y:auto}}.tooltip{--bs-tooltip-zindex: 1080;--bs-tooltip-max-width: 200px;--bs-tooltip-padding-x: 0.5rem;--bs-tooltip-padding-y: 0.25rem;--bs-tooltip-margin: ;--bs-tooltip-font-size:0.8125rem;--bs-tooltip-color: #fff;--bs-tooltip-bg: #000;--bs-tooltip-border-radius: 0.25rem;--bs-tooltip-opacity: 0.9;--bs-tooltip-arrow-width: 0.8rem;--bs-tooltip-arrow-height: 0.4rem;z-index:var(--bs-tooltip-zindex);display:block;padding:var(--bs-tooltip-arrow-height);margin:var(--bs-tooltip-margin);font-family:"Open Sans",sans-serif;font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-tooltip-font-size);word-wrap:break-word;opacity:0}.tooltip.show{opacity:var(--bs-tooltip-opacity)}.tooltip .tooltip-arrow{display:block;width:var(--bs-tooltip-arrow-width);height:var(--bs-tooltip-arrow-height)}.tooltip .tooltip-arrow::before{position:absolute;content:"";border-color:rgba(0,0,0,0);border-style:solid}.bs-tooltip-top .tooltip-arrow,.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow{bottom:0}.bs-tooltip-top .tooltip-arrow::before,.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before{top:-1px;border-width:var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width)*.5) 0;border-top-color:var(--bs-tooltip-bg)}.bs-tooltip-end .tooltip-arrow,.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow{left:0;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-end .tooltip-arrow::before,.bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before{right:-1px;border-width:calc(var(--bs-tooltip-arrow-width)*.5) var(--bs-tooltip-arrow-height) calc(var(--bs-tooltip-arrow-width)*.5) 0;border-right-color:var(--bs-tooltip-bg)}.bs-tooltip-bottom .tooltip-arrow,.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow{top:0}.bs-tooltip-bottom .tooltip-arrow::before,.bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before{bottom:-1px;border-width:0 calc(var(--bs-tooltip-arrow-width)*.5) var(--bs-tooltip-arrow-height);border-bottom-color:var(--bs-tooltip-bg)}.bs-tooltip-start .tooltip-arrow,.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow{right:0;width:var(--bs-tooltip-arrow-height);height:var(--bs-tooltip-arrow-width)}.bs-tooltip-start .tooltip-arrow::before,.bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before{left:-1px;border-width:calc(var(--bs-tooltip-arrow-width)*.5) 0 calc(var(--bs-tooltip-arrow-width)*.5) var(--bs-tooltip-arrow-height);border-left-color:var(--bs-tooltip-bg)}.tooltip-inner{max-width:var(--bs-tooltip-max-width);padding:var(--bs-tooltip-padding-y) var(--bs-tooltip-padding-x);color:var(--bs-tooltip-color);text-align:center;background-color:var(--bs-tooltip-bg);border-radius:var(--bs-tooltip-border-radius)}.popover{--bs-popover-zindex: 1070;--bs-popover-max-width: 276px;--bs-popover-font-size:0.8125rem;--bs-popover-bg: #fff;--bs-popover-border-width: 1px;--bs-popover-border-color: var(--bs-border-color-translucent);--bs-popover-border-radius: 0.5rem;--bs-popover-inner-border-radius: calc(0.5rem - 1px);--bs-popover-box-shadow: 0 0.5rem 1rem rgba(33, 40, 48, 0.15);--bs-popover-header-padding-x: 1rem;--bs-popover-header-padding-y: 0.5rem;--bs-popover-header-font-size:0.875rem;--bs-popover-header-color: ;--bs-popover-header-bg: #f0f0f0;--bs-popover-body-padding-x: 1rem;--bs-popover-body-padding-y: 1rem;--bs-popover-body-color: #41505f;--bs-popover-arrow-width: 1rem;--bs-popover-arrow-height: 0.5rem;--bs-popover-arrow-border: var(--bs-popover-border-color);z-index:var(--bs-popover-zindex);display:block;max-width:var(--bs-popover-max-width);font-family:"Open Sans",sans-serif;font-style:normal;font-weight:400;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;letter-spacing:normal;word-break:normal;white-space:normal;word-spacing:normal;line-break:auto;font-size:var(--bs-popover-font-size);word-wrap:break-word;background-color:var(--bs-popover-bg);background-clip:padding-box;border:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-radius:var(--bs-popover-border-radius)}.popover .popover-arrow{display:block;width:var(--bs-popover-arrow-width);height:var(--bs-popover-arrow-height)}.popover .popover-arrow::before,.popover .popover-arrow::after{position:absolute;display:block;content:"";border-color:rgba(0,0,0,0);border-style:solid;border-width:0}.bs-popover-top>.popover-arrow,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow{bottom:calc(-1*(var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-top>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before,.bs-popover-top>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after{border-width:var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width)*.5) 0}.bs-popover-top>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before{bottom:0;border-top-color:var(--bs-popover-arrow-border)}.bs-popover-top>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after{bottom:var(--bs-popover-border-width);border-top-color:var(--bs-popover-bg)}.bs-popover-end>.popover-arrow,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow{left:calc(-1*(var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-end>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before,.bs-popover-end>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after{border-width:calc(var(--bs-popover-arrow-width)*.5) var(--bs-popover-arrow-height) calc(var(--bs-popover-arrow-width)*.5) 0}.bs-popover-end>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before{left:0;border-right-color:var(--bs-popover-arrow-border)}.bs-popover-end>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after{left:var(--bs-popover-border-width);border-right-color:var(--bs-popover-bg)}.bs-popover-bottom>.popover-arrow,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow{top:calc(-1*(var(--bs-popover-arrow-height)) - var(--bs-popover-border-width))}.bs-popover-bottom>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before,.bs-popover-bottom>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after{border-width:0 calc(var(--bs-popover-arrow-width)*.5) var(--bs-popover-arrow-height)}.bs-popover-bottom>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before{top:0;border-bottom-color:var(--bs-popover-arrow-border)}.bs-popover-bottom>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after{top:var(--bs-popover-border-width);border-bottom-color:var(--bs-popover-bg)}.bs-popover-bottom .popover-header::before,.bs-popover-auto[data-popper-placement^=bottom] .popover-header::before{position:absolute;top:0;left:50%;display:block;width:var(--bs-popover-arrow-width);margin-left:calc(-0.5*var(--bs-popover-arrow-width));content:"";border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-header-bg)}.bs-popover-start>.popover-arrow,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow{right:calc(-1*(var(--bs-popover-arrow-height)) - var(--bs-popover-border-width));width:var(--bs-popover-arrow-height);height:var(--bs-popover-arrow-width)}.bs-popover-start>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before,.bs-popover-start>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after{border-width:calc(var(--bs-popover-arrow-width)*.5) 0 calc(var(--bs-popover-arrow-width)*.5) var(--bs-popover-arrow-height)}.bs-popover-start>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before{right:0;border-left-color:var(--bs-popover-arrow-border)}.bs-popover-start>.popover-arrow::after,.bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after{right:var(--bs-popover-border-width);border-left-color:var(--bs-popover-bg)}.popover-header{padding:var(--bs-popover-header-padding-y) var(--bs-popover-header-padding-x);margin-bottom:0;font-size:var(--bs-popover-header-font-size);color:var(--bs-popover-header-color);background-color:var(--bs-popover-header-bg);border-bottom:var(--bs-popover-border-width) solid var(--bs-popover-border-color);border-top-left-radius:var(--bs-popover-inner-border-radius);border-top-right-radius:var(--bs-popover-inner-border-radius)}.popover-header:empty{display:none}.popover-body{padding:var(--bs-popover-body-padding-y) var(--bs-popover-body-padding-x);color:var(--bs-popover-body-color)}.carousel{position:relative}.carousel.pointer-event{touch-action:pan-y}.carousel-inner{position:relative;width:100%;overflow:hidden}.carousel-inner::after{display:block;clear:both;content:""}.carousel-item{position:relative;display:none;float:left;width:100%;margin-right:-100%;backface-visibility:hidden;transition:transform .6s ease-in-out}@media(prefers-reduced-motion: reduce){.carousel-item{transition:none}}.carousel-item.active,.carousel-item-next,.carousel-item-prev{display:block}.carousel-item-next:not(.carousel-item-start),.active.carousel-item-end{transform:translateX(100%)}.carousel-item-prev:not(.carousel-item-end),.active.carousel-item-start{transform:translateX(-100%)}.carousel-fade .carousel-item{opacity:0;transition-property:opacity;transform:none}.carousel-fade .carousel-item.active,.carousel-fade .carousel-item-next.carousel-item-start,.carousel-fade .carousel-item-prev.carousel-item-end{z-index:1;opacity:1}.carousel-fade .active.carousel-item-start,.carousel-fade .active.carousel-item-end{z-index:0;opacity:0;transition:opacity 0s .6s}@media(prefers-reduced-motion: reduce){.carousel-fade .active.carousel-item-start,.carousel-fade .active.carousel-item-end{transition:none}}.carousel-control-prev,.carousel-control-next{position:absolute;top:0;bottom:0;z-index:1;display:flex;align-items:center;justify-content:center;width:15%;padding:0;color:#fff;text-align:center;background:none;border:0;opacity:.5;transition:opacity .15s ease}@media(prefers-reduced-motion: reduce){.carousel-control-prev,.carousel-control-next{transition:none}}.carousel-control-prev:hover,.carousel-control-prev:focus,.carousel-control-next:hover,.carousel-control-next:focus{color:#fff;text-decoration:none;outline:0;opacity:.9}.carousel-control-prev{left:0}.carousel-control-next{right:0}.carousel-control-prev-icon,.carousel-control-next-icon{display:inline-block;width:2rem;height:2rem;background-repeat:no-repeat;background-position:50%;background-size:100% 100%}.carousel-control-prev-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e")}.carousel-control-next-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")}.carousel-indicators{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;justify-content:center;padding:0;margin-right:15%;margin-bottom:1rem;margin-left:15%;list-style:none}.carousel-indicators [data-bs-target]{box-sizing:content-box;flex:0 1 auto;width:30px;height:3px;padding:0;margin-right:3px;margin-left:3px;text-indent:-999px;cursor:pointer;background-color:#fff;background-clip:padding-box;border:0;border-top:10px solid rgba(0,0,0,0);border-bottom:10px solid rgba(0,0,0,0);opacity:.5;transition:opacity .6s ease}@media(prefers-reduced-motion: reduce){.carousel-indicators [data-bs-target]{transition:none}}.carousel-indicators .active{opacity:1}.carousel-caption{position:absolute;right:15%;bottom:1.25rem;left:15%;padding-top:1.25rem;padding-bottom:1.25rem;color:#fff;text-align:center}.carousel-dark .carousel-control-prev-icon,.carousel-dark .carousel-control-next-icon{filter:invert(1) grayscale(100)}.carousel-dark .carousel-indicators [data-bs-target]{background-color:#000}.carousel-dark .carousel-caption{color:#000}.spinner-grow,.spinner-border{display:inline-block;width:var(--bs-spinner-width);height:var(--bs-spinner-height);vertical-align:var(--bs-spinner-vertical-align);border-radius:50%;animation:var(--bs-spinner-animation-speed) linear infinite var(--bs-spinner-animation-name)}@keyframes spinner-border{to{transform:rotate(360deg) rtl:ignore}}.spinner-border{--bs-spinner-width: 2rem;--bs-spinner-height: 2rem;--bs-spinner-vertical-align: -0.125em;--bs-spinner-border-width: 0.25em;--bs-spinner-animation-speed: 0.75s;--bs-spinner-animation-name: spinner-border;border:var(--bs-spinner-border-width) solid currentcolor;border-right-color:rgba(0,0,0,0)}.spinner-border-sm{--bs-spinner-width: 1rem;--bs-spinner-height: 1rem;--bs-spinner-border-width: 0.2em}@keyframes spinner-grow{0%{transform:scale(0)}50%{opacity:1;transform:none}}.spinner-grow{--bs-spinner-width: 2rem;--bs-spinner-height: 2rem;--bs-spinner-vertical-align: -0.125em;--bs-spinner-animation-speed: 0.75s;--bs-spinner-animation-name: spinner-grow;background-color:currentcolor;opacity:0}.spinner-grow-sm{--bs-spinner-width: 1rem;--bs-spinner-height: 1rem}@media(prefers-reduced-motion: reduce){.spinner-border,.spinner-grow{--bs-spinner-animation-speed: 1.5s}}.offcanvas,.offcanvas-xxl,.offcanvas-xl,.offcanvas-lg,.offcanvas-md,.offcanvas-sm{--bs-offcanvas-zindex: 1045;--bs-offcanvas-width: 400px;--bs-offcanvas-height: 30vh;--bs-offcanvas-padding-x: 1rem;--bs-offcanvas-padding-y: 1rem;--bs-offcanvas-color: ;--bs-offcanvas-bg: #fff;--bs-offcanvas-border-width: 1px;--bs-offcanvas-border-color: var(--bs-border-color-translucent);--bs-offcanvas-box-shadow: 0 0.125rem 0.25rem rgba(33, 40, 48, 0.075)}@media(max-width: 575.98px){.offcanvas-sm{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media(max-width: 575.98px)and (prefers-reduced-motion: reduce){.offcanvas-sm{transition:none}}@media(max-width: 575.98px){.offcanvas-sm.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media(max-width: 575.98px){.offcanvas-sm.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media(max-width: 575.98px){.offcanvas-sm.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media(max-width: 575.98px){.offcanvas-sm.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media(max-width: 575.98px){.offcanvas-sm.showing,.offcanvas-sm.show:not(.hiding){transform:none}}@media(max-width: 575.98px){.offcanvas-sm.showing,.offcanvas-sm.hiding,.offcanvas-sm.show{visibility:visible}}@media(min-width: 576px){.offcanvas-sm{--bs-offcanvas-height: auto;--bs-offcanvas-border-width: 0;background-color:rgba(0,0,0,0) !important}.offcanvas-sm .offcanvas-header{display:none}.offcanvas-sm .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:rgba(0,0,0,0) !important}}@media(max-width: 767.98px){.offcanvas-md{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media(max-width: 767.98px)and (prefers-reduced-motion: reduce){.offcanvas-md{transition:none}}@media(max-width: 767.98px){.offcanvas-md.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media(max-width: 767.98px){.offcanvas-md.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media(max-width: 767.98px){.offcanvas-md.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media(max-width: 767.98px){.offcanvas-md.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media(max-width: 767.98px){.offcanvas-md.showing,.offcanvas-md.show:not(.hiding){transform:none}}@media(max-width: 767.98px){.offcanvas-md.showing,.offcanvas-md.hiding,.offcanvas-md.show{visibility:visible}}@media(min-width: 768px){.offcanvas-md{--bs-offcanvas-height: auto;--bs-offcanvas-border-width: 0;background-color:rgba(0,0,0,0) !important}.offcanvas-md .offcanvas-header{display:none}.offcanvas-md .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:rgba(0,0,0,0) !important}}@media(max-width: 991.98px){.offcanvas-lg{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media(max-width: 991.98px)and (prefers-reduced-motion: reduce){.offcanvas-lg{transition:none}}@media(max-width: 991.98px){.offcanvas-lg.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media(max-width: 991.98px){.offcanvas-lg.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media(max-width: 991.98px){.offcanvas-lg.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media(max-width: 991.98px){.offcanvas-lg.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media(max-width: 991.98px){.offcanvas-lg.showing,.offcanvas-lg.show:not(.hiding){transform:none}}@media(max-width: 991.98px){.offcanvas-lg.showing,.offcanvas-lg.hiding,.offcanvas-lg.show{visibility:visible}}@media(min-width: 992px){.offcanvas-lg{--bs-offcanvas-height: auto;--bs-offcanvas-border-width: 0;background-color:rgba(0,0,0,0) !important}.offcanvas-lg .offcanvas-header{display:none}.offcanvas-lg .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:rgba(0,0,0,0) !important}}@media(max-width: 1199.98px){.offcanvas-xl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media(max-width: 1199.98px)and (prefers-reduced-motion: reduce){.offcanvas-xl{transition:none}}@media(max-width: 1199.98px){.offcanvas-xl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media(max-width: 1199.98px){.offcanvas-xl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media(max-width: 1199.98px){.offcanvas-xl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media(max-width: 1199.98px){.offcanvas-xl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media(max-width: 1199.98px){.offcanvas-xl.showing,.offcanvas-xl.show:not(.hiding){transform:none}}@media(max-width: 1199.98px){.offcanvas-xl.showing,.offcanvas-xl.hiding,.offcanvas-xl.show{visibility:visible}}@media(min-width: 1200px){.offcanvas-xl{--bs-offcanvas-height: auto;--bs-offcanvas-border-width: 0;background-color:rgba(0,0,0,0) !important}.offcanvas-xl .offcanvas-header{display:none}.offcanvas-xl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:rgba(0,0,0,0) !important}}@media(max-width: 1399.98px){.offcanvas-xxl{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}}@media(max-width: 1399.98px)and (prefers-reduced-motion: reduce){.offcanvas-xxl{transition:none}}@media(max-width: 1399.98px){.offcanvas-xxl.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}}@media(max-width: 1399.98px){.offcanvas-xxl.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}}@media(max-width: 1399.98px){.offcanvas-xxl.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}}@media(max-width: 1399.98px){.offcanvas-xxl.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}}@media(max-width: 1399.98px){.offcanvas-xxl.showing,.offcanvas-xxl.show:not(.hiding){transform:none}}@media(max-width: 1399.98px){.offcanvas-xxl.showing,.offcanvas-xxl.hiding,.offcanvas-xxl.show{visibility:visible}}@media(min-width: 1400px){.offcanvas-xxl{--bs-offcanvas-height: auto;--bs-offcanvas-border-width: 0;background-color:rgba(0,0,0,0) !important}.offcanvas-xxl .offcanvas-header{display:none}.offcanvas-xxl .offcanvas-body{display:flex;flex-grow:0;padding:0;overflow-y:visible;background-color:rgba(0,0,0,0) !important}}.offcanvas{position:fixed;bottom:0;z-index:var(--bs-offcanvas-zindex);display:flex;flex-direction:column;max-width:100%;color:var(--bs-offcanvas-color);visibility:hidden;background-color:var(--bs-offcanvas-bg);background-clip:padding-box;outline:0;transition:transform .3s ease-in-out}@media(prefers-reduced-motion: reduce){.offcanvas{transition:none}}.offcanvas.offcanvas-start{top:0;left:0;width:var(--bs-offcanvas-width);border-right:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(-100%)}.offcanvas.offcanvas-end{top:0;right:0;width:var(--bs-offcanvas-width);border-left:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateX(100%)}.offcanvas.offcanvas-top{top:0;right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-bottom:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(-100%)}.offcanvas.offcanvas-bottom{right:0;left:0;height:var(--bs-offcanvas-height);max-height:100%;border-top:var(--bs-offcanvas-border-width) solid var(--bs-offcanvas-border-color);transform:translateY(100%)}.offcanvas.showing,.offcanvas.show:not(.hiding){transform:none}.offcanvas.showing,.offcanvas.hiding,.offcanvas.show{visibility:visible}.offcanvas-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}.offcanvas-backdrop.fade{opacity:0}.offcanvas-backdrop.show{opacity:.5}.offcanvas-header{display:flex;align-items:center;justify-content:space-between;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x)}.offcanvas-header .btn-close{padding:calc(var(--bs-offcanvas-padding-y)*.5) calc(var(--bs-offcanvas-padding-x)*.5);margin-top:calc(-0.5*var(--bs-offcanvas-padding-y));margin-right:calc(-0.5*var(--bs-offcanvas-padding-x));margin-bottom:calc(-0.5*var(--bs-offcanvas-padding-y))}.offcanvas-title{margin-bottom:0;line-height:1.5}.offcanvas-body{flex-grow:1;padding:var(--bs-offcanvas-padding-y) var(--bs-offcanvas-padding-x);overflow-y:auto}.placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5}.placeholder.btn::before,.ui-datepicker-buttonpane button.placeholder::before,.gridjs-pages button.placeholder::before{display:inline-block;content:""}.placeholder-xs{min-height:.6em}.placeholder-sm{min-height:.8em}.placeholder-lg{min-height:1.2em}.placeholder-glow .placeholder{animation:placeholder-glow 2s ease-in-out infinite}@keyframes placeholder-glow{50%{opacity:.2}}.placeholder-wave{mask-image:linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);mask-size:200% 100%;animation:placeholder-wave 2s linear infinite}@keyframes placeholder-wave{100%{mask-position:-200% 0%}}.clearfix::after{display:block;clear:both;content:""}.text-bg-primary{color:#fff !important;background-color:RGBA(80, 111, 217, var(--bs-bg-opacity, 1)) !important}.text-bg-secondary{color:#000 !important;background-color:RGBA(110, 121, 133, var(--bs-bg-opacity, 1)) !important}.text-bg-success{color:#000 !important;background-color:RGBA(12, 183, 133, var(--bs-bg-opacity, 1)) !important}.text-bg-info{color:#000 !important;background-color:RGBA(13, 202, 240, var(--bs-bg-opacity, 1)) !important}.text-bg-warning{color:#000 !important;background-color:RGBA(255, 193, 7, var(--bs-bg-opacity, 1)) !important}.text-bg-danger{color:#fff !important;background-color:RGBA(220, 53, 69, var(--bs-bg-opacity, 1)) !important}.text-bg-light{color:#000 !important;background-color:RGBA(248, 249, 252, var(--bs-bg-opacity, 1)) !important}.text-bg-dark{color:#fff !important;background-color:RGBA(33, 40, 48, var(--bs-bg-opacity, 1)) !important}.link-primary{color:#506fd9 !important}.link-primary:hover,.link-primary:focus{color:#4059ae !important}.link-secondary{color:#6e7985 !important}.link-secondary:hover,.link-secondary:focus{color:#8b949d !important}.link-success{color:#0cb785 !important}.link-success:hover,.link-success:focus{color:#3dc59d !important}.link-info{color:#0dcaf0 !important}.link-info:hover,.link-info:focus{color:#3dd5f3 !important}.link-warning{color:#ffc107 !important}.link-warning:hover,.link-warning:focus{color:#ffcd39 !important}.link-danger{color:#dc3545 !important}.link-danger:hover,.link-danger:focus{color:#b02a37 !important}.link-light{color:#f8f9fc !important}.link-light:hover,.link-light:focus{color:#f9fafd !important}.link-dark{color:#212830 !important}.link-dark:hover,.link-dark:focus{color:#1a2026 !important}.ratio{position:relative;width:100%}.ratio::before{display:block;padding-top:var(--bs-aspect-ratio);content:""}.ratio>*{position:absolute;top:0;left:0;width:100%;height:100%}.ratio-1x1{--bs-aspect-ratio: 100%}.ratio-4x3{--bs-aspect-ratio: 75%}.ratio-16x9{--bs-aspect-ratio: 56.25%}.ratio-21x9{--bs-aspect-ratio: 42.8571428571%}.fixed-top{position:fixed;top:0;right:0;left:0;z-index:1030}.fixed-bottom{position:fixed;right:0;bottom:0;left:0;z-index:1030}.sticky-top{position:sticky;top:0;z-index:1020}.sticky-bottom{position:sticky;bottom:0;z-index:1020}@media(min-width: 576px){.sticky-sm-top{position:sticky;top:0;z-index:1020}.sticky-sm-bottom{position:sticky;bottom:0;z-index:1020}}@media(min-width: 768px){.sticky-md-top{position:sticky;top:0;z-index:1020}.sticky-md-bottom{position:sticky;bottom:0;z-index:1020}}@media(min-width: 992px){.sticky-lg-top{position:sticky;top:0;z-index:1020}.sticky-lg-bottom{position:sticky;bottom:0;z-index:1020}}@media(min-width: 1200px){.sticky-xl-top{position:sticky;top:0;z-index:1020}.sticky-xl-bottom{position:sticky;bottom:0;z-index:1020}}@media(min-width: 1400px){.sticky-xxl-top{position:sticky;top:0;z-index:1020}.sticky-xxl-bottom{position:sticky;bottom:0;z-index:1020}}.hstack{display:flex;flex-direction:row;align-items:center;align-self:stretch}.vstack{display:flex;flex:1 1 auto;flex-direction:column;align-self:stretch}.visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.stretched-link::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;content:""}.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vr{display:inline-block;align-self:stretch;width:1px;min-height:1em;background-color:currentcolor;opacity:.25}.align-baseline{vertical-align:baseline !important}.align-top{vertical-align:top !important}.align-middle{vertical-align:middle !important}.align-bottom{vertical-align:bottom !important}.align-text-bottom{vertical-align:text-bottom !important}.align-text-top{vertical-align:text-top !important}.float-start{float:left !important}.float-end{float:right !important}.float-none{float:none !important}.opacity-0{opacity:0 !important}.opacity-25{opacity:.25 !important}.opacity-50{opacity:.5 !important}.opacity-75{opacity:.75 !important}.opacity-100{opacity:1 !important}.overflow-auto{overflow:auto !important}.overflow-hidden{overflow:hidden !important}.overflow-visible{overflow:visible !important}.overflow-scroll{overflow:scroll !important}.d-inline{display:inline !important}.d-inline-block{display:inline-block !important}.d-block{display:block !important}.d-grid{display:grid !important}.d-table{display:table !important}.d-table-row{display:table-row !important}.d-table-cell{display:table-cell !important}.d-flex{display:flex !important}.d-inline-flex{display:inline-flex !important}.d-none{display:none !important}.shadow{box-shadow:0 .5rem 1rem rgba(33,40,48,.15) !important}.shadow-sm{box-shadow:0 .125rem .25rem rgba(33,40,48,.075) !important}.shadow-lg{box-shadow:0 1rem 3rem rgba(33,40,48,.175) !important}.shadow-none{box-shadow:none !important}.position-static{position:static !important}.position-relative{position:relative !important}.position-absolute{position:absolute !important}.position-fixed{position:fixed !important}.position-sticky{position:sticky !important}.top-50{top:50% !important}.top-100{top:100% !important}.bottom-0{bottom:0 !important}.bottom-50{bottom:50% !important}.bottom-100{bottom:100% !important}.start-0{left:0 !important}.start-50{left:50% !important}.start-100{left:100% !important}.end-0{right:0 !important}.end-50{right:50% !important}.end-100{right:100% !important}.translate-middle{transform:translate(-50%, -50%) !important}.translate-middle-x{transform:translateX(-50%) !important}.translate-middle-y{transform:translateY(-50%) !important}.border{border:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important}.border-0{border:0 !important}.border-top{border-top:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important}.border-top-0{border-top:0 !important}.border-end{border-right:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important}.border-end-0{border-right:0 !important}.border-bottom{border-bottom:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important}.border-bottom-0{border-bottom:0 !important}.border-start{border-left:var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important}.border-start-0{border-left:0 !important}.border-primary{--bs-border-opacity: 1;border-color:rgba(var(--bs-primary-rgb), var(--bs-border-opacity)) !important}.border-secondary{--bs-border-opacity: 1;border-color:rgba(var(--bs-secondary-rgb), var(--bs-border-opacity)) !important}.border-success{--bs-border-opacity: 1;border-color:rgba(var(--bs-success-rgb), var(--bs-border-opacity)) !important}.border-info{--bs-border-opacity: 1;border-color:rgba(var(--bs-info-rgb), var(--bs-border-opacity)) !important}.border-warning{--bs-border-opacity: 1;border-color:rgba(var(--bs-warning-rgb), var(--bs-border-opacity)) !important}.border-danger{--bs-border-opacity: 1;border-color:rgba(var(--bs-danger-rgb), var(--bs-border-opacity)) !important}.border-light{--bs-border-opacity: 1;border-color:rgba(var(--bs-light-rgb), var(--bs-border-opacity)) !important}.border-dark{--bs-border-opacity: 1;border-color:rgba(var(--bs-dark-rgb), var(--bs-border-opacity)) !important}.border-white{--bs-border-opacity: 1;border-color:rgba(var(--bs-white-rgb), var(--bs-border-opacity)) !important}.border-1{--bs-border-width: 1px}.border-2{--bs-border-width: 2px}.border-3{--bs-border-width: 3px}.border-4{--bs-border-width: 4px}.border-5{--bs-border-width: 5px}.border-opacity-10{--bs-border-opacity: 0.1}.border-opacity-25{--bs-border-opacity: 0.25}.border-opacity-50{--bs-border-opacity: 0.5}.border-opacity-75{--bs-border-opacity: 0.75}.border-opacity-100{--bs-border-opacity: 1}.w-25{width:25% !important}.w-50{width:50% !important}.w-75{width:75% !important}.w-100{width:100% !important}.w-auto{width:auto !important}.mw-100{max-width:100% !important}.vw-100{width:100vw !important}.min-vw-100{min-width:100vw !important}.h-25{height:25% !important}.h-50{height:50% !important}.h-75{height:75% !important}.h-100{height:100% !important}.h-auto{height:auto !important}.mh-100{max-height:100% !important}.vh-100{height:100vh !important}.min-vh-100{min-height:100vh !important}.flex-fill{flex:1 1 auto !important}.flex-row{flex-direction:row !important}.flex-column{flex-direction:column !important}.flex-row-reverse{flex-direction:row-reverse !important}.flex-column-reverse{flex-direction:column-reverse !important}.flex-grow-0{flex-grow:0 !important}.flex-grow-1{flex-grow:1 !important}.flex-shrink-0{flex-shrink:0 !important}.flex-shrink-1{flex-shrink:1 !important}.flex-wrap{flex-wrap:wrap !important}.flex-nowrap{flex-wrap:nowrap !important}.flex-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-start{justify-content:flex-start !important}.justify-content-end{justify-content:flex-end !important}.justify-content-center{justify-content:center !important}.justify-content-between{justify-content:space-between !important}.justify-content-around{justify-content:space-around !important}.justify-content-evenly{justify-content:space-evenly !important}.align-items-start{align-items:flex-start !important}.align-items-end{align-items:flex-end !important}.align-items-center{align-items:center !important}.align-items-baseline{align-items:baseline !important}.align-items-stretch{align-items:stretch !important}.align-content-start{align-content:flex-start !important}.align-content-end{align-content:flex-end !important}.align-content-center{align-content:center !important}.align-content-between{align-content:space-between !important}.align-content-around{align-content:space-around !important}.align-content-stretch{align-content:stretch !important}.align-self-auto{align-self:auto !important}.align-self-start{align-self:flex-start !important}.align-self-end{align-self:flex-end !important}.align-self-center{align-self:center !important}.align-self-baseline{align-self:baseline !important}.align-self-stretch{align-self:stretch !important}.order-first{order:-1 !important}.order-0{order:0 !important}.order-1{order:1 !important}.order-2{order:2 !important}.order-3{order:3 !important}.order-4{order:4 !important}.order-5{order:5 !important}.order-last{order:6 !important}.m-0{margin:0 !important}.m-1{margin:.25rem !important}.m-2{margin:.5rem !important}.m-3{margin:1rem !important}.m-4{margin:1.5rem !important}.m-5{margin:3rem !important}.m-auto{margin:auto !important}.mx-0{margin-right:0 !important;margin-left:0 !important}.mx-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-3{margin-right:1rem !important;margin-left:1rem !important}.mx-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-5{margin-right:3rem !important;margin-left:3rem !important}.mx-auto{margin-right:auto !important;margin-left:auto !important}.my-0{margin-top:0 !important;margin-bottom:0 !important}.my-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-0{margin-top:0 !important}.mt-1{margin-top:.25rem !important}.mt-2{margin-top:.5rem !important}.mt-3{margin-top:1rem !important}.mt-4{margin-top:1.5rem !important}.mt-5{margin-top:3rem !important}.mt-auto{margin-top:auto !important}.me-0{margin-right:0 !important}.me-1{margin-right:.25rem !important}.me-2{margin-right:.5rem !important}.me-3{margin-right:1rem !important}.me-4{margin-right:1.5rem !important}.me-5{margin-right:3rem !important}.me-auto{margin-right:auto !important}.mb-0{margin-bottom:0 !important}.mb-1{margin-bottom:.25rem !important}.mb-2{margin-bottom:.5rem !important}.mb-3{margin-bottom:1rem !important}.mb-4{margin-bottom:1.5rem !important}.mb-5{margin-bottom:3rem !important}.mb-auto{margin-bottom:auto !important}.ms-0{margin-left:0 !important}.ms-1{margin-left:.25rem !important}.ms-2{margin-left:.5rem !important}.ms-3{margin-left:1rem !important}.ms-4{margin-left:1.5rem !important}.ms-5{margin-left:3rem !important}.ms-auto{margin-left:auto !important}.p-0{padding:0 !important}.p-1{padding:.25rem !important}.p-2{padding:.5rem !important}.p-3{padding:1rem !important}.p-4{padding:1.5rem !important}.p-5{padding:3rem !important}.px-0{padding-right:0 !important;padding-left:0 !important}.px-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-3{padding-right:1rem !important;padding-left:1rem !important}.px-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-5{padding-right:3rem !important;padding-left:3rem !important}.py-0{padding-top:0 !important;padding-bottom:0 !important}.py-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-0{padding-top:0 !important}.pt-1{padding-top:.25rem !important}.pt-2{padding-top:.5rem !important}.pt-3{padding-top:1rem !important}.pt-4{padding-top:1.5rem !important}.pt-5{padding-top:3rem !important}.pe-0{padding-right:0 !important}.pe-1{padding-right:.25rem !important}.pe-2{padding-right:.5rem !important}.pe-3{padding-right:1rem !important}.pe-4{padding-right:1.5rem !important}.pe-5{padding-right:3rem !important}.pb-0{padding-bottom:0 !important}.pb-1{padding-bottom:.25rem !important}.pb-2{padding-bottom:.5rem !important}.pb-3{padding-bottom:1rem !important}.pb-4{padding-bottom:1.5rem !important}.pb-5{padding-bottom:3rem !important}.ps-0{padding-left:0 !important}.ps-1{padding-left:.25rem !important}.ps-2{padding-left:.5rem !important}.ps-3{padding-left:1rem !important}.ps-4{padding-left:1.5rem !important}.ps-5{padding-left:3rem !important}.gap-0{gap:0 !important}.gap-1{gap:.25rem !important}.gap-2{gap:.5rem !important}.gap-3{gap:1rem !important}.gap-4{gap:1.5rem !important}.gap-5{gap:3rem !important}.font-monospace{font-family:var(--bs-font-monospace) !important}.fs-1{font-size:calc(1.34375rem + 1.125vw) !important}.fs-2{font-size:calc(1.3rem + 0.6vw) !important}.fs-3{font-size:calc(1.278125rem + 0.3375vw) !important}.fs-4{font-size:calc(1.25625rem + 0.075vw) !important}.fs-5{font-size:1.09375rem !important}.fs-6{font-size:0.875rem !important}.fst-italic{font-style:italic !important}.fst-normal{font-style:normal !important}.fw-light{font-weight:300 !important}.fw-lighter{font-weight:lighter !important}.fw-normal{font-weight:400 !important}.fw-bold{font-weight:700 !important}.fw-semibold{font-weight:600 !important}.fw-bolder{font-weight:bolder !important}.lh-1{line-height:1 !important}.lh-sm{line-height:1.25 !important}.lh-base{line-height:1.5 !important}.lh-lg{line-height:2 !important}.text-start{text-align:left !important}.text-end{text-align:right !important}.text-center{text-align:center !important}.text-decoration-none{text-decoration:none !important}.text-decoration-underline{text-decoration:underline !important}.text-decoration-line-through{text-decoration:line-through !important}.text-lowercase{text-transform:lowercase !important}.text-uppercase{text-transform:uppercase !important}.text-capitalize{text-transform:capitalize !important}.text-wrap{white-space:normal !important}.text-nowrap{white-space:nowrap !important}.text-break{word-wrap:break-word !important;word-break:break-word !important}.text-primary{--bs-text-opacity: 1;color:rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important}.text-secondary{--bs-text-opacity: 1;color:rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important}.text-success{--bs-text-opacity: 1;color:rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important}.text-info{--bs-text-opacity: 1;color:rgba(var(--bs-info-rgb), var(--bs-text-opacity)) !important}.text-warning{--bs-text-opacity: 1;color:rgba(var(--bs-warning-rgb), var(--bs-text-opacity)) !important}.text-danger{--bs-text-opacity: 1;color:rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important}.text-light{--bs-text-opacity: 1;color:rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important}.text-dark{--bs-text-opacity: 1;color:rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important}.text-black{--bs-text-opacity: 1;color:rgba(var(--bs-black-rgb), var(--bs-text-opacity)) !important}.text-white{--bs-text-opacity: 1;color:rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important}.text-body{--bs-text-opacity: 1;color:rgba(var(--bs-body-color-rgb), var(--bs-text-opacity)) !important}.text-muted{--bs-text-opacity: 1;color:#6e7985 !important}.text-black-50{--bs-text-opacity: 1;color:rgba(0,0,0,.5) !important}.text-white-50{--bs-text-opacity: 1;color:rgba(255,255,255,.5) !important}.text-reset{--bs-text-opacity: 1;color:inherit !important}.text-opacity-25{--bs-text-opacity: 0.25}.text-opacity-50{--bs-text-opacity: 0.5}.text-opacity-75{--bs-text-opacity: 0.75}.text-opacity-100{--bs-text-opacity: 1}.bg-primary{--bs-bg-opacity: 1;background-color:rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important}.bg-secondary{--bs-bg-opacity: 1;background-color:rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important}.bg-success{--bs-bg-opacity: 1;background-color:rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important}.bg-info{--bs-bg-opacity: 1;background-color:rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important}.bg-warning{--bs-bg-opacity: 1;background-color:rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important}.bg-danger{--bs-bg-opacity: 1;background-color:rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important}.bg-light{--bs-bg-opacity: 1;background-color:rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important}.bg-dark{--bs-bg-opacity: 1;background-color:rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important}.bg-black{--bs-bg-opacity: 1;background-color:rgba(var(--bs-black-rgb), var(--bs-bg-opacity)) !important}.bg-white{--bs-bg-opacity: 1;background-color:rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important}.bg-body{--bs-bg-opacity: 1;background-color:rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important}.bg-transparent{--bs-bg-opacity: 1;background-color:rgba(0,0,0,0) !important}.bg-opacity-10{--bs-bg-opacity: 0.1}.bg-opacity-25{--bs-bg-opacity: 0.25}.bg-opacity-50{--bs-bg-opacity: 0.5}.bg-opacity-75{--bs-bg-opacity: 0.75}.bg-opacity-100{--bs-bg-opacity: 1}.bg-gradient{background-image:var(--bs-gradient) !important}.user-select-all{user-select:all !important}.user-select-auto{user-select:auto !important}.user-select-none{user-select:none !important}.pe-none{pointer-events:none !important}.pe-auto{pointer-events:auto !important}.rounded{border-radius:var(--bs-border-radius) !important}.rounded-0{border-radius:0 !important}.rounded-1{border-radius:var(--bs-border-radius-sm) !important}.rounded-2{border-radius:var(--bs-border-radius) !important}.rounded-3{border-radius:var(--bs-border-radius-lg) !important}.rounded-4{border-radius:var(--bs-border-radius-xl) !important}.rounded-5{border-radius:var(--bs-border-radius-2xl) !important}.rounded-circle{border-radius:50% !important}.rounded-pill{border-radius:var(--bs-border-radius-pill) !important}.rounded-top{border-top-left-radius:var(--bs-border-radius) !important;border-top-right-radius:var(--bs-border-radius) !important}.rounded-end{border-top-right-radius:var(--bs-border-radius) !important;border-bottom-right-radius:var(--bs-border-radius) !important}.rounded-bottom{border-bottom-right-radius:var(--bs-border-radius) !important;border-bottom-left-radius:var(--bs-border-radius) !important}.rounded-start{border-bottom-left-radius:var(--bs-border-radius) !important;border-top-left-radius:var(--bs-border-radius) !important}.visible{visibility:visible !important}.invisible{visibility:hidden !important}@media(min-width: 576px){.float-sm-start{float:left !important}.float-sm-end{float:right !important}.float-sm-none{float:none !important}.d-sm-inline{display:inline !important}.d-sm-inline-block{display:inline-block !important}.d-sm-block{display:block !important}.d-sm-grid{display:grid !important}.d-sm-table{display:table !important}.d-sm-table-row{display:table-row !important}.d-sm-table-cell{display:table-cell !important}.d-sm-flex{display:flex !important}.d-sm-inline-flex{display:inline-flex !important}.d-sm-none{display:none !important}.flex-sm-fill{flex:1 1 auto !important}.flex-sm-row{flex-direction:row !important}.flex-sm-column{flex-direction:column !important}.flex-sm-row-reverse{flex-direction:row-reverse !important}.flex-sm-column-reverse{flex-direction:column-reverse !important}.flex-sm-grow-0{flex-grow:0 !important}.flex-sm-grow-1{flex-grow:1 !important}.flex-sm-shrink-0{flex-shrink:0 !important}.flex-sm-shrink-1{flex-shrink:1 !important}.flex-sm-wrap{flex-wrap:wrap !important}.flex-sm-nowrap{flex-wrap:nowrap !important}.flex-sm-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-sm-start{justify-content:flex-start !important}.justify-content-sm-end{justify-content:flex-end !important}.justify-content-sm-center{justify-content:center !important}.justify-content-sm-between{justify-content:space-between !important}.justify-content-sm-around{justify-content:space-around !important}.justify-content-sm-evenly{justify-content:space-evenly !important}.align-items-sm-start{align-items:flex-start !important}.align-items-sm-end{align-items:flex-end !important}.align-items-sm-center{align-items:center !important}.align-items-sm-baseline{align-items:baseline !important}.align-items-sm-stretch{align-items:stretch !important}.align-content-sm-start{align-content:flex-start !important}.align-content-sm-end{align-content:flex-end !important}.align-content-sm-center{align-content:center !important}.align-content-sm-between{align-content:space-between !important}.align-content-sm-around{align-content:space-around !important}.align-content-sm-stretch{align-content:stretch !important}.align-self-sm-auto{align-self:auto !important}.align-self-sm-start{align-self:flex-start !important}.align-self-sm-end{align-self:flex-end !important}.align-self-sm-center{align-self:center !important}.align-self-sm-baseline{align-self:baseline !important}.align-self-sm-stretch{align-self:stretch !important}.order-sm-first{order:-1 !important}.order-sm-0{order:0 !important}.order-sm-1{order:1 !important}.order-sm-2{order:2 !important}.order-sm-3{order:3 !important}.order-sm-4{order:4 !important}.order-sm-5{order:5 !important}.order-sm-last{order:6 !important}.m-sm-0{margin:0 !important}.m-sm-1{margin:.25rem !important}.m-sm-2{margin:.5rem !important}.m-sm-3{margin:1rem !important}.m-sm-4{margin:1.5rem !important}.m-sm-5{margin:3rem !important}.m-sm-auto{margin:auto !important}.mx-sm-0{margin-right:0 !important;margin-left:0 !important}.mx-sm-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-sm-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-sm-3{margin-right:1rem !important;margin-left:1rem !important}.mx-sm-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-sm-5{margin-right:3rem !important;margin-left:3rem !important}.mx-sm-auto{margin-right:auto !important;margin-left:auto !important}.my-sm-0{margin-top:0 !important;margin-bottom:0 !important}.my-sm-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-sm-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-sm-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-sm-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-sm-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-sm-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-sm-0{margin-top:0 !important}.mt-sm-1{margin-top:.25rem !important}.mt-sm-2{margin-top:.5rem !important}.mt-sm-3{margin-top:1rem !important}.mt-sm-4{margin-top:1.5rem !important}.mt-sm-5{margin-top:3rem !important}.mt-sm-auto{margin-top:auto !important}.me-sm-0{margin-right:0 !important}.me-sm-1{margin-right:.25rem !important}.me-sm-2{margin-right:.5rem !important}.me-sm-3{margin-right:1rem !important}.me-sm-4{margin-right:1.5rem !important}.me-sm-5{margin-right:3rem !important}.me-sm-auto{margin-right:auto !important}.mb-sm-0{margin-bottom:0 !important}.mb-sm-1{margin-bottom:.25rem !important}.mb-sm-2{margin-bottom:.5rem !important}.mb-sm-3{margin-bottom:1rem !important}.mb-sm-4{margin-bottom:1.5rem !important}.mb-sm-5{margin-bottom:3rem !important}.mb-sm-auto{margin-bottom:auto !important}.ms-sm-0{margin-left:0 !important}.ms-sm-1{margin-left:.25rem !important}.ms-sm-2{margin-left:.5rem !important}.ms-sm-3{margin-left:1rem !important}.ms-sm-4{margin-left:1.5rem !important}.ms-sm-5{margin-left:3rem !important}.ms-sm-auto{margin-left:auto !important}.p-sm-0{padding:0 !important}.p-sm-1{padding:.25rem !important}.p-sm-2{padding:.5rem !important}.p-sm-3{padding:1rem !important}.p-sm-4{padding:1.5rem !important}.p-sm-5{padding:3rem !important}.px-sm-0{padding-right:0 !important;padding-left:0 !important}.px-sm-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-sm-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-sm-3{padding-right:1rem !important;padding-left:1rem !important}.px-sm-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-sm-5{padding-right:3rem !important;padding-left:3rem !important}.py-sm-0{padding-top:0 !important;padding-bottom:0 !important}.py-sm-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-sm-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-sm-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-sm-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-sm-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-sm-0{padding-top:0 !important}.pt-sm-1{padding-top:.25rem !important}.pt-sm-2{padding-top:.5rem !important}.pt-sm-3{padding-top:1rem !important}.pt-sm-4{padding-top:1.5rem !important}.pt-sm-5{padding-top:3rem !important}.pe-sm-0{padding-right:0 !important}.pe-sm-1{padding-right:.25rem !important}.pe-sm-2{padding-right:.5rem !important}.pe-sm-3{padding-right:1rem !important}.pe-sm-4{padding-right:1.5rem !important}.pe-sm-5{padding-right:3rem !important}.pb-sm-0{padding-bottom:0 !important}.pb-sm-1{padding-bottom:.25rem !important}.pb-sm-2{padding-bottom:.5rem !important}.pb-sm-3{padding-bottom:1rem !important}.pb-sm-4{padding-bottom:1.5rem !important}.pb-sm-5{padding-bottom:3rem !important}.ps-sm-0{padding-left:0 !important}.ps-sm-1{padding-left:.25rem !important}.ps-sm-2{padding-left:.5rem !important}.ps-sm-3{padding-left:1rem !important}.ps-sm-4{padding-left:1.5rem !important}.ps-sm-5{padding-left:3rem !important}.gap-sm-0{gap:0 !important}.gap-sm-1{gap:.25rem !important}.gap-sm-2{gap:.5rem !important}.gap-sm-3{gap:1rem !important}.gap-sm-4{gap:1.5rem !important}.gap-sm-5{gap:3rem !important}.text-sm-start{text-align:left !important}.text-sm-end{text-align:right !important}.text-sm-center{text-align:center !important}}@media(min-width: 768px){.float-md-start{float:left !important}.float-md-end{float:right !important}.float-md-none{float:none !important}.d-md-inline{display:inline !important}.d-md-inline-block{display:inline-block !important}.d-md-block{display:block !important}.d-md-grid{display:grid !important}.d-md-table{display:table !important}.d-md-table-row{display:table-row !important}.d-md-table-cell{display:table-cell !important}.d-md-flex{display:flex !important}.d-md-inline-flex{display:inline-flex !important}.d-md-none{display:none !important}.flex-md-fill{flex:1 1 auto !important}.flex-md-row{flex-direction:row !important}.flex-md-column{flex-direction:column !important}.flex-md-row-reverse{flex-direction:row-reverse !important}.flex-md-column-reverse{flex-direction:column-reverse !important}.flex-md-grow-0{flex-grow:0 !important}.flex-md-grow-1{flex-grow:1 !important}.flex-md-shrink-0{flex-shrink:0 !important}.flex-md-shrink-1{flex-shrink:1 !important}.flex-md-wrap{flex-wrap:wrap !important}.flex-md-nowrap{flex-wrap:nowrap !important}.flex-md-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-md-start{justify-content:flex-start !important}.justify-content-md-end{justify-content:flex-end !important}.justify-content-md-center{justify-content:center !important}.justify-content-md-between{justify-content:space-between !important}.justify-content-md-around{justify-content:space-around !important}.justify-content-md-evenly{justify-content:space-evenly !important}.align-items-md-start{align-items:flex-start !important}.align-items-md-end{align-items:flex-end !important}.align-items-md-center{align-items:center !important}.align-items-md-baseline{align-items:baseline !important}.align-items-md-stretch{align-items:stretch !important}.align-content-md-start{align-content:flex-start !important}.align-content-md-end{align-content:flex-end !important}.align-content-md-center{align-content:center !important}.align-content-md-between{align-content:space-between !important}.align-content-md-around{align-content:space-around !important}.align-content-md-stretch{align-content:stretch !important}.align-self-md-auto{align-self:auto !important}.align-self-md-start{align-self:flex-start !important}.align-self-md-end{align-self:flex-end !important}.align-self-md-center{align-self:center !important}.align-self-md-baseline{align-self:baseline !important}.align-self-md-stretch{align-self:stretch !important}.order-md-first{order:-1 !important}.order-md-0{order:0 !important}.order-md-1{order:1 !important}.order-md-2{order:2 !important}.order-md-3{order:3 !important}.order-md-4{order:4 !important}.order-md-5{order:5 !important}.order-md-last{order:6 !important}.m-md-0{margin:0 !important}.m-md-1{margin:.25rem !important}.m-md-2{margin:.5rem !important}.m-md-3{margin:1rem !important}.m-md-4{margin:1.5rem !important}.m-md-5{margin:3rem !important}.m-md-auto{margin:auto !important}.mx-md-0{margin-right:0 !important;margin-left:0 !important}.mx-md-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-md-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-md-3{margin-right:1rem !important;margin-left:1rem !important}.mx-md-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-md-5{margin-right:3rem !important;margin-left:3rem !important}.mx-md-auto{margin-right:auto !important;margin-left:auto !important}.my-md-0{margin-top:0 !important;margin-bottom:0 !important}.my-md-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-md-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-md-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-md-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-md-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-md-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-md-0{margin-top:0 !important}.mt-md-1{margin-top:.25rem !important}.mt-md-2{margin-top:.5rem !important}.mt-md-3{margin-top:1rem !important}.mt-md-4{margin-top:1.5rem !important}.mt-md-5{margin-top:3rem !important}.mt-md-auto{margin-top:auto !important}.me-md-0{margin-right:0 !important}.me-md-1{margin-right:.25rem !important}.me-md-2{margin-right:.5rem !important}.me-md-3{margin-right:1rem !important}.me-md-4{margin-right:1.5rem !important}.me-md-5{margin-right:3rem !important}.me-md-auto{margin-right:auto !important}.mb-md-0{margin-bottom:0 !important}.mb-md-1{margin-bottom:.25rem !important}.mb-md-2{margin-bottom:.5rem !important}.mb-md-3{margin-bottom:1rem !important}.mb-md-4{margin-bottom:1.5rem !important}.mb-md-5{margin-bottom:3rem !important}.mb-md-auto{margin-bottom:auto !important}.ms-md-0{margin-left:0 !important}.ms-md-1{margin-left:.25rem !important}.ms-md-2{margin-left:.5rem !important}.ms-md-3{margin-left:1rem !important}.ms-md-4{margin-left:1.5rem !important}.ms-md-5{margin-left:3rem !important}.ms-md-auto{margin-left:auto !important}.p-md-0{padding:0 !important}.p-md-1{padding:.25rem !important}.p-md-2{padding:.5rem !important}.p-md-3{padding:1rem !important}.p-md-4{padding:1.5rem !important}.p-md-5{padding:3rem !important}.px-md-0{padding-right:0 !important;padding-left:0 !important}.px-md-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-md-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-md-3{padding-right:1rem !important;padding-left:1rem !important}.px-md-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-md-5{padding-right:3rem !important;padding-left:3rem !important}.py-md-0{padding-top:0 !important;padding-bottom:0 !important}.py-md-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-md-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-md-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-md-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-md-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-md-0{padding-top:0 !important}.pt-md-1{padding-top:.25rem !important}.pt-md-2{padding-top:.5rem !important}.pt-md-3{padding-top:1rem !important}.pt-md-4{padding-top:1.5rem !important}.pt-md-5{padding-top:3rem !important}.pe-md-0{padding-right:0 !important}.pe-md-1{padding-right:.25rem !important}.pe-md-2{padding-right:.5rem !important}.pe-md-3{padding-right:1rem !important}.pe-md-4{padding-right:1.5rem !important}.pe-md-5{padding-right:3rem !important}.pb-md-0{padding-bottom:0 !important}.pb-md-1{padding-bottom:.25rem !important}.pb-md-2{padding-bottom:.5rem !important}.pb-md-3{padding-bottom:1rem !important}.pb-md-4{padding-bottom:1.5rem !important}.pb-md-5{padding-bottom:3rem !important}.ps-md-0{padding-left:0 !important}.ps-md-1{padding-left:.25rem !important}.ps-md-2{padding-left:.5rem !important}.ps-md-3{padding-left:1rem !important}.ps-md-4{padding-left:1.5rem !important}.ps-md-5{padding-left:3rem !important}.gap-md-0{gap:0 !important}.gap-md-1{gap:.25rem !important}.gap-md-2{gap:.5rem !important}.gap-md-3{gap:1rem !important}.gap-md-4{gap:1.5rem !important}.gap-md-5{gap:3rem !important}.text-md-start{text-align:left !important}.text-md-end{text-align:right !important}.text-md-center{text-align:center !important}}@media(min-width: 992px){.float-lg-start{float:left !important}.float-lg-end{float:right !important}.float-lg-none{float:none !important}.d-lg-inline{display:inline !important}.d-lg-inline-block{display:inline-block !important}.d-lg-block{display:block !important}.d-lg-grid{display:grid !important}.d-lg-table{display:table !important}.d-lg-table-row{display:table-row !important}.d-lg-table-cell{display:table-cell !important}.d-lg-flex{display:flex !important}.d-lg-inline-flex{display:inline-flex !important}.d-lg-none{display:none !important}.flex-lg-fill{flex:1 1 auto !important}.flex-lg-row{flex-direction:row !important}.flex-lg-column{flex-direction:column !important}.flex-lg-row-reverse{flex-direction:row-reverse !important}.flex-lg-column-reverse{flex-direction:column-reverse !important}.flex-lg-grow-0{flex-grow:0 !important}.flex-lg-grow-1{flex-grow:1 !important}.flex-lg-shrink-0{flex-shrink:0 !important}.flex-lg-shrink-1{flex-shrink:1 !important}.flex-lg-wrap{flex-wrap:wrap !important}.flex-lg-nowrap{flex-wrap:nowrap !important}.flex-lg-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-lg-start{justify-content:flex-start !important}.justify-content-lg-end{justify-content:flex-end !important}.justify-content-lg-center{justify-content:center !important}.justify-content-lg-between{justify-content:space-between !important}.justify-content-lg-around{justify-content:space-around !important}.justify-content-lg-evenly{justify-content:space-evenly !important}.align-items-lg-start{align-items:flex-start !important}.align-items-lg-end{align-items:flex-end !important}.align-items-lg-center{align-items:center !important}.align-items-lg-baseline{align-items:baseline !important}.align-items-lg-stretch{align-items:stretch !important}.align-content-lg-start{align-content:flex-start !important}.align-content-lg-end{align-content:flex-end !important}.align-content-lg-center{align-content:center !important}.align-content-lg-between{align-content:space-between !important}.align-content-lg-around{align-content:space-around !important}.align-content-lg-stretch{align-content:stretch !important}.align-self-lg-auto{align-self:auto !important}.align-self-lg-start{align-self:flex-start !important}.align-self-lg-end{align-self:flex-end !important}.align-self-lg-center{align-self:center !important}.align-self-lg-baseline{align-self:baseline !important}.align-self-lg-stretch{align-self:stretch !important}.order-lg-first{order:-1 !important}.order-lg-0{order:0 !important}.order-lg-1{order:1 !important}.order-lg-2{order:2 !important}.order-lg-3{order:3 !important}.order-lg-4{order:4 !important}.order-lg-5{order:5 !important}.order-lg-last{order:6 !important}.m-lg-0{margin:0 !important}.m-lg-1{margin:.25rem !important}.m-lg-2{margin:.5rem !important}.m-lg-3{margin:1rem !important}.m-lg-4{margin:1.5rem !important}.m-lg-5{margin:3rem !important}.m-lg-auto{margin:auto !important}.mx-lg-0{margin-right:0 !important;margin-left:0 !important}.mx-lg-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-lg-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-lg-3{margin-right:1rem !important;margin-left:1rem !important}.mx-lg-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-lg-5{margin-right:3rem !important;margin-left:3rem !important}.mx-lg-auto{margin-right:auto !important;margin-left:auto !important}.my-lg-0{margin-top:0 !important;margin-bottom:0 !important}.my-lg-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-lg-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-lg-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-lg-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-lg-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-lg-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-lg-0{margin-top:0 !important}.mt-lg-1{margin-top:.25rem !important}.mt-lg-2{margin-top:.5rem !important}.mt-lg-3{margin-top:1rem !important}.mt-lg-4{margin-top:1.5rem !important}.mt-lg-5{margin-top:3rem !important}.mt-lg-auto{margin-top:auto !important}.me-lg-0{margin-right:0 !important}.me-lg-1{margin-right:.25rem !important}.me-lg-2{margin-right:.5rem !important}.me-lg-3{margin-right:1rem !important}.me-lg-4{margin-right:1.5rem !important}.me-lg-5{margin-right:3rem !important}.me-lg-auto{margin-right:auto !important}.mb-lg-0{margin-bottom:0 !important}.mb-lg-1{margin-bottom:.25rem !important}.mb-lg-2{margin-bottom:.5rem !important}.mb-lg-3{margin-bottom:1rem !important}.mb-lg-4{margin-bottom:1.5rem !important}.mb-lg-5{margin-bottom:3rem !important}.mb-lg-auto{margin-bottom:auto !important}.ms-lg-0{margin-left:0 !important}.ms-lg-1{margin-left:.25rem !important}.ms-lg-2{margin-left:.5rem !important}.ms-lg-3{margin-left:1rem !important}.ms-lg-4{margin-left:1.5rem !important}.ms-lg-5{margin-left:3rem !important}.ms-lg-auto{margin-left:auto !important}.p-lg-0{padding:0 !important}.p-lg-1{padding:.25rem !important}.p-lg-2{padding:.5rem !important}.p-lg-3{padding:1rem !important}.p-lg-4{padding:1.5rem !important}.p-lg-5{padding:3rem !important}.px-lg-0{padding-right:0 !important;padding-left:0 !important}.px-lg-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-lg-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-lg-3{padding-right:1rem !important;padding-left:1rem !important}.px-lg-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-lg-5{padding-right:3rem !important;padding-left:3rem !important}.py-lg-0{padding-top:0 !important;padding-bottom:0 !important}.py-lg-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-lg-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-lg-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-lg-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-lg-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-lg-0{padding-top:0 !important}.pt-lg-1{padding-top:.25rem !important}.pt-lg-2{padding-top:.5rem !important}.pt-lg-3{padding-top:1rem !important}.pt-lg-4{padding-top:1.5rem !important}.pt-lg-5{padding-top:3rem !important}.pe-lg-0{padding-right:0 !important}.pe-lg-1{padding-right:.25rem !important}.pe-lg-2{padding-right:.5rem !important}.pe-lg-3{padding-right:1rem !important}.pe-lg-4{padding-right:1.5rem !important}.pe-lg-5{padding-right:3rem !important}.pb-lg-0{padding-bottom:0 !important}.pb-lg-1{padding-bottom:.25rem !important}.pb-lg-2{padding-bottom:.5rem !important}.pb-lg-3{padding-bottom:1rem !important}.pb-lg-4{padding-bottom:1.5rem !important}.pb-lg-5{padding-bottom:3rem !important}.ps-lg-0{padding-left:0 !important}.ps-lg-1{padding-left:.25rem !important}.ps-lg-2{padding-left:.5rem !important}.ps-lg-3{padding-left:1rem !important}.ps-lg-4{padding-left:1.5rem !important}.ps-lg-5{padding-left:3rem !important}.gap-lg-0{gap:0 !important}.gap-lg-1{gap:.25rem !important}.gap-lg-2{gap:.5rem !important}.gap-lg-3{gap:1rem !important}.gap-lg-4{gap:1.5rem !important}.gap-lg-5{gap:3rem !important}.text-lg-start{text-align:left !important}.text-lg-end{text-align:right !important}.text-lg-center{text-align:center !important}}@media(min-width: 1200px){.float-xl-start{float:left !important}.float-xl-end{float:right !important}.float-xl-none{float:none !important}.d-xl-inline{display:inline !important}.d-xl-inline-block{display:inline-block !important}.d-xl-block{display:block !important}.d-xl-grid{display:grid !important}.d-xl-table{display:table !important}.d-xl-table-row{display:table-row !important}.d-xl-table-cell{display:table-cell !important}.d-xl-flex{display:flex !important}.d-xl-inline-flex{display:inline-flex !important}.d-xl-none{display:none !important}.flex-xl-fill{flex:1 1 auto !important}.flex-xl-row{flex-direction:row !important}.flex-xl-column{flex-direction:column !important}.flex-xl-row-reverse{flex-direction:row-reverse !important}.flex-xl-column-reverse{flex-direction:column-reverse !important}.flex-xl-grow-0{flex-grow:0 !important}.flex-xl-grow-1{flex-grow:1 !important}.flex-xl-shrink-0{flex-shrink:0 !important}.flex-xl-shrink-1{flex-shrink:1 !important}.flex-xl-wrap{flex-wrap:wrap !important}.flex-xl-nowrap{flex-wrap:nowrap !important}.flex-xl-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-xl-start{justify-content:flex-start !important}.justify-content-xl-end{justify-content:flex-end !important}.justify-content-xl-center{justify-content:center !important}.justify-content-xl-between{justify-content:space-between !important}.justify-content-xl-around{justify-content:space-around !important}.justify-content-xl-evenly{justify-content:space-evenly !important}.align-items-xl-start{align-items:flex-start !important}.align-items-xl-end{align-items:flex-end !important}.align-items-xl-center{align-items:center !important}.align-items-xl-baseline{align-items:baseline !important}.align-items-xl-stretch{align-items:stretch !important}.align-content-xl-start{align-content:flex-start !important}.align-content-xl-end{align-content:flex-end !important}.align-content-xl-center{align-content:center !important}.align-content-xl-between{align-content:space-between !important}.align-content-xl-around{align-content:space-around !important}.align-content-xl-stretch{align-content:stretch !important}.align-self-xl-auto{align-self:auto !important}.align-self-xl-start{align-self:flex-start !important}.align-self-xl-end{align-self:flex-end !important}.align-self-xl-center{align-self:center !important}.align-self-xl-baseline{align-self:baseline !important}.align-self-xl-stretch{align-self:stretch !important}.order-xl-first{order:-1 !important}.order-xl-0{order:0 !important}.order-xl-1{order:1 !important}.order-xl-2{order:2 !important}.order-xl-3{order:3 !important}.order-xl-4{order:4 !important}.order-xl-5{order:5 !important}.order-xl-last{order:6 !important}.m-xl-0{margin:0 !important}.m-xl-1{margin:.25rem !important}.m-xl-2{margin:.5rem !important}.m-xl-3{margin:1rem !important}.m-xl-4{margin:1.5rem !important}.m-xl-5{margin:3rem !important}.m-xl-auto{margin:auto !important}.mx-xl-0{margin-right:0 !important;margin-left:0 !important}.mx-xl-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-xl-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-xl-3{margin-right:1rem !important;margin-left:1rem !important}.mx-xl-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-xl-5{margin-right:3rem !important;margin-left:3rem !important}.mx-xl-auto{margin-right:auto !important;margin-left:auto !important}.my-xl-0{margin-top:0 !important;margin-bottom:0 !important}.my-xl-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-xl-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-xl-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-xl-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-xl-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-xl-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-xl-0{margin-top:0 !important}.mt-xl-1{margin-top:.25rem !important}.mt-xl-2{margin-top:.5rem !important}.mt-xl-3{margin-top:1rem !important}.mt-xl-4{margin-top:1.5rem !important}.mt-xl-5{margin-top:3rem !important}.mt-xl-auto{margin-top:auto !important}.me-xl-0{margin-right:0 !important}.me-xl-1{margin-right:.25rem !important}.me-xl-2{margin-right:.5rem !important}.me-xl-3{margin-right:1rem !important}.me-xl-4{margin-right:1.5rem !important}.me-xl-5{margin-right:3rem !important}.me-xl-auto{margin-right:auto !important}.mb-xl-0{margin-bottom:0 !important}.mb-xl-1{margin-bottom:.25rem !important}.mb-xl-2{margin-bottom:.5rem !important}.mb-xl-3{margin-bottom:1rem !important}.mb-xl-4{margin-bottom:1.5rem !important}.mb-xl-5{margin-bottom:3rem !important}.mb-xl-auto{margin-bottom:auto !important}.ms-xl-0{margin-left:0 !important}.ms-xl-1{margin-left:.25rem !important}.ms-xl-2{margin-left:.5rem !important}.ms-xl-3{margin-left:1rem !important}.ms-xl-4{margin-left:1.5rem !important}.ms-xl-5{margin-left:3rem !important}.ms-xl-auto{margin-left:auto !important}.p-xl-0{padding:0 !important}.p-xl-1{padding:.25rem !important}.p-xl-2{padding:.5rem !important}.p-xl-3{padding:1rem !important}.p-xl-4{padding:1.5rem !important}.p-xl-5{padding:3rem !important}.px-xl-0{padding-right:0 !important;padding-left:0 !important}.px-xl-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-xl-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-xl-3{padding-right:1rem !important;padding-left:1rem !important}.px-xl-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-xl-5{padding-right:3rem !important;padding-left:3rem !important}.py-xl-0{padding-top:0 !important;padding-bottom:0 !important}.py-xl-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-xl-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-xl-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-xl-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-xl-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-xl-0{padding-top:0 !important}.pt-xl-1{padding-top:.25rem !important}.pt-xl-2{padding-top:.5rem !important}.pt-xl-3{padding-top:1rem !important}.pt-xl-4{padding-top:1.5rem !important}.pt-xl-5{padding-top:3rem !important}.pe-xl-0{padding-right:0 !important}.pe-xl-1{padding-right:.25rem !important}.pe-xl-2{padding-right:.5rem !important}.pe-xl-3{padding-right:1rem !important}.pe-xl-4{padding-right:1.5rem !important}.pe-xl-5{padding-right:3rem !important}.pb-xl-0{padding-bottom:0 !important}.pb-xl-1{padding-bottom:.25rem !important}.pb-xl-2{padding-bottom:.5rem !important}.pb-xl-3{padding-bottom:1rem !important}.pb-xl-4{padding-bottom:1.5rem !important}.pb-xl-5{padding-bottom:3rem !important}.ps-xl-0{padding-left:0 !important}.ps-xl-1{padding-left:.25rem !important}.ps-xl-2{padding-left:.5rem !important}.ps-xl-3{padding-left:1rem !important}.ps-xl-4{padding-left:1.5rem !important}.ps-xl-5{padding-left:3rem !important}.gap-xl-0{gap:0 !important}.gap-xl-1{gap:.25rem !important}.gap-xl-2{gap:.5rem !important}.gap-xl-3{gap:1rem !important}.gap-xl-4{gap:1.5rem !important}.gap-xl-5{gap:3rem !important}.text-xl-start{text-align:left !important}.text-xl-end{text-align:right !important}.text-xl-center{text-align:center !important}}@media(min-width: 1400px){.float-xxl-start{float:left !important}.float-xxl-end{float:right !important}.float-xxl-none{float:none !important}.d-xxl-inline{display:inline !important}.d-xxl-inline-block{display:inline-block !important}.d-xxl-block{display:block !important}.d-xxl-grid{display:grid !important}.d-xxl-table{display:table !important}.d-xxl-table-row{display:table-row !important}.d-xxl-table-cell{display:table-cell !important}.d-xxl-flex{display:flex !important}.d-xxl-inline-flex{display:inline-flex !important}.d-xxl-none{display:none !important}.flex-xxl-fill{flex:1 1 auto !important}.flex-xxl-row{flex-direction:row !important}.flex-xxl-column{flex-direction:column !important}.flex-xxl-row-reverse{flex-direction:row-reverse !important}.flex-xxl-column-reverse{flex-direction:column-reverse !important}.flex-xxl-grow-0{flex-grow:0 !important}.flex-xxl-grow-1{flex-grow:1 !important}.flex-xxl-shrink-0{flex-shrink:0 !important}.flex-xxl-shrink-1{flex-shrink:1 !important}.flex-xxl-wrap{flex-wrap:wrap !important}.flex-xxl-nowrap{flex-wrap:nowrap !important}.flex-xxl-wrap-reverse{flex-wrap:wrap-reverse !important}.justify-content-xxl-start{justify-content:flex-start !important}.justify-content-xxl-end{justify-content:flex-end !important}.justify-content-xxl-center{justify-content:center !important}.justify-content-xxl-between{justify-content:space-between !important}.justify-content-xxl-around{justify-content:space-around !important}.justify-content-xxl-evenly{justify-content:space-evenly !important}.align-items-xxl-start{align-items:flex-start !important}.align-items-xxl-end{align-items:flex-end !important}.align-items-xxl-center{align-items:center !important}.align-items-xxl-baseline{align-items:baseline !important}.align-items-xxl-stretch{align-items:stretch !important}.align-content-xxl-start{align-content:flex-start !important}.align-content-xxl-end{align-content:flex-end !important}.align-content-xxl-center{align-content:center !important}.align-content-xxl-between{align-content:space-between !important}.align-content-xxl-around{align-content:space-around !important}.align-content-xxl-stretch{align-content:stretch !important}.align-self-xxl-auto{align-self:auto !important}.align-self-xxl-start{align-self:flex-start !important}.align-self-xxl-end{align-self:flex-end !important}.align-self-xxl-center{align-self:center !important}.align-self-xxl-baseline{align-self:baseline !important}.align-self-xxl-stretch{align-self:stretch !important}.order-xxl-first{order:-1 !important}.order-xxl-0{order:0 !important}.order-xxl-1{order:1 !important}.order-xxl-2{order:2 !important}.order-xxl-3{order:3 !important}.order-xxl-4{order:4 !important}.order-xxl-5{order:5 !important}.order-xxl-last{order:6 !important}.m-xxl-0{margin:0 !important}.m-xxl-1{margin:.25rem !important}.m-xxl-2{margin:.5rem !important}.m-xxl-3{margin:1rem !important}.m-xxl-4{margin:1.5rem !important}.m-xxl-5{margin:3rem !important}.m-xxl-auto{margin:auto !important}.mx-xxl-0{margin-right:0 !important;margin-left:0 !important}.mx-xxl-1{margin-right:.25rem !important;margin-left:.25rem !important}.mx-xxl-2{margin-right:.5rem !important;margin-left:.5rem !important}.mx-xxl-3{margin-right:1rem !important;margin-left:1rem !important}.mx-xxl-4{margin-right:1.5rem !important;margin-left:1.5rem !important}.mx-xxl-5{margin-right:3rem !important;margin-left:3rem !important}.mx-xxl-auto{margin-right:auto !important;margin-left:auto !important}.my-xxl-0{margin-top:0 !important;margin-bottom:0 !important}.my-xxl-1{margin-top:.25rem !important;margin-bottom:.25rem !important}.my-xxl-2{margin-top:.5rem !important;margin-bottom:.5rem !important}.my-xxl-3{margin-top:1rem !important;margin-bottom:1rem !important}.my-xxl-4{margin-top:1.5rem !important;margin-bottom:1.5rem !important}.my-xxl-5{margin-top:3rem !important;margin-bottom:3rem !important}.my-xxl-auto{margin-top:auto !important;margin-bottom:auto !important}.mt-xxl-0{margin-top:0 !important}.mt-xxl-1{margin-top:.25rem !important}.mt-xxl-2{margin-top:.5rem !important}.mt-xxl-3{margin-top:1rem !important}.mt-xxl-4{margin-top:1.5rem !important}.mt-xxl-5{margin-top:3rem !important}.mt-xxl-auto{margin-top:auto !important}.me-xxl-0{margin-right:0 !important}.me-xxl-1{margin-right:.25rem !important}.me-xxl-2{margin-right:.5rem !important}.me-xxl-3{margin-right:1rem !important}.me-xxl-4{margin-right:1.5rem !important}.me-xxl-5{margin-right:3rem !important}.me-xxl-auto{margin-right:auto !important}.mb-xxl-0{margin-bottom:0 !important}.mb-xxl-1{margin-bottom:.25rem !important}.mb-xxl-2{margin-bottom:.5rem !important}.mb-xxl-3{margin-bottom:1rem !important}.mb-xxl-4{margin-bottom:1.5rem !important}.mb-xxl-5{margin-bottom:3rem !important}.mb-xxl-auto{margin-bottom:auto !important}.ms-xxl-0{margin-left:0 !important}.ms-xxl-1{margin-left:.25rem !important}.ms-xxl-2{margin-left:.5rem !important}.ms-xxl-3{margin-left:1rem !important}.ms-xxl-4{margin-left:1.5rem !important}.ms-xxl-5{margin-left:3rem !important}.ms-xxl-auto{margin-left:auto !important}.p-xxl-0{padding:0 !important}.p-xxl-1{padding:.25rem !important}.p-xxl-2{padding:.5rem !important}.p-xxl-3{padding:1rem !important}.p-xxl-4{padding:1.5rem !important}.p-xxl-5{padding:3rem !important}.px-xxl-0{padding-right:0 !important;padding-left:0 !important}.px-xxl-1{padding-right:.25rem !important;padding-left:.25rem !important}.px-xxl-2{padding-right:.5rem !important;padding-left:.5rem !important}.px-xxl-3{padding-right:1rem !important;padding-left:1rem !important}.px-xxl-4{padding-right:1.5rem !important;padding-left:1.5rem !important}.px-xxl-5{padding-right:3rem !important;padding-left:3rem !important}.py-xxl-0{padding-top:0 !important;padding-bottom:0 !important}.py-xxl-1{padding-top:.25rem !important;padding-bottom:.25rem !important}.py-xxl-2{padding-top:.5rem !important;padding-bottom:.5rem !important}.py-xxl-3{padding-top:1rem !important;padding-bottom:1rem !important}.py-xxl-4{padding-top:1.5rem !important;padding-bottom:1.5rem !important}.py-xxl-5{padding-top:3rem !important;padding-bottom:3rem !important}.pt-xxl-0{padding-top:0 !important}.pt-xxl-1{padding-top:.25rem !important}.pt-xxl-2{padding-top:.5rem !important}.pt-xxl-3{padding-top:1rem !important}.pt-xxl-4{padding-top:1.5rem !important}.pt-xxl-5{padding-top:3rem !important}.pe-xxl-0{padding-right:0 !important}.pe-xxl-1{padding-right:.25rem !important}.pe-xxl-2{padding-right:.5rem !important}.pe-xxl-3{padding-right:1rem !important}.pe-xxl-4{padding-right:1.5rem !important}.pe-xxl-5{padding-right:3rem !important}.pb-xxl-0{padding-bottom:0 !important}.pb-xxl-1{padding-bottom:.25rem !important}.pb-xxl-2{padding-bottom:.5rem !important}.pb-xxl-3{padding-bottom:1rem !important}.pb-xxl-4{padding-bottom:1.5rem !important}.pb-xxl-5{padding-bottom:3rem !important}.ps-xxl-0{padding-left:0 !important}.ps-xxl-1{padding-left:.25rem !important}.ps-xxl-2{padding-left:.5rem !important}.ps-xxl-3{padding-left:1rem !important}.ps-xxl-4{padding-left:1.5rem !important}.ps-xxl-5{padding-left:3rem !important}.gap-xxl-0{gap:0 !important}.gap-xxl-1{gap:.25rem !important}.gap-xxl-2{gap:.5rem !important}.gap-xxl-3{gap:1rem !important}.gap-xxl-4{gap:1.5rem !important}.gap-xxl-5{gap:3rem !important}.text-xxl-start{text-align:left !important}.text-xxl-end{text-align:right !important}.text-xxl-center{text-align:center !important}}@media(min-width: 1200px){.fs-1{font-size:2.1875rem !important}.fs-2{font-size:1.75rem !important}.fs-3{font-size:1.53125rem !important}.fs-4{font-size:1.3125rem !important}}@media print{.d-print-inline{display:inline !important}.d-print-inline-block{display:inline-block !important}.d-print-block{display:block !important}.d-print-grid{display:grid !important}.d-print-table{display:table !important}.d-print-table-row{display:table-row !important}.d-print-table-cell{display:table-cell !important}.d-print-flex{display:flex !important}.d-print-inline-flex{display:inline-flex !important}.d-print-none{display:none !important}}.accordion-item{border-color:#e2e5ec;background-color:#fff}.accordion-button{background-color:#fff;font-weight:500}.accordion-button:not(.collapsed){background-color:rgba(243,245,249,.6);box-shadow:inset 0 -1px 0 #e2e5ec}.accordion-button::after{width:1rem;height:1rem;background-size:1rem;opacity:.6}.accordion-custom .accordion-item+.accordion-item{margin-top:5px}.accordion-custom .accordion-item:not(:first-of-type){border-top:1px solid #e2e5ec}.accordion-custom .accordion-button{background-color:#f8f9fc}.accordion-custom .accordion-button:not(.collapsed){background-color:#fff;box-shadow:none}.accordion-custom .accordion-body{padding-top:0}.accordion-primary .accordion-item{border-color:#506fd9;border-width:1.5px}.accordion-primary .accordion-item+.accordion-item{margin-top:5px}.accordion-primary .accordion-item:not(:first-of-type){border-top:1.5px solid #506fd9}.accordion-primary .accordion-button{background-color:#506fd9;color:#fff}.accordion-primary .accordion-button::after{content:"";font-family:"remixicon";font-size:18px;font-weight:400;background-image:none}.accordion-primary .accordion-button:not(.collapsed){box-shadow:none;background-color:#fff;color:#506fd9}.accordion-primary .accordion-button:not(.collapsed)::after{opacity:1}.accordion-primary .accordion-body{padding-top:0}.alert{padding-top:12px;padding-bottom:12px}.alert>i{font-size:24px;line-height:.7;margin-right:10px}.alert-dismissible .btn-close{padding:1rem}.alert-link{font-weight:600}.alert-outline{background-color:rgba(0,0,0,0);border-width:1.5px}.alert-outline.alert-primary{border-color:#506fd9;color:#506fd9}.alert-outline.alert-success{border-color:#0cb785;color:#0cb785}.alert-outline.alert-warning{border-color:#ffc107;color:#ffc107}.alert-outline.alert-danger{border-color:#dc3545;color:#dc3545}.alert-outline.alert-info{border-color:#0dcaf0;color:#0dcaf0}.alert-outline.alert-secondary{border-color:rgba(110,121,133,.6);color:#6e7985}.alert-outline.alert-light{border:1.5px solid #ccd2da;color:#6e7985}.alert-outline.alert-dark{border-color:#6e7985}.alert-solid{border-width:0;color:#fff}.alert-solid.alert-primary{background-color:#506fd9}.alert-solid.alert-secondary{background-color:#6e7985}.alert-solid.alert-success{background-color:#0cb785}.alert-solid.alert-warning{background-color:#ffc107}.alert-solid.alert-danger{background-color:#dc3545}.alert-solid.alert-info{background-color:#0dcaf0}.alert-solid.alert-dark{background-color:#212830}.alert-solid.alert-light{background-color:#fff;color:#6e7985}.avatar{width:36px;height:36px;border-radius:100%;display:block;position:relative}.avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit;display:block}.avatar.online::after,.avatar.offline::after{content:"";position:absolute;bottom:0;right:5px;width:6px;height:6px;border-radius:100%;box-shadow:0 0 0 1.5px #fbfcfe}.avatar.online::after{background-color:#0cb785}.avatar.offline::after{background-color:#ccd2da}.avatar-rounded{border-radius:8px}.avatar-initial{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#6e7985;color:#fff;border-radius:inherit;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:16px;text-transform:uppercase}.avatar-xs{width:20px;height:20px}.avatar-xs .avatar-initial{font-size:9px}.avatar-xs.online::after,.avatar-xs.offline::after{width:3px;height:3px;right:0}.avatar-sm{width:26px;height:26px}.avatar-sm .avatar-initial{font-size:13px}.avatar-sm.online::after,.avatar-sm.offline::after{width:5px;height:5px;right:3px}.avatar-lg{width:46px;height:46px}.avatar-lg .avatar-initial{font-size:24px}.avatar-lg.online::after,.avatar-lg.offline::after{width:7px;height:7px}.avatar-xl{width:61px;height:61px}.avatar-xl .avatar-initial{font-size:32px}.avatar-xl.online::after,.avatar-xl.offline::after{width:8px;height:8px;right:7px;bottom:2px}.badge{font-weight:400;font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";border-radius:2px}.badge:hover,.badge:focus{color:#fff}.badge.bg-warning,.badge.bg-light{color:#212830}.badge-pill{border-radius:10px}.badge-dot{display:inline-block;width:8px;height:8px;border-radius:100%}.breadcrumb-custom1 .breadcrumb-item{font-size:12px;text-transform:uppercase;letter-spacing:.5px}.breadcrumb-custom2 .breadcrumb-item+.breadcrumb-item::before{content:"";font-family:"remixicon";position:relative;top:1.5px}.btn:focus,.ui-datepicker-buttonpane button:focus,.gridjs-pages button:focus{box-shadow:none}.btn-secondary,.ui-datepicker-buttonpane button,.btn-success{color:#fff}.btn-secondary:hover,.ui-datepicker-buttonpane button:hover,.btn-secondary:focus,.ui-datepicker-buttonpane button:focus,.btn-success:hover,.btn-success:focus{color:#fff}.btn-gray{background-color:rgba(226,229,236,.75);color:#6e7985}.btn-outline-tertiary{border-color:#85b6ff;color:#85b6ff}.btn-outline-tertiary:hover,.btn-outline-tertiary:focus{background-color:#85b6ff;color:#fff}.btn-outline-secondary:hover,.btn-outline-secondary:focus{color:#fff}.btn-outline-info:hover,.btn-outline-info:focus{color:#fff}.btn-icon{display:flex;align-items:center;justify-content:center;padding-left:0;padding-right:0;width:36px;height:36px}.btn-white{border:1px solid #ccd2da;background-color:#fff}.btn-white:hover,.btn-white:focus{border-color:#bdc5cf;background-color:#f8f9fc}.btn-outline-white{border:1px solid rgba(255,255,255,.75);color:rgba(255,255,255,.75)}.btn-outline-white:hover{border-color:#fff;color:#fff}.card{border-color:#e2e5ec}.card-bless{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-header{background-color:#f8f9fc;border-bottom-color:#e2e5ec}.card-footer{border-top-color:#e2e5ec;background-color:#f8f9fc}.card-primary,.card-secondary,.card-success,.card-danger,.card-warning,.card-info,.card-dark{border-width:0;color:rgba(255,255,255,.8)}.card-primary .card-header,.card-secondary .card-header,.card-success .card-header,.card-danger .card-header,.card-warning .card-header,.card-info .card-header,.card-dark .card-header{background-color:rgba(0,0,0,0);border-bottom-color:rgba(255,255,255,.2)}.card-primary{background-color:#506fd9}.card-secondary{background-color:#6e7985}.card-success{background-color:#0cb785}.card-danger{background-color:#dc3545}.card-warning{background-color:#ffc107}.card-info{background-color:#0dcaf0}.card-dark{background-color:#212830}.card-light{border-width:1px}.card-light .card-header{background-color:rgba(0,0,0,0)}.dropdown-menu{border-color:rgba(65,80,95,.16);padding:5px}.dropdown-item{padding:5px 10px;border-radius:3px;color:inherit}.dropdown-header{padding-left:10px;padding-right:10px;font-size:11px;font-family:"Archivo",sans-serif;text-transform:uppercase;letter-spacing:.5px}.dropdown-divider{border-top-color:#e2e5ec;opacity:1;margin:5px 0}.figure-overlay{position:relative}.figure-overlay figcaption{position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(33,40,48,.5)}.list-group-item{border-color:#e2e5ec}.star-group{display:flex;grid-gap:2px;color:#506fd9;font-size:16px;line-height:.7}.star-group span:last-child{color:#6e7985;font-size:.8125rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";padding-left:5px;line-height:.9}.marker{font-size:12px;padding:5px 10px;background-color:#fff;border-radius:3px;position:absolute}.marker.top-left{top:5px;left:5px}.marker.top-right{top:5px;right:5px}.marker.bottom-right{bottom:5px;right:5px}.marker.bottom-left{bottom:5px;left:5px}.marker.marker-primary{background-color:#506fd9;color:#fff}.marker.marker-success{background-color:#0cb785;color:#fff}.marker.marker-danger{background-color:#dc3545;color:#fff}.marker.marker-warning{background-color:#ffc107;color:#212830}.marker.marker-info{background-color:#0dcaf0;color:#212830}.marker.marker-dark{background-color:#212830;color:#fff}.marker-icon{width:50px;height:50px;position:absolute;overflow:hidden;border-radius:inherit}.marker-icon::before{content:"";width:80px;height:80px;background-color:#fff;position:absolute;transform:rotate(45deg)}.marker-icon i{position:relative;color:#212830;font-size:16px}.marker-icon.top-left{top:0;left:0;padding-left:6px;padding-top:2px}.marker-icon.top-left::before{top:-45px;left:-45px}.marker-icon.top-right{top:0;right:0;text-align:right;padding-right:6px;padding-top:2px}.marker-icon.top-right::before{top:-45px;right:-45px}.marker-icon.bottom-left{bottom:0;left:0;display:flex;align-items:flex-end;padding-bottom:2px;padding-left:6px}.marker-icon.bottom-left::before{bottom:-45px;left:-45px}.marker-icon.bottom-right{bottom:0;right:0;display:flex;align-items:flex-end;justify-content:flex-end;padding-bottom:2px;padding-right:7px}.marker-icon.bottom-right::before{bottom:-45px;right:-45px}.marker-icon.marker-primary::before{background-color:#506fd9}.marker-icon.marker-primary i{color:#fff}.marker-icon.marker-success::before{background-color:#0cb785}.marker-icon.marker-success i{color:#fff}.marker-icon.marker-danger::before{background-color:#dc3545}.marker-icon.marker-danger i{color:#fff}.marker-icon.marker-warning::before{background-color:#ffc107}.marker-icon.marker-warning i{color:#212830}.marker-icon.marker-info::before{background-color:#0dcaf0}.marker-icon.marker-info i{color:#212830}.marker-icon.marker-dark::before{background-color:#212830}.marker-icon.marker-dark i{color:#fff}.marker-ribbon{position:absolute;font-size:12px;padding:5px 10px;background-color:#fff;border:1px solid rgba(33,40,48,.3);top:5px}.marker-ribbon::before{content:"";position:absolute;bottom:-11px}.marker-ribbon.top-left{left:-10px}.marker-ribbon.top-left::before{left:-10px;border-right:10px solid rgba(33,40,48,.3);border-bottom:10px solid rgba(0,0,0,0);border-left:10px solid rgba(0,0,0,0)}.marker-ribbon.top-right{right:-10px}.marker-ribbon.top-right::before{right:-10px;border-left:10px solid rgba(33,40,48,.3);border-bottom:10px solid rgba(0,0,0,0);border-right:10px solid rgba(0,0,0,0)}.marker-ribbon.marker-primary{background-color:#506fd9;color:#fff;border-width:0}.marker-ribbon.marker-primary::before{bottom:-10px}.marker-ribbon.marker-primary.top-left::before{border-right-color:rgba(35,63,160,.5)}.marker-ribbon.marker-primary.top-right::before{border-left-color:rgba(35,63,160,.5)}.marker-ribbon.marker-success{background-color:#0cb785;color:#fff;border-width:0}.marker-ribbon.marker-success::before{bottom:-10px}.marker-ribbon.marker-success.top-left::before{border-right-color:rgba(6,87,63,.5)}.marker-ribbon.marker-success.top-right::before{border-left-color:rgba(6,87,63,.5)}.marker-ribbon.marker-danger{background-color:#dc3545;color:#fff;border-width:0}.marker-ribbon.marker-danger::before{bottom:-10px}.marker-ribbon.marker-danger.top-left::before{border-right-color:rgba(146,25,37,.5)}.marker-ribbon.marker-danger.top-right::before{border-left-color:rgba(146,25,37,.5)}.marker-ribbon.marker-warning{background-color:#ffc107;color:#212830;border-width:0}.marker-ribbon.marker-warning::before{bottom:-10px}.marker-ribbon.marker-warning.top-left::before{border-right-color:rgba(160,120,0,.5)}.marker-ribbon.marker-warning.top-right::before{border-left-color:rgba(160,120,0,.5)}.marker-ribbon.marker-info{background-color:#0dcaf0;color:#212830;border-width:0}.marker-ribbon.marker-info::before{bottom:-10px}.marker-ribbon.marker-info.top-left::before{border-right-color:rgba(8,121,143,.5)}.marker-ribbon.marker-info.top-right::before{border-left-color:rgba(8,121,143,.5)}.marker-ribbon.marker-dark{background-color:#212830;color:#fff;border-width:0}.marker-ribbon.marker-dark::before{bottom:-10px}.marker-ribbon.marker-dark.top-left::before{border-right-color:rgba(0,0,0,.5)}.marker-ribbon.marker-dark.top-right::before{border-left-color:rgba(0,0,0,.5)}.modal-content{border-width:0}.modal-backdrop{background-color:#171b21}.modal-backdrop.show{opacity:.8}.nav-sidebar{display:flex;flex-direction:column}.nav-sidebar .nav-item.show .nav-link::after{content:""}.nav-sidebar .nav-item.show .nav-sub{display:flex}.nav-sidebar .nav-link{color:#41505f;display:flex;align-items:center}.nav-sidebar .nav-link:hover{color:#212830}.nav-sidebar .nav-link.active{color:#506fd9;font-weight:500;letter-spacing:-0.1px}.nav-sidebar .nav-link.has-sub{position:relative}.nav-sidebar .nav-link.has-sub::after{content:"";font-family:"remixicon";font-size:14px;font-weight:400;color:#9ea7b1;position:absolute;top:50%;right:15px;line-height:0;opacity:.6}.nav-sidebar .nav-link i{margin-right:12px;line-height:1;font-size:20px;width:18px;opacity:.85}.nav-sidebar .nav-sub{flex-direction:column;position:relative;display:none}.nav-sidebar .nav-sub-link{display:block;padding:6px 20px;font-size:.8125rem;text-indent:30.5px;color:#6e7985;position:relative}.nav-sidebar .nav-sub-link::before{content:"";position:absolute;top:50%;left:26px;width:5px;height:1.5px;background-color:#9ea7b1;transition:all .25s}@media(prefers-reduced-motion: reduce){.nav-sidebar .nav-sub-link::before{transition:none}}.nav-sidebar .nav-sub-link:hover::before,.nav-sidebar .nav-sub-link:focus::before{width:16px;left:20.5px}.nav-sidebar .nav-sub-link.active{color:#212830;font-weight:500}.nav-sidebar .nav-sub-link.active::before{width:16px;background-color:#506fd9;left:20.5px}.nav-line{border-bottom:1px solid #e2e5ec;flex-wrap:nowrap;overflow:hidden}@media(min-width: 576px){.nav-line{overflow:visible}}.nav-line .nav-link{color:#6e7985;padding-left:0;padding-right:0;border-radius:0;position:relative;white-space:nowrap}.nav-line .nav-link::before{content:"";position:absolute;bottom:0;left:0;right:0;border-bottom:1.5px solid #506fd9;display:none}@media(min-width: 576px){.nav-line .nav-link::before{bottom:-1px}}.nav-line .nav-link:hover{color:#313c47}.nav-line .nav-link+.nav-link{margin-left:25px}.nav-line .nav-link.active{color:#212830;font-weight:600}.nav-line .nav-link.active::before{display:block}.nav-classic{flex-direction:column}.nav-classic .nav-link{display:flex;align-items:center;padding-left:0;padding-right:0}.nav-classic .nav-link+.nav-link{border-top:1px dashed #e2e5ec}.nav-classic .nav-link:first-child{padding-top:0}.nav-classic .nav-link:last-child{padding-bottom:0}.nav-classic i{width:20px;font-size:20px;line-height:1;color:#6e7985;margin-right:10px}.nav-classic .badge{color:#6e7985;font-size:.8125rem;opacity:.75;margin-left:auto}.nav-icon{align-items:center}.nav-icon.nav-icon-lg .nav-link i{font-size:20px}.nav-icon .nav-link{padding:0;color:#6e7985;display:flex;align-items:center}.nav-icon .nav-link i{line-height:1;font-size:18px}.nav-icon .nav-link+.nav-link{margin-left:10px}.nav-icon.nav-icon-sm .nav-link i{font-size:16px}.nav-icon.nav-icon-sm .nav-link+.nav-link{margin-left:2px}.offcanvas-start{border-right-width:0}.offcanvas-end{border-left-width:0}.offcanvas-top{border-bottom-width:0}.offcanvas-bottom{border-top-width:0}.offcanvas-header .close{color:#6e7985;font-size:28px;font-weight:300;line-height:0;opacity:.6}.offcanvas-header .close:hover,.offcanvas-header .close:focus{opacity:1}.offcanvas-backdrop{background-color:#101418}.pagination-space .page-item+.page-item{margin-left:5px}.pagination-space .page-link{border-radius:.25rem}.pagination-filled .page-item.disabled .page-link{background-color:#f8f9fc}.pagination-filled .page-item:not(.active) .page-link:hover{background-color:#f3f5f9}.pagination-filled .page-link{border-width:0;background-color:rgba(243,245,249,.6);color:#6e7985}.pagination-circled .page-item+.page-item{margin-left:5px}.pagination-circled .page-item:first-child .page-link{border-radius:100%;font-size:16px}.pagination-circled .page-item:last-child .page-link{border-radius:100%}.pagination-circled .page-link{width:36px;height:36px;display:flex;align-items:center;justify-content:center;padding:0;border-radius:100%;font-size:.8125rem}.pagination-secondary .page-item.active .page-link{background-color:#6e7985;border-color:#6e7985;color:#fff}.pagination-secondary:not(.pagination-filled) .page-link{color:#6e7985}.pagination-info .page-item.active .page-link{background-color:#0dcaf0;border-color:#0dcaf0;color:#fff}.pagination-info:not(.pagination-filled) .page-link{color:#0dcaf0}.popover{border-color:#ccd2da}.bs-popover-top>.popover-arrow,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow{bottom:-0.5rem}.bs-popover-top>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before{border-top-color:#ccd2da}.bs-popover-right>.popover-arrow::before{border-right-color:#ccd2da}.bs-popover-left>.popover-arrow::before{border-left-color:#ccd2da}.bs-popover-bottom>.popover-arrow::before,.bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before{border-bottom-color:#ccd2da}.popover-header{padding:10px 12px;background-color:#f3f5f9;border-color:#ccd2da}.progress{height:12px}.progress.h-1{height:2px}.progress.h-2{height:5px}.progress.h-3{height:8px}.progress.h-4{height:15px}.progress.h-5{height:20px}.progress-bar{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:9px}.toast-header .btn-close{transform:scale(0.8)}.table thead th{font-weight:600;font-size:.8125rem}.table tbody th{font-weight:600}.table:not(.table-borderless)>:not(:first-child){border-top-width:1.5px;border-top-color:#ccd2da}.table-striped>tbody>tr:nth-of-type(2n+1)>*{box-shadow:inset 0 0 0 9999px rgba(243,245,249,.6)}.table-hover>tbody>tr:hover>*{box-shadow:inset 0 0 0 9999px rgba(243,245,249,.85)}.table-active td,.table-active th{box-shadow:inset 0 0 0 9999px rgba(243,245,249,.85)}.table-primary>:not(:first-child),.table-success>:not(:first-child),.table-warning>:not(:first-child),.table-danger>:not(:first-child),.table-info>:not(:first-child){border-top-color:#fff}.table-primary tbody td,.table-primary tbody th,.table-success tbody td,.table-success tbody th,.table-warning tbody td,.table-warning tbody th,.table-danger tbody td,.table-danger tbody th,.table-info tbody td,.table-info tbody th{border-color:#fff}.form-control,.gridjs-input{padding-left:.6rem;padding-right:.6rem}.form-control:active,.gridjs-input:active,.form-control:focus,.gridjs-input:focus{border-color:#ccd2da;box-shadow:0 1px 1px rgba(226,229,236,.25),0 2px 2px rgba(226,229,236,.2),0 4px 4px rgba(226,229,236,.15),0 8px 8px rgba(226,229,236,.1)}.form-control::placeholder,.gridjs-input::placeholder{color:#9ea7b1}.form-select:active,.form-select:focus{border-color:#ccd2da;box-shadow:0 1px 1px rgba(226,229,236,.25),0 2px 2px rgba(226,229,236,.2),0 4px 4px rgba(226,229,236,.15),0 8px 8px rgba(226,229,236,.1)}.form-select-sm{padding-left:4px}.form-select-lg{padding-left:8px}.form-check-input{border-color:rgba(33,40,48,.3)}.form-check-input[type=checkbox]{border-radius:2.5px}.form-check-input[role=switch]{border-radius:10px}.form-search{display:flex;align-items:center;border:1px solid rgba(0,0,0,0);border-radius:6px;background-color:#fff;padding:3px 10px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07);transition:all .15s}@media(prefers-reduced-motion: reduce){.form-search{transition:none}}.form-search.onfocus{border-color:#506fd9}.form-search>i{font-size:18px;font-weight:700;line-height:1}.form-search .form-control,.form-search .gridjs-input{border-radius:0;border-width:0;background-color:rgba(0,0,0,0)}.form-search .form-control:focus,.form-search .gridjs-input:focus{box-shadow:none}.form-search .form-control::placeholder,.form-search .gridjs-input::placeholder{color:#9ea7b1}.header{height:72px}.header .container{padding-left:20px;padding-right:20px;height:100%;display:flex;align-items:center;justify-content:space-between}@media(min-width: 992px){.header .container{padding-left:0;padding-right:0}}.header .nav-icon .nav-link{padding:0;font-size:21px;line-height:1;color:#6e7985;transition:all .25s}@media(prefers-reduced-motion: reduce){.header .nav-icon .nav-link{transition:none}}.header .nav-icon .nav-link+.nav-link{margin-left:8px}.header .nav-icon .nav-link:hover{color:#506fd9;transform:scale(1.1)}.header-logo,.sidebar-logo{font-size:24px;font-family:"Archivo",sans-serif;font-weight:600;display:inline-block;line-height:1;color:#212830;letter-spacing:-0.5px;position:relative}.header-logo:hover,.sidebar-logo:hover,.header-logo:focus,.sidebar-logo:focus{color:#212830}.header-logo::after,.sidebar-logo::after{content:"";position:absolute;bottom:3.5px;right:-8px;width:6px;height:6px;border-radius:100%;background-color:#506fd9}.header-main{height:72px;position:fixed;top:0;left:0;right:0;z-index:800;border-bottom:1px solid #f3f5f9;background-color:#fff;display:flex;align-items:center;transition:all .25s;box-shadow:0 1px 1px rgba(33,40,48,.01),0 4px 4px rgba(33,40,48,.01),0 16px 16px rgba(33,40,48,.01)}@media(prefers-reduced-motion: reduce){.header-main{transition:none}}@media(min-width: 992px){.header-main{left:240px;border-left:1px solid #f8f9fc}}@media(min-width: 1400px){.header-main{left:250px}}.header-main .form-search{width:180px;box-shadow:none;background-color:#f3f5f9}@media(max-width: 767.98px){.header-main .form-search{height:38px;border-radius:4px}}@media(min-width: 576px){.header-main .form-search{width:270px}}@media(min-width: 1200px){.header-main .form-search{width:320px}}.header-main .form-search .form-control,.header-main .form-search .gridjs-input{padding-left:3px}.header-main .form-search i{opacity:.6}.header-main .form-search.onfocus{background-color:#fff}.header-main .menu-link{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:1.325rem;color:#6e7985}.header-main .menu-link:hover{color:#506fd9}.header-main .nav-link{color:#6e7985}.header-main .nav-link:hover{color:#41505f}.header-main .nav-link.active{font-weight:500;color:#506fd9;letter-spacing:-0.1px}.header-main .nav-link .badge{color:#506fd9;border:1px solid #506fd9;border-radius:4px;padding:3px;margin-left:2px}.header-main .dropdown-link{display:block;color:#6e7985;position:relative}.header-main .dropdown-link:hover{color:#41505f}.header-main .dropdown-link i{font-size:20px;line-height:1.4}.header-main .dropdown-link small,.header-main .dropdown-link .small{position:absolute;top:-2px;right:-4px;width:14px;height:14px;display:flex;align-items:center;justify-content:center;border-radius:100%;background-color:#dc3545;color:#fff;font-size:9px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";box-shadow:0 0 0 1px #fff}.dropdown-skin .dropdown-link{display:flex;margin-top:2px}.dropdown-skin .dropdown-link i{font-size:22px;animation:rotation 5s infinite linear;color:#506fd9}@keyframes rotation{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}.dropdown-skin .dropdown-menu{width:250px;margin-right:10px;padding:20px;border-color:#e2e5ec;border-radius:6px;border-width:0;box-shadow:0 2px 10px rgba(110,121,133,.1),0 10px 20px rgba(110,121,133,.1)}.dropdown-skin .dropdown-menu label{font-size:10px;font-weight:500;font-family:"Inter",sans-serif;color:#6e7985;text-transform:uppercase;display:block;letter-spacing:.5px;margin-bottom:10px;line-height:1.2}.dropdown-skin .dropdown-menu hr{border-color:#e2e5ec;opacity:1;margin:20px 0}.nav-skin{flex-wrap:nowrap;white-space:nowrap}.nav-skin .nav-link{border:1px solid #ccd2da;font-size:.8125rem;padding:4px 15px;color:#41505f}.nav-skin .nav-link:hover,.nav-skin .nav-link:focus{border-color:#9ea7b1;background-color:#f3f5f9;position:relative}.nav-skin .nav-link+.nav-link{margin-left:-1px}.nav-skin .nav-link:first-child{border-top-left-radius:3px;border-bottom-left-radius:3px}.nav-skin .nav-link:last-child{border-top-right-radius:3px;border-bottom-right-radius:3px}.nav-skin .nav-link.active{letter-spacing:normal;font-weight:400;border-color:#6e7985;background-color:#e2e5ec;color:#212830;position:relative;z-index:2}.dropdown-notification{position:relative}.dropdown-notification .dropdown-link{margin-top:5px}.dropdown-notification .dropdown-menu{margin-right:10px;width:320px;padding:0;border-color:#e2e5ec;border-radius:6px;border-width:0;box-shadow:0 2px 10px rgba(110,121,133,.1),0 10px 20px rgba(110,121,133,.1)}@media(min-width: 576px){.dropdown-notification .dropdown-menu{width:340px}}.dropdown-notification .dropdown-menu-header{height:48px;border-bottom:1px solid #e2e5ec;display:flex;align-items:center;padding:0 15px}.dropdown-notification .dropdown-menu-title{font-weight:600;font-size:15px;color:#212830;margin-bottom:0}.dropdown-notification .list-group{padding:5px}.dropdown-notification .list-group-item{border-width:0;display:flex;padding:8px 10px;border-radius:4px;background-color:rgba(0,0,0,0)}.dropdown-notification .list-group-item:hover{background-color:rgba(243,245,249,.85);cursor:pointer}.dropdown-notification .list-group-item strong{font-weight:600}.dropdown-notification .avatar{margin-right:15px;flex-shrink:0}.dropdown-notification .list-group-body{color:#313c47;line-height:1.4;padding-right:10px}.dropdown-notification .list-group-body p{margin-bottom:2px}.dropdown-notification .list-group-body span{font-size:11px;color:#6e7985}.dropdown-notification .dropdown-menu-footer{text-align:center;padding:8px 10px;border-top:1px solid #e2e5ec;font-size:.8125rem}.dropdown-profile .dropdown-link .avatar{width:34px;height:34px}.dropdown-profile .dropdown-menu{width:230px;padding:0;border-color:#e2e5ec;border-radius:6px;border-width:0;box-shadow:0 2px 10px rgba(110,121,133,.1),0 10px 20px rgba(110,121,133,.1)}.dropdown-profile .dropdown-menu-body{padding:20px 20px 15px}.dropdown-profile .dropdown-menu-body h5,.dropdown-profile .dropdown-menu-body .h5{font-size:16px}.dropdown-profile .nav{flex-direction:column;margin:0 -10px}.dropdown-profile .nav a{display:flex;align-items:center;padding:7px 8px;color:#41505f;border-radius:4px;transition:all .25s}@media(prefers-reduced-motion: reduce){.dropdown-profile .nav a{transition:none}}.dropdown-profile .nav a:hover{background-color:#f3f5f9;color:#212830}.dropdown-profile .nav a i{font-size:20px;line-height:1;margin-right:10px}.dropdown-profile hr{opacity:.12;margin:5px -2px}@media(max-width: 991.98px){.sidebar-show{overflow:hidden}.sidebar-show .sidebar{left:0;opacity:1;visibility:visible}.sidebar-show .header-main,.sidebar-show .main-mobile-header,.sidebar-show .main{transform:translateX(290px)}.sidebar-show .main-backdrop{opacity:1;visibility:visible}}.sidebar-offset .sidebar{left:-250px;box-shadow:none}.sidebar-offset .header-main{left:0}.sidebar-offset .main{margin-left:0}.sidebar-offset.sidebar-show{overflow:hidden}.sidebar-offset.sidebar-show .sidebar{left:0;box-shadow:1px 0 1px rgba(33,40,48,.01),4px 0 4px rgba(33,40,48,.01),16px 0 16px rgba(33,40,48,.01)}.sidebar-offset.sidebar-show .header-main,.sidebar-offset.sidebar-show .main{transform:translateX(250px)}.sidebar-offset.sidebar-show .main-backdrop{opacity:1;visibility:visible}@media(min-width: 992px){.sidebar-hide .sidebar{left:-250px;opacity:0;visibility:hidden}.sidebar-hide .header-main{left:0;border-left-width:0}.sidebar-hide .main{margin-left:0}.sidebar-hide .music-player{left:23px}}.sidebar{width:290px;height:100vh;position:fixed;top:0;left:-290px;opacity:0;visibility:hidden;background-color:#fff;z-index:1000;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar{transition:none}}@media(min-width: 992px){.sidebar{width:240px;opacity:1;visibility:visible;left:0;box-shadow:1px 0 1px rgba(33,40,48,.01),4px 0 4px rgba(33,40,48,.01),16px 0 16px rgba(33,40,48,.01)}}@media(min-width: 1400px){.sidebar{width:250px}}.sidebar::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-color:rgba(255,255,255,.6);z-index:5;opacity:0;visibility:hidden;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar::before{transition:none}}.sidebar.footer-menu-show::before{visibility:visible;opacity:1}.sidebar.footer-menu-show .sidebar-footer{bottom:0}.sidebar-header{padding:0 20px;height:72px;display:flex;align-items:center;border-bottom:1px solid #f3f5f9}.sidebar-body{height:calc(100% - 136px);position:relative}.sidebar-body .nav-group{border-bottom:1px solid #f3f5f9}.sidebar-body .nav-group.show .nav-label::after{content:""}.sidebar-body .nav-group.show .nav-sidebar{display:block}.sidebar-body .nav-label{display:block;padding:12px 20px;font-size:11px;font-family:"Archivo",sans-serif;text-transform:uppercase;color:#6e7985;letter-spacing:.7px;position:relative}.sidebar-body .nav-label:hover,.sidebar-body .nav-label:focus{color:#6e7985}.sidebar-body .nav-label::after{content:"";font-family:"remixicon";font-size:14px;font-weight:400;position:absolute;top:50%;right:15px;line-height:0;opacity:.6}.sidebar-body .nav-sidebar{display:none;padding:0 0 20px}.sidebar-body .nav-sidebar .nav-link{padding:8px 20px}.sidebar-body .nav-sidebar .nav-item.show .nav-sub{display:block}.sidebar-body>.ps__rail-y{background-color:#e2e5ec;width:2px}.sidebar-body>.ps__rail-y>.ps__thumb-y{background-color:#6e7985;width:2px;left:0}.sidebar-footer{position:absolute;bottom:-250px;left:0;right:0;border-top:1px solid #f3f5f9;background-color:#fff;z-index:10;box-shadow:-20px -20px 20px #fff;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar-footer{transition:none}}.sidebar-footer .dropdown-link{width:28px;height:28px;border-radius:100%;display:flex;align-items:center;justify-content:center;font-size:20px;color:#6e7985;opacity:.6;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar-footer .dropdown-link{transition:none}}.sidebar-footer .dropdown-link:hover,.sidebar-footer .dropdown-link:focus{background-color:rgba(243,245,249,.6);opacity:1}.sidebar-footer-top{height:64px;display:flex;align-items:center;padding-right:12px;padding-left:15px}.sidebar-footer-thumb{width:36px;height:36px;border-radius:100%;margin-right:10px;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar-footer-thumb{transition:none}}.sidebar-footer-thumb:hover{cursor:pointer;transform:scale(1.1)}.sidebar-footer-thumb img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.sidebar-footer-body{flex:1}.sidebar-footer-body h6,.sidebar-footer-body .h6{margin-bottom:2px;font-weight:600}.sidebar-footer-body h6 a,.sidebar-footer-body .h6 a{color:#212830}.sidebar-footer-body p{margin-bottom:0;font-size:.75rem;color:#6e7985}.sidebar-footer-menu{padding:10px 12px}.sidebar-footer-menu .nav{flex-direction:column;margin:0}.sidebar-footer-menu a{height:35px;padding:0 8px;color:#41505f;display:flex;align-items:center;border-radius:3px;transition:all .25s}@media(prefers-reduced-motion: reduce){.sidebar-footer-menu a{transition:none}}.sidebar-footer-menu a:hover{background-color:#f3f5f9;color:#212830}.sidebar-footer-menu a>i{line-height:1;font-size:20px;margin-right:12px}.sidebar-footer-menu hr{margin:10px 10px;opacity:.12}.sidebar-right{width:290px}.sidebar-label{display:block;margin-bottom:5px;padding:0 10px;font-size:.75rem;font-weight:500;color:#6e7985}.sidebar-prime{background-color:#506fd9;background-image:linear-gradient(to bottom, #324daa, #506fd9)}.sidebar-prime::before{background-color:rgba(59,94,212,.75)}.sidebar-prime .sidebar-logo{color:#fff}.sidebar-prime .sidebar-header{border-bottom-color:rgba(255,255,255,.12)}.sidebar-prime .sidebar-body .nav-group{border-bottom-color:rgba(255,255,255,.12)}.sidebar-prime .sidebar-body .nav-label{color:rgba(255,255,255,.45)}.sidebar-prime .sidebar-body>.ps__rail-y{background-color:rgba(255,255,255,.1)}.sidebar-prime .sidebar-body>.ps__rail-y>.ps__thumb-y{background-color:rgba(255,255,255,.75)}.sidebar-prime .nav-sidebar .nav-link{color:rgba(255,255,255,.6)}.sidebar-prime .nav-sidebar .nav-link:hover,.sidebar-prime .nav-sidebar .nav-link:focus{color:#fff}.sidebar-prime .nav-sidebar .nav-link.has-sub::after{color:rgba(255,255,255,.6)}.sidebar-prime .nav-sidebar .nav-link.has-sub.active{color:#fff}.sidebar-prime .nav-sidebar .nav-link.active{color:#fff;font-weight:400}.sidebar-prime .nav-sidebar .nav-sub-link{color:rgba(255,255,255,.5)}.sidebar-prime .nav-sidebar .nav-sub-link::before{background-color:rgba(255,255,255,.45)}.sidebar-prime .nav-sidebar .nav-sub-link.active{color:#fff}.sidebar-prime .sidebar-footer{background-color:#506fd9;border-top-color:rgba(255,255,255,.12);box-shadow:none}.sidebar-prime .sidebar-footer .dropdown-link{color:rgba(255,255,255,.6)}.sidebar-prime .sidebar-footer .dropdown-link:hover,.sidebar-prime .sidebar-footer .dropdown-link:focus{background-color:#4365d6;color:#fff}.sidebar-prime .sidebar-footer-body h6 a,.sidebar-prime .sidebar-footer-body .h6 a{color:#fff}.sidebar-prime .sidebar-footer-body p{color:rgba(255,255,255,.6)}.sidebar-prime .sidebar-footer-menu a{color:rgba(255,255,255,.6)}.sidebar-prime .sidebar-footer-menu a:hover,.sidebar-prime .sidebar-footer-menu a:focus{background-color:#4365d6;color:#fff}.sidebar-prime .sidebar-footer-menu hr{background-color:#fff;opacity:.1}.sidebar-dark{background-color:#192030}@media(min-width: 992px){.sidebar-dark{box-shadow:none}}.sidebar-dark::before{background-color:rgba(16,21,31,.75)}.sidebar-dark .sidebar-logo{color:#fff}.sidebar-dark .sidebar-header{border-bottom-color:rgba(255,255,255,.06)}.sidebar-dark .sidebar-body .nav-group{border-bottom-color:rgba(255,255,255,.06)}.sidebar-dark .sidebar-body .nav-label{color:rgba(255,255,255,.25)}.sidebar-dark .sidebar-body>.ps__rail-y{background-color:rgba(255,255,255,.1)}.sidebar-dark .sidebar-body>.ps__rail-y>.ps__thumb-y{background-color:rgba(255,255,255,.75)}.sidebar-dark .nav-sidebar .nav-link{color:rgba(255,255,255,.6)}.sidebar-dark .nav-sidebar .nav-link:hover,.sidebar-dark .nav-sidebar .nav-link:focus{color:rgba(255,255,255,.85)}.sidebar-dark .nav-sidebar .nav-link.active{color:#506fd9;font-weight:400}.sidebar-dark .nav-sidebar .nav-link.has-sub::after{color:rgba(255,255,255,.6)}.sidebar-dark .nav-sidebar .nav-sub-link{color:rgba(255,255,255,.5)}.sidebar-dark .nav-sidebar .nav-sub-link::before{background-color:rgba(255,255,255,.4)}.sidebar-dark .nav-sidebar .nav-sub-link.active{color:rgba(255,255,255,.85)}.sidebar-dark .nav-sidebar .nav-sub-link.active::before{background-color:#506fd9}.sidebar-dark .sidebar-footer{background-color:#192030;border-top-color:rgba(255,255,255,.06);box-shadow:none}.sidebar-dark .sidebar-footer .dropdown-link{color:rgba(255,255,255,.6)}.sidebar-dark .sidebar-footer .dropdown-link:hover,.sidebar-dark .sidebar-footer .dropdown-link:focus{background-color:#141926;color:#fff}.sidebar-dark .sidebar-footer-body h6 a,.sidebar-dark .sidebar-footer-body .h6 a{color:#fff}.sidebar-dark .sidebar-footer-body p{color:rgba(255,255,255,.4)}.sidebar-dark .sidebar-footer-menu a{color:rgba(255,255,255,.6)}.sidebar-dark .sidebar-footer-menu a:hover,.sidebar-dark .sidebar-footer-menu a:focus{background-color:#222b41;color:#fff}.sidebar-dark .sidebar-footer-menu hr{background-color:#fff;opacity:.1}.main{min-height:100vh;margin-top:72px;transition:all .25s}@media(prefers-reduced-motion: reduce){.main{transition:none}}@media(min-width: 992px){.main{margin-left:240px;margin-top:0}}@media(min-width: 1400px){.main{margin-left:250px}}.main-app{margin-top:72px}.main-title-label{font-size:11px;font-family:"Archivo",sans-serif;text-transform:uppercase;color:#506fd9;letter-spacing:.5px;display:block;margin-bottom:5px}.main-title{text-indent:-1px;margin-bottom:30px;color:#212830;font-size:20px;letter-spacing:-0.2px}@media(min-width: 992px){.main-title{font-size:21px}}.main-title-text{font-size:16px;color:#41505f}.main-separator{margin:40px 0;background-color:#e2e5ec;opacity:.12}.main-subtitle{color:#212830;font-weight:600;margin-bottom:10px}.main-mobile-header{position:fixed;top:0;left:0;right:0;height:72px;padding:0 23px;display:flex;align-items:center;background-color:#fff;border-bottom:1px solid rgba(0,0,0,0);z-index:800;transition:all .3s}@media(prefers-reduced-motion: reduce){.main-mobile-header{transition:none}}@media(min-width: 992px){.main-mobile-header{display:none}}.main-mobile-header.scroll{box-shadow:0 1px 1px rgba(226,229,236,.08),0 2px 2px rgba(226,229,236,.12),0 4px 4px rgba(226,229,236,.16),0 8px 8px rgba(226,229,236,.2)}.main-mobile-header .menu-link{width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:24px;color:#6e7985}.main-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:900;background-color:rgba(33,40,48,.6);opacity:0;visibility:hidden;transition:all .25s}@media(prefers-reduced-motion: reduce){.main-backdrop{transition:none}}.section-title{font-size:15px;font-weight:600;color:#212830}.section-title-sm{font-size:14px}.main-label-group{display:flex;align-items:center;justify-content:space-between;font-size:.8125rem}.main-label-group label{display:block;margin-bottom:0;font-weight:500}.main-footer{margin-top:60px;border-top:1px solid rgba(226,229,236,.6);padding-top:20px;font-size:.8125rem;color:#6e7985}@media(min-width: 576px){.main-footer{display:flex;align-items:center;justify-content:space-between}}.main-footer span{display:block}.main-footer span+span{margin-top:5px}@media(min-width: 576px){.main-footer span+span{margin-top:0}}.card-one{height:100%;border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-one .card-header{border-bottom-color:rgba(226,229,236,.55);background-color:rgba(0,0,0,0);padding:15px;display:flex;align-items:center}.card-one .card-header .card-title{font-weight:600;font-size:15px;color:#212830;margin-bottom:0;line-height:1.4}.card-one .card-header .nav-icon{margin-right:-4px}.card-one .nav-icon .nav-link{opacity:.6}.card-one .nav-icon .nav-link:hover{opacity:1}.card-one .nav-pills{font-size:.8125rem}.card-one .nav-pills .nav-link{border-radius:3px;color:#6e7985;padding:4px 15px}.card-one .nav-pills .nav-link.active{background-color:#e2e5ec;color:#41505f}.card-one .card-body{padding:15px;position:relative}.card-one small,.card-one .small{color:#6e7985;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:12px}.card-one .legend{margin:0;padding:0;list-style:none;line-height:1.25}.card-one .legend li{display:inline-flex;align-items:center;position:relative;font-size:.75rem}.card-one .legend li::before{content:"";width:8px;height:8px;border-radius:100%;margin-right:5px}.card-one .legend li+li{margin-left:10px}.card-one .legend li:first-child::before{background-color:#506fd9}.card-one .legend li:nth-child(2)::before{background-color:#dbdffd}.card-one .legend li:last-child::before{background-color:#85b6ff}.card-one .card-icon{flex-shrink:0;width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:#fff;border-radius:4px}.card-one .card-icon i{font-size:24px;line-height:1}.card-one .people-item{padding:10px 15px}.card-one .people-item+.people-item{margin-top:0;border-top:1px solid #f3f5f9}.card-one .people-item .avatar{margin-right:8px}.card-one .people-item .nav-link+.nav-link{margin-left:5px}.card-one .card-footer{padding:15px;background-color:rgba(0,0,0,0);border-top-color:#f3f5f9}.card-one .list-group-item{border-color:#f3f5f9}.card-value{font-family:"Inter",sans-serif;font-weight:500;color:#212830;display:flex;align-items:center;grid-gap:2px;letter-spacing:-0.2px}.card-value span{font-weight:400}.card-value i{margin-right:5px;text-indent:-3px;color:#506fd9}.flot-chart{width:100%}.flot-chart.ht-80{height:80px}.flot-chart.ht-180{height:180px}.flot-chart.ht-280{height:280px}.flot-chart.ht-290{height:290px}.flot-chart .flot-tick-label{font-family:"Inter",sans-serif}.flot-chart .flot-x-axis .flot-tick-label{font-size:10px;font-weight:500;color:#6e7985}.flot-chart .flot-y-axis .flot-tick-label{font-size:10px;color:#9ea7b1}.chart-bar-one{height:350px}@media(min-width: 768px){.chart-bar-one{height:100%}}.table-one{margin-bottom:0}.table-one thead th,.table-one tbody td{padding-left:0;padding-right:0;vertical-align:middle}.table-one thead th:not(:first-child),.table-one tbody td:not(:first-child){text-align:right}.table-one tbody td{border-color:#f3f5f9}.table-one tbody tr:last-child td{border-bottom-width:0;padding-bottom:0}.table-one tbody td:not(:first-child){font-family:"Inter",sans-serif}.table-two{white-space:nowrap}.table-two thead th,.table-two tbody td{vertical-align:middle}.table-two thead th:not(:first-child),.table-two tbody td:not(:first-child){text-align:right}.table-two thead th:first-child,.table-two tbody td:first-child{padding-left:0}.table-two thead th:last-child,.table-two tbody td:last-child{padding-right:0}.table-two tbody td{border-color:#f3f5f9;font-family:"Inter",sans-serif}.earning-item h4,.earning-item .h4{margin-bottom:3px;font-family:"Inter",sans-serif;font-weight:500;color:#212830;letter-spacing:-0.5px}.earning-item h4 span,.earning-item .h4 span{font-weight:400;color:#41505f}.earning-item label{display:block;margin-bottom:0;font-size:.8125rem;font-weight:500;color:#6e7985}.earning-icon{width:48px;height:48px;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:24px;margin-bottom:15px}.apex-chart-one{position:relative;left:-12px;width:calc(100% + 20px)}.performance-value{display:flex;align-items:baseline;font-family:"Inter",sans-serif;letter-spacing:-0.2px}.progress-one{border-radius:3px}.progress-one .progress-bar+.progress-bar{border-left:1.5px solid #fff}.table-three{margin-bottom:0}.table-three tbody td{vertical-align:middle;border-color:#f3f5f9;padding:5px}.table-three tbody td:first-child{padding-left:0}.table-three tbody td:last-child{padding-right:0}.table-three tbody td:nth-child(2),.table-three tbody td:nth-child(3){font-weight:500;color:#212830}.table-three tbody td:nth-child(3),.table-three tbody td:last-child{text-align:right;font-family:"Inter",sans-serif}.table-three .badge-dot{display:inline-block;width:12px;height:12px;position:relative;transform:translateY(1px)}.table-three .badge-dot::before{content:"";position:absolute;width:6px;height:6px;border-radius:100%;background-color:#fff;z-index:5;top:3px;left:3px}.vmap-one{height:200px}@media(min-width: 768px){.vmap-one{height:300px}}@media(min-width: 1200px){.vmap-one{height:350px}}.table-four{margin-bottom:0}.table-four thead th{background-color:#f8f9fc;padding-left:10px;padding-right:10px}.table-four thead tr:first-child th{text-align:center}.table-four thead tr:last-child th:not(:first-child){text-align:right}.table-four tbody td{padding-left:10px;padding-right:10px;white-space:nowrap}.table-four tbody td:not(:first-child){font-family:"Inter",sans-serif;text-align:right}.apex-chart-nine{position:relative;left:-15px;width:calc(100% + 15px)}.table-five{margin-bottom:0}.table-five tbody td{vertical-align:center;padding-top:7px;padding-bottom:7px;padding-right:0;border-color:#f3f5f9}.table-five tbody td:first-child{padding-left:0}.table-five tbody td:not(:first-child){font-family:"Inter",sans-serif;text-align:right}.table-five tbody td>div{display:flex;align-items:center;grid-gap:5px}.table-five tbody tr:last-child td{border-bottom-width:0}.chart-donut-one{height:180px}@media(min-width: 1200px){.chart-donut-one{height:215px}}.list-group-one .list-group-item{border-left-width:0;border-right-width:0}.list-group-one .list-group-item:first-child{border-top-left-radius:0;border-top-right-radius:0;border-top-width:0;padding-top:0}.list-group-one .list-group-item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:0;border-bottom-width:0}.list-group-one .avatar{display:flex;align-items:center;justify-content:center;font-size:20px}.bg-litecoin{background-color:#325a98}.news-item{position:relative}@media(min-width: 576px){.news-item{display:flex}}.news-item+.news-item{margin-top:15px;padding-top:15px;border-top:1px solid #f3f5f9}.news-img{width:100%;height:140px;flex-shrink:0;margin-bottom:15px}@media(min-width: 576px){.news-img{width:150px;height:100px;margin-bottom:0;margin-right:15px}}.news-img img{border-radius:4px;width:100%;height:100%;object-fit:cover}.news-body{flex:1}.news-title{line-height:1.3;font-size:15px}.crypto-item{display:flex;align-items:center;position:absolute;top:15px;left:15px}.crypto-item .avatar{display:flex;align-items:center;justify-content:center;color:#fff;font-size:21px;margin-right:10px;width:40px;height:40px}.crypto-body{flex:1}.crypto-body .card-label{display:block;font-size:.75rem;font-weight:500;margin-bottom:2px;color:#6e7985}.crypto-body .card-value{margin-bottom:0;font-size:15px}.card-footer-crypto{border-top-width:0;display:flex;align-items:center;grid-gap:15px;font-size:11px;font-weight:500;color:#6e7985}.card-footer-crypto strong{font-weight:600;font-family:"Inter",sans-serif;color:#212830}.apex-chart-ten{position:relative}.finance-info{position:absolute;top:0;left:0;right:0;z-index:5;border-top-left-radius:inherit;border-top-right-radius:inherit;background-image:linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0))}.finance-value{font-family:"Inter",sans-serif;font-size:32px;letter-spacing:-1px;color:#212830;text-indent:-2px}@media(min-width: 1200px){.finance-value{font-size:40px}}.finance-value span{font-weight:300;color:#41505f}.finance-subvalue{display:flex;align-items:center;grid-gap:3px;font-size:20px}.finance-subvalue span{font-family:"Inter",sans-serif;letter-spacing:-0.2px}.finance-subvalue small,.finance-subvalue .small{font-size:18px;font-weight:400;align-self:flex-end;margin-bottom:.5px;color:#41505f}.nav-finance-one{position:absolute;top:0;right:0;z-index:10;font-family:"Inter",sans-serif;font-size:.8125rem}.nav-finance-one a{color:#6e7985;letter-spacing:-0.2px}.nav-finance-one a.active{font-weight:500;color:#506fd9;text-decoration:underline}.nav-finance-one a+a{margin-left:10px}.card-wallet{position:relative;overflow:hidden;height:240px}@media(min-width: 768px){.card-wallet{height:100%}}.card-wallet .card-body{padding:23px 25px;position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;z-index:5}.card-wallet .card-body h5,.card-wallet .card-body .h5{font-weight:500;color:#212830}.card-wallet .card-title{font-size:12px;font-family:"Inter",sans-serif;display:block}.card-wallet .finance-icon{position:absolute;top:5px;right:24px;display:flex;align-items:center}.card-wallet .finance-icon i{line-height:1;color:#506fd9}.card-wallet .finance-icon i:first-child{font-size:42px}.card-wallet .finance-icon i:last-child{font-size:58px}.card-wallet .finance-icon i+i{margin-left:5px}.card-wallet .card-value{color:#212830;letter-spacing:-0.5px;text-indent:-1px}.card-wallet .card-value span{font-weight:300}.card-wallet .badge-dot{background-color:#212830;color:#212830}.card-wallet .flot-chart{width:calc(100% + 18px);height:200px;position:relative;left:-10px}@media(min-width: 576px){.card-wallet .flot-chart{height:230px}}@media(min-width: 768px){.card-wallet .flot-chart{height:100%}}@media(min-width: 1200px){.card-wallet .flot-chart{height:100%}}.card-wallet .apex-chart-two{display:flex;align-items:flex-end}.progress-finance{height:80px;border-radius:2px}.progress-finance .progress-bar{font-size:.875rem}.progress-finance .progress-bar:nth-child(2){background-color:#85b6ff}.progress-finance .progress-bar:last-child{background-color:#4c5366}.finance-peity-donut{height:290px}@media(min-width: 1200px){.finance-peity-donut{height:100%}}.finance-donut-value{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.finance-donut-value h1,.finance-donut-value .h1{font-weight:600;font-family:"Inter",sans-serif;letter-spacing:-1px;margin-bottom:0}.finance-donut-value p{font-family:"Inter",sans-serif;margin-bottom:0;color:#6e7985}.finance-item-circle{margin:auto;width:120px;height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:100%;background-color:#f3f5f9}@media(min-width: 1200px){.finance-item-circle{width:150px;height:150px}}.finance-item-circle h1,.finance-item-circle .h1{font-family:"Inter",sans-serif;font-weight:600;color:#212830;margin-bottom:0}.finance-item-circle label{display:block;font-size:.8125rem;font-weight:500;color:#212830}.apex-chart-two{position:relative;left:-15px;width:calc(100% + 35px)}.apex-chart-three{position:relative;left:-25px;width:calc(100% + 40px)}.apex-chart-three .apexcharts-xaxis-label{position:relative;transform:translateY(-8px)}.apex-donut-two{display:flex;align-items:center;justify-content:center}.apex-donut-two .apexcharts-canvas{transform:scale(1.1)}.helpdesk-icon{width:72px;height:72px;display:flex;align-items:center;justify-content:center;border-radius:8px}.helpdesk-icon i{font-size:36px}.chartjs-one{height:250px;position:relative}.chartjs-two{height:250px}@media(min-width: 1200px){.chartjs-two{height:100%}}.peity-two{position:relative}.peity-two>div{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.table-ratings tbody td{font-family:"Inter",sans-serif;vertical-align:middle;padding-left:2px;padding-right:2px;border-color:#f3f5f9}.table-ratings tbody td:first-child{padding-left:0}.table-ratings tbody td:last-child{padding-right:0}.table-ratings tbody td strong{font-weight:500;color:#313c47}.table-ratings tbody td i{line-height:1}.table-ratings tbody td:nth-child(3),.table-ratings tbody td:last-child{text-align:right}.table-ratings tbody td:nth-child(3){font-weight:500;color:#212830}.table-ratings tbody tr:last-child td{border-bottom-width:0;padding-bottom:0}.table-agent{white-space:nowrap}.table-agent thead th{vertical-align:middle;font-size:.8125rem}.table-agent thead th:first-child{width:3%}.table-agent thead th:nth-child(2){width:9%}.table-agent thead th:nth-child(3){width:28%}.table-agent tbody td{vertical-align:middle;border-color:#f3f5f9}.table-agent tbody td:last-child{text-align:right}.table-agent tbody tr:last-child td{border-bottom-width:0}.table-agent .form-check{margin-bottom:0}.table-agent .link-more{display:flex;font-size:18px;line-height:1;color:#6e7985}.table-agent .badge{display:block}.table-agent h6,.table-agent .h6{color:#313c47}.apex-donut-one{width:130px;height:130px;display:flex;align-items:center;justify-content:center;position:relative}.apex-donut-one>div:last-child{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.card-ticket-earnings{overflow:hidden}.card-ticket-earnings .card-body{position:absolute;top:0;left:0;right:0;bottom:0;z-index:5}.card-ticket-available{overflow:hidden;height:200px}@media(min-width: 992px){.card-ticket-available{height:100%}}.card-ticket-available .card-body{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5}.card-ticket-available .flot-chart{height:200px}@media(min-width: 576px){.card-ticket-available .flot-chart{height:170px}}.card-ticket-available .apex-chart{display:flex;align-items:flex-end;height:200px}@media(min-width: 576px){.card-ticket-available .apex-chart{height:100%}}.card-ticket-sold{position:relative;overflow:hidden}.card-ticket-sold .card-body{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5}.card-ticket-sold .flot-chart{width:calc(100% + 16px);height:210px;position:relative;left:-8px;bottom:-8px}.card-ticket-sold .apex-chart{height:210px;position:relative}.chartjs-three{height:270px}@media(min-width: 1200px){.chartjs-three{height:325px}}.chart-donut-two{height:225px}.card-events-category .card-value{display:flex;align-items:baseline;letter-spacing:-1px}.card-events-category .card-value small,.card-events-category .card-value .small{display:inline-block;margin-bottom:2px;padding-left:2px;font-weight:400;font-size:16px;letter-spacing:normal}.events-reviews{margin:0;padding:0;list-style:none}.events-reviews li{padding:12px 0;border-top:1px solid #f3f5f9}.events-reviews li:last-child{padding-bottom:0}.events-reviews .avatar{margin-right:10px;flex-shrink:0}.events-reviews .review-body h6,.events-reviews .review-body .h6{margin-bottom:2px}.events-reviews .review-body small,.events-reviews .review-body .small{padding-left:2px}.events-reviews p{font-size:.8125rem;color:#6e7985;line-height:1.45;margin-bottom:0}.events-list{margin:0;padding:0;list-style:none}.events-list li{display:flex}.events-list li+li{margin-top:10px}.events-list li.active .event-date{background-color:#506fd9;color:#fff}.events-list li.active .ev-item{border-left-color:#506fd9;background-color:rgba(80,111,217,.08)}.events-list li.active .ev-item h6,.events-list li.active .ev-item .h6{color:#506fd9}.event-date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:45px;height:50px;background-color:#e2e5ec;color:#212830;border-radius:4px;flex-shrink:0;margin-right:15px}.event-date small,.event-date .small{text-transform:uppercase;display:block;font-size:10px;font-weight:500;font-family:"Archivo",sans-serif;letter-spacing:.5px;opacity:.65;color:inherit;line-height:1.2}.event-date h5,.event-date .h5{font-size:22px;font-family:"Inter",sans-serif;font-weight:500;letter-spacing:-1px;margin-bottom:0}.events-body{flex:1}.events-body .ev-item{padding:5px 10px;background-color:#fbfcfe;border-left:2px solid #6e7985}.events-body .ev-item+.ev-item{margin-top:2px}.events-body .ev-item small,.events-body .ev-item .small{display:block;font-family:"Inter",sans-serif;font-size:11px;margin-bottom:1px;color:#9ea7b1}.events-body .ev-item h6,.events-body .ev-item .h6{color:#212830;font-weight:600;margin-bottom:5px}.events-body .ev-item p{font-size:.75rem;color:#6e7985;margin-bottom:3px;line-height:1.4}.card-daily-trends{position:relative;overflow:hidden;padding:20px 10px}.card-daily-trends .card-body{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5}.card-daily-trends .card-value{display:flex;align-items:flex-end;margin-bottom:0;letter-spacing:-1px}.card-daily-trends .card-value span{display:block;font-size:18px;letter-spacing:normal;color:#6e7985;margin-left:3px;margin-bottom:6px}.card-daily-trends .flot-chart{position:relative;height:235px;margin-top:20px}@media(min-width: 768px){.card-daily-trends .flot-chart{height:100%}}.chart-donut-three{position:relative;height:230px}@media(min-width: 992px)and (max-width: 1199.98px){.chart-donut-three{height:210px}}.card-article .card-body{padding:20px}.card-article .card-title{color:#212830;font-weight:600}@media(min-width: 1400px){.card-article .card-title{font-size:24px}}.storage-item{display:flex;align-items:center}.storage-item+.storage-item{margin-top:20px}.storage-item .storage-icon{width:54px;height:54px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;margin-right:15px;background-color:#f3f5f9}.storage-item .storage-icon i{font-size:32px}.apex-chart-eleven{position:relative;left:-25px;width:calc(100% + 40px);height:250px}@media(min-width: 1200px){.apex-chart-eleven{height:100%}}.card-product .card-icon{border-radius:100%;background-color:rgba(80,111,217,.1);color:#506fd9;display:flex;align-items:center}.card-product .card-label{display:block;color:#6e7985;margin-bottom:3px}.card-product-inventory .flot-chart{height:250px}@media(min-width: 1200px){.card-product-inventory .flot-chart{height:100%}}.product-wrapper{border-radius:4px;background-color:#f8f9fc;overflow:auto}.product-wrapper+.product-wrapper{margin-top:5px}.product-wrapper .table{margin-bottom:0;white-space:nowrap;min-width:620px}.product-wrapper .table td{border-width:0;vertical-align:middle}.product-wrapper .table td:first-child{width:5%}.product-wrapper .table td:nth-child(2){width:40%}.product-wrapper .table td:nth-child(3){width:14%}.product-thumb{width:40px;height:45px;background-color:#fff;border-radius:4px;padding:5px}.product-thumb img{width:100%;height:100%;object-fit:cover}.revenue-item{position:relative}.revenue-item+.revenue-item{margin-top:20px}.revenue-item .progress{height:5px;border-radius:2px}.revenue-item-body{display:flex;align-items:center;margin-bottom:10px}.revenue-item-body span:first-child{flex:1}.revenue-item-body span:nth-child(2){font-weight:500;font-family:"Inter",sans-serif;text-align:right;color:#212830}.revenue-item-body span:last-child{font-family:"Inter",sans-serif;text-align:right;width:45px;margin-left:10px}.card-purchases .flot-chart{position:relative;height:180px;width:calc(100% + 8px);left:-4px}.total-sales-body{position:absolute;top:0;right:0;left:0;padding:20px;background-image:linear-gradient(to bottom, #fff, rgba(255, 255, 255, 0.1));z-index:5;border-top-left-radius:6px;border-top-right-radius:6px}.product-review-footer{display:flex;align-items:center;grid-gap:10px}.product-review-footer a{display:flex;color:#6e7985;font-size:13px;position:relative}.product-review-footer a:hover{color:#506fd9}.product-review-footer a+a{padding-left:10px}.product-review-footer a+a::before{content:"";border-left:1px dotted #9ea7b1;position:absolute;top:0;left:0;bottom:0}.product-review-footer i{font-size:16px;line-height:1.2}.apex-chart-twelve{position:relative;margin-left:-15px}.page-app .main-app{min-height:0;height:calc(100vh - 72px)}.page-app .main-footer{margin-top:0;border-top-width:0;display:flex;flex-direction:column;align-items:center;padding-top:15px;padding-bottom:5px}@media(min-width: 576px){.page-app .main-footer{flex-direction:row;padding-top:20px;padding-bottom:0}}.page-app .main-footer span+span{margin-top:2px}@media(min-width: 576px){.page-app .main-footer span+span{margin-top:0}}.page-app .header-link{line-height:1;display:flex;align-items:center;justify-content:center;color:#6e7985;font-size:18px;transition:all .25s}@media(prefers-reduced-motion: reduce){.page-app .header-link{transition:none}}.page-app .header-link:hover,.page-app .header-link:focus{color:#506fd9}.page-app .dropdown-menu{border-color:rgba(226,229,236,.6);border-width:0;border-radius:6px;box-shadow:0 1px 1px rgba(204,210,218,.25),0 2px 2px rgba(204,210,218,.2),0 4px 4px rgba(204,210,218,.15),0 8px 8px rgba(204,210,218,.1),0 16px 16px rgba(204,210,218,.05)}.page-app .dropdown-item{display:flex;align-items:center;padding:7px 10px}.page-app .dropdown-item i{font-size:18px;line-height:1;margin-right:10px}.main-file-manager{min-height:0;height:calc(100vh - 72px);margin-top:72px;position:relative}@media(max-width: 991.98px){.main-file-manager.show .file-sidebar{left:0;border-right:1px solid rgba(226,229,236,.6)}.main-file-manager.show .file-content{transform:translateX(230px)}}.file-sidebar{position:absolute;top:0;left:-230px;bottom:0;width:230px;overflow:hidden;padding:20px;transition:all .25s}@media(prefers-reduced-motion: reduce){.file-sidebar{transition:none}}@media(min-width: 992px){.file-sidebar{left:0;border-right:1px solid rgba(226,229,236,.6)}}.file-sidebar .nav-link{border-radius:4px;padding-left:10px;padding-right:10px}.file-sidebar .nav-link:hover{background-color:#f3f5f9}.file-sidebar .nav-link.active{background-color:rgba(80,111,217,.1)}.file-sidebar .nav-link+.nav-link{margin-top:1px}.file-sidebar .sidebar-label{padding:0}.sidebar-storage{display:flex;align-items:center}.sidebar-storage>i{font-size:32px;line-height:1}.sidebar-storage .storage-info{font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";display:block;color:#6e7985;margin-bottom:2px}.sidebar-storage .progress{height:3px}.file-content{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;transition:all .25s}@media(prefers-reduced-motion: reduce){.file-content{transition:none}}@media(min-width: 992px){.file-content{left:230px}}.file-content .table-responsive{margin:0 -15px;padding:0 15px}.card-file .dropdown-file,.card-folder .dropdown-file{position:absolute;top:10px;right:10px}.card-file .dropdown-link,.card-folder .dropdown-link{font-size:16px;color:#6e7985}.card-file .dropdown-item,.card-folder .dropdown-item{font-size:.8125rem;padding-left:8px}.card-file{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07);padding:10px;position:relative;height:100%}.card-file .card-file-icon{width:100%;height:120px;background-color:#f3f5f9;display:flex;align-items:center;justify-content:center;font-size:48px;border-radius:3px}.card-file .card-file-icon.danger{color:#dc3545;background-color:rgba(220,53,69,.08)}.card-file .card-file-icon.primary{color:#506fd9;background-color:rgba(80,111,217,.08)}.card-file .card-file-icon.info{color:#0dcaf0;background-color:rgba(13,202,240,.08)}.card-file .card-file-icon.success{color:#0cb785;background-color:rgba(12,183,133,.08)}.card-file .card-body{padding:0;margin-top:10px}.card-file .card-body h6,.card-file .card-body .h6{margin-bottom:5px;font-size:.8125rem}@media(min-width: 576px){.card-file .card-body h6,.card-file .card-body .h6{font-size:.875rem}}.card-file .card-body h6 a,.card-file .card-body .h6 a{color:#212830}.card-file .card-body span{display:block;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985;text-transform:uppercase;margin-bottom:10px}.card-file .card-footer{background-color:rgba(0,0,0,0);border-top-width:0;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";padding:0;color:#6e7985}.card-folder{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07);position:relative}.card-folder .dropdown-file{top:2px;right:0}.card-folder .card-body{display:flex;align-items:center;padding:8px}@media(min-width: 576px){.card-folder .card-body{padding:10px}}.card-folder .card-body>i{font-size:40px;line-height:.75;color:#506fd9;margin-right:8px}@media(min-width: 576px){.card-folder .card-body>i{font-size:48px;margin-right:10px}}.card-folder .card-body h6,.card-folder .card-body .h6{margin-bottom:2px;font-size:.8125rem;width:inherit}@media(min-width: 576px){.card-folder .card-body h6,.card-folder .card-body .h6{font-size:.875rem}}.card-folder .card-body h6 a,.card-folder .card-body .h6 a{color:#212830;display:block;width:inherit;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.card-folder .card-body span{display:block;font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985}@media(min-width: 576px){.card-folder .card-body span{font-size:.75rem}}.card-folder .card-content{flex:1;max-width:calc(100% - 55px)}@media(min-width: 576px){.card-folder .card-content{max-width:calc(100% - 60px)}}.table-files{border-collapse:separate;border-spacing:0 5px;font-size:.8125rem;min-width:520px}.table-files thead th:nth-child(2),.table-files thead th:nth-child(3),.table-files tbody td:nth-child(2),.table-files tbody td:nth-child(3){text-align:right}.table-files thead th{font-weight:400;font-size:.8125rem;color:#6e7985;padding-top:0;padding-bottom:2px;padding-left:10px;padding-right:10px;border-bottom:0}.table-files thead th:first-child{width:55%}.table-files thead th:nth-child(2){width:20%}.table-files thead th:nth-child(3){width:15%}.table-files thead th:last-child{width:10%}.table-files tbody tr{border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.table-files tbody tr td{border-bottom:0;background-color:#fff;padding:10px;vertical-align:middle;border:1px solid rgba(0,0,0,0)}.table-files tbody tr td:not(:first-child){border-left-width:0}.table-files tbody tr td:not(:last-child){border-right-width:0}.table-files tbody tr td:first-child{border-top-left-radius:inherit;border-bottom-left-radius:inherit}.table-files tbody tr td:nth-child(2),.table-files tbody tr td:nth-child(3){text-align:right}.table-files tbody tr td:last-child{text-align:right;border-top-right-radius:inherit;border-bottom-right-radius:inherit}.table-files .dropdown-link{line-height:1;font-size:18px;color:#6e7985;display:flex;align-items:center;justify-content:flex-end}.table-files .media{display:flex;align-items:center}.table-files .media-icon{margin-right:10px;font-size:24px;color:#6e7985;line-height:1}.table-files .media-icon.primary{color:#506fd9}.table-files .media-icon.success{color:#0cb785}.table-files .media-icon.orange{color:#fd7e14}.table-files .media-icon.danger{color:#dc3545}.table-files .file-name{margin-bottom:0}.table-files .file-name a{color:#212830}.menu-file-manager{display:flex;align-items:center;font-size:20px;color:#6e7985;margin-right:10px}@media(min-width: 992px){.menu-file-manager{display:none}}.main-email{min-height:0;height:calc(100vh - 72px);margin-top:72px;position:relative}@media(max-width: 767.98px){.main-email.show{overflow:hidden}.main-email.show .email-sidebar{left:0;border-right:1px solid rgba(226,229,236,.6)}.main-email.show .email-list{transform:translateX(230px)}}@media(max-width: 1199.98px){.main-email.show-content .email-list{display:none}.main-email.show-content .email-content{display:block}}.email-sidebar{position:absolute;top:0;left:-230px;bottom:0;width:230px;overflow:hidden;padding:20px;transition:all .25s}@media(prefers-reduced-motion: reduce){.email-sidebar{transition:none}}@media(min-width: 768px){.email-sidebar{left:0;border-right:1px solid rgba(226,229,236,.6)}}.email-sidebar .nav-link{padding-left:10px;padding-right:10px;border-radius:4px}.email-sidebar .nav-link:hover{background-color:#f3f5f9}.email-sidebar .nav-link.active{background-color:rgba(80,111,217,.1);color:#506fd9}.email-sidebar .nav-link+.nav-link{margin-top:1px}.email-sidebar hr{opacity:1;border-color:rgba(226,229,236,.6)}.email-sidebar .sidebar-label{padding:0}.email-menu{display:flex;align-items:center;font-size:20px;color:#6e7985;margin-right:10px}@media(min-width: 768px){.email-menu{display:none}}.email-list{position:absolute;top:0;bottom:0;left:0;width:100vw;overflow:hidden;transition:all .25s}@media(prefers-reduced-motion: reduce){.email-list{transition:none}}@media(min-width: 768px){.email-list{left:230px;width:calc(100vw - 230px);border-right:1px solid rgba(226,229,236,.6)}}@media(min-width: 1200px){.email-list{width:340px}}.email-list-header{height:56px;padding:0 15px;display:flex;align-items:center;border-bottom:1px solid rgba(226,229,236,.6)}@media(min-width: 768px){.email-list-header{padding:0 20px}}.email-list-header h5,.email-list-header .h5{font-weight:600;font-size:16px;color:#212830}.email-list-header .dropdown-link{display:flex;align-items:center;font-size:18px;line-height:1;color:#6e7985;width:10px;text-indent:-4px}.email-list-header .dropdown-menu label{text-transform:uppercase;font-size:11px;font-family:"Archivo",sans-serif;letter-spacing:.5px;color:#6e7985;padding-left:7px;margin-bottom:5px}.email-list-header .dropdown-item{position:relative;padding-top:5px;padding-bottom:5px;padding-left:25px;display:flex;align-items:center}.email-list-header .dropdown-item+.dropdown-item{margin-top:1px}.email-list-header .dropdown-item::before{content:"";font-family:"remixicon";font-size:16px;line-height:0;position:absolute;top:50%;left:5px;display:none}.email-list-header .dropdown-item.active{background-color:rgba(80,111,217,.1);color:#506fd9}.email-list-header .dropdown-item.active::before{display:block}.email-list-label{margin-bottom:0;display:block;padding:6px 20px;font-size:.75rem;font-weight:500;color:#6e7985;border-bottom:1px solid rgba(226,229,236,.6)}.email-item{padding:15px 20px;border-bottom:1px solid rgba(226,229,236,.6);display:flex}.email-item:hover{background-color:rgba(243,245,249,.6);cursor:pointer}.email-item:last-child{border-bottom-width:0}.email-item .avatar{margin-right:12px;flex-shrink:0}.email-item.unread .email-item-subject{color:#506fd9;font-weight:600}.email-item.unread .email-item-sender,.email-item.unread .email-item-summary{color:#212830;font-weight:500}.email-item.selected{background-color:#f1f4fc}.email-item-body{flex:1;position:relative}.email-item-sender,.email-item-date{font-size:.75rem;color:#6e7985}.email-item-star{display:flex;align-items:center;margin-left:5px;color:#6e7985;transition:all .25s}@media(prefers-reduced-motion: reduce){.email-item-star{transition:none}}.email-item-star:hover{color:#ffc107}.email-item-star.active{color:#ffc107}.email-item-star.active:hover{color:#ffc107}.email-item-date{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";margin-left:auto}.email-item-summary{margin-bottom:0;font-size:.8125rem}.email-content{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;display:none}@media(min-width: 768px){.email-content{left:230px}}@media(min-width: 1200px){.email-content{left:570px;display:block}}.email-content.show .email-content-empty{display:none}.email-content.show .email-content-header{display:flex}.email-content.show .email-content-body{display:block}.email-content-empty{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;align-items:center;font-size:20px;font-weight:300;color:rgba(110,121,133,.4)}.email-content-header{height:56px;border-bottom:1px solid rgba(226,229,236,.6);align-items:center;padding:0 15px;display:none}@media(min-width: 992px){.email-content-header{padding:0 20px}}.email-content-header .nav{width:100%;grid-gap:10px}.email-content-header .nav-link{padding:0;font-size:20px;color:#41505f}.email-content-body{position:relative;display:none}.email-content-body hr{opacity:1;border-color:#e2e5ec}.email-content-body .section-label{font-size:.75rem;font-family:"Archivo",sans-serif;text-transform:uppercase;color:#6e7985;letter-spacing:.5px;display:block}.email-msg-item strong{font-weight:600}.email-msg-item .nav-icon{align-items:center;grid-gap:10px}.email-msg-item .nav-icon .nav-link{padding:0;font-size:18px;line-height:1;color:#6e7985}.email-msg-item .nav-icon .nav-link:hover{color:#506fd9}.card-attachment{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-attachment .card-body{display:flex;align-items:center;position:relative;padding:10px}.card-attachment .card-icon{width:48px;height:48px;border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:32px;margin-right:10px}.card-attachment .card-icon.primary{background-color:rgba(80,111,217,.16);color:#506fd9}.card-attachment .card-icon.success{background-color:rgba(12,183,133,.16);color:#0cb785}.card-attachment .card-content{flex:1;padding-right:10px}.card-attachment .card-content h6,.card-attachment .card-content .h6{font-weight:600;margin-bottom:5px}.card-attachment .card-content h6 a,.card-attachment .card-content .h6 a{color:#212830}.card-attachment .card-content h6 a:hover,.card-attachment .card-content .h6 a:hover{color:#506fd9}.card-attachment .card-content span{display:flex;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#9ea7b1;text-transform:uppercase}.compose-wrapper .ql-snow.ql-container{border-radius:4px;margin-bottom:10px}.compose-wrapper .ql-editor{border-radius:inherit;padding:15px;font-size:.875rem;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.compose-wrapper .ql-snow.ql-toolbar{padding:0;border-radius:0;border:0}.compose{position:fixed;bottom:0;right:0;z-index:800}@media(min-width: 768px){.compose{padding:20px 20px 0;max-height:100vh;overflow-y:auto}}.compose.minimize .compose-content{width:280px}.compose.minimize .compose-body,.compose.minimize .nav-toolbar,.compose.minimize .compose-footer{display:none}.compose.fullscreen:not(.minimize){top:0;right:0;left:0;display:flex;align-items:center;justify-content:center;background-color:rgba(33,40,48,.5)}.compose.fullscreen:not(.minimize) .compose-content{width:100%;border-bottom-left-radius:5px;border-bottom-right-radius:5px;box-shadow:0 1px 2px rgba(49,60,71,.07),0 2px 4px rgba(49,60,71,.07),0 4px 8px rgba(49,60,71,.07),0 8px 16px rgba(49,60,71,.07),0 16px 32px rgba(49,60,71,.07),0 32px 64px rgba(49,60,71,.07)}@media(min-width: 768px){.compose.fullscreen:not(.minimize) .compose-content{width:80%}}.compose.fullscreen:not(.minimize) .nav-link-fullscreen i:first-child{display:none}.compose.fullscreen:not(.minimize) .nav-link-fullscreen i:last-child{display:block}.compose-content{position:relative;width:100vw;height:100vh;display:flex;flex-direction:column}@media(min-width: 768px){.compose-content{width:498px;height:auto;border-top-left-radius:5px;border-top-right-radius:5px;box-shadow:0 1px 2px rgba(158,167,177,.07),0 2px 4px rgba(158,167,177,.07),0 4px 8px rgba(158,167,177,.07),0 8px 16px rgba(158,167,177,.07),0 16px 32px rgba(158,167,177,.07),0 32px 64px rgba(158,167,177,.07)}}@media(min-width: 1200px){.compose-content{width:520px}}.compose-header{height:48px;padding:0 15px;background-color:#212830;color:#fff;display:flex;align-items:center;border-top-left-radius:inherit;border-top-right-radius:inherit;cursor:pointer}.compose-header h6,.compose-header .h6{flex:1;font-weight:400;font-size:14px;margin-bottom:0}.compose-header .nav{margin-top:1.5px;margin-left:10px;align-items:center}.compose-header .nav-link{padding:0;font-size:18px;color:rgba(255,255,255,.75);line-height:1}.compose-header .nav-link:not(:last-child){display:none}@media(min-width: 768px){.compose-header .nav-link:not(:last-child){display:block}}.compose-header .nav-link+.nav-link{margin-left:8px}.compose-header .nav-link-fullscreen i:last-child{display:none}.compose-body{flex:1;background-color:#fff;border-bottom:1px solid rgba(226,229,236,.6);padding:20px;display:flex;flex-direction:column}.compose-body .form-group+.form-group{margin-top:15px}.compose-body .form-group:last-child{flex:1}.compose-body input.form-control,.compose-body input.gridjs-input{font-size:14px;padding:0 0 12px;border-radius:0;border-width:0 0 1px;border-bottom-color:#f3f5f9;color:#212830}.compose-body input.form-control::placeholder,.compose-body input.gridjs-input::placeholder{color:#6e7985;text-shadow:none}.compose-body input.form-control:focus,.compose-body input.gridjs-input:focus{box-shadow:none}.compose-body textarea.form-control,.compose-body textarea.gridjs-input{padding:0;font-size:14px;border-radius:0;border-width:0;color:#212830;resize:none;height:100%}.compose-body textarea.form-control:focus,.compose-body textarea.gridjs-input:focus{box-shadow:none}.nav-toolbar{align-items:center;padding:10px;background-color:#fff}.nav-toolbar .nav-link{padding:0;width:26px;height:26px;display:flex;align-items:center;justify-content:center;color:#41505f;border-radius:4px}@media(min-width: 768px){.nav-toolbar .nav-link{width:32px;height:32px}}.nav-toolbar .nav-link:hover,.nav-toolbar .nav-link:focus{background-color:rgba(243,245,249,.65);color:#212830}.nav-toolbar .nav-link i{font-size:16px;line-height:1}@media(min-width: 768px){.nav-toolbar .nav-link i{font-size:18px}}.nav-toolbar .nav-link:last-child{width:20px}.nav-toolbar .nav-separator{display:block;margin:0 4px;width:1px;height:18px;background-color:#f3f5f9}.compose-footer{background-color:#fff;border-top:1px solid rgba(226,229,236,.6);padding:12px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.compose-footer .btn-icontext{padding-left:15px;padding-right:15px}.compose-footer .btn-icontext i{font-size:16px}.chat-panel{background-color:#fff;border-radius:6px;position:relative;height:calc(100vh - 145px);box-shadow:0 1px 2px rgba(195,202,212,.07),0 2px 4px rgba(195,202,212,.07),0 4px 8px rgba(195,202,212,.07),0 8px 16px rgba(195,202,212,.07),0 16px 32px rgba(195,202,212,.07),0 32px 64px rgba(195,202,212,.07)}@media(min-width: 992px){.chat-panel{height:calc(100vh - 155px)}}@media(max-width: 767.98px){.chat-panel.msg-show .chat-sidebar{display:none}.chat-panel.msg-show .chat-body{display:block}}.chat-sidebar{width:100%;position:absolute;top:0;left:0;bottom:0;border-bottom-left-radius:inherit;border-top-left-radius:inherit;background-color:#fbfcfe}@media(min-width: 768px){.chat-sidebar{width:280px;border-right:1px solid rgba(226,229,236,.6)}}@media(min-width: 1200px){.chat-sidebar{width:300px}}.chat-sidebar .sidebar-header{background-color:#fff;border-top-left-radius:inherit;border-top-right-radius:inherit;padding:20px;height:auto;border-bottom-color:rgba(226,229,236,.6)}.chat-sidebar .sidebar-title{font-size:16px;font-weight:600;color:#212830;margin-bottom:0}.chat-sidebar .sidebar-body{padding:20px 10px 10px;height:calc(100% - 60px);position:relative;overflow:hidden}.chat-contacts{padding:0 10px}@media(min-width: 768px){.chat-contacts .avatar{width:32px;height:32px}}@media(min-width: 1200px){.chat-contacts .avatar{width:36px;height:36px}}.chat-group,.contact-group{position:relative}.chat-group .chat-item,.chat-group .contact-item,.contact-group .chat-item,.contact-group .contact-item{display:flex;align-items:center;padding:10px;border-radius:4px;transition:all .25s}@media(prefers-reduced-motion: reduce){.chat-group .chat-item,.chat-group .contact-item,.contact-group .chat-item,.contact-group .contact-item{transition:none}}.chat-group .chat-item:hover,.chat-group .contact-item:hover,.contact-group .chat-item:hover,.contact-group .contact-item:hover{background-color:#f3f5f9;cursor:pointer}.chat-group .chat-item+.chat-item,.chat-group .contact-item+.chat-item,.chat-group .chat-item+.contact-item,.chat-group .contact-item+.contact-item,.contact-group .chat-item+.chat-item,.contact-group .contact-item+.chat-item,.contact-group .chat-item+.contact-item,.contact-group .contact-item+.contact-item{margin-top:1px}.chat-group .chat-item.unread .chat-item-body h6,.chat-group .chat-item.unread .contact-item-body h6,.chat-group .unread.contact-item .chat-item-body h6,.chat-group .unread.contact-item .contact-item-body h6,.contact-group .chat-item.unread .chat-item-body h6,.contact-group .chat-item.unread .contact-item-body h6,.contact-group .unread.contact-item .chat-item-body h6,.contact-group .unread.contact-item .contact-item-body h6,.chat-group .chat-item.unread .chat-item-body .h6,.chat-group .chat-item.unread .contact-item-body .h6,.chat-group .unread.contact-item .chat-item-body .h6,.chat-group .unread.contact-item .contact-item-body .h6,.contact-group .chat-item.unread .chat-item-body .h6,.contact-group .chat-item.unread .contact-item-body .h6,.contact-group .unread.contact-item .chat-item-body .h6,.contact-group .unread.contact-item .contact-item-body .h6{font-weight:600;position:relative;letter-spacing:-0.2px}.chat-group .chat-item.unread .chat-item-body h6::after,.chat-group .chat-item.unread .contact-item-body h6::after,.chat-group .unread.contact-item .chat-item-body h6::after,.chat-group .unread.contact-item .contact-item-body h6::after,.contact-group .chat-item.unread .chat-item-body h6::after,.contact-group .chat-item.unread .contact-item-body h6::after,.contact-group .unread.contact-item .chat-item-body h6::after,.contact-group .unread.contact-item .contact-item-body h6::after,.chat-group .chat-item.unread .chat-item-body .h6::after,.chat-group .chat-item.unread .contact-item-body .h6::after,.chat-group .unread.contact-item .chat-item-body .h6::after,.chat-group .unread.contact-item .contact-item-body .h6::after,.contact-group .chat-item.unread .chat-item-body .h6::after,.contact-group .chat-item.unread .contact-item-body .h6::after,.contact-group .unread.contact-item .chat-item-body .h6::after,.contact-group .unread.contact-item .contact-item-body .h6::after{content:"";position:absolute;top:calc(50% - 2px);right:-12px;width:6px;height:6px;background-color:#506fd9;border-radius:100%}.chat-group .chat-item.unread .chat-item-body span,.chat-group .chat-item.unread .contact-item-body span,.chat-group .unread.contact-item .chat-item-body span,.chat-group .unread.contact-item .contact-item-body span,.contact-group .chat-item.unread .chat-item-body span,.contact-group .chat-item.unread .contact-item-body span,.contact-group .unread.contact-item .chat-item-body span,.contact-group .unread.contact-item .contact-item-body span{font-weight:500;color:#506fd9}.chat-group .chat-item.selected,.chat-group .selected.contact-item,.contact-group .chat-item.selected,.contact-group .selected.contact-item{background-color:rgba(80,111,217,.1)}.chat-group .chat-item.selected .avatar-initial,.chat-group .selected.contact-item .avatar-initial,.contact-group .chat-item.selected .avatar-initial,.contact-group .selected.contact-item .avatar-initial{background-color:#506fd9;color:#fff}.chat-group .chat-item.selected .chat-item-body h6,.chat-group .chat-item.selected .contact-item-body h6,.chat-group .selected.contact-item .chat-item-body h6,.chat-group .selected.contact-item .contact-item-body h6,.contact-group .chat-item.selected .chat-item-body h6,.contact-group .chat-item.selected .contact-item-body h6,.contact-group .selected.contact-item .chat-item-body h6,.contact-group .selected.contact-item .contact-item-body h6,.chat-group .chat-item.selected .chat-item-body .h6,.chat-group .chat-item.selected .contact-item-body .h6,.chat-group .selected.contact-item .chat-item-body .h6,.chat-group .selected.contact-item .contact-item-body .h6,.contact-group .chat-item.selected .chat-item-body .h6,.contact-group .chat-item.selected .contact-item-body .h6,.contact-group .selected.contact-item .chat-item-body .h6,.contact-group .selected.contact-item .contact-item-body .h6{color:#506fd9}.chat-group .avatar-initial,.contact-group .avatar-initial{background-color:#ccd2da;color:#41505f}.chat-group .chat-item-body,.chat-group .contact-item-body,.contact-group .chat-item-body,.contact-group .contact-item-body{padding-left:10px;flex:1;width:calc(100% - 46px)}.chat-group .chat-item-body h6,.chat-group .contact-item-body h6,.contact-group .chat-item-body h6,.contact-group .contact-item-body h6,.chat-group .chat-item-body .h6,.chat-group .contact-item-body .h6,.contact-group .chat-item-body .h6,.contact-group .contact-item-body .h6{color:#212830;margin-bottom:2px}.chat-group .chat-item-body span,.chat-group .contact-item-body span,.contact-group .chat-item-body span,.contact-group .contact-item-body span{display:block;font-size:.75rem;color:#6e7985;width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-group .chat-item-body strong,.chat-group .contact-item-body strong,.contact-group .chat-item-body strong,.contact-group .contact-item-body strong{font-weight:600}.chat-group .chat-item-body small,.chat-group .contact-item-body small,.contact-group .chat-item-body small,.contact-group .contact-item-body small,.chat-group .chat-item-body .small,.chat-group .contact-item-body .small,.contact-group .chat-item-body .small,.contact-group .contact-item-body .small{font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985}.chat-body{height:100%;display:none;border-top-right-radius:inherit;border-bottom-right-radius:inherit}@media(min-width: 768px){.chat-body{display:block;margin-left:280px}}@media(min-width: 1200px){.chat-body{margin-left:300px}}.chat-body .nav-icon{align-items:center}.chat-body .nav-icon .nav-link{padding:0;color:#6e7985;font-size:18px;line-height:1;transition:all .25s}@media(prefers-reduced-motion: reduce){.chat-body .nav-icon .nav-link{transition:none}}.chat-body .nav-icon .nav-link:hover,.chat-body .nav-icon .nav-link:focus{color:#506fd9;transform:scale(1.1)}.chat-body .nav-icon .nav-link+.nav-link{margin-left:10px}.chat-body .nav-icon .ri-close-fill{font-size:24px}.chat-body-header,.chat-body-footer{background-color:#fff;height:60px;display:flex;align-items:center;padding:0 15px}.chat-body-header{border-bottom:1px solid rgba(226,229,236,.6);border-top-right-radius:inherit}.chat-body-footer{border-top:1px solid rgba(226,229,236,.6);border-bottom-right-radius:inherit}.chat-body-header .chat-item,.chat-body-header .contact-item{display:flex;align-items:center}.chat-body-header .avatar{margin-right:10px}@media(min-width: 992px){.chat-body-header .avatar{width:40px;height:40px}}.chat-body-header .chat-item-body h6,.chat-body-header .contact-item-body h6,.chat-body-header .chat-item-body .h6,.chat-body-header .contact-item-body .h6{font-weight:600;color:#212830}.chat-body-header .chat-item-body span,.chat-body-header .contact-item-body span{display:block;color:#6e7985;font-size:12px}.chat-body-footer .nav-icon .nav-link+.nav-link{margin-left:5px}.chat-body-content{height:calc(100% - 120px);padding:15px;position:relative;overflow:hidden}.chat-body-content .nav-icon{display:none}.chat-body-content .divider:first-child{margin-top:0}.msg-box{flex:1;margin:0 15px;display:flex;align-items:center;position:relative}.msg-box .form-control,.msg-box .gridjs-input{background-color:#f3f5f9;border-color:rgba(0,0,0,0);border-radius:4px;padding-right:24px;transition:none}.msg-box .form-control:focus,.msg-box .gridjs-input:focus{box-shadow:none;border-color:#e2e5ec;background-color:#fff}.msg-send{display:block;font-size:18px;color:#6e7985;position:absolute;top:5px;right:8px}.msg-item{display:flex}.msg-item+.msg-item{margin-top:20px}.msg-item.reverse{flex-direction:row-reverse}.msg-item.reverse .msg-body{align-items:flex-end}.msg-item.reverse .row{flex-direction:row-reverse}.msg-item.reverse .msg-bubble{background-color:#506fd9;color:#fff}.msg-item.reverse .msg-bubble span{color:rgba(255,255,255,.6)}.msg-item.reverse+.reverse{margin-top:5px}.msg-item .avatar{margin-right:10px;flex-shrink:0}.msg-item .msg-body{position:relative;flex:1;display:flex;flex-direction:column}.msg-item .row{align-items:center;flex-wrap:nowrap;max-width:calc(100% - 46px)}.msg-item .row+.row{margin-top:5px}.msg-item .row.nav-show .nav-icon{display:flex}.msg-item .nav-icon .nav-link{font-size:18px}.msg-item .nav-icon .nav-link+.nav-link{margin-left:5px}.msg-bubble{padding:12px 15px;background-color:#f3f5f9;border-radius:6px;line-height:1.42}.msg-bubble span{display:block;margin-top:5px;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#9ea7b1;text-align:right}.contact-panel{position:relative;height:calc(100vh - 145px);display:flex}@media(min-width: 992px){.contact-panel{height:calc(100vh - 155px)}}@media(max-width: 1199.98px){.contact-panel.sidebar-show{overflow:hidden}.contact-panel.sidebar-show .contact-sidebar{left:0;opacity:1;visibility:visible}.contact-panel.sidebar-show .contact-body{transform:translateX(226px)}}@media(max-width: 767.98px){.contact-panel.contact-show .contact-list{display:none}.contact-panel.contact-show .contact-content{display:block}}.contact-sidebar{width:210px;height:100%;position:absolute;top:0;left:-234px;overflow:hidden;opacity:0;visibility:hidden;flex-shrink:0;transition:all .25s}@media(prefers-reduced-motion: reduce){.contact-sidebar{transition:none}}@media(min-width: 1200px){.contact-sidebar{position:relative;display:block;padding-right:12px;margin-right:12px;opacity:1;visibility:visible;left:0}}.contact-sidebar .nav-sidebar .nav-link{padding-left:10px;padding-right:10px;border-radius:4px}.contact-sidebar .nav-sidebar .nav-link:hover{background-color:#f3f5f9}.contact-sidebar .nav-sidebar .nav-link.active{background-color:rgba(80,111,217,.08)}.contact-sidebar .nav-sidebar .nav-link+.nav-link{margin-top:1px}.contact-sidebar .nav-sidebar .nav-link small,.contact-sidebar .nav-sidebar .nav-link .small{margin-left:auto;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:12px;font-weight:400;color:#9ea7b1}.contact-sidebar hr{opacity:.1}.btn-contact-new{width:100%;display:flex;align-items:center;justify-content:center}.btn-contact-new i{font-size:16px;line-height:1.2;margin-right:2px;margin-top:.5px}.contact-body{flex:1;height:100%;background-color:#fff;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07);border-radius:6px;position:relative;transition:all .25s}@media(prefers-reduced-motion: reduce){.contact-body{transition:none}}.contact-list{width:100%;position:absolute;top:0;left:0;bottom:0}@media(min-width: 768px){.contact-list{width:280px;border-right:1px solid rgba(226,229,236,.6)}}.contact-list-header{height:60px;background-color:#fff;border-top-left-radius:6px;border-top-right-radius:inherit;padding-left:15px;padding-right:15px;border-bottom:1px solid rgba(226,229,236,.6);display:flex;align-items:center}@media(min-width: 1200px){.contact-list-header{padding-left:20px}}.contact-list-header .sidebar-title{font-size:16px;font-weight:600;color:#212830;margin-bottom:0}.contact-menu{display:flex;align-items:center;font-size:21px;margin-right:10px;color:#6e7985}.contact-list-body{height:calc(100% - 60px);padding:10px;position:relative;overflow:hidden}.contact-list-body .sidebar-label:first-child{margin-top:5px}.contact-item{position:relative}.contact-item:hover .nav-icon,.contact-item:focus .nav-icon{display:flex}.contact-item .nav-icon{position:absolute;right:10px;display:none}.contact-item .nav-link{font-size:16px;color:#9ea7b1;padding:0}.contact-item .nav-link+.nav-link{margin-left:5px}.contact-item .nav-link:hover{color:#41505f}.contact-item-body span{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:.8125rem}.contact-content{display:none;height:100%;overflow:hidden;position:relative;padding:20px}@media(min-width: 768px){.contact-content{margin-left:280px;display:block}}.contact-content .avatar{width:100px;height:100px}.contact-content .avatar-initial{font-size:52px;font-weight:300}.contact-content hr{opacity:.12}.contact-close{position:absolute;top:10px;right:10px;font-size:24px;color:#6e7985}.contact-close:hover{color:#41505f}@media(min-width: 768px){.contact-close{display:none}}.main-calendar{min-height:inherit;height:calc(100vh - 72px);margin-top:72px;position:relative}@media(max-width: 1199.98px){.main-calendar.show .calendar-sidebar{left:0}.main-calendar.show .calendar-body{transform:translateX(300px);padding-left:0}}.calendar-sidebar{position:absolute;top:0;left:-300px;bottom:0;width:300px;transition:all .25s}@media(prefers-reduced-motion: reduce){.calendar-sidebar{transition:none}}@media(min-width: 1200px){.calendar-sidebar{left:0}}.calendar-sidebar .sidebar-header{height:86px;border-bottom-width:0}.calendar-sidebar .form-search{width:100%}.calendar-sidebar .sidebar-body{height:100%;padding:20px;position:relative;overflow:hidden}.calendar-sidebar .sidebar-body .mutual-badge ul .avatar{width:20px;height:20px}.calendar-sidebar .sidebar-body .event-body h6,.calendar-sidebar .sidebar-body .event-body .h6{margin-bottom:5px}.calendar-sidebar .sidebar-body .event-body h6 a,.calendar-sidebar .sidebar-body .event-body .h6 a{color:#212830}.calendar-sidebar .sidebar-body .event-body h6 a:hover,.calendar-sidebar .sidebar-body .event-body .h6 a:hover{color:#506fd9}.calendar-sidebar .ui-datepicker .ui-datepicker-calendar th{padding-left:6px;padding-right:6px}@media(min-width: 1200px){.calendar-sidebar .ui-datepicker .ui-datepicker-calendar th{padding-left:9px;padding-right:9px}}.calendar-sidebar .ui-datepicker .ui-datepicker-calendar td a{padding-left:0}@media(min-width: 1200px){.calendar-sidebar .ui-datepicker .ui-datepicker-calendar td a{padding-left:6px}}.nav-calendar{flex-direction:column}.nav-calendar .nav-link{padding:0;display:flex;align-items:center;color:#41505f}.nav-calendar .nav-link+.nav-link{margin-top:10px}.nav-calendar .nav-link.calendar span{background-color:#506fd9;box-shadow:0 0 0 2px #506fd9}.nav-calendar .nav-link.birthday span{background-color:#0cb785;box-shadow:0 0 0 2px #0cb785}.nav-calendar .nav-link.holiday span{background-color:#dc3545;box-shadow:0 0 0 2px #dc3545}.nav-calendar .nav-link.discover span{background-color:#0dcaf0;box-shadow:0 0 0 2px #0dcaf0}.nav-calendar .nav-link.meetup span{background-color:#ffc107;box-shadow:0 0 0 2px #ffc107}.nav-calendar .nav-link.other span{background-color:#6f42c1;box-shadow:0 0 0 2px #6f42c1}.nav-calendar span{width:10px;height:10px;border-radius:100%;border:2px solid #fff;margin-right:10px}.calendar-body{position:absolute;top:0;right:0;bottom:0;left:0;padding:20px;transition:all .25s}@media(prefers-reduced-motion: reduce){.calendar-body{transition:none}}@media(min-width: 1200px){.calendar-body{left:300px;padding-left:0}}.calendar-body .fc-toolbar-chunk{display:flex}.calendar-body .fc-header-toolbar{display:block}@media(min-width: 768px){.calendar-body .fc-header-toolbar{display:flex}}.calendar-body .fc-header-toolbar .fc-toolbar-chunk:first-child{justify-content:space-between;margin-bottom:15px}@media(min-width: 768px){.calendar-body .fc-header-toolbar .fc-toolbar-chunk:first-child{margin-bottom:0}}.calendar-body .fc-header-toolbar .fc-toolbar-chunk:nth-child(2){float:left;margin-top:7px}@media(min-width: 576px){.calendar-body .fc-header-toolbar .fc-toolbar-chunk:nth-child(2){margin-top:5px}}@media(min-width: 768px){.calendar-body .fc-header-toolbar .fc-toolbar-chunk:nth-child(2){float:none;margin-top:0}}.calendar-body .fc-header-toolbar .fc-toolbar-chunk:last-child{float:right}@media(min-width: 768px){.calendar-body .fc-header-toolbar .fc-toolbar-chunk:last-child{float:none}}.calendar-body .fc-button{display:flex;align-items:center;text-transform:capitalize;height:36px;padding-left:12px;padding-right:12px}.calendar-body .fc-custom1-button{padding-left:6.5px;padding-right:6.5px}@media(min-width: 1200px){.calendar-body .fc-custom1-button{display:none}.calendar-body .fc-custom1-button+.fc-button-group{margin-left:0}}.calendar-body .fc-custom1-button .fc-icon::before{content:"";font-family:"remixicon"}.calendar-body .fc-prev-button,.calendar-body .fc-next-button{width:36px;height:36px;justify-content:center;padding:0}.calendar-body .fc-icon{line-height:1;padding-left:0;padding-right:0}.calendar-body .fc-button-primary{background-color:#fff;color:#6e7985;border-color:#e2e5ec}.calendar-body .fc-button-primary:hover,.calendar-body .fc-button-primary:focus,.calendar-body .fc-button-primary:active{background-color:#fff;color:#6e7985;border-color:#d3d7e2;box-shadow:none}.calendar-body .fc-button-primary:disabled{background-color:#fff;color:#6e7985;border-color:#e2e5ec}.calendar-body .fc-button-primary:not(:disabled).fc-button-active,.calendar-body .fc-button-primary:not(:disabled):active{background-color:rgba(80,111,217,.1);color:#506fd9;border-color:#7a91e2;position:relative;z-index:5}.calendar-body .fc-button-primary:not(:disabled).fc-button-active:focus,.calendar-body .fc-button-primary:not(:disabled):active:focus{box-shadow:none}.calendar-body .fc-toolbar-title{font-weight:600;font-size:18px;color:#212830;letter-spacing:-0.2px;max-width:140px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(min-width: 576px){.calendar-body .fc-toolbar-title{font-size:22px;max-width:none;overflow:inherit;text-overflow:inherit}}.calendar-body .fc-scrollgrid{border-color:#e2e5ec;background-color:#fff}.calendar-body .fc-col-header th{border-color:#e2e5ec;font-size:12px;padding-top:5px;padding-bottom:5px}.calendar-body .fc-col-header th a{color:#41505f;font-weight:600;text-transform:uppercase}.calendar-body .fc-daygrid-day{border-color:#e2e5ec}.calendar-body .fc-daygrid-day-number{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#41505f;padding:5px 8px}.calendar-body .fc-h-event .fc-event-main{color:#41505f}.calendar-body .fc-daygrid-block-event .fc-event-time,.calendar-body .fc-daygrid-block-event .fc-event-title{padding-left:5px}.calendar-body .fc-daygrid-dot-event .fc-event-title{color:#41505f;font-weight:500}.calendar-body .fc-daygrid-event{color:#6e7985;border-radius:2px}.calendar-body .fc-daygrid-event:hover{background-color:#e2e5ec}.calendar-body .fc-daygrid-day.fc-day-today{background-color:rgba(80,111,217,.08)}.calendar-body .fc-daygrid-day.fc-day-today .fc-daygrid-day-number{color:#506fd9}.calendar-body .fc-event-title{cursor:pointer}.modal-event .modal-header{padding:15px 20px 0;border-bottom-width:0}.modal-event .modal-header .btn-close{transform:scale(0.9)}.modal-event .modal-header .btn-close:focus{box-shadow:none}.modal-event .modal-title{font-size:18px;font-weight:600;color:#212830}.modal-event .modal-body{padding:20px;position:relative}.modal-event .modal-footer{padding:0 20px 20px;border-top-width:0}.modal-event .form-label{color:#6e7985;margin-bottom:5px;font-size:13px}.modal-event .date-item{display:flex;align-items:center}.modal-event .date-item i{font-size:18px;line-height:1;margin-right:5px;opacity:.75}.modal-event .date-item+.date-item{margin-top:10px}.modal-event .date-item span{font-weight:500;color:#212830}.modal-event p{color:#212830}@media(min-width: 1200px)and (max-width: 1399.98px){.app-task .sidebar-right{width:270px}}.task-label{display:block;margin-bottom:0;font-size:.75rem;font-weight:600;font-family:"Archivo",sans-serif;text-transform:uppercase;letter-spacing:.5px}.dropdown-task .dropdown-link{font-size:.75rem;display:flex;align-items:center;color:#6e7985}.dropdown-task .dropdown-link:hover{color:#506fd9}.dropdown-task .dropdown-link i{font-size:16px;line-height:1;margin-top:2px}.card-task{border-width:0;border-radius:6px;cursor:pointer;border:1px solid rgba(0,0,0,0);box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07);transition:all .25s}@media(prefers-reduced-motion: reduce){.card-task{transition:none}}.card-task:hover{border-color:#ccd2da}.card-task+.card-task{margin-top:12px}.card-task .badge{font-size:10px}.card-task .card-date{font-size:.75rem;color:#6e7985;white-space:nowrap;align-self:flex-start}.card-task p{color:#6e7985}.card-task .card-title{margin-bottom:0;font-weight:600;color:#212830}.card-task .progress{height:4px}.card-task .card-footer{padding-top:0;border-top-width:0;background-color:rgba(0,0,0,0);display:flex;align-items:center;justify-content:space-between}.card-task .card-footer .avatar{width:18px;height:18px}.card-task .card-footer .nav-link{color:#9ea7b1;display:flex;align-items:center;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";padding:0;grid-gap:2px}.card-task .card-footer .nav-link:hover{color:#506fd9}.card-task .card-footer .nav-link i{font-size:14px}.card-task .card-footer .nav-link+.nav-link{margin-left:10px}.task-calendar .ui-datepicker-inline{max-width:none;border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.task-calendar .ui-datepicker .ui-datepicker-calendar{width:100%}@media(min-width: 1200px)and (max-width: 1399.98px){.task-calendar .ui-datepicker .ui-datepicker-calendar th{padding-left:12px;padding-right:4px;text-align:right}}.task-calendar .ui-datepicker .ui-datepicker-calendar td{border-color:#e2e5ec}.task-calendar .ui-datepicker .ui-datepicker-calendar td:last-child{border-right:1px solid #e2e5ec}.task-calendar .ui-datepicker .ui-datepicker-calendar td a{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:.8125rem}@media(min-width: 1200px)and (max-width: 1399.98px){.task-calendar .ui-datepicker .ui-datepicker-calendar td a{padding-left:0;padding-right:6px}}.task-calendar .ui-datepicker .ui-datepicker-calendar td a:hover{background-color:#f3f5f9}.task-calendar .ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a{background-color:rgba(0,0,0,0);color:#506fd9}.task-calendar .ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a:hover{background-color:#f3f5f9;color:#506fd9}.task-category{color:#fff;border-radius:6px}.task-category .category-percent{font-weight:500;font-family:"Inter",sans-serif}.task-category .category-percent span{font-size:70%;font-weight:400}.task-category>span{display:block;font-size:.8125rem;opacity:.65}@media(max-width: 1199.98px){.app-music.sideright-show .sidebar-right{right:0;opacity:1;visibility:visible}.app-music.sideright-show .main-backdrop{opacity:1;visibility:visible}}.app-music .sidebar-right{width:300px;position:fixed;top:0;right:-300px;bottom:0;background-color:#fff;padding:20px;opacity:0;visibility:hidden;z-index:1000;overflow-y:auto;transition:all .25s}@media(prefers-reduced-motion: reduce){.app-music .sidebar-right{transition:none}}@media(min-width: 1200px){.app-music .sidebar-right{width:260px;position:static;background-color:rgba(0,0,0,0);padding:0;opacity:1;visibility:visible;z-index:auto;overflow-y:inherit}}.app-music .sidebar-right .nav-link{color:#41505f;padding:8px 0}.app-music .sidebar-right .nav-link:hover{color:#506fd9}.app-music .sidebar-right .nav-link:hover i{color:inherit}.app-music .sidebar-right .nav-link .badge{padding:0}.app-music .main-label-group label{font-size:15px;font-weight:600;color:#212830;letter-spacing:-0.2px}.app-music .main-label-group a{font-size:.8125rem}.app-music .row-wrapper{overflow-x:auto}@media(min-width: 768px){.app-music .row-wrapper{overflow:inherit}}.app-music .row-wrapper>.row{width:640px}@media(min-width: 768px){.app-music .row-wrapper>.row{width:auto}}.music-headline{position:relative;height:260px;overflow:hidden;border-radius:6px}.music-headline:hover img{transform:scale(1.05)}.music-headline img{width:100%;height:100%;object-fit:cover;transition:all .25s}@media(prefers-reduced-motion: reduce){.music-headline img{transition:none}}.music-headline>div{position:absolute;left:20px;right:20px;bottom:20px;color:rgba(255,255,255,.75);text-shadow:1px 1px 2px rgba(33,40,48,.4)}@media(min-width: 992px){.music-headline>div{width:80%;left:25px;bottom:25px;right:auto}}@media(min-width: 1200px){.music-headline>div{width:50%}}.music-headline label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1px}.music-headline h2,.music-headline .h2{color:#fff;font-weight:600}.music-headline .btn-icon{font-size:32px;width:48px;height:48px;border-radius:100%;border-width:1.5px}.music-item{position:relative}.music-item span{font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985;display:block}.music-thumb{display:block;overflow:hidden;border-radius:6px}.music-thumb:hover img{transform:scale(1.1)}.music-thumb img{transition:all .25s}@media(prefers-reduced-motion: reduce){.music-thumb img{transition:none}}.music-title{margin-bottom:5px;font-weight:600}.music-title a{color:#212830}.music-title a:hover{color:#506fd9}.music-text{font-size:.75rem;margin-bottom:10px}.music-text-sm{font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985;display:block}.card-album{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}@media(min-width: 768px){.card-album{width:230px}}.card-album label{font-size:10px;font-family:"Archivo",sans-serif;text-transform:uppercase;letter-spacing:1px;color:#6e7985;margin-bottom:3px}.card-album .music-title{font-size:15px;margin-bottom:7px}.card-album .music-text{font-size:.8125rem}.media-music{display:flex;align-items:center}.media-music+.media-music{margin-top:15px}.media-music .media-img{display:block;width:56px;height:56px;overflow:hidden;border-radius:4px;flex-shrink:0;margin-right:12px}.media-music .media-img img{width:100%;height:100%;object-fit:cover}.media-music h6,.media-music .h6{font-weight:600;margin-bottom:4px}.media-music h6 a,.media-music .h6 a{color:#212830}.media-music h6 a:hover,.media-music .h6 a:hover{color:#506fd9}.media-music p{font-size:.75rem;color:#506fd9;margin-bottom:5px}.media-music span{display:block;font-size:.8125rem;color:#6e7985;line-height:1.4}.table-music{border-collapse:separate;border-spacing:0 8px;margin-top:-8px}.table-music tbody tr{border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.table-music tbody tr:hover td{border-color:#506fd9}.table-music tbody td{vertical-align:middle;padding-top:8px;padding-bottom:8px;border:1px solid rgba(0,0,0,0);background-color:#fff}.table-music tbody td:not(:first-child){border-left-width:0}.table-music tbody td:not(:last-child){border-right-width:0}.table-music tbody td:first-child{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985;border-top-left-radius:6px;border-bottom-left-radius:6px;padding-left:15px}.table-music tbody td:last-child{border-top-right-radius:6px;border-bottom-right-radius:6px}.table-music img{width:100%;height:100%;object-fit:cover;border-radius:4px;max-width:30px}.table-music a{display:block;font-weight:600;line-height:1.4;color:#212830}.table-music a:hover{color:#506fd9}.table-music small,.table-music .small{display:block;font-size:11px;color:#6e7985}.table-music .time{font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985}.table-music .dropdown-link{display:inline-block;font-size:16px;color:#6e7985;margin-top:2px}.table-music .media-music .media-img{width:36px;height:36px;flex-shrink:0}.table-music .media-music .media-img img{max-width:none}.table-music .media-music h6,.table-music .media-music .h6{margin-bottom:0}.table-music .media-music span{font-size:.75rem}.music-player{background-color:#fff;padding:10px 15px;display:flex;align-items:center;border-radius:6px;box-shadow:0 1px 2px rgba(158,167,177,.07),0 2px 4px rgba(158,167,177,.07),0 4px 8px rgba(158,167,177,.07),0 8px 16px rgba(158,167,177,.07),0 16px 32px rgba(158,167,177,.07),0 32px 64px rgba(158,167,177,.07)}.music-player .media-music .media-img{width:48px;height:48px;margin-right:0}@media(min-width: 992px){.music-player .media-music .media-img{margin-right:12px}}.music-player .media-music .media-body{display:none}@media(min-width: 992px){.music-player .media-music .media-body{display:block}}.music-player .media-music h6,.music-player .media-music .h6{font-size:.8125rem}.music-player .media-music span{font-size:.75rem}.music-range{display:flex;align-items:center;margin-bottom:5px}.music-range .progress{margin-bottom:0;margin-left:8px;margin-right:8px;height:5px;flex:1;background-color:#e2e5ec}.music-range>span{font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#6e7985}.nav-player{align-items:center}.nav-player .nav-link{padding:0;font-size:14px;line-height:1;color:#41505f}@media(min-width: 992px){.nav-player .nav-link{font-size:16px}}.nav-player .nav-link+.nav-link{margin-left:5px}@media(min-width: 992px){.nav-player .nav-link+.nav-link{margin-left:10px}}.nav-player .nav-link.lg{font-size:20px}.nav-player .nav-link.play{width:36px;height:36px;border-radius:100%;display:flex;align-items:center;justify-content:center;background-color:#506fd9;color:#fff}.nav-player .nav-link.play i{display:block}.nav-player .nav-link.play:hover{background-color:#4868d7}.music-volume{display:flex;align-items:center;margin-left:10px}@media(min-width: 576px){.music-volume{width:80px}}.music-volume a{font-size:16px;color:#41505f;margin-right:5px}.music-volume .progress{flex:1;height:3px;display:none;background-color:#e2e5ec}@media(min-width: 576px){.music-volume .progress{display:flex}}.app-video .btn-upload{text-transform:uppercase;letter-spacing:1px;font-family:"Archivo",sans-serif;font-size:11px;font-weight:500;height:36px;display:flex;align-items:center;padding-left:10px;padding-right:10px;border-width:1.5px;grid-gap:5px}@media(min-width: 992px){.app-video .btn-upload{padding-left:15px;padding-right:15px}}.app-video .btn-upload i{font-size:14px}.app-video .carousel{border-radius:6px;overflow:hidden}.app-video .carousel-control-prev,.app-video .carousel-control-next{width:auto;top:auto;bottom:25px}.app-video .carousel-control-prev{left:auto;right:60px}.app-video .carousel-control-next{right:20px}.app-video .main-label-group label{font-size:15px;font-weight:600;color:#212830}.app-video .row-wrapper{margin-left:-20px;margin-right:-5px;overflow-x:auto;padding:0 20px 20px}@media(min-width: 1200px){.app-video .row-wrapper{overflow:inherit;margin-left:0;margin-right:0;padding:0}}.app-video .row-wrapper>.row{width:900px}@media(min-width: 1200px){.app-video .row-wrapper>.row{width:auto}}.video-headline{height:420px;position:relative;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.video-headline img{width:100%;height:100%;object-fit:cover}.video-headline-body{position:absolute;bottom:0;left:0;right:0;color:#fff;text-shadow:1px 1px 4px rgba(33,40,48,.6);background-image:linear-gradient(to bottom, rgba(12, 15, 18, 0), #0c0f12)}@media(min-width: 768px){.video-headline-body>div{width:75%}}@media(min-width: 1200px){.video-headline-body>div{width:50%}}.video-headline-body .video-title{font-weight:400;color:inherit}.video-headline-body label{display:block;font-size:.8125rem;margin-bottom:5px;opacity:.75}.video-headline-body h3,.video-headline-body .h3{margin-bottom:0;font-weight:400;font-family:"Inter",sans-serif}.video-headline-body .btn-icon{font-size:32px;width:48px;height:48px;border-radius:100%;border-width:1.5px}.card-video{border-radius:6px;border-width:0;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-video .card-title{font-weight:600}.card-video .card-title a{color:#212830}.card-video .card-title a:hover{color:#506fd9}.video-player{position:relative;height:200px}@media(min-width: 576px){.video-player{height:260px}}@media(min-width: 768px){.video-player{height:320px}}@media(min-width: 1200px){.video-player{height:280px}}.video-player .progress{position:absolute;bottom:42px;left:0;right:0;height:3px;border-radius:0}.video-player .nav{position:absolute;bottom:0;left:0;right:0;align-items:center;padding:10px;background-color:rgba(33,40,48,.16)}@media(min-width: 576px){.video-player .nav{padding:10px 15px}}.video-player .nav-link{padding:0;color:rgba(255,255,255,.75);display:block;line-height:1;font-size:.75rem}.video-player .nav-link:hover{color:#fff}.video-player .nav-link i{font-size:21px;position:relative;top:1px}.video-player .nav-link+.nav-link{margin-left:10px}.video-player-img{width:100%;height:100%;object-fit:cover;border-radius:4px}.card-movie{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-movie img{border-radius:4px;width:100%;height:200px;object-fit:cover}@media(min-width: 576px){.card-movie img{height:100%}}.card-movie .card-label{display:block;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:#506fd9;margin-bottom:3px}.card-movie .card-title{font-size:16px;font-weight:600}.card-movie .card-title a{color:#212830}.card-movie .card-title a:hover{color:#506fd9}.card-video-item{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-video-item .card-title{width:100%;margin-bottom:2px;font-weight:600}.card-video-item .card-title a{color:#212830}.card-video-item .card-author{font-size:.8125rem}.card-video-item .card-text{margin-top:10px;font-size:.75rem;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";display:flex;align-items:center;grid-gap:10px;color:#6e7985}.card-poster{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-poster img{width:100%;height:100%;object-fit:cover;border-radius:inherit}@media(min-width: 576px){.media-profile{display:flex}}.media-profile .media-img{flex-shrink:0;width:150px;margin-right:25px;border-radius:100%}.media-profile .media-img img{border-radius:inherit}.media-profile .media-body{flex:1;position:relative;line-height:1.55}.media-profile .media-name{font-size:24px;font-weight:600;color:#212830;margin-bottom:3px}.profile-item{display:flex;align-items:center}.profile-item>i{font-size:32px;line-height:1;margin-right:12px;color:#9ea7b1}.profile-item-body p{font-weight:600;color:#212830;margin-bottom:2px}.profile-item-body span{color:#6e7985;font-size:.8125rem;display:block}.post-bar{height:54px;border-radius:6px;background-color:#fff;display:flex;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.post-bar-item{width:40px;height:100%;display:flex;align-items:center;justify-content:center}@media(min-width: 576px){.post-bar-item{width:54px}}.post-bar-item+.post-bar-item{border-left:1px solid #f3f5f9}.post-bar-item a{color:#6e7985;display:block;transition:all .25s}@media(prefers-reduced-motion: reduce){.post-bar-item a{transition:none}}.post-bar-item a:hover{color:#506fd9}.post-bar-item i{font-size:18px;line-height:1}@media(min-width: 576px){.post-bar-item i{font-size:20px}}.post-bar-item:first-child{flex:1;width:auto;justify-content:flex-start;padding:0 20px}.post-bar-item:first-child a:hover{color:#212830}.card-post{position:relative;border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-post .card-header{padding:18px 20px;background-color:rgba(0,0,0,0);display:flex;align-items:center;justify-content:space-between;border-bottom-color:#f3f5f9}.card-post .card-title{font-size:15px;font-weight:600;margin-bottom:0;color:#212830}.card-post .link-more{font-size:18px;line-height:.7;color:#9ea7b1;position:relative;top:1px;right:-3px}.card-post .link-more:hover{color:#6e7985}.card-post .card-body{padding:20px;line-height:1.55}.card-post .card-footer{padding:10px;background-color:rgba(0,0,0,0);border-top-color:#f3f5f9}.card-post .card-footer .nav-link{display:flex;align-items:center;color:#6e7985;padding-left:10px;border-radius:4px}.card-post .card-footer .nav-link:hover{background-color:rgba(80,111,217,.05);color:#506fd9}.card-post .card-footer .nav-link i{font-size:20px;margin-right:3px;line-height:1}.post-header{display:flex;align-items:center}.post-header .avatar{margin-right:10px}.post-content h6,.post-content .h6{color:#212830;font-weight:600;margin-bottom:2px}.post-content span{display:block;font-size:.8125rem;color:#6e7985}.post-date{display:block;margin-left:auto;font-size:.8125rem;align-self:flex-start;line-height:1.2;color:#6e7985}.post-preview{padding:15px;background-color:#f8f9fc}.post-preview h5,.post-preview .h5{font-size:.938rem;font-weight:600;color:#212830;margin-bottom:5px;letter-spacing:-0.5px}.post-preview p{color:#313c47;margin-bottom:2px}.post-preview span{display:block;font-size:.8125rem;color:#6e7985}.experience-item{position:relative}@media(min-width: 576px){.experience-item{display:flex}}.experience-icon{width:100px;height:100px;display:flex;align-items:center;justify-content:center;font-size:48px;background-color:#e2e5ec;color:#9ea7b1;margin-bottom:20px;border-radius:6px}@media(min-width: 576px){.experience-icon{margin-bottom:0;margin-right:20px}}.experience-body{flex:1}.experience-body h5,.experience-body .h5{font-size:.938rem;font-weight:600;color:#212830;margin-bottom:5px}.experience-body p{margin-bottom:2px}.experience-body p:last-of-type{margin-bottom:0;font-size:.8125rem;color:#6e7985}.experience-body ul{margin:0;padding-left:13px}.profile-mutual h6,.profile-mutual .h6{color:#212830;font-weight:600;margin-bottom:5px}.profile-mutual p{margin-bottom:0;font-size:.8125rem;color:#6e7985}.interest-item{display:flex;position:relative}.interest-item+.interest-item{margin-top:20px}.interest-icon{width:64px;height:64px;display:flex;align-items:center;justify-content:center;background-color:#f8f9fc;margin-right:15px;flex-shrink:0;color:#fff;font-size:48px;border-radius:6px}.interest-body h6,.interest-body .h6{margin-bottom:3px;font-weight:600;font-size:.938rem;color:#212830}.interest-body p{margin-bottom:0}.list-contact-info{margin:0;padding:0;list-style:none}.list-contact-info li{display:flex;align-items:center;padding:8px 0}.list-contact-info li:first-child{padding-top:0}.list-contact-info li:last-child{padding-bottom:0}.list-contact-info li i{font-size:20px;line-height:1;margin-right:12px}.mutual-group{margin:0;padding:0;list-style:none;display:flex}.mutual-group li{position:relative}.mutual-group li+li{margin-left:-10px}.mutual-group .avatar{box-shadow:0 0 0 2px #fff}.people-group{margin:0;padding:0;list-style:none}.people-item{display:flex;align-items:center}.people-item+.people-item{margin-top:20px}.people-item .avatar{margin-right:12px}.people-body{flex:1}.people-body h6,.people-body .h6{margin-bottom:3px}.people-body h6 a,.people-body .h6 a{color:#212830}.people-body h6 a:hover,.people-body .h6 a:hover{color:#506fd9}.people-body span{display:block;font-size:.75rem;color:#6e7985}.card-people{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-people .card-body{padding:15px}@media(min-width: 1400px){.card-people .card-body{padding:20px}}.card-people .avatar-xl{width:84px;height:84px}.card-people .avatar-xl::after{right:10px;bottom:5px}.card-people h6,.card-people .h6{margin-bottom:2px;font-weight:600}.card-people h6 a,.card-people .h6 a{color:#212830}.card-people h6 a:hover,.card-people .h6 a:hover{color:#506fd9}.card-people p{font-size:.8125rem;color:#6e7985}.mutual-badge{display:flex;align-items:center}.mutual-badge ul{margin:0;padding:0;list-style:none;display:flex}.mutual-badge ul .avatar{display:block;width:16px;height:16px;border:1.5px solid #fff}.mutual-badge li+li{margin-left:-8px}.mutual-badge label{display:block;margin-left:5px;margin-bottom:0;font-size:11px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";color:rgba(110,121,133,.75)}.activity-group{margin:0;margin-left:15px;padding:0;list-style:none;border-left:2px solid #e2e5ec}.activity-group li+li{margin-top:30px}.activity-date{padding-left:40px;margin-bottom:10px;font-size:.75rem;font-weight:500;color:#6e7985;position:relative}.activity-date::before{content:"";position:absolute;top:7px;left:0;width:20px;border-top:2px solid #e2e5ec}.activity-item{padding-left:40px;position:relative}.activity-item strong{font-weight:600}.activity-item::before{content:"";position:absolute;top:-6px;left:-17px;width:32px;height:32px;border-radius:100%;background-color:#506fd9;color:rgba(255,255,255,.75);z-index:5;display:flex;align-items:center;justify-content:center;font-size:16px;font-family:"remixicon"}.activity-item.comment::before{content:"";background-color:#0dcaf0}.activity-item.post::before{content:""}.activity-item.like::before{content:"";background-color:#0cb785}.activity-item.search::before{content:"";background-color:#ea4c89}.activity-item .avatar{flex-shrink:0}.card-comment{border-width:0;border-radius:6px;color:#6e7985;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-comment strong{color:#41505f}.card-event{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-event .card-img-top{border-top-left-radius:6px;border-top-right-radius:6px;height:120px;object-fit:cover;transition:all .25s}@media(prefers-reduced-motion: reduce){.card-event .card-img-top{transition:none}}.card-event .card-img-top:hover{opacity:.75}.card-event .card-body{padding:20px;position:relative}.card-event h6,.card-event .h6{font-size:15px;font-weight:600;margin-bottom:2px}.card-event h6 a,.card-event .h6 a{color:#212830}.card-event h6 a:hover,.card-event .h6 a:hover{color:#506fd9}.card-event .card-footer{background-color:rgba(0,0,0,0);border-top-width:0;padding:0 20px 20px;display:flex;align-items:center;grid-gap:7px}.card-event .card-footer .btn,.card-event .card-footer .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .card-event .card-footer button,.card-event .card-footer .gridjs-pages button,.gridjs-pages .card-event .card-footer button{display:flex;align-items:center;justify-content:center;grid-gap:5px}.card-event .card-footer .btn:first-child,.card-event .card-footer .ui-datepicker-buttonpane button:first-child,.ui-datepicker-buttonpane .card-event .card-footer button:first-child,.card-event .card-footer .gridjs-pages button:first-child,.gridjs-pages .card-event .card-footer button:first-child{flex:1}.card-event .card-footer i{font-size:16px;line-height:1}.event-group{margin:0;padding:0;list-style:none}.event-item{display:flex;align-items:center}.event-item+.event-item{margin-top:20px}.event-icon{width:56px;height:56px;display:flex;align-items:center;justify-content:center;background-color:#0dcaf0;border-radius:6px;color:#fff;margin-right:10px}.event-icon i{font-size:24px;line-height:1}.event-body h6,.event-body .h6{margin-bottom:2px}.event-body h6 a,.event-body .h6 a{color:#212830}.event-body h6 a:hover,.event-body .h6 a:hover{color:#506fd9}.event-body p{font-size:.75rem;color:#6e7985;margin-bottom:5px}.card-settings{border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.card-settings .card-header{padding:20px;background-color:rgba(0,0,0,0);border-bottom-color:#f3f5f9}.card-settings .card-title{font-size:15px;font-weight:600;color:#212830;margin-bottom:5px}.card-settings .card-text{color:#6e7985;margin-bottom:0}.setting-item{padding:20px;position:relative}.setting-item+.setting-item{border-top:1px solid #f3f5f9}.setting-item h6,.setting-item .h6{margin-bottom:3px}.setting-item p{margin-bottom:0;font-size:.75rem;color:#6e7985}.setting-item .table{white-space:nowrap;font-size:.8125rem}@media(min-width: 992px){.setting-item .table{font-size:.875rem}}.setting-item .table th{padding-top:0;font-size:.8125rem}.setting-item .table td{vertical-align:middle;padding-top:8px;padding-bottom:8px}.setting-item .table th:first-child,.setting-item .table td:first-child{padding-left:0}.setting-item .table th:last-child,.setting-item .table td:last-child{padding-right:0}.setting-item .table th:not(:first-child),.setting-item .table td:not(:first-child){text-align:right}.setting-item .table>:not(:first-child),.setting-item .table th,.setting-item .table td{border-color:#f3f5f9}.setting-item .table nav{display:flex;align-items:center;justify-content:flex-end}.setting-item .table a{display:block;color:#6e7985;font-size:16px;line-height:1;opacity:.6}.setting-item .table a:hover{opacity:1;color:#506fd9}.setting-item .table a+a{margin-left:5px}.card-app{height:100%;border-color:#e2e5ec;border-radius:4px;box-shadow:0 1px 1px rgba(226,229,236,.25),0 2px 2px rgba(226,229,236,.2),0 4px 4px rgba(226,229,236,.15),0 8px 8px rgba(226,229,236,.1),0 16px 16px rgba(226,229,236,.05)}.card-app .card-body{display:flex;padding:15px}.card-app .card-logo{width:54px;height:54px;display:flex;align-items:center;justify-content:center;margin-right:15px;border-radius:4px;background-color:#6e7985;color:#fff;flex-shrink:0;font-size:32px}.card-app .card-logo.bg-disqus{background-color:#1a9fff}.card-app .card-logo.bg-dropbox{background-color:#0062ff}.card-app .card-logo.bg-evernote{background-color:#00a32c}.card-app .card-logo.bg-messenger{background-color:#fc646e}.card-app .card-footer{background-color:rgba(0,0,0,0);padding:10px 15px;display:flex;align-items:center;justify-content:space-between;font-size:.8125rem}.card-app .card-footer a{color:#9ea7b1}.card-app .card-footer a:hover{color:#506fd9}.card-app .card-footer .form-check{min-height:inherit}.card-app .card-footer .form-switch{margin-bottom:0}.card-app .card-footer .form-switch .form-check-input{margin-left:0}.page-sign{min-height:100vh;padding:40px 0;display:flex;align-items:center;justify-content:center;background-color:#fff}@media(min-width: 576px){.page-sign{background-color:#fbfcfe}}.page-sign.d-block{background-image:linear-gradient(to right, #506fd9 40%, #2747b5 100%)}.page-sign.d-block .row{min-height:inherit}.page-sign.d-block .col-wrapper{min-height:inherit;display:flex;align-items:center;justify-content:center;background-color:#fff}.page-sign.d-block .card-sign{border-radius:0;box-shadow:none}.page-sign .header-logo,.page-sign .sidebar-logo{font-size:28px}.card-sign{width:100%;border-width:0;border-radius:0}@media(min-width: 400px){.card-sign{width:380px}}@media(min-width: 576px){.card-sign{border-radius:10px;box-shadow:0 2.8px 2.2px rgba(110,121,133,.02),0 6.7px 5.3px rgba(110,121,133,.028),0 12.5px 10px rgba(110,121,133,.035),0 22.3px 17.9px rgba(110,121,133,.042),0 41.8px 33.4px rgba(110,121,133,.05),0 100px 80px rgba(110,121,133,.07)}}.card-sign .card-header{background-color:rgba(0,0,0,0);border-bottom-width:0;padding:30px 30px 0}.card-sign .card-title{letter-spacing:-0.5px;margin-bottom:8px;font-weight:400;font-size:24px;color:#212830}.card-sign .card-text{color:#6e7985;margin-bottom:0}.card-sign .card-thumb{display:block;margin-left:auto;margin-right:auto;margin-bottom:40px;width:100px;height:100px;border-radius:100%}.card-sign .card-thumb img{width:100%;height:100%;border-radius:inherit;object-fit:cover}.card-sign .card-body{padding:30px;position:relative}.card-sign .card-body small,.card-sign .card-body .small{font-size:12px;color:#6e7985;display:block}.card-sign .card-body strong{font-weight:600;color:#212830}.card-sign .form-label{font-weight:500;font-size:.8125rem;display:block}.card-sign .form-control,.card-sign .gridjs-input{font-weight:500;color:#212830;height:40px}.card-sign .form-control::placeholder,.card-sign .gridjs-input::placeholder{font-weight:400;color:rgba(110,121,133,.6);text-shadow:none}.card-sign .form-control:focus,.card-sign .gridjs-input:focus{border-color:#506fd9}.card-sign .btn,.card-sign .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .card-sign button,.card-sign .gridjs-pages button,.gridjs-pages .card-sign button{display:flex;width:100%;height:40px;align-items:center;justify-content:center;text-transform:uppercase;font-size:12px;font-family:"Archivo",sans-serif;letter-spacing:1px;color:#fff}.card-sign .btn i,.card-sign .ui-datepicker-buttonpane button i,.ui-datepicker-buttonpane .card-sign button i,.card-sign .gridjs-pages button i,.gridjs-pages .card-sign button i{line-height:1;font-size:16px;margin-right:5px}.card-sign .divider{text-transform:uppercase;font-family:"Archivo",sans-serif;letter-spacing:.5px}.card-sign .divider span{font-size:10px;color:rgba(110,121,133,.75)}.card-sign .card-footer{background-color:rgba(0,0,0,0);text-align:center;padding:0 30px 30px;color:#6e7985;border-top-width:0}.btn-facebook{background-color:#395498}.btn-facebook:hover,.btn-facebook:focus{background-color:#324a85}.btn-google{background-color:#fd6584}.btn-google:hover,.btn-google:focus{background-color:#fd4c70}.auth-img{width:100%;height:100%;object-fit:cover;mix-blend-mode:luminosity;opacity:.3}.card-auth{max-width:420px;border-width:0;border-radius:0;background-color:rgba(0,0,0,0)}.card-auth .card-title{font-size:24px;color:#212830;margin-bottom:15px}.card-auth .card-text{color:#6e7985}.card-auth .btn,.card-auth .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .card-auth button,.card-auth .gridjs-pages button,.gridjs-pages .card-auth button{width:100%;display:flex;align-items:center;justify-content:center;height:40px;text-transform:uppercase;letter-spacing:.5px;font-size:12px;font-family:"Archivo",sans-serif}.page-auth .content .container{height:calc(100vh - 72px);display:flex;align-items:center;justify-content:center}.page-auth .form-control,.page-auth .gridjs-input{height:40px}.page-error .content .container{min-height:calc(100vh - 72px);padding:40px 20px;display:flex;align-items:center}@media(min-width: 992px){.page-error .content .container{padding:50px 0}}.page-error .content .row{flex-direction:column-reverse;align-items:center}@media(min-width: 992px){.page-error .content .row{flex-direction:row;justify-content:space-around}}.error-number{font-size:80px;font-weight:300;font-family:"Inter",sans-serif;line-height:1;color:#9ea7b1;margin-bottom:20px;letter-spacing:-3px}@media(min-width: 992px){.error-number{font-size:140px}}.error-title{font-size:24px;font-weight:600;color:#212830;letter-spacing:-0.5px;margin-bottom:10px}@media(min-width: 992px){.error-title{font-size:32px}}.error-subtitle{color:#41505f;font-weight:400;margin-bottom:40px}.error-text{color:#6e7985;margin-bottom:40px;text-align:center}.btn-error{height:42px;padding:0 20px;display:inline-flex;align-items:center;justify-content:center;text-transform:uppercase;font-size:12px;font-family:"Archivo",sans-serif;letter-spacing:1px}.main-pricing .btn,.main-pricing .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .main-pricing button,.main-pricing .gridjs-pages button,.gridjs-pages .main-pricing button{padding:10px 20px;line-height:1.2}@media(min-width: 992px){.main-pricing .btn,.main-pricing .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .main-pricing button,.main-pricing .gridjs-pages button,.gridjs-pages .main-pricing button{padding:12px 25px}}.pricing-title{font-size:32px;font-weight:700;color:#212830;letter-spacing:-1px}@media(min-width: 576px){.pricing-title{font-size:36px;width:80%}}@media(min-width: 768px){.pricing-title{font-size:40px;width:75%}}@media(min-width: 992px){.pricing-title{font-size:46px}}@media(min-width: 1200px){.pricing-title{width:60%}}.pricing-text{font-size:16px;color:#6e7985}.table-pricing{min-width:780px}.table-pricing thead th{border-bottom-width:0;padding-bottom:0;vertical-align:top}.table-pricing thead th span{display:block;margin-bottom:10px}.table-pricing thead th>small,.table-pricing thead th>.small{display:block;font-size:.75rem;font-weight:400;line-height:1.3;color:#41505f}.table-pricing thead th.selected .pricing-price{color:#506fd9}.table-pricing thead th.selected .pricing-price small,.table-pricing thead th.selected .pricing-price .small{color:inherit}.table-pricing thead th:not(:first-child),.table-pricing tbody td:not(:first-child){text-align:center}.table-pricing thead th.selected,.table-pricing tbody td.selected{background-color:rgba(80,111,217,.06)}.table-pricing>:not(:first-child){border-top:0}.table-pricing tbody td{padding:10px 0;vertical-align:middle}.table-pricing tbody td i{font-size:24px;font-weight:700;color:#506fd9}.table-pricing tbody td .btn,.table-pricing tbody td .ui-datepicker-buttonpane button,.ui-datepicker-buttonpane .table-pricing tbody td button,.table-pricing tbody td .gridjs-pages button,.gridjs-pages .table-pricing tbody td button{width:100%;padding-left:10px;padding-right:10px}.table-pricing tbody td:first-child{text-transform:capitalize;font-weight:500;color:#212830;padding-right:10px;white-space:nowrap}.table-pricing tbody td:first-child small,.table-pricing tbody td:first-child .small{font-weight:400;text-transform:none;color:#6e7985;display:block;line-height:1.4;white-space:normal}.table-pricing tbody td:first-child i{font-size:16px;font-weight:400;line-height:1;position:relative;top:1px}.table-pricing tbody td:not(:first-child) span{display:block;padding:8px 0;font-family:"Inter",sans-serif;font-weight:500}.table-pricing tr:last-child td{border-bottom-width:0;padding:40px 10px 10px}.table-pricing .title td{padding-top:5px;padding-bottom:5px;border-bottom-width:1.5px;border-bottom-color:#9ea7b1}.table-pricing .title td:first-child{text-transform:uppercase;font-weight:700;color:#212830}.table-pricing .title:not(:first-child) td{padding-top:25px}.pricing-price{font-size:36px;font-weight:700;font-family:"Inter",sans-serif;letter-spacing:-1px;color:#212830}.pricing-price small,.pricing-price .small{font-size:13px;font-weight:400;font-family:"Open Sans",sans-serif;color:#6e7985;letter-spacing:-0.2px}.main-faq .nav-classic .nav-link{color:#41505f}.main-faq .nav-classic .nav-link:hover{color:#506fd9}.accordion-faq .accordion-item{background-color:#fff;border:0;border-radius:6px;box-shadow:0 1px 2px rgba(204,210,218,.07),0 2px 4px rgba(204,210,218,.07),0 4px 8px rgba(204,210,218,.07),0 8px 16px rgba(204,210,218,.07),0 16px 32px rgba(204,210,218,.07),0 32px 64px rgba(204,210,218,.07)}.accordion-faq .accordion-item+.accordion-item{margin-top:5px}.accordion-faq .accordion-button{background-color:rgba(0,0,0,0);font-size:15px;font-weight:600;color:#506fd9;border-bottom:0}.accordion-faq .accordion-button.collapsed{color:#212830}.accordion-faq .accordion-button:not(.collapsed){box-shadow:none}.accordion-faq .accordion-button:focus{box-shadow:none}.main-docs{position:relative}@media(min-width: 1200px){.main-docs{padding-right:220px}}.main-docs .container{margin:auto;padding:20px}@media(min-width: 992px){.main-docs .container{width:680px;padding:30px}}.main-docs p{margin-bottom:20px}.doc-mobile-header{background-color:#fbfcfe}.doc-mobile-header.scroll{background-color:#fff}.nav-docs{width:200px;position:fixed;top:30px;right:25px;flex-direction:column;display:none}@media(min-width: 1200px){.nav-docs{display:flex}}.nav-docs label{font-size:11px;font-family:"Archivo",sans-serif;text-transform:uppercase;letter-spacing:.5px;color:#9ea7b1;display:block;margin-bottom:10px}.nav-docs .nav-link{color:#6e7985;padding:0;padding-left:15px;font-size:13px;position:relative}.nav-docs .nav-link::before{content:"";position:absolute;top:50%;left:0;width:5px;height:1.5px;background-color:#6e7985;transition:all .25s}@media(prefers-reduced-motion: reduce){.nav-docs .nav-link::before{transition:none}}.nav-docs .nav-link.active{color:#212830}.nav-docs .nav-link.active::before{width:20px;left:-15px;background-color:#506fd9}.nav-docs .nav-link+.nav-link{margin-top:8px}.nav-docs hr{border-color:#e2e5ec;opacity:.75}.card-example{border-radius:0;border-color:#e2e5ec;background-color:inherit;position:relative;margin-top:30px}.card-example>.card-body{padding:20px;position:relative}.card-example>.card-body::before{content:"Example";padding:2px 5px;background-color:#fbfcfe;position:absolute;top:-10px;left:15px;font-size:10px;font-family:"Archivo",sans-serif;font-weight:500;text-transform:uppercase;color:rgba(110,121,133,.6);letter-spacing:1px}.card-example>.card-footer{border-top-color:#e2e5ec;background-color:#fff;padding:0}.card-example>.card-footer pre{margin-top:0;margin-bottom:0;background-color:inherit;padding:12px 15px}.card-example>.card-footer code[class*=language-],.card-example>.card-footer pre[class*=language-]{font-size:12px;font-family:"Roboto Mono",monospace;letter-spacing:-0.2px}.row-example span{display:block;padding:10px;border:1px solid #e2e5ec;background-color:#fff;font-size:.8125rem}.offcanvas-demo{position:relative;border:1px solid #e2e5ec;background-color:#f8f9fc}.offcanvas-demo .offcanvas{position:relative;visibility:visible;transform:none;border-right-color:#e2e5ec;z-index:0}.offcanvas-demo .offcanvas-start{border-right-width:1px}.scrollspy-demo{border:1px solid #e2e5ec;background-color:#fff;position:relative;height:250px;overflow:auto}.toast-demo{padding:15px;background-color:#f3f5f9}.toast-demo .toast{display:block}.wizard-demo{font-size:13px}.wizard-demo.wizard>.content>.title{font-size:15px}.cc-group{display:flex;font-size:24px;color:#9ea7b1}.media-animate{display:flex}.media-animate .nav{flex-direction:column}.media-animate .nav-link{display:flex;align-items:center;padding:0;color:#6e7985;position:relative;background-color:rgba(243,245,249,.6);padding:6px 10px;font-size:13px;width:150px}.media-animate .nav-link+.nav-link{margin-top:1px}.media-animate .nav-link.active{background-color:#e2e5ec;color:#41505f}.media-animate .media-body{flex:1;display:flex;align-items:center;justify-content:center}.media-animate .animate-title{font-size:36px;font-weight:600;font-family:"Archivo",sans-serif;display:inline-block;line-height:1;color:#212830;letter-spacing:-1px;text-shadow:3px 3px 2px #ccd2da}.demo-background{display:flex}.demo-background>div+div{margin-left:1px}.demo-border,.demo-bordered{display:flex}.demo-border>span,.demo-bordered>span{background-color:#fff;display:block;flex:1;height:50px}.demo-border>span+span,.demo-bordered>span+span{margin-left:10px}.demo-bordered>span{border:1px solid #e2e5ec}.demo-text p,.demo-text a{display:block;padding:8px 10px;margin-bottom:0;background-color:#fff}.demo-text p+p,.demo-text p+a,.demo-text a+p,.demo-text a+a{margin-top:1px}.demo-flex .border{padding:2px}.demo-flex .d-flex>div+div{margin-left:2px}.demo-flex .flex-row-reverse>div+div{margin-left:0;margin-right:2px}.table-spacing{color:#6e7985}.table-spacing strong{font-weight:600}.table-spacing td:not(:first-child) code{font-family:"Open Sans",sans-serif;font-size:.875rem}.icon-group{margin-top:20px;background-color:#fff;border:1px solid #e2e5ec;padding:30px 20px}.icon-group .col{text-align:center}.icon-group i{font-size:24px;line-height:1;color:#41505f}.icon-group svg{color:#41505f}.main-footer-docs{margin-top:0;padding:20px;border-top-width:0;position:relative}@media(min-width: 992px){.main-footer-docs{margin-left:250px;padding:20px 40px 40px}}.main-footer-docs::before{content:"";position:absolute;top:0;left:20px;right:20px;border-top:1px solid rgba(226,229,236,.6)}@media(min-width: 992px){.main-footer-docs::before{left:40px;right:40px}}.landing-headline{height:100vh;position:relative;padding-top:20px;padding-bottom:40px;display:flex;flex-direction:column}@media(min-width: 576px){.landing-headline{height:110vh}}@media(min-width: 992px){.landing-headline{height:100vh}}.landing-headline::before{content:"";width:50px;height:30%;position:absolute;top:-10px;left:25%;background-color:#506fd9;transform:skewY(-10deg);opacity:.1;display:none}.landing-headline::after{content:"";width:35%;height:40%;position:absolute;top:-10%;left:calc(25% + 60px);background-color:#506fd9;transform:skewY(-10deg);opacity:.05;display:none}.landing-header{display:flex;align-items:center}.landing-header .menu-link{font-size:20px;color:#41505f;display:flex;align-items:center;justify-content:center;transition:all .25s}@media(prefers-reduced-motion: reduce){.landing-header .menu-link{transition:none}}.landing-header .menu-link i{animation:scaling .7s infinite linear}@keyframes scaling{0%{transform:scale(1)}75%{transform:scale(1.25)}100%{transform:scale(1)}}.landing-header .menu-link:hover i,.landing-header .menu-link:focus i{transform:scale(1.25);animation:none}.landing-header .sidebar-logo{font-size:28px;margin-right:auto}.landing-header .sidebar-logo::after{bottom:4px}.landing-header .nav-icon .nav-link{transition:all .25s}@media(prefers-reduced-motion: reduce){.landing-header .nav-icon .nav-link{transition:none}}.landing-header .nav-icon .nav-link:hover,.landing-header .nav-icon .nav-link:focus{transform:scale(1.2)}.landing-header .nav-icon .nav-link i{font-size:20px}.landing-body{margin-top:25px;height:calc(100% - 55px)}.landing-body .btn-lg,.landing-body .btn-group-lg>.btn,.landing-body .ui-datepicker-buttonpane .btn-group-lg>button,.ui-datepicker-buttonpane .landing-body .btn-group-lg>button,.landing-body .gridjs-pages .btn-group-lg>button,.gridjs-pages .landing-body .btn-group-lg>button{font-size:15px;line-height:1.4;border-radius:4px}.landing-body .btn-secondary.disabled,.landing-body .ui-datepicker-buttonpane button.disabled,.ui-datepicker-buttonpane .landing-body button.disabled{color:#fff;opacity:.6}.landing-body .dropdown-link{display:flex;align-items:center;justify-content:space-between;height:100%;width:150px;border-radius:4px}.landing-body .dropdown-link i{font-size:18px;line-height:1;margin-top:1px;margin-right:-2px}.landing-body .dropdown-menu{width:100%;border-color:#ccd2da;box-shadow:0 1px 2px rgba(158,167,177,.07),0 2px 4px rgba(158,167,177,.07),0 4px 8px rgba(158,167,177,.07),0 8px 16px rgba(158,167,177,.07),0 16px 32px rgba(158,167,177,.07),0 32px 64px rgba(158,167,177,.07)}.landing-body .dropdown-item.active{color:#506fd9;background-color:rgba(80,111,217,.1)}.landing-body .dropdown-item+.dropdown-item{margin-top:1px}@media(min-width: 992px){.headline-text{width:40%}}@media(max-width: 991.98px){.headline-text h4,.headline-text .h4{font-size:18px}}.headline-text .btn-lg,.headline-text .btn-group-lg>.btn,.headline-text .ui-datepicker-buttonpane .btn-group-lg>button,.ui-datepicker-buttonpane .headline-text .btn-group-lg>button,.headline-text .gridjs-pages .btn-group-lg>button,.gridjs-pages .headline-text .btn-group-lg>button{height:45px;display:flex;align-items:center;padding-left:30px;padding-right:30px}.headline-content{width:100%;height:100%;position:relative;max-height:250px}@media(min-width: 576px){.headline-content{max-height:720px}}@media(min-width: 992px){.headline-content{width:60%;max-height:410px}}@media(min-width: 1200px){.headline-content{max-height:500px}}@media(min-width: 1400px){.headline-content{max-height:580px}}@media(min-width: 1920px){.headline-content{max-height:840px}}.headline-content::before{content:"";position:absolute;top:10%;right:10%;bottom:10%;left:10%;background-image:radial-gradient(circle, #1a2f76, #fff);border-radius:100%;filter:blur(100px)}.headline-content .img-item{position:absolute;background-color:#fff;border-radius:6px;overflow:hidden;box-shadow:0 1px 2px rgba(26,47,118,.07),0 2px 4px rgba(26,47,118,.07),0 4px 8px rgba(26,47,118,.07),0 8px 16px rgba(26,47,118,.07),0 16px 32px rgba(26,47,118,.07),0 32px 64px rgba(26,47,118,.07)}.headline-content .img-item img{width:100%;object-fit:cover;object-position:top left}.headline-content .img-item.one{width:52%;height:100%;top:0;left:50%;transform:translateX(-50%);z-index:10}.headline-content .img-item.two{width:48%;height:90%;top:5%;left:50%;margin-left:-38%}.headline-content .img-item.three{width:48%;height:90%;top:5%;right:50%;margin-right:-38%}.landing-section{padding:80px 0}.landing-section .landing-body{min-height:600px}.landing-text{font-size:16px;text-align:center}@media(min-width: 992px){.landing-text{width:75%;margin-left:auto;margin-right:auto;font-size:18px}}.card-dashboard-demo{height:250px;overflow:hidden;position:relative;border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(33,40,48,.07),0 2px 4px rgba(33,40,48,.07),0 4px 8px rgba(33,40,48,.07),0 8px 16px rgba(33,40,48,.07),0 16px 32px rgba(33,40,48,.07),0 32px 64px rgba(33,40,48,.07)}@media(min-width: 576px){.card-dashboard-demo{height:200px}}@media(min-width: 768px){.card-dashboard-demo{height:280px}}@media(min-width: 992px){.card-dashboard-demo{height:300px}}@media(min-width: 1200px){.card-dashboard-demo{height:230px}}@media(min-width: 1400px){.card-dashboard-demo{height:290px}}.card-dashboard-demo img{border-radius:inherit;width:100%;position:absolute;top:0;left:0;transition:all 1s ease-in-out}@media(prefers-reduced-motion: reduce){.card-dashboard-demo img{transition:none}}.card-dashboard-demo>div{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background-color:rgba(255,255,255,.75);opacity:0;transition:all .25s}@media(prefers-reduced-motion: reduce){.card-dashboard-demo>div{transition:none}}.card-dashboard-demo:hover img{top:-53%}.card-dashboard-demo:hover>div{opacity:1}.card-sidebar-demo,.card-app-demo{padding:10px;border-width:0;border-radius:6px;box-shadow:0 1px 2px rgba(76,83,102,.07),0 2px 4px rgba(76,83,102,.07),0 4px 8px rgba(76,83,102,.07),0 8px 16px rgba(76,83,102,.07),0 16px 32px rgba(76,83,102,.07),0 32px 64px rgba(76,83,102,.07)}.landing-icons{display:flex;align-items:center;font-size:20px}@media(min-width: 992px){.landing-icons{font-size:24px}}.landing-icons .divider{border-left:1px dotted #9ea7b1;height:30px;margin:0 5px}.landing-icons>div{display:flex}.icon-bootstrap{color:#7711f7}.icon-html5{color:#dd4b25}.icon-css3{color:#1655a2}.icon-sass{color:#c66394}.icon-js{color:#ffc107}.icon-npm{color:#c53635}.icon-gulp{color:#d34446}.icon-react{color:#00d1f7}.ps{overflow:hidden}.ps>.ps__rail-y{width:3px;background-color:rgba(58,78,136,.06);z-index:10;position:absolute;left:auto !important;right:0;opacity:0;margin:1px;transition:opacity .2s}@media(prefers-reduced-motion: reduce){.ps>.ps__rail-y{transition:none}}.ps>.ps__rail-y>.ps__thumb-y{position:absolute;border-radius:0;width:3px;left:0;background-color:#9ea7b1}.ps.ps--active-y:hover>.ps__rail-y,.ps.ps--active-y:focus>.ps__rail-y{opacity:1}.scrollbar-sm>.ps__rail-y{width:1px}.scrollbar-sm>.ps__rail-y>.ps__thumb-y{width:1px}.scrollbar-lg>.ps__rail-y{width:6px}.scrollbar-lg>.ps__rail-y>.ps__thumb-y{width:6px}.scrollbar-primary>.ps__rail-y>.ps__thumb-y{background-color:#0d6efd}.scrollbar-dark>.ps__rail-y>.ps__thumb-y{background-color:#212830}.gridjs-head{margin-bottom:10px}.gridjs-footer{margin-top:10px}.gridjs-pagination{display:flex;align-items:center;justify-content:space-between}.gridjs-summary{white-space:nowrap;margin-right:20px}.gridjs-pages{display:flex}.gridjs-pages button{border:1px solid #ccd2da}.gridjs-pages button+button{margin-left:5px}.gridjs-pages button.gridjs-currentPage{background-color:#506fd9;border-color:rgba(0,0,0,0);color:#fff}.gridjs-th{position:relative}.gridjs-th-sort .gridjs-th-content{float:left}.gridjs-th-sort .gridjs-sort{position:relative;padding:0;border:0;background-color:rgba(0,0,0,0);width:24px;height:24px;float:right}.gridjs-th-sort .gridjs-sort::before,.gridjs-th-sort .gridjs-sort::after{font-family:"remixicon";font-size:14px;position:absolute;color:#9ea7b1}.gridjs-th-sort .gridjs-sort::before{content:"";top:-1px}.gridjs-th-sort .gridjs-sort::after{content:"";bottom:-1px}.gridjs-th-sort .gridjs-sort-asc::before{top:1px}.gridjs-th-sort .gridjs-sort-asc::after{display:none}.gridjs-th-sort .gridjs-sort-desc::before{display:none}.gridjs-th-sort .gridjs-sort-desc::after{bottom:1px}.gridjs-resizable{position:absolute;top:0;bottom:0;right:0;width:3px;cursor:ew-resize}.gridjs-resizable:hover{background-color:#f3f5f9}.select2-results__option{border-radius:0;margin-bottom:1px;font-size:inherit}.select2-container--default .select2-results__option--selected{background-color:#f3f5f9}.select2-container--default .select2-selection--single{background-color:#fff;border-color:#ccd2da;border-radius:.25rem;height:36px;outline:none}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#41505f;line-height:calc((1.5em + 0.812rem + 2px) - .1rem);padding-left:.75rem;height:100%;display:flex;align-items:center}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:#6e7985}.select2-container--default .select2-selection--single .select2-selection__arrow{width:30px;height:36px;line-height:calc(1.5em + 0.812rem + 2px)}.select2-container--default .select2-selection--single .select2-selection__arrow b{margin-top:-3px}.select2-container--default .select2-selection--single .select2-selection__clear{font-size:20px;font-weight:400;order:2;margin-left:auto;margin-right:25px;color:#6e7985;position:relative;z-index:100;height:100%}.select2-container--default .select2-selection--single .select2-selection__clear:hover{color:#41505f}.select2-container--default .select2-selection--multiple{background-color:#fff;border-color:#ccd2da;border-radius:.25rem;min-height:36px;outline:none;display:flex}.select2-container--default .select2-selection--multiple .select2-selection__rendered{padding:0 4px;display:inline-block;margin-bottom:0}.select2-container--default .select2-selection--multiple .select2-selection__choice{position:relative;margin-top:4px;margin-right:4px;margin-left:0;padding:3px 10px 3px 20px;border-color:rgba(0,0,0,0);border-radius:.1875rem;background-color:#506fd9;color:#fff;font-size:13px;line-height:1.45}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{color:#fff;opacity:.5;font-size:14px;font-weight:400;display:inline-block;position:absolute;top:4px;left:3px;line-height:1.2;border-right:0}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{background-color:rgba(0,0,0,0);color:#fff;opacity:.85}.select2-container--default.select2-container--focus .select2-selection--multiple{border-color:#ccd2da}.select2-container--default .select2-search--dropdown .select2-search__field{border-color:#ccd2da;border-radius:0;padding:5px 10px}.select2-container--default .select2-search--dropdown .select2-search__field::placeholder{color:#6e7985}.select2-container--default .select2-results__option[aria-selected=true]{background-color:#fff}.select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#506fd9}.select2-container--default .select2-results>.select2-results__options{margin:4px}.select2-container--default .select2-search--inline .select2-search__field{margin-bottom:5px;margin-left:0;line-height:26px;opacity:.6}.select2-container--default .select2-search--inline .select2-search__field::placeholder{color:#6e7985;font-weight:400;opacity:1}.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#f3f5f9}.select2-container--default.select2-container--disabled .select2-selection__choice{padding-left:10px;background-color:#9ea7b1}.select2-container--default.select2-container--disabled .select2-selection__choice .select2-selection__choice__remove{display:none}.select2-container--open{font-size:14px}.select2-container--open .select2-selection--single,.select2-container--open .select2-selection--multiple{background-color:#fff;border-color:#ccd2da}.select2-container--open .select2-dropdown--above{border-top-left-radius:0;border-top-right-radius:0}.select2-container--open .select2-dropdown--below{border-bottom-right-radius:0;border-bottom-left-radius:0;top:0}.select2-dropdown{border-color:#ccd2da;z-index:200}.select2-search--dropdown{padding-bottom:0}.select2-results__option{padding:6px 10px;font-size:inherit}.has-success .select2-container--default .select2-selection--single{border-color:theme-color("success")}.has-warning .select2-container--default .select2-selection--single{border-color:theme-color("warning")}.has-danger .select2-container--default .select2-selection--single{border-color:theme-color("danger")}.select2-xs+.select2-container{font-size:12px}.select2-dropdown-xs .select2-results__option{font-size:12px}.select2-sm+.select2-container{font-size:14px}.select2-dropdown-sm .select2-results__option{font-size:14px}.select2-bd-0+.select2-container--default .select2-selection--single{border-width:0}.bg-gray+.select2-container--default .select2-selection--single{background-color:#3b4956}.bg-gray+.select2-container--default .select2-selection--single .select2-selection__rendered{color:#e2e5ec}.bootstrap-tagsinput{display:flex;flex-wrap:wrap;box-shadow:none;padding-top:5px;padding-left:2.5px;padding-right:2.5px;padding-bottom:0;border-color:#ccd2da;border-radius:.25rem}.bootstrap-tagsinput .tag{display:inline-flex;align-items:center;background-color:#506fd9;color:#fff;padding:2px 7px;margin:0 2.5px 5px;font-size:.8125rem;border-radius:3px}.bootstrap-tagsinput .tag [data-role=remove]{display:inline-block;height:16px;width:10px;position:relative;opacity:.5}.bootstrap-tagsinput .tag [data-role=remove]::after{content:"";font-family:"remixicon";font-size:14px;position:absolute;top:calc(50% + .5px);line-height:0;text-indent:-3px}.bootstrap-tagsinput .tag [data-role=remove]:hover,.bootstrap-tagsinput .tag [data-role=remove]:focus{opacity:1;box-shadow:none}.bootstrap-tagsinput>input{min-height:auto;font-size:.8125rem}.bootstrap-tagsinput .tt-menu{margin-top:7px;margin-left:-10px;background-color:#fff;min-width:150px;padding:2px;border-radius:4px;border:1px solid #ccd2da;box-shadow:0 1px 1px rgba(226,229,236,.25),0 2px 2px rgba(226,229,236,.2),0 4px 4px rgba(226,229,236,.15),0 8px 8px rgba(226,229,236,.1),0 16px 16px rgba(226,229,236,.05)}.bootstrap-tagsinput .tt-suggestion{font-size:.8125rem;padding:4px 8px;border-radius:3px}.bootstrap-tagsinput .tt-suggestion:hover,.bootstrap-tagsinput .tt-suggestion:focus{cursor:pointer;background-color:#f3f5f9}.irs--flat .irs-min,.irs--flat .irs-max{color:#6e7985;background-color:#f3f5f9;border-radius:3px}.irs--flat .irs-from,.irs--flat .irs-to,.irs--flat .irs-single{background-color:#506fd9;border-radius:3px}.irs--flat .irs-from::before,.irs--flat .irs-to::before,.irs--flat .irs-single::before{border-top-color:#506fd9}.irs--flat .irs-line{background-color:#e2e5ec;border-radius:.25rem}.irs--flat .irs-bar{background-color:#506fd9}.irs--flat .irs-bar--single{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.irs--flat .irs-handle>i:first-child{background-color:#3b5ed4}.irs--flat .irs-handle:hover,.irs--flat .irs-handle:focus,.irs--flat .irs-handle:active{cursor:w-resize}.irs--flat .irs-handle:hover>i:first-child,.irs--flat .irs-handle:focus>i:first-child,.irs--flat .irs-handle:active>i:first-child{background-color:#3357d3}.irs--flat .irs-handle.state_hover>i:first-child,.irs--flat .irs-handle.state_hover:hover>i:first-child,.irs--flat .irs-handle.state_hover:focus>i:first-child,.irs--flat .irs-handle.state_hover:active>i:first-child{background-color:#3357d3}.irs--flat .irs-grid-text{color:#6e7985}.irs--flat .irs-grid-pol{background-color:#e2e5ec}.irs--round .irs-min,.irs--round .irs-max,.irs--round .irs-from,.irs--round .irs-to{font-size:10px;border-radius:.25rem}.irs--round .irs-min,.irs--round .irs-max{background-color:#f3f5f9;color:#6e7985}.irs--round .irs-grid-text{font-size:10px;color:#6e7985}.irs--round .irs-grid-pol{background-color:#e2e5ec}.irs--round .irs-handle{border-color:#506fd9;border-radius:8px}.irs--round .irs-from,.irs--round .irs-to,.irs--round .irs-bar{background-color:#506fd9}.irs--square .irs-line,.irs--square .irs-grid-pol{background-color:#f3f5f9}.irs--square .irs-min,.irs--square .irs-max{background-color:#f3f5f9;font-size:10px;color:#6e7985}.irs--square .irs-grid-text{font-size:10px;color:#6e7985}.irs--square .irs-from,.irs--square .irs-to{background-color:#313c47;font-size:10px}.irs--square .irs-handle{border-color:#313c47}.irs--square .irs-bar{background-color:#313c47}.ui-datepicker{background-color:#fff;border:1px solid #e2e5ec;font-family:inherit;font-size:inherit;padding:10px;margin:1px 0 0;display:none;width:auto !important;z-index:5 !important;border-radius:.25rem}.ui-datepicker .ui-datepicker-header{display:flex;justify-content:space-between;align-items:center;position:relative;font-weight:500;font-size:12px;text-transform:uppercase;color:#212830;padding:0 0 5px;letter-spacing:1px;border:0;background-color:rgba(0,0,0,0);border-top-left-radius:.25rem;border-top-right-radius:.25rem}.ui-datepicker .ui-datepicker-header .ui-datepicker-next,.ui-datepicker .ui-datepicker-header .ui-datepicker-prev{text-indent:-99999px;color:#6e7985;top:0}.ui-datepicker .ui-datepicker-header .ui-datepicker-next::before,.ui-datepicker .ui-datepicker-header .ui-datepicker-prev::before{font-size:16px;font-family:"remixicon";position:absolute;top:-1px;text-indent:0}.ui-datepicker .ui-datepicker-header .ui-datepicker-next:hover::before,.ui-datepicker .ui-datepicker-header .ui-datepicker-next:focus::before,.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:hover::before,.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:focus::before{color:#41505f}.ui-datepicker .ui-datepicker-header .ui-datepicker-next{order:3}.ui-datepicker .ui-datepicker-header .ui-datepicker-next:before{right:5px;content:""}.ui-datepicker .ui-datepicker-header .ui-datepicker-prev:before{left:5px;content:""}.ui-datepicker .ui-datepicker-header .ui-datepicker-next-hover,.ui-datepicker .ui-datepicker-header .ui-datepicker-prev-hover{color:#41505f;cursor:pointer;top:1px;border:0;background-color:rgba(0,0,0,0)}.ui-datepicker .ui-datepicker-title{color:#212830;font-weight:700;font-size:13px}.ui-datepicker select.ui-datepicker-month,.ui-datepicker select.ui-datepicker-year{font-size:11px;border:1px solid #ccd2da;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:2px 20px 2px 5px;border-radius:.25rem;position:relative;margin-top:-3px;background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3e%3cpath fill='%233b4863' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 5px center/8px 8px}.ui-datepicker .ui-datepicker-year{margin-left:5px}.ui-datepicker .ui-datepicker-calendar{margin:0;background-color:rgba(0,0,0,0);border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.ui-datepicker .ui-datepicker-calendar th{text-transform:uppercase;font-size:11px;font-weight:600;letter-spacing:1px;padding:6px 9px;color:#41505f}@media(max-width: 320px){.ui-datepicker .ui-datepicker-calendar th{padding:4px 0;letter-spacing:normal}}.ui-datepicker .ui-datepicker-calendar td{border:1px solid #fff;padding:0;background-color:#fff;text-align:right}.ui-datepicker .ui-datepicker-calendar td:last-child{border-right:0}.ui-datepicker .ui-datepicker-calendar td.ui-datepicker-other-month .ui-state-default{color:#9ea7b1}.ui-datepicker .ui-datepicker-calendar td span,.ui-datepicker .ui-datepicker-calendar td a{transition:all .2s ease-in-out;padding:5px;color:#41505f;padding:6px 10px;display:block;font-weight:400;font-size:12px;border:0;border-radius:1px}@media(prefers-reduced-motion: reduce){.ui-datepicker .ui-datepicker-calendar td span,.ui-datepicker .ui-datepicker-calendar td a{transition:none}}.ui-datepicker .ui-datepicker-calendar td a:hover{background-color:#fbfcfe;color:#41505f}.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a,.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a:hover,.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a:focus{background-color:#506fd9;color:#fff}.ui-datepicker .ui-datepicker-calendar .ui-state-disabled .ui-state-default{color:#9ea7b1;background-color:#f3f5f9}.ui-datepicker-multi .ui-datepicker-group{padding-right:15px;width:auto;float:left}.ui-datepicker-multi .ui-datepicker-group .ui-datepicker-title{margin:auto}.ui-datepicker-multi .ui-datepicker-group .ui-datepicker-prev::before{left:10px}.ui-datepicker-multi .ui-datepicker-group .ui-datepicker-next::before{right:10px}.ui-datepicker-multi .ui-datepicker-group table{margin:0}.ui-datepicker-multi .ui-datepicker-group-last{padding-right:0}.ui-datepicker-inline{border-color:#ccd2da}@media(min-width: 576px){.ui-datepicker-inline{max-width:270px}}.ui-datepicker-buttonpane{display:flex;align-items:center;justify-content:space-between;font-size:13px;border-top:1px solid #85b6ff;padding-top:10px}.ui-datepicker-buttonpane button{min-height:inherit;border-radius:.25rem}.sp-replacer{border-color:#ccd2da;background-color:#fff}.sp-replacer:hover,.sp-replacer.sp-active{border-color:#9ea7b1}.sp-container{background-color:#fff;border-color:#ccd2da;margin-top:2px;box-shadow:0 1px 1px rgba(204,210,218,.25),0 2px 2px rgba(204,210,218,.2),0 4px 4px rgba(204,210,218,.15),0 8px 8px rgba(204,210,218,.1),0 16px 16px rgba(204,210,218,.05)}.sp-container button,.sp-container button:hover,.sp-container button:focus,.sp-container button:active,.sp-container a{display:inline-block;background-color:#6e7985;background-image:none;border:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";font-size:13px;text-shadow:none;text-transform:capitalize;color:#fff;padding:8px 10px;line-height:1;border-radius:3px}.sp-container button:hover,.sp-container button:focus{background-color:#626c77}.sp-container .sp-cancel{background-color:#f3f5f9;color:#6e7985 !important}.sp-container .sp-cancel:hover,.sp-container .sp-cancel:focus{text-decoration:none;background-color:#e2e5ec}.sp-picker-container{border-left-width:0}.wizard{border:1px solid #e2e5ec;background-color:#fff;border-radius:.25rem}.wizard>.steps{padding:10px 15px}@media(min-width: 768px){.wizard>.steps{padding:15px 20px}}.wizard>.steps>ul{padding:0;margin-bottom:0;display:flex}.wizard>.steps>ul li{float:none;display:block;width:auto}.wizard>.steps>ul li .current-info{display:none}.wizard>.steps>ul li .title{margin-left:5px;white-space:nowrap;transition:all .2s ease-in-out}@media(prefers-reduced-motion: reduce){.wizard>.steps>ul li .title{transition:none}}@media(min-width: 576px){.wizard>.steps>ul li .title{display:none;margin-left:10px}}@media(min-width: 768px){.wizard>.steps>ul li .title{display:inline-block}}.wizard>.steps>ul li+li{margin-left:10px;position:relative}@media(min-width: 576px){.wizard>.steps>ul li+li{margin-left:20px}}@media(min-width: 992px){.wizard>.steps>ul li+li{margin-left:40px}}.wizard>.steps>ul li+li::before{content:"";font-family:"remixicon";font-size:16px;font-weight:400;color:#ccd2da;position:absolute;top:calc(50% + 1px);left:-26px;line-height:0;display:none}@media(min-width: 768px){.wizard>.steps>ul li+li::before{display:block}}.wizard>.steps a,.wizard>.steps a:hover,.wizard>.steps a:active{color:#212830;font-weight:500;font-size:inherit;display:flex;justify-content:center;align-items:center;outline:none}@media(min-width: 1200px){.wizard>.steps a,.wizard>.steps a:hover,.wizard>.steps a:active{justify-content:flex-start}}.wizard>.steps a .number,.wizard>.steps a:hover .number,.wizard>.steps a:active .number{width:25px;height:25px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";border:2px solid #6e7985;border-radius:100%}@media(min-width: 768px){.wizard>.steps a .number,.wizard>.steps a:hover .number,.wizard>.steps a:active .number{width:32px;height:32px}}.wizard>.steps .disabled a,.wizard>.steps .disabled a:hover,.wizard>.steps .disabled a:active{color:#9ea7b1}.wizard>.steps .disabled a .number,.wizard>.steps .disabled a:hover .number,.wizard>.steps .disabled a:active .number{color:#9ea7b1;border-color:#ccd2da}.wizard>.steps .disabled .title{display:none}@media(min-width: 768px){.wizard>.steps .disabled .title{display:inline-block}}.wizard>.steps .current a,.wizard>.steps .current a:hover,.wizard>.steps .current a:active{color:#506fd9}.wizard>.steps .current a .title,.wizard>.steps .current a:hover .title,.wizard>.steps .current a:active .title{display:inline-block}.wizard>.steps .current a .number,.wizard>.steps .current a:hover .number,.wizard>.steps .current a:active .number{border-color:#506fd9;background-color:#506fd9;color:#fff}.wizard>.steps .done a,.wizard>.steps .done a:hover,.wizard>.steps .done a:active{color:#198754}.wizard>.steps .done a .title,.wizard>.steps .done a:hover .title,.wizard>.steps .done a:active .title{display:none}@media(min-width: 768px){.wizard>.steps .done a .title,.wizard>.steps .done a:hover .title,.wizard>.steps .done a:active .title{display:inline-block}}.wizard>.steps .done a .number,.wizard>.steps .done a:hover .number,.wizard>.steps .done a:active .number{border-color:#198754;background-color:#198754;color:#fff}.wizard>.content{border-top:1px solid #e2e5ec;border-bottom:1px solid #e2e5ec;min-height:150px;padding:20px;font-size:inherit}@media(min-width: 768px){.wizard>.content{padding:20px}}.wizard>.content>.title{font-size:16px;color:#212830;font-weight:600;margin-bottom:5px;display:none}.wizard>.content>.title.current{display:block}.wizard>.content>.body{float:none;position:static;width:auto;height:auto}.wizard>.content>.body input.parsley-error{border-color:theme-color("danger")}.wizard>.content>.body input.parsley-error+ul{list-style:none !important}.wizard>.content input,.wizard>.content textarea,.wizard>.content select{font-size:inherit}.wizard>.actions{padding:10px 15px}@media(min-width: 768px){.wizard>.actions{padding:15px 20px}}.wizard>.actions>ul{margin:0;padding:0;list-style:none;display:flex;justify-content:space-between}.wizard>.actions>ul>li:last-child a{background-color:#198754}.wizard>.actions a,.wizard>.actions a:hover,.wizard>.actions a:active{display:block;background-color:#506fd9;padding:8px 20px;line-height:1.428;color:#fff;border-radius:.25rem}.wizard>.actions .disabled a,.wizard>.actions .disabled a:hover,.wizard>.actions .disabled a:active{background-color:#e2e5ec;color:#6e7985}.wizard.vertical>.steps{padding:15px 20px}@media(min-width: 576px){.wizard.vertical>.steps{float:left;width:20%}}@media(min-width: 768px){.wizard.vertical>.steps{width:15%}}@media(min-width: 992px){.wizard.vertical>.steps{width:30%}}@media(min-width: 576px){.wizard.vertical>.steps ul{flex-direction:column}}.wizard.vertical>.steps ul li+li{margin-left:10px}@media(min-width: 576px){.wizard.vertical>.steps ul li+li{margin-top:10px;margin-left:0}}@media(min-width: 768px){.wizard.vertical>.steps ul li+li{margin-top:20px}}.wizard.vertical>.steps ul li+li::before{content:"";border-left:1px solid #e2e5ec;position:absolute;top:-15px;left:15px;height:10px}.wizard.vertical>.steps ul li .title{display:none;overflow:hidden;width:70%;text-overflow:ellipsis;white-space:nowrap}@media(min-width: 992px){.wizard.vertical>.steps ul li .title{display:block}}@media(min-width: 992px){.wizard.vertical>.steps a{justify-content:flex-start}}.wizard.vertical>.steps .current a .title{display:inline-block}@media(min-width: 576px){.wizard.vertical>.steps .current a .title{display:none}}@media(min-width: 992px){.wizard.vertical>.steps .current a .title{display:inline-block}}.wizard.vertical>.content{margin:0;padding:20px}@media(min-width: 576px){.wizard.vertical>.content{border-top-width:0;border-bottom-width:0;width:80%;float:right;border-left:1px solid #e2e5ec}}@media(min-width: 768px){.wizard.vertical>.content{width:85%}}@media(min-width: 992px){.wizard.vertical>.content{width:70%}}.wizard.vertical>.actions{padding:10px 15px}@media(min-width: 576px){.wizard.vertical>.actions{width:80%;float:right;border-left:1px solid #e2e5ec;padding:15px 20px}}@media(min-width: 768px){.wizard.vertical>.actions{width:85%;border-top:1px solid #e2e5ec}}@media(min-width: 992px){.wizard.vertical>.actions{width:70%}}.wizard.vertical>.actions ul{float:none;margin:0;padding:0}.wizard-tab{background-color:rgba(0,0,0,0);border-width:0}.wizard-tab>.steps{padding:0;border-bottom-width:0;margin-bottom:20px}.wizard-tab>.steps>ul{width:100%}.wizard-tab>.steps>ul>li{flex:1;width:auto;float:none}.wizard-tab>.steps>ul>li+li{margin-left:1px}.wizard-tab>.steps>ul>li+li::before{display:none}.wizard-tab>.steps a{padding:7px 10px}@media(min-width: 768px){.wizard-tab>.steps a{padding:10px 20px}}.wizard-tab>.steps .current a,.wizard-tab>.steps .current a:hover,.wizard-tab>.steps .current a:focus,.wizard-tab>.steps .done a,.wizard-tab>.steps .done a:hover,.wizard-tab>.steps .done a:focus{color:#fff}.wizard-tab>.steps .current a .number,.wizard-tab>.steps .current a:hover .number,.wizard-tab>.steps .current a:focus .number,.wizard-tab>.steps .done a .number,.wizard-tab>.steps .done a:hover .number,.wizard-tab>.steps .done a:focus .number{border-color:#fff;color:#fff}.wizard-tab>.steps .current a{background-color:#506fd9}.wizard-tab>.steps .done a{background-color:#198754}.wizard-tab>.steps .disabled a{background-color:#e2e5ec;color:#6e7985}.wizard-tab>.steps .first a{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.wizard-tab>.steps .last a{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.wizard-tab>.content{padding:0;border:0}.wizard-tab>.actions{border-top:1px solid #e2e5ec;padding:15px 0 0}input.parsley-error,input.parsley-error:focus,textarea.parsley-error,textarea.parsley-error:focus{box-shadow:none !important;border-color:#dc3545}input.parsley-success,input.parsley-success:focus,textarea.parsley-success,textarea.parsley-success:focus{box-shadow:none !important;border-color:#198754}.parsley-checkbox.parsley-error,.parsley-checkbox.parsley-success{display:inline-block;padding:10px;border-radius:.25rem}.parsley-checkbox.parsley-error{border:1px solid #dc3545}.parsley-checkbox.parsley-success{border:1px solid #198754}.form-select.parsley-error,.form-select.parsley-success{box-shadow:none !important}.form-select.parsley-error{border-color:#dc3545}.form-select.parsley-success{border-color:#198754}.parsley-errors-list{color:#dc3545;list-style:none;font-size:12px;padding:0;margin-bottom:0}.parsley-errors-list li{margin:5px 0 0}.ql-snow.ql-toolbar,.ql-snow.ql-container{border-color:#e2e5ec}.ql-snow.ql-toolbar{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.ql-snow.ql-toolbar button{padding:5px;display:flex;align-items:center;justify-content:center;width:28px;height:28px;color:#41505f;border-radius:1px}.ql-snow.ql-toolbar button:hover,.ql-snow.ql-toolbar button:focus{background-color:#f3f5f9}.ql-snow.ql-toolbar button.ql-active{background-color:#f3f5f9}.ql-snow.ql-toolbar button+button{margin-left:1px}.ql-snow.ql-toolbar .ql-picker{font-size:13px;height:28px;color:#41505f}.ql-snow.ql-toolbar .ql-picker:hover .ql-picker-label,.ql-snow.ql-toolbar .ql-picker:focus .ql-picker-label{color:#212830;background-color:#fdfefe}.ql-snow.ql-toolbar .ql-picker.ql-expanded .ql-picker-label{background-color:#fdfefe;border-color:#e2e5ec;color:#212830;outline:none;border-radius:2px}.ql-snow.ql-toolbar .ql-picker.ql-expanded .ql-picker-options{border-color:#e2e5ec;box-shadow:none;border-bottom-right-radius:2px;border-bottom-left-radius:2px}.ql-snow.ql-toolbar .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) .ql-picker-label .ql-stroke{stroke:#9ea7b1;stroke-width:1.5;stroke-linecap:square;stroke-linejoin:miter}.ql-snow.ql-toolbar .ql-picker-label{display:flex;align-items:center;border-radius:.25rem}.ql-snow.ql-toolbar .ql-picker-label.ql-active{background-color:#fdfefe;color:#506fd9}.ql-snow.ql-toolbar .ql-formats{display:inline-flex}.ql-snow.ql-toolbar .ql-formats .ql-picker{float:none}.ql-snow.ql-toolbar .ql-formats .ql-picker~.ql-picker{margin-left:1px}.ql-snow.ql-container{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.ql-container{font-size:1rem}.ql-editor{padding:20px;background-color:#fff;color:#41505f}.ql-editor.ql-blank::before{color:#9ea7b1;font-style:normal}.ql-bubble .ql-tooltip{background-color:#212830;border-radius:.25rem}.ql-bubble .ql-tooltip:not(.ql-flip) .ql-tooltip-arrow{border-bottom-color:#212830}.ql-bubble .ql-toolbar button{height:28px;padding:5px;border-radius:1px}.ql-bubble .ql-toolbar button.ql-active{background-color:#506fd9}.ql-bubble .ql-toolbar button+button{margin-left:1px}.modal-body .ql-snow.ql-toolbar{border-top-left-radius:0;border-top-right-radius:0;border-top-width:0;border-left-width:0;border-right-width:0}.modal-body .ql-snow.ql-container{border-left-width:0;border-bottom-width:0;border-right-width:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.leaflet-popup-content-wrapper{border-radius:6px;color:#212830}.leaflet-popup-content{margin-left:15px}.jqvmap-label{padding:2px 8px;background-color:rgba(17,17,17,.9);border-radius:2px}.jqvmap-zoomin,.jqvmap-zoomout{font-size:20px;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;background-color:#212830;border-radius:2px}.jqvmap-zoomout{top:32px}.jqvmap-pin{font-family:"Open Sans",sans-serif;cursor:default;pointer-events:none}#jqvmap1_ri_pin,#jqvmap1_dc_pin,#jqvmap1_de_pin,#jqvmap1_md_pin{display:none}#jqvmap1_ak_pin{margin-top:-2%}#jqvmap1_ca_pin{margin-left:-2%}#jqvmap1_ct_pin{margin-top:-0.25%;margin-left:-0.25%}#jqvmap1_fl_pin{margin-left:5%}#jqvmap1_id_pin{margin-top:3%;margin-left:-1%}#jqvmap1_ky_pin{margin-left:2%}#jqvmap1_la_pin{margin-left:-2%}#jqvmap1_mi_pin{margin-top:4%;margin-left:3%}#jqvmap1_ma_pin{margin-top:-0.25%}#jqvmap1_mn_pin{margin-top:2%;margin-left:-2%}#jqvmap1_nh_pin{margin-top:1%;margin-left:-0.25%}#jqvmap1_nj_pin{margin-top:1%}#jqvmap1_ok_pin{margin-left:2%}#jqvmap1_va_pin{margin-left:2%}#jqvmap1_wv_pin{margin-left:-1%;margin-top:1%}@media only screen and (min-width: 320px){.jqvmap-pin{font-size:6px}}@media only screen and (min-width: 480px){.jqvmap-pin{font-size:8px}}@media only screen and (min-width: 640px){.jqvmap-pin{font-size:10px}}@media only screen and (min-width: 800px){.jqvmap-pin{font-size:12px}}@media only screen and (min-width: 1024px){.jqvmap-pin{font-size:14px}}.bg-gray-900{background-color:#212830}.bg-gray-800{background-color:#313c47}.bg-gray-700{background-color:#41505f}.bg-gray-600{background-color:#6e7985}.bg-gray-500{background-color:#9ea7b1}.bg-gray-400{background-color:#ccd2da}.bg-gray-300{background-color:#e2e5ec}.bg-gray-200{background-color:#f3f5f9}.bg-gray-100{background-color:#f8f9fc}.bg-ui-02{background-color:#85b6ff}.bg-ui-03{background-color:#4c5366}.bg-pink{background-color:#ea4c89 !important}.bg-purple{background-color:#6f42c1 !important}.bg-indigo{background-color:#6610f2 !important}.bg-teal{background-color:#33d685 !important}.bg-orange{background-color:#fd7e14}.bg-twitter{background-color:#1c96e9}.bg-amazon{background-color:#f79400;color:#222e3d}.divider{position:relative;display:flex;align-items:center;margin:15px 0}.divider::before,.divider::after{content:"";flex:1;height:1px;background-color:#e2e5ec}.divider span{padding:0 10px;font-size:12px;color:#6e7985}.divider-start::before{display:none}.divider-start span{padding-left:0}.divider-end::after{display:none}.divider-end span{padding-right:0}.divider-vertical{margin:0 15px;flex-direction:column}.divider-vertical::before,.divider-vertical::after{height:100%;width:1px}.divider-vertical span{padding:5px 0}.divider-top::before{display:none}.divider-top span{padding:0 0 5px}.divider-bottom::after{display:none}.divider-bottom span{padding:5px 0 0}.mt-10-f{margin-top:10px !important}.me--10-f{margin-right:-10px !important}.ht-3{height:3px}.ht-5{height:5px}.ht-8{height:8px}.ht-10{height:10px}.ht-15{height:15px}.ht-30{height:30px}.ht-50{height:50px}.ht-100{height:100px}.ht-150{height:150px}.ht-200{height:200px}.ht-250{height:250px}.ht-300{height:300px}.ht-350{height:350px}.w-5{width:5%}.w-10{width:10%}.w-15{width:15%}.w-15{width:15%}.w-17{width:17%}.w-20{width:20%}.w-30{width:30%}.w-32{width:32%}.w-40{width:40%}.w-45{width:45%}.w-60{width:60%}.w-70{width:70%}.w-80{width:80%}.w-85{width:85%}.w-200{width:200px}.mw-200{max-width:200px}.lh-1{line-height:1}.lh-3{line-height:1.3}.lh-4{line-height:1.4}.lh-5{line-height:1.5}.fs-sm{font-size:.8125rem}@media(min-width: 576px){.fs-sm-normal{font-size:.875rem}}.fs-xs{font-size:.75rem}.fs-11{font-size:11px}.fs-15{font-size:15px}.fs-16{font-size:16px}.fs-18{font-size:18px}.fs-20{font-size:20px}.fs-24{font-size:24px}.fs-32{font-size:32px}.fs-36{font-size:36px}.fs-40{font-size:40px}.fs-44{font-size:44px}.fs-48{font-size:48px}.fw-thin{font-weight:200}.fw-light{font-weight:300}.fw-normal{font-weight:400}.fw-medium{font-weight:500}.fw-semibold{font-weight:600}.ff-sans{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"}.ff-secondary{font-family:"Archivo",sans-serif}.ff-numerals{font-family:"Inter",sans-serif}.ls--1{letter-spacing:-1px}.ls--2{letter-spacing:-2px}.text-primary-dark{color:#152661}.text-ui-02{color:#85b6ff}.ti--1{text-indent:-1px}.ti--2{text-indent:-2px}.ti--3{text-indent:-3px}[data-skin=dark] .accordion-item{background-color:inherit;border-color:#222b41}[data-skin=dark] .accordion-button{background-color:inherit;color:inherit}[data-skin=dark] .accordion-button:not(.collapsed){background-color:#192030;box-shadow:inset 0 -1px 0 #222b41}[data-skin=dark] .accordion-custom .accordion-item:not(:first-of-type){border-top-color:#222b41}[data-skin=dark] .accordion-custom .accordion-button{background-color:inherit}[data-skin=dark] .accordion-custom .accordion-button:not(.collapsed){background-color:#192030}[data-skin=dark] .accordion-custom .accordion-collapse{background-color:#192030}[data-skin=dark] .accordion-primary .accordion-button:not(.collapsed){background-color:rgba(0,0,0,0)}[data-skin=dark] .avatar.online::after,[data-skin=dark] .avatar.offline::after{box-shadow:0 0 0 1.5px #192030}[data-skin=dark] .btn-close{filter:invert(1)}[data-skin=dark] .card{background-color:#192030;border-color:#222b41}[data-skin=dark] .card-primary{background-color:#506fd9}[data-skin=dark] .card-secondary{background-color:#6e7985}[data-skin=dark] .card-success{background-color:#0cb785}[data-skin=dark] .card-warning{background-color:#ffc107}[data-skin=dark] .card-danger{background-color:#dc3545}[data-skin=dark] .card-info{background-color:#0dcaf0}[data-skin=dark] .card-dark .card-header{border-bottom-color:#222b41}[data-skin=dark] .card-light{background-color:#f8f9fc;color:#41505f}[data-skin=dark] .card-light .card-header{border-bottom-color:#e2e5ec}[data-skin=dark] .card-header{background-color:#1c2437;border-bottom-color:#222b41}[data-skin=dark] .card-header-tabs .nav-link.active{background-color:#192030;border-color:#222b41;border-bottom-color:rgba(0,0,0,0);color:#fff}[data-skin=dark] .card-footer{background-color:#1c2437;border-top-color:#222b41}[data-skin=dark] .divider::before,[data-skin=dark] .divider::after{background-color:#222b41}[data-skin=dark] .dropdown-menu{border-color:rgba(0,0,0,0);background-color:#1e273a;color:inherit;box-shadow:0 2px 10px rgba(0,0,0,.1),0 10px 20px rgba(0,0,0,.1)}[data-skin=dark] .dropdown-item{color:rgba(255,255,255,.65)}[data-skin=dark] .dropdown-item:hover,[data-skin=dark] .dropdown-item:focus{background-color:#192030;color:#fff}[data-skin=dark] .dropdown-item.disabled{opacity:.6}[data-skin=dark] .dropdown-item.active:hover,[data-skin=dark] .dropdown-item.active:focus{background-color:#506fd9}[data-skin=dark] .dropdown-header{color:rgba(255,255,255,.3)}[data-skin=dark] .dropdown-divider{opacity:.06}[data-skin=dark] .form-control,[data-skin=dark] .gridjs-input{background-color:#192030;border-color:#27314b;color:rgba(255,255,255,.65)}[data-skin=dark] .form-control:focus,[data-skin=dark] .gridjs-input:focus{box-shadow:none;background-color:#1e273a;border-color:#27314b;color:rgba(255,255,255,.65)}[data-skin=dark] .form-control:disabled,[data-skin=dark] .gridjs-input:disabled,[data-skin=dark] .form-control[readonly],[data-skin=dark] [readonly].gridjs-input{background-color:#141926}[data-skin=dark] .form-control::file-selector-button,[data-skin=dark] .gridjs-input::file-selector-button,[data-skin=dark] .form-control::-webkit-file-upload-button,[data-skin=dark] .gridjs-input::-webkit-file-upload-button{background-color:#1e273a;color:#fff}[data-skin=dark] .form-control:hover:not(:disabled):not([readonly])::file-selector-button,[data-skin=dark] .gridjs-input:hover:not(:disabled):not([readonly])::file-selector-button{background-color:#192030}[data-skin=dark] .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button,[data-skin=dark] .gridjs-input:hover:not(:disabled):not([readonly])::-webkit-file-upload-button{background-color:#192030}[data-skin=dark] .form-control::placeholder,[data-skin=dark] .gridjs-input::placeholder{color:rgba(255,255,255,.3)}[data-skin=dark] .form-select{background-color:#192030;border-color:#27314b;color:rgba(255,255,255,.65)}[data-skin=dark] .form-select:focus{box-shadow:none;border-color:#2d3855}[data-skin=dark] .form-select:disabled{background-color:#141926}[data-skin=dark] .form-check-input{border-color:#27314b;background-color:#141926}[data-skin=dark] .form-check-input:focus{border-color:#2d3855}[data-skin=dark] .form-switch .form-check-input{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'><circle r='3' fill='rgba(255,255,255,0.45)'/></svg>")}[data-skin=dark] .form-range::-webkit-slider-runnable-track,[data-skin=dark] .form-range::-moz-range-track{background-color:#222b41}[data-skin=dark] .input-group-text{background-color:#1c2335;border-color:#27314b;color:inherit}[data-skin=dark] .form-search{background-color:#192030;border:1px solid #27314b;box-shadow:none}[data-skin=dark] .form-search.onfocus{background-color:#1e273a}[data-skin=dark] .img-thumbnail{background-color:#1e273a;border-color:#27314b}[data-skin=dark] .list-group-item{border-color:#222b41;background-color:rgba(0,0,0,0);color:inherit}[data-skin=dark] .list-group-item.disabled{background-color:#141926;color:rgba(255,255,255,.3)}[data-skin=dark] .marker{background-color:#141926;color:inherit}[data-skin=dark] .marker-ribbon{background-color:#141926;border-color:#27314b}[data-skin=dark] .marker-ribbon.top-left::before{border-right-color:#27314b;left:-11px}[data-skin=dark] .marker-ribbon.top-right::before{border-left-color:#27314b;right:-11px}[data-skin=dark] .modal-content{background-color:#1e273a}[data-skin=dark] .modal-header{border-bottom-color:#27314b}[data-skin=dark] .modal-title{color:#fff}[data-skin=dark] .modal-footer{border-top-color:#27314b}[data-skin=dark] .nav-sidebar .nav-link:not(.active){color:inherit}[data-skin=dark] .navbar-light .navbar-brand{color:#fff}[data-skin=dark] .navbar-light .navbar-nav .nav-link{color:inherit}[data-skin=dark] .navbar-light .navbar-nav .nav-link:hover,[data-skin=dark] .navbar-light .navbar-nav .nav-link:focus{color:#fff}[data-skin=dark] .navbar-light .navbar-nav .nav-link.active{color:#fff}[data-skin=dark] .nav-icon .nav-link:hover,[data-skin=dark] .nav-icon .nav-link:focus{color:#fff}[data-skin=dark] .nav-line{border-bottom-color:#222b41}[data-skin=dark] .nav-line .nav-link{color:inherit}[data-skin=dark] .nav-line .nav-link:hover,[data-skin=dark] .nav-line .nav-link:focus{color:rgba(255,255,255,.75)}[data-skin=dark] .nav-line .nav-link.active{color:#fff}[data-skin=dark] .nav-classic .nav-link+.nav-link{border-top-color:#2b3651}[data-skin=dark] .nav-classic .badge{color:rgba(255,255,255,.65)}[data-skin=dark] .offcanvas{background-color:#192030}[data-skin=dark] .offcanvas-title{color:#fff}[data-skin=dark] .page-link{background-color:#141926;border-color:#222b41}[data-skin=dark] .page-link:hover,[data-skin=dark] .page-link:focus{background-color:#192030;border-color:#27314b}[data-skin=dark] .page-item.disabled .page-link{background-color:#192030;border-color:#222b41;color:rgba(255,255,255,.3)}[data-skin=dark] .pagination-filled .page-item.disabled .page-link{background-color:#141926}[data-skin=dark] .pagination-filled .page-item:not(.active) .page-link:hover{background-color:#222b41}[data-skin=dark] .pagination-filled .page-link{border-width:0;background-color:#192030;color:#6e7985}[data-skin=dark] .popover{background-color:#192030;border-color:#27314b}[data-skin=dark] .bs-popover-top>.popover-arrow::before,[data-skin=dark] .bs-popover-auto[data-popper-placement^=top]>.popover-arrow::before{border-top-color:#27314b}[data-skin=dark] .bs-popover-top>.popover-arrow::after,[data-skin=dark] .bs-popover-auto[data-popper-placement^=top]>.popover-arrow::after{border-top-color:#192030}[data-skin=dark] .bs-popover-end>.popover-arrow::before,[data-skin=dark] .bs-popover-auto[data-popper-placement^=right]>.popover-arrow::before{border-right-color:#27314b}[data-skin=dark] .bs-popover-end>.popover-arrow::after,[data-skin=dark] .bs-popover-auto[data-popper-placement^=right]>.popover-arrow::after{border-right-color:#192030}[data-skin=dark] .bs-popover-bottom>.popover-arrow::before,[data-skin=dark] .bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::before{border-bottom-color:#27314b}[data-skin=dark] .bs-popover-bottom>.popover-arrow::after,[data-skin=dark] .bs-popover-auto[data-popper-placement^=bottom]>.popover-arrow::after{border-bottom-color:#192030}[data-skin=dark] .bs-popover-start>.popover-arrow::before,[data-skin=dark] .bs-popover-auto[data-popper-placement^=left]>.popover-arrow::before{border-left-color:#27314b}[data-skin=dark] .bs-popover-start>.popover-arrow::after,[data-skin=dark] .bs-popover-auto[data-popper-placement^=left]>.popover-arrow::after{border-left-color:#192030}[data-skin=dark] .popover-header{background-color:#192030;border-bottom-color:#27314b;color:#fff}[data-skin=dark] .popover-body{color:inherit}[data-skin=dark] .progress{background-color:#222b41}[data-skin=dark] .toast{background-color:rgba(34,43,65,.85)}[data-skin=dark] .toast-header{background-color:rgba(39,50,75,.85)}[data-skin=dark] .table{color:inherit}[data-skin=dark] .table th,[data-skin=dark] .table td{border-color:#222b41}[data-skin=dark] .table:not(.table-borderless)>:not(:first-child){border-top-color:#222b41}[data-skin=dark] .table-striped>tbody>tr:nth-of-type(2n+1)>*{box-shadow:inset 0 0 0 9999px rgba(34,43,65,.6);color:inherit}[data-skin=dark] .table-hover>tbody>tr:hover>*{box-shadow:inset 0 0 0 9999px rgba(34,43,65,.85);color:inherit}[data-skin=dark] .table-active{color:inherit}[data-skin=dark] .table-active td,[data-skin=dark] .table-active th{box-shadow:inset 0 0 0 9999px rgba(34,43,65,.85)}[data-skin=dark] .table-primary tbody th,[data-skin=dark] .table-primary tbody td,[data-skin=dark] .table-secondary tbody th,[data-skin=dark] .table-secondary tbody td,[data-skin=dark] .table-success tbody th,[data-skin=dark] .table-success tbody td,[data-skin=dark] .table-warning tbody th,[data-skin=dark] .table-warning tbody td,[data-skin=dark] .table-danger tbody th,[data-skin=dark] .table-danger tbody td,[data-skin=dark] .table-info tbody th,[data-skin=dark] .table-info tbody td{border-color:#141926}[data-skin=dark] .table-primary td,[data-skin=dark] .table-primary th{background-color:#506fd9}[data-skin=dark] .table-secondary td,[data-skin=dark] .table-secondary th{background-color:#6e7985}[data-skin=dark] .table-success td,[data-skin=dark] .table-success th{background-color:#0cb785}[data-skin=dark] .table-warning td,[data-skin=dark] .table-warning th{background-color:#ffc107}[data-skin=dark] .table-danger td,[data-skin=dark] .table-danger th{background-color:#dc3545}[data-skin=dark] .table-info td,[data-skin=dark] .table-info th{background-color:#0dcaf0}[data-skin=dark] .table-bordered{border-color:#222b41}[data-skin=dark] .gridjs-pages button:disabled{border-color:#222b41}[data-skin=dark] .gridjs-input{background-color:#141926;border-color:#222b41;color:#fff}[data-skin=dark] .gridjs-input:focus{box-shadow:none;background-color:#192030;border-color:#ebedf2;color:#fff}[data-skin=dark] .gridjs-input::placeholder{opacity:.6}[data-skin=dark] body{background-color:#141926;color:rgba(255,255,255,.6)}[data-skin=dark] .sidebar:not(.sidebar-prime){background-color:#192030;box-shadow:none;border-right:1px solid #222b41}[data-skin=dark] .sidebar:not(.sidebar-prime)::before{background-color:rgba(11,14,21,.75)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-logo{color:#fff}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-header{border-bottom-color:#222b41}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-body .nav-group{border-bottom-color:#222b41}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-body .nav-label{color:rgba(255,255,255,.25)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-body>.ps__rail-y{background-color:rgba(255,255,255,.05)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-body>.ps__rail-y>.ps__thumb-y{background-color:rgba(255,255,255,.2)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link{color:rgba(255,255,255,.6)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link:hover,[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link:focus{color:rgba(255,255,255,.85)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.active{color:#506fd9;font-weight:400}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.has-sub::after{color:rgba(255,255,255,.6)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-sub-link{color:rgba(255,255,255,.5)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-sub-link::before{background-color:rgba(255,255,255,.4)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-sub-link.active{color:rgba(255,255,255,.85)}[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-sub-link.active::before{background-color:#506fd9}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer{background-color:#192030;border-top-color:#222b41;box-shadow:none}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer .dropdown-link{color:rgba(255,255,255,.6)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer .dropdown-link:hover,[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer .dropdown-link:focus{background-color:#1e273a;color:#fff}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-body h6 a,[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-body .h6 a{color:#fff}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-body p{color:rgba(255,255,255,.4)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-menu a{color:rgba(255,255,255,.6)}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-menu a:hover,[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-menu a:focus{background-color:#1d2437;color:#fff}[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer-menu hr{background-color:#fff;opacity:.1}[data-skin=dark] .sidebar-prime .nav-sidebar .nav-link:hover,[data-skin=dark] .sidebar-prime .nav-sidebar .nav-link:focus{background-color:rgba(0,0,0,0);color:#fff}[data-skin=dark] .header-main{background-color:#192030;border-bottom-color:rgba(255,255,255,.06);border-left-width:0}[data-skin=dark] .header-main .menu-link{color:rgba(255,255,255,.65)}[data-skin=dark] .header-main .menu-link:hover,[data-skin=dark] .header-main .menu-link:focus{color:#fff}[data-skin=dark] .header-main .form-search{background-color:#1e273a;border-width:0}[data-skin=dark] .header-main .form-search.onfocus{background-color:#222b41}[data-skin=dark] .header-main .form-search i{color:#fff}[data-skin=dark] .header-main .form-search .form-control,[data-skin=dark] .header-main .form-search .gridjs-input{background-color:rgba(0,0,0,0);color:#fff}[data-skin=dark] .header-main .form-search .form-control::placeholder,[data-skin=dark] .header-main .form-search .gridjs-input::placeholder{color:rgba(255,255,255,.3)}[data-skin=dark] .header-main .dropdown-link{color:rgba(255,255,255,.65)}[data-skin=dark] .header-main .dropdown-link:hover,[data-skin=dark] .header-main .dropdown-link:focus{color:#fff}[data-skin=dark] .header-main .dropdown-link small,[data-skin=dark] .header-main .dropdown-link .small{box-shadow:0 0 0 1px #141926}[data-skin=dark] .dropdown-skin .dropdown-menu{background-color:#1e273a;box-shadow:0 2px 10px rgba(0,0,0,.1),0 10px 20px rgba(0,0,0,.1)}[data-skin=dark] .dropdown-skin .dropdown-menu hr{border-color:#2b3651;opacity:1}[data-skin=dark] .nav-skin .nav-link{border-color:#344162;color:rgba(255,255,255,.6)}[data-skin=dark] .nav-skin .nav-link:hover,[data-skin=dark] .nav-skin .nav-link:focus{border-color:#3c4c73;background-color:#2b3651;color:rgba(255,255,255,.75)}[data-skin=dark] .nav-skin .nav-link.active{border-color:#506fd9;background-color:#506fd9;color:#fff}[data-skin=dark] .dropdown-notification .dropdown-menu{background-color:#1e273a;box-shadow:0 2px 10px rgba(0,0,0,.1),0 10px 20px rgba(0,0,0,.1)}[data-skin=dark] .dropdown-notification .dropdown-menu-header{border-bottom-color:#2b3651}[data-skin=dark] .dropdown-notification .dropdown-menu-title{color:#fff}[data-skin=dark] .dropdown-notification .dropdown-menu-footer{border-top-color:#2b3651}[data-skin=dark] .dropdown-notification .list-group-item:hover,[data-skin=dark] .dropdown-notification .list-group-item:focus{background-color:#192030}[data-skin=dark] .dropdown-notification .list-group-body{color:rgba(255,255,255,.6)}[data-skin=dark] .dropdown-profile .dropdown-menu{background-color:#1e273a;box-shadow:0 2px 10px rgba(0,0,0,.1),0 10px 20px rgba(0,0,0,.1)}[data-skin=dark] .dropdown-profile .nav a{color:rgba(255,255,255,.6)}[data-skin=dark] .dropdown-profile .nav a:hover,[data-skin=dark] .dropdown-profile .nav a:focus{background-color:#222b41;color:#fff}[data-skin=dark] .dropdown-profile hr{background-color:#222b41}[data-skin=dark] .main-title{color:#fff}[data-skin=dark] .main-separator{background-color:#222b41}[data-skin=dark] .main-footer{color:inherit;border-top-color:#222b41}[data-skin=dark] .section-title{color:#fff}[data-skin=dark] .main-label-group label{color:#fff}[data-skin=dark] .main-backdrop{background-color:rgba(20,25,38,.85)}[data-skin=dark] .select2-container--default .select2-results__option--selected{background-color:#141926}[data-skin=dark] .select2-container--default .select2-selection--single{background-color:#192030;border-color:#222b41}[data-skin=dark] .select2-container--default .select2-selection--single .select2-selection__rendered{color:inherit}[data-skin=dark] .select2-container--default .select2-selection--single .select2-selection__placeholder{color:rgba(255,255,255,.3)}[data-skin=dark] .select2-container--default .select2-selection--single .select2-selection__clear{color:rgba(255,255,255,.5)}[data-skin=dark] .select2-container--default .select2-selection--single .select2-selection__clear:hover{color:rgba(255,255,255,.75)}[data-skin=dark] .select2-container--default .select2-selection--multiple{background-color:#192030;border-color:#222b41}[data-skin=dark] .select2-container--default.select2-container--focus .select2-selection--multiple{border-color:#27314b}[data-skin=dark] .select2-container--default .select2-search--dropdown .select2-search__field{border-color:rgba(0,0,0,0);background-color:#141926;outline:none}[data-skin=dark] .select2-container--default .select2-search--dropdown .select2-search__field::placeholder{color:rgba(255,255,255,.3)}[data-skin=dark] .select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#506fd9}[data-skin=dark] .select2-container--default .select2-search--inline .select2-search__field::placeholder{color:rgba(255,255,255,.3)}[data-skin=dark] .select2-container--default.select2-container--disabled .select2-selection--single{background-color:#141926}[data-skin=dark] .select2-container--open .select2-selection--single,[data-skin=dark] .select2-container--open .select2-selection--multiple{background-color:#192030;border-color:#222b41}[data-skin=dark] .select2-dropdown{border-color:rgba(0,0,0,0);background-color:#222b41}[data-skin=dark] .bootstrap-tagsinput{background-color:#192030;border-color:#27314b}[data-skin=dark] .irs--flat .irs-min,[data-skin=dark] .irs--flat .irs-max{color:inherit;background-color:#222b41}[data-skin=dark] .irs--flat .irs-line{background-color:#222b41}[data-skin=dark] .irs--flat .irs-grid-text{color:inherit}[data-skin=dark] .irs--flat .irs-grid-pol{background-color:#222b41}[data-skin=dark] .irs--round .irs-line{background-color:#222b41}[data-skin=dark] .irs--round .irs-min,[data-skin=dark] .irs--round .irs-max{background-color:#192030;color:inherit}[data-skin=dark] .irs--round .irs-grid-text{color:inherit}[data-skin=dark] .irs--round .irs-grid-pol{background-color:#222b41}[data-skin=dark] .irs--square .irs-line,[data-skin=dark] .irs--square .irs-grid-pol{background-color:#222b41}[data-skin=dark] .irs--square .irs-min,[data-skin=dark] .irs--square .irs-max{background-color:#222b41;color:#6e7985}[data-skin=dark] .irs--square .irs-grid-text{color:#6e7985}[data-skin=dark] .irs--square .irs-from,[data-skin=dark] .irs--square .irs-to{background-color:#506fd9}[data-skin=dark] .irs--square .irs-handle{border-color:#506fd9}[data-skin=dark] .irs--square .irs-bar{background-color:#506fd9}[data-skin=dark] .ui-datepicker{background-color:#192030;border-color:#27314b}[data-skin=dark] .ui-datepicker .ui-datepicker-header .ui-datepicker-prev,[data-skin=dark] .ui-datepicker .ui-datepicker-header .ui-datepicker-next{color:rgba(255,255,255,.6)}[data-skin=dark] .ui-datepicker .ui-datepicker-title{color:#fff}[data-skin=dark] .ui-datepicker .ui-datepicker-calendar th{color:rgba(255,255,255,.6);font-weight:400}[data-skin=dark] .ui-datepicker .ui-datepicker-calendar td{background-color:rgba(0,0,0,0);border-color:#222b41}[data-skin=dark] .ui-datepicker .ui-datepicker-calendar td a{color:rgba(255,255,255,.6)}[data-skin=dark] .ui-datepicker .ui-datepicker-calendar td a:hover,[data-skin=dark] .ui-datepicker .ui-datepicker-calendar td a:focus{background-color:#1e273a;color:#fff}[data-skin=dark] .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-other-month .ui-state-default{color:rgba(255,255,255,.3)}[data-skin=dark] .ui-datepicker select.ui-datepicker-month,[data-skin=dark] .ui-datepicker select.ui-datepicker-year{background-color:rgba(0,0,0,0);border-color:#222b41;color:rgba(255,255,255,.65)}[data-skin=dark] .sp-replacer{background-color:#141926;border-color:#222b41}[data-skin=dark] .sp-replacer:hover,[data-skin=dark] .sp-replacer:focus{border-color:#2b3651}[data-skin=dark] .sp-dd{color:rgba(255,255,255,.3)}[data-skin=dark] .sp-container{background-color:#1e273a;border-color:#2d3855;box-shadow:none}[data-skin=dark] .wizard{background-color:#192030;border-color:#27314b}[data-skin=dark] .wizard>.content{border-top-color:#222b41;border-bottom-color:#222b41}[data-skin=dark] .wizard>.content>.title{color:#fff}[data-skin=dark] .wizard>.actions .disabled a,[data-skin=dark] .wizard>.actions .disabled a:hover,[data-skin=dark] .wizard>.actions .disabled a:focus{background-color:#222b41;color:rgba(255,255,255,.3)}[data-skin=dark] .wizard>.steps .disabled a .number{border-color:#2b3651}[data-skin=dark] .wizard>.steps .disabled a:hover .number,[data-skin=dark] .wizard>.steps .disabled a:focus .number{border-color:#344162}[data-skin=dark] .wizard.vertical>.steps ul li+li::before{border-color:#222b41}@media(min-width: 576px){[data-skin=dark] .wizard.vertical>.content,[data-skin=dark] .wizard.vertical>.actions{border-left-color:#222b41}}@media(min-width: 768px){[data-skin=dark] .wizard.vertical>.actions{border-top-color:#222b41}}[data-skin=dark] .wizard-tab{background-color:rgba(0,0,0,0)}[data-skin=dark] .wizard-tab>.actions{border-top-color:#222b41}[data-skin=dark] .wizard-tab>.steps .disabled a{background-color:#222b41}[data-skin=dark] .ql-snow.ql-toolbar{background-color:#192030;border-color:#222b41}[data-skin=dark] .ql-snow.ql-toolbar button:hover,[data-skin=dark] .ql-snow.ql-toolbar button:focus{background-color:#222b41}[data-skin=dark] .ql-snow.ql-toolbar button.ql-active{background-color:#222b41}[data-skin=dark] .ql-snow.ql-toolbar .ql-picker{color:rgba(255,255,255,.6)}[data-skin=dark] .ql-snow.ql-toolbar .ql-stroke{stroke:rgba(255,255,255,.6)}[data-skin=dark] .ql-snow.ql-toolbar .ql-fill{fill:rgba(255,255,255,.6)}[data-skin=dark] .ql-snow.ql-toolbar .ql-picker.ql-expanded .ql-picker-label{background-color:#192030;border-color:#222b41}[data-skin=dark] .ql-snow.ql-toolbar .ql-picker.ql-expanded .ql-picker-label::before{color:rgba(255,255,255,.6)}[data-skin=dark] .ql-snow.ql-toolbar .ql-font.ql-picker:hover,[data-skin=dark] .ql-snow.ql-toolbar .ql-font.ql-picker:focus{background-color:#192030}[data-skin=dark] .ql-snow.ql-container{border-color:#27314b}[data-skin=dark] .ql-editor{background-color:#141926;color:inherit}[data-skin=dark] .card-one{box-shadow:none}[data-skin=dark] .card-one .card-header{border-bottom-color:#222b41}[data-skin=dark] .card-one .card-header .card-title{color:#fff}[data-skin=dark] .card-one small,[data-skin=dark] .card-one .small{color:inherit}[data-skin=dark] .card-one .people-item+.people-item{border-top-color:#222b41}[data-skin=dark] .card-one .card-footer{border-top-color:#222b41}[data-skin=dark] .card-one .list-group-item{border-color:#27314b}[data-skin=dark] .card-value{color:#fff}[data-skin=dark] .earning-item h4,[data-skin=dark] .earning-item .h4{color:#fff}[data-skin=dark] .earning-item h4 span,[data-skin=dark] .earning-item .h4 span{color:rgba(255,255,255,.65)}[data-skin=dark] .earning-item label{color:inherit}[data-skin=dark] .table-one tbody td,[data-skin=dark] .table-two tbody td{border-color:#222b41}[data-skin=dark] .progress-one .progress-bar+.progress-bar{border-left-color:#192030}[data-skin=dark] .table-three tbody td:nth-child(2),[data-skin=dark] .table-three tbody td:nth-child(3){color:#fff}[data-skin=dark] .table-three tbody td{border-color:#27314b}[data-skin=dark] .table-three tbody td:nth-child(2),[data-skin=dark] .table-three tbody td:nth-child(3){color:#fff}[data-skin=dark] .table-four thead th{background-color:#141926}[data-skin=dark] .card-footer-crypto strong{color:#fff}[data-skin=dark] .table-five tbody td{border-color:#27314b}[data-skin=dark] .news-item+.news-item{border-top-color:#27314b}[data-skin=dark] .finance-info{background-image:none}[data-skin=dark] .finance-value{color:#fff}[data-skin=dark] .finance-value span{color:rgba(255,255,255,.75)}[data-skin=dark] .card-wallet .card-value{color:#fff}[data-skin=dark] .card-wallet .badge-dot{background-color:#fff}[data-skin=dark] .card-wallet .card-body h5,[data-skin=dark] .card-wallet .card-body .h5{color:#fff}[data-skin=dark] .flot-chart-eight .flot-tick-label,[data-skin=dark] .flot-chart-nine .flot-tick-label{color:rgba(255,255,255,.6)}[data-skin=dark] .finance-item-circle{background-color:#232d44}[data-skin=dark] .finance-item-circle h1,[data-skin=dark] .finance-item-circle .h1{color:#fff}[data-skin=dark] .finance-item-circle label{color:rgba(255,255,255,.75)}[data-skin=dark] .table-ratings tbody td{border-color:#27314b}[data-skin=dark] .table-ratings tbody td strong{color:#fff}[data-skin=dark] .table-ratings tbody td:nth-child(3){color:rgba(255,255,255,.75)}[data-skin=dark] .table-agent tbody td{border-color:#27314b}[data-skin=dark] .table-agent h6,[data-skin=dark] .table-agent .h6{color:#fff}[data-skin=dark] .events-reviews li{border-top-color:#27314b}[data-skin=dark] .events-reviews p{color:inherit}[data-skin=dark] .events-body .ev-item{background-color:#222b41;border-left-color:#344162}[data-skin=dark] .events-body .ev-item h6,[data-skin=dark] .events-body .ev-item .h6{color:#fff}[data-skin=dark] .events-body .ev-item p{color:inherit}[data-skin=dark] .event-date{background-color:#2a3652;color:#fff}[data-skin=dark] .flot-chart-fourteen .flot-tick-label{color:rgba(255,255,255,.65)}[data-skin=dark] .storage-item .storage-icon{background-color:#222b41}[data-skin=dark] .card-article .card-title{color:#fff}[data-skin=dark] .product-wrapper{background-color:#222b41}[data-skin=dark] .revenue-item-body span:nth-child(2){color:#fff}[data-skin=dark] .total-sales-body{background-image:none}[data-skin=dark] .page-app .dropdown-menu{box-shadow:none}[data-skin=dark] .music-title a{color:#fff}[data-skin=dark] .music-text{color:inherit}[data-skin=dark] .app-music .main-label-group label{color:#fff}[data-skin=dark] .app-music .sidebar-right .nav-link{color:inherit}[data-skin=dark] .card-album{box-shadow:none}[data-skin=dark] .table-music tbody tr{box-shadow:none}[data-skin=dark] .table-music tbody td{background-color:#192030}[data-skin=dark] .music-player{background-color:#192030;box-shadow:none}[data-skin=dark] .nav-player .nav-link{color:inherit}[data-skin=dark] .music-volume a{color:inherit}[data-skin=dark] .media-music h6 a,[data-skin=dark] .media-music .h6 a{color:#fff}[data-skin=dark] .media-music span{color:inherit}[data-skin=dark] .music-range .progress{background-color:#222b41}[data-skin=dark] .music-volume .progress{background-color:#222b41}[data-skin=dark] .card-video{box-shadow:none}[data-skin=dark] .card-video .card-title a{color:#fff}[data-skin=dark] .app-video .main-label-group label{color:#fff}[data-skin=dark] .card-video-item{box-shadow:none}[data-skin=dark] .card-video-item .card-title a{color:#fff}[data-skin=dark] .card-movie{box-shadow:none}[data-skin=dark] .card-movie .card-title a{color:#fff}[data-skin=dark] .card-poster{box-shadow:none}[data-skin=dark] .card-task{box-shadow:none}[data-skin=dark] .card-task:hover,[data-skin=dark] .card-task:focus{border-color:#506fd9}[data-skin=dark] .card-task .card-title{color:#fff}[data-skin=dark] .task-calendar .ui-datepicker-inline{box-shadow:none}[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td{border-color:#27314b}[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td a:hover,[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td a:focus,[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today a:hover,[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td.ui-datepicker-today a:focus{background-color:#222b41}[data-skin=dark] .contact-body{background-color:#192030;box-shadow:none}@media(min-width: 768px){[data-skin=dark] .contact-list{border-right-color:#27314b}}[data-skin=dark] .contact-list-header{background-color:inherit;border-bottom-color:#27314b}[data-skin=dark] .contact-list-header .sidebar-title{color:#fff}[data-skin=dark] .contact-sidebar .nav-sidebar .nav-link:not(.active){color:inherit}[data-skin=dark] .contact-sidebar .nav-sidebar .nav-link:not(.active):hover,[data-skin=dark] .contact-sidebar .nav-sidebar .nav-link:not(.active):focus{background-color:#192030;color:#fff}[data-skin=dark] .contact-group .contact-item:not(.selected):hover,[data-skin=dark] .contact-group .contact-item:not(.selected):focus{background-color:#1e273a}[data-skin=dark] .contact-group .contact-item-body h6,[data-skin=dark] .contact-group .contact-item-body .h6{color:#fff}[data-skin=dark] .contact-content hr{opacity:.1}[data-skin=dark] .contact-content .nav-sidebar .nav-link{color:inherit}[data-skin=dark] .contact-content .nav-sidebar .nav-link:hover,[data-skin=dark] .contact-content .nav-sidebar .nav-link:focus{background-color:#1e273a;color:#fff}[data-skin=dark] .chat-panel{background-color:#192030;box-shadow:none}[data-skin=dark] .chat-sidebar{background-color:rgba(0,0,0,0)}@media(min-width: 768px){[data-skin=dark] .chat-sidebar{border-right-color:#27314b}}[data-skin=dark] .chat-sidebar .sidebar-header{background-color:rgba(0,0,0,0);border-bottom-color:#27314b}[data-skin=dark] .chat-sidebar .sidebar-title{color:#fff}[data-skin=dark] .chat-group .chat-item:not(.selected):hover,[data-skin=dark] .contact-group .chat-item:not(.selected):hover,[data-skin=dark] .chat-group .contact-item:not(.selected):hover,[data-skin=dark] .contact-group .contact-item:not(.selected):hover,[data-skin=dark] .chat-group .chat-item:not(.selected):focus,[data-skin=dark] .contact-group .chat-item:not(.selected):focus,[data-skin=dark] .chat-group .contact-item:not(.selected):focus,[data-skin=dark] .contact-group .contact-item:not(.selected):focus{background-color:#1e273a}[data-skin=dark] .chat-group .chat-item-body h6,[data-skin=dark] .contact-group .chat-item-body h6,[data-skin=dark] .chat-group .contact-item-body h6,[data-skin=dark] .contact-group .contact-item-body h6,[data-skin=dark] .chat-group .chat-item-body .h6,[data-skin=dark] .contact-group .chat-item-body .h6,[data-skin=dark] .chat-group .contact-item-body .h6,[data-skin=dark] .contact-group .contact-item-body .h6{color:#fff}[data-skin=dark] .chat-body-header{background-color:rgba(0,0,0,0);border-bottom-color:#27314b}[data-skin=dark] .chat-body-header .chat-item-body h6,[data-skin=dark] .chat-body-header .contact-item-body h6,[data-skin=dark] .chat-body-header .chat-item-body .h6,[data-skin=dark] .chat-body-header .contact-item-body .h6{color:#fff}[data-skin=dark] .msg-bubble{background-color:#1e273a}[data-skin=dark] .chat-body-footer{border-top-color:#27314b;background-color:rgba(0,0,0,0)}[data-skin=dark] .msg-box .form-control,[data-skin=dark] .msg-box .gridjs-input{background-color:#1e273a}[data-skin=dark] .msg-box .form-control:focus,[data-skin=dark] .msg-box .gridjs-input:focus{background-color:#232d44;border-color:rgba(0,0,0,0)}[data-skin=dark] .calendar-sidebar .sidebar-body .event-body h6 a,[data-skin=dark] .calendar-sidebar .sidebar-body .event-body .h6 a{color:#fff}[data-skin=dark] .nav-calendar .nav-link{color:inherit}[data-skin=dark] .nav-calendar .nav-link:hover,[data-skin=dark] .nav-calendar .nav-link:focus{color:#fff}[data-skin=dark] .calendar-body .fc-col-header th a{color:rgba(255,255,255,.65)}[data-skin=dark] .calendar-body .fc-button-primary{background-color:rgba(0,0,0,0);border-color:#27314b}[data-skin=dark] .calendar-body .fc-button-primary:hover,[data-skin=dark] .calendar-body .fc-button-primary:focus{background-color:#1e273a;border-color:#2d3855;color:#fff}[data-skin=dark] .calendar-body .fc-button-primary:disabled{background-color:rgba(0,0,0,0);color:rgba(255,255,255,.3);border-color:#222b41}[data-skin=dark] .calendar-body .fc-toolbar-title{color:#fff}[data-skin=dark] .calendar-body .fc-scrollgrid{background-color:#192030;border-color:#27314b}[data-skin=dark] .calendar-body .fc-col-header th{border-color:#27314b}[data-skin=dark] .calendar-body .fc-daygrid-day{border-color:#27314b}[data-skin=dark] .calendar-body .fc-daygrid-dot-event{color:rgba(255,255,255,.65)}[data-skin=dark] .calendar-body .fc-daygrid-dot-event .fc-event-title{color:rgba(255,255,255,.6)}[data-skin=dark] .calendar-body .fc-daygrid-dot-event:hover,[data-skin=dark] .calendar-body .fc-daygrid-dot-event:focus{background-color:#222b41;color:#fff}[data-skin=dark] .calendar-body .fc-daygrid-dot-event:hover .fc-event-title,[data-skin=dark] .calendar-body .fc-daygrid-dot-event:focus .fc-event-title{color:#fff}[data-skin=dark] .calendar-body .fc-daygrid-day-number{color:rgba(255,255,255,.65)}[data-skin=dark] .fc-theme-standard th,[data-skin=dark] .fc-theme-standard td{border-color:#27314b}[data-skin=dark] .task-calendar .ui-datepicker .ui-datepicker-calendar td:last-child{border-color:#27314b}[data-skin=dark] .modal-event .date-item span{color:#fff}[data-skin=dark] .modal-event p{color:#fff}@media(min-width: 768px){[data-skin=dark] .email-sidebar{border-right-color:#222b41}}[data-skin=dark] .email-sidebar hr{opacity:.1}@media(min-width: 768px){[data-skin=dark] .email-list{border-right-color:#222b41}}[data-skin=dark] .email-list-header{border-bottom-color:#222b41}[data-skin=dark] .email-list-header h5,[data-skin=dark] .email-list-header .h5{color:#fff}[data-skin=dark] .email-list-label{border-bottom-color:#222b41}[data-skin=dark] .email-item{border-bottom-color:#222b41}[data-skin=dark] .email-item:hover,[data-skin=dark] .email-item:focus{background-color:#181d2d}[data-skin=dark] .email-item.unread{background-color:#192030}[data-skin=dark] .email-item.unread .email-item-sender{color:#fff}[data-skin=dark] .email-item.unread .email-item-summary{color:#fff}[data-skin=dark] .email-item.selected{background-color:#1e273a}[data-skin=dark] .email-content-empty{color:inherit}[data-skin=dark] .email-content-header{border-bottom-color:#222b41}[data-skin=dark] .email-content-header .nav-link{color:inherit}[data-skin=dark] .email-content-body hr{opacity:.1}[data-skin=dark] .card-attachment{box-shadow:none}[data-skin=dark] .card-attachment .card-content h6 a,[data-skin=dark] .card-attachment .card-content .h6 a{color:#fff}[data-skin=dark] .compose-wrapper .ql-editor{box-shadow:none}@media(min-width: 992px){[data-skin=dark] .file-sidebar{border-right-color:#222b41}}[data-skin=dark] .card-file{box-shadow:none}[data-skin=dark] .card-file .card-body h6 a,[data-skin=dark] .card-file .card-body .h6 a{color:#fff}[data-skin=dark] .card-file .card-file-icon{background-color:#222b41}[data-skin=dark] .card-folder{box-shadow:none}[data-skin=dark] .card-folder .card-body h6 a,[data-skin=dark] .card-folder .card-body .h6 a{color:#fff}[data-skin=dark] .table-files tbody tr{box-shadow:none}[data-skin=dark] .table-files tbody tr td{background-color:#192030}[data-skin=dark] .table-files .file-name a{color:#fff}[data-skin=dark] .media-profile .media-name{color:#fff}[data-skin=dark] .profile-item-body p{color:#fff}[data-skin=dark] .profile-item-body span{color:inherit}[data-skin=dark] .post-bar{border:1px solid #27314b;background-color:#192030;box-shadow:none}[data-skin=dark] .post-bar-item+.post-bar-item{border-left-color:#27314b}[data-skin=dark] .post-bar-item a{color:inherit}[data-skin=dark] .card-post{box-shadow:none}[data-skin=dark] .card-post .card-header{border-bottom-color:#27314b}[data-skin=dark] .card-post .card-title{color:#fff}[data-skin=dark] .card-post .link-more{color:inherit}[data-skin=dark] .card-post .link-more:hover,[data-skin=dark] .card-post .link-more:focus{color:#fff}[data-skin=dark] .card-post .card-footer{border-top-color:#27314b}[data-skin=dark] .card-post .card-footer .nav-link{color:inherit}[data-skin=dark] .post-content h6,[data-skin=dark] .post-content .h6{color:#fff}[data-skin=dark] .post-content span{color:inherit}[data-skin=dark] .post-date{color:inherit}[data-skin=dark] .post-preview{background-color:#222b41}[data-skin=dark] .post-preview h5,[data-skin=dark] .post-preview .h5{color:#fff}[data-skin=dark] .post-preview p{color:inherit}[data-skin=dark] .post-preview span{color:inherit;opacity:.65}[data-skin=dark] .experience-body h5,[data-skin=dark] .experience-body .h5,[data-skin=dark] .interest-body h6,[data-skin=dark] .interest-body .h6{color:#fff}[data-skin=dark] .profile-mutual h6,[data-skin=dark] .profile-mutual .h6{color:#fff}[data-skin=dark] .mutual-group .avatar{box-shadow:0 0 0 2px #141926}[data-skin=dark] .people-body h6 a,[data-skin=dark] .people-body .h6 a{color:#fff}[data-skin=dark] .card-people{box-shadow:none}[data-skin=dark] .card-people h6 a,[data-skin=dark] .card-people .h6 a{color:#fff}[data-skin=dark] .card-people p{color:inherit}[data-skin=dark] .activity-group{border-left-color:#222b41}[data-skin=dark] .activity-date::before{border-top-color:#222b41}[data-skin=dark] .card-comment{box-shadow:none;color:inherit}[data-skin=dark] .card-comment strong{color:#fff}[data-skin=dark] .card-event{box-shadow:none}[data-skin=dark] .card-event h6 a,[data-skin=dark] .card-event .h6 a{color:#fff}[data-skin=dark] .event-body h6 a,[data-skin=dark] .event-body .h6 a{color:#fff}[data-skin=dark] .event-body p{color:inherit}[data-skin=dark] .mutual-badge ul .avatar{border-color:#141926}[data-skin=dark] .card-settings{box-shadow:none}[data-skin=dark] .card-settings .card-title{color:#fff}[data-skin=dark] .card-settings .card-text{color:inherit}[data-skin=dark] .card-settings .card-header{border-bottom-color:#27314b}[data-skin=dark] .setting-item h6,[data-skin=dark] .setting-item .h6{color:#fff}[data-skin=dark] .setting-item p{color:inherit}[data-skin=dark] .setting-item+.setting-item{border-top-color:#27314b}[data-skin=dark] .setting-item .table td{border-color:#27314b}[data-skin=dark] .card-app{box-shadow:none}[data-skin=dark] .page-sign{background-color:#1e273a}@media(min-width: 576px){[data-skin=dark] .page-sign{background-color:#141926}}[data-skin=dark] .page-sign.d-block .col-wrapper{background-color:#1e273a}[data-skin=dark] .page-sign .header-logo,[data-skin=dark] .page-sign .sidebar-logo{color:#fff}[data-skin=dark] .card-sign{box-shadow:none;background-color:#1e273a}[data-skin=dark] .card-sign .card-title{color:#fff}[data-skin=dark] .card-sign .card-text{color:inherit}[data-skin=dark] .card-auth{background-color:rgba(0,0,0,0)}[data-skin=dark] .card-auth .card-title{color:#fff}[data-skin=dark] .card-auth .card-text{color:inherit}[data-skin=dark] .page-error .header-logo,[data-skin=dark] .page-error .sidebar-logo{color:#fff}[data-skin=dark] .error-title{color:#fff}[data-skin=dark] .error-number{color:#fff}[data-skin=dark] .error-text{color:inherit}[data-skin=dark] .pricing-title{color:#fff}[data-skin=dark] .pricing-text{color:inherit}[data-skin=dark] .pricing-price{color:#fff}[data-skin=dark] .table-pricing thead th>small,[data-skin=dark] .table-pricing thead th>.small{color:inherit}[data-skin=dark] .table-pricing .title td{border-bottom-color:#2b3651}[data-skin=dark] .table-pricing .title td:first-child{color:#fff}[data-skin=dark] .table-pricing tbody td:first-child{color:#fff}[data-skin=dark] .table-pricing tbody td:first-child small,[data-skin=dark] .table-pricing tbody td:first-child .small{color:rgba(255,255,255,.65)}[data-skin=dark] .table-pricing thead th.selected,[data-skin=dark] .table-pricing tbody td.selected{background-color:rgba(80,111,217,.1)}[data-skin=dark] .main-faq .nav-classic .nav-link{color:inherit}[data-skin=dark] .accordion-faq .accordion-item{background-color:#192030;box-shadow:none}[data-skin=dark] .accordion-faq .accordion-button.collapsed{color:#fff}[data-skin=dark] .accordion-faq .accordion-button::after{opacity:1}[data-skin=dark] .headline-content::before{display:none}[data-skin=dark] .landing-header .menu-link{color:#fff}[data-skin=dark] .landing-header .nav-icon .nav-link{color:#fff}[data-skin=dark] .landing-body .dropdown-link{background-color:#192030;border-color:#2b3651;color:#fff}[data-skin=dark] .main-title-text{color:rgba(255,255,255,.85)}[data-skin=dark] .main-subtitle{color:#fff}[data-skin=dark] .main-footer-docs::before{border-top-color:#222b41}[data-skin=dark] .nav-docs label{color:rgba(255,255,255,.3)}[data-skin=dark] .nav-docs .nav-link{color:inherit}[data-skin=dark] .nav-docs .nav-link.active{color:#fff}[data-skin=dark] .nav-docs hr{opacity:.06}[data-skin=dark] .card-example{background-color:rgba(0,0,0,0);border-color:#222b41}[data-skin=dark] .card-example>.card-body::before{background-color:#141926;color:rgba(255,255,255,.35)}[data-skin=dark] .card-example>.card-footer{background-color:#192030;border-top-color:#222b41}[data-skin=dark] .card-example>.card-footer code{text-shadow:none;color:#fff}[data-skin=dark] .token.operator{background-color:rgba(0,0,0,0)}[data-skin=dark] .row-example span{background-color:#192030;border-color:#222b41}[data-skin=dark] .offcanvas-demo{background-color:#141926;border-color:#222b41}[data-skin=dark] .offcanvas-demo .offcanvas{border-right-color:#222b41}[data-skin=dark] .scrollspy-demo{background-color:#141926;border-color:#222b41}[data-skin=dark] .toast-demo{background-color:#192030}[data-skin=dark] .icon-group{background-color:#141926;border-color:#222b41}[data-skin=dark] .icon-group i,[data-skin=dark] .icon-group svg{color:inherit}[data-skin=dark] .media-animate .nav-link{background-color:#192030;color:inherit}[data-skin=dark] .media-animate .animate-title{text-shadow:none}[data-skin=dark] .demo-border>span,[data-skin=dark] .demo-bordered>span{background-color:rgba(0,0,0,0)}[data-skin=dark] .demo-bordered span{border-color:#2b3651}[data-skin=dark] .demo-text p,[data-skin=dark] .demo-text a{background-color:#192030}[data-skin=dark] .demo-flex .bg-gray-300{background-color:#192030}[data-skin=dark] .demo-flot .flot-y-axis>div,[data-skin=dark] .demo-flot .flot-x-axis>div{color:rgba(255,255,255,.6) !important}[data-skin=dark] .demo-flot .legend>div{background-color:rgba(0,0,0,0) !important}[data-skin=dark] .demo-flot .legend table{color:rgba(255,255,255,.6) !important}[data-skin=dark] .demo-flot .legend td{padding-right:5px}[data-skin=dark] .morris-donut path{stroke:rgba(255,255,255,.3)}[data-skin=dark] .morris-donut text{fill:#fff}[data-skin=dark] .text-dark{color:#fff !important}[data-skin=dark] .text-secondary{color:rgba(255,255,255,.65) !important}[data-skin=dark] .border{border-color:#2b3651 !important}[data-skin=dark] .border-top{border-top-color:#2b3651 !important}[data-skin=dark] .border-bottom{border-bottom-color:#2b3651 !important}[data-skin=dark] .border-start{border-left-color:#2b3651 !important}[data-skin=dark] .border-end{border-right-color:#2b3651 !important}[data-skin=dark] .border-primary{border-color:#506fd9 !important}[data-skin=dark] .border-secondary{border-color:#6e7985 !important}[data-skin=dark] .border-success{border-color:#0cb785 !important}[data-skin=dark] .border-warning{border-color:#ffc107 !important}[data-skin=dark] .border-danger{border-color:#dc3545 !important}[data-skin=dark] .border-info{border-color:#0dcaf0 !important}[data-skin=dark] .border-light{border-color:#f8f9fc !important}[data-skin=dark] .border-dark{border-color:#212830 !important}[data-skin=dark] .border-white{border-color:#fff !important}[dir=rtl] .header .nav-icon .nav-link+.nav-link{margin-left:0;margin-right:8px}@media(min-width: 992px){[dir=rtl] .header-main{left:0;right:240px;border-left:0;border-right:1px solid #f8f9fc}}@media(min-width: 1400px){[dir=rtl] .header-main{right:250px}}[dir=rtl] .header-main .nav-link .badge{margin-left:0;margin-right:2px}[dir=rtl] .header-main .dropdown-link small,[dir=rtl] .header-main .dropdown-link .small{right:auto;left:-4px}[dir=rtl] .dropdown-skin .dropdown-menu{margin-right:0;margin-left:10px}[dir=rtl] .dropdown-skin .dropdown-menu label{text-align:right}[dir=rtl] .nav-skin{flex-wrap:nowrap;white-space:nowrap}[dir=rtl] .nav-skin .nav-link+.nav-link{margin-left:0;margin-right:-1px}[dir=rtl] .nav-skin .nav-link:first-child{border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:3px;border-bottom-right-radius:3px}[dir=rtl] .nav-skin .nav-link:last-child{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:3px;border-bottom-left-radius:3px}[dir=rtl] .dropdown-notification .dropdown-menu{margin-right:0;margin-left:10px}[dir=rtl] .dropdown-notification .avatar{margin-right:0;margin-left:15px}[dir=rtl] .dropdown-notification .list-group-body{padding-right:0;padding-left:10px}[dir=rtl] .dropdown-profile .nav a i{margin-right:0;margin-left:10px}@media(max-width: 991.98px){[dir=rtl] .sidebar-show .sidebar{left:auto;right:0}[dir=rtl] .sidebar-show .header-main,[dir=rtl] .sidebar-show .main-mobile-header,[dir=rtl] .sidebar-show .main{transform:translateX(-290px)}[dir=rtl] .sidebar-show .main-backdrop{opacity:1;visibility:visible}}[dir=rtl] .sidebar-offset .sidebar{left:auto;right:-250px}[dir=rtl] .sidebar-offset .header-main{right:0}[dir=rtl] .sidebar-offset .main{margin-right:0}[dir=rtl] .sidebar-offset.sidebar-show .sidebar{right:0;box-shadow:-1px 0 1px rgba(33,40,48,.01),-4px 0 4px rgba(33,40,48,.01),-16px 0 16px rgba(33,40,48,.01)}[dir=rtl] .sidebar-offset.sidebar-show .header-main,[dir=rtl] .sidebar-offset.sidebar-show .main{transform:translateX(-250px)}@media(min-width: 992px){[dir=rtl] .sidebar-hide .sidebar{left:auto;right:-250px}[dir=rtl] .sidebar-hide .header-main{right:0;border-right-width:0}[dir=rtl] .sidebar-hide .main{margin-right:0}[dir=rtl] .sidebar-hide .music-player{left:auto;right:23px}}[dir=rtl] .sidebar{left:auto;right:-290px}@media(min-width: 992px){[dir=rtl] .sidebar{left:auto;right:0;box-shadow:-1px 0 1px rgba(33,40,48,.01),-4px 0 4px rgba(33,40,48,.01),-16px 0 16px rgba(33,40,48,.01)}}[dir=rtl] .sidebar-body .nav-label::after{left:15px;right:auto}[dir=rtl] .sidebar-footer{box-shadow:20px 20px 20px #fff}[dir=rtl] .sidebar-footer-top{padding-left:12px;padding-right:15px}[dir=rtl] .sidebar-footer-thumb{margin-right:0;margin-left:10px}[dir=rtl] .sidebar-footer-menu a>i{margin-right:0;margin-left:12px}@media(min-width: 992px){[dir=rtl] .main{margin-left:0;margin-right:240px}}@media(min-width: 1400px){[dir=rtl] .main{margin-left:0;margin-right:250px}}[dir=rtl] .accordion-button::after{margin-left:0;margin-right:auto}[dir=rtl] .breadcrumb-item+.breadcrumb-item{padding-left:0;padding-right:var(--bs-breadcrumb-item-padding-x)}[dir=rtl] .breadcrumb-item+.breadcrumb-item::before{float:right;padding-right:0;padding-left:var(--bs-breadcrumb-item-padding-x)}[dir=rtl] .form-check-inline{margin-right:0;margin-left:1rem}[dir=rtl] .form-select{background-position:left .75rem center}[dir=rtl] .form-check{padding-left:0;padding-right:1.5em}[dir=rtl] .form-check .form-check-input{float:right;margin-left:0;margin-right:-1.5em}[dir=rtl] .list-group{padding-right:0}[dir=rtl] .nav-sidebar .nav-link.has-sub::after{right:auto;left:15px}[dir=rtl] .nav-sidebar .nav-link i{margin-right:0;margin-left:12px}[dir=rtl] .nav-sidebar .nav-sub-link::before{left:auto;right:26px}[dir=rtl] .nav-sidebar .nav-sub-link:hover::before,[dir=rtl] .nav-sidebar .nav-sub-link:focus::before{right:20.5px}[dir=rtl] .nav-sidebar .nav-sub-link.active::before{right:20.5px}[dir=rtl] .nav-icon .nav-link+.nav-link{margin-left:0;margin-right:5px}[dir=rtl] .nav-line .nav-link+.nav-link{margin-left:0;margin-right:25px}[dir=rtl] .ps>.ps__rail-y{right:auto !important;left:0 !important}[dir=rtl] .nav-finance-one{right:auto;left:0}[dir=rtl] .nav-finance-one a+a{margin-left:0;margin-right:10px}[dir=rtl] .apex-chart-two{left:auto;right:-20px}[dir=rtl] .apex-chart-three{left:auto;right:-14px}[dir=rtl] .card-wallet .finance-icon{right:auto;left:24px}[dir=rtl] .table-ratings tbody td:nth-child(3),[dir=rtl] .table-ratings tbody td:last-child{text-align:left}[dir=rtl] .events-reviews .avatar{margin-right:0;margin-left:10px}[dir=rtl] .event-date{margin-right:0;margin-left:15px}[dir=rtl] .events-body .ev-item{border-left:0;border-right:2px solid #6e7985}[dir=rtl] .events-list li.active .ev-item{border-right-color:#506fd9}[dir=rtl] .card-one .legend li::before{margin-right:0;margin-left:5px}[dir=rtl] .card-one .legend li+li{margin-left:0;margin-right:10px}[dir=rtl] .apex-chart-one{left:0;right:-10px}[dir=rtl] .card-one .people-item .avatar{margin-right:0;margin-left:8px}[dir=rtl] .table-one thead th:not(:first-child),[dir=rtl] .table-one tbody td:not(:first-child){text-align:left}[dir=rtl] .table-two thead th:not(:first-child),[dir=rtl] .table-two tbody td:not(:first-child){text-align:left}[dir=rtl] .apex-chart-nine{left:0;right:0}[dir=rtl] .table-three tbody td:nth-child(3),[dir=rtl] .table-three tbody td:last-child{text-align:left}[dir=rtl] .table-four thead tr:last-child th:not(:first-child),[dir=rtl] .table-four tbody td:not(:first-child){text-align:left}[dir=rtl] .crypto-item{left:auto;right:15px}[dir=rtl] .crypto-item .avatar{margin-right:0;margin-left:10px}[dir=rtl] .table-five tbody td:not(:first-child){text-align:left}@media(min-width: 576px){[dir=rtl] .news-img{margin-right:0;margin-left:15px}}[dir=rtl] .mutual-badge li+li{margin-left:0;margin-right:-8px}[dir=rtl] .mutual-badge label{margin-left:0;margin-right:5px}[dir=rtl] .apex-chart-eleven{left:0;right:-10px}[dir=rtl] .apex-chart-twelve{margin-left:0;margin-right:0}[dir=rtl] .revenue-item-body span:last-child{margin-left:0;margin-right:10px;text-align:left}[dir=rtl] .main-file-manager{overflow:hidden}@media(max-width: 991.98px){[dir=rtl] .main-file-manager.show .file-sidebar{right:0;border-right:0;border-left:1px solid rgba(226,229,236,.6)}[dir=rtl] .main-file-manager.show .file-content{transform:translateX(-230px)}}[dir=rtl] .file-sidebar{left:auto;right:-230px}@media(min-width: 992px){[dir=rtl] .file-sidebar{right:0;border-right:0;border-left:1px solid rgba(226,229,236,.6)}}@media(min-width: 992px){[dir=rtl] .file-content{left:0;right:230px}}[dir=rtl] .card-file .dropdown-file{right:auto;left:10px}[dir=rtl] .card-folder .dropdown-file{right:auto;left:5px}@media(min-width: 576px){[dir=rtl] .card-folder .card-body>i{margin-right:0;margin-left:10px}}[dir=rtl] .page-app .dropdown-item i{margin-right:0;margin-left:10px}[dir=rtl] .table-files .media-icon{margin-right:0;margin-left:10px}[dir=rtl] .table-files thead th:nth-child(2),[dir=rtl] .table-files thead th:nth-child(3),[dir=rtl] .table-files tbody td:nth-child(2),[dir=rtl] .table-files tbody td:nth-child(3){text-align:left}[dir=rtl] .menu-file-manager{margin-right:0;margin-left:10px}[dir=rtl] .menu-file-manager i{transform:rotate(180deg)}[dir=rtl] .main-email{overflow:hidden}@media(max-width: 767.98px){[dir=rtl] .main-email.show .email-sidebar{left:auto;right:0;border-right:0;border-left:1px solid rgba(226,229,236,.6)}[dir=rtl] .main-email.show .email-list{transform:translateX(-230px)}}[dir=rtl] .email-sidebar{left:auto;right:-230px}@media(min-width: 768px){[dir=rtl] .email-sidebar{right:0;border-right:0;border-left:1px solid rgba(226,229,236,.6)}}[dir=rtl] .email-list{left:auto;right:0}@media(min-width: 768px){[dir=rtl] .email-list{right:230px;border-right:0;border-left:1px solid rgba(226,229,236,.6)}}@media(min-width: 768px){[dir=rtl] .email-content{left:0;right:230px}}@media(min-width: 1200px){[dir=rtl] .email-content{left:0;right:570px}}[dir=rtl] .email-item .avatar{margin-right:0;margin-left:12px}[dir=rtl] .email-item-date{margin-left:0;margin-right:auto}[dir=rtl] .email-item-star{margin-left:0;margin-right:5px}[dir=rtl] .card-attachment .card-icon{margin-right:0;margin-left:10px}[dir=rtl] .compose{right:auto;left:0}[dir=rtl] .compose-header .nav{margin-left:0}[dir=rtl] .compose-header .nav-link+.nav-link{margin-left:0;margin-right:8px}[dir=rtl] .email-menu{margin-right:0;margin-left:10px}[dir=rtl] .email-menu i{transform:rotate(180deg)}[dir=rtl] .main-calendar{overflow:hidden}@media(max-width: 1199.98px){[dir=rtl] .main-calendar.show .calendar-sidebar{left:auto;right:0}[dir=rtl] .main-calendar.show .calendar-body{transform:translateX(-300px);padding-right:0}}[dir=rtl] .calendar-sidebar{left:auto;right:-300px}@media(min-width: 1200px){[dir=rtl] .calendar-sidebar{left:auto;right:0}}[dir=rtl] .nav-calendar span{margin-right:0;margin-left:10px}[dir=rtl] .modal-event .date-item i{margin-right:0;margin-left:5px}@media(min-width: 1200px){[dir=rtl] .calendar-body{left:0;right:300px;padding-right:0;padding-left:20px}}[dir=rtl] .chat-sidebar{left:auto;right:0;border-bottom-left-radius:0;border-top-left-radius:0;border-bottom-right-radius:inherit;border-top-right-radius:inherit}@media(min-width: 768px){[dir=rtl] .chat-sidebar{border-right:0;border-left:1px solid rgba(226,229,236,.6)}}[dir=rtl] .chat-sidebar .sidebar-header{border-top-left-radius:0;border-top-right-radius:0;border-top-right-radius:inherit}[dir=rtl] .chat-body{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:inherit;border-bottom-left-radius:inherit}@media(min-width: 768px){[dir=rtl] .chat-body{margin-left:0;margin-right:280px}}@media(min-width: 1200px){[dir=rtl] .chat-body{margin-left:0;margin-right:300px}}[dir=rtl] .chat-group .chat-item-body,[dir=rtl] .chat-group .contact-item-body,[dir=rtl] .contact-group .chat-item-body,[dir=rtl] .contact-group .contact-item-body{padding-left:0;padding-right:10px}[dir=rtl] .chat-group .chat-item.unread .chat-item-body h6::after,[dir=rtl] .contact-group .chat-item.unread .chat-item-body h6::after,[dir=rtl] .chat-group .unread.contact-item .chat-item-body h6::after,[dir=rtl] .contact-group .unread.contact-item .chat-item-body h6::after,[dir=rtl] .chat-group .chat-item.unread .contact-item-body h6::after,[dir=rtl] .contact-group .chat-item.unread .contact-item-body h6::after,[dir=rtl] .chat-group .unread.contact-item .contact-item-body h6::after,[dir=rtl] .contact-group .unread.contact-item .contact-item-body h6::after,[dir=rtl] .chat-group .chat-item.unread .chat-item-body .h6::after,[dir=rtl] .contact-group .chat-item.unread .chat-item-body .h6::after,[dir=rtl] .chat-group .unread.contact-item .chat-item-body .h6::after,[dir=rtl] .contact-group .unread.contact-item .chat-item-body .h6::after,[dir=rtl] .chat-group .chat-item.unread .contact-item-body .h6::after,[dir=rtl] .contact-group .chat-item.unread .contact-item-body .h6::after,[dir=rtl] .chat-group .unread.contact-item .contact-item-body .h6::after,[dir=rtl] .contact-group .unread.contact-item .contact-item-body .h6::after{right:auto;left:-12px}[dir=rtl] .chat-body-header .avatar{margin-right:0;margin-left:10px}[dir=rtl] .msg-item .avatar{margin-right:0;margin-left:10px}[dir=rtl] .msg-box .form-control,[dir=rtl] .msg-box .gridjs-input{padding-right:.6rem;padding-left:24px}[dir=rtl] .msg-send{right:auto;left:8px}@media(min-width: 1200px){[dir=rtl] .contact-sidebar{padding-right:0;padding-left:12px;margin-right:0;margin-left:12px}}[dir=rtl] .contact-sidebar .nav-sidebar .nav-link small,[dir=rtl] .contact-sidebar .nav-sidebar .nav-link .small{margin-left:0;margin-right:auto}[dir=rtl] .contact-list{left:auto;right:0}@media(min-width: 768px){[dir=rtl] .contact-list{border-right:0;border-left:1px solid rgba(226,229,236,.6)}}@media(min-width: 768px){[dir=rtl] .contact-content{margin-left:0;margin-right:280px}}@media(min-width: 1200px){[dir=rtl] .contact-list-header{padding-left:10px}}[dir=rtl] .card-task .card-footer .nav-link+.nav-link{margin-left:0;margin-right:10px}@media(min-width: 992px){[dir=rtl] .music-player .media-music .media-img{margin-right:0;margin-left:12px}}@media(min-width: 992px){[dir=rtl] .music-headline>div{left:auto;right:25px}}[dir=rtl] .table-music tbody td:first-child{border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:6px;border-bottom-right-radius:6px;border-left-width:0;border-right-width:1px;padding-left:.5rem;padding-right:15px}[dir=rtl] .table-music tbody td:last-child{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:6px;border-bottom-left-radius:6px;border-right-width:0;border-left-width:1px}[dir=rtl] .media-music .media-img{margin-right:0;margin-left:12px}[dir=rtl] .nav-classic i{margin-right:0;margin-left:10px}[dir=rtl] .nav-classic .badge{margin-left:0;margin-right:auto}[dir=rtl] .music-volume{margin-left:0;margin-right:10px}[dir=rtl] .music-volume a{margin-right:0;margin-left:5px}[dir=rtl] .app-video .carousel-control-prev{left:20px;right:auto}[dir=rtl] .app-video .carousel-control-next{right:auto;left:60px}[dir=rtl] .video-player .nav-link+.nav-link{margin-left:0;margin-right:10px}[dir=rtl] .media-profile .media-img{margin-right:0;margin-left:25px}[dir=rtl] .profile-item>i{margin-right:0;margin-left:12px}[dir=rtl] .card-post .link-more{right:auto;left:-5px}[dir=rtl] .post-header .avatar{margin-right:0;margin-left:10px}@media(min-width: 768px){[dir=rtl] .experience-icon{margin-right:0;margin-left:20px}}[dir=rtl] .experience-body ul{padding-left:0;padding-right:13px}[dir=rtl] .interest-icon{margin-right:0;margin-left:15px}[dir=rtl] .mutual-group li+li{margin-left:0;margin-right:-10px}[dir=rtl] .people-item .avatar{margin-right:0;margin-left:12px}[dir=rtl] .list-contact-info li i{margin-right:0;margin-left:12px}[dir=rtl] .activity-group{margin-left:0;margin-right:15px;border-left:0;border-right:2px solid #e2e5ec}[dir=rtl] .activity-date{padding-left:0;padding-right:40px}[dir=rtl] .activity-date::before{left:auto;right:0}[dir=rtl] .activity-item{padding-left:0;padding-right:40px}[dir=rtl] .activity-item::before{left:auto;right:-17px}[dir=rtl] .event-icon{margin-right:0;margin-left:10px}[dir=rtl] .setting-item .table a+a{margin-left:0;margin-right:5px}[dir=rtl] .card-app .card-logo{margin-right:0;margin-left:15px}[dir=rtl] .setting-item .table th:not(:first-child),[dir=rtl] .setting-item .table td:not(:first-child){text-align:left}[dir=rtl] .card-sign .btn i,.gridjs-pages [dir=rtl] .card-sign button i,.ui-datepicker-buttonpane [dir=rtl] .card-sign button i,[dir=rtl] .card-sign .ui-datepicker-buttonpane button i,[dir=rtl] .ui-datepicker-buttonpane .card-sign button i,[dir=rtl] .card-sign .gridjs-pages button i,[dir=rtl] .gridjs-pages .card-sign button i{margin-right:0;margin-left:5px}@media(min-width: 1200px){[dir=rtl] .main-docs{padding-right:0;padding-left:220px}}[dir=rtl] .nav-docs{right:auto;left:25px}[dir=rtl] .nav-docs .nav-link{padding-left:0;padding-right:15px}[dir=rtl] .nav-docs .nav-link::before{left:auto;right:0}[dir=rtl] .nav-docs .nav-link.active::before{right:-15px}
.select2-container{box-sizing:border-box;display:inline-block;margin:0;position:relative;vertical-align:middle}.select2-container .select2-selection--single{box-sizing:border-box;cursor:pointer;display:block;height:28px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--single .select2-selection__rendered{display:block;padding-left:8px;padding-right:20px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select2-container .select2-selection--single .select2-selection__clear{background-color:transparent;border:none;font-size:1em}.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered{padding-right:8px;padding-left:20px}.select2-container .select2-selection--multiple{box-sizing:border-box;cursor:pointer;display:block;min-height:32px;user-select:none;-webkit-user-select:none}.select2-container .select2-selection--multiple .select2-selection__rendered{display:inline;list-style:none;padding:0}.select2-container .select2-selection--multiple .select2-selection__clear{background-color:transparent;border:none;font-size:1em}.select2-container .select2-search--inline .select2-search__field{box-sizing:border-box;border:none;font-size:100%;margin-top:5px;margin-left:5px;padding:0;max-width:100%;resize:none;height:18px;vertical-align:bottom;font-family:sans-serif;overflow:hidden;word-break:keep-all}.select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-dropdown{background-color:white;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:block;position:absolute;left:-100000px;width:100%;z-index:1051}.select2-results{display:block}.select2-results__options{list-style:none;margin:0;padding:0}.select2-results__option{padding:6px;user-select:none;-webkit-user-select:none}.select2-results__option--selectable{cursor:pointer}.select2-container--open .select2-dropdown{left:0}.select2-container--open .select2-dropdown--above{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--open .select2-dropdown--below{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-search--dropdown{display:block;padding:4px}.select2-search--dropdown .select2-search__field{padding:4px;width:100%;box-sizing:border-box}.select2-search--dropdown .select2-search__field::-webkit-search-cancel-button{-webkit-appearance:none}.select2-search--dropdown.select2-search--hide{display:none}.select2-close-mask{border:0;margin:0;padding:0;display:block;position:fixed;left:0;top:0;min-height:100%;min-width:100%;height:auto;width:auto;opacity:0;z-index:99;background-color:#fff;filter:alpha(opacity=0)}.select2-hidden-accessible{border:0 !important;clip:rect(0 0 0 0) !important;-webkit-clip-path:inset(50%) !important;clip-path:inset(50%) !important;height:1px !important;overflow:hidden !important;padding:0 !important;position:absolute !important;width:1px !important;white-space:nowrap !important}.select2-container--default .select2-selection--single{background-color:#fff;border:1px solid #aaa;border-radius:4px}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--default .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;height:26px;margin-right:20px;padding-right:0px}.select2-container--default .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--default .select2-selection--single .select2-selection__arrow{height:26px;position:absolute;top:1px;right:1px;width:20px}.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow{left:1px;right:auto}.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear{display:none}.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--default .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text;padding-bottom:5px;padding-right:5px;position:relative}.select2-container--default .select2-selection--multiple.select2-selection--clearable{padding-right:25px}.select2-container--default .select2-selection--multiple .select2-selection__clear{cursor:pointer;font-weight:bold;height:20px;margin-right:10px;margin-top:5px;position:absolute;right:0;padding:1px}.select2-container--default .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;box-sizing:border-box;display:inline-block;margin-left:5px;margin-top:5px;padding:0;padding-left:20px;position:relative;max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;white-space:nowrap}.select2-container--default .select2-selection--multiple .select2-selection__choice__display{cursor:default;padding-left:2px;padding-right:5px}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{background-color:transparent;border:none;border-right:1px solid #aaa;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#999;cursor:pointer;font-size:1em;font-weight:bold;padding:0 4px;position:absolute;left:0;top:0}.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus{background-color:#f1f1f1;color:#333;outline:none}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice{margin-left:5px;margin-right:auto}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display{padding-left:5px;padding-right:2px}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{border-left:1px solid #aaa;border-right:none;border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__clear{float:left;margin-left:10px;margin-right:auto}.select2-container--default.select2-container--focus .select2-selection--multiple{border:solid black 1px;outline:0}.select2-container--default.select2-container--disabled .select2-selection--multiple{background-color:#eee;cursor:default}.select2-container--default.select2-container--disabled .select2-selection__choice__remove{display:none}.select2-container--default.select2-container--open.select2-container--above .select2-selection--single,.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple{border-top-left-radius:0;border-top-right-radius:0}.select2-container--default.select2-container--open.select2-container--below .select2-selection--single,.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--default .select2-search--dropdown .select2-search__field{border:1px solid #aaa}.select2-container--default .select2-search--inline .select2-search__field{background:transparent;border:none;outline:0;box-shadow:none;-webkit-appearance:textfield}.select2-container--default .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--default .select2-results__option .select2-results__option{padding-left:1em}.select2-container--default .select2-results__option .select2-results__option .select2-results__group{padding-left:0}.select2-container--default .select2-results__option .select2-results__option .select2-results__option{margin-left:-1em;padding-left:2em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-2em;padding-left:3em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-3em;padding-left:4em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-4em;padding-left:5em}.select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option{margin-left:-5em;padding-left:6em}.select2-container--default .select2-results__option--group{padding:0}.select2-container--default .select2-results__option--disabled{color:#999}.select2-container--default .select2-results__option--selected{background-color:#ddd}.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{background-color:#5897fb;color:white}.select2-container--default .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic .select2-selection--single{background-color:#f7f7f7;border:1px solid #aaa;border-radius:4px;outline:0;background-image:-webkit-linear-gradient(top, #fff 50%, #eee 100%);background-image:-o-linear-gradient(top, #fff 50%, #eee 100%);background-image:linear-gradient(to bottom, #fff 50%, #eee 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic .select2-selection--single:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--single .select2-selection__rendered{color:#444;line-height:28px}.select2-container--classic .select2-selection--single .select2-selection__clear{cursor:pointer;float:right;font-weight:bold;height:26px;margin-right:20px}.select2-container--classic .select2-selection--single .select2-selection__placeholder{color:#999}.select2-container--classic .select2-selection--single .select2-selection__arrow{background-color:#ddd;border:none;border-left:1px solid #aaa;border-top-right-radius:4px;border-bottom-right-radius:4px;height:26px;position:absolute;top:1px;right:1px;width:20px;background-image:-webkit-linear-gradient(top, #eee 50%, #ccc 100%);background-image:-o-linear-gradient(top, #eee 50%, #ccc 100%);background-image:linear-gradient(to bottom, #eee 50%, #ccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)}.select2-container--classic .select2-selection--single .select2-selection__arrow b{border-color:#888 transparent transparent transparent;border-style:solid;border-width:5px 4px 0 4px;height:0;left:50%;margin-left:-4px;margin-top:-2px;position:absolute;top:50%;width:0}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear{float:left}.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow{border:none;border-right:1px solid #aaa;border-radius:0;border-top-left-radius:4px;border-bottom-left-radius:4px;left:1px;right:auto}.select2-container--classic.select2-container--open .select2-selection--single{border:1px solid #5897fb}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow{background:transparent;border:none}.select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b{border-color:transparent transparent #888 transparent;border-width:0 4px 5px 4px}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single{border-top:none;border-top-left-radius:0;border-top-right-radius:0;background-image:-webkit-linear-gradient(top, #fff 0%, #eee 50%);background-image:-o-linear-gradient(top, #fff 0%, #eee 50%);background-image:linear-gradient(to bottom, #fff 0%, #eee 50%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0;background-image:-webkit-linear-gradient(top, #eee 50%, #fff 100%);background-image:-o-linear-gradient(top, #eee 50%, #fff 100%);background-image:linear-gradient(to bottom, #eee 50%, #fff 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)}.select2-container--classic .select2-selection--multiple{background-color:white;border:1px solid #aaa;border-radius:4px;cursor:text;outline:0;padding-bottom:5px;padding-right:5px}.select2-container--classic .select2-selection--multiple:focus{border:1px solid #5897fb}.select2-container--classic .select2-selection--multiple .select2-selection__clear{display:none}.select2-container--classic .select2-selection--multiple .select2-selection__choice{background-color:#e4e4e4;border:1px solid #aaa;border-radius:4px;display:inline-block;margin-left:5px;margin-top:5px;padding:0}.select2-container--classic .select2-selection--multiple .select2-selection__choice__display{cursor:default;padding-left:2px;padding-right:5px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove{background-color:transparent;border:none;border-top-left-radius:4px;border-bottom-left-radius:4px;color:#888;cursor:pointer;font-size:1em;font-weight:bold;padding:0 4px}.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover{color:#555;outline:none}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice{margin-left:5px;margin-right:auto}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__display{padding-left:5px;padding-right:2px}.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove{border-top-left-radius:0;border-bottom-left-radius:0;border-top-right-radius:4px;border-bottom-right-radius:4px}.select2-container--classic.select2-container--open .select2-selection--multiple{border:1px solid #5897fb}.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple{border-top:none;border-top-left-radius:0;border-top-right-radius:0}.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple{border-bottom:none;border-bottom-left-radius:0;border-bottom-right-radius:0}.select2-container--classic .select2-search--dropdown .select2-search__field{border:1px solid #aaa;outline:0}.select2-container--classic .select2-search--inline .select2-search__field{outline:0;box-shadow:none}.select2-container--classic .select2-dropdown{background-color:#fff;border:1px solid transparent}.select2-container--classic .select2-dropdown--above{border-bottom:none}.select2-container--classic .select2-dropdown--below{border-top:none}.select2-container--classic .select2-results>.select2-results__options{max-height:200px;overflow-y:auto}.select2-container--classic .select2-results__option--group{padding:0}.select2-container--classic .select2-results__option--disabled{color:grey}.select2-container--classic .select2-results__option--highlighted.select2-results__option--selectable{background-color:#3875d7;color:#fff}.select2-container--classic .select2-results__group{cursor:default;display:block;padding:6px}.select2-container--classic.select2-container--open .select2-dropdown{border-color:#5897fb}
/*!
 * Quill Editor v1.3.6
 * https://quilljs.com/
 * Copyright (c) 2014, Jason Chen
 * Copyright (c) 2013, salesforce.com
 */
.ql-container {
  box-sizing: border-box;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 13px;
  height: 100%;
  margin: 0px;
  position: relative;
}
.ql-container.ql-disabled .ql-tooltip {
  visibility: hidden;
}
.ql-container.ql-disabled .ql-editor ul[data-checked] > li::before {
  pointer-events: none;
}
.ql-clipboard {
  left: -100000px;
  height: 1px;
  overflow-y: hidden;
  position: absolute;
  top: 50%;
}
.ql-clipboard p {
  margin: 0;
  padding: 0;
}
.ql-editor {
  box-sizing: border-box;
  line-height: 1.42;
  height: 100%;
  outline: none;
  overflow-y: auto;
  padding: 12px 15px;
  tab-size: 4;
  -moz-tab-size: 4;
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
}
.ql-editor > * {
  cursor: text;
}
.ql-editor p,
.ql-editor ol,
.ql-editor ul,
.ql-editor pre,
.ql-editor blockquote,
.ql-editor h1,
.ql-editor h2,
.ql-editor h3,
.ql-editor h4,
.ql-editor h5,
.ql-editor h6 {
  margin: 0;
  padding: 0;
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol,
.ql-editor ul {
  padding-left: 1.5em;
}
.ql-editor ol > li,
.ql-editor ul > li {
  list-style-type: none;
}
.ql-editor ul > li::before {
  content: '\2022';
}
.ql-editor ul[data-checked=true],
.ql-editor ul[data-checked=false] {
  pointer-events: none;
}
.ql-editor ul[data-checked=true] > li *,
.ql-editor ul[data-checked=false] > li * {
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before,
.ql-editor ul[data-checked=false] > li::before {
  color: #777;
  cursor: pointer;
  pointer-events: all;
}
.ql-editor ul[data-checked=true] > li::before {
  content: '\2611';
}
.ql-editor ul[data-checked=false] > li::before {
  content: '\2610';
}
.ql-editor li::before {
  display: inline-block;
  white-space: nowrap;
  width: 1.2em;
}
.ql-editor li:not(.ql-direction-rtl)::before {
  margin-left: -1.5em;
  margin-right: 0.3em;
  text-align: right;
}
.ql-editor li.ql-direction-rtl::before {
  margin-left: 0.3em;
  margin-right: -1.5em;
}
.ql-editor ol li:not(.ql-direction-rtl),
.ql-editor ul li:not(.ql-direction-rtl) {
  padding-left: 1.5em;
}
.ql-editor ol li.ql-direction-rtl,
.ql-editor ul li.ql-direction-rtl {
  padding-right: 1.5em;
}
.ql-editor ol li {
  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
  counter-increment: list-0;
}
.ql-editor ol li:before {
  content: counter(list-0, decimal) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-increment: list-1;
}
.ql-editor ol li.ql-indent-1:before {
  content: counter(list-1, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-1 {
  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-2 {
  counter-increment: list-2;
}
.ql-editor ol li.ql-indent-2:before {
  content: counter(list-2, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-2 {
  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-3 {
  counter-increment: list-3;
}
.ql-editor ol li.ql-indent-3:before {
  content: counter(list-3, decimal) '. ';
}
.ql-editor ol li.ql-indent-3 {
  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-4 {
  counter-increment: list-4;
}
.ql-editor ol li.ql-indent-4:before {
  content: counter(list-4, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-4 {
  counter-reset: list-5 list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-5 {
  counter-increment: list-5;
}
.ql-editor ol li.ql-indent-5:before {
  content: counter(list-5, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-5 {
  counter-reset: list-6 list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-6 {
  counter-increment: list-6;
}
.ql-editor ol li.ql-indent-6:before {
  content: counter(list-6, decimal) '. ';
}
.ql-editor ol li.ql-indent-6 {
  counter-reset: list-7 list-8 list-9;
}
.ql-editor ol li.ql-indent-7 {
  counter-increment: list-7;
}
.ql-editor ol li.ql-indent-7:before {
  content: counter(list-7, lower-alpha) '. ';
}
.ql-editor ol li.ql-indent-7 {
  counter-reset: list-8 list-9;
}
.ql-editor ol li.ql-indent-8 {
  counter-increment: list-8;
}
.ql-editor ol li.ql-indent-8:before {
  content: counter(list-8, lower-roman) '. ';
}
.ql-editor ol li.ql-indent-8 {
  counter-reset: list-9;
}
.ql-editor ol li.ql-indent-9 {
  counter-increment: list-9;
}
.ql-editor ol li.ql-indent-9:before {
  content: counter(list-9, decimal) '. ';
}
.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 3em;
}
.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
  padding-left: 4.5em;
}
.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 3em;
}
.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
  padding-right: 4.5em;
}
.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 6em;
}
.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
  padding-left: 7.5em;
}
.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 6em;
}
.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
  padding-right: 7.5em;
}
.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 9em;
}
.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
  padding-left: 10.5em;
}
.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 9em;
}
.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
  padding-right: 10.5em;
}
.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 12em;
}
.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
  padding-left: 13.5em;
}
.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 12em;
}
.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
  padding-right: 13.5em;
}
.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 15em;
}
.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
  padding-left: 16.5em;
}
.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 15em;
}
.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
  padding-right: 16.5em;
}
.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 18em;
}
.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
  padding-left: 19.5em;
}
.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 18em;
}
.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
  padding-right: 19.5em;
}
.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 21em;
}
.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
  padding-left: 22.5em;
}
.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 21em;
}
.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
  padding-right: 22.5em;
}
.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 24em;
}
.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
  padding-left: 25.5em;
}
.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 24em;
}
.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
  padding-right: 25.5em;
}
.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 27em;
}
.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
  padding-left: 28.5em;
}
.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 27em;
}
.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
  padding-right: 28.5em;
}
.ql-editor .ql-video {
  display: block;
  max-width: 100%;
}
.ql-editor .ql-video.ql-align-center {
  margin: 0 auto;
}
.ql-editor .ql-video.ql-align-right {
  margin: 0 0 0 auto;
}
.ql-editor .ql-bg-black {
  background-color: #000;
}
.ql-editor .ql-bg-red {
  background-color: #e60000;
}
.ql-editor .ql-bg-orange {
  background-color: #f90;
}
.ql-editor .ql-bg-yellow {
  background-color: #ff0;
}
.ql-editor .ql-bg-green {
  background-color: #008a00;
}
.ql-editor .ql-bg-blue {
  background-color: #06c;
}
.ql-editor .ql-bg-purple {
  background-color: #93f;
}
.ql-editor .ql-color-white {
  color: #fff;
}
.ql-editor .ql-color-red {
  color: #e60000;
}
.ql-editor .ql-color-orange {
  color: #f90;
}
.ql-editor .ql-color-yellow {
  color: #ff0;
}
.ql-editor .ql-color-green {
  color: #008a00;
}
.ql-editor .ql-color-blue {
  color: #06c;
}
.ql-editor .ql-color-purple {
  color: #93f;
}
.ql-editor .ql-font-serif {
  font-family: Georgia, Times New Roman, serif;
}
.ql-editor .ql-font-monospace {
  font-family: Monaco, Courier New, monospace;
}
.ql-editor .ql-size-small {
  font-size: 0.75em;
}
.ql-editor .ql-size-large {
  font-size: 1.5em;
}
.ql-editor .ql-size-huge {
  font-size: 2.5em;
}
.ql-editor .ql-direction-rtl {
  direction: rtl;
  text-align: inherit;
}
.ql-editor .ql-align-center {
  text-align: center;
}
.ql-editor .ql-align-justify {
  text-align: justify;
}
.ql-editor .ql-align-right {
  text-align: right;
}
.ql-editor.ql-blank::before {
  color: rgba(0,0,0,0.6);
  content: attr(data-placeholder);
  font-style: italic;
  left: 15px;
  pointer-events: none;
  position: absolute;
  right: 15px;
}
.ql-snow.ql-toolbar:after,
.ql-snow .ql-toolbar:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow.ql-toolbar button,
.ql-snow .ql-toolbar button {
  background: none;
  border: none;
  cursor: pointer;
  display: inline-block;
  float: left;
  height: 24px;
  padding: 3px 5px;
  width: 28px;
}
.ql-snow.ql-toolbar button svg,
.ql-snow .ql-toolbar button svg {
  float: left;
  height: 100%;
}
.ql-snow.ql-toolbar button:active:hover,
.ql-snow .ql-toolbar button:active:hover {
  outline: none;
}
.ql-snow.ql-toolbar input.ql-image[type=file],
.ql-snow .ql-toolbar input.ql-image[type=file] {
  display: none;
}
.ql-snow.ql-toolbar button:hover,
.ql-snow .ql-toolbar button:hover,
.ql-snow.ql-toolbar button:focus,
.ql-snow .ql-toolbar button:focus,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-item:hover,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected {
  color: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill {
  fill: #06c;
}
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter {
  stroke: #06c;
}
@media (pointer: coarse) {
  .ql-snow.ql-toolbar button:hover:not(.ql-active),
  .ql-snow .ql-toolbar button:hover:not(.ql-active) {
    color: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
    fill: #444;
  }
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
  .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
  .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
    stroke: #444;
  }
}
.ql-snow {
  box-sizing: border-box;
}
.ql-snow * {
  box-sizing: border-box;
}
.ql-snow .ql-hidden {
  display: none;
}
.ql-snow .ql-out-bottom,
.ql-snow .ql-out-top {
  visibility: hidden;
}
.ql-snow .ql-tooltip {
  position: absolute;
  transform: translateY(10px);
}
.ql-snow .ql-tooltip a {
  cursor: pointer;
  text-decoration: none;
}
.ql-snow .ql-tooltip.ql-flip {
  transform: translateY(-10px);
}
.ql-snow .ql-formats {
  display: inline-block;
  vertical-align: middle;
}
.ql-snow .ql-formats:after {
  clear: both;
  content: '';
  display: table;
}
.ql-snow .ql-stroke {
  fill: none;
  stroke: #444;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}
.ql-snow .ql-stroke-miter {
  fill: none;
  stroke: #444;
  stroke-miterlimit: 10;
  stroke-width: 2;
}
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
  fill: #444;
}
.ql-snow .ql-empty {
  fill: none;
}
.ql-snow .ql-even {
  fill-rule: evenodd;
}
.ql-snow .ql-thin,
.ql-snow .ql-stroke.ql-thin {
  stroke-width: 1;
}
.ql-snow .ql-transparent {
  opacity: 0.4;
}
.ql-snow .ql-direction svg:last-child {
  display: none;
}
.ql-snow .ql-direction.ql-active svg:last-child {
  display: inline;
}
.ql-snow .ql-direction.ql-active svg:first-child {
  display: none;
}
.ql-snow .ql-editor h1 {
  font-size: 2em;
}
.ql-snow .ql-editor h2 {
  font-size: 1.5em;
}
.ql-snow .ql-editor h3 {
  font-size: 1.17em;
}
.ql-snow .ql-editor h4 {
  font-size: 1em;
}
.ql-snow .ql-editor h5 {
  font-size: 0.83em;
}
.ql-snow .ql-editor h6 {
  font-size: 0.67em;
}
.ql-snow .ql-editor a {
  text-decoration: underline;
}
.ql-snow .ql-editor blockquote {
  border-left: 4px solid #ccc;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-left: 16px;
}
.ql-snow .ql-editor code,
.ql-snow .ql-editor pre {
  background-color: #f0f0f0;
  border-radius: 3px;
}
.ql-snow .ql-editor pre {
  white-space: pre-wrap;
  margin-bottom: 5px;
  margin-top: 5px;
  padding: 5px 10px;
}
.ql-snow .ql-editor code {
  font-size: 85%;
  padding: 2px 4px;
}
.ql-snow .ql-editor pre.ql-syntax {
  background-color: #23241f;
  color: #f8f8f2;
  overflow: visible;
}
.ql-snow .ql-editor img {
  max-width: 100%;
}
.ql-snow .ql-picker {
  color: #444;
  display: inline-block;
  float: left;
  font-size: 14px;
  font-weight: 500;
  height: 24px;
  position: relative;
  vertical-align: middle;
}
.ql-snow .ql-picker-label {
  cursor: pointer;
  display: inline-block;
  height: 100%;
  padding-left: 8px;
  padding-right: 2px;
  position: relative;
  width: 100%;
}
.ql-snow .ql-picker-label::before {
  display: inline-block;
  line-height: 22px;
}
.ql-snow .ql-picker-options {
  background-color: #fff;
  display: none;
  min-width: 100%;
  padding: 4px 8px;
  position: absolute;
  white-space: nowrap;
}
.ql-snow .ql-picker-options .ql-picker-item {
  cursor: pointer;
  display: block;
  padding-bottom: 5px;
  padding-top: 5px;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  color: #ccc;
  z-index: 2;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
  fill: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
  stroke: #ccc;
}
.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  display: block;
  margin-top: -1px;
  top: 100%;
  z-index: 1;
}
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker {
  width: 28px;
}
.ql-snow .ql-color-picker .ql-picker-label,
.ql-snow .ql-icon-picker .ql-picker-label {
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-label svg,
.ql-snow .ql-icon-picker .ql-picker-label svg {
  right: 4px;
}
.ql-snow .ql-icon-picker .ql-picker-options {
  padding: 4px 0px;
}
.ql-snow .ql-icon-picker .ql-picker-item {
  height: 24px;
  width: 24px;
  padding: 2px 4px;
}
.ql-snow .ql-color-picker .ql-picker-options {
  padding: 3px 5px;
  width: 152px;
}
.ql-snow .ql-color-picker .ql-picker-item {
  border: 1px solid transparent;
  float: left;
  height: 16px;
  margin: 2px;
  padding: 0px;
  width: 16px;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg {
  position: absolute;
  margin-top: -9px;
  right: 0;
  top: 50%;
  width: 18px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-label[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-label]:not([data-label=''])::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-label]:not([data-label=''])::before {
  content: attr(data-label);
}
.ql-snow .ql-picker.ql-header {
  width: 98px;
}
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  content: 'Heading 1';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  content: 'Heading 2';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  content: 'Heading 3';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  content: 'Heading 4';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  content: 'Heading 5';
}
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  content: 'Heading 6';
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
  font-size: 2em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
  font-size: 1.5em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
  font-size: 1.17em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
  font-size: 1em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
  font-size: 0.83em;
}
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
  font-size: 0.67em;
}
.ql-snow .ql-picker.ql-font {
  width: 108px;
}
.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
  content: 'Sans Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  content: 'Serif';
}
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  content: 'Monospace';
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before {
  font-family: Georgia, Times New Roman, serif;
}
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before {
  font-family: Monaco, Courier New, monospace;
}
.ql-snow .ql-picker.ql-size {
  width: 98px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
  content: 'Normal';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  content: 'Small';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  content: 'Large';
}
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  content: 'Huge';
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before {
  font-size: 10px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before {
  font-size: 18px;
}
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before {
  font-size: 32px;
}
.ql-snow .ql-color-picker.ql-background .ql-picker-item {
  background-color: #fff;
}
.ql-snow .ql-color-picker.ql-color .ql-picker-item {
  background-color: #000;
}
.ql-toolbar.ql-snow {
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
  padding: 8px;
}
.ql-toolbar.ql-snow .ql-formats {
  margin-right: 15px;
}
.ql-toolbar.ql-snow .ql-picker-label {
  border: 1px solid transparent;
}
.ql-toolbar.ql-snow .ql-picker-options {
  border: 1px solid transparent;
  box-shadow: rgba(0,0,0,0.2) 0 2px 8px;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
  border-color: #ccc;
}
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
  border-color: #000;
}
.ql-toolbar.ql-snow + .ql-container.ql-snow {
  border-top: 0px;
}
.ql-snow .ql-tooltip {
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 5px #ddd;
  color: #444;
  padding: 5px 12px;
  white-space: nowrap;
}
.ql-snow .ql-tooltip::before {
  content: "Visit URL:";
  line-height: 26px;
  margin-right: 8px;
}
.ql-snow .ql-tooltip input[type=text] {
  display: none;
  border: 1px solid #ccc;
  font-size: 13px;
  height: 26px;
  margin: 0px;
  padding: 3px 5px;
  width: 170px;
}
.ql-snow .ql-tooltip a.ql-preview {
  display: inline-block;
  max-width: 200px;
  overflow-x: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}
.ql-snow .ql-tooltip a.ql-action::after {
  border-right: 1px solid #ccc;
  content: 'Edit';
  margin-left: 16px;
  padding-right: 8px;
}
.ql-snow .ql-tooltip a.ql-remove::before {
  content: 'Remove';
  margin-left: 8px;
}
.ql-snow .ql-tooltip a {
  line-height: 26px;
}
.ql-snow .ql-tooltip.ql-editing a.ql-preview,
.ql-snow .ql-tooltip.ql-editing a.ql-remove {
  display: none;
}
.ql-snow .ql-tooltip.ql-editing input[type=text] {
  display: inline-block;
}
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
  border-right: 0px;
  content: 'Save';
  padding-right: 0px;
}
.ql-snow .ql-tooltip[data-mode=link]::before {
  content: "Enter link:";
}
.ql-snow .ql-tooltip[data-mode=formula]::before {
  content: "Enter formula:";
}
.ql-snow .ql-tooltip[data-mode=video]::before {
  content: "Enter video:";
}
.ql-snow a {
  color: #06c;
}
.ql-container.ql-snow {
  border: 1px solid #ccc;
}
.ui-timepicker-container{position:absolute;overflow:hidden;box-sizing:border-box}.ui-timepicker,.ui-timepicker-viewport{box-sizing:content-box;height:205px;display:block;margin:0}.ui-timepicker{list-style:none;padding:0 1px;text-align:center}.ui-timepicker-viewport{padding:0;overflow:auto;overflow-x:hidden}.ui-timepicker-standard{font-family:Verdana,Arial,sans-serif;font-size:1.1em;background-color:#FFF;border:1px solid #AAA;color:#222;margin:0;padding:2px}.ui-timepicker-standard a{border:1px solid transparent;color:#222;display:block;padding:.2em .4em;text-decoration:none}.ui-timepicker-standard .ui-state-hover{background-color:#DADADA;border:1px solid #999;font-weight:400;color:#212121}.ui-timepicker-standard .ui-menu-item{margin:0;padding:0}.ui-timepicker-corners,.ui-timepicker-corners .ui-corner-all{-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px}.ui-timepicker-hidden{display:none}.ui-timepicker-no-scrollbar .ui-timepicker{border:none}
/* Settings styles */

.advanced-options-section .material-icons.tooltip-icon-light-gray {
  color: #adb5bd !important;
}

/* Role help tooltip - CSS only, renders HTML properly */
.role-help-wrapper {
  position: relative;
  display: inline-flex;
}

.role-help-tooltip {
  display: none;
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #212529;
  color: #fff;
  font-size: 12px;
  line-height: 1.4;
  padding: 8px 12px;
  border-radius: 5px;
  width: 298px;
  text-align: left;
  z-index: 1080;
  pointer-events: none;
}

.role-help-wrapper:hover .role-help-tooltip,
.role-help-trigger:focus + .role-help-tooltip {
  display: block;
}

@media (max-width: 767.98px) {
  .role-help-tooltip {
    position: fixed;
    bottom: auto;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: calc(100vw - 48px);
    max-width: 298px;
  }
}

/* CSS-only tooltip for copy button */
.css-tooltip-wrapper {
  position: relative;
}

.css-tooltip {
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: #212529;
  color: #fff;
  font-size: 12px;
  line-height: 1.4;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.15s ease-in-out;
  z-index: 1080;
}

.css-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #212529;
}

.css-tooltip-wrapper:hover .css-tooltip,
.css-tooltip-wrapper .css-tooltip.show {
  opacity: 1;
}

/* Remove location modal cancel button */
.remove-location-cancel-btn {
  color: #6e7985;
  border: 1px solid #6e7985;
  background: transparent;
  font-size: 14px;
  border-radius: 4px;
  height: 2.45rem;
  width: 4rem;
}

.remove-location-cancel-btn:hover {
  color: #fff;
  background-color: #6e7985;
  border-color: #6e7985;
}



/* Email validation styles */
#select_modal input:-webkit-autofill,
#select_modal input:-webkit-autofill:hover,
#select_modal input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px white inset !important;
  box-shadow: 0 0 0 1000px white inset !important;
  background-color: white !important;
}

.email-valid {
  border-color: #32c96a !important;
}

.email-valid:focus {
  border-color: #32c96a !important;
  box-shadow: 0 0 0 0.25rem rgba(50, 201, 106, 0.25) !important;
}

.email-error {
  border-color: #EF4444 !important;
}

.email-error:focus {
  border-color: #EF4444 !important;
  box-shadow: 0 0 0 0.25rem rgba(239, 68, 68, 0.25) !important;
}

/* Profile email validation styles */
.email-valid-profile {
  border-color: #22C55E !important;
}

.email-valid-profile:focus {
  border-color: #22C55E !important;
  box-shadow: 0 0 0 0.25rem rgba(34, 197, 94, 0.25) !important;
}

.email-error-profile {
  border-color: #EF4444 !important;
}

.email-error-profile:focus {
  border-color: #EF4444 !important;
  box-shadow: 0 0 0 0.25rem rgba(239, 68, 68, 0.25) !important;
}

/* Role select dropdown styles */
.role-select-wrapper {
  position: relative;
}

.role-select-trigger {
  cursor: pointer;
  background-color: #fff;
}

.role-select-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  z-index: 1050;
  margin-top: 2px;
}

.role-select-item {
  cursor: pointer;
  transition: background-color 0.15s ease-in-out;
}

.role-select-item:hover {
  background-color: #f8f9fa;
}

.role-select-item:first-child {
  border-radius: 0.375rem 0.375rem 0 0;
}

.role-select-item:last-child {
  border-radius: 0 0 0.375rem 0.375rem;
}

/* Dark mode support */
[data-skin=dark] .role-select-trigger {
  background-color: #222222;
  border-color: #4F4F4F;
  color: #FFFFFF;
}

[data-skin=dark] .role-select-dropdown {
  background-color: #222222;
  border-color: #4F4F4F;
}

[data-skin=dark] .role-select-item:hover {
  background-color: #333333;
}

/* Disabled select styles */
.disabled-select {
  background-color: #f8f9fa !important;
  border: 1px solid #dee2e6 !important;
  color: #6c757d !important;
  cursor: not-allowed !important;
  opacity: 0.8 !important;
}

.disabled-select:after {
  opacity: 0.5 !important;
}

.disabled-select:hover {
  border-color: #dee2e6 !important;
}

/* PIN input styles */
.pin-input-group {
  display: flex;
  gap: 0.5rem;
  width: 100%;
  max-width: 280px;
}

.pin-input-group input {
  width: 60px !important;
  height: 60px !important;
  text-align: center;
  font-size: 1.5rem !important;
  padding: 0.5rem !important;
  flex: 1;
}

/* Dark theme overrides */
[data-skin=dark] .disabled-select {
  background-color: #222222 !important;
  border-color: #4F4F4F !important;
  color: #BDBDBD !important;
}

[data-skin=dark] input.form-control {
  background-color: #222222;
  border-color: #4F4F4F;
  color: #FFFFFF;
}

/* Toggle button styles */
.toggle-password,
.toggle-pin {
  color: #6c757d;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.toggle-password:hover,
.toggle-pin:hover {
  color: #0067B3;
  text-decoration: none;
}

[data-skin=dark] .toggle-password,
[data-skin=dark] .toggle-pin {
  color: #BDBDBD;
}

[data-skin=dark] .toggle-password:hover,
[data-skin=dark] .toggle-pin:hover {
  color: #0093FF;
}

/* Employee Display Settings Modal */
.employee-display-modal {
  background-color: #ffffff;
  border-color: #e5e7eb;
  color: #111827;
}

.employee-display-modal-header {
  background-color: #ffffff;
  border-bottom: 1px solid #e5e7eb;
  color: #111827;
}

.employee-display-modal-title {
  color: #111827 !important;
}

.employee-display-modal-close {
  color: #6b7280;
}

.employee-display-modal-close:hover {
  color: #374151;
}

.employee-display-modal-text {
  color: #6b7280;
}

.employee-display-modal-section-title {
  color: #111827 !important;
}

.employee-display-modal-input {
  background-color: #ffffff;
  border-color: #d1d5db;
  color: #111827;
}

.employee-display-modal-input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.employee-display-modal-input::placeholder {
  color: #9ca3af;
}

.employee-display-modal-button {
  background-color: #ffffff;
  border-color: #d1d5db;
  color: #374151;
}

.employee-display-modal-button:hover {
  background-color: #f9fafb;
}

.employee-display-modal-dropdown {
  background-color: #ffffff;
  border-color: #d1d5db;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.employee-display-modal-dropdown-item {
  color: #374151;
}

.employee-display-modal-dropdown-item:hover {
  background-color: #f3f4f6;
}

.employee-display-modal-container {
  background-color: #f8f9fa;
  border-color: #d1d5db;
}

.employee-display-modal-user-item {
  color: #111827;
}

.employee-display-modal-user-item:hover {
  background-color: #f3f4f6;
}

.employee-display-modal-user-name {
  color: #111827 !important;
}

.employee-display-modal-user-role {
  color: #6b7280 !important;
}

.employee-display-modal-avatar-bg {
  background-color: #d1d5db;
}

.employee-display-modal-avatar-text {
  color: #374151;
}

.employee-display-modal-checkbox {
  background-color: #ffffff;
  border-color: #d1d5db;
}

.employee-display-modal-cancel {
  background-color: #ffffff;
  border-color: #d1d5db;
  color: #374151;
}

.employee-display-modal-cancel:hover {
  background-color: #f9fafb;
}

/* Dark theme overrides for Employee Display Settings Modal */
[data-skin=dark] .employee-display-modal {
  background-color: #1f2937;
  border-color: #374151;
  color: #f9fafb;
}

[data-skin=dark] .employee-display-modal-header {
  background-color: #1f2937;
  border-bottom: 1px solid #374151;
  color: #f9fafb;
}

[data-skin=dark] .employee-display-modal-title {
  color: #f9fafb !important;
}

[data-skin=dark] .employee-display-modal-close {
  color: #9ca3af;
}

[data-skin=dark] .employee-display-modal-close:hover {
  color: #d1d5db;
}

[data-skin=dark] .employee-display-modal-text {
  color: #9ca3af;
}

[data-skin=dark] .employee-display-modal-section-title {
  color: #f9fafb !important;
}

[data-skin=dark] .employee-display-modal-input {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .employee-display-modal-input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

[data-skin=dark] .employee-display-modal-input::placeholder {
  color: #6b7280;
}

[data-skin=dark] .employee-display-modal-button {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .employee-display-modal-button:hover {
  background-color: #4b5563;
}

[data-skin=dark] .employee-display-modal-dropdown {
  background-color: #374151;
  border-color: #4b5563;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.3);
}

[data-skin=dark] .employee-display-modal-dropdown-item {
  color: #d1d5db;
}

[data-skin=dark] .employee-display-modal-dropdown-item:hover {
  background-color: #4b5563;
}

[data-skin=dark] .employee-display-modal-container {
  background-color: #111827;
  border-color: #4b5563;
}

[data-skin=dark] .employee-display-modal-user-item {
  color: #f9fafb;
}

[data-skin=dark] .employee-display-modal-user-item:hover {
  background-color: #374151;
}

[data-skin=dark] .employee-display-modal-user-name {
  color: #f9fafb !important;
}

[data-skin=dark] .employee-display-modal-user-role {
  color: #9ca3af !important;
}

[data-skin=dark] .employee-display-modal-avatar-bg {
  background-color: #4b5563;
}

[data-skin=dark] .employee-display-modal-avatar-text {
  color: #d1d5db;
}

[data-skin=dark] .employee-display-modal-checkbox {
  background-color: #374151;
  border-color: #4b5563;
}

[data-skin=dark] .employee-display-modal-cancel {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .employee-display-modal-cancel:hover {
  background-color: #4b5563;
}

/* Additional border and utility classes */
.employee-display-modal-border {
  border-color: #e5e7eb;
}

[data-skin=dark] .employee-display-modal-border {
  border-color: #374151;
}

.employee-display-modal-border-bottom {
  border-bottom-color: #e5e7eb;
}

[data-skin=dark] .employee-display-modal-border-bottom {
  border-bottom-color: #374151;
}

/* Shift Type Modal Styles */

/* Main Modal Container - Centered Design */
.shift-type-modal-container {
  background-color: #ffffff;
  color: #111827;
  max-width: 600px;
}

/* No separate header styling needed - integrated in container */

.shift-type-modal-title {
  color: #111827 !important;
}

.shift-type-modal-close {
  color: #6b7280;
}

.shift-type-modal-close:hover {
  color: #374151;
}

.shift-type-modal-text {
  color: #6b7280;
}

.shift-type-modal-section-title {
  color: #111827 !important;
}

.shift-type-modal-label {
  color: #374151 !important;
}

/* Info Card */
.shift-type-info-card {
  background-color: #eff6ff;
  border: 1px solid #e0edfe;
}

.shift-type-info-icon {
  color: #1e40af;
}

.shift-type-info-text {
  color: #1e40af;
}

/* Shift Type Cards */
.shift-type-card {
  background-color: #f3f4f6;
  border: 1px solid #d1d5db;
}

.shift-type-drag-icon {
  color: #6b7280;
  cursor: grab;
}

.shift-type-drag-icon:active {
  cursor: grabbing;
}

/* Input Fields */
.shift-type-name-input {
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  color: #111827;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.shift-type-name-input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.shift-type-name-input::placeholder {
  color: #9ca3af;
}

.shift-type-time-input {
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  color: #111827;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.shift-type-time-input:focus {
  outline: none;
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.shift-type-clock-icon {
  color: #9ca3af;
}

/* Buttons */
.shift-type-add-button {
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  color: #374151;
}

.shift-type-add-button:hover {
  background-color: #f9fafb;
}

.shift-type-cancel-button {
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  color: #374151;
}

.shift-type-cancel-button:hover {
  background-color: #f9fafb;
}

.shift-type-save-button {
  background-color: #3b82f6;
  border: 1px solid #3b82f6;
  color: #ffffff;
}

.shift-type-save-button:hover:not(:disabled) {
  background-color: #2563eb;
  border-color: #2563eb;
}

.shift-type-modal-footer {
  border-top: 1px solid #e5e7eb;
}

/* Delete Confirmation Modal */
.shift-type-delete-modal-container {
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
}

.shift-type-delete-title {
  color: #dc2626 !important;
}

.shift-type-delete-warning-icon {
  color: #dc2626;
}

.shift-type-delete-close {
  color: #6b7280;
}

.shift-type-delete-close:hover {
  color: #374151;
}

.shift-type-delete-text {
  color: #6b7280;
}

.shift-type-delete-cancel {
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  color: #374151;
}

.shift-type-delete-cancel:hover {
  background-color: #f9fafb;
}

.shift-type-delete-confirm {
  background-color: #dc2626 !important;
  border: 1px solid #dc2626;
  color: #ffffff;
}

/* Dark Theme Overrides */
[data-skin=dark] .shift-type-modal-container {
  background-color: #1f2937;
  color: #f9fafb;
}

/* Header styles removed - now integrated */

[data-skin=dark] .shift-type-modal-title {
  color: #f9fafb !important;
}

[data-skin=dark] .shift-type-modal-close {
  color: #9ca3af;
}

[data-skin=dark] .shift-type-modal-close:hover {
  color: #d1d5db;
}

[data-skin=dark] .shift-type-modal-text {
  color: #9ca3af;
}

[data-skin=dark] .shift-type-modal-section-title {
  color: #f9fafb !important;
}

[data-skin=dark] .shift-type-modal-label {
  color: #d1d5db !important;
}

[data-skin=dark] .shift-type-info-card {
  background-color: #1e3a8a;
  border-color: #1d4ed8;
}

[data-skin=dark] .shift-type-info-icon {
  color: #bfdbfe;
}

[data-skin=dark] .shift-type-info-text {
  color: #bfdbfe;
}

[data-skin=dark] .shift-type-card {
  background-color: #374151;
  border-color: #4b5563;
}

[data-skin=dark] .shift-type-name-input {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .shift-type-name-input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

[data-skin=dark] .shift-type-name-input::placeholder {
  color: #6b7280;
}

[data-skin=dark] .shift-type-time-input {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .shift-type-time-input:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
}

[data-skin=dark] .shift-type-clock-icon {
  color: #6b7280;
}

[data-skin=dark] .shift-type-add-button {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .shift-type-add-button:hover {
  background-color: #4b5563;
}

[data-skin=dark] .shift-type-cancel-button {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .shift-type-cancel-button:hover {
  background-color: #4b5563;
}

[data-skin=dark] .shift-type-modal-footer {
  border-top-color: #374151;
}

[data-skin=dark] .shift-type-delete-modal-container {
  background-color: #1f2937;
  border-color: #374151;
}

[data-skin=dark] .shift-type-delete-close {
  color: #9ca3af;
}

[data-skin=dark] .shift-type-delete-close:hover {
  color: #d1d5db;
}

[data-skin=dark] .shift-type-delete-text {
  color: #9ca3af;
}

[data-skin=dark] .shift-type-delete-cancel {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .shift-type-delete-cancel:hover {
  background-color: #4b5563;
}
/* ============================================
   Notification Preferences Styles
[data-skin=dark] .locations-checkboxes::-webkit-scrollbar-thumb:hover {
  background: #6b7280;
}
/* ============================================
   Notification Preferences Styles (New Design)
   ============================================ */

/* Category sections */
.notification-category {
  margin-bottom: 2rem;
}

.notification-category h5 {
  color: #1f2937;
  font-size: 1rem;
  font-weight: 600;
  margin-bottom: 1rem;
}

/* Notification item rows */
.notification-item {
  padding: 1rem 0;
}

/* Notification titles/descriptions (WBS 1.6: bold coloured title + muted subtitle) */
.notification-title {
  font-size: 0.9375rem;
  line-height: 1.4;
  font-weight: 600;
}

.notification-subtitle {
  font-size: 0.8125rem;
  line-height: 1.4;
  margin-top: 0.125rem;
}

/* Semantic title colours — mirror the app's status palette */
.notif-title-default {
  color: #1f2937;
}

.notif-title-danger {
  color: #dc3545;
}

.notif-title-warning {
  color: #d9a300;
}

.notif-title-success {
  color: #198754;
}

/* Notification dropdown buttons (that open modals) */
.notification-dropdown-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.375rem 0.625rem;
  font-size: 0.8125rem;
  transition: all 0.15s ease;
  cursor: pointer;
  min-height: 32px;
  max-width: 150px;
  width: 100%;
  overflow: hidden;
}

.notification-dropdown-btn:hover {
  background-color: #f9fafb;
  border-color: #9ca3af;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.notification-dropdown-btn:active {
  background-color: #f3f4f6;
  transform: translateY(1px);
}

.notification-dropdown-btn svg.lucide {
  color: #6b7280;
  flex-shrink: 0;
}

.notification-dropdown-btn .location-count-text {
  color: #374151;
  font-weight: 500;
  flex-grow: 1;
  text-align: left;
  margin-left: 0.5rem;
  font-size: 0.8125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Responsive adjustments for tablets and smaller screens */
@media (max-width: 991px) {
  .notification-dropdown-btn {
    font-size: 0.75rem;
    padding: 0.25rem 0.4rem;
    min-height: 28px;
    max-width: 120px;
  }

  .notification-dropdown-btn .location-count-text {
    font-size: 0.7rem;
    margin-left: 0.25rem;
  }

  .notification-dropdown-btn svg.lucide {
    width: 14px;
    height: 14px;
  }
}

/* Responsive adjustments for mobile */
@media (max-width: 768px) {
  .notification-dropdown-btn {
    font-size: 0.75rem;
    padding: 0.3rem 0.5rem;
    min-height: 30px;
    max-width: 100%;
  }

  .notification-dropdown-btn .location-count-text {
    font-size: 0.75rem;
    margin-left: 0.375rem;
  }
}

/* Dark theme overrides */
[data-skin=dark] .notification-category h5 {
  color: #f9fafb;
}

[data-skin=dark] .notification-title.notif-title-default {
  color: #e5e7eb;
}

[data-skin=dark] .notification-subtitle {
  color: #9ca3af !important;
}

/* Keep semantic title colours readable on the dark skin */
[data-skin=dark] .notif-title-danger {
  color: #f27689;
}

[data-skin=dark] .notif-title-warning {
  color: #f0c94b;
}

[data-skin=dark] .notif-title-success {
  color: #4ade80;
}

[data-skin=dark] .notification-dropdown-btn {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .notification-dropdown-btn:hover {
  background-color: #4b5563;
  border-color: #6b7280;
}

[data-skin=dark] .notification-dropdown-btn:active {
  background-color: #1f2937;
}

[data-skin=dark] .notification-dropdown-btn svg.lucide {
  color: #9ca3af;
}

[data-skin=dark] .notification-dropdown-btn .location-count-text {
  color: #d1d5db;
}

/* Week Period Label Badge (Current Week, etc.) */
.week-period-badge {
  color: #0067b3;
}

[data-skin=dark] .week-period-badge {
  color: #ffffff;
  background-color: #0067B3;
  border: 3px solid #0067B3;
}

/* =====================================   Location Settings - Table & Rearrange Modal
   ============================================ */

/* Rearrange Locations button */
.btn-rearrange-locations {
  background-color: #0067B3;
  border: none;
  border-radius: 8px;
  padding: 10px 20px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  white-space: nowrap;
}

.btn-rearrange-locations:hover {
  background-color: #005a9e;
  color: #fff;
}

/* Locations table */
.locations-table {
  margin-bottom: 0;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
}

.locations-table thead th {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #6B7280;
  background-color: #F9FAFB;
  border-bottom: 1px solid #E5E7EB;
  padding: 12px 16px;
  white-space: nowrap;
}

.locations-table tbody td {
  padding: 16px;
  vertical-align: middle;
  font-size: 0.875rem;
  color: #111827;
  border-bottom: 1px solid #E5E7EB;
}

.locations-table tbody tr:last-child td {
  border-bottom: none;
}

.locations-table-row {
  cursor: pointer;
  transition: background-color 0.15s;
}

.locations-table-row:hover {
  background-color: #F9FAFB;
}

/* Search row */
.locations-search-row .input-group {
  border: 1px solid #D1D5DB;
  border-radius: 8px;
  overflow: hidden;
}

.locations-search-row .input-group-text {
  border: none;
  padding-left: 12px;
}

.locations-search-row .form-control {
  border: none;
  box-shadow: none;
  font-size: 0.875rem;
}

.locations-search-row .form-control:focus {
  box-shadow: none;
}

/* ---- Rearrange Modal (slide-in from right) ---- */
.modal-dialog-slideright {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  margin: 0;
  width: 420px;
  max-width: 100vw;
  transform: translateX(100%);
  transition: transform 0.3s ease;
}

.modal.show .modal-dialog-slideright {
  transform: translateX(0);
}

.rearrange-modal-content {
  height: 100vh;
  border: none;
  border-radius: 0;
  display: flex;
  flex-direction: column;
}

.rearrange-modal-header {
  padding: 20px 24px 16px;
  border: none;
  align-items: flex-start;
  flex-shrink: 0;
}

.rearrange-modal-title-group {
  flex: 1;
}

.rearrange-modal-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
}

.rearrange-modal-subtitle {
  font-size: 0.8125rem;
  color: #6B7280;
  margin: 4px 0 0 0;
  line-height: 1.4;
}

.rearrange-modal-body {
  flex: 1;
  overflow-y: auto;
  padding: 0 24px 24px;
  min-height: 0;
}

.rearrange-tip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  background-color: #F9FAFB;
  border-radius: 8px;
  margin-bottom: 16px;
  font-size: 0.8125rem;
  color: #374151;
  flex-shrink: 0;
}

.rearrange-tip svg {
  color: #9CA3AF;
  flex-shrink: 0;
}

/* Rearrange list */
.rearrange-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rearrange-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: #F9FAFB;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  margin-bottom: 8px;
  cursor: grab;
  transition: box-shadow 0.15s, background-color 0.15s;
  user-select: none;
}

.rearrange-item:hover {
  background: #F3F4F6;
}

.rearrange-item.rearrange-dragging {
  opacity: 0.5;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.rearrange-handle {
  cursor: grab;
  color: #9CA3AF;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.rearrange-handle:active {
  cursor: grabbing;
}

.rearrange-number {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #E5E7EB;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: #374151;
  flex-shrink: 0;
}

.rearrange-info {
  flex: 1;
  min-width: 0;
}

.rearrange-name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #111827;
}

.rearrange-address {
  font-size: 0.75rem;
  color: #6B7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.rearrange-modal-footer {
  display: flex;
  gap: 12px;
  padding: 16px 24px;
  border-top: 1px solid #E5E7EB;
  flex-shrink: 0;
}

.rearrange-btn-close {
  flex: 1;
  padding: 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background: #fff;
  border: 1px solid #D1D5DB;
  border-radius: 8px;
  cursor: pointer;
}

.rearrange-btn-close:hover {
  background: #F9FAFB;
}

.rearrange-btn-save {
  flex: 1;
  padding: 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  background-color: #0067B3;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

.rearrange-btn-save:hover:not(:disabled) {
  background-color: #005a9e;
}

.rearrange-btn-save:disabled {
  color: #fff;
  background-color: #85b7e0;
  cursor: not-allowed;
  opacity: 1;
}

/* Dark mode */
[data-skin=dark] .locations-table {
  border-color: #374151;
}

[data-skin=dark] .locations-table thead th {
  color: #9CA3AF;
  background-color: #1F2937;
  border-bottom-color: #374151;
}

[data-skin=dark] .locations-table tbody td {
  color: #E5E7EB;
  border-bottom-color: #374151;
}

[data-skin=dark] .locations-table-row:hover {
  background-color: #1F2937;
}

[data-skin=dark] .locations-search-row .input-group {
  border-color: #374151;
}

[data-skin=dark] .locations-search-row .input-group-text {
  background: #1F2937;
}

[data-skin=dark] .locations-search-row .form-control {
  background: #1F2937;
  color: #E5E7EB;
}

[data-skin=dark] .rearrange-modal-content {
  background: #111827;
}

[data-skin=dark] .rearrange-modal-title {
  color: #F9FAFB;
}

[data-skin=dark] .rearrange-modal-subtitle {
  color: #9CA3AF;
}

[data-skin=dark] .rearrange-tip {
  background: #1F2937;
  color: #D1D5DB;
}

[data-skin=dark] .rearrange-item {
  background: #1F2937;
  border-color: #374151;
}

[data-skin=dark] .rearrange-item:hover {
  background: #374151;
}

[data-skin=dark] .rearrange-number {
  background: #374151;
  color: #D1D5DB;
}

[data-skin=dark] .rearrange-name {
  color: #F9FAFB;
}

[data-skin=dark] .rearrange-address {
  color: #9CA3AF;
}

[data-skin=dark] .rearrange-modal-footer {
  border-top-color: #374151;
}

[data-skin=dark] .rearrange-btn-close {
  background: #1F2937;
  color: #D1D5DB;
  border-color: #374151;
}

[data-skin=dark] .rearrange-btn-close:hover {
  background: #374151;
}

/* ============================================
   Location Edit Page
   ============================================ */

.location-edit-card {
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  box-shadow: none;
}

.location-edit-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.location-edit-back {
  color: #374151;
  display: flex;
  align-items: center;
  text-decoration: none;
  transition: color 0.15s;
}

.location-edit-back:hover {
  color: #111827;
}

.location-edit-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #111827;
  margin: 0;
}

/* Tabs */
.location-edit-tabs {
  border-bottom: 1px solid #E5E7EB;
  gap: 0;
  flex-wrap: nowrap;
}

.location-tab {
  font-size: 0.875rem;
  font-weight: 500;
  color: #6B7280 !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 10px 16px;
  border-radius: 0 !important;
  background: none !important;
  transition: color 0.15s, border-color 0.15s;
  white-space: nowrap;
}

@media (max-width: 575.98px) {
  .location-tab {
    font-size: 0.8125rem;
    padding: 10px 8px;
  }
}

.location-tab:hover {
  color: #374151 !important;
}

.location-tab.active {
  color: #0067B3 !important;
  border-bottom-color: #0067B3 !important;
  font-weight: 600;
}

/* Assigned Users table */
.assigned-users-table {
  margin-bottom: 0;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  border-collapse: separate;
  border-spacing: 0;
}

/* Round individual corner cells so the row-action dropdown isn't clipped by an
   overflow:hidden on the table (needed for the menu to escape on the last row). */
.assigned-users-table thead th:first-child {
  border-top-left-radius: 8px;
}

.assigned-users-table thead th:last-child {
  border-top-right-radius: 8px;
}

.assigned-users-table tbody tr:last-child td:first-child {
  border-bottom-left-radius: 8px;
}

.assigned-users-table tbody tr:last-child td:last-child {
  border-bottom-right-radius: 8px;
}

/* Allow the row-action dropdown to overflow the responsive scroll wrapper. */
#assigned_users .table-responsive {
  overflow: visible;
}

.assigned-users-table thead th {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #6B7280;
  background-color: #F9FAFB;
  border-bottom: 1px solid #E5E7EB;
  padding: 12px 16px;
  white-space: nowrap;
}

.assigned-users-table tbody td {
  padding: 14px 16px;
  vertical-align: middle;
  font-size: 0.875rem;
  color: #111827;
  border-bottom: 1px solid #E5E7EB;
}

.assigned-users-table tbody tr:last-child td {
  border-bottom: none;
}

.assigned-users-table tbody tr:hover {
  background-color: #F9FAFB;
}

/* Assign User button */
.btn-assign-user {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background-color: #0067B3;
  border: none;
  border-radius: 8px;
  padding: 8px 16px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
}

.btn-assign-user:hover {
  background-color: #005a9e;
  color: #fff;
}

/* Security tab cards — clip header's square bottom corners to the card's
   rounded border-radius so every card looks consistently rounded, even when
   the card contains only a header (e.g., the "Location Security" title card). */
#security .card {
  overflow: hidden;
}

/* Dark mode - Location Edit */
[data-skin=dark] .location-edit-card {
  background-color: #1f2937;
  border-color: #374151;
}

/* Custom select with icon */
.select-with-icon {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2.5rem;
  background-image: none;
}

.select-with-icon.text-muted {
  color: #6c757d !important;
}

.select-with-icon:not(.text-muted) {
  color: #212529 !important;
}

.pointer-events-none {
  pointer-events: none;
}

.transition-transform {
  transition: transform 0.2s ease-in-out;
}

[data-skin=dark] .select-with-icon:not(.text-muted) {
  color: #ffffff !important;
}

/* Location select dropdown */
.location-select-wrapper {
  position: relative;
}

.location-select-trigger {
  cursor: pointer;
  background-color: #fff;
  border-radius: 0.375rem;
}

.location-select-trigger:hover {
  border-color: #86b7fe;
}

.location-select-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 1050;
  background-color: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  margin-top: 0.25rem;
}

.location-select-search .input-group-text {
  border-color: #dee2e6;
}

.location-select-search .form-control {
  border-color: #dee2e6;
}

.location-select-search .form-control:focus {
  box-shadow: none;
  border-color: #dee2e6;
}

.location-select-actions {
  background-color: #f9fafb;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
}

.location-select-list {
  max-height: 160px;
  overflow-y: auto;
}

.location-select-item {
  border-bottom: 1px solid #dee2e6;
  cursor: pointer;
}

.location-select-item:last-child {
  border-bottom: none;
}

.location-select-item:hover {
  background-color: #f8f9fa;
}

.location-select-item .form-check-input {
  cursor: pointer;
  width: 1.1rem;
  height: 1.1rem;
}

.location-info {
  flex: 1;
}

/* Dark mode */
[data-skin=dark] .location-select-trigger {
  background-color: #1f2937;
  border-color: #374151;
  color: #fff;
}

[data-skin=dark] .location-select-dropdown {
  background-color: #1f2937;
  border-color: #374151;
}

[data-skin=dark] .location-select-actions {
  background-color: #111827;
  border-color: #374151;
}

[data-skin=dark] .location-edit-back {
  color: #D1D5DB;
}

[data-skin=dark] .location-edit-back:hover {
  color: #F9FAFB;
}

[data-skin=dark] .location-edit-title {
  color: #F9FAFB;
}

[data-skin=dark] .location-edit-tabs {
  border-bottom-color: #374151;
}

[data-skin=dark] .location-tab {
  color: #9CA3AF !important;
}

[data-skin=dark] .location-tab:hover {
  color: #D1D5DB !important;
}

[data-skin=dark] .location-tab.active {
  color: #60A5FA !important;
  border-bottom-color: #60A5FA !important;
}

[data-skin=dark] .assigned-users-table {
  border-color: #374151;
}

[data-skin=dark] .assigned-users-table thead th {
  color: #9CA3AF;
  background-color: #1F2937;
  border-bottom-color: #374151;
}

[data-skin=dark] .assigned-users-table tbody td {
  color: #E5E7EB;
  border-bottom-color: #374151;
}

[data-skin=dark] .assigned-users-table tbody tr:hover {
  background-color: #1F2937;
}

@media (max-width: 575.98px) {
  .modal-dialog-slideright {
    width: 100vw;
  }

  .btn-rearrange-locations {
    padding: 8px 14px;
    font-size: 0.8rem;
  }
}

/* =====================================   Assign Users Modal
   ============================================ */

.assign-users-dialog {
  max-width: 520px;
}

.assign-users-content {
  border-radius: 12px;
  border: none;
  overflow: hidden;
}

.assign-users-header {
  padding: 20px 24px 12px;
  border: none;
  align-items: flex-start;
}

.assign-users-title-group {
  flex: 1;
}

.assign-users-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #111827;
  margin: 0;
}

.assign-users-subtitle {
  font-size: 0.8125rem;
  color: #6B7280;
  margin: 4px 0 0 0;
}

.assign-users-body {
  padding: 0 24px;
  max-height: 420px;
  overflow-y: auto;
}

.assign-users-search .input-group {
  border: 1px solid #D1D5DB;
  border-radius: 8px;
  overflow: hidden;
}

.assign-users-search .input-group-text {
  border: none;
  padding-left: 12px;
}

.assign-users-search .form-control {
  border: none;
  box-shadow: none;
  font-size: 0.875rem;
}

.assign-users-search .form-control:focus {
  box-shadow: none;
}

.assign-users-actions {
  display: flex;
  justify-content: space-between;
  padding: 8px 4px;
  border-bottom: 1px solid #E5E7EB;
  margin-bottom: 4px;
}

.assign-users-actions .form-check-label {
  font-size: 0.8125rem;
  color: #374151;
}

/* User list */
.assign-users-list {
  max-height: 300px;
  overflow-y: auto;
}

.assign-users-item {
  display: flex;
  align-items: center;
  padding: 10px 4px;
  border-bottom: 1px solid #F3F4F6;
  gap: 10px;
}

.assign-users-item:last-child {
  border-bottom: none;
}

.assign-users-item-check {
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.assign-users-avatar {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background-color: #E5E7EB;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

[data-skin=dark] .location-select-item {
  border-color: #374151;
}

[data-skin=dark] .location-select-item:hover {
  background-color: #374151;
}

[data-skin=dark] .location-select-search .input-group-text,
[data-skin=dark] .location-select-search .form-control {
  background-color: #1f2937;
  border-color: #374151;
  color: #fff;
}

/* ============================================
   Users Tabs (Active/Deleted)
   ============================================ */

.users-tabs-container {
  display: flex;
  background-color: #f3f4f6;
  border-radius: 8px;
  padding: 4px;
  margin-bottom: 1rem;
}

.users-tab {
  flex: 1;
  text-align: center;
  padding: 0.625rem 1rem;
  font-size: 0.875rem;
  font-weight: 700;
  color: #6b7280;
  background-color: transparent;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  text-decoration: none;
}

.users-tab:hover {
  color: #374151;
  text-decoration: none;
}

.users-tab-active {
  background-color: #ffffff;
  color: #111827;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.users-tab-active:hover {
  color: #111827;
}

/* SP-SET-6: the washup-admin--tabs Stimulus controller toggles
   .tabs-button--active; map it onto the shared active-tab styling so the
   Service Partner Users and Roles tabs match the customer segmented control. */
.users-tab.tabs-button--active {
  background-color: #ffffff;
  color: #111827;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.users-tab.tabs-button--active:hover {
  color: #111827;
}

/* SP-SET-7: role pill (white bg, grey border) — Transfer Ownership + settings. */
.sp-role-pill {
  display: inline-block;
  background: #ffffff;
  color: #374151;
  border: 1px solid #d1d5db;
  font-weight: 500;
  font-size: 13px;
  padding: 4px 12px;
  border-radius: 9999px;
}

/* Deleted users info card */
.deleted-users-info {
  background-color: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  padding: 1rem;
  margin-bottom: 1rem;
}

.deleted-users-info-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background-color: #fcdadb;
  border-radius: 50%;
  color: #dc2626;
  flex-shrink: 0;
}

.deleted-users-info-title {
  color: #000000;
  font-weight: 600;
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}

.deleted-users-info-text {
  color: #555555;
  font-size: 0.8125rem;
  line-height: 1.5;
  margin: 0;
}

.deleted-users-info-text strong {
  color: #000000;
  font-weight: 600;
}

.deleted-users-info-text ul {
  margin: 0.25rem 0 0 0;
  padding-left: 1.25rem;
  list-style: disc;
}

.deleted-users-info-text li {
  margin-bottom: 0.125rem;
}

@media (max-width: 576px) {
  .deleted-users-info {
    padding: 0.75rem;
  }
  .deleted-users-info .d-flex {
    gap: 0.5rem !important;
  }
  .deleted-users-info-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
  }
  .deleted-users-info-text ul {
    padding-left: 1rem;
  }
}

/* Restore button */
.restore-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 96px;
  height: 32px;
  gap: 6px;
  padding-left: 10px;
  padding-right: 10px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #3a9742;
  background-color: #ffffff;
  border: 1px solid #c6e1c9;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  text-decoration: none;
}

.restore-btn:hover {
  background-color: #f0fdf4;
  color: #3a9742;
  border-color: #3a9742;
  text-decoration: none;
}

.restore-btn:active {
  background-color: #dcfce7;
  border-color: #3a9742;
}

.restore-btn svg {
  width: 14px;
  height: 14px;
  color: #3a9742;
}

/* Restore User Modal */
.restore-modal-dialog {
  max-width: 46.875rem; /* 750px */
}

.restore-modal-content {
  background-color: #FAFAFA;
  border: 0.075rem solid #E1E1E1; /* 1.2px */
  border-radius: 0.75rem; /* 11.98px */
  padding: 1.8rem; /* 28.75px */
}

.restore-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0;
  border: none;
  margin-bottom: 1.2rem; /* gap: 19.17px */
}

.restore-modal-title-group {
  flex: 1;
}

.restore-modal-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #000000;
  margin: 0;
}

.restore-modal-subtitle {
  font-size: 0.875rem;
  color: #555555;
  margin: 0.25rem 0 0 0;
}

.restore-modal-close {
  border: none;
  padding: 0;
  opacity: 0.5;
  transition: opacity 0.15s;
  align-self: flex-start;
  margin-top: 0.25rem;
}

.restore-modal-close:hover {
  opacity: 1;
}

.restore-modal-body {
  padding: 0;
}

.restore-user-card {
  background-color: rgba(242, 242, 242, 0.5); /* #F2F2F280 */
  border: 1px solid #E5E7EB;
  border-radius: 0.5rem;
  padding: 1rem;
}

.restore-user-card-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.restore-user-avatar {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background-color: #e5e7eb;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}

.restore-user-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.restore-user-avatar-initials {
  font-size: 0.875rem;
  font-weight: 600;
  color: #374151;
}

.restore-user-info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.restore-user-name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #000000;
}

.restore-user-email {
  font-size: 0.8125rem;
  color: #555555;
}

.restore-user-role-pill {
  background-color: #FEFEFF;
  border: 0.123rem solid #E5E7EB; /* 1.97px */
  border-radius: 852.84rem; /* 13645.45px - pill shape */
  padding: 0.256rem 0.938rem; /* 4.09px 15.01px */
  font-size: 0.8125rem;
  font-weight: 500;
  color: #374151;
  white-space: nowrap;
}

.restore-user-card-divider {
  border: none !important;
  border-top: 1px solid #D1D5DB !important;
  margin: 0.75rem 0;
  opacity: 1;
}

.restore-user-card-details {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.restore-detail-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: #555555;
}

.restore-detail-item svg {
  color: #9ca3af;
  flex-shrink: 0;
}

.restore-modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 0;
  border: none;
  margin-top: 1.5rem;
}

.restore-modal-cancel {
  padding: 0.625rem 1.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background-color: #ffffff;
  border: 1px solid #E1E1E1;
  border-radius: 0.5rem;
  cursor: pointer;
}

.restore-modal-cancel:hover {
  background-color: #ffffff;
  color: #374151;
  border: 1px solid #E1E1E1;
}

.restore-modal-submit {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.25rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #ffffff;
  background-color: #3A9742;
  border: none;
  border-radius: 0.5rem;
  cursor: pointer;
  transition: background-color 0.15s;
}

.restore-modal-submit:hover {
  background-color: #3A9742;
  color: #ffffff;
  text-decoration: none;
}

.restore-modal-submit svg {
  width: 1rem;
  height: 1rem;
}

.deleted-user-clickable {
  cursor: pointer;
}

.deleted-user-clickable:hover {
  background-color: #f9fafb;
}

/* Shared empty state — used by both Active and Deleted Users tables */
.empty-state-inner {
  background-color: #f9fafb;
  border: 2px dashed #dee2e6;
  border-radius: 8px;
}

.empty-state-icon-wrapper {
  display: flex;
  justify-content: center;
}

.empty-state-icon-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background: white;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Dark mode support */
[data-skin=dark] .users-tabs-container {
  background-color: #374151;
}

[data-skin=dark] .users-tab {
  color: #9ca3af;
}

[data-skin=dark] .users-tab:hover {
  color: #d1d5db;
}

[data-skin=dark] .users-tab-active {
  background-color: #1f2937;
  color: #f9fafb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-skin=dark] .users-tab-active:hover {
  color: #f9fafb;
}

[data-skin=dark] .users-tab.tabs-button--active {
  background-color: #1f2937;
  color: #f9fafb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

[data-skin=dark] .deleted-users-info {
  background-color: #450a0a;
  border-color: #7f1d1d;
}

[data-skin=dark] .deleted-users-info-icon {
  background-color: #7f1d1d;
  color: #f87171;
}

[data-skin=dark] .deleted-users-info-title {
  color: #f9fafb;
}

[data-skin=dark] .deleted-users-info-text {
  color: #9ca3af;
}

[data-skin=dark] .deleted-users-info-text strong {
  color: #f9fafb;
}

[data-skin=dark] .restore-btn {
  color: #4ade80;
  background-color: #1f2937;
  border-color: #374151;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

[data-skin=dark] .restore-btn:hover {
  background-color: #374151;
  color: #4ade80;
  border-color: #4ade80;
}

[data-skin=dark] .restore-btn svg {
  color: #4ade80;
}

/* Dark mode - Restore User Modal */
[data-skin=dark] .restore-modal-content {
  background-color: #1f2937;
  border-color: #374151;
}

[data-skin=dark] .restore-modal-title {
  color: #f9fafb;
}

[data-skin=dark] .restore-modal-subtitle {
  color: #9ca3af;
}

[data-skin=dark] .restore-user-card {
  background-color: rgba(55, 65, 81, 0.5);
  border-color: #4b5563;
}

[data-skin=dark] .restore-user-avatar {
  background-color: #4b5563;
}

[data-skin=dark] .restore-user-avatar-initials {
  color: #d1d5db;
}

[data-skin=dark] .restore-user-name {
  color: #f9fafb;
}

[data-skin=dark] .restore-user-email {
  color: #9ca3af;
}

[data-skin=dark] .restore-user-role-pill {
  background-color: #374151;
  border-color: #4b5563;
  color: #d1d5db;
}

[data-skin=dark] .restore-detail-item {
  color: #9ca3af;
}

[data-skin=dark] .restore-detail-item svg {
  color: #6b7280;
}

[data-skin=dark] .restore-modal-cancel {
  color: #d1d5db;
  background-color: #1f2937;
  border-color: #4b5563;
}

[data-skin=dark] .restore-modal-cancel:hover {
  background-color: #1f2937;
  color: #d1d5db;
  border-color: #4b5563;
}

/* Delete User Modal Buttons */
.delete-modal-cancel-btn,
.delete-modal-delete-btn {
  min-width: 98.58px;
  height: 48.91px;
  padding: 11.62px 20.79px 12.84px 20.79px;
  border-radius: 3.42px;
  border-width: 1.22px;
  font-weight: 500;
}

.delete-modal-cancel-btn {
  background-color: #ffffff;
  border: 1.22px solid #d1d5db;
  color: #212529;
}

.delete-modal-cancel-btn:hover {
  background-color: #ffffff;
  border-color: #d1d5db;
  color: #212529;
}

.delete-modal-delete-btn {
  background-color: #EF4444;
  border: 1.22px solid #EF4444;
  color: #ffffff;
}

.delete-modal-delete-btn:hover {
  background-color: #dc2626;
  border-color: #dc2626;
  color: #ffffff;
}

/* Dark mode */
[data-skin=dark] .delete-modal-cancel-btn {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .delete-modal-cancel-btn:hover {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

/* ============================================
   Users Search and Export Row
   ============================================ */

.users-search-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin-bottom: 1rem;
}

.users-search-row form {
  flex-grow: 1;
  margin: 0;
}

.users-search-input {
  border-radius: 8px;
  border: 1px solid #E1E1E1;
  height: 36px;
  width: 100%;
}

.users-search-input:focus {
  border-color: #0067B3;
  box-shadow: 0 0 0 0.2rem rgba(0, 103, 179, 0.15);
}

[data-skin=dark] .users-search-input {
  background-color: #222222;
  border-color: #4F4F4F;
  color: #FFFFFF;
}

[data-skin=dark] .users-search-input:focus {
  border-color: #0093FF;
  box-shadow: 0 0 0 0.2rem rgba(0, 147, 255, 0.15);
}

/* ============================================
   Export Button & Dropdown
   ============================================ */

.export-dropdown {
  position: relative;
}

.btn-export {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 94px;
  height: 36px;
  padding: 8px 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #212529;
  background-color: #ffffff;
  border: 1px solid #E1E1E1;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  text-decoration: none;
  flex-shrink: 0;
}

.btn-export:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
  color: #212529;
  text-decoration: none;
}

.btn-export:active,
.btn-export:focus {
  background-color: #f3f4f6;
  outline: none;
  box-shadow: none;
}

.btn-export svg {
  width: 16px;
  height: 16px;
  color: #212529;
}

.export-dropdown-menu {
  min-width: 160px;
  padding: 4px;
  border: 1px solid #E1E1E1;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.export-dropdown-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 0.875rem;
  color: #212529;
  border-radius: 6px;
  transition: background-color 0.15s ease-in-out;
}

.export-dropdown-item:hover {
  background-color: #f3f4f6;
  color: #212529;
}

.export-dropdown-item svg {
  width: 16px;
  height: 16px;
  color: #6b7280;
}

/* Dark mode */
[data-skin=dark] .btn-export {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .btn-export:hover {
  background-color: #4b5563;
  border-color: #6b7280;
  color: #f9fafb;
}

[data-skin=dark] .btn-export:active,
[data-skin=dark] .btn-export:focus {
  background-color: #4b5563;
}

[data-skin=dark] .btn-export svg {
  color: #f9fafb;
}

[data-skin=dark] .export-dropdown-menu {
  background-color: #1f2937;
  border-color: #374151;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

[data-skin=dark] .export-dropdown-item {
  color: #f9fafb;
}

[data-skin=dark] .export-dropdown-item:hover {
  background-color: #374151;
  color: #f9fafb;
}

[data-skin=dark] .export-dropdown-item svg {
  color: #9ca3af;
}

/* ============================================
   Pending Invitation Card
   ============================================ */

.pending-invitation-card {
  background-color: #f3f8fc;
  border: 1px solid #afd1ec;
  border-radius: 10px;
  padding: 21px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.pending-invitation-row-1 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: flex-start;
}

.pending-invitation-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #dcecf7;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.assign-users-initials {
  font-size: 0.75rem;
  font-weight: 600;
  color: #374151;
}

.assign-users-info {
  flex: 1;
  min-width: 0;
}

.assign-users-name {
  font-size: 0.875rem;
  font-weight: 500;
  color: #111827;
}

.assign-users-email {
  font-size: 0.75rem;
  color: #6B7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.assign-users-role-pill {
  background-color: #F3F4F6;
  border: 1px solid #E5E7EB;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 0.75rem;
  font-weight: 500;
  color: #374151;
  white-space: nowrap;
  flex-shrink: 0;
  min-width: 110px;
  text-align: center;
}

/* Footer */
.assign-users-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  border-top: 1px solid #E5E7EB;
}

.assign-users-count {
  font-size: 0.8125rem;
  color: #6B7280;
}

.assign-users-footer-actions {
  display: flex;
  gap: 10px;
}

.assign-users-btn-cancel {
  padding: 8px 20px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background: #fff;
  border: 1px solid #D1D5DB;
  border-radius: 8px;
  cursor: pointer;
}

.assign-users-btn-cancel:hover {
  background: #F9FAFB;
}

.assign-users-btn-submit {
  padding: 8px 20px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  background-color: #0067B3;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

.assign-users-btn-submit:hover:not(:disabled) {
  background-color: #005a9e;
}

.assign-users-btn-submit:disabled {
  background-color: #85b7e0;
  color: #fff;
  cursor: not-allowed;
}

/* Dark mode - Assign Users Modal */
[data-skin=dark] .assign-users-content {
  background: #111827;
}

[data-skin=dark] .assign-users-title {
  color: #F9FAFB;
}

[data-skin=dark] .assign-users-subtitle {
  color: #9CA3AF;
}

[data-skin=dark] .assign-users-search .input-group {
  border-color: #374151;
}

[data-skin=dark] .assign-users-search .input-group-text {
  background: #1F2937;
}

[data-skin=dark] .assign-users-search .form-control {
  background: #1F2937;
  color: #E5E7EB;
}

[data-skin=dark] .assign-users-actions {
  border-bottom-color: #374151;
}

[data-skin=dark] .assign-users-actions .form-check-label {
  color: #D1D5DB;
}

[data-skin=dark] .assign-users-item {
  border-bottom-color: #374151;
}

[data-skin=dark] .assign-users-avatar {
  background-color: #374151;
}

[data-skin=dark] .assign-users-initials {
  color: #D1D5DB;
}

[data-skin=dark] .assign-users-name {
  color: #F9FAFB;
}

[data-skin=dark] .assign-users-email {
  color: #9CA3AF;
}

[data-skin=dark] .assign-users-role-pill {
  background: #1F2937;
  border-color: #374151;
  color: #D1D5DB;
}

[data-skin=dark] .assign-users-footer {
  border-top-color: #374151;
}

[data-skin=dark] .assign-users-btn-cancel {
  background: #1F2937;
  color: #D1D5DB;
  border-color: #374151;
}

[data-skin=dark] .assign-users-btn-cancel:hover {
  background: #374151;
}

.pending-invitation-icon svg {
  color: #1477c6;
}

.pending-invitation-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pending-invitation-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
}

.pending-invitation-description {
  font-size: 0.875rem;
  color: #4b5563;
  margin: 0;
  line-height: 1.5;
}

.pending-invitation-description strong {
  color: #1f2937;
}

.pending-invitation-row-2 {
  display: flex;
  gap: 12px;
  align-items: center;
}

@media (max-width: 767.98px) {
  .pending-invitation-row-2 {
    flex-direction: column;
  }
  .btn-copy-invitation,
  .pending-invitation-resend,
  .btn-cancel-invitation {
    width: 100% !important;
  }
}

/* button_to wraps the Resend button in a form; make the form participate in the
   row's flex layout so the button sits inline next to Copy / Cancel. */
.pending-invitation-resend {
  flex: 1;
  display: flex;
  margin: 0;
}

.btn-resend-invitation {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 8px 16px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #2563eb;
  background-color: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-resend-invitation:hover {
  background-color: #dbeafe;
  border-color: #93c5fd;
}

.btn-resend-invitation svg {
  color: #2563eb;
}

.btn-copy-invitation {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 8px 16px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background-color: #ffffff;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  text-decoration: none;
}

.btn-copy-invitation:hover {
  background-color: #f9fafb;
  border-color: #9ca3af;
  color: #374151;
  text-decoration: none;
}

.btn-copy-invitation svg {
  color: #6b7280;
}

.btn-cancel-invitation {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 161px;
  height: 36px;
  padding: 8px 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #ee4c54;
  background-color: #fef2f3;
  border: 1px solid #f7aaae;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  flex-shrink: 0;
}

.btn-cancel-invitation:hover {
  background-color: #fee2e2;
  border-color: #ee4c54;
}

.btn-cancel-invitation svg {
  color: #ee4c54;
}

.pending-invitation-row-3 {
  margin-top: 4px;
}

.pending-invitation-helper {
  font-size: 0.8125rem;
  color: #6b7280;
  margin: 0;
}

/* Dark mode */
[data-skin=dark] .pending-invitation-card {
  background-color: #1e3a5f;
  border-color: #3b82f6;
}

[data-skin=dark] .pending-invitation-icon {
  background-color: #1e40af;
}

[data-skin=dark] .pending-invitation-icon svg {
  color: #93c5fd;
}

[data-skin=dark] .pending-invitation-title {
  color: #f9fafb;
}

[data-skin=dark] .pending-invitation-description {
  color: #d1d5db;
}

[data-skin=dark] .pending-invitation-description strong {
  color: #f9fafb;
}

[data-skin=dark] .btn-copy-invitation {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .btn-copy-invitation:hover {
  background-color: #4b5563;
  border-color: #6b7280;
}

[data-skin=dark] .btn-copy-invitation svg {
  color: #9ca3af;
}

[data-skin=dark] .btn-resend-invitation {
  background-color: #1e3a8a;
  border-color: #3b82f6;
  color: #bfdbfe;
}

[data-skin=dark] .btn-resend-invitation:hover {
  background-color: #1e40af;
}

[data-skin=dark] .btn-resend-invitation svg {
  color: #bfdbfe;
}

[data-skin=dark] .btn-cancel-invitation {
  background-color: #450a0a;
  border-color: #7f1d1d;
  color: #f87171;
}

[data-skin=dark] .btn-cancel-invitation:hover {
  background-color: #7f1d1d;
}

[data-skin=dark] .btn-cancel-invitation svg {
  color: #f87171;
}

[data-skin=dark] .pending-invitation-helper {
  color: #9ca3af;
}

/* ============================================
   Cancel Invitation Modal
   ============================================ */

.cancel-invitation-dialog {
  max-width: 521.52px;
}

.cancel-invitation-content {
  border: 1.16px solid #E5E7EB;
  border-radius: 5.59px;
  padding: 29.1px;
}

.cancel-invitation-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0;
  border: none;
  margin-bottom: 18.63px;
}

.cancel-invitation-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
}

.cancel-invitation-body {
  padding: 0;
}

.cancel-invitation-warning-card {
  background-color: #FEE4E4;
  border: 1.16px solid #FECACA;
  border-radius: 5.59px;
  padding: 19.79px;
}

.cancel-invitation-question {
  font-size: 0.9375rem;
  color: #991B1B;
  margin: 0 0 9.31px 0;
  line-height: 1.5;
}

.cancel-invitation-question strong {
  color: #991B1B;
}

.cancel-invitation-this-will {
  font-size: 0.875rem;
  font-weight: 600;
  color: #991B1B;
  margin: 0 0 8px 0;
}

.cancel-invitation-list {
  margin: 0;
  padding-left: 24px;
  color: #991B1B;
  font-size: 0.875rem;
  line-height: 1.6;
  list-style-type: disc;
}

.cancel-invitation-list li {
  margin-bottom: 4px;
  display: list-item;
}

.cancel-invitation-footer {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  padding: 0;
  border: none;
  margin-top: 18.63px;
}

.btn-keep-invitation {
  min-width: 163px;
  height: 48.91px;
  padding: 11.62px 20.79px 12.84px 20.79px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background-color: #ffffff;
  border: 1.22px solid #E2E8F0;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-keep-invitation:hover {
  background-color: #f9fafb;
  border-color: #cbd5e1;
}

.btn-confirm-cancel-invitation {
  min-width: 168px;
  height: 48.91px;
  padding: 9.31px 18.63px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #ffffff;
  background-color: #EF4444;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.btn-confirm-cancel-invitation:hover {
  background-color: #dc2626;
}

@media (max-width: 767.98px) {
  .cancel-invitation-footer {
    flex-wrap: nowrap;
  }
  .btn-keep-invitation,
  .btn-confirm-cancel-invitation {
    min-width: 0;
    flex: 1;
    font-size: 0.8rem;
    white-space: nowrap;
  }
}

/* Dark mode */
[data-skin=dark] .cancel-invitation-content {
  background-color: #1f2937;
  border-color: #374151;
}

[data-skin=dark] .cancel-invitation-title {
  color: #f9fafb;
}

[data-skin=dark] .cancel-invitation-warning-card {
  background-color: #450a0a;
  border-color: #7f1d1d;
}

[data-skin=dark] .cancel-invitation-question,
[data-skin=dark] .cancel-invitation-this-will,
[data-skin=dark] .cancel-invitation-list {
  color: #f87171;
}

[data-skin=dark] .btn-keep-invitation {
  background-color: #374151;
  border-color: #4b5563;
  color: #f9fafb;
}

[data-skin=dark] .btn-keep-invitation:hover {
  background-color: #4b5563;
}

/* Deleted User Card */
.deleted-user-card {
  background-color: #fef2f2;
  border: 1px solid #f9c2c4;
  border-radius: 10px;
  padding: 16px;
}

.deleted-user-card-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.deleted-user-card-icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fecdd3;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.deleted-user-card-content {
  flex: 1;
}

.deleted-user-card-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 8px 0;
}

.deleted-user-card-info {
  display: flex;
  justify-content: flex-start;
  gap: 140px;
  flex-wrap: wrap;
}

@media (max-width: 767.98px) {
  .deleted-user-card-info {
    gap: 8px;
    flex-direction: column;
  }
}

.deleted-user-card-info-item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  color: #555555;
}

[data-skin=dark] .deleted-user-card {
  background-color: #450a0a;
  border-color: #7f1d1d;
}

[data-skin=dark] .deleted-user-card-icon {
  background-color: #7f1d1d;
}

[data-skin=dark] .deleted-user-card-title,
[data-skin=dark] .deleted-user-card-info-item {
  color: #fca5a5;
}

/* Restore User Button */
.btn-restore-user {
  background-color: #3a9742;
  border: 1px solid #3a9742;
  color: white;
  padding: 8px 16px;
  border-radius: 6px;
  font-weight: 500;
}

.btn-restore-user:hover {
  background-color: #2d7a34;
  border-color: #2d7a34;
  color: white;
}

/* =============================================
   Settings Menu Styles
   ============================================= */

.settings-menu-card .settings-section-header h6 {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.settings-menu-card .nav-link {
  font-weight: 400;
  font-size: 14px;
  line-height: 20px;
}

.settings-menu-card .nav-item-left {
  padding-top: 13px;
  padding-bottom: 13px;
}

/* SP-SET-0: soft-blue active nav in the Service Partner settings menu, matching
   the Figma. The shared .settings-menu-card has no active override, so Bootstrap's
   dark nav-pills fill would otherwise apply. Scoped to .sp-settings-menu so the
   customer settings menu is unaffected; mirrors the WashUp Admin settings. */
.sp-settings-menu .nav-link.active {
  color: #0067B3 !important;
  background: #EFF6FF !important;
}

.sp-settings-menu .nav-link.active svg,
.sp-settings-menu .nav-link.active i {
  color: #0067B3 !important;
}

[data-skin=dark] .sp-settings-menu .nav-link.active {
  color: #ffffff !important;
  background: #222222 !important;
}

/* SP-SET-5: the "Change Image" button keeps its outline on hover — no background
   fill; only the label darkens to black. */
.sp-change-image-btn:hover,
.sp-change-image-btn:focus {
  background-color: transparent !important;
  color: #000000 !important;
}

/* Desktop: Always show menu sections */
@media (min-width: 768px) {
  .settings-menu-card .settings-section-header {
    cursor: default;
  }

  /* Hide arrows on desktop */
  .settings-menu-card .settings-section-arrow {
    display: none !important;
  }

  /* Override Bootstrap collapse - force visible with maximum specificity */
  .card.settings-menu-card .collapse.settings-collapse-section,
  .card.settings-menu-card .collapsing.settings-collapse-section,
  .card.settings-menu-card #myAccountCollapse,
  .card.settings-menu-card #organizationCollapse {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    overflow: visible !important;
    transition: none !important;
  }
}

/* Mobile: Collapsible sections managed by Stimulus controller */
@media (max-width: 767.98px) {
  .settings-menu-card {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    margin: 0 8px;
    border-radius: 8px;
  }

  .settings-menu-card .settings-section-header {
    cursor: pointer;
    padding: 4px 0;
  }

  .settings-menu-card .settings-section-header[aria-expanded="false"] .section-arrow-icon {
    transform: rotate(180deg);
  }

  .settings-menu-card .section-arrow-icon {
    transition: transform 0.2s ease;
  }

  /* Show section when it has .show class */
  .settings-menu-card .settings-collapse-section.show {
    display: block !important;
    height: auto !important;
    visibility: visible !important;
    overflow: visible !important;
  }

  /* Hide section when it doesn't have .show class */
  .settings-menu-card .settings-collapse-section:not(.show) {
    display: none !important;
  }

  .settings-content-card {
    margin: 0 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
  }
}

/* Chat section toggle.
   Chat used to live in its own card with an inline-styled checkbox; it now
   renders as the last section of the notification list, so the switch is sized
   and coloured here to read as part of the same design system. Bootstrap's
   .form-switch padding/negative margin is left alone on purpose — it is what
   lines the control up with the "Push" header above it. */
.chat-notification-switch .form-check-input {
  width: 2.75rem;
  height: 1.5rem;
  margin-top: 0;
  background-color: #d1d5db;
  border-color: #d1d5db;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.chat-notification-switch .form-check-input:checked {
  background-color: #0067b3;
  border-color: #0067b3;
}

.chat-notification-switch .form-check-input:focus {
  border-color: #0067b3;
  box-shadow: 0 0 0 0.2rem rgb(0 103 179 / 20%);
}

[data-skin=dark] .chat-notification-switch .form-check-input {
  background-color: #4b5563;
  border-color: #4b5563;
}

[data-skin=dark] .chat-notification-switch .form-check-input:checked {
  background-color: #0067b3;
  border-color: #0067b3;
}
/* ==========================================================================
   Shared Assign-To Dropdown Styles
   Used by: shared/_assign_to_dropdown.html.haml
   Two styles: compact (list views) and full (detail views)
   ========================================================================== */

/* Mobile task row: label sits slightly over the compact assign button */
.task-mobile-assigned-label {
  position: relative;
  top: 0.45rem;
  margin-bottom: -0.4rem;
  margin-left: 1.85rem;
  z-index: 1;
}

/* Divider above assign block: narrower than full card row */
.task-mobile-assign-divider {
  width: 95%;
  margin-left: auto;
  margin-right: auto;
}

/* --------------------------------------------------------------------------
   Base Container
   -------------------------------------------------------------------------- */

.assigned-dropdown {
  position: relative;
}

/* Full style needs constrained width */
.assigned-dropdown:has(.assigned-dropdown-trigger) {
  width: 100%;
  max-width: 340px;
}

/* Compact style: full width on mobile, cap on wider viewports so the pill button keeps its shape */
.assigned-dropdown:has(.assigned-dropdown-compact-trigger) {
  width: 100%;
}

@media (min-width: 576px) {
  .assigned-dropdown:has(.assigned-dropdown-compact-trigger) {
    max-width: 240px;
  }
}

/* --------------------------------------------------------------------------
   Full Trigger (detail views — wide button with chevron)
   -------------------------------------------------------------------------- */

.assigned-dropdown-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.3rem 0.75rem;
  background-color: white;
  cursor: pointer;
  transition: border-color 0.2s;
}

.assigned-dropdown-trigger:hover {
  border-color: #9ca3af;
}

.assigned-dropdown-trigger:focus {
  outline: none;
  border-color: #0067b3;
}

/* --------------------------------------------------------------------------
   Compact Trigger (list views — pill button)
   -------------------------------------------------------------------------- */

.assigned-dropdown-compact-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  width: 100%;
  padding: 0.4rem 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #374151;
  background-color: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
  white-space: nowrap;
}

.assigned-dropdown-compact-trigger:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.assigned-dropdown-compact-trigger:focus {
  outline: none;
  border-color: #0067b3;
}

.assigned-compact-icon {
  color: #6b7280;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   Shared Text & Arrow
   -------------------------------------------------------------------------- */

.assigned-dropdown-text {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 400;
  font-size: 0.875rem;
  line-height: 1.4;
  color: #212529;
}

.assigned-dropdown-text.is-placeholder {
  color: #9ca3af;
}

.assigned-dropdown-arrow {
  color: #6b7280;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   Dropdown Menu (shared between both styles)
   -------------------------------------------------------------------------- */

.assigned-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 280px;
  min-width: 280px;
  background-color: white;
  border-radius: 0.375rem;
  border: 1px solid #d1d5db;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  max-height: 350px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Full trigger: menu matches trigger width */
.assigned-dropdown:has(.assigned-dropdown-trigger) .assigned-dropdown-menu {
  width: 100%;
  min-width: unset;
}

/* Right-align the menu when the controller detects it would overflow the
   viewport's right edge (see assigned_dropdown_controller#toggle). Keeps the
   menu on-screen instead of forcing horizontal page scroll. */
.assigned-dropdown-menu.open-right {
  left: auto;
  right: 0;
}

/* Ensure .hidden class works with flexbox elements */
.assigned-dropdown-menu.hidden {
  display: none !important;
}

/* --------------------------------------------------------------------------
   Search
   -------------------------------------------------------------------------- */

.assigned-dropdown-search {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid #e5e7eb;
}

.assigned-search-icon {
  color: #9ca3af;
  flex-shrink: 0;
}

.assigned-search-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 1rem;
  color: #212529;
  background: transparent;
}

.assigned-search-input::placeholder {
  color: #9ca3af;
}

/* --------------------------------------------------------------------------
   Options
   -------------------------------------------------------------------------- */

.assigned-dropdown-options {
  padding: 0.5rem 0;
  overflow-y: auto;
  max-height: 220px;
}

.assigned-dropdown-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  transition: background-color 0.15s;
}

.assigned-dropdown-option:hover {
  background-color: #f3f4f6;
}

.assigned-dropdown-divider {
  border-top: 1px solid #e5e7eb;
  margin: 0;
}

.assigned-remove-option {
  color: #374151;
}

/* --------------------------------------------------------------------------
   Avatars & Initials
   -------------------------------------------------------------------------- */

.assigned-user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.assigned-user-avatar-sm {
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

img.assigned-user-avatar-sm {
  object-fit: cover;
}

div.assigned-user-avatar-sm.assigned-user-initials,
.assigned-user-avatar-sm.assigned-user-initials {
  background-color: #3b82f6;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
}
/**
 * Services Index Styles
 * Part of Services Index Redesign
 * Created: 2026-01-22
 */

/* ==========================================================================
   Services Index Wrapper & Container
   ========================================================================== */

.services-index-wrapper {
  padding: 0;
}

.services-main-container {
  overflow: visible;
  margin-top: 0;
}

/* Header: Uses card-header classes for consistency with other pages */
.services-header {
  /* Additional styles if needed - base styles come from .card-header */
}

/* Content area: matches standard card-body spacing used across the app */
.services-content {
  padding: 1rem !important;
}

/* When content only has empty state, remove padding */
.services-content:has(.services-empty-state) {
  padding: 0;
}

/* ==========================================================================
   Search Input
   ========================================================================== */

.services-search .search-input-group {
  max-width: 464px;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  overflow: hidden;
}

.services-search .search-input-group .form-control {
  border: none;
  box-shadow: none;
}

.services-search .search-input-group .form-control:focus {
  box-shadow: none;
  border: none;
}

.services-search .search-input-group .input-group-text {
  border: none;
  background-color: white;
}

/* ==========================================================================
   Priority Badges - White background with border, colored icons
   ========================================================================== */

.badge-priority-urgent,
.badge-priority-high,
.badge-priority-normal,
.badge-priority-low {
  background-color: white !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
  font-weight: 500;
  font-size: 0.8125rem;
}

.badge-priority-urgent .ri-flag-line {
  color: #dc2626 !important;
}

.badge-priority-high .ri-flag-line {
  color: #f59e0b !important;
}

.badge-priority-normal .ri-flag-line {
  color: #3b82f6 !important;
}

.badge-priority-low .ri-flag-line {
  color: #9ca3af !important;
}

/* ==========================================================================
   Progress Badges - White background with border, colored icons
   ========================================================================== */

.badge-progress-open,
.badge-progress-in-progress,
.badge-progress-on-hold,
.badge-progress-work-order,
.badge-progress-closed {
  background-color: white !important;
  color: #374151 !important;
  border: 1px solid #e5e7eb !important;
  font-weight: 500;
  font-size: 0.8125rem;
}

.badge-progress-open i {
  color: #9ca3af !important;
}

.badge-progress-in-progress i {
  color: #f59e0b !important;
}

.badge-progress-on-hold i {
  color: #dc2626 !important;
}

.badge-progress-work-order i {
  color: #3b82f6 !important;
}

.badge-progress-closed i {
  color: #10b981 !important;
}

/* ==========================================================================
   Status Pills - Colored background with matching border
   ========================================================================== */

.pill-status-past-due,
.pill-status-upcoming,
.pill-status-scheduled,
.pill-status-completed,
.pill-status-completed-green {
  font-size: 0.9375rem !important;
  font-weight: 500 !important;
  /* Bootstrap's .badge sets line-height: 1, which is tighter than this
     font's descenders (e.g. the "g" in "Upcoming") — clips them at the
     bottom of the pill. */
  line-height: 1.4 !important;
  padding: 0.5rem 1.25rem !important;
  min-width: 8rem !important;
  justify-content: center !important;
}

/* Mobile-only overrides for status pills */
.mobile-service-card .pill-status-past-due,
.mobile-service-card .pill-status-upcoming,
.mobile-service-card .pill-status-scheduled,
.mobile-service-card .pill-status-completed,
.mobile-service-card .pill-status-completed-green {
  font-size: 0.75rem !important;
  padding: 0.2rem 0.625rem !important;
  min-width: 0 !important;
}

.pill-status-past-due {
  background-color: #fb9b9c !important;
  color: #000000 !important;
  border: 2px solid #ff3f3f !important;
  font-weight: normal !important;
}

.pill-status-upcoming {
  background-color: #fbf598 !important;
  color: #000000 !important;
  border: 2px solid #ffc107 !important;
  font-weight: normal !important;
}

.pill-status-scheduled {
  background-color: #7cdb87 !important;
  color: #000000 !important;
  border: 2px solid #00bd13 !important;
  font-weight: normal !important;
}

.pill-status-completed {
  background-color: #7cdb87 !important;
  color: #000000 !important;
  border: 2px solid #00bd13 !important;
  font-weight: normal !important;
}

.pill-status-completed-green {
  background-color: #7cdb87 !important;
  color: #000000 !important;
  border: 2px solid #00bd13 !important;
  font-weight: normal !important;
}

/* ==========================================================================
   Service Cards
   ========================================================================== */

.service-card {
  border: 1px solid #dee2e6 !important;
  border-radius: 0.375rem !important;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
  margin-bottom: 0.625rem;
  background-color: #f8f9fc !important;
}

.service-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  border-color: #c6cdd4 !important;
}

.service-card .service-name {
  color: #1f2937;
  font-size: 1rem;
  font-weight: 600;
}

/* Service Card Actions Divider */
.service-actions-divider {
  border-top: 1px solid #e5e7eb;
}

/* Assign To Button */
.assign-to-btn {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  background-color: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s;
}

.assign-to-btn:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.assign-to-btn::after {
  display: none;
}

.service-card .service-location {
  font-size: 0.875rem;
  color: #6b7280;
}

.service-card .service-completed-info {
  font-size: 0.8125rem;
  color: #6b7280;
}

.service-card .service-completed-info i {
  color: #10b981;
}

/* ==========================================================================
   Date Headers
   ========================================================================== */

.services-date-header {
  background-color: #f3f4f6 !important;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 0.625rem 1rem !important;
  margin-bottom: 0.375rem;
  margin-top: 0.5rem;
}

.services-date-header:first-child {
  margin-top: 0;
}

.services-for-date {
  padding-bottom: 0.5rem;
}

.services-date-header .date-header-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background-color: #dbeafe;
  border-radius: 50%;
  flex-shrink: 0;
}

.services-date-header .date-header-icon .lucide-icon {
  color: #0067b3 !important;
  stroke: #0067b3 !important;
}

.services-date-header .date-label {
  font-size: 0.875rem;
}

.services-date-header .status-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: #0067b3;
}

.services-date-header .status-label.completed {
  color: #16a34a;
}

.services-date-header .date-header-icon.completed {
  background-color: #dcfce7;
}

.services-date-header .date-header-icon.completed .lucide-icon {
  color: #16a34a !important;
  stroke: #16a34a !important;
}

/* ==========================================================================
   Empty State
   ========================================================================== */

.services-empty-state {
  padding: 0.75rem;
  background-color: white;
}

.services-empty-state .empty-state-container {
  width: 100%;
}

.services-empty-state .pro-tips {
  max-width: 800px;
  margin: 0 auto;
}

.services-empty-state .empty-state-inner {
  background-color: #f9fafb;
  border: 2px dashed #dee2e6;
  border-radius: 8px;
}

.services-empty-state .empty-state-icon-wrapper {
  display: flex;
  justify-content: center;
}

.services-empty-state .empty-state-icon-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background-color: white;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.services-empty-state .empty-state-icon {
  color: #066bb5;
}

.services-empty-state .pro-tip {
  padding: 0.25rem 0;
}

/* ==========================================================================
   Filter Chips
   ========================================================================== */

.services-filter-chips {
  margin-bottom: 1rem;
}

.filter-chip {
  font-size: 0.8125rem;
  background-color: #eff6ff !important;
  border: 1px solid #cee3ff !important;
  position: relative;
  padding-left: 1.5rem !important;
}

.filter-chip:hover {
  background-color: #dbeafe !important;
}

.filter-chip-close {
  position: absolute;
  top: -6px;
  left: -6px;
  text-decoration: none;
  line-height: 1;
}

.filter-chip-close i {
  font-size: 0.75rem;
  color: #1f2937;
  background-color: white;
  border: 1px solid #1f2937;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
}

.filter-chip-close:hover i {
  color: #0067b3;
}

.filter-chip-icon {
  font-size: 0.875rem;
  color: #0067b3 !important;
  margin-right: 0.25rem;
}

.filter-chip-label {
  color: #64748b;
  font-size: 0.8125rem;
}

.filter-chip-value {
  color: #1e293b;
  font-weight: 600;
  font-size: 0.8125rem;
}

/* ==========================================================================
   Filters Panel (Sidebar)
   ========================================================================== */

.services-filters-panel {
  position: fixed;
  top: 0;
  right: -400px;
  width: 400px;
  max-width: 100%;
  height: 100vh;
  height: 100dvh;
  background: white;
  box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
  z-index: 1050;
  transition: right 0.3s ease;
  display: flex;
  flex-direction: column;
}

.services-filters-panel.show {
  right: 0;
}

.services-filters-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1040;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.services-filters-overlay.show {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* Prevent body scroll when filters panel is open */
body.filters-panel-open {
  overflow: hidden;
}

/* Filters Panel Header */
.filters-panel-header {
  padding: 1.25rem 1rem;
  border-bottom: 1px solid #e5e7eb;
  background-color: #f2f2f2;
  flex-shrink: 0;
}

.filters-panel-header h5 {
  font-size: 1rem;
  color: #1f2937;
  margin: 0;
}

.filters-panel-header p {
  font-size: 0.8125rem;
  color: #6b7280;
  margin-top: 0.25rem;
}

.filters-close-icon {
  font-size: 1.25rem;
}

/* Filters Panel Content (Scrollable) */
.filters-panel-content {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  padding-bottom: 1.5rem;
}

/* Filters Section */
.filters-section {
  margin-bottom: 1.25rem;
}

.filters-section-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}

/* Quick Actions Buttons */
.filters-quick-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.filters-quick-action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.625rem 1rem;
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 9999px;
  color: #1f2937;
  font-size: 0.875rem;
  transition: all 0.2s ease;
}

.filters-quick-action-btn span {
  font-weight: 600;
}

.filters-quick-action-btn:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

/* Toggle style for quick action buttons (Assigned to Me, Unassigned) */
.filters-quick-action-btn.active {
  background-color: #0067b3;
  color: #fff;
  border-color: #0067b3;
}

.filters-quick-action-btn.active i {
  color: #fff;
}

.filters-quick-action-btn.active span {
  color: #fff;
}

.filters-quick-action-btn i {
  font-size: 1rem;
}

/* Filters Select */
.filters-select {
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  padding: 0.625rem 0.75rem;
  font-size: 0.875rem;
  color: #374151;
}

.filters-select:focus {
  border-color: #0067b3;
  box-shadow: 0 0 0 2px rgba(0, 103, 179, 0.1);
}

/* Filters Panel Footer (Sticky) */
.filters-panel-footer {
  padding: 1rem;
  border-top: 1px solid #e5e7eb;
  background-color: #f2f2f2;
  flex-shrink: 0;
}

.filters-apply-btn {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 0.9375rem;
  font-weight: 600;
  border-radius: 0.375rem;
  margin-bottom: 0.75rem;
}

.filters-clear-link {
  display: block;
  text-align: center;
  font-size: 0.875rem;
  color: #374151;
  text-decoration: none;
}

.filters-clear-link:hover {
  color: #0067b3;
  text-decoration: underline;
}

/* Mobile adjustments for filters panel */
@media (max-width: 767.98px) {
  .services-filters-panel {
    width: 100%;
    right: -100%;
  }

  .filters-panel-header {
    padding: 1rem;
  }

  .filters-panel-content {
    padding: 1rem;
  }
}

/* ==========================================================================
   Toolbar Actions
   ========================================================================== */

.services-toolbar {
  margin-bottom: 0.75rem;
}

@media (min-width: 768px) {
  .services-toolbar {
    align-items: center;
  }
}

.services-toolbar .btn-link {
  color: #6b7280;
}

.services-toolbar .btn-link:hover {
  color: #374151;
}

.services-toolbar .btn-outline-secondary {
  border-color: #e5e7eb;
  color: #374151;
  font-size: 0.875rem;
  border-radius: 0.375rem;
  min-height: 36px;
}

.services-toolbar .btn-outline-secondary:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
  color: #1f2937;
}

/* View Toggle Group */
.view-toggle-group {
  display: inline-flex;
  align-items: center;
  background-color: #e9ecef;
  border: none;
  border-radius: 0.375rem;
  min-height: 36px;
  padding: 2px;
  gap: 0;
}

.view-toggle-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  min-height: 32px;
  padding: 0 10px;
  color: #666;
  text-decoration: none;
  transition: all 0.2s;
  border-radius: calc(0.375rem - 2px);
}

.view-toggle-btn:hover {
  color: #333;
}

.view-toggle-btn.active {
  background-color: #fff;
  color: #333;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

/* Services List Info text */
.services-list-info {
  color: #6b7280;
  font-size: 0.875rem;
}

/* ==========================================================================
   Pagination
   ========================================================================== */

.services-pagination .pagination,
.services-pagination .schedule-pagination {
  margin-bottom: 0;
  gap: 0.25rem;
}

.services-pagination .schedule-pagination {
  background-color: #f9fafb;
  border-color: #e5e7eb !important;
  padding: 0.25rem;
}

.services-pagination .schedule-pagination a,
.services-pagination .schedule-pagination span {
  border-radius: 0.25rem;
  min-width: 32px;
  justify-content: center;
  font-size: 0.875rem;
}

.services-pagination .schedule-pagination .active-pagination {
  background-color: #3b82f6;
  color: white !important;
}

.services-pagination .schedule-pagination a:hover:not(.active-pagination) {
  background-color: #e5e7eb;
}

.services-end-message {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
}

.services-end-message p {
  color: #6b7280;
  font-size: 0.9375rem;
}

.services-end-message small {
  color: #9ca3af;
}

/* ==========================================================================
   Responsive Adjustments
   ========================================================================== */

@media (max-width: 768px) {
  .services-search .search-input-group {
    max-width: 100%;
  }

  .services-filters-panel {
    width: 100%;
    right: -100%;
  }

  .service-card .service-meta {
    width: 100%;
    justify-content: flex-start;
    margin-top: 1.5rem;
  }

  .services-date-header {
    font-size: 0.85rem;
  }

  .services-filter-chips {
    overflow-x: auto;
    flex-wrap: wrap;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-top: 0.5rem;
  }

  .services-filter-chips .btn {
    flex-shrink: 0;
  }

  .services-filter-chips .filter-chip {
    font-size: 0.75rem;
    padding: 0.25rem 0.5rem 0.25rem 1.25rem !important;
  }

  .services-filter-chips .filter-chip-close {
    top: -4px;
    left: -4px;
  }

  .services-filter-chips .filter-chip-close i {
    width: 14px;
    height: 14px;
    font-size: 0.625rem;
  }

  .services-filter-chips .filter-chip-icon {
    font-size: 0.75rem;
  }

  .services-filter-chips .filter-chip-label,
  .services-filter-chips .filter-chip-value {
    font-size: 0.75rem;
  }
}

/* ==========================================================================
   Activity Link
   ========================================================================== */

.service-activity a:hover {
  text-decoration: underline !important;
}

/* ==========================================================================
   Activity Item Card (Timeline & Activity)
   --------------------------------------------------------------------------
   Card layout: avatar + title (with date directly below the user name) on
   the first row, then full-width body content underneath. Body content is
   no longer indented past the avatar — it fills the card to the left edge.
   ========================================================================== */

.activity-item-card {
  background-color: #f8f9fa;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 1rem;
  margin-bottom: 0.75rem;
}

.activity-item-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.activity-item-header-main {
  display: flex;
  align-items: flex-start;
  flex: 1;
  min-width: 0;
}

/* 86e38wwrc: a profile picture with a transparent background composited onto whatever card it
   happened to sit on. A photo is a photo — it gets its own white ground, so a logo uploaded as a
   transparent PNG looks the same wherever it appears. Scoped to `img` so the initials variant,
   which shares the class and carries its own colour, is untouched. */
img.assigned-user-avatar-sm,
.activity-avatar img {
  background: #fff;
}

/* Avatar + subicon overlay */
.activity-avatar-wrapper {
  position: relative;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
}

.activity-subicon {
  position: absolute;
  bottom: -0.25rem;
  right: -0.25rem;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 9999px;
  background-color: #f8f9fc;
  border: 2px solid #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #374151;
}

.activity-subicon svg {
  color: #374151;
  width: 0.75rem;
  height: 0.75rem;
}

/* Title block (user name + action, with date directly below) */
.activity-title-block {
  margin-left: 0.75rem;
  flex: 1;
  min-width: 0;
}

.activity-item-card .activity-title {
  font-size: 0.8125rem;
  line-height: 1.25rem;
}

.activity-item-card .activity-title .user-name {
  font-weight: 600;
  color: #111827;
}

.activity-item-card .activity-title .action-text {
  font-weight: 400;
  color: #4b5563;
  margin-left: 0.25rem;
}

.activity-item-card .activity-timestamp {
  font-size: 0.8125rem;
  color: #6b7280;
  font-weight: 400;
  margin-top: 0.125rem;
  white-space: normal;
}

/* Body row: full width — no left indent past the avatar */
.activity-item-body {
  margin-top: 0.625rem;
}

.activity-item-card .activity-body {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.5;
  margin-left: 0;
}

/* Override the legacy .activity-note background so notes don't render as a
   nested card inside the activity-item-card. The text sits directly on the
   card background, matching the other activity types. */
.activity-item-card .activity-note {
  background-color: transparent;
  padding: 0;
  margin-top: 0;
  border-radius: 0;
}

.activity-item-card .activity-description {
  margin-top: 0;
}

/* Service Instance Created footer card uses the same icon-circle style as
   subicons (no avatar, since there is no user). */
.service-instance-created-card .activity-instance-created-icon {
  width: 2rem;
  height: 2rem;
  border-radius: 9999px;
  background-color: #f8f9fc;
  border: 2px solid #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #374151;
  flex-shrink: 0;
}

.service-instance-created-card .activity-instance-created-icon svg {
  color: #374151;
}

/* ==========================================================================
   Assign To Dropdown
   ========================================================================== */

.service-assign-to .dropdown-menu {
  max-height: 300px;
  overflow-y: auto;
  z-index: 1055 !important;
}

.service-assign-to .dropdown-item {
  cursor: pointer;
}

.service-assign-to .dropdown-item:hover {
  background-color: #f3f4f6;
}

.service-assign-to form {
  margin: 0;
}

.service-assign-to button.dropdown-item {
  width: 100%;
  text-align: left;
  background: none;
  border: none;
}

/* ===================== Custom Select Dropdown ===================== */
.custom-select-wrapper {
  position: relative;
  width: 100%;
  min-width: 180px;
  background: #fff;
  border-radius: 0.5rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
  cursor: pointer;
  transition: border-color 0.2s;
}

.custom-select-wrapper:focus-within,
.custom-select-wrapper:focus {
  border-color: #3b82f6;
  outline: none;
}

.custom-select-selected {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  min-height: 44px;
  font-size: 1rem;
  font-weight: 500;
  color: #1f2937;
  background: #fff;
  border-radius: 0.5rem;
}

.custom-select-arrow {
  margin-left: auto;
  font-size: 1.25rem;
  color: #9ca3af;
}

.custom-select-options {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 10;
  background: #fff;
  border-radius: 0.5rem;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  margin-top: 0.25rem;
  padding: 0.25rem 0;
  max-height: 260px;
  overflow-y: auto;
  border: 1px solid #e5e7eb;
}

/* Search input inside custom select dropdown (Assign To) */
.custom-select-search-wrapper {
  padding: 0.5rem 0.5rem 0.25rem;
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 1;
}

.custom-select-search {
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 0.875rem;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  outline: none;
  background: #fff;
  color: #1f2937;
}

.custom-select-search:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
}

.custom-select-option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  color: #1f2937;
  background: #fff;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.custom-select-option.selected,
.custom-select-option:hover {
  background: #2563eb;
  color: #fff;
}

.custom-select-option.selected .custom-select-icon,
.custom-select-option:hover .custom-select-icon {
  color: #fff !important;
}

.custom-select-icon {
  min-width: 18px;
  min-height: 18px;
  vertical-align: middle;
  transition: color 0.15s;
}

/* Blue avatar background for initials in custom select - refined size */
.bg-blue-avatar {
  background: #2563eb !important;
  color: #fff !important;
  border-radius: 50%;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.custom-select-avatar-initials {
  min-width: 28px;
  min-height: 28px;
  text-align: center;
}

/* Progress icon color classes for reuse */
.icon-progress-open {
  color: #9ca3af !important;
}

.icon-progress-in_progress {
  color: #f59e0b !important;
}

.icon-progress-on_hold {
  color: #dc2626 !important;
}

.icon-progress-work_order_created {
  color: #3b82f6 !important;
}

.icon-progress-closed {
  color: #10b981 !important;
}

/* Priority icon color classes for filter combobox */
.icon-priority-urgent {
  color: #dc2626 !important;
}

.icon-priority-high {
  color: #f59e0b !important;
}

.icon-priority-normal {
  color: #3b82f6 !important;
}

.icon-priority-low {
  color: #9ca3af !important;
}

/* Status icon color classes for filter combobox */
.icon-status-past_due {
  color: #dc2626 !important;
}

.icon-status-upcoming {
  color: #f59e0b !important;
}

.icon-status-scheduled {
  color: #15803d !important;
}

.icon-status-completed {
  color: #10b981 !important;
}

/* Inspections attention-item statuses (reuse the same combobox styling) */
.icon-status-needs_attention {
  color: #f59e0b !important;
}

.icon-status-critical {
  color: #dc2626 !important;
}

/* ==========================================================================
   MOBILE SERVICES INDEX STYLES
   Part of Mobile Services Index View Implementation (2026-01-29)
   Reference: tmp/new-services-index/mobile-version-1.png, mobile-version-2.png
   ========================================================================== */

/* --------------------------------------------------------------------------
   Mobile Header Adjustments
   -------------------------------------------------------------------------- */

@media (max-width: 767.98px) {
  .services-index-wrapper {
    padding: 0;
  }

  .services-header {
    padding: 0.875rem 1rem;
  }

  .services-header h4:not(.services-header-title) {
    font-size: 1.25rem;
  }

  /* Buttons sit below the header on mobile */
  .normal-mode-buttons {
    display: flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: #ffffff;
  }

  .normal-mode-buttons .d-flex {
    flex-direction: row;
    align-items: center;
    gap: 0.5rem !important;
    width: 100%;
  }

  .normal-mode-buttons .actions-dropdown {
    flex: 0 0 auto;
  }

  .normal-mode-buttons .bg-success-new {
    flex: 1;
  }

  .edit-mode-buttons:not(.d-none) {
    display: flex !important;
    align-items: center;
    padding: 0.5rem 0.75rem;
    background: #ffffff;
  }

  .edit-mode-buttons .d-flex {
    width: 100%;
  }

  .edit-mode-buttons .btn-edit-save {
    flex: 1;
  }

  .services-content {
    padding: 0.375rem 0.25rem;
  }

  .mobile-new-service-btn {
    padding: 0.5rem 0.875rem;
    font-size: 0.875rem;
  }

  /* Service details page — mobile */
  .service-detail-content-wrapper {
    padding: 0.75rem;
  }

  .mobile-title-section {
    margin-bottom: 0.75rem;
  }

  /* Service title wrapper — vertically center the title block in its
     container by adding a bit of breathing room on top. Combined with
     the smaller bottom margin on the instructions wrapper below, this
     keeps the title visually centered between the header and the body. */
  .service-title-wrapper {
    padding-top: 0.5rem;
  }

  .title-name-row {
    min-width: 0;
  }

  .title-name-row .service-name-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
    font-size: 1.5rem;
    line-height: 1;
    margin-bottom: 0;
  }

  /* Media attachments — 2 columns on mobile */
  .service-instructions-card .flex.flex-wrap.gap-4 {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
  }

  .service-instructions-card .service-instructions-media {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
  }

  /* More breathing room between the service name and its bay/equipment
     subtitle so they don't feel squished together on small screens. */
  .service-title-wrapper .service-name-subtitle {
    margin-top: 0.375rem;
    font-size: 0.9375rem;
  }

  /* Details tab fields — reduce padding/spacing */
  #details-tab {
    padding-top: 0.75rem !important;
    padding-bottom: 0.25rem !important;
  }

  .details-tab-grid {
    padding-left: 0.875rem !important;
    padding-right: 0.875rem !important;
    padding-top: 1rem !important;
    padding-bottom: 0.375rem !important;
    gap: 0.75rem !important;
  }

  .details-field-note {
    padding-top: 0.125rem !important;
    padding-bottom: 0 !important;
  }
}

/* Hide mobile-only title section on desktop */
@media (min-width: 992px) {
  .mobile-title-section {
    display: none !important;
  }
}

/* --------------------------------------------------------------------------
   Mobile Toolbar
   -------------------------------------------------------------------------- */

.mobile-services-toolbar {
  margin-bottom: 0.5rem;
}

/* Mobile Search */
.mobile-search-wrapper {
  width: 100%;
}

.mobile-search-form {
  width: 100%;
}

.mobile-search-input-group {
  display: flex;
  align-items: center;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 9999px;
  padding: 0.625rem 1rem;
  gap: 0.5rem;
}

.mobile-search-icon {
  color: #9ca3af;
  font-size: 1rem;
  flex-shrink: 0;
}

.mobile-search-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-size: 0.9375rem;
  color: #1f2937;
}

.mobile-search-input::placeholder {
  color: #9ca3af;
}

.mobile-search-clear {
  color: #9ca3af;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mobile-search-clear:hover {
  color: #6b7280;
}

/* Mobile Toolbar Actions Row */
.mobile-toolbar-actions {
  width: 100%;
}

/* Mobile Status Dropdown */
.mobile-status-dropdown {
  flex: 1;
}

.mobile-status-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.75rem 1rem;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 0.9375rem;
  color: #1f2937;
  cursor: pointer;
  transition: border-color 0.2s ease;
}

.mobile-status-btn:hover,
.mobile-status-btn:focus {
  border-color: #d1d5db;
  outline: none;
}

.mobile-status-btn::after {
  margin-left: auto;
}

.mobile-status-menu {
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  margin-top: 0.25rem;
}

.mobile-status-menu .dropdown-item {
  padding: 0.75rem 1rem;
  font-size: 0.9375rem;
  color: #374151;
}

.mobile-status-menu .dropdown-item:hover {
  background-color: #f9fafb;
}

.mobile-status-menu .dropdown-item.active {
  background-color: #eff6ff;
  color: #0067b3;
}

/* Mobile Filter Button */
.mobile-filter-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  color: #000000;
  cursor: pointer;
  position: relative;
  transition: all 0.2s ease;
}

.mobile-filter-btn:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.mobile-filter-btn i {
  font-size: 1.25rem;
}

.mobile-filter-btn svg {
  stroke: #000000 !important;
}

.mobile-filter-btn svg:hover {
  stroke: #000000 !important;
}

.mobile-filter-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  background-color: #0067b3;
  color: white;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* --------------------------------------------------------------------------
   Mobile List Info Text
   -------------------------------------------------------------------------- */

.mobile-list-info {
  color: #6b7280;
  font-size: 0.8125rem;
  line-height: 1.5;
  margin-bottom: 1rem;
  padding: 0 0.25rem;
}

/* --------------------------------------------------------------------------
   Mobile Date Header
   -------------------------------------------------------------------------- */

.mobile-date-header {
  background-color: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  padding: 0.75rem 0.75rem 0.5rem;
  margin-bottom: 0.25rem;
  margin-top: 0.375rem;
}

.mobile-date-header:first-child {
  margin-top: 0;
}

.mobile-date-header-content {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.mobile-date-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #dbeafe;
}

.mobile-date-icon.completed {
  background-color: #dcfce7;
}

.mobile-date-icon-svg {
  display: block;
  width: 22px;
  height: 22px;
}

.mobile-date-info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.mobile-date-status-label {
  line-height: 1;
}

/* The washup_admin dashboard defines an unscoped `.status-badge` atom
   (admin_dashboard/components.css) that leaks app-wide: `min-width: 80px` +
   `justify-content: center` + Geist. That centred a short label like "DUE"
   inside an 80px box, so it sat indented from the date below it while a longer
   label ("COMPLETED") looked fine. Neutralise it here — this is a plain text
   label, not a pill. */
.mobile-date-status-label .status-badge {
  display: inline;
  min-width: 0;
  justify-content: flex-start;
  text-align: left;
  white-space: nowrap;
  font-family: inherit;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0;
  border-radius: 0;
  background-color: transparent;
}

.mobile-date-status-label .status-badge.completed {
  color: #22c55e;
}

.mobile-date-status-label .status-badge.scheduled {
  color: #0067b3;
}

.mobile-date-status-label .status-badge.upcoming {
  color: #f59e0b;
}

.mobile-date-status-label .status-badge.past-due {
  color: #dc2626;
}

.mobile-date-text {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #1f2937;
}

/* --------------------------------------------------------------------------
   Mobile Service Card
   -------------------------------------------------------------------------- */

.mobile-service-card-link {
  text-decoration: none;
  display: block;
}

.mobile-service-card {
  background: #f8f9fc;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  padding: 0.625rem 0.75rem;
  margin-bottom: 0.5rem;
}

.mobile-service-card:active {
  background-color: #f9fafb;
}

/* Row 1: Badge + Location (flow with small gap, not space-between) */
.mobile-service-row-top {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

/* Mobile Status Pills - slightly wider */
.mobile-service-row-top .badge.rounded-pill {
  padding: 0.25rem 1.5rem !important;
  flex-shrink: 0;
}

/* Mobile Service Badge */
.mobile-service-badge {
  flex-shrink: 0;
}

.mobile-badge {
  display: inline-block;
  padding: 0.25rem 0.625rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 0.25rem;
  text-transform: capitalize;
}

.mobile-badge.completed {
  background-color: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
}

.mobile-badge.scheduled {
  background-color: #dcfce7;
  color: #166534;
  border: 1px solid #bbf7d0;
}

.mobile-badge.upcoming {
  background-color: #fef9c3;
  color: #854d0e;
  border: 1px solid #fde047;
}

.mobile-badge.past-due {
  background-color: #fee2e2;
  color: #991b1b;
  border: 1px solid #fca5a5;
}

/* Mobile Service Location (follows status pill with small gap) */
.mobile-service-location {
  font-size: 0.8125rem;
  color: #6b7280;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mobile-service-location .separator {
  margin: 0 0.125rem;
  color: #9ca3af;
}

/* Row 2: Service Name */
.mobile-service-name {
  font-size: 1rem;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

/* Row 3: Completed Info */
.mobile-service-completed-info {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: #6b7280;
  border-top: 1px solid #e5e7eb;
  padding-top: 0.625rem;
  margin-top: 0.5rem;
}

.mobile-service-completed-info .completed-icon {
  color: #6b7280;
  font-size: 0.875rem;
}

/* --------------------------------------------------------------------------
   Mobile Pagination
   -------------------------------------------------------------------------- */

.mobile-pagination-wrapper {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
}

.mobile-end-message {
  text-align: center;
  margin-bottom: 1rem;
}

.mobile-end-message p {
  color: #6b7280;
  font-size: 0.9375rem;
  margin-bottom: 0.125rem;
  font-weight: 400;
}

.mobile-end-message small {
  color: #9ca3af;
  font-size: 0.8125rem;
}

.mobile-pagination {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  overflow: hidden;
  width: fit-content;
  margin-left: auto;
}

.mobile-page-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  color: #6b7280;
  text-decoration: none;
  transition: all 0.2s ease;
  border-right: 1px solid #e5e7eb;
  background-color: #ffffff;
}

.mobile-page-btn.next {
  border-right: none;
}

.mobile-page-btn:hover:not(.disabled) {
  background-color: #f3f4f6;
  color: #374151;
}

.mobile-page-btn.disabled {
  color: #d1d5db;
  cursor: not-allowed;
}

.mobile-page-btn i {
  font-size: 1rem;
}

.mobile-page-numbers {
  display: flex;
  align-items: center;
}

.mobile-page-num {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 0.5rem;
  font-size: 0.875rem;
  color: #6b7280;
  text-decoration: none;
  transition: all 0.2s ease;
  border-right: 1px solid #e5e7eb;
  background-color: #ffffff;
}


.mobile-page-num:hover:not(.active) {
  background-color: #f3f4f6;
  color: #374151;
}

.mobile-page-num.active {
  background-color: #e1effe;
  color: #0067b3;
  font-weight: 500;
}

.mobile-page-ellipsis {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  color: #9ca3af;
  font-size: 0.875rem;
  border-right: 1px solid #e5e7eb;
  background-color: #ffffff;
}

/* --------------------------------------------------------------------------
   Mobile Services List Container
   -------------------------------------------------------------------------- */

.mobile-services-list {
  /* Container styles if needed */
}

.mobile-services-for-date {
  padding-bottom: 0.5rem;
}

/* --------------------------------------------------------------------------
   Mobile Service Card - Additional Elements
   -------------------------------------------------------------------------- */

/* Progress & Priority Badges Row */
.mobile-service-badges {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.25rem;
}

.mobile-meta-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.75rem;
  line-height: 1;
  font-weight: 500;
  border-radius: 0.25rem;
  border: 1px solid;
}

.mobile-meta-badge i {
  font-size: 0.75rem;
  line-height: 1;
}

/* Progress Badge Variants */
.mobile-meta-badge.progress.open,
.mobile-meta-badge.progress.in-progress,
.mobile-meta-badge.progress.on-hold,
.mobile-meta-badge.progress.work-order,
.mobile-meta-badge.progress.closed {
  padding: 8px 9.11px;
  border-radius: 11.44px;
  height: 32px;
}

.mobile-meta-badge.progress.open {
  background-color: #ffffff;
  border-color: #e2e8f0;
  color: #1f2937;
}

.mobile-meta-badge.progress.in-progress {
  background-color: #ffffff;
  border-color: #e5e7eb;
  color: #374151;
}

.mobile-meta-badge.progress.in-progress i {
  color: #f59e0b;
}

.mobile-meta-badge.progress.on-hold {
  background-color: #ffffff;
  border-color: #e5e7eb;
  color: #374151;
}

.mobile-meta-badge.progress.on-hold i {
  color: #dc2626;
}

.mobile-meta-badge.progress.work-order {
  background-color: #ffffff;
  border-color: #e2e8f0;
  color: #1f2937;
}

.mobile-meta-badge.progress.work-order i {
  color: #3b82f6;
}

.mobile-meta-badge.progress.closed {
  background-color: #dcfce7;
  border-color: #86efac;
  color: #166534;
}

/* Priority Badge Variants */
.mobile-meta-badge.priority.urgent,
.mobile-meta-badge.priority.high,
.mobile-meta-badge.priority.normal,
.mobile-meta-badge.priority.low {
  background-color: #ffffff;
  border-color: #e2e8f0;
  color: #1f2937;
  padding: 8px 9.11px;
  border-radius: 11.44px;
  height: 32px;
}

/* Assigned Section */
.mobile-service-assigned {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  border-top: 1px solid #e5e7eb;
  padding-top: 0.5rem;
  margin-top: 0.5rem;
}

.mobile-service-assigned .assigned-label {
  font-size: 0.8125rem;
  color: #6b7280;
}

.mobile-service-assigned .assigned-user-name {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
}

.mobile-service-assigned .assigned-user-name i {
  font-size: 1rem;
  color: #6b7280;
}

.mobile-service-assigned .assign-to-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.875rem;
  color: #1f2937;
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  text-decoration: none;
  transition: all 0.2s ease;
}

.mobile-service-assigned .assign-to-btn:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.mobile-service-assigned .assign-to-btn span {
  font-weight: 600;
}

.mobile-service-assigned .assign-to-btn i {
  font-size: 1rem;
  font-weight: normal;
}

.mobile-service-assigned .dropdown-menu {
  max-height: 240px;
  overflow-y: auto;
}

/* ==========================================================================
   RESCHEDULE SERVICE MODAL STYLES
   Part of New Reschedule Service Flow Implementation
   ========================================================================== */

/* --------------------------------------------------------------------------
   Modal Backdrop - Darker overlay
   -------------------------------------------------------------------------- */

#reschedule_service_modal.modal {
  --bs-backdrop-opacity: 0.75;
}

#reschedule_service_modal+.modal-backdrop,
.modal-backdrop.show:has(+ #reschedule_service_modal) {
  background-color: #000000;
  opacity: 1.75;
}

/* --------------------------------------------------------------------------
   Modal Base
   -------------------------------------------------------------------------- */

#reschedule_service_modal .modal-dialog {
  max-width: 520px;
}

#reschedule_service_modal .modal-content {
  border-radius: 0.5rem;
  border: none;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

#reschedule_service_modal .modal-header {
  padding: 1.25rem 1.5rem 0.5rem;
}

#reschedule_service_modal .modal-body {
  padding: 0.5rem 1.5rem 1.5rem;
}

#reschedule_service_modal .modal-footer {
  padding: 0 1.5rem 1.5rem;
}

/* --------------------------------------------------------------------------
   Stepper
   -------------------------------------------------------------------------- */

.reschedule-stepper {
  padding: 0.5rem 0;
  max-width: 90%;
  margin: 0 auto;
  gap: 0;
}

.reschedule-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.reschedule-step-circle {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.875rem;
  font-weight: 600;
  background-color: #e5e7eb;
  color: #6b7280;
  transition: all 0.3s ease;
  position: relative;
  z-index: 2;
}

.reschedule-step-circle.active {
  background-color: #0067B3;
  color: #ffffff;
  box-shadow: 0 0 0 4px #DBEAFE;
}

.reschedule-step-circle.completed {
  background-color: #0067B3;
  color: #ffffff;
}

.reschedule-step-circle .lucide-icon,
.reschedule-step-circle .step-check {
  width: 16px;
  height: 16px;
  stroke: #ffffff;
  color: #ffffff;
}

.reschedule-step-label {
  font-size: 0.75rem;
  color: #6b7280;
  font-weight: 500;
}

.reschedule-step-line {
  flex: 1;
  height: 2px;
  background-color: #e5e7eb;
  align-self: flex-start;
  margin-top: 16px;
  margin-left: -30px;
  margin-right: -30px;
  z-index: 1;
  transition: background-color 0.3s ease;
}

.reschedule-step-line.active {
  background-color: #0067B3;
}

/* --------------------------------------------------------------------------
   Step Content
   -------------------------------------------------------------------------- */

.reschedule-step-content {
  min-height: 200px;
}

.reschedule-step-content .form-label {
  font-size: 0.875rem;
  margin-bottom: 0.375rem;
}

.reschedule-step-content .form-control {
  border-radius: 0.375rem;
  border: 1px solid #e5e7eb;
  padding: 0.625rem 0.875rem;
  font-size: 0.9375rem;
}

.reschedule-step-content .form-control.bg-light {
  background-color: #f3f4f6 !important;
  border-color: #e5e7eb;
  color: #374151;
}

.reschedule-step-content .input-group-text {
  background-color: #ffffff;
  border: 1px solid #e5e7eb;
  border-right: none;
  color: #9ca3af;
}

.reschedule-step-content .input-group .form-control {
  border-left: none;
}

/* Divider between fields */
.reschedule-divider {
  border: none;
  border-top: 1px solid #e5e7eb;
  opacity: 1;
}

/* --------------------------------------------------------------------------
   Option Cards (Step 2)
   -------------------------------------------------------------------------- */

.reschedule-option-card {
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  padding: 1rem;
  cursor: pointer;
  transition: all 0.2s ease;
}

.reschedule-option-card:hover {
  border-color: #d1d5db;
  background-color: #f9fafb;
}

.reschedule-option-card.selected {
  background-color: #EFF6FF;
  border-color: #0067B3;
  border-width: 2px;
}

.reschedule-option-card .form-check-input {
  width: 18px;
  height: 18px;
  margin-top: 0.125rem;
}

.reschedule-option-card .form-check-input:checked {
  background-color: #0067B3;
  border-color: #0067B3;
}

.reschedule-option-card .form-check-label {
  font-size: 0.9375rem;
  cursor: pointer;
}

.reschedule-option-card p {
  font-size: 0.8125rem;
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Impact Preview
   -------------------------------------------------------------------------- */

.reschedule-impact-preview {
  background-color: #ffffff;
  border-radius: 0.375rem;
  padding: 0.875rem;
  margin-top: 0.75rem;
}

.reschedule-impact-preview ul {
  margin: 0;
  padding: 0;
}

.reschedule-impact-preview li {
  font-size: 0.8125rem;
  color: #374151;
}

/* Dots */
.reschedule-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 0.5rem;
  flex-shrink: 0;
}

.reschedule-dot.dot-red {
  background-color: #EF4444;
}

.reschedule-dot.dot-green {
  background-color: #22C55E;
}

.reschedule-dot.dot-gray {
  background-color: #9CA3AF;
}

.reschedule-dot.dot-blue {
  background-color: #3B82F6;
}

/* --------------------------------------------------------------------------
   Info Notice
   -------------------------------------------------------------------------- */

.reschedule-info-notice {
  background-color: #F9FAFB;
  border-radius: 0.375rem;
}

.reschedule-info-notice span {
  line-height: 1.5;
}

/* --------------------------------------------------------------------------
   Step 3 - Success
   -------------------------------------------------------------------------- */

.reschedule-success-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: #DCFCE7;
  display: flex;
  align-items: center;
  justify-content: center;
}

.reschedule-success-icon .lucide-icon,
.reschedule-success-icon i {
  width: 32px;
  height: 32px;
  color: #16A34A;
  stroke: #16A34A;
}

.reschedule-new-date-card {
  background-color: #EFF6FF;
  border: 1px solid #CBE1FE;
  border-radius: 0.5rem;
  max-width: 320px;
}

/* --------------------------------------------------------------------------
   Footer Buttons
   -------------------------------------------------------------------------- */

.reschedule-footer-buttons .btn {
  min-width: 100px;
  padding: 0.625rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 500;
  border-radius: 0.375rem;
}

.reschedule-footer-buttons .btn-primary {
  background-color: #0067B3;
  border-color: #0067B3;
}

.reschedule-footer-buttons .btn-primary:hover:not(:disabled) {
  background-color: #005a9e;
  border-color: #005a9e;
}

.reschedule-footer-buttons .btn-primary:disabled {
  background-color: #0067B3;
  border-color: #0067B3;
  opacity: 0.5;
}

.reschedule-footer-buttons .btn-outline-secondary {
  border-color: #e5e7eb;
  color: #374151;
}

.reschedule-footer-buttons .btn-outline-secondary:hover {
  background-color: #f3f4f6;
  border-color: #d1d5db;
}

/* Step 3 Done button - full width */
#reschedule_service_modal [data-reschedule-service-target="step3Buttons"] .btn-primary {
  width: 100%;
}

/* ==========================================================================
   Calendar View Styles
   ========================================================================== */

.service-calendar-card {
  border-radius: 5px;
  overflow: hidden;
}

/* FC Button Styles */
.fc-button {
  border: 1px solid #ddd;
  background-color: #fff;
}

.fc-arrows {
  padding: 6px 12px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4.52px;
}

.fc-arrows:hover {
  background-color: #f8f9fa;
}

/* Quick Guide Button */
.quick-guide-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background-color: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 8px 16px;
  color: #333;
  font-size: 14px;
  font-weight: 400;
  cursor: pointer;
  transition: all 0.2s;
}

.quick-guide-btn:hover {
  background-color: #f8f9fa;
  border-color: #d0d0d0;
}

.quick-guide-btn::after {
  display: none;
}

.quick-guide-icon {
  color: #0067b3;
}

/* Quick Guide Dropdown Animation */
.quick-guide-dropdown {
  animation: slideIn 0.25s ease-out;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  max-height: 70vh;
  overflow-y: auto;
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Dark mode support for calendar */
[data-bs-theme="dark"] .quick-guide-btn,
[data-bs-theme="dark"] .view-toggle-group {
  background-color: #2d2d2d;
  border-color: #444;
  color: #fff;
}

[data-bs-theme="dark"] .view-toggle-btn {
  color: #aaa;
}

[data-bs-theme="dark"] .view-toggle-btn:hover,
[data-bs-theme="dark"] .view-toggle-btn.active {
  color: #fff;
}

[data-bs-theme="dark"] .view-toggle-divider {
  background-color: #444;
}

/* ==========================================================================
   Services Index Pagination (Specific styles for services list page)
   ========================================================================== */

.services-index-pagination {
  margin-top: 1.5rem;
}

.services-index-pagination .pagination-container {
  border: 1px solid #D1D5DB;
  border-radius: 0.375rem;
  overflow: hidden;
  background-color: #ffffff;
}

.services-index-pagination .pagination-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.75rem;
  font-size: 0.875rem;
  color: #374151;
  text-decoration: none;
  border: none;
  border-right: 1px solid #D1D5DB;
  background-color: #ffffff;
  transition: background-color 0.15s ease;
}

.services-index-pagination .pagination-btn:last-child {
  border-right: none;
}

.services-index-pagination .pagination-btn:hover:not(.active):not(.disabled) {
  background-color: #F3F4F6;
}

.services-index-pagination .pagination-btn.active {
  background-color: #E1EFFE;
  color: #0067B3;
  font-weight: 500;
}

.services-index-pagination .pagination-btn.disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.services-index-pagination .pagination-btn.pagination-nav {
  padding: 0 0.5rem;
}

.services-index-pagination .pagination-btn.pagination-ellipsis {
  cursor: default;
  color: #9CA3AF;
}

.services-footer {
  border-top-color: #E5E7EB !important;
}

.services-footer .services-end-message {
  text-align: left;
}

.services-footer .services-end-message p {
  font-size: 0.9375rem;
  font-weight: 500;
}

.services-footer .services-end-message small {
  font-size: 0.8125rem;
}

/* ==========================================================================
   SERVICE DETAILS PAGE STYLES
   Part of Service Instance Show View
   ========================================================================== */

/* --------------------------------------------------------------------------
   Service Details Header
   -------------------------------------------------------------------------- */

.services-header {
  overflow: visible !important;
  position: relative;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Desktop: position buttons inside the header row */
@media (min-width: 768px) {
  .services-header-container {
    position: relative;
  }

  .services-header-container .normal-mode-buttons,
  .services-header-container .edit-mode-buttons {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
  }
}

/* --------------------------------------------------------------------------
   Service Details Title
   -------------------------------------------------------------------------- */


/* Allow dropdowns in the service details header to overflow card boundaries.
   position + z-index ensures the header stacking context sits above page content below it,
   preventing the dropdown menu from appearing behind the image or other content. */
.card:has(.services-header),
.services-header,
.services-header-container {
  overflow: visible !important;
}

.services-header-container {
  position: relative;
  z-index: 10;
}

/* Allow Assign To dropdowns in the services list to overflow card boundaries.
   Every ancestor in the chain from .card-body down to the dropdown must be
   overflow: visible, otherwise the absolutely-positioned menu gets clipped. */
.card:has(.service-card),
.card:has(.service-card) .card-body,
.services-content,
.services-list,
.services-for-date,
.service-card,
.service-card-content {
  overflow: visible !important;
}

/* Header buttons - consistent height */
.services-header .btn,
.services-header button,
.services-header a.flex,
.services-header-container .btn,
.services-header-container button,
.services-header-container a.flex {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Back button */
.services-header .back-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 31px !important;
  height: 31px !important;
  padding: 0 !important;
  background-color: transparent !important;
  border: 1px solid #6e7985 !important;
  border-radius: 6px !important;
  color: #6e7985 !important;
  text-decoration: none !important;
  transition: background-color 0.15s, color 0.15s !important;
  flex-shrink: 0 !important;
}

.services-header .back-button:hover {
  background-color: #6e7985 !important;
  border-color: #6e7985 !important;
  color: #ffffff !important;
}

/* Actions button */
.services-header .btn-outline-secondary,
.services-header-container .btn-outline-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  background-color: #ffffff !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 0.75rem !important;
  color: #374151 !important;
  font-weight: 500;
}

.services-header .btn-outline-secondary:hover,
.services-header-container .btn-outline-secondary:hover {
  background-color: #f3f4f6 !important;
  color: #6b7280 !important;
}

.services-header .btn-outline-secondary:active,
.services-header .btn-outline-secondary.active,
.services-header .btn-outline-secondary:focus,
.services-header .btn-outline-secondary:focus-visible,
.services-header .show>.btn-outline-secondary.dropdown-toggle,
.services-header .show>.btn-outline-secondary,
.services-header-container .btn-outline-secondary:active,
.services-header-container .btn-outline-secondary.active,
.services-header-container .btn-outline-secondary:focus,
.services-header-container .btn-outline-secondary:focus-visible,
.services-header-container .show>.btn-outline-secondary.dropdown-toggle,
.services-header-container .show>.btn-outline-secondary {
  background-color: #e9ecef !important;
  border-color: #6c757d !important;
  color: #1f2937 !important;
  box-shadow: none !important;
}

/* Buttons container alignment */
.services-header .d-flex.align-items-center.gap-2,
.services-header-container .d-flex.align-items-center.gap-2 {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Fix button_to form wrapper alignment */
.services-header form,
.services-header-container form {
  margin: 0;
  display: inline-flex;
  align-items: center;
}

/* --------------------------------------------------------------------------
   Service Details Content Wrapper
   -------------------------------------------------------------------------- */

/* This form only carries hidden inputs for the edit-mode JS, but the
   browser's default form margin (1em) still added visible dead space
   below the header buttons. */
.edit-service-form {
  margin: 0;
}

.service-detail-content-wrapper {
  background-color: white;
}

/* Desktop padding only — the mobile override above (max-width: 767.98px)
   used to get clobbered by this rule since it's declared later in the
   cascade at equal specificity, silently doubling the intended mobile
   padding. */
@media (min-width: 768px) {
  .service-detail-content-wrapper {
    padding: 1rem;
  }
}

/* --------------------------------------------------------------------------
   Service Name Title
   -------------------------------------------------------------------------- */

.service-name-title {
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.35;
  margin-bottom: 0;
}

.service-name-subtitle {
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  color: #6b7280;
}

.service-photo-indicator {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  color: #6b7280;
}

/* --------------------------------------------------------------------------
   Service Instructions Section
   -------------------------------------------------------------------------- */

.service-instructions-divider {
  margin: 0 0 0 0;
  border: none;
  border-top: 1px solid #dee2e6;
}

.service-instructions-title {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.55;
}

.service-instructions-card {
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 1rem;
  gap: 1rem;
  background-color: #f8f9fc;
  overflow: visible;
}

.service-instructions-media {
  width: 160px;
  height: 120px;
  border-radius: 0.375rem;
  border: 1px solid #E2E5EC;
  padding: 1px;
  object-fit: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
  flex-shrink: 0;
  position: relative;
}

.service-instructions-media.media-item {
  overflow: visible !important;
  position: relative;
}

.media-thumbnail {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.375rem;
}

.video-play-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

/* Horizontal scrollable media gallery */
.media-gallery-scroll {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  overflow-y: visible;
  padding: 0.5rem 0;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}

/* Custom scrollbar for media gallery */
.media-gallery-scroll::-webkit-scrollbar {
  height: 6px;
}

.media-gallery-scroll::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 3px;
}

.media-gallery-scroll::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 3px;
}

.media-gallery-scroll::-webkit-scrollbar-thumb:hover {
  background: #a1a1a1;
}

/* Firefox scrollbar */
.media-gallery-scroll {
  scrollbar-width: thin;
  scrollbar-color: #c1c1c1 #f1f1f1;
}

/* Prevent gallery items from shrinking */
.media-gallery-scroll .service-instructions-media,
.media-gallery-scroll .equipment-image-container,
.media-gallery-scroll .equipment-image-placeholder {
  flex-shrink: 0;
}

/* Media item delete button */
.media-delete-btn {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 24px;
  height: 24px;
  background-color: rgba(255, 255, 255, 0.95);
  border: 1px solid #E2E5EC;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease;
  z-index: 10;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.media-delete-btn:hover {
  background-color: #fee2e2;
  border-color: #fca5a5;
}

/* Media item marked for deletion */
.media-item.marked-for-deletion {
  position: relative;
}

.media-item.marked-for-deletion::after {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(45deg,
      transparent,
      transparent 10px,
      rgba(239, 68, 68, 0.1) 10px,
      rgba(239, 68, 68, 0.1) 20px);
  border-radius: 0.85rem;
  pointer-events: none;
}

/* Video play overlay */
.media-item video+.absolute {
  pointer-events: none;
}

.video-play-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
}

/* --------------------------------------------------------------------------
   Service Main Image Card (Right Column)
   -------------------------------------------------------------------------- */

.service-main-image-card {
  width: 100%;
  min-height: 160px;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.5rem;
  background-color: #f8f9fc;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  transition: min-height 0.2s ease;
}

/* When edit buttons are visible, the card expands */
.service-main-image-card:has(.main-image-edit-buttons:not(.d-none)) {
  min-height: 200px;
}

.service-main-image-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 3 / 1;
  height: auto;
  border-radius: 0.375rem;
}

.service-main-image-wrapper>* {
  width: 100%;
  height: 100%;
}

.service-main-image {
  width: 100%;
  height: 100%;
  border-radius: 0.375rem;
  object-fit: cover;
  background-color: white;
}

.service-main-image-placeholder {
  background-color: #f9fafb;
  border: 2px dashed #d1d5db;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 120px;
  flex: 1;
}

.service-main-image-placeholder i {
  color: #9ca3af;
}

/* Mark as Complete button */
.services-header .btn-success,
.services-header .bg-success-new,
.services-header-container .btn-success,
.services-header-container .bg-success-new {
  background-color: #CAF2D7 !important;
  border: 1.5px solid #00B749 !important;
  border-radius: 0.375rem !important;
  color: #1f2937 !important;
}

/* Actions dropdown button */
.services-header .actions-dropdown .btn,
.services-header-container .actions-dropdown .btn {
  border-radius: 0.375rem !important;
}

.services-header .btn-success:hover,
.services-header .bg-success-new:hover,
.services-header-container .btn-success:hover,
.services-header-container .bg-success-new:hover {
  background-color: #b8e8c7 !important;
  border-color: #00a040 !important;
}

/* Header title alignment */
.services-header h4 {
  white-space: nowrap;
}

.services-header h4.services-header-title {
  font-weight: 700;
  line-height: 1.2;
}

/* Header buttons container */
.services-header .d-flex.align-items-center.gap-2,
.services-header-container .d-flex.align-items-center.gap-2 {
  align-self: center;
}

/* Dropdown toggle arrow — hidden because the button uses an explicit icon */
.services-header .actions-dropdown .dropdown-toggle::after,
.services-header-container .actions-dropdown .dropdown-toggle::after {
  display: none;
}

/* Inline Actions wrapper used inside the header bar for completed services. */
.services-header .header-inline-actions {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   Service Details Tabs (Details / Timeline)
   -------------------------------------------------------------------------- */

.tab-rectangle-container {
  display: flex;
  width: 100%;
  background-color: #f3f4f6;
  border-radius: 12px;
  padding: 4px;
}

.tab-rectangle {
  flex: 1;
  padding: 12px 0;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 500;
  text-align: center;
  transition: all 0.2s ease;
  cursor: pointer;
  border: none;
  background: transparent;
}

.tab-rectangle.active {
  background-color: white;
  color: #020817;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.tab-rectangle:not(.active) {
  background-color: transparent;
  color: #6b7280;
}

.tab-rectangle:not(.active):hover {
  color: #374151;
}

/* --------------------------------------------------------------------------
   Service Status Background Colors
   -------------------------------------------------------------------------- */

.bg-status-scheduled {
  background-color: #6b7280;
}

.bg-status-upcoming {
  background-color: #d97706;
}

.bg-status-past-due {
  background-color: #dc2626;
}

.bg-status-completed {
  background-color: #059669;
}

/* --------------------------------------------------------------------------
   Service Details Card (Due Date, Frequency, Completion Requirements)
   -------------------------------------------------------------------------- */

.service-details-card {
  width: 100%;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 1rem;
  background-color: #f8f9fc;
}

.service-details-title {
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.55;
  color: #111827;
  margin-bottom: 1rem;
}

.service-details-items {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.service-details-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.service-details-icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
}

.service-details-icon-color {
  color: #0067b3;
}

.service-details-label {
  font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.4;
  color: #6b7280;
  margin: 0;
}

.service-details-value {
  font-size: 0.875rem;
  font-weight: 600;
  color: #111827;
  margin: 0.25rem 0 0 0;
}

.service-details-note {
  font-size: 0.75rem;
  color: #6b7280;
  margin: 0.125rem 0 0 0;
}

/* --------------------------------------------------------------------------
   Details Tab (Status, Progress, Priority, Assigned To)
   -------------------------------------------------------------------------- */

/* Same surface as the Inspections attention-item Details card
   (attention_items/_details_tab.html.erb → .attention-details-card, #F8F9FC),
   so the two Details sections read as one component. */
.details-tab-grid {
  background-color: #f8f9fc;
}

.details-tab-title {
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.4;
  vertical-align: middle;
  color: #111827;
  margin-bottom: 0.25rem;
}

.details-tab-subtitle {
  font-size: 0.8125rem;
  color: #9ca3af;
  margin-bottom: 0.75rem;
}

.details-field-icon {
  color: #0067b3;
  width: 24px;
  height: 24px;
}

.details-field-label {
  font-weight: 600;
  font-size: 1rem;
  color: #374151;
  margin-bottom: 0.375rem;
}

/* Wrapper for the value row of a details field (badge / dropdown / readonly).
   Guarantees a consistent row height across all fields so labels and helper
   text line up between columns. Matches the height of form dropdown triggers
   (padding 0.375rem + line-height 1.5 + 1px borders ≈ 38px). */
.details-field-value {
  display: flex;
  align-items: center;
  min-height: 38px;
}

.details-field-note {
  font-size: 0.875rem;
  color: #9ca3af;
  margin-top: 0.375rem;
  margin-bottom: 0;
}

.details-field-select {
  width: 100%;
  max-width: 100%;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  background-color: white;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px;
}

.details-field-select:hover {
  border-color: #9ca3af;
}

.details-field-select:focus {
  outline: none;
  border-color: #0067b3;
}

.details-field-readonly {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
}

/* --------------------------------------------------------------------------
   Progress Dropdown
   -------------------------------------------------------------------------- */

.progress-dropdown {
  position: relative;
  width: 100%;
  max-width: 340px;
}

.progress-dropdown-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.375rem 0.75rem;
  background-color: white;
  cursor: pointer;
  transition: border-color 0.2s;
}

.progress-dropdown-trigger:hover {
  border-color: #9ca3af;
}

.progress-dropdown-trigger:focus {
  outline: none;
  border-color: #0067b3;
}

.progress-dropdown-text {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
}

.progress-dropdown-arrow {
  color: #6b7280;
  flex-shrink: 0;
}

.progress-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  background-color: white;
  border-radius: 0.375rem;
  border: 1px solid #d1d5db;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  max-height: 300px;
  overflow-y: auto;
}

.progress-dropdown-menu.hidden {
  display: none !important;
}

.progress-dropdown-menu.open-up {
  top: auto;
  bottom: calc(100% + 4px);
}

.progress-dropdown-options {
  padding: 0.5rem 0;
}

.progress-dropdown-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  transition: background-color 0.15s;
}

.progress-dropdown-option:hover {
  background-color: #f3f4f6;
}

.progress-dropdown-divider {
  border-top: 1px solid #e5e7eb;
  margin: 0;
}

/* Progress Icon Colors */
.progress-icon-open {
  color: #6b7280;
}

.progress-icon-in-progress {
  color: #ffc107;
}

.progress-icon-on-hold {
  color: #ff3d3d;
}

.progress-icon-work-order {
  color: #0a6db6;
}

.progress-icon-closed {
  color: #00A63E;
}

#progress-container {
  overflow: visible;
}

/* --------------------------------------------------------------------------
   Assigned To Dropdown
   -------------------------------------------------------------------------- */

.assigned-dropdown {
  position: relative;
  width: 100%;
}

.assigned-dropdown-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.375rem 0.75rem;
  background-color: white;
  cursor: pointer;
  transition: border-color 0.2s;
}

.assigned-dropdown-trigger:hover {
  border-color: #9ca3af;
}

.assigned-dropdown-trigger:focus {
  outline: none;
  border-color: #0067b3;
}

.assigned-dropdown-text {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
}

.assigned-dropdown-text.is-placeholder {
  color: #9ca3af;
}

.assigned-dropdown-arrow {
  color: #6b7280;
  flex-shrink: 0;
}

.assigned-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  background-color: white;
  border-radius: 0.375rem;
  border: 1px solid #d1d5db;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  max-height: 350px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* Ensure .hidden class works with flexbox elements */
.assigned-dropdown-menu.hidden {
  display: none !important;
}

.assigned-dropdown-menu.open-up {
  top: auto;
  bottom: calc(100% + 4px);
}

.assigned-dropdown-search {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid #e5e7eb;
}

.assigned-search-icon {
  color: #9ca3af;
  flex-shrink: 0;
}

.assigned-search-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 1rem;
  color: #212529;
  background: transparent;
}

.assigned-search-input::placeholder {
  color: #9ca3af;
}

.assigned-dropdown-options {
  padding: 0.5rem 0;
  overflow-y: auto;
  max-height: 220px;
}

.assigned-dropdown-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  transition: background-color 0.15s;
}

.assigned-dropdown-option:hover {
  background-color: #f3f4f6;
}

.assigned-dropdown-divider {
  border-top: 1px solid #e5e7eb;
  margin: 0;
}

.assigned-remove-option {
  color: #374151;
}

.assigned-user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.assigned-user-avatar-sm {
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

img.assigned-user-avatar-sm {
  object-fit: cover;
}

div.assigned-user-avatar-sm.assigned-user-initials,
.assigned-user-avatar-sm.assigned-user-initials {
  background-color: #3b82f6;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
}

#assigned-container {
  overflow: visible;
}

/* Status Pill in Details Tab */
.details-status-pill {
  border-radius: 9999px;
  border-style: solid;
  border-width: 1.5px;
  padding: 0.2rem 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #111827 !important;
}

.details-status-pill.bg-amber-100 {
  background-color: #fbf598 !important;
  border-color: #FFC926 !important;
}

.details-status-pill.bg-red-100 {
  background-color: #fb9b9c !important;
  border-color: #EF4444 !important;
}

.details-status-pill.bg-green-100 {
  background-color: #7cdb87 !important;
  border-color: #00bd13 !important;
}

.details-status-pill.bg-gray-100 {
  background-color: #e5e7eb !important;
  border-color: #9ca3af !important;
}

/* --------------------------------------------------------------------------
   Priority Dropdown
   -------------------------------------------------------------------------- */

.priority-dropdown {
  position: relative;
  width: 100%;
  max-width: 340px;
}

.priority-dropdown-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  border-radius: 0.375rem;
  border: 1px solid #dee2e6;
  padding: 0.375rem 0.75rem;
  background-color: white;
  cursor: pointer;
  transition: border-color 0.2s;
}

.priority-dropdown-trigger:hover {
  border-color: #9ca3af;
}

.priority-dropdown-trigger:focus {
  outline: none;
  border-color: #0067b3;
}

.priority-dropdown-text {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
}

.priority-dropdown-arrow {
  color: #6b7280;
  flex-shrink: 0;
}

.priority-dropdown-menu {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 100%;
  background-color: white;
  border-radius: 0.375rem;
  border: 1px solid #d1d5db;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  max-height: 300px;
  overflow-y: auto;
}

.priority-dropdown-menu.hidden {
  display: none !important;
}

.priority-dropdown-menu.open-up {
  top: auto;
  bottom: calc(100% + 4px);
}

.priority-dropdown-options {
  padding: 0.5rem 0;
}

.priority-dropdown-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: none;
  border: none;
  cursor: pointer;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #212529;
  transition: background-color 0.15s;
}

.priority-dropdown-option:hover {
  background-color: #f3f4f6;
}

.priority-dropdown-divider {
  border-top: 1px solid #e5e7eb;
  margin: 0;
}

.priority-remove-option {
  color: #374151;
}

.priority-flag-icon {
  flex-shrink: 0;
}

/* Filled flag using CSS shape */
.priority-flag-filled {
  display: inline-block;
  width: 18px;
  height: 20px;
  position: relative;
  flex-shrink: 0;
}

.priority-flag-filled::before {
  content: '';
  position: absolute;
  top: 0;
  left: 2px;
  width: 14px;
  height: 14px;
  clip-path: polygon(0 0, 100% 0, 100% 70%, 50% 100%, 0 70%);
}

.priority-flag-filled::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 2px;
  height: 100%;
  background-color: #6b7280;
}

.priority-flag-urgent::before {
  background-color: #dc2626;
}

.priority-flag-high::before {
  background-color: #f97316;
}

.priority-flag-normal::before {
  background-color: #3b82f6;
}

.priority-flag-low::before {
  background-color: #6b7280;
}

/* Ensure dropdown containers allow overflow */
#priority-container {
  overflow: visible;
}

.priority-dropdown {
  overflow: visible;
}

/* --------------------------------------------------------------------------
   Lucide Icons (Service Details)
   -------------------------------------------------------------------------- */

.services-details .lucide-icon,
.service-details-page .lucide-icon {
  width: 24px;
  height: 24px;
  stroke-width: 1.5;
}

/* --------------------------------------------------------------------------
   New Service Button (Responsive)
   -------------------------------------------------------------------------- */

.new-service-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.new-service-btn .lucide-icon {
  width: 16px;
  height: 16px;
}

/* --------------------------------------------------------------------------
   Edit Mode Header Buttons
   -------------------------------------------------------------------------- */

.btn-edit-delete {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  background-color: white;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  color: #dc2626;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-edit-delete:hover {
  background-color: #fef2f2;
  border-color: #dc2626;
}

.btn-edit-delete .lucide-icon {
  width: 16px;
  height: 16px;
  color: #dc2626;
}

.btn-edit-cancel {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem 0.75rem;
  background-color: white;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  color: #374151;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-edit-cancel:hover {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}

.btn-edit-save {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.375rem 0.75rem;
  background-color: #0067b3;
  border: 1px solid #0067b3;
  border-radius: 0.375rem;
  color: white;
  font-size: 1rem;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-edit-save:hover {
  background-color: #005a9e;
  border-color: #005a9e;
}


/* --------------------------------------------------------------------------
   Edit Mode - Title Section
   -------------------------------------------------------------------------- */

.service-title-wrapper.editing {
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  padding: 0.75rem 1rem;
  background-color: #ffffff;
}

.service-title-input {
  width: 100%;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.35;
  color: #111827;
  border: none;
  background: transparent;
  padding: 0.25rem 0;
  outline: none;
  transition: border-color 0.2s;
}

.service-title-input:focus {
  outline: none;
}

/* --------------------------------------------------------------------------
   Edit Mode - WYSIWYG Editor
   -------------------------------------------------------------------------- */

.wysiwyg-toolbar {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem 0.75rem;
  background-color: #f9fafb;
  border: 1px solid #e5e7eb;
  border-bottom: none;
  border-radius: 0.5rem 0.5rem 0 0;
}

.toolbar-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  color: #374151;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.15s;
}

.toolbar-btn:hover {
  background-color: #e5e7eb;
  border-color: #d1d5db;
}

.toolbar-btn:active,
.toolbar-btn.active {
  background-color: #dbeafe;
  border-color: #0067b3;
  color: #0067b3;
}

.toolbar-divider {
  width: 1px;
  height: 24px;
  background-color: #e5e7eb;
  margin: 0 0.5rem;
}

.wysiwyg-editor {
  min-height: 150px;
  padding: 1rem;
  background-color: white;
  border: 1px solid #e5e7eb;
  border-radius: 0 0 0.5rem 0.5rem;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #374151;
  outline: none;
}

.wysiwyg-editor:focus {
  border-color: #0067b3;
  box-shadow: 0 0 0 3px rgba(0, 103, 179, 0.1);
}

.wysiwyg-editor ol,
.wysiwyg-editor ul {
  padding-left: 1.5rem;
  margin: 0.5rem 0;
}

.wysiwyg-editor li {
  margin: 0.25rem 0;
}

.wysiwyg-editor p {
  margin: 0.5rem 0;
}

.wysiwyg-editor a {
  color: #0067b3;
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Edit Mode - Media Attachments
   -------------------------------------------------------------------------- */

.attach-files-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background-color: white;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  color: #374151;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.attach-files-btn:hover {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}

.media-item {
  position: relative;
}

.media-delete-btn {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #dc2626;
  border: 2px solid white;
  border-radius: 50%;
  color: white;
  cursor: pointer;
  transition: all 0.2s;
  z-index: 10;
}

.media-delete-btn:hover {
  background-color: #b91c1c;
  transform: scale(1.1);
}

.media-item.marked-for-deletion {
  opacity: 0.5;
  pointer-events: none;
}

/* Video play button overlay */
.media-item .video-play-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.6);
  border-radius: 50%;
  color: white;
}

@media (max-width: 767.98px) {
  .wysiwyg-toolbar {
    padding: 0.375rem 0.5rem;
    gap: 0.125rem;
  }

  .toolbar-btn {
    width: 28px;
    height: 28px;
  }

  .toolbar-divider {
    margin: 0 0.25rem;
  }

  .wysiwyg-editor {
    min-height: 120px;
    padding: 0.75rem;
  }

  .media-delete-btn {
    width: 20px;
    height: 20px;
    top: -6px;
    right: -6px;
  }
}

/* WYSIWYG Editor - List Styles (visible while editing) */
.wysiwyg-editor ol {
  list-style-type: decimal;
  padding-left: 2rem;
  margin: 0.75rem 0;
}

.wysiwyg-editor ul {
  list-style-type: disc;
  padding-left: 2rem;
  margin: 0.75rem 0;
}

.wysiwyg-editor ol li,
.wysiwyg-editor ul li {
  padding: 0.25rem 0;
  display: list-item;
}

.wysiwyg-editor ol ol {
  list-style-type: lower-alpha;
}

.wysiwyg-editor ul ul {
  list-style-type: circle;
}

/* --------------------------------------------------------------------------
   Edit Mode - Right Column (Service Details Card)
   -------------------------------------------------------------------------- */

/* Main Image Edit Buttons */
.main-image-edit-buttons {
  display: flex;
  gap: 0.75rem;
  margin-top: 0.75rem;
  width: 100%;
}

.main-image-edit-buttons.d-none {
  display: none !important;
}

.btn-image-edit,
.btn-image-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
  flex: 1;
}

.btn-image-edit {
  background-color: white;
  border: 1px solid #d1d5db;
  color: #374151;
}

.btn-image-edit:hover {
  background-color: #f3f4f6;
  border-color: #9ca3af;
}

.btn-image-remove {
  width: clamp(160px, 13.85vw, 222px);
  height: clamp(35px, 2.45vw, 39px);
  gap: 8px;
  border-radius: 11px;
  padding: 1px 14px;
  background-color: #E7000B;
  border: 1px solid #E7000B;
  color: white;
}

.btn-image-remove:hover {
  background-color: #c9000a;
  border-color: #c9000a;
}

/* ============================================================
   REMOVE IMAGE CONFIRMATION MODAL
   ============================================================ */

.remove-image-modal-dialog {
  max-width: clamp(400px, 40vw, 652px);
  width: 100%;
  margin: 1rem auto;
}

.remove-image-modal-content {
  background-color: #fff;
  border: none;
  box-shadow: 0 1.5rem 3rem -0.75rem rgba(0, 0, 0, 0.25);
  border-radius: 11.64px;
  padding: 35px;
}

.remove-image-modal-body {
  display: flex;
  flex-direction: column;
  gap: 23px;
}

.remove-image-modal-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.remove-image-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.remove-image-icon-wrapper svg {
  color: #EF4444;
}

.remove-image-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #EF4444;
  margin: 0;
}

.remove-image-message {
  font-size: 0.95rem;
  color: #374151;
  line-height: 1.5;
  margin: 0;
}

.remove-image-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 8px;
}

.btn-remove-image-cancel {
  min-width: 116px;
  height: 42px;
  border-radius: 8px;
  padding: 8px 24px;
  border: 1.46px solid #E4E4E7;
  background-color: white;
  color: #18181B;
  font-size: 0.938rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-remove-image-cancel:hover {
  background-color: #f4f4f5;
  border-color: #d4d4d8;
}

.btn-remove-image-confirm {
  min-width: 140px;
  height: 42px;
  border-radius: 8px;
  padding: 8px 24px;
  background-color: #EF4444;
  border: none;
  color: white;
  font-size: 0.938rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-remove-image-confirm:hover {
  background-color: #dc2626;
}

/* Responsive adjustments */
@media (max-width: 576px) {
  .remove-image-modal-dialog {
    max-width: 95%;
    margin: 0.5rem auto;
  }

  .remove-image-modal-content {
    padding: 24px;
  }

  .remove-image-actions {
    flex-direction: column-reverse;
    gap: 12px;
  }

  .btn-remove-image-cancel,
  .btn-remove-image-confirm {
    width: 100%;
    min-width: unset;
  }
}

/* ============================================================
   MARK AS COMPLETE MODAL
   ============================================================ */

.mark-complete-modal-dialog {
  max-width: clamp(400px, 90vw, 500px);
  width: 100%;
  margin: 1rem auto;
}

.mark-complete-modal-content {
  background-color: #fff;
  border: none;
  box-shadow: 0 1.5rem 3rem -0.75rem rgba(0, 0, 0, 0.25);
  border-radius: 12px;
  padding: 24px;
}

.mark-complete-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.mark-complete-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mark-complete-icon-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mark-complete-icon-wrapper svg {
  color: #009d3b;
}

.mark-complete-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
}

.mark-complete-close {
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mark-complete-close svg {
  color: #99A1AF;
}

.mark-complete-close:hover svg {
  color: #6b7280;
}

.mark-complete-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.mark-complete-subtitle {
  font-size: 0.875rem;
  color: #364153;
  margin: 0 0 8px 0;
}

.mark-complete-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.mark-complete-label {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
}

/* Wrapper for the visible "fake input" + the real native date input layered
   on top of it. The real input is the tap target so iOS Safari and Android
   WebView reliably open the native date picker. */
.mark-complete-date-wrapper {
  position: relative;
}

.mark-complete-date-input {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  background-color: #fff;
  cursor: pointer;
}

.mark-complete-date-input:hover {
  border-color: #d1d5db;
}

.mark-complete-date-icon {
  color: #6b7280;
}

.mark-complete-date-text {
  font-size: 0.875rem;
  color: #1f2937;
}

/* Native <input type="date"> overlaid on top of the visible div.
   - Must be a real, full-size, focusable input (NOT display:none or
     width/height:0) for iOS Safari to open the native picker on tap.
   - opacity: 0 keeps it invisible while remaining tappable.
   - DO NOT set -webkit-appearance: none — that strips Chrome/Edge's
     "click input to open picker" behavior and breaks desktop. */
.mark-complete-date-native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  opacity: 0;
  cursor: pointer;
  font: inherit;
}

.mark-complete-hint {
  font-size: 0.75rem;
  color: #6A7282;
  margin: 0;
  line-height: 1.4;
}

.mark-complete-divider {
  height: 1px;
  background-color: #E5E7EB;
  margin: 8px 0;
}

.mark-complete-textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  font-size: 0.875rem;
  color: #1f2937;
  resize: vertical;
  min-height: 100px;
}

.mark-complete-textarea::placeholder {
  color: #9ca3af;
}

.mark-complete-textarea:focus {
  outline: none;
  border-color: #009d3b;
  box-shadow: 0 0 0 2px rgba(0, 157, 59, 0.1);
}

.mark-complete-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  border: 2px dashed #E5E7EB;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.mark-complete-dropzone:hover {
  border-color: #009d3b;
  background-color: rgba(0, 157, 59, 0.02);
}

.mark-complete-dropzone.dragover {
  border-color: #009d3b;
  background-color: rgba(0, 157, 59, 0.05);
}

.mark-complete-dropzone-icon {
  color: #9ca3af;
  margin-bottom: 8px;
}

.mark-complete-dropzone-text {
  font-size: 0.875rem;
  color: #6A7282;
  margin: 0;
}

.mark-complete-dropzone-formats {
  font-size: 0.75rem;
  color: #99A1AF;
  margin: 4px 0 0 0;
}

.mark-complete-file-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.mark-complete-file-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background-color: #f3f4f6;
  border-radius: 6px;
  font-size: 0.75rem;
  color: #374151;
}

.mark-complete-file-item button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
}

.mark-complete-file-item button svg {
  color: #9ca3af;
  width: 14px;
  height: 14px;
}

.mark-complete-file-item button:hover svg {
  color: #ef4444;
}

.mark-complete-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-top: 24px;
}

.btn-mark-complete-back {
  min-width: 88px;
  height: 50px;
  border-radius: 8px;
  border: 1px solid #E5E7EB;
  padding: 13px 25px;
  background-color: #fff;
  color: #1f2937;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-mark-complete-back:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.btn-mark-complete-submit {
  min-width: 186px;
  height: 48px;
  border-radius: 8px;
  border: 1px solid #00B749;
  padding: 12px 24px;
  background-color: #caf2d7;
  color: #1f2937;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.btn-mark-complete-submit:hover {
  background-color: #b8ecc8;
}

.btn-mark-complete-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 576px) {
  .mark-complete-modal-dialog {
    max-width: 95%;
    margin: 0.5rem auto;
  }

  .mark-complete-modal-content {
    padding: 20px;
  }

  .mark-complete-footer {
    flex-direction: column-reverse;
    gap: 10px;
  }

  .btn-mark-complete-back,
  .btn-mark-complete-submit {
    width: 100%;
    min-width: unset;
  }
}

/* ============================================================
   CHANGE FREQUENCY MODAL
   ============================================================ */

/* ============================================================
   CHANGE FREQUENCY MODAL DROPDOWN CONVERSION
   ============================================================ */

#changeFrequencyModal {
  overflow: visible !important;
}

#changeFrequencyModal .modal-dialog {
  overflow: visible !important;
}

#changeFrequencyModal .modal-content {
  overflow: visible !important;
}

.custom-select-dropdown {
  display: inline-block;
}

.custom-select-dropdown-btn {
  cursor: pointer;
}

.custom-select-dropdown-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.custom-select-dropdown-menu {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.custom-select-dropdown-item:hover {
  background-color: #e8e8e8 !important;
}

.change-frequency-modal-dialog {
  max-width: clamp(400px, 90vw, 47.2rem);
  /* 755px */
  width: 100%;
  margin: 1rem auto;
}

.change-frequency-modal-content {
  background-color: #fff;
  border: none;
  box-shadow: 0 1.5rem 3rem -0.75rem rgba(0, 0, 0, 0.25);
  border-radius: 1.1rem;
  /* 17.51px */
  padding: 2.28rem;
  /* 36.47px */
}

.change-frequency-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}

.change-frequency-title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #18181B;
  margin: 0;
}

.change-frequency-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.25rem;
  color: #71717A;
  transition: color 0.2s;
}

.change-frequency-close:hover {
  color: #18181B;
}

.change-frequency-tabs {
  display: flex;
  justify-content: space-between;
  background-color: #F5F5F5;
  border-radius: 0.91rem;
  /* 14.59px */
  padding: 0.365rem;
  /* 5.84px */
  margin-bottom: 1.5rem;
  gap: 0;
}

.change-frequency-tab {
  flex: 1;
  padding: 0.55rem 1rem;
  /* ~8.75px vertical */
  background: transparent;
  border: none;
  font-size: 0.95rem;
  font-weight: 500;
  color: #64748B;
  cursor: pointer;
  transition: all 0.2s;
  border-radius: 0.73rem;
  /* 11.67px */
}

.change-frequency-tab:not(:last-child) {
  border-right: none;
}

.change-frequency-tab.active {
  background-color: #FFFFFF;
  color: #18181B;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.change-frequency-tab:hover:not(.active) {
  color: #475569;
}

.change-frequency-content {
  margin-bottom: 1.5rem;
}

.change-frequency-tab-content {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.change-frequency-tab-content.d-none {
  display: none !important;
}

.change-frequency-repeat-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.change-frequency-label {
  font-size: 0.95rem;
  color: #18181B;
}

.change-frequency-interval-input {
  width: 60px;
  height: 40px;
  border: 1px solid #E4E4E7;
  border-radius: 0.5rem;
  padding: 0.5rem;
  text-align: center;
  font-size: 0.95rem;
  color: #18181B;
}

.change-frequency-interval-input:focus {
  outline: none;
  border-color: #0067B3;
  box-shadow: 0 0 0 2px rgba(0, 103, 179, 0.2);
}

.change-frequency-days {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  justify-content: space-between;
}

.change-frequency-day {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.change-frequency-day-radio {
  appearance: none;
  width: 24px;
  height: 24px;
  border: 1px solid #0067B3;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
}

.change-frequency-day-radio:checked {
  background-color: #0067B3;
  border-color: #0067B3;
}

.change-frequency-day-radio:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  background-color: white;
  border-radius: 50%;
}

.change-frequency-day-radio:hover:not(:checked) {
  border-color: #A1A1AA;
}

.change-frequency-day-label {
  font-size: 0.85rem;
  color: #71717A;
  cursor: pointer;
}

.change-frequency-monthly-options,
.change-frequency-yearly-options {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.change-frequency-monthly-option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.change-frequency-radio {
  appearance: none;
  width: 20px;
  height: 20px;
  border: 1px solid #0067B3;
  border-radius: 50%;
  cursor: pointer;
  transition: all 0.2s;
  position: relative;
  flex-shrink: 0;
}

.change-frequency-radio:checked {
  border-color: #0067B3;
}

.change-frequency-radio:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 10px;
  height: 10px;
  background-color: #0067B3;
  border-radius: 50%;
}

/* Monthly divider with "or" */
.change-frequency-divider {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin: 0.75rem 0;
}

.change-frequency-divider-line {
  flex: 1;
  height: 1px;
  background-color: #E4E4E7;
}

.change-frequency-divider-text {
  color: #94A3B8;
  font-size: 0.875rem;
  font-weight: 400;
}

/* Monthly day input */
.change-frequency-day-input {
  width: 60px;
  height: 40px;
  border: 1px solid #E4E4E7;
  border-radius: 0.5rem;
  padding: 0.5rem;
  text-align: center;
  font-size: 0.95rem;
  color: #18181B;
}

.change-frequency-day-input:focus {
  outline: none;
  border-color: #0067B3;
  box-shadow: 0 0 0 2px rgba(0, 103, 179, 0.2);
}

.change-frequency-select {
  height: 40px;
  border: 1px solid #E4E4E7;
  border-radius: 0.5rem;
  padding: 0.5rem 0.75rem;
  font-size: 0.95rem;
  color: #18181B;
  background-color: white;
  min-width: 100px;
}

.change-frequency-select:focus {
  outline: none;
  border-color: #0067B3;
  box-shadow: 0 0 0 2px rgba(0, 103, 179, 0.2);
}

.change-frequency-select:disabled {
  background-color: #f4f4f5;
  color: #A1A1AA;
  cursor: not-allowed;
}

.change-frequency-yearly-options {
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.change-frequency-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 1rem;
}

.btn-change-frequency-cancel {
  height: 44px;
  border-radius: 0.5rem;
  padding: 0.625rem 1.25rem;
  border: 1px solid #E4E4E7;
  background-color: white;
  color: #18181B;
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-change-frequency-cancel:hover {
  background-color: #f4f4f5;
  border-color: #d4d4d8;
}

.btn-change-frequency-save {
  height: 44px;
  border-radius: 0.5rem;
  padding: 0.625rem 1.25rem;
  background-color: #0067b3;
  border: 1.5px solid #0067b3;
  color: white;
  font-size: 0.95rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s;
}

.btn-change-frequency-save:hover:not(:disabled) {
  background-color: #005a9e;
  border-color: #005a9e;
}

.btn-change-frequency-save[disabled],
.btn-change-frequency-save:disabled {
  background-color: #9fc5e8;
  border-color: #9fc5e8;
  cursor: not-allowed;
}

/* Responsive adjustments */
@media (max-width: 576px) {
  .change-frequency-modal-dialog {
    max-width: 95%;
    margin: 0.5rem auto;
  }

  .change-frequency-modal-content {
    padding: 1.5rem;
  }

  .change-frequency-days {
    gap: 0.5rem;
  }

  .change-frequency-actions {
    flex-direction: column-reverse;
    gap: 0.75rem;
  }

  .btn-change-frequency-cancel,
  .btn-change-frequency-save {
    width: 100%;
  }
}

/* ============================================================
   EDIT IMAGE MODAL
   ============================================================ */

#editImageModal .modal-dialog {
  max-width: clamp(20rem, 90vw, 49.4rem);
  /* 790.56px */
  width: 100%;
  margin: 1rem auto;
}

#editImageModal .modal-content {
  background-color: #fff;
  border: none;
  box-shadow: 0 1.5rem 3rem -0.75rem rgba(0, 0, 0, 0.25);
  border-radius: 0.515rem;
  /* 8.24px */
  min-height: clamp(25rem, 80vh, 37.77rem);
  /* 604.29px */
}

.edit-image-modal-content {
  border-radius: 0.515rem;
  padding: 1.5rem;
}

.edit-image-preview-container {
  width: 100%;
}

.edit-image-preview-frame {
  width: 100%;
  aspect-ratio: 3 / 1;
  background-color: #f3f4f6;
  border: 0.0625rem solid #e5e7eb;
  border-radius: 0.75rem;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: grab;
  position: relative;
}

.edit-image-preview-frame:active {
  cursor: grabbing;
}

.edit-image-preview-frame img {
  max-width: none;
  max-height: none;
  width: auto;
  height: auto;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  user-select: none;
  -webkit-user-drag: none;
  transform-origin: center center;
}

.edit-image-zoom-controls .form-range {
  height: 0.5rem;
  background: transparent;
}

.edit-image-zoom-controls .form-range::-webkit-slider-track {
  height: 0.25rem;
  background: #e5e7eb;
  border-radius: 0.125rem;
}

.edit-image-zoom-controls .form-range::-webkit-slider-thumb {
  width: 1rem;
  height: 1rem;
  background-color: #0067B3;
  border: 0.125rem solid #fff;
  border-radius: 50%;
  box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.2);
  margin-top: -0.375rem;
}

.edit-image-zoom-controls .form-range::-moz-range-track {
  height: 0.25rem;
  background: #e5e7eb;
  border-radius: 0.125rem;
}

.edit-image-zoom-controls .form-range::-moz-range-thumb {
  width: 1rem;
  height: 1rem;
  background-color: #0067B3;
  border: 0.125rem solid #fff;
  border-radius: 50%;
  box-shadow: 0 0.0625rem 0.1875rem rgba(0, 0, 0, 0.2);
}

.edit-image-zoom-controls .zoom-btn {
  width: 2rem;
  height: 2rem;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.375rem;
  flex-shrink: 0;
  border-color: #e5e7eb;
  color: #6b7280;
}

.edit-image-zoom-controls .zoom-btn:hover {
  background-color: #f3f4f6;
  border-color: #d1d5db;
  color: #374151;
}

#editImageModal .btn-primary {
  background-color: #0067B3;
  border-color: #0067B3;
}

#editImageModal .btn-primary:hover {
  background-color: #005a9e;
  border-color: #005a9e;
}

#editImageModal .btn-outline-secondary {
  border-color: #d1d5db;
  color: #374151;
}

#editImageModal .btn-outline-secondary:hover {
  background-color: #f3f4f6;
  border-color: #9ca3af;
  color: #111827;
}

/* Responsive adjustments */
@media (max-width: 48rem) {
  #editImageModal .modal-dialog {
    margin: 0.5rem;
  }

  .edit-image-modal-content {
    padding: 1rem;
  }

  .edit-image-preview-frame {
    aspect-ratio: 3 / 1;
  }
}

/* Date Input */
.details-date-input {
  width: 100%;
  height: 40px;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  color: #374151;
  background-color: white;
  outline: none;
  transition: border-color 0.2s;
}

.details-date-input:focus {
  border-color: #0067b3;
  box-shadow: 0 0 0 3px rgba(0, 103, 179, 0.1);
}

/* Select Input */
.details-select {
  width: 100%;
  height: 40px;
  padding: 0.5rem 0.75rem;
  border: 1px solid #d1d5db;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  color: #374151;
  background-color: white;
  outline: none;
  cursor: pointer;
  transition: border-color 0.2s;
}

.details-select:focus {
  border-color: #0067b3;
  box-shadow: 0 0 0 3px rgba(0, 103, 179, 0.1);
}

/* Notify Days Wrapper */
.notify-days-wrapper {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.notify-label {
  font-size: 0.875rem;
  color: #111827;
}

.notify-days-select {
  width: auto;
  min-width: 60px;
  max-height: 32px;
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  color: #374151;
  background-color: white;
  cursor: pointer;
}

.notify-days-dropdown {
  position: relative;
  display: inline-block;
}

.notify-days-trigger {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  font-size: 0.875rem;
  color: #374151;
  background-color: white;
  cursor: pointer;
  min-width: 52px;
}

.notify-days-trigger:hover {
  border-color: #9ca3af;
}

.notify-days-arrow {
  color: #6b7280;
  flex-shrink: 0;
}

.notify-days-menu {
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  z-index: 1000;
  background: white;
  border: 1px solid #d1d5db;
  border-radius: 0.375rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
  max-height: 200px;
  overflow-y: auto;
  min-width: 52px;
}

.notify-days-menu.hidden {
  display: none;
}

.notify-days-option {
  display: block;
  width: 100%;
  padding: 0.25rem 0.75rem;
  font-size: 0.875rem;
  color: #374151;
  background: none;
  border: none;
  text-align: center;
  cursor: pointer;
}

.notify-days-option:hover {
  background-color: #f3f4f6;
}

.notify-days-value {
  min-width: 16px;
  text-align: center;
}

/* Note actions three-dots menu */
.note-actions-wrapper {
  position: relative;
  flex-shrink: 0;
}

.note-actions-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  border-radius: 4px;
  cursor: pointer;
  color: #9ca3af;
  transition: background-color 0.15s, color 0.15s;
}

.note-actions-toggle:hover {
  background-color: #e5e7eb;
  color: #374151;
}

.note-actions-icon {
  pointer-events: none;
}

/* Checkboxes */
.req-check-item {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.25rem;
}

.req-check-icon {
  color: #2563eb;
  flex-shrink: 0;
}

.requirement-checkbox {
  margin-bottom: 0.75rem;
}

.requirement-checkbox:last-child {
  margin-bottom: 0;
}

.checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  cursor: pointer;
  user-select: none;
}

.checkbox-label input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: #0067b3;
  cursor: pointer;
  flex-shrink: 0;
}

.checkbox-text {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.4;
}

/* Responsive styles */
@media (max-width: 767.98px) {
  .service-main-image-card {
    min-height: 120px;
    padding: 0.5rem;
  }

  .service-main-image-card:has(.main-image-edit-buttons:not(.d-none)) {
    min-height: 180px;
  }

  .main-image-edit-buttons {
    flex-direction: row;
    gap: 0.5rem;
    margin-top: 0.5rem;
  }

  .btn-image-edit {
    padding: 0.5rem 0.75rem;
    font-size: 0.8rem;
  }

  .btn-image-remove {
    width: auto;
    height: auto;
    padding: 0.5rem 0.75rem;
    font-size: 0.8rem;
  }

  .details-date-input,
  .details-select {
    height: 44px;
    font-size: 1rem;
  }

  .notify-days-wrapper {
    flex-wrap: nowrap;
    align-items: center;
  }

  .checkbox-label input[type="checkbox"] {
    width: 20px;
    height: 20px;
  }

  .checkbox-text {
    font-size: 0.9375rem;
  }
}

/* Frequency Display Input */
.frequency-display-input {
  width: 100%;
  padding: 0.625rem 0.875rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  color: #374151;
  background-color: #ffffff;
  cursor: pointer;
}

/* Custom Square Checkboxes */
.custom-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  cursor: pointer;
  user-select: none;
}

.custom-checkbox-input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.custom-checkbox-box {
  width: 18px;
  height: 18px;
  min-width: 18px;
  border: 1.5px solid #d1d5db;
  border-radius: 4px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s;
  margin-top: 2px;
}

.custom-checkbox-input:checked+.custom-checkbox-box {
  background-color: #0067b3;
  border-color: #0067b3;
}

.custom-checkbox-input:checked+.custom-checkbox-box::after {
  content: '';
  width: 5px;
  height: 9px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  margin-bottom: 2px;
}

.custom-checkbox-input:focus+.custom-checkbox-box {
  box-shadow: 0 0 0 3px rgba(0, 103, 179, 0.1);
}

.custom-checkbox-text {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.4;
}

@media (max-width: 767.98px) {
  .custom-checkbox-box {
    width: 20px;
    height: 20px;
    min-width: 20px;
  }

  .custom-checkbox-text {
    font-size: 0.9375rem;
  }
}

/* Service Instructions Content - WYSIWYG HTML Styles */
.service-instructions-content {
  font-size: 0.875rem;
  color: #374151;
  line-height: 1.6;
}

.service-instructions-content ol {
  list-style-type: decimal;
  padding-left: 1.5rem;
  margin: 0;
}

.service-instructions-content ul {
  list-style-type: disc;
  padding-left: 1.5rem;
  margin: 0;
}

.service-instructions-content li {
  margin-bottom: 0.5rem;
}

.service-instructions-content p {
  margin-bottom: 0.75rem;
}

.service-instructions-content p:last-child {
  margin-bottom: 0;
}

.service-instructions-content a {
  color: #2563eb;
  text-decoration: underline;
}

.service-instructions-content a:hover {
  color: #1d4ed8;
}

/* ============================================================
   Confirm Next Service Date Modal
   ============================================================ */

.confirm-next-date-modal-content {
  border-radius: 12px;
  border: none;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  overflow: hidden;
}

.confirm-next-date-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 24px;
  background-color: #fbfbfb;
  border-bottom: 1px solid #e5e7eb;
}

.confirm-next-date-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0;
}

.confirm-next-date-close {
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background-color 0.2s ease;
}

.confirm-next-date-close svg {
  color: #6b7280;
}

.confirm-next-date-close:hover {
  background-color: #f3f4f6;
}

.confirm-next-date-close:hover svg {
  color: #374151;
}

.confirm-next-date-body {
  padding: 24px;
  background-color: #fff;
}

.confirm-next-date-field {
  margin-bottom: 16px;
}

.confirm-next-date-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 8px;
}

.confirm-next-date-input-disabled {
  width: 100%;
  padding: 12px 16px;
  background-color: #f3f4f6;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  font-size: 0.875rem;
  color: #374151;
  cursor: not-allowed;
}

.confirm-next-date-divider {
  height: 1px;
  background-color: #e5e7eb;
  margin: 20px 0;
}

.confirm-next-date-info-card {
  background-color: #EFF6FF;
  border: 1px solid #BFDBFE;
  border-radius: 12px;
  padding: 16px;
  margin-bottom: 16px;
}

.confirm-next-date-info-row {
  display: flex;
  gap: 12px;
}

.confirm-next-date-info-icon {
  flex-shrink: 0;
  color: #0067B3;
}

.confirm-next-date-info-icon svg {
  color: #0067B3;
}

.confirm-next-date-info-content {
  flex: 1;
}

.confirm-next-date-info-text {
  font-size: 0.875rem;
  color: #0067B3;
  margin: 0 0 4px 0;
  line-height: 1.5;
}

.confirm-next-date-info-date {
  font-size: 1.125rem;
  font-weight: 700;
  color: #0067B3;
  margin: 0;
}

.confirm-next-date-hint {
  font-size: 0.8125rem;
  color: #6b7280;
  margin: 0;
  line-height: 1.5;
}

.confirm-next-date-footer {
  display: flex;
  justify-content: stretch;
  align-items: center;
  gap: 12px;
  padding: 16px 24px;
  background-color: #fbfbfb;
  border-top: 1px solid #e5e7eb;
}

.btn-confirm-next-date-reschedule {
  flex: 1;
  height: 40px;
  border-radius: 8px;
  border: 1px solid #E5E7EB;
  padding: 8px 12px;
  background-color: #fff;
  color: #1f2937;
  font-size: 0.75rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.btn-confirm-next-date-reschedule:hover {
  background-color: #f9fafb;
  border-color: #d1d5db;
}

.btn-confirm-next-date-confirm {
  flex: 1;
  height: 40px;
  border-radius: 8px;
  border: none;
  padding: 8px 16px;
  background-color: #0067B3;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-confirm-next-date-confirm:hover {
  background-color: #005a9e;
}

.btn-confirm-next-date-confirm:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

@media (max-width: 576px) {
  .confirm-next-date-footer {
    flex-direction: column-reverse;
    gap: 10px;
  }

  .btn-confirm-next-date-reschedule,
  .btn-confirm-next-date-confirm {
    width: 100%;
  }
}

/* ==========================================================================
   Upload Area Button Fix
   Fix for btn-outline-secondary:focus having white text on light background
   Bootstrap sets color:#fff on :focus which makes text invisible
   ========================================================================== */

.upload-area .btn-outline-secondary,
.upload-area .btn-outline-secondary:focus,
.upload-area .btn-outline-secondary:active {
  color: #6c757d !important;
  background-color: transparent !important;
}

.upload-area .btn-outline-secondary:hover {
  color: #fff !important;
  background-color: #6c757d !important;
}

/* Dark mode upload area buttons */
[data-skin=dark] .upload-area .btn-outline-secondary,
[data-skin=dark] .upload-area .btn-outline-secondary:focus,
[data-skin=dark] .upload-area .btn-outline-secondary:active {
  color: #E5E7EB !important;
  background-color: #1F1F1F !important;
  border-color: #4B5563 !important;
}

[data-skin=dark] .upload-area .btn-outline-secondary:hover {
  color: #fff !important;
  background-color: #2A2A2A !important;
}

.text-status-completed-light-gray {
  color: #6E7985;
}

/* .hidden {
  display: none !important;
}

.lg\:block.hidden {
  display: none !important;
}

@media (min-width: 1024px) {
  .lg\:block.hidden {
    display: block !important;
  }
} */
.wysiwyg-editor:empty::before {
  content: attr(data-placeholder);
  color: #9ca3af;
  pointer-events: none;
}
/* WashUp Admin – Location form styles
   Prefix: addash-loc-
   Extracted from inline styles in washup_admin/locations views */

/* ── Layout ────────────────────────────────────────────────── */

.addash-loc-card-wrapper {
  padding: 20px 24px;
}

.addash-loc-form-container {
  padding: 16px 89px 20px 89px;
}

.addash-loc-form-inner {
  padding: 24px 55px;
}

.addash-loc-form-header {
  padding: 8px 16px 9px 10px;
}

.addash-loc-edit-menu-container {
  position: absolute;
  right: 0;
  margin-top: 1px;
  width: 240px;
  background-color: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* ── Background Colors ────────────────────────────────────────────── */

.addash-loc-bg-gray-100 {
  background-color: #F8F9FC;
}

.addash-loc-bg-white {
  background-color: #FFFFFF;
}

/* ── Typography ────────────────────────────────────────────── */

.addash-loc-page-title {
  font-weight: 700;
  font-size: 21px;
  line-height: 25.2px;
  letter-spacing: -0.5px;
}

.addash-loc-section-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 28px;
  letter-spacing: -0.5px;
}

.addash-loc-field-label {
  margin: 0;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
}

.addash-loc-field-optional {
  margin-left: 4px;
  font-weight: 400;
  font-style: italic;
  font-size: 13px;
  color: #6E7985;
}

.addash-loc-helper-text {
  margin: 6px 0 0 0;
  font-weight: 400;
  font-size: 13px;
  line-height: 18px;
  color: #6E7985;
}

.addash-loc-id-badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  background-color: #ECEDF1;
  border-radius: 999px;
  font-weight: 500;
  font-size: 13px;
  line-height: 20px;
  color: #212830;
}

.addash-loc-checkbox-label {
  margin: 0;
  font-weight: 500;
  font-size: 14px;
}

.addash-loc-feature-price {
  margin: 0;
  font-weight: 500;
  font-size: 13.5px;
  line-height: 20px;
  color: #505256;
}

/* ── Totals ────────────────────────────────────────────────── */

.addash-loc-total-label {
  margin: 0;
  font-weight: 600 !important;
  font-size: 15px;
  line-height: 24px;
  color: #6B7280 !important;
}

.addash-loc-total-subtitle {
  margin: 0;
  font-weight: 400;
  /* Normal en lugar de 300 para mejor legibilidad */
  font-size: 13px;
  line-height: 1.4;
  /* 18.2px */
  color: #6B7280;
  /* Gris más suave */
}

.addash-loc-total-amount {
  margin: 0;
  font-weight: 700;
  font-size: 19px;
  line-height: 28px;
  color: #00A63E;
}

.addash-loc-total-period {
  margin: 0;
  font-weight: 400;
  font-size: 13px;
  line-height: 1.4;
  color: #6B7280;
}

/* ── Sections ──────────────────────────────────────────────── */

.addash-loc-mb-18 {
  margin-bottom: 12px;
}

.addash-loc-mt-12 {
  margin-top: 8px;
}

.addash-loc-p-25 {
  padding: 16px;
}

.addash-loc-p-5 {
  padding: 5px;
}

.addash-loc-gap-100 {
  gap: 100px;
}

.addash-loc-divider {
  width: 98%;
  height: 1.5px;
  margin: 0 auto;
}

/* ── Form controls ─────────────────────────────────────────── */

.addash-loc-text-input {
  width: 100%;
  height: 40px;
  padding: 0 13px;
}

.addash-loc-text-input::placeholder {
  color: #9ca3af;
}

/* Select prompt matches placeholder color - use addash-loc-select-placeholder on any select with prompt */
.addash-loc-select-placeholder:has(option[value=""]:checked) {
  color: #9ca3af;
}

.addash-loc-select-placeholder:not(:has(option[value=""]:checked)) {
  color: #374151;
}

.addash-loc-stepper-btn {
  padding: 1px 13px;
}

.addash-loc-stepper-input {
  width: 80px;
  height: 40px;
}

.addash-loc-checkbox {
  width: 14px;
  height: 16px;
}

/* ── Grid / columns ────────────────────────────────────────── */

.addash-loc-address-row {
  display: flex;
  width: 100%;
  gap: 20px;
  flex-direction: column;
}

@media (min-width: 768px) {
  .addash-loc-address-row {
    flex-direction: row;
  }
}

.addash-loc-col-30 {
  width: 30%;
}

.addash-loc-col-50 {
  flex: 0 0 100%;
}

.addash-loc-col-flex-1 {
  flex: 1;
}

@media (min-width: 768px) {
  .addash-loc-col-50 {
    flex: 0 0 50%;
  }
}

.addash-loc-field-group {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.addash-loc-features-grid {
  padding: 0 13px;
  column-gap: 50px;
}

/* ── Border styles ────────────────────────────────────────── */
.custom-dashed {
  background-image:
    repeating-linear-gradient(to right, #e2e5ec 0, #e2e5ec 12px, transparent 12px, transparent 20px),
    repeating-linear-gradient(to right, #e2e5ec 0, #e2e5ec 12px, transparent 12px, transparent 20px),
    repeating-linear-gradient(to bottom, #e2e5ec 0, #e2e5ec 12px, transparent 12px, transparent 20px),
    repeating-linear-gradient(to bottom, #e2e5ec 0, #e2e5ec 12px, transparent 12px, transparent 20px);
  background-size: 100% 1px, 100% 1px, 1px 100%, 1px 100%;
  background-position: 0 0, 0 100%, 0 0, 100% 0;
  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
}

/* ── Stepper field animation ────────────────────────────────── */

@keyframes addash-loc-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.addash-loc-field-fade-in {
  animation: addash-loc-fade-in 0.25s ease-out forwards;
}
/* Company History Side Panel Styles */
/* No Bootstrap - Pure CSS + Tailwind */

/* Ensure panel slides smoothly */
[data-washup-admin--company-history-modal-target="panel"] {
  transition: transform 300ms ease-in-out;
}

/* Header Container (Figma exact specs) */
.history-header-container {
  display: flex;
  width: 555.723px;
  justify-content: space-between;
  align-items: center;
}

/* Header Title (Figma exact specs) */
#history-title {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 26.036px;
  font-weight: 600;
  line-height: 36.451px;
  color: #212830;
  font-style: normal;
  margin-top: -5px;
}

/* Close Button (X) */
.history-close-button {
  width: 21px;
  height: 21px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: -7px;
}

/* Timeline Container */
.timeline-container {
  min-height: 400px;
}

/* Hide scrollbar but keep scrolling functionality */
.history-scroll-container {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}

.history-scroll-container::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

/* Filters Container */
.history-filters-container {
  margin-top: -16px;
  border-bottom: 1.302px solid #DCDCDC;
}

/* Filter Labels (Filter by Location & Filter by Type) */
.history-filter-label {
  color: #4A4A4A;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-weight: 500;
  line-height: 26.036px;
  font-style: normal;
}

/* Dropdown Button (Figma exact specs) */
.history-dropdown-button {
  display: flex !important;
  height: 52.072px !important;
  padding: 11.716px 16.936px 11.716px 16.923px !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-radius: 7.811px !important;
  border: 1.302px solid #E4E4E7 !important;
  background: #FFFFFF !important;
}

/* Dropdown Menu Container */
.custom-dropdown [data-custom-dropdown-target="menu"] {
  width: auto !important;
  min-width: 214.37px;
  white-space: nowrap;
  max-height: none !important;
  overflow: visible !important;
}

/* Dropdown Menu Options */
.history-dropdown-menu-option {
  display: flex;
  padding: 8.026px 28.98px;
  align-items: center;
  color: #000;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 18.327px;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  cursor: pointer;
  white-space: nowrap;
}

/* Dropdown Selected Text (All Locations & All Types) */
.history-dropdown-text {
  color: #141414;
  text-align: center;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-weight: 400;
  line-height: 26.036px;
  font-style: normal;
}

/* Sort Text */
.history-sort-text {
  color: #6B7280;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 18.746px;
  font-weight: 400;
  line-height: 31.489px;
  font-style: normal;
  margin-top: -10px;
  margin-bottom: -8px;
  display: block;
}

/* Day Separator */
.day-separator {
  user-select: none;
}

.day-separator span {
  white-space: nowrap;
  color: #374151;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 15.699px;
  font-weight: 600;
  line-height: 22.784px;
  font-style: normal;
  border-radius: 11390.687px;
  background: #F3F4F6;
}

/* Day Separator Horizontal Line */
.day-separator::before,
.day-separator::after {
  content: '';
  background: #E5E7EB;
  height: 1.139px;
  flex: 1 0 0;
}

/* Show More Separator */
.show-more-separator {
  display: flex;
  align-items: center;
  user-select: none;
}

.show-more-separator::before,
.show-more-separator::after {
  content: '';
  background: #E5E7EB;
  height: 1.139px;
  flex: 1 0 0;
}

.show-more-button {
  display: flex;
  padding: 0 14.129px;
  align-items: center;
  gap: 5.651px;
  color: #374151;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 15.45px;
  font-style: normal;
  font-weight: 400;
  line-height: 22.784px;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.show-more-button:hover {
  opacity: 0.7;
}

/* History Event Card */
.history-event {
  position: relative;
  padding-bottom: 16px;
  transition: transform 0.2s ease;
}

.history-event:hover .event-card {
  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-1px);
}

/* Event Card */
.event-card {
  background: #FFFFFF;
  border: 1.3px solid #E2E5EC;
  border-radius: 13px;
  padding: 19.5px 26px 17px 26px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease;
  animation: slideInRight 0.3s ease-out;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
}

/* Event Card Row (icon + title + badge) */
.event-card-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 15.62px;
  align-self: stretch;
}

.event-card-row .event-badge {
  margin-left: auto;
}

/* Event Body (attribution + description - below icon) */
.event-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0px 0px 2.6px 0px;
  gap: 6px;
  width: 100%;
}

/* Event Icon - Circular with Color Variants (Figma specs) */
.event-icon {
  width: 36px;
  height: 36px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 0px;
  border-radius: 16380500px;
  flex-shrink: 0;
  transition: all 0.2s ease;
}

/* Icon Color Variants (Figma Design) */
.event-icon.icon-blue {
  background: #EFF6FF;
  color: #0067B3;
}

.event-icon.icon-green {
  background: #DCFCE7;
  color: #059669;
}

.event-icon.icon-red {
  background: #FEF3F3;
  color: #DC2626;
}

.event-icon.icon-gray {
  background: #F3F4F6;
  color: #6B7280;
}

/* Icon Hover Effects */
.history-event:hover .event-icon.icon-blue {
  background: #CCE5FF;
  transform: scale(1.05);
}

.history-event:hover .event-icon.icon-green {
  background: #CCEFDB;
  transform: scale(1.05);
}

.history-event:hover .event-icon.icon-red {
  background: #FECACA;
  transform: scale(1.05);
}

.history-event:hover .event-icon.icon-gray {
  background: #E5E7EB;
  transform: scale(1.05);
}

/* Event Title (Figma specs) */
.event-title {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 20.829px;
  line-height: 28.64px;
  display: flex;
  align-items: center;
  color: #212830;
}

.event-card-row .event-title {
  flex: 1;
}

/* Event User Attribution (Figma specs) */
.event-user-attribution {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 17.574px;
  line-height: 20.829px;
  display: flex;
  align-items: center;
  color: #6E7985;
  align-self: stretch;
  flex: none;
  order: 0;
  flex-grow: 0;
}

/* Event Description */
.event-description {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 18.225px;
  line-height: 26.036px;
  color: #141414;
  width: 100%;
  align-self: stretch;
  font-style: normal;
}

.event-description strong,
.event-description b {
  font-weight: 700 !important;
}

.event-description div {
  margin: 0;
}

.event-description p {
  margin: 0 0 4px 0;
}

.event-description p:last-child {
  margin-bottom: 0;
}

/* Features Active Line */
.features-active-line {
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 18.225px;
  line-height: 26.036px;
  color: #141414;
}

/* Location Added Features Wrapper */
.location-added-features-wrapper {
  width: 100%;
}

/* Location Added Features Header */
.location-added-features-header {
  color: #141414;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-style: normal;
  font-weight: 600;
  line-height: 22.606px;
  padding-top: 2px;
  padding-bottom: 6px;
  display: block;
}

/* Location Added Description */
.event-description.location-added-description {
  margin-bottom: 0;
}

/* Location Added User Attribution Spacing */
.event-body .event-user-attribution + .location-added-description {
  margin-top: 6px;
}

/* Location Added Text */
.location-added-text {
  display: block;
  padding-bottom: 6px;
}

/* Location Added Features Wrapper */
.location-added-features-wrapper {
  margin-bottom: -4px;
}

/* Feature Columns Layout */
.feature-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding-top: 6px;
  width: 100%;
}

.feature-column-wrapper {
  display: flex;
  flex-direction: column;
  gap: 6.42px;
}

.feature-column-title {
  align-self: stretch;
  color: #141414;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-style: normal;
  font-weight: 600;
  line-height: 22.606px;
  margin: 0;
}

.feature-column {
  background: #F5F5F5;
  padding: 8px 12px 12px 12px;
  border-radius: 4.71px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.feature-item {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #141414;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-style: normal;
  font-weight: 400;
  line-height: 22.606px;
}

/* Colored Bullet Points for Features (circular with background) */
.feature-bullet {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  margin-right: 8px;
  flex-shrink: 0;
}

.feature-bullet-green {
  background-color: #44D350;
}

.feature-bullet-gray {
  background-color: #CBCBCB;
}

.feature-bullet-red {
  background-color: #FF3D3D;
}

/* Event Badge (Location Name) */
.event-badge {
  display: inline-block;
  padding: 4px 14px;
  background: #F8F8F8;
  color: #535353;
  border: 1px solid #EAEAEA;
  border-radius: 12348px;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 14.819px;
  font-weight: 600;
  line-height: 19.759px;
  font-style: normal;
  white-space: nowrap;
}

/* Card Animation */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Responsive Design */
@media (max-width: 768px) {
  [data-washup-admin--company-history-modal-target="panel"] {
    width: 100% !important;
  }

  .day-separator span {
    padding: 6px 12px;
    font-size: 13px;
  }
}

/* Custom Dropdown Styles */
.custom-dropdown-option {
  transition: background-color 0.15s ease;
}

.custom-dropdown-option:not(.selected):hover {
  background-color: #F3F4F6;
}

.custom-dropdown-option.selected {
  background-color: #6B7280;
  color: white;
}

/* Stripe ID Update Layout */
.stripe-id-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-top: 5px;
  width: 100%;
}

.stripe-id-group {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.stripe-id-label {
  color: #141414;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 15.4px;
  font-style: normal;
  font-weight: 600;
  line-height: 26.036px;
}

.stripe-id-box {
  display: flex;
  padding: 9.419px 14.129px;
  flex-direction: column;
  align-items: flex-start;
  gap: 9.419px;
  align-self: stretch;
  border-radius: 4.71px;
  background: #F5F5F5;
}

.stripe-id-value {
  color: #141414;
  font-family: 'Geist', system-ui, -apple-system, sans-serif;
  font-size: 18.225px;
  font-style: normal;
  font-weight: 400;
  line-height: 22.606px;
  word-break: break-all;
}

/* Print Styles */
@media print {
  [data-washup-admin--company-history-modal-target="overlay"] {
    position: static !important;
    background: transparent !important;
  }

  [data-washup-admin--company-history-modal-target="panel"] {
    position: static !important;
    transform: none !important;
    width: 100% !important;
  }

  button {
    display: none !important;
  }

  .event-card {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
  }
}
/* ── Sections ──────────────────────────────────────────────── */

.addash-com-w-220{
    width: 220px;
}

.addash-com-p-5{
  padding: 5px;
}

.addash-com-dialog-container{
  padding: 28px;
  width: 400px;
  background-color: #fff;
  gap: 18px;
  border-radius: 10px;
}

.addash-com-bg-opacity-50{
  background-color: rgba(0, 0, 0, 0.8);
  transition: background-color 1s ease;
}

.addash-com-bg-green{
  background-color: #00BD13;
  color: #fff;
}

/* modal profile picture */
.addash-loc-modal-profile-picture {
  width: 280px;
  height: 280px;
  border-radius: calc(infinity * 1px);
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px solid #0067B3;
}

/* profile picture  */
.addash-loc-profile-picture {
  width: 94px;
  height: 94px;
  border: 2px solid #0067B3;
}
/* WashUp Admin – Settings styles
   Prefix: addash-set-
   Extracted from inline styles in washup_admin/settings views */

.addash-set-w-15-percent {
  width: 15%;
}

/* ── Menu / Nav ────────────────────────────────────────────── */

/* Card fills parent height (Tailwind h-full equivalent) */
.addash-set-menu {
  height: 100%;
}

.addash-set-form-background {
  background-color: #F9FAFB;
  border-radius: 4px;
  border: 1px solid #F3F4F6;
}

.addash-set-nav-item {
  padding-top: 13px;
  padding-bottom: 13px;
  height: 100% !important;
}

.addash-set-borderless-icon {
  border: none !important;
}

.addash-set-material-icons {
  vertical-align: middle;
}

/* ── Active nav link (light skin) ───────────────────────────── */

[data-skin=light] .addash-set-menu .nav-link.active {
  color: #0067B3 !important;
  background: #EFF6FF !important;
}

/* ── Active nav link (dark skin) ───────────────────────────── */

[data-skin=dark] .addash-set-menu .nav-link.active {
  color: white !important;
  background: #222222 !important;
}

/* ── Active nav link icons ─────────────────────────────────── */

.addash-set-menu .nav-link.active i,
.addash-set-menu .nav-link.active svg {
  color: #0067B3 !important;
}
.addash-audit-th {
  text-align: left;
  padding: 4px 8px;
  font-size: 14px;
  font-weight: normal;
  color: #4B5563;
}

.addash-audit-blue-text {
  color: #0067B3;
}
/* ══════════════════════════════════════════════════════════════════════════════
   WashUp Admin - ViewComponents Styles

   Global styles for reusable ViewComponents in WashupAdmin namespace.
   Organized by Atomic Design: Atoms → Molecules → Organisms
   ══════════════════════════════════════════════════════════════════════════════ */

/* ── Atoms ──────────────────────────────────────────────────────────────────── */

/* Search Bar Component
   Source: app/components/atoms/search_bar_component.rb
   Figma: height: 36px, border-radius: 12px, border: 1px solid #E2E5EC
   ────────────────────────────────────────────────────────────────────────── */
.search-bar-input {
  height: 36px;
  border-radius: 12px;
  border: 1px solid #E2E5EC;
  background: #FFF;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  padding-left: 40px;
  padding-right: 12px;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #737373;
  line-height: normal;
}

.search-bar-input::placeholder {
  color: #737373;
}

.search-bar-input:focus {
  outline: none;
  border-color: #3B82F6;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
}

.search-bar-icon {
  position: absolute;
  left: 12px;
  top: 10px;
  width: 16px;
  height: 16px;
  color: #9CA3AF;
  pointer-events: none;
}

.search-bar-input--loading {
  padding-right: 36px;
  cursor: wait;
}

/* Inline Spinner Atom
   Source: app/components/atoms/inline_spinner_component.rb
   Modifier --input-suffix: absolutely positioned at end of a relatively positioned control (e.g. search bar). */
.inline-spinner {
  pointer-events: none;
}

.inline-spinner--input-suffix {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
}

.inline-spinner__ring {
  display: block;
  width: 16px;
  height: 16px;
  border: 2px solid #E2E5EC;
  border-top-color: #3B82F6;
  border-radius: 50%;
  animation: inline-spinner-spin 0.65s linear infinite;
}

@keyframes inline-spinner-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Status Badge Component
   Source: app/components/atoms/status_badge_component.rb
   Figma: min-width: 80px, padding: 3px 9px, border-radius via Tailwind rounded-full
   Note: Width is auto to accommodate longer text like "Deactivated"
   ────────────────────────────────────────────────────────────────────────── */
.status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-width: 80px;
  padding: 3px 9px;
  border-radius: 8px !important;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  white-space: nowrap;
}

.status-badge--active {
  background: #DCFCE7;
  color: #166534;
}

.status-badge--deactivated {
  background: #FEE2E2;
  color: #991B1B;
}

/* Back Button Component
   Source: app/components/atoms/back_button_component.rb
   Figma: width: 31px, height: 32.34px, border: 1px solid #6E7985
   ────────────────────────────────────────────────────────────────────────── */
.back-button {
  width: 31px;
  height: 32.34px;
  padding: 6.339px 4.675px 5.001px 5px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 1px solid #6E7985;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.back-button:hover {
  opacity: 0.8;
}

.back-button:focus {
  outline: none;
}

/* Flash Notification Component
   Source: app/components/atoms/flash_notification_component.rb
   Stimulus: flash controller handles auto-dismiss
   ────────────────────────────────────────────────────────────────────────── */
.flash-dismiss-btn {
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  margin-left: 8px;
  transition: opacity 0.2s ease;
  box-shadow: none !important;
}

.flash-dismiss-btn:hover {
  opacity: 0.6;
  background: transparent !important;
}

.flash-dismiss-btn:focus {
  outline: none;
}

/* ── Molecules ──────────────────────────────────────────────────────────────── */

/* Actions Dropdown Component
   Source: app/components/molecules/actions_dropdown_component.rb
   Figma: min-width: 128px, padding: 5px, border-radius: 6px
   ────────────────────────────────────────────────────────────────────────── */
.actions-dropdown-button {
  display: inline-flex;
  align-items: center;
  height: 37.667px;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid #E4E4E7;
  border-radius: 8px;
  background: #FFF;
  cursor: pointer;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #212830;
  transition: background-color 0.2s ease;
}

.actions-dropdown-button:hover {
  background-color: #F5F5F5;
}

.actions-dropdown-menu {
  position: absolute;
  right: 0;
  top: 100%;
  margin-top: 4px;
  min-width: 200px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #E4E4E7;
  border-radius: 6px;
  background: #FFF;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
  z-index: 10;
  overflow: hidden;
}

.actions-dropdown-menu.hidden {
  display: none;
}

.actions-dropdown-item {
  display: flex;
  padding: 8px 12px;
  align-items: center;
  align-self: stretch;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #09090B;
  border-radius: 0;
  transition: background-color 0.15s ease;
  white-space: nowrap;
}

.actions-dropdown-item:hover {
  background-color: #F9FAFB;
}

.actions-dropdown-item--red {
  color: #DC2626;
}

.actions-dropdown-item--green {
  color: #16A34A;
}

.actions-dropdown-item-content {
  display: flex;
  align-items: center;
  gap: 8px;
}

/* Tabs Component
   Source: app/components/molecules/tabs_component.rb
   Figma: padding: 12px 24px 14px 24px, border-bottom: 2px solid #0067B3
   ────────────────────────────────────────────────────────────────────────── */
.tabs-nav {
  display: flex;
  gap: 0;
  border-bottom: 1px solid #E2E5EC;
  background: #FFF;
}

.tabs-button {
  display: flex;
  padding: 12px 24px 14px 24px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: none;
  background: transparent;
  cursor: pointer;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: #6E7985;
  border-bottom: 2px solid transparent;
  margin-right: 8px;
  transition: all 0.2s ease;
}

.tabs-button:hover {
  color: #212830;
}

.tabs-button--active {
  color: #0067B3;
  border-bottom-color: #0067B3;
}

.tabs-panel {
  padding: 24px;
}

.tabs-panel.hidden {
  display: none;
}

/* User Menu Dropdown Component
   Source: app/components/molecules/user_menu_dropdown_component.rb
   Stimulus: washup-admin--user-menu (handles toggle, click outside, escape)
   Note: Global molecule - reusable across all modules (WashupAdmin, user dashboard, mobile)
   ────────────────────────────────────────────────────────────────────────── */
.user-menu-dropdown {
  width: 100%;
  background-color: #FFF;
}

.user-menu-toggle {
  display: flex;
  align-items: center;
  padding: 15px 12px 15px 15px;
  background-color: #FFF;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.user-menu-toggle:hover {
  background-color: #F9F9F9;
}

.user-menu-avatar-wrapper {
  margin-right: 10px;
  flex-shrink: 0;
}

.user-menu-avatar-img {
  width: 36px;
  height: 36px;
  border-radius: 36px;
  object-fit: cover;
}

.user-menu-avatar-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 36px;
  background-color: #6E7985;
  color: #FFF;
  font-family: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 36px;
  text-align: center;
  text-transform: uppercase;
}

.user-menu-details {
  flex: 1;
  min-width: 0;
}

.user-menu-name {
  margin: 0;
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #222;
  line-height: 16.8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-menu-company {
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #41505F;
  line-height: 21px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

.user-menu-chevron {
  margin-left: 8px;
  transition: transform 0.2s ease;
  display: flex;
  align-items: center;
}

.user-menu-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  color: #41505F;
}

.user-menu-dropdown-menu {
  display: none;
  background-color: #FFF;
  border-top: 1px solid #E2E5EC;
  padding: 8px 15px 8px 15px;
}

.user-menu-nav {
  display: flex;
  flex-direction: column;
}

.user-menu-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  color: #41505F;
  line-height: 21px;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.user-menu-link:hover {
  opacity: 0.7;
}

.user-menu-separator {
  margin: 8px 11px 8px 11px;
  border: none;
  border-top: 2px solid #E2E5EC;
  background: #FFF;
}

/* ── Table Row Company (Molecule) ───────────────────────────────────────────── */

.table-row-company {
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.table-row-company:hover {
  opacity: 0.9;
}

.table-cell {
  padding: 16.75px 16px 12px 24px;
  background: #F8F9FC;
  color: #6E7985;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  border-top: 1px solid #D1D5DB;
  border-bottom: 1px solid #D1D5DB;
  text-align: left;
}

.table-cell:first-child {
  border-left: 1px solid #D1D5DB;
  border-radius: 5px 0 0 5px;
  color: #212830;
}

.table-cell:last-child {
  border-right: 1px solid #D1D5DB;
  border-radius: 0 5px 5px 0;
}

.table-cell-data {
  font-weight: 400;
  color: #6E7985;
}

/* ── Dashboard Table (Organism) ─────────────────────────────────────────────── */

.dashboard-table-container {
  width: 100%;
}

.dashboard-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 0.75rem;
}

.dashboard-table-pagination {
  padding: 16px 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
}

/* ── Organisms ──────────────────────────────────────────────────────────────── */

/* Dashboard Page Heading
   Source: app/views/washup_admin/dashboard/index.html.erb
   Figma: font-size: 26.4px, font-weight: 700, color: #212830, line-height: 36.477px
   ────────────────────────────────────────────────────────────────────────── */
.dashboard-page-heading {
  font-size: 26.4px;
  font-weight: 700;
  color: #212830;
  line-height: 36.477px;
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── Primary Button Component ─────────────────────────────────────────────── */

.primary-button {
  display: flex;
  height: 37.667px;
  padding: 9.417px 13.602px;
  justify-content: center;
  align-items: center;
  gap: 8.37px;
  border-radius: 8.37px;
  border: 1.046px solid #E2E5EC;
  background: #0067B3;
  box-shadow: 0 1.046px 2.093px 0 rgba(0, 0, 0, 0.05);
  cursor: pointer;
  transition: background-color 0.2s ease;
  color: #FFF;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14.648px;
  font-weight: 500;
  line-height: 20.926px;
  text-decoration: none;
}

.primary-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.primary-button-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16.741px;
  height: 16.741px;
  flex-shrink: 0;
  color: white;
}

/* ── Card Component ───────────────────────────────────────────────────────── */

.card-container {
  border-radius: 14px;
  border: 1px solid #E2E5EC;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

/* ── Sidebar Navigation Component ────────────────────────────────────────── */

.sidebar-container {
  display: flex;
  width: 250px;
  height: 100vh;
  flex-direction: column;
  align-items: flex-start;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 40;
  background: #FFF;
  box-shadow: 1px 0 1px 0 rgba(33, 40, 48, 0.01), 4px 0 4px 0 rgba(33, 40, 48, 0.01), 16px 0 16px 0 rgba(33, 40, 48, 0.01);
}

.sidebar-nav-wrapper {
  flex: 1;
  overflow-y: auto;
  min-height: 0;
  align-self: stretch;
}

.sidebar-nav-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-user-menu {
  flex-shrink: 0;
  margin-top: auto;
  align-self: stretch;
}

.sidebar-nav-item-link {
  display: flex;
  padding: 16px 20px;
  align-items: center;
  gap: 12px;
  align-self: stretch;
  color: #6E7985;
  text-decoration: none;
  transition: background-color 0.2s ease;
  font-family: Helvetica, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: -0.1px;
}

.sidebar-nav-item-link--active {
  background-color: #0067B3;
  color: #FFF;
}

.sidebar-nav-item-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.sidebar-logo-container {
  display: flex;
  height: 72px;
  padding: 0 20px 1px 20px;
  align-items: center;
  flex-shrink: 0;
  align-self: stretch;
}

.sidebar-logo-link {
  display: block;
}

.sidebar-logo-img {
  width: 168px;
  height: 42px;
}

/* ── TopBar Component ───────────────────────────────────────────────────── */

.topbar-container {
  display: flex;
  height: 72px;
  padding: 0 23px;
  align-items: center;
  position: fixed;
  top: 0;
  left: 250px;
  right: 0;
  z-index: 50;
  border-bottom: 1px solid #F8F9FC;
  border-left: 1px solid #F8F9FC;
  background: #FFF;
  box-shadow: 0 1px 1px 0 rgba(33, 40, 48, 0.01), 0 4px 4px 0 rgba(33, 40, 48, 0.01), 0 16px 16px 0 rgba(33, 40, 48, 0.01);
}

.topbar-hamburger {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: none;
  background: transparent;
  cursor: pointer;
  color: #6E7985;
  transition: color 0.2s ease;
}

/* ── Sidebar Collapsed State ────────────────────────────────────────────── */

.sidebar-container,
.topbar-container,
.admin-main-content {
  transition: transform 0.3s ease, left 0.3s ease, margin-left 0.3s ease;
}

[data-controller~="washup-admin--sidebar"].sidebar-collapsed .topbar-container {
  left: 0;
}

@media (min-width: 1024px) {
  [data-controller~="washup-admin--sidebar"].sidebar-collapsed .admin-main-content {
    margin-left: 0;
  }
}

.topbar-hamburger-icon {
  font-family: 'Material Icons';
  font-size: 24px;
  font-weight: 400;
  line-height: 24px;
  user-select: none;
}

/* ── General Stat Card Component ────────────────────────────────────────── */

.stat-card-content {
  display: flex;
  padding: 24px;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  align-self: stretch;
}

.stat-card-header {
  display: flex;
  align-items: center;
  gap: 16px;
}

.stat-card-icon {
  color: #6E7985;
}

.stat-card-title {
  color: #6E7985;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.stat-card-value-container {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  align-self: stretch;
}

.stat-card-value {
  color: #212830;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
}

.stat-card-label {
  color: #6E7985;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.stat-card-change {
  display: flex;
  gap: 8px;
  align-items: center;
}

.stat-card-change-value {
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.stat-card-change-period {
  color: #6E7985;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

/* ── Card Component ───────────────────────────────────────────────────── */

.card {
  border-radius: 14px;
  /* Sync Bootstrap's inner radius so .card-header:first-child clips to the outer corners. */
  --bs-card-inner-border-radius: 13px;
  border: 1px solid #E2E5EC;
  background: #FFF;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
}

.card-header {
  padding: 16px 24px;
  border-bottom: 1px solid #E2E5EC;
}

.card-title {
  margin: 0;
  color: #212830;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
}

/* ── Company Summary Header Component ────────────────────────────────────── */

.company-summary-header {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 25.15px;
  align-self: stretch;
  margin-bottom: 25.15px;
}

.company-summary-back-link {
  display: flex;
  height: 36px;
  padding: 0 12px;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.company-summary-back-button {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #6E7985;
  transition: opacity 0.2s ease;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}

.company-summary-back-icon {
  flex-shrink: 0;
}

.company-summary-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  gap: 24px;
}

.company-summary-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1;
}

.company-summary-title {
  color: #212830;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 30px;
  font-weight: 700;
  line-height: 36px;
  margin: 0;
}

.company-summary-meta {
  display: flex;
  align-items: center;
  gap: 20px;
}

.company-summary-date {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6E7985;
  font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.company-summary-date-icon {
  flex-shrink: 0;
}

.company-summary-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}

.company-summary-actions > form {
  display: contents;
}

/* (Add organism component styles here as we create them) */
/* Spacing between location address details and plan configuration */
.plan-config-divider {
  margin-top: 12px;
  margin-bottom: 12px;
}
/* ==========================================================================
   Task Library Empty State
   Tokens from WashUp Style Guide (Downloads/Test/Style Guide.html)
   ========================================================================== */

/* Outer container */
.task-library-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px;
  border-radius: 4px;
  border: 1px solid #E2E5EC;
  background: #FFF;
  width: 100%;
}

/* Inner dashed container */
.task-library-empty-state .empty-state-inner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 22.446px;
  width: 100%;
  min-height: 547px;
  padding: 41px 31px;
  border-radius: 7.482px;
  border: 2px dashed #D1D5DB;
  background: #F9FAFB;
  text-align: center;
}

/* Icon circle */
.task-library-empty-state .empty-state-icon-wrapper {
  display: flex;
  justify-content: center;
}

.task-library-empty-state .empty-state-icon-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background-color: #ffffff;
  border: 1px solid #e5e9f0;
  border-radius: 50%;
}

/* Title */
.task-library-empty-state .empty-state-title {
  color: #000;
  text-align: center;
  font-size: 18px;
  font-weight: 500;
  line-height: 26.187px;
  margin: 0;
}

/* Description */
.task-library-empty-state .empty-state-body {
  color: #4B5563;
  text-align: center;
  font-size: 14.964px;
  font-weight: 400;
  line-height: 22.446px;
  max-width: 800px;
  margin: 0;
}

/* Action cards grid */
.task-library-empty-state .action-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  max-width: 720px;
  width: 100%;
}

@media (max-width: 576px) {
  .task-library-empty-state .action-grid {
    grid-template-columns: 1fr;
    max-width: 360px;
  }
}

.task-library-empty-state .action-card {
  background: #ffffff;
  border: 1px solid #E2E5EC;
  border-radius: 8px;
  padding: 20px 16px;
  text-align: center;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  font-family: inherit;
  width: 100%;
}

.task-library-empty-state .action-card:hover {
  border-color: #1864ab;
  box-shadow: 0 0 0 3px #e7f0f7;
}

.task-library-empty-state .action-card-icon {
  display: flex;
  justify-content: center;
  color: #1864ab;
  margin-bottom: 10px;
}

/* Card label (Create List, Bulk Import, etc.) */
.task-library-empty-state .action-card-title {
  color: #000;
  text-align: center;
  font-size: 13.094px;
  font-weight: 500;
  line-height: 22.994px;
  margin-bottom: 2px;
}

/* Card subtitle (Add tasks one at a time, etc.) */
.task-library-empty-state .action-card-body {
  color: #6B7280;
  text-align: center;
  font-size: 11.223px;
  font-weight: 500;
  line-height: 16.509px;
}

/* Pro tips */
.task-library-empty-state .tips {
  padding-top: 24px;
  border-top: 1px solid #E2E5EC;
  text-align: left;
  max-width: 720px;
  width: 100%;
}

.task-library-empty-state .tip {
  display: flex;
  gap: 12px;
  padding: 4px 0;
  color: #4B5563;
  font-size: 12px;
  font-weight: 400;
  line-height: 22.446px;
}

.task-library-empty-state .tip svg {
  flex-shrink: 0;
  color: #6b7280;
  margin-top: 3px;
}

/* ── Quick complete (tasks--quick-complete) ─────────────────────────────────
   A completion the user tapped that hasn't reached the server yet — offline or
   a flaky connection. The optimistic state is deliberately kept (the controller
   retries on reconnect and on each idle sweep), so the row is flagged rather
   than reverted out from under the user. */
.task-quick-complete-unsynced {
  border-left: 3px solid #f59e0b !important;
}

.task-quick-complete-unsynced .task-btn {
  opacity: 0.6;
}

[data-skin=dark] .task-quick-complete-unsynced {
  border-left-color: #fbbf24 !important;
}

/* ── Task list nav dropdown (task_lists/_task_list_navigation) ──────────────
   Full width on mobile so the trigger is an easy tap target; a compact,
   left-aligned width from the sm breakpoint up so it doesn't stretch across
   the whole card on tablet/desktop. */
.task-list-nav-dropdown {
  width: 100%;
}

@media (min-width: 576px) {
  .task-list-nav-dropdown {
    width: 280px;
  }
}
/* ============================================================================
   Inspections landing page redesign
   US-1.1 — Left sidebar navigation (ViewComponent-based)

   Styled for main-app visual consistency (Bootstrap / Inspections / Tasks /
   Services), per CLAUDE.md: #dee2e6 borders, 0.375rem radius, 1rem/0.875rem
   typography. Not the washup_admin dashboard inline-style look.
   ============================================================================ */

.inspections-layout {
    display: flex;
    align-items: stretch;
    gap: 1rem;
    padding: 0 1rem;
}

/* Top toolbar (search on the left, future actions on the right) sits ABOVE the
   sidebar + content row, spanning the full width like the mockup. */
.inspections-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1rem 1rem 0.75rem;
}

/* Sidebar stays fixed in view while the content area scrolls with the page. */
.inspections-sidebar {
    width: 240px;
    flex-shrink: 0;
    padding: 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    position: sticky;
    /* Sit below the fixed 72px app navbar (.header-main) so the sidebar stays
       visible while scrolling instead of being covered by it. */
    top: calc(72px + 1rem);
    align-self: flex-start;
    max-height: calc(100vh - 72px - 2rem);
    overflow-y: auto;
}

.inspections-content {
    flex: 1 1 auto;
    min-width: 0;
}

/* Thin separator between "All Attention Items" and the bay list (matches mockup). */
.inspections-sidebar-divider {
    margin: 0.5rem 0;
    border: 0;
    border-top: 1px solid #e5e7eb;
    opacity: 1;
}

.inspections-sidebar-heading {
    margin: 0.5rem 0 0.25rem;
    padding: 0 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #adb5bd;
}

.inspections-sidebar-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.125rem;
    border-radius: 0.375rem;
    color: #374151;
    font-size: 0.875rem;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.inspections-sidebar-item-label {
    flex: 1 1 auto;
    min-width: 0;
}

/* Red count pill next to "All Attention Items". */
.inspections-attention-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    height: 1.25rem;
    padding: 0 0.375rem;
    border-radius: 0.625rem;
    background-color: #dc3545;
    color: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
}

.inspections-attention-badge[hidden] {
    display: none;
}

/* ----------------------------------------------------------------------------
   All Attention Items — search bar (client-side filter)
   ---------------------------------------------------------------------------- */
.inspections-search-bar {
    position: relative;
    flex: 1 1 240px;
    max-width: 360px;
}

/* Right-aligned toolbar actions (Hide Details, Filters). */
.inspections-toolbar-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Mobile: "Hide Linked Tasks" / "Hide Details" / "Filters" drop their text
   label (kept for md+ via d-none d-md-inline in the markup) and shrink to
   square icon buttons so the whole action row — including the still-labeled
   "See Resolved History" — fits on one line, per design. */
@media (max-width: 767.98px) {
    .inspections-toolbar-btn-icon-only {
        padding: 0.5rem 0.625rem;
    }
}

/* Header row (title + primary action) wraps instead of squeezing the title
   into multiple lines when there isn't room for both on one line. */
@media (max-width: 767.98px) {
    .inspections-page-header {
        flex-wrap: wrap;
        row-gap: 0.5rem;
    }
}

/* ----------------------------------------------------------------------------
   Today's Inspections (linked tasks) section
   ---------------------------------------------------------------------------- */
.linked-tasks {
    margin: 0 1rem 1.25rem;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background-color: #fff;
    overflow: hidden;
}

.linked-tasks-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 100%;
    padding: 0.875rem 1rem;
    background-color: #f8f9fc;
    border: none;
    text-align: left;
}

.linked-tasks-heading {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
}

.linked-tasks-eyebrow {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #0067b3;
}

.linked-tasks-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212529;
}

.linked-tasks-progress {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: auto;
}

.linked-tasks-progress-track {
    width: 90px;
    height: 6px;
    border-radius: 9999px;
    background-color: #e9ecef;
    overflow: hidden;
}

.linked-tasks-progress-fill {
    display: block;
    height: 100%;
    background-color: #28a745;
    border-radius: 9999px;
}

.linked-tasks-progress-label {
    font-size: 0.8125rem;
    color: #6c757d;
    white-space: nowrap;
}

.linked-tasks-chevron {
    display: inline-flex;
    color: #6c757d;
    transition: transform 0.2s ease;
}

.linked-tasks-header[aria-expanded="true"] .linked-tasks-chevron {
    transform: rotate(-180deg);
}

.linked-tasks-rows {
    border-top: 1px solid #eef0f2;
}

.linked-task-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #eef0f2;
}

.linked-task-status {
    flex-shrink: 0;
    display: inline-flex;
    color: #adb5bd;
}

.linked-task-status--completed {
    color: #28a745;
}

.linked-task-status--not-ready {
    color: #adb5bd;
}

.linked-task-main {
    flex: 1 1 auto;
    min-width: 0;
}

.linked-task-name {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212529;
}

.linked-task-subtitle {
    margin: 0;
    font-size: 0.8125rem;
    color: #6c757d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.linked-task-meta {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.linked-task-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-width: 7.5rem;
    padding: 0.25rem 0.7rem;
    border-radius: 9999px;
    border: 1px solid transparent;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
    color: #212529;
}

.linked-task-badge-icon {
    display: inline-flex;
    align-items: center;
}

.linked-task-badge--past-due {
    background-color: #f08a8a;
    border-color: #e07070;
}

.linked-task-badge--in-window {
    background-color: #fbeb95;
    border-color: #efd96f;
}

.linked-task-badge--not-ready {
    background-color: #cbccce;
    border-color: #b3b5b8;
}

.linked-task-badge--completed {
    background-color: #76d27a;
    border-color: #58bf5d;
}

.linked-task-avatar {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #e9ecef;
}

.linked-task-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 86e38wwrc: the wrapper's #e9ecef is the ground for the initials, not for a photo — a
       transparent PNG showed it through. */
    background: #fff;
}

.linked-task-avatar-initials {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #495057;
}

.linked-tasks-help {
    margin: 0;
    padding: 0.75rem 1rem 0.875rem;
    font-size: 0.8125rem;
    color: #6c757d;
    background-color: #f8f9fc;
    border-top: 1px solid #eef0f2;
}

/* Start Inspection / View Details: white, outlined, dark text (per mockup).
   Fixed min-width so both buttons render the same size. */
.linked-task-meta .btn {
    min-width: 8.75rem;
}

.linked-task-meta .btn[disabled] {
    opacity: 0.5;
}

/* Mobile (<576px, ticket 86e28uyvz): .linked-tasks carries its OWN 1rem side
   margin on top of .inspections-layout's 1rem padding — fine on desktop, where
   .attention-card does the same, but on mobile the attention cards switch to
   .mobile-service-card (no side margin of its own), so this section ended up
   narrower than the surrounding cards. Drop the side margin here to match. */
@media (max-width: 575.98px) {
    .linked-tasks {
        margin-left: 0;
        margin-right: 0;
    }
}

/* Mobile header: icon badge + stacked heading, with the progress bar/count/
   chevron on their own full-width row (see linked-tasks-mobile markup). */
.linked-tasks-mobile {
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
}

.linked-tasks-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #e7f1ff;
    color: #0067b3;
}

.linked-tasks-mobile-body {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1 1 auto;
    min-width: 0;
}

.linked-tasks-mobile-body .linked-tasks-progress {
    width: 100%;
    margin-left: 0;
}

.linked-tasks-mobile-body .linked-tasks-progress-track {
    flex: 1 1 auto;
    width: auto;
}

/* Mobile task rows: icon + name + action on one line, badge + due-by/bay on
   the next (smaller text), replacing the desktop .linked-task-row layout. */
.linked-task-row-mobile {
    flex-direction: column;
    gap: 0.35rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #eef0f2;
}

.linked-task-row-mobile:last-child {
    border-bottom: 0;
}

.linked-task-row-mobile-top {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.linked-task-row-mobile-top .linked-task-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.9375rem;
}

.linked-task-row-mobile-top .btn {
    flex-shrink: 0;
}

.linked-task-row-mobile-bottom {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding-left: calc(20px + 0.5rem);
    font-size: 0.75rem;
    color: #6c757d;
}

.linked-task-row-mobile-bottom .linked-task-badge {
    flex-shrink: 0;
    min-width: 0;
    font-size: 0.6875rem;
    padding: 0.15rem 0.5rem;
}

.linked-task-row-mobile-bottom .linked-task-subtitle {
    font-size: 0.75rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[data-skin=dark] .linked-tasks-icon {
    background-color: #2a2a2a;
    color: #4da3ff;
}

[data-skin=dark] .linked-task-row-mobile {
    border-color: #333;
}

[data-skin=dark] .linked-task-row-mobile-bottom {
    color: #adb5bd;
}

[data-skin=dark] .linked-tasks {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .linked-tasks-header,
[data-skin=dark] .linked-tasks-help {
    background-color: #141414;
}

[data-skin=dark] .linked-tasks-title,
[data-skin=dark] .linked-task-name {
    color: #e9ecef;
}

[data-skin=dark] .linked-tasks-rows,
[data-skin=dark] .linked-task-row {
    border-color: #333;
}

/* ----------------------------------------------------------------------------
   All Attention Items — active filter chips
   ---------------------------------------------------------------------------- */
.inspections-filter-chips {
    padding: 0 1rem 0.75rem;
    justify-content: flex-end;
}

.inspections-filter-chip {
    font-size: 0.8125rem;
    background-color: #eff6ff;
    border: 1px solid #cee3ff;
    border-radius: 9999px;
    padding: 0.25rem 0.75rem 0.25rem 1.5rem;
}

.inspections-filter-chip:hover {
    background-color: #dbeafe;
}

.inspections-filter-chip-icon {
    font-size: 0.875rem;
    color: #0067b3;
    margin-right: 0.25rem;
}

.inspections-filter-chip-label {
    color: #64748b;
}

.inspections-filter-chip-value {
    color: #1e293b;
    font-weight: 600;
}

.inspections-filter-chip-close {
    position: absolute;
    top: -6px;
    left: -6px;
    text-decoration: none;
    line-height: 1;
}

.inspections-filter-chip-close i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    font-size: 0.75rem;
    color: #212529;
    background-color: #fff;
    border: 1px solid #212529;
    border-radius: 50%;
}

.inspections-filter-chip-close:hover i {
    color: #0067b3;
    border-color: #0067b3;
}

/* ----------------------------------------------------------------------------
   Filters & Sort slide-out panel
   ---------------------------------------------------------------------------- */
.inspections-filters-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.inspections-filters-overlay.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.inspections-filters-panel {
    position: fixed;
    top: 0;
    bottom: 0;
    right: -400px;
    width: 400px;
    max-width: 100%;
    background: #fff;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
    z-index: 1050;
    transition: right 0.3s ease;
    display: flex;
    flex-direction: column;
}

.inspections-filters-panel.show {
    right: 0;
}

body.inspections-filters-open {
    overflow: hidden;
}

.inspections-filters-header {
    padding: 1.25rem 1rem;
    border-bottom: 1px solid #dee2e6;
    background-color: #f8f9fc;
    flex-shrink: 0;
}

.inspections-filters-header h5 {
    font-size: 1rem;
    color: #212529;
}

/* The form wraps both the scrollable content and the footer, so it must fill
   the panel and lay them out as a column — otherwise the footer floats up and
   leaves dead space at the bottom. */
#inspections-filters-form,
#inspections-resolved-filters-form,
#inspection-runs-filters-form {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.inspections-filters-content {
    flex: 1;
    overflow-y: auto;
    padding: 1rem;
}

.inspections-filters-section {
    margin-bottom: 1.25rem;
}

.inspections-filters-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    margin-bottom: 0.5rem;
}

.inspections-filters-quick-actions {
    display: flex;
    flex-direction: row;
    gap: 0.5rem;
}

.inspections-quick-action-btn {
    flex: 1 1 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #212529;
    font-size: 0.875rem;
    font-weight: 600;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.inspections-quick-action-btn:hover {
    background-color: #f8f9fa;
}

.inspections-quick-action-btn.active,
.inspections-quick-action-btn.active i {
    background-color: #0067b3;
    color: #fff;
    border-color: #0067b3;
}

.inspections-filters-footer {
    padding: 1rem;
    border-top: 1px solid #dee2e6;
    background-color: #f8f9fc;
    flex-shrink: 0;
}

.inspections-filters-clear {
    font-size: 0.875rem;
    color: #374151;
    text-decoration: none;
}

.inspections-filters-clear:hover {
    color: #0067b3;
    text-decoration: underline;
}

@media (max-width: 767.98px) {
    .inspections-filters-panel {
        width: 100%;
        right: -100%;
    }
}

[data-skin=dark] .inspections-filters-panel {
    background: #1f1f1f;
}

[data-skin=dark] .inspections-filters-header,
[data-skin=dark] .inspections-filters-footer {
    background-color: #141414;
    border-color: #4f4f4f;
}

[data-skin=dark] .inspections-filters-header h5,
[data-skin=dark] .inspections-filters-label {
    color: #e9ecef;
}

[data-skin=dark] .inspections-quick-action-btn {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
    color: #e9ecef;
}

/* White button with a light border and dark text (matches the mockup).
   Defined standalone — not on top of btn-outline-secondary — so it never
   inherits Bootstrap's fill-with-white-text :hover/:active/:focus states. */
.inspections-toolbar-btn,
.inspections-toolbar-btn:hover,
.inspections-toolbar-btn:focus,
.inspections-toolbar-btn:active,
.inspections-toolbar-btn:focus-visible {
    color: #212529;
    border: 1px solid #dee2e6;
    background-color: #fff;
}

.inspections-toolbar-btn:hover {
    background-color: #f8f9fa;
}

.inspections-toolbar-btn:focus,
.inspections-toolbar-btn:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(0, 103, 179, 0.15);
}

[data-skin=dark] .inspections-toolbar-btn,
[data-skin=dark] .inspections-toolbar-btn:hover,
[data-skin=dark] .inspections-toolbar-btn:focus,
[data-skin=dark] .inspections-toolbar-btn:active,
[data-skin=dark] .inspections-toolbar-btn:focus-visible {
    color: #e9ecef;
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

[data-skin=dark] .inspections-toolbar-btn:hover {
    background-color: #2a2a2a;
}

/* Inspection list header actions — uniform padding + rounded corners across the
   gear, "New Inspection" and "Report an Issue" so they read as one control set. */
.inspections-list-header-actions .btn {
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
}

/* "Report an Issue" — the primary call-to-action. Made a touch taller and wider
   than "New Inspection" so it grabs attention like Services' "New Services" CTA.
   Decoupled from its container so the button is the SAME size everywhere it's
   shown (All Attention Items header, Resolved History header, …). The `.btn`
   co-selector keeps it winning over Bootstrap's default `.btn` padding. */
.btn.inspections-report-issue-btn {
    padding: 0.625rem 1.25rem;
}

/* Square-ish gear button; icon toned to a lighter gray so it stops dominating. */
.inspections-list-header-actions .inspections-gear-btn {
    padding: 0.5rem 0.625rem;
}

.inspections-gear-btn .material-icons {
    font-size: 1.1rem;
    color: #adb5bd;
}

.inspections-gear-btn:hover .material-icons {
    color: #6c757d;
}

[data-skin=dark] .inspections-gear-btn .material-icons {
    color: #6f6f6f;
}

[data-skin=dark] .inspections-gear-btn:hover .material-icons {
    color: #adb5bd;
}

/* Create New Inspection modal — keep the outline Cancel button's text visible.
   The theme's .btn-outline-secondary:hover/:focus forces white text (style.min.css),
   which vanishes on the modal's white footer when the button is focused. */
#add_inspection_modal .btn-outline-secondary,
#add_inspection_modal .btn-outline-secondary:hover,
#add_inspection_modal .btn-outline-secondary:focus,
#add_inspection_modal .btn-outline-secondary:active,
#add_inspection_modal .btn-outline-secondary:focus-visible {
    color: #212529;
    border-color: #dee2e6;
    background-color: #fff;
    box-shadow: none;
}

#add_inspection_modal .btn-outline-secondary:hover {
    background-color: #f8f9fa;
}

[data-skin=dark] #add_inspection_modal .btn-outline-secondary,
[data-skin=dark] #add_inspection_modal .btn-outline-secondary:hover,
[data-skin=dark] #add_inspection_modal .btn-outline-secondary:focus,
[data-skin=dark] #add_inspection_modal .btn-outline-secondary:active,
[data-skin=dark] #add_inspection_modal .btn-outline-secondary:focus-visible {
    color: #e9ecef;
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

[data-skin=dark] #add_inspection_modal .btn-outline-secondary:hover {
    background-color: #2a2a2a;
}

/* Edit Inspections (batch) modal — rows with drag handle, rename, delete. */
.edit-inspections-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.edit-inspection-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.125rem 1.25rem;
    background-color: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
}

.edit-inspection-handle {
    display: inline-flex;
    align-items: center;
    color: #adb5bd;
    cursor: grab;
}

.edit-inspection-handle:active {
    cursor: grabbing;
}

.edit-inspection-name {
    color: #212529;
    font-weight: 600;
    font-size: 1.0625rem;
}

.edit-inspection-name-input {
    max-width: 60%;
}

.edit-inspection-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.edit-icon-btn {
    padding: 0.125rem 0.25rem;
    color: #6c757d;
    line-height: 1;
}

.edit-icon-btn .material-icons {
    font-size: 1.3rem;
    vertical-align: middle;
}

/* jQuery UI sortable drop placeholder */
.edit-inspection-placeholder {
    border: 1px dashed #adb5bd;
    border-radius: 0.375rem;
    background-color: #f1f3f5;
    margin: 0;
}

/* Delete confirmation overlay (covers the modal content) */
.edit-inspections-confirm {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 0.5rem;
    z-index: 10;
    padding: 1rem;
}

.edit-inspections-confirm[hidden] {
    display: none;
}

/* Edit Inspections modal — wider than Bootstrap's default to match design,
   giving the rows room to breathe (esp. the inline rename input). */
.edit-inspections-dialog {
    max-width: 720px;
}

/* Scrolls internally once the list gets long, instead of relying on
   Bootstrap's .modal-dialog-scrollable + .modal-dialog-centered combo. */
#edit_inspections_modal .modal-body {
    max-height: 60vh;
    overflow-y: auto;
}

/* The <form> wrapping header/body/footer picks up a default bottom margin,
   which showed up as a blank strip below the footer buttons inside the
   modal's rounded white box. */
#edit_inspections_modal form {
    margin: 0;
}

/* Grey header + footer bands (design reference); the body stays white. */
#edit_inspections_modal .modal-header,
#edit_inspections_modal .modal-footer {
    background-color: #f8f9fc;
}

#edit_inspections_modal .modal-header {
    border-bottom: 1px solid #dee2e6;
    border-top-left-radius: calc(0.5rem - 1px);
    border-top-right-radius: calc(0.5rem - 1px);
}

#edit_inspections_modal .modal-footer {
    border-top: 1px solid #dee2e6;
    border-bottom-left-radius: calc(0.5rem - 1px);
    border-bottom-right-radius: calc(0.5rem - 1px);
}

[data-skin=dark] #edit_inspections_modal .modal-header,
[data-skin=dark] #edit_inspections_modal .modal-footer {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

/* Cancel button — white background per design spec (matches the Create New
   Inspection modal's outline Cancel button); also keeps its text visible,
   since the theme's .btn-outline-secondary:hover/:focus forces white text. */
#edit_inspections_modal .btn-outline-secondary,
#edit_inspections_modal .btn-outline-secondary:hover,
#edit_inspections_modal .btn-outline-secondary:focus,
#edit_inspections_modal .btn-outline-secondary:active,
#edit_inspections_modal .btn-outline-secondary:focus-visible {
    color: #212529;
    border-color: #dee2e6;
    background-color: #fff;
    box-shadow: none;
}

#edit_inspections_modal .btn-outline-secondary:hover {
    background-color: #f8f9fa;
}

[data-skin=dark] #edit_inspections_modal .btn-outline-secondary,
[data-skin=dark] #edit_inspections_modal .btn-outline-secondary:hover,
[data-skin=dark] #edit_inspections_modal .btn-outline-secondary:focus,
[data-skin=dark] #edit_inspections_modal .btn-outline-secondary:active,
[data-skin=dark] #edit_inspections_modal .btn-outline-secondary:focus-visible {
    color: #e9ecef;
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

[data-skin=dark] #edit_inspections_modal .btn-outline-secondary:hover {
    background-color: #2a2a2a;
}

.edit-inspections-confirm-dialog {
    background-color: #fff;
    border-radius: 0.5rem;
    padding: 1.25rem;
    max-width: 24rem;
    width: 100%;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.2);
}

[data-skin=dark] .edit-inspection-row {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .edit-inspection-name {
    color: #e9ecef;
}

[data-skin=dark] .edit-inspections-confirm-dialog {
    background-color: #1f1f1f;
}

/* Inspection-items empty state ("No items added yet"): base type scale. On
   mobile the container uses more width (mx-0) and a slightly smaller type scale
   so it isn't as tall (matches the mobile design). */
.inspection-items-empty-desc {
    font-size: 14px;
    line-height: 1.6;
}

.inspection-items-empty-tip {
    font-size: 13px;
}

@media (max-width: 767.98px) {
    .inspection-items-empty .empty-state-inner h5 {
        font-size: 1.1rem;
    }

    .inspection-items-empty-desc {
        font-size: 13px;
    }

    .inspection-items-empty-tip {
        font-size: 12px;
    }
}

/* Bay inspection list — vertical cards (name + last ran + Run History). */
.inspections-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1rem;
}

.inspection-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1rem;
    background-color: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    /* Positioning context for the .inspection-card-main stretched link, so a
       click anywhere on the gray card opens the inspection. */
    position: relative;
}

.inspection-card:hover {
    border-color: #adb5bd;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.inspection-card-main {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1 1 auto;
    min-width: 0;
    color: inherit;
}

.inspection-card-name {
    font-weight: 600;
    font-size: 1.125rem;
    line-height: 1.35;
    color: #212529;
}

/* US-8.1: the card's "Run History" action — consistent padding on all sides and
   a design-system corner radius, overriding the .btn-sm defaults it ships with. */
.inspection-card-actions .inspections-toolbar-btn {
    padding: 0.5rem 0.875rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.inspection-card-last-ran {
    display: inline-flex;
    align-items: center;
    font-size: 0.8125rem;
    color: #6c757d;
}

.inspection-card-actions {
    flex: 0 0 auto;
    /* Sit above the card's stretched link so Run History stays clickable. */
    position: relative;
    z-index: 2;
}

.inspections-list-empty-state {
    line-height: 1.6;
}

[data-skin=dark] .inspection-card {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .inspection-card:hover {
    border-color: #6f6f6f;
}

[data-skin=dark] .inspection-card-name {
    color: #e9ecef;
}

/* Page-break line between the mobile washbay selector and the inspection list. */
.inspections-bay-divider {
    margin: 0.25rem 0 0.5rem;
    border: 0;
    border-top: 1px solid #dee2e6;
    opacity: 1;
}

[data-skin=dark] .inspections-bay-divider {
    border-top-color: #4f4f4f;
}

/* Mobile: tighten the bay list so cards use the width (long inspection names
   fit better) and drop the extra padding above it. The washbay selector's inset
   is trimmed to line up with the cards; the Run History action shrinks so it
   reads as a small, distinct control against the gray row. */
@media (max-width: 767.98px) {
    .inspections-bay-view .inspections-nav-dropdown {
        margin-bottom: 0 !important;
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }

    .inspections-bay-view .inspections-list {
        padding: 0.25rem 0.75rem 1rem;
        gap: 0.625rem;
    }

    .inspection-card {
        padding: 0.75rem 0.875rem;
        gap: 0.75rem;
    }

    .inspection-card-name {
        font-size: 1rem;
    }

    .inspection-card-actions .inspections-toolbar-btn {
        padding: 0.375rem 0.625rem;
        font-size: 0.8125rem;
    }
}

/* US-6.6: "My Wash" tag on equipment-backed inspection items + the Add
   Inspection Item modal (searchable multi-select equipment list). */
.inspections-mywash-badge {
    background-color: #e7f1ff;
    color: #0067b3;
    font-weight: 600;
    font-size: 0.7rem;
    vertical-align: middle;
    border-radius: 1rem;
    padding: 0.3rem 0.7rem;
}

.add-item-equipment-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 45vh;
    overflow-y: auto;
}

.add-item-row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0;
    padding: 0.625rem 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    cursor: pointer;
}

.add-item-row:hover {
    background-color: #f8f9fa;
}

.add-item-row.is-added {
    background-color: #f8f9fc;
    cursor: default;
}

.add-item-name {
    flex: 1 1 auto;
    color: #212529;
}

.add-item-added-badge {
    background-color: #e9ecef;
    color: #6c757d;
    font-weight: 600;
    font-size: 0.7rem;
}

[data-skin=dark] .add-item-row {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .add-item-row:hover {
    background-color: #2a2a2a;
}

[data-skin=dark] .add-item-name {
    color: #e9ecef;
}

[data-skin=dark] .inspections-mywash-badge {
    background-color: #11314d;
    color: #6fb6ec;
}

/* US-6.8: "Custom" tag for inspection-only items (not linked to My Wash). */
.inspections-custom-badge {
    background-color: #f1f3f5;
    color: #6c757d;
    font-weight: 600;
    font-size: 0.7rem;
    vertical-align: middle;
}

[data-skin=dark] .inspections-custom-badge {
    background-color: #2a2a2a;
    color: #adb5bd;
}

/* US-6.6 / US-6.7: Add Inspection Item modal — header copy, segmented tabs,
   selection toolbar, inline "Create New Equipment" panel, and footer. */
.add-item-subtitle {
    font-size: 0.875rem;
    line-height: 1.35;
}

/* No divider under the header copy (US-8.x design pass). */
.add-item-header {
    border-bottom: 0;
}

/* Bordered "table" wrapping the Select All header + Create New Equipment + the
   equipment list, so the selection list reads as one grouped control. */
.add-item-panel {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    overflow: hidden;
}

.add-item-panel-body {
    padding: 0.875rem;
}

[data-skin=dark] .add-item-panel {
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

/* Segmented (pill) tab control replacing the default underline nav-tabs. */
.add-item-tabs {
    display: flex;
    gap: 0.25rem;
    padding: 0.25rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #f1f3f5;
}

.add-item-tabs .nav-item {
    flex: 1 1 0;
}

.add-item-tabs .nav-link {
    width: 100%;
    border: 0;
    border-radius: 0.375rem;
    color: #6c757d;
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    background-color: transparent;
}

/* 86e28vmc8: at 1rem, "My Wash Equipment" wraps onto two lines on a narrow
   phone, leaving the segmented control looking cluttered next to the
   one-line "Custom Item" tab. A smaller size keeps both tabs on one line and
   visually balanced. */
@media (max-width: 575.98px) {
    .add-item-tabs .nav-link {
        padding: 0.5rem 0.5rem;
        font-size: 0.8125rem;
        white-space: nowrap;
    }
}

.add-item-tabs .nav-link:hover {
    color: #212529;
}

.add-item-tabs .nav-link.active {
    color: #212529;
    background-color: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

/* Select All + "X of Y selected" header band sitting atop the bordered panel. */
.add-item-toolbar {
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

[data-skin=dark] .add-item-toolbar {
    background-color: #161616;
    border-bottom-color: #4f4f4f;
}

.add-item-selectall {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    color: #212529;
    font-weight: 600;
}

.add-item-count {
    font-size: 0.875rem;
}

/* "Create New Equipment" entry box (dashed, brand-blue). */
.add-item-create-trigger {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
    padding: 0.75rem 0.875rem;
    margin-bottom: 0.5rem;
    border: 1px dashed #0067b3;
    border-radius: 0.375rem;
    background-color: #f3f8ff;
    color: #0067b3;
}

.add-item-create-trigger:hover {
    background-color: #e7f1ff;
}

.add-item-create-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.375rem;
    background-color: #e7f1ff;
    color: #0067b3;
    flex: 0 0 auto;
}

.add-item-create-text {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.add-item-create-title {
    font-weight: 700;
    color: #0067b3;
}

.add-item-create-sub {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* "Back" header shown atop the panel while the create view is open. */
.add-item-create-header {
    padding: 0.75rem 1rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #dee2e6;
}

.add-item-back-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #212529;
    font-weight: 600;
}

.add-item-back-btn:hover {
    color: #0067b3;
}

[data-skin=dark] .add-item-create-header {
    background-color: #161616;
    border-bottom-color: #4f4f4f;
}

[data-skin=dark] .add-item-back-btn {
    color: #e9ecef;
}

/* Inline create card (shown in place of the list). */
.add-item-create-panel {
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
}

.add-item-create-help {
    line-height: 1.4;
}

.add-item-create-link {
    color: #0067b3;
    font-weight: 600;
}

.add-item-footer {
    border-top: 1px solid #dee2e6;
}

/* Dark theme variants. */
[data-skin=dark] .add-item-tabs {
    background-color: #2a2a2a;
    border-color: #4f4f4f;
}

[data-skin=dark] .add-item-tabs .nav-link.active {
    background-color: #1f1f1f;
    color: #e9ecef;
}

[data-skin=dark] .add-item-selectall {
    color: #e9ecef;
}

[data-skin=dark] .add-item-create-trigger {
    background-color: #11243a;
    border-color: #2f6da3;
    color: #6fb6ec;
}

[data-skin=dark] .add-item-create-trigger:hover {
    background-color: #16314f;
}

[data-skin=dark] .add-item-create-icon {
    background-color: #11314d;
    color: #6fb6ec;
}

[data-skin=dark] .add-item-create-title {
    color: #6fb6ec;
}

[data-skin=dark] .add-item-create-panel {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .add-item-create-link {
    color: #6fb6ec;
}

[data-skin=dark] .add-item-footer {
    border-color: #4f4f4f;
}

/* US-6.3 (items): toggle class for entering/leaving the batch edit mode. Lives
   in inspections.css (loaded after Bootstrap) so it overrides the d-* !important
   display utilities a toggled element may also carry. */
.insp-edit-toggle-hidden {
    display: none !important;
}

/* Batch "Edit List" form — editable item cards. */
.edit-items-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 0 1rem;
}

.edit-item-card {
    list-style: none;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background-color: #fff;
    padding: 0;
    overflow: hidden;
}

/* Full-width "+ Add Inspection Item" button, matching the item-card width.
   Grey fill (matches .edit-item-header) + bolder/larger text so it stands out
   against the page instead of blending into the white background. */
.add-inspection-item-btn,
.add-inspection-item-btn:hover,
.add-inspection-item-btn:focus,
.add-inspection-item-btn:active,
.add-inspection-item-btn:focus-visible {
    padding: 0.85rem;
    border-radius: 0.5rem;
    font-weight: 700;
    font-size: 1.0625rem;
    background-color: #f8f9fc;
}

.add-inspection-item-btn:hover {
    background-color: #eef0f6;
}

[data-skin=dark] .add-inspection-item-btn,
[data-skin=dark] .add-inspection-item-btn:hover,
[data-skin=dark] .add-inspection-item-btn:focus,
[data-skin=dark] .add-inspection-item-btn:active,
[data-skin=dark] .add-inspection-item-btn:focus-visible {
    background-color: #161616;
}

[data-skin=dark] .add-inspection-item-btn:hover {
    background-color: #212529;
}

.edit-item-header {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.875rem 1.25rem;
    background-color: #f8f9fc;
    border-bottom: 1px solid #e9ecef;
}

/* Light "Custom" pill tag in the edit card header. */
.edit-item-tag {
    background-color: #f1f3f5;
    color: #6c757d;
    font-weight: 600;
    font-size: 0.75rem;
    border-radius: 1rem;
    padding: 0.3rem 0.7rem;
}

.edit-item-handle {
    display: inline-flex;
    align-items: center;
    color: #adb5bd;
    cursor: grab;
}

.edit-item-handle:active {
    cursor: grabbing;
}

.edit-item-name-input {
    max-width: 480px;
}

.edit-item-name {
    font-weight: 600;
    color: #212529;
}

.edit-item-remove {
    text-decoration: none;
    font-size: 0.875rem;
}

.edit-item-body {
    display: flex;
    gap: 1.25rem;
    align-items: stretch;
    padding: 1.25rem;
}

.edit-item-photo-col {
    flex: 0 0 auto;
    width: 188px;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.875rem;
    background-color: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
}

.edit-item-photo-box {
    width: 100%;
    height: 160px;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    overflow: hidden;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit-item-photo-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.edit-item-photo-box.is-empty .material-icons {
    color: #ced4da;
    font-size: 2.5rem;
}

/* Full-width outlined Edit / Remove buttons under the photo (per mockup). */
.edit-item-photo-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background-color: #fff;
    color: #212529;
    font-size: 0.875rem;
    padding: 0.45rem;
}

.edit-item-photo-btn:hover {
    background-color: #f8f9fa;
}

.edit-item-photo-btn.text-danger:hover {
    background-color: #fdf2f2;
}

/* "Image attached" / "No image attached" status text — mobile only (the sibling
   photo row layout); hidden on the desktop side-column layout. */
.edit-item-photo-label {
    display: none;
}

.edit-item-criteria-col {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* Editor grows to fill the column so it reaches the bottom of the photo
   column's Remove button. The Quill container becomes .edit-item-editor; make
   it a flex column so its .ql-editor fills the remaining height. */
.edit-item-editor {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 160px;
    background-color: #fff;
}

.edit-item-editor .ql-editor {
    flex: 1 1 auto;
}

.edit-item-advanced {
    border-top: 1px solid #f1f3f5;
    padding: 0.75rem 1.25rem;
}

.edit-item-advanced-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0;
    text-decoration: none;
    color: #6c757d;
    font-size: 0.875rem;
}

.edit-item-advanced-show {
    display: inline-flex;
    align-items: center;
    color: #6c757d;
}

.edit-item-advanced-toggle[aria-expanded="true"] .edit-item-advanced-chevron {
    transform: rotate(180deg);
}

/* US-12.2: scrollable menu for the 20-unit "Unit of measure" dropdown. */
.numeric-unit-menu {
    max-height: 320px;
    overflow-y: auto;
}

/* The card clips content (overflow:hidden for rounded corners); while the unit
   menu is open, let it overflow and sit above the following cards. */
.edit-item-card.numeric-unit-open {
    overflow: visible;
    position: relative;
    z-index: 5;
}

.numeric-config-section {
    margin-top: 0.75rem;
}

/* US-12.4: informative callout above the "What's considered good?" question. */
.numeric-config-callout {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid #e9ecef;
    color: #0067b3;
}

/* US-12.5: thresholds card + live preview. */
.numeric-config-thresholds {
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    background-color: #fff;
}

.numeric-threshold-head {
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 0.875rem;
    margin-bottom: 0.25rem;
}

.numeric-threshold-auto {
    background-color: #f1f3f5;
    color: #868e96;
}

.numeric-dot {
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 50%;
    margin-right: 0.5rem;
    flex-shrink: 0;
}

/* Vivid status colors to match the Figma (Bootstrap's bg-* read too muted). */
.numeric-dot--green {
    background-color: #16c60c;
}

.numeric-dot--yellow {
    background-color: #ffc400;
}

.numeric-dot--red {
    background-color: #ff3b30;
}

.numeric-config-preview {
    padding: 1rem;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    background-color: #f8f9fa;
}

.numeric-preview-row {
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.numeric-preview-row:last-child {
    margin-bottom: 0;
}

.numeric-preview-label {
    margin-right: 0.25rem;
    color: #3d4759;
}

.numeric-preview-row strong {
    color: #1f2937;
}

/* 86e289de2: greys out the live preview while the thresholds are invalid — the
   numbers it would show don't mean anything until the config is fixed. */
.numeric-config-preview.is-invalid {
    opacity: 0.45;
}

/* 86e289de2: "Invalid Input" (Acceptable Range) / "Invalid Thresholds"
   (Green/Yellow) error banners — icon + bold title + description, matching
   the Figma error states. */
.numeric-config-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border: 1px solid #f5c2c7;
    border-radius: 0.5rem;
    background-color: #fdecea;
}

.numeric-config-alert-icon {
    flex-shrink: 0;
    color: #dc3545;
    margin-top: 0.125rem;
}

.numeric-config-alert-title {
    font-weight: 700;
    font-size: 0.8125rem;
    color: #dc3545;
}

.numeric-config-alert-message {
    font-size: 0.8125rem;
    color: #dc3545;
}

[data-skin=dark] .numeric-config-alert {
    background-color: rgba(220, 53, 69, 0.15);
    border-color: rgba(220, 53, 69, 0.4);
}

/* US-12.7: numeric input + live status chip shown while performing an item. */
.numeric-runtime-group {
    width: auto;
    max-width: 260px;
}

.numeric-runtime-group .form-control {
    min-width: 160px;
}

/* The value input + PSI addon read the SAME height as the status chip (and the
   R/Y/G buttons): match the chip's 0.6rem vertical padding. */
.numeric-runtime-group .form-control,
.numeric-runtime-unit {
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}

/* Desktop header: keep the numeric row symmetrical with the R/Y/G block —
   the input group spans two buttons + the gap between them (Red + Yellow), so
   the chip (Green width) lines its right edge up with where Green would sit. */
.inspection-item-card-header .numeric-runtime-group {
    width: calc(112px * 2 + 0.75rem);
    max-width: none;
}

.inspection-item-card-header .numeric-runtime-group .form-control {
    min-width: 0;
}

/* Match the inter-button gap (0.375rem margins → 0.75rem between controls). */
.inspection-item-card-header .numeric-runtime-chip {
    margin-left: 0.75rem;
}

/* US-12.7: the measured value reads bold + centered (matches the Figma). */
.inspection-numeric-input {
    text-align: center;
    font-weight: 600;
}

.numeric-runtime-unit {
    background-color: #f1f3f5;
    color: #495057;
}

.numeric-runtime-chip {
    display: inline-block;
    min-width: 112px;
    padding: 0.6rem 1.5rem;
    text-align: center;
    border: 1px solid #ecedf1;
    border-radius: 0.5rem;
    font-size: 1rem;
    color: #adb5bd;
    background-color: #fff;
}

/* US-12.7: the auto-status pill uses the SAME solid fills as a selected R/Y/G
   radio button (application.css [data-skin=light] .inspection-status ...:checked),
   so a numeric item reads visually identical to a marked radio item (Figma). */
.numeric-runtime-chip--green {
    color: #1f2937;
    border: 2px solid #25c63f;
    background-color: #7ed98e;
}

.numeric-runtime-chip--yellow {
    color: #1f2937;
    border: 2px solid #ffc400;
    background-color: #fce97a;
}

.numeric-runtime-chip--red {
    color: #1f2937;
    border: 2px solid #ff3d3d;
    background-color: #f59595;
}

/* US-12.7: static "Auto-Status Rules" box for a numeric item — a bordered card
   that sits above the item description (Figma). Base = mobile: rules stacked
   vertically with the "Auto-Status Rules:" label on top. Desktop lays them out
   on one row (see .inspection-item-content override below). */
.numeric-auto-rules {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
    background-color: #f8f9fa;
    font-size: 0.875rem;
}

/* Desktop: rules on one horizontal row; the label is not rendered here. */
.inspection-item-content .numeric-auto-rules {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 2rem;
}

[data-skin=dark] .numeric-auto-rules {
    background-color: #2a2a2a;
    border-color: #4f4f4f;
}

.numeric-auto-rules-label {
    color: #495057;
    font-weight: 600;
}

.numeric-auto-rule {
    display: inline-flex;
    align-items: center;
}

.numeric-auto-rule-text {
    color: #495057;
}

.numeric-auto-rule-text strong {
    color: #1f2937;
}

[data-skin=dark] .numeric-auto-rules-label {
    color: #c7c7c7;
}

[data-skin=dark] .numeric-auto-rule-text {
    color: #c7c7c7;
}

[data-skin=dark] .numeric-auto-rule-text strong {
    color: #f1f3f5;
}

/* WBS 12: "Auto-Status Threshold" bar on the Attention Item Issue Reported card —
   the measured value + where it falls on the red→yellow→green scale + band rules. */
.ai-threshold {
    margin-bottom: 1rem;
}

.ai-threshold-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.ai-threshold-label {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #6c757d;
}

.ai-threshold-value {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1f2937;
}

.ai-threshold-value--red {
    color: #d64545;
}

.ai-threshold-value--yellow {
    color: #b78a00;
}

.ai-threshold-value--green {
    color: #1f9d38;
}

.ai-threshold-track {
    position: relative;
    height: 8px;
    border-radius: 999px;
}

.ai-threshold-track--red-yellow-green {
    background: linear-gradient(to right, #f59595 0 33.33%, #fce97a 33.33% 66.66%, #7ed98e 66.66% 100%);
}

.ai-threshold-track--green-yellow-red {
    background: linear-gradient(to right, #7ed98e 0 33.33%, #fce97a 33.33% 66.66%, #f59595 66.66% 100%);
}

.ai-threshold-marker {
    position: absolute;
    top: 50%;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    border: 3px solid #1f2937;
    transform: translate(-50%, -50%);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.ai-threshold-rules {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 1.25rem;
    margin-top: 0.625rem;
}

.ai-threshold-rule {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    color: #495057;
}

.ai-threshold-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ai-threshold-dot--red {
    background: #ff3d3d;
}

.ai-threshold-dot--yellow {
    background: #ffc400;
}

.ai-threshold-dot--green {
    background: #25c63f;
}

[data-skin=dark] .ai-threshold-label {
    color: #adb5bd;
}

[data-skin=dark] .ai-threshold-value {
    color: #f1f3f5;
}

[data-skin=dark] .ai-threshold-value--red {
    color: #f59595;
}

[data-skin=dark] .ai-threshold-value--yellow {
    color: #fce97a;
}

[data-skin=dark] .ai-threshold-value--green {
    color: #7ed98e;
}

[data-skin=dark] .ai-threshold-marker {
    border-color: #f1f3f5;
    background: #2a2a2a;
}

[data-skin=dark] .ai-threshold-rule {
    color: #c7c7c7;
}

.edit-item-placeholder {
    border: 1px dashed #adb5bd;
    border-radius: 0.5rem;
    background-color: #f1f3f5;
    margin: 0 1rem;
}

/* Page-level remove confirmation (over everything, incl. any modal). */
.edit-items-confirm {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1080;
    padding: 1rem;
}

.edit-items-confirm[hidden] {
    display: none;
}

[data-skin=dark] .edit-item-card {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .edit-item-header {
    background-color: #161616;
    border-bottom-color: #343a40;
}

[data-skin=dark] .edit-item-photo-col {
    background-color: #161616;
    border-color: #4f4f4f;
}

[data-skin=dark] .edit-item-name {
    color: #e9ecef;
}

[data-skin=dark] .edit-item-editor {
    background-color: #2a2a2a;
}

/* US-6.x: inspection detail item cards — grey header (name + R/Y/G) + white
   body (reference photo + criteria). Per-item controls reveal in edit mode. */
.inspection-item-card {
    list-style: none;
    margin: 0 1rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background-color: #fff;
    overflow: hidden;
}

.inspection-item-card-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.625rem 1rem;
    background-color: #f8f9fc;
    border-bottom: 1px solid #dee2e6;
}

.inspection-item-card-title {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    align-items: center;
    font-weight: 600;
    color: #212529;
}

/* Equipment item name — bumped up so each item reads clearly against the
   right-side status controls (keeps the left side balanced). */
.inspection-item-name {
    font-size: 1.125rem;
}

/* The inspection name in the detail header ("Test") — a touch larger than the
   default h5 so the page's subject is prominent, while staying under the bay
   name (h4) in the top bar. */
.inspection-detail-header h5 {
    font-size: 1.25rem;
}

.inspection-item-card-tools {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.inspection-item-controls {
    display: none;
    align-items: center;
}

.inspections-edit-mode .inspection-item-controls {
    display: inline-flex;
}

/* R/Y/G in the header — sized to match the mockup (override the old w-100). */
.inspection-item-card-header .inspection-status .btn {
    width: auto !important;
    min-width: 112px;
    margin-left: 0.375rem !important;
    margin-right: 0.375rem !important;
    border-radius: 0.5rem;
}

.inspection-item-card-header .inspection-status label {
    margin: 0;
    padding: 0.6rem 1.5rem;
    border-radius: 0.5rem;
    font-size: 1rem;
}

.inspection-item-card-body {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1rem;
}

/* Right column beside the reference photo: the Auto-Status Rules box (numeric
   items) stacked above the criteria/description (Figma). */
.inspection-item-content {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.inspection-item-photo {
    flex: 0 0 auto;
    width: 112px;
    height: 112px;
    border-radius: 0.375rem;
    overflow: hidden;
    background-color: #e9ecef;
    display: flex;
    align-items: center;
    justify-content: center;
}

.inspection-item-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.inspection-item-photo.is-empty .material-icons {
    color: #adb5bd;
    font-size: 1.75rem;
}

.inspection-item-criteria {
    flex: 1 1 auto;
    min-width: 0;
    color: #495057;
    font-size: 1rem;
}

/* US-7.1: list rendering (disc/decimal) + underline are owned by
   .task-description-rich (shared with Tasks). The old
   .inspection-item-criteria li { list-style: disc } forced bullets onto
   ordered lists too, so numbering never showed. */
.inspection-item-criteria li {
    margin-bottom: 0.2rem;
}

/* Inspection detail top bar (back arrow + bay name). */
.inspection-detail-topbar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.inspection-detail-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6c757d;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    width: 32px;
    height: 32px;
    text-decoration: none;
}

.inspection-detail-back:hover {
    background-color: #f1f3f5;
    color: #212529;
}

[data-skin=dark] .inspection-item-card {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .inspection-item-card-header {
    background-color: #181818;
    border-color: #4f4f4f;
}

[data-skin=dark] .inspection-item-card-title {
    color: #e9ecef;
}

[data-skin=dark] .inspection-item-photo {
    background-color: #2a2a2a;
}

[data-skin=dark] .inspection-item-criteria {
    color: #c7c7c7;
}

.inspections-search-bar-icon {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    color: #6c757d;
    pointer-events: none;
}

.inspections-search-bar-input.form-control {
    padding-left: 2.25rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

/* Hide the browser's native clear button so it doesn't clash with our icon. */
.inspections-search-bar-input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    appearance: none;
}

.inspections-attention-no-results[hidden] {
    display: none;
}

[data-skin=dark] .inspections-search-bar-input.form-control {
    border-color: #4f4f4f;
}

/* ----------------------------------------------------------------------------
   All Attention Items — list + cards (match the redesign mockup)
   ---------------------------------------------------------------------------- */

/* Muted, aligned column headers above the cards. */
.inspections-content .attention-list-header {
    color: #6c757d;
    font-size: 0.8125rem;
    font-weight: 600;
}

/* "You're all caught up" empty state (and the "no results match filters"
   state that shares the same wrapper). Mobile gets a much smaller side inset
   so the card fills the available width, per design — desktop/tablet keep
   the original 1rem gutter. */
/* !important: [data-skin=light/dark] .inspection (application.css) sets its
   own background at equal specificity but loads after this file, so it wins
   without it. */
.inspections-empty-state {
    margin-left: 1rem;
    margin-right: 1rem;
    padding-left: 1rem;
    padding-right: 1rem;
    background-color: #fff !important;
}

@media (max-width: 575.98px) {
    .inspections-empty-state {
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        padding-left: 0.25rem;
        padding-right: 0.25rem;
    }
}

.inspections-empty-title {
    font-size: 1.125rem;
}

.inspections-empty-help {
    font-size: 0.875rem;
}

[data-skin=dark] .inspections-empty-title {
    color: #e9ecef !important;
}

[data-skin=dark] .inspections-empty-state {
    background-color: #1f1f1f !important;
}

/* ----------------------------------------------------------------------------
   Report an Issue modal — status color buttons (US-4.1). Selected colors match
   the linked-task badges (needs-attention yellow / critical red).
   ---------------------------------------------------------------------------- */
/* Choose Item stays locked until a bay is chosen: greyed + blurred + not-allowed
   so the bay -> item dependency is obvious. Bootstrap already greys :disabled;
   these add the reduced-opacity/blur the design calls for. */
.report-issue-item-select:disabled {
    opacity: 0.55;
    filter: blur(0.7px);
    background-color: #f1f3f5;
    cursor: not-allowed;
}

[data-skin=dark] .report-issue-item-select:disabled {
    background-color: #161616;
}

/* When select2 is active the native <select> is hidden, so apply the same locked
   look to the select2 container for the Choose Item field. */
.report-issue-item-field .select2-container--disabled {
    opacity: 0.55;
    filter: blur(0.7px);
    cursor: not-allowed;
}

.report-issue-status-buttons {
    display: flex;
    gap: 0.75rem;
}

.report-issue-status-btn {
    flex: 1 1 0;
    padding: 0.75rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    color: #212529;
    font-weight: 600;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.report-issue-status-btn:hover {
    background-color: #f8f9fa;
}

.report-issue-status-btn--attention.is-selected,
.report-issue-status-btn--attention.is-selected:hover {
    background-color: #fbeb95;
    border-color: #efd96f;
    color: #212529;
}

.report-issue-status-btn--critical.is-selected,
.report-issue-status-btn--critical.is-selected:hover {
    background-color: #f08a8a;
    border-color: #e07070;
    color: #212529;
}

[data-skin=dark] .report-issue-status-btn {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
    color: #e9ecef;
}

[data-skin=dark] .report-issue-status-btn:hover {
    background-color: #2a2a2a;
}

[data-skin=dark] .report-issue-status-btn--attention.is-selected,
[data-skin=dark] .report-issue-status-btn--attention.is-selected:hover,
[data-skin=dark] .report-issue-status-btn--critical.is-selected,
[data-skin=dark] .report-issue-status-btn--critical.is-selected:hover {
    color: #212529;
}

/* Attachments drag-and-drop zone (US-4.3). */
.report-issue-dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 1.5rem 1rem;
    border: 1px dashed #ced4da;
    border-radius: 0.375rem;
    background-color: #fff;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.report-issue-dropzone:hover,
.report-issue-dropzone:focus,
.report-issue-dropzone.is-dragover {
    border-color: #0067b3;
    background-color: #eef4fb;
    outline: none;
}

.report-issue-dropzone-icon {
    color: #adb5bd;
}

.report-issue-dropzone-text {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #495057;
}

.report-issue-dropzone-hint {
    font-size: 0.75rem;
    color: #6c757d;
}

[data-skin=dark] .report-issue-dropzone {
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

[data-skin=dark] .report-issue-dropzone:hover,
[data-skin=dark] .report-issue-dropzone:focus,
[data-skin=dark] .report-issue-dropzone.is-dragover {
    border-color: #0067b3;
    background-color: #20303f;
}

[data-skin=dark] .report-issue-dropzone-text {
    color: #e9ecef;
}

/* Attachment previews: incremental add/remove thumbnails (mirrors the Services
   flow). Each attached photo/video/PDF shows as a small tile with a remove X. */
.report-issue-file-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.report-issue-file-item {
    position: relative;
    width: 84px;
}

.report-issue-file-thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 84px;
    height: 84px;
    object-fit: cover;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
}

.report-issue-file-thumb--icon {
    color: #6c757d;
}

.report-issue-file-name {
    display: block;
    max-width: 84px;
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    color: #6c757d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.report-issue-file-remove {
    position: absolute;
    top: -6px;
    right: -6px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background-color: #dc3545;
    color: #fff;
    line-height: 1;
    cursor: pointer;
}

.report-issue-file-remove svg {
    width: 12px;
    height: 12px;
}

.report-issue-file-remove:hover {
    background-color: #bb2d3b;
}

[data-skin=dark] .report-issue-file-thumb {
    border-color: #4f4f4f;
    background-color: #1f1f1f;
}

[data-skin=dark] .report-issue-file-name {
    color: #adb5bd;
}

/* Match the design's more generous control + button padding (US-4.1 QA).
   Scoped to the modal by its id so other features keep Bootstrap defaults.
   form-select keeps its default right padding (chevron) — only the vertical
   padding is overridden. */
#inspections-report-issue .form-select,
#inspections-report-issue .form-control {
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
}

#inspections-report-issue .btn-primary {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    font-weight: 600;
}

/* Match the mockup (US-4.x QA): bold title with no header divider, bold field
   labels, and more generous horizontal padding. Scoped to the modal id. */
#inspections-report-issue .modal-header {
    border-bottom: 0;
    padding: 1.5rem 1.5rem 0.5rem;
}

#inspections-report-issue .modal-title {
    font-weight: 700;
}

#inspections-report-issue .modal-body {
    padding: 0.5rem 1.5rem 0.25rem;
}

#inspections-report-issue .form-label {
    font-weight: 600;
    color: #212529;
}

/* Item cards: clean white (not the legacy gray) with a vertically-centered
   top row so the name / bay / reported line up with the assignee select and
   the status pill. Scoped to .attention-item so other .inspection blocks are
   untouched. */
.attention-item .inspection {
    background-color: #fff;
    font-size: 1rem;
}

.attention-item .inspection.row {
    align-items: center;
}

[data-skin=dark] .attention-item .inspection {
    background-color: #1f1f1f;
}

.inspections-sidebar-item:hover,
.inspections-sidebar-item:focus {
    background-color: #f1f3f5;
    color: #212529;
}

.inspections-sidebar-item--active,
.inspections-sidebar-item--active:hover,
.inspections-sidebar-item--active:focus {
    background-color: #e7f1ff;
    color: #0067b3;
}

.inspections-sidebar-empty {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Mobile (<768px): the sidebar nav is hidden (d-none d-md-block) and replaced by
   the Tasks-style dropdown (.inspections-nav-dropdown, d-md-none), rendered
   above the search bar (Inspections::Molecules::InspectionsNavDropdownComponent),
   ahead of the sidebar+content row. Only visible at this breakpoint, so the
   horizontal inset here doesn't need a matching desktop rule. */
.inspections-nav-dropdown {
    padding: 1rem 1rem 0;
}

/* "..." overflow button beside the mobile washbay selector — matches the
   selector trigger's border/radius and stretches to its full height (the two
   sit in an align-items-stretch flex row). */
.inspections-bay-overflow-btn {
    flex-shrink: 0;
    aspect-ratio: 1 / 1;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    color: #111827;
}

.inspections-bay-overflow-btn:hover,
.inspections-bay-overflow-btn:focus {
    background-color: #f8f9fc;
    border-color: #dee2e6;
    color: #111827;
}

[data-skin=dark] .inspections-bay-overflow-btn {
    border-color: #4f4f4f;
    color: #e5e7eb;
}

@media (max-width: 767.98px) {
    .inspections-layout {
        flex-direction: column;
    }

    /* Let the mobile nav dropdown's menu escape the card's overflow:hidden
       (same pattern as the Services list — see services.css :has() rules). Scoped
       to mobile so desktop cards keep clipping their corners. */
    .card:has(.inspections-nav-dropdown) {
        overflow: visible;
    }
}

/* Dark mode (matches the app's [data-skin=dark] convention). */
[data-skin=dark] .inspections-sidebar {
    border-color: #4f4f4f;
}

[data-skin=dark] .inspections-sidebar-divider {
    border-top-color: #4f4f4f;
}

[data-skin=dark] .inspections-sidebar-item {
    color: #e5e7eb;
}

[data-skin=dark] .inspections-sidebar-item:hover,
[data-skin=dark] .inspections-sidebar-item:focus {
    background-color: #222222;
    color: #ffffff;
}

[data-skin=dark] .inspections-sidebar-item--active,
[data-skin=dark] .inspections-sidebar-item--active:hover,
[data-skin=dark] .inspections-sidebar-item--active:focus {
    background-color: #0067b3;
    color: #ffffff;
}

@media (max-width: 767.98px) {
    [data-skin=dark] .inspections-sidebar {
        border-bottom-color: #4f4f4f;
    }
}

/* ----------------------------------------------------------------------------
   Resolved History (US-5.1) — toolbar link, intro note, date-grouped list.
   ---------------------------------------------------------------------------- */

/* Intro line under the toolbar. */
.inspections-resolved-note {
    margin: 0 1rem 0.75rem;
    color: #6c757d;
    font-size: 0.875rem;
}

/* Date group header ("RESOLVED" eyebrow + the resolved-on date). */
.resolved-history {
    margin: 0 1rem;
}

.resolved-group-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    /* Larger top margin separates each date group from the items above it. */
    margin-top: 1.5rem;
    background-color: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

/* The first group sits flush with the top of the list. */
.resolved-history > .resolved-group-header:first-child {
    margin-top: 0;
}

/* Pale-green circular badge holding the green circle-check (matches mockup). */
.resolved-group-icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #dcfce7;
    flex-shrink: 0;
}

.resolved-group-icon {
    color: #22c55e;
}

.resolved-group-eyebrow {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #22c55e;
}

.resolved-group-date {
    margin: 0;
    font-weight: 600;
    color: #212529;
}

/* Pagination (US-5.2) reuses the shared Services paginator partial + its
   .services-index-pagination / .pagination-btn styles for a 1:1 visual match. */

/* A single resolved item row. */
.resolved-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    margin-top: 0.5rem;
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

/* Rows backed by a real resolved AttentionItem link to its detail page (like the
   Services completed-history rows). Legacy History rows aren't clickable. */
.resolved-item--clickable {
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.resolved-item--clickable:hover {
    border-color: #0067b3;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.08);
}

[data-skin=dark] .resolved-item--clickable:hover {
    border-color: #0067b3;
}

.resolved-item-info {
    min-width: 0;
}

.resolved-item-name {
    margin: 0 0 0.25rem;
    font-weight: 600;
    color: #212529;
}

.resolved-item-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.resolved-item-by {
    display: inline-flex;
    align-items: center;
    color: #6c757d;
}

/* Light-green fill with a brighter-green outline and dark text — matches the
   mockup pill (no white text, visible green border). */
.resolved-item-badge {
    flex-shrink: 0;
    display: inline-block;
    padding: 0.4rem 1.5rem;
    border-radius: 50rem;
    background-color: #7ed98e;
    border: 2px solid #25c63f;
    color: #1f2937;
    font-size: 0.875rem;
    font-weight: 600;
}

/* Dark mode. */
[data-skin=dark] .resolved-group-header {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .resolved-group-date {
    color: #e9ecef;
}

[data-skin=dark] .resolved-group-icon-badge {
    background-color: rgba(34, 197, 94, 0.18);
}

[data-skin=dark] .resolved-item {
    background-color: #1f1f1f;
    border-color: #4f4f4f;
}

[data-skin=dark] .resolved-item-name {
    color: #e9ecef;
}

/* Details-tab field icons: one consistent treatment for every row (Status,
   Progress, Priority, Assigned To, Reported By, Date…) — same lucide outline
   style, size, stroke colour and top alignment — so they read as one set. */
.attention-field-icon {
    flex-shrink: 0;
    color: #0067b3;
    margin-top: 1px;
}

/* Attention Item detail — Details tab fields.
   Assigned To caps its width at 340px (shared assigned-dropdown rule); match
   Status / Progress / Priority to that same width so all four controls line up
   and we don't stretch them across the whole column. */
.attention-details-grid [data-controller="progress-dropdown"],
.attention-details-grid .attention-status-box {
    width: 100%;
    max-width: 340px;
}

/* Attention Item Timeline & Activity feed (US-2.8, show-2 Figma).
   Per-day dividers, avatar initials, and the from→to change badges baked into
   each History description. */
.ai-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #E5E7EB;
    color: #374151;
    font-size: 0.7rem;
    font-weight: 600;
    flex-shrink: 0;
}

.ai-timeline-pill,
.ai-timeline-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.25rem 0.65rem;
    border: 1px solid #E5E7EB;
    border-radius: 9999px;
    background: #fff;
    font-size: 0.85rem;
    color: #374151;
    white-space: nowrap;
}

.ai-timeline-chip .ai-avatar {
    width: 20px;
    height: 20px;
    font-size: 0.6rem;
}

/* Assignee chip showing a real profile picture: the img fills the circle, so
   drop the initials-circle fill/padding and clip the corners. */
.ai-avatar.ai-avatar-photo {
    padding: 0;
    overflow: hidden;
    background: transparent;
}

.ai-avatar.ai-avatar-photo img {
    display: block;
}

.ai-timeline-arrow {
    color: #9CA3AF;
    margin: 0 0.5rem;
    font-size: 1rem;
}

/* The "Status Change" history bakes its from→to badge HTML into the History
   description at creation time, so rows created before the colour fix still
   carry the old `text-white`. Force black text on the timeline's green (resolved)
   and red (critical) badges so old and new entries read consistently. */
#timeline_feed .badge.bg-success,
#timeline_feed .badge.bg-danger {
    color: #000 !important;
}

/* Consistent "medium" size for attention-item status badges on the detail +
   timeline views: bigger than a plain Bootstrap badge, smaller than the wide
   Services `pill-status-*` (which forces min-width: 8rem). Applies to every
   timeline badge (the soft "reported an issue" pill AND the solid "Status
   Change" badges) plus the detail-header status control (.ai-status-badge) so
   they all read the same size — each keeps its own fill/colour treatment. The
   `#id`/`.badge.badge` specificity + !important beats the `pill-status-*`
   !important sizing. */
#timeline_feed .badge,
.badge.ai-status-badge {
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    padding: 0.4rem 0.85rem !important;
    min-width: 0 !important;
}

.ai-timeline-divider {
    text-align: center;
    position: relative;
}

.ai-timeline-divider::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: #E5E7EB;
    z-index: 0;
}

.ai-timeline-divider span {
    position: relative;
    z-index: 1;
    background: #F3F4F6;
    border: 1px solid #E5E7EB;
    border-radius: 9999px;
    padding: 0.35rem 1rem;
    font-size: 0.8rem;
    color: #374151;
    font-weight: 500;
}

/* Issue-reported timeline card: labelled metadata groups (Status, Inspection,
   Issue Notes, Attachments) separated by dividers, mirroring the Services
   completion card so related metadata reads as one grouped block. */
.ai-issue-group {
    padding: 0.75rem 0;
}

.ai-issue-group:first-child {
    padding-top: 0;
}

.ai-issue-group:last-child {
    padding-bottom: 0;
}

.ai-issue-group + .ai-issue-group {
    border-top: 1px solid #e5e7eb;
}

.ai-issue-group-label {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    color: #6b7280;
}

.ai-issue-group-label svg {
    color: #9ca3af;
    flex-shrink: 0;
}

.ai-issue-group-value {
    font-size: 1rem;
    color: #111827;
}

/* The "Issue Reported" heading on the detail card — a touch bolder than the
   shared .service-instructions-title (weight 500) so it stands out. Scoped to the
   card header so the Services class is unaffected elsewhere. */
.issue-reported-header .service-instructions-title {
    font-weight: 600;
}

/* Divider above the "Media Attachments" section in the Issue Reported edit form
   (US-2.3) — mirrors the Services edit media divider. */
.issue-reported-media-divider {
    border: 0;
    border-top: 1px solid #e2e5ec;
    margin: 1rem 0;
    opacity: 1;
}

[data-skin=dark] .issue-reported-media-divider {
    border-top-color: #343a40;
}

[data-skin=dark] .ai-issue-group + .ai-issue-group {
    border-top-color: #343a40;
}

[data-skin=dark] .ai-issue-group-label {
    color: #9ca3af;
}

[data-skin=dark] .ai-issue-group-value {
    color: #e9ecef;
}

/* Add Note composer attachment preview (US-2.9). */
.note-attachment-tile {
    width: 96px;
    height: 96px;
    background: #fff;
}

.note-attachment-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    font-size: 20px;
    pointer-events: none;
}

.note-attachment-remove {
    position: absolute;
    top: 4px;
    right: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 0;
}

.note-attachment-remove .material-icons {
    font-size: 16px;
}

/* US-2.9: attachment upload progress bar in the Add Note composer. */
.note-composer-progress {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.note-composer-progress-track {
    flex: 1 1 auto;
    height: 6px;
    border-radius: 999px;
    background-color: #e9ecef;
    overflow: hidden;
}

.note-composer-progress-bar {
    width: 0%;
    height: 100%;
    border-radius: 999px;
    background-color: #0067b3;
    transition: width 0.15s ease;
}

.note-composer-progress-label {
    font-size: 0.75rem;
    color: #6c757d;
    white-space: nowrap;
}

[data-skin=dark] .note-composer-progress-track {
    background-color: #3a3a3a;
}

[data-skin=dark] .note-composer-progress-label {
    color: #adb5bd;
}

/* US-11.6: per-item inline note composer (inspection perform view). */
.inspection-note-divider {
    border-top: 1px solid #dee2e6;
    margin: 0 1rem;
}

.inspection-note-panel {
    background: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.75rem 1rem;
}

.inspection-note-textarea {
    min-height: 90px;
    resize: none;
}

/* Lets the previewed attachment tiles flow into the same flex row as the
   "Add Photo/Video" tile (US-11.6). */
.inspection-note-preview {
    display: contents;
}

.note-add-tile {
    width: 96px;
    height: 96px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 4px;
    border: 1px dashed #c4c9d4;
    border-radius: 0.375rem;
    background: #fff;
    color: #6c757d;
    font-size: 0.75rem;
    line-height: 1.1;
    text-align: center;
}

.note-add-tile:hover {
    border-color: #0d6efd;
    color: #0d6efd;
}

/* Drag-and-drop highlight on the photo/video control (US-11.6). */
.inspection-note-dropzone.is-dragover .note-add-tile {
    border-color: #0d6efd;
    color: #0d6efd;
    background: rgba(13, 110, 253, 0.06);
}

.note-add-tile .material-icons {
    font-size: 22px;
}

.inspection-note-footer {
    border-top: 1px solid #dee2e6;
    font-size: 0.8125rem;
    color: #6c757d;
}

.inspection-note-footer .material-icons {
    font-size: 18px;
    margin-right: 6px;
}

[data-skin=dark] .inspection-note-panel {
    background: #1e2330;
    border-color: #2a3142;
}

[data-skin=dark] .inspection-note-divider,
[data-skin=dark] .inspection-note-footer {
    border-color: #2a3142;
}

[data-skin=dark] .note-add-tile {
    background: #161a25;
    border-color: #3a4255;
}

/* Back button reuses the Services header treatment (.back-button CSS is scoped
   to .services-header, so mirror it here for the attention detail header). */
.attention-detail-header .back-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    padding: 0;
    background-color: transparent;
    border: 1px solid #6e7985;
    border-radius: 6px;
    color: #6e7985;
    text-decoration: none;
    transition: background-color 0.15s, color 0.15s;
    flex-shrink: 0;
}

.attention-detail-header .back-button:hover {
    background-color: #6e7985;
    border-color: #6e7985;
    color: #fff;
}

/* Page title matches the Services detail title scale (not overbearing on mobile). */
.attention-page-title {
    font-size: 1.5rem;
}

/* Content area = a plain white card-body (no nested bordered box), mirroring the
   Services detail's .service-detail-content-wrapper so the content fills the
   card width. Removing the old inner box reclaims its padding + border on every
   viewport — most noticeably on mobile. */
.attention-detail-content {
    background-color: #fff;
}

/* Attention Item Details controls match the Services detail dropdowns (~38px
   trigger via Bootstrap form padding); the status pill stays compact so the
   Status control is the same height as the others. Tabs are handled by the
   shared .tab-rectangle component. */
.attention-details-grid .assigned-dropdown-trigger {
    padding: 0.375rem 0.75rem;
}

.attention-details-grid .badge.rounded-pill {
    font-size: 0.875rem;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
}

/* Attention Item detail — mobile refinements (US-2 Figma, mobile).
   On phones the desktop sizing reads oversized: shrink the header actions and
   tabs, lay the Issue Reported and Timeline media out two-per-row, and slim the
   Details controls/pill back down to the lighter mobile proportions. */
@media (max-width: 575.98px) {
    /* Actions + Mark as Resolved drop to their own full-width row below the
       title: Actions keeps its natural width on the left, Mark as Resolved grows
       to fill the rest on the right, both tall — matching the Figma mobile header. */
    .attention-header-actions {
        width: 100%;
    }

    /* Figma mobile: lift the "Issue Reported" header (+ Edit) out of the card so
       it sits above, and box only the description/media body. The outer card drops
       its border/background/padding; the .issue-reported-body takes them on. */
    .attention-issue-card {
        border: 0 !important;
        background: transparent !important;
        padding: 0 !important;
    }

    .attention-issue-card .issue-reported-body {
        border: 1px solid #e2e5ec;
        border-radius: 0.5rem;
        background-color: #f8f9fc;
        padding: 1rem;
    }

    .attention-issue-card .issue-reported-body > :last-child {
        margin-bottom: 0;
    }

    /* Slim the content area's side padding so its contents get more width on
       narrow screens; the vertical rhythm stays as designed. */
    .attention-detail-content {
        padding-left: 0.85rem !important;
        padding-right: 0.85rem !important;
    }

    /* Trim the Details card's left padding so the Status/Progress/etc. fields sit
       closer to the card edge on phones. */
    .attention-details-card {
        padding-left: 0.85rem !important;
    }

    .attention-header-actions .bg-success-new {
        flex: 1 1 auto;
    }

    .attention-header-actions .btn {
        font-size: 0.95rem;
        padding: 0.6rem 1.1rem;
    }

    .attention-header-actions .btn .material-icons {
        font-size: 18px;
    }

    /* Title matches the Services mobile title scale (not overbearing). */
    .attention-page-title {
        font-size: 1.25rem;
    }
}

/* Two-per-row attachment grid on mobile/tablet for both Issue Reported (gap-3)
   and the Timeline note / reported-issue attachments (gap-2). Applies up to the
   md breakpoint (767.98px) — the same width where the detail field grid collapses
   to one column — so it holds on larger phones and portrait tablets, not just the
   narrowest screens. A CSS grid keeps the two columns even regardless of each
   container's flex gap, and the square aspect-ratio replaces the fixed desktop
   tile sizes (US-2.14). */
@media (max-width: 767.98px) {
    .attention-media-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr);
    }

    .attention-media-grid > a,
    .attention-media-grid > div,
    .attention-media-grid > a > div {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1;
    }
}

/* "Mark as Resolved" modal attachment dropzone (US-2.13). */
.resolve-dropzone {
    border: 1px dashed #ccd2da;
    background: #fbfcfe;
    cursor: pointer;
}

.resolve-dropzone:hover {
    border-color: #506fd9;
    background: #f3f5f9;
}

/* On phones the resolve modal nearly fills the screen, so tighten its spacing:
   smaller body padding, slimmer field gaps, a shorter textarea and a more
   compact dropzone (US-2.13 mobile). */
@media (max-width: 575.98px) {
    #resolve-attention-modal .modal-body {
        padding: 0.85rem;
    }

    #resolve-attention-modal .modal-body .mb-3 {
        margin-bottom: 0.65rem !important;
    }

    #resolve-attention-modal .modal-body small {
        font-size: 0.72rem;
    }

    #resolve-attention-modal #resolve-note {
        height: 4.5rem;
    }

    #resolve-attention-modal .resolve-dropzone {
        padding: 0.85rem !important;
    }

    #resolve-attention-modal .resolve-dropzone .material-icons {
        font-size: 20px;
    }
}

/* ============================================================================
   Run History list (US-8.1) — past performances of a single inspection.
   Styled for main-app consistency: #dee2e6 borders, 0.375rem radius.
   ============================================================================ */

.run-history {
    padding: 0 1.5rem 0.5rem;
}

/* Inspection name + description on the left, search + Filters on the right.
   Both sides get a flex-basis (instead of sizing purely off content) so the
   heading keeps a fair share of the row and its subtitle doesn't get crushed
   into premature word-wrapping by the toolbar's own min-content floor. */
.run-history-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1.25rem 0 0.75rem;
}

.run-history-heading {
    flex: 1 1 280px;
    min-width: 240px;
}

.run-history-title {
    margin: 0 0 0.25rem;
    font-size: 1.375rem;
    font-weight: 700;
    color: #212529;
}

.run-history-subtitle {
    margin: 0;
    max-width: 36rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Search + Filters share one row, right-aligned, like the mockup. Both controls
   stretch to one shared height so their top and bottom edges line up exactly,
   regardless of each control's natural (theme) height. The search bar takes
   ~75% of this row and Filters the remaining ~25%, per the design. */
.run-history-toolbar-actions {
    display: flex;
    align-items: stretch;
    justify-content: flex-end;
    gap: 0.5rem;
    flex: 1 1 420px;
    max-width: 520px;
    height: 38px;
}

.run-history-toolbar-actions .inspections-search-bar {
    flex: 3 1 0;
    max-width: none;
    margin: 0;
}

.run-history-toolbar-actions .inspections-search-bar-input.form-control {
    height: 100%;
    margin: 0;
}

.run-history-toolbar-actions .inspections-toolbar-btn {
    flex: 1 1 0;
    height: 100%;
    margin: 0;
}

@media (max-width: 575.98px) {
    /* Search + Filters stay on one row; Filters collapses to a compact square
       icon button (label hidden via d-none d-md-inline) and the search bar takes
       the rest of the width — matching the other mobile toolbars. */
    .run-history-toolbar-actions {
        flex-wrap: nowrap;
    }

    .run-history-toolbar-actions .inspections-toolbar-btn {
        flex: 0 0 auto;
    }
}

.run-history-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* A single run row: a main line (date/time + performer + View Details) with a
   counts strip below it. */
.run-row {
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
}

.run-row-main {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem;
}

.run-row-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #f8f9fc;
    color: #0067b3;
    flex-shrink: 0;
}

.run-row-info {
    min-width: 0;
    margin-right: auto;
}

.run-row-when {
    display: inline-flex;
    align-items: center;
    margin: 0 0 0.15rem;
    font-size: 1.0625rem;
    font-weight: 600;
    color: #212529;
}

.run-row-when .lucide-icon,
.run-row-when svg {
    margin-right: 0.375rem;
}

.run-row-by {
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.run-row-actions {
    flex-shrink: 0;
}

/* View Details — bigger than the toolbar's default btn-sm, per design, while
   staying compact enough not to dominate the row on phones/tablets. */
.run-row-view-details-btn {
    padding: 0.5rem 1.125rem;
    font-size: 0.9375rem;
}

@media (max-width: 575.98px) {
    .run-row-view-details-btn {
        padding: 0.4375rem 0.75rem;
        font-size: 0.8125rem;
    }
}

/* Counts strip: light fill, top border separating it from the main line. */
.run-row-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    padding: 0.625rem 1rem;
    background-color: #f8f9fc;
    border-top: 1px solid #dee2e6;
    font-size: 0.875rem;
    color: #6c757d;
}

.run-count-pass {
    font-weight: 700;
    color: #16a34a;
}

.run-count-attention {
    font-weight: 700;
    color: #d97706;
}

.run-count-critical {
    font-weight: 700;
    color: #dc2626;
}

/* Dark mode. */
[data-skin=dark] .run-history-title {
    color: #e9ecef;
}

[data-skin=dark] .run-row {
    background-color: #1f1f1f;
    border-color: #343a40;
}

[data-skin=dark] .run-row-icon {
    background-color: #2a2a2a;
    color: #4da3ff;
}

[data-skin=dark] .run-row-when {
    color: #e9ecef;
}

[data-skin=dark] .run-row-by {
    color: #adb5bd;
}

[data-skin=dark] .run-row-counts {
    background-color: #161616;
    border-top-color: #343a40;
}

/* Mobile: tighten the whole Run History page so nothing wraps — a one-line
   "Inspection History" title beside a shortened "Export", the inspection name
   emphasized over a slightly smaller subtitle, and a compact date row with a
   smaller calendar badge so the date/time fits on one line. */
@media (max-width: 575.98px) {
    /* Guaranteed minimum gap between the title and the Export button — without
       it, a title this long sits flush against the button on narrow phones. */
    .run-history-page-header {
        gap: 0.625rem;
    }

    .inspection-detail-topbar {
        min-width: 0;
    }

    .run-history-page-title {
        font-size: 1.125rem;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .run-history-export-btn {
        padding: 0.5rem 0.75rem;
        flex-shrink: 0;
    }

    .run-history {
        padding: 0 0.85rem 0.5rem;
    }

    .run-history-header {
        padding: 1rem 0 0.75rem;
    }

    .run-history-title {
        font-size: 1.5rem;
    }

    .run-history-subtitle {
        font-size: 0.75rem;
    }

    .run-row-main {
        gap: 0.5rem;
        padding: 0.75rem;
    }

    .run-row-icon {
        width: 30px;
        height: 30px;
    }

    .run-row-icon svg {
        width: 17px;
        height: 17px;
    }

    /* Keep the date + time on a single line — a touch smaller with no wrapping,
       and a tighter clock-icon gap, so "Jul 14, 2026 at 9:00 AM" fits one row. */
    .run-row-when {
        font-size: 0.8125rem;
        white-space: nowrap;
    }

    .run-row-when svg {
        width: 14px;
        height: 14px;
        margin-right: 0.25rem;
    }

    .run-row-by {
        font-size: 0.8125rem;
    }

    .run-row-counts {
        gap: 0.85rem;
        font-size: 0.8125rem;
    }
}

/* ============================================================================
   Inspection History — run detail (US-9.1)
   Read-only page: inspection name + when it ran, then an "Inspection Summary"
   section with the Pass/Needs Attention/Critical counts, inspector, duration,
   location and wash bay/area.
   ========================================================================== */
.run-detail {
    padding: 1rem 1rem 0.5rem;
}

.run-detail-heading {
    margin-bottom: 1rem;
}

.run-detail-title {
    margin: 0 0 0.25rem;
    font-size: 1.375rem;
    font-weight: 700;
    color: #212529;
}

.run-detail-when {
    display: inline-flex;
    align-items: center;
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.run-summary {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #f8f9fc;
    padding: 1rem 1.25rem;
}

.run-summary-title {
    margin: 0 0 0.875rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: #212529;
}

.run-summary-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 0.75rem;
}

.run-summary-card {
    background-color: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.875rem 1rem;
}

.run-summary-label {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin: 0 0 0.625rem;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #6c757d;
}

.run-summary-total {
    text-transform: none;
    letter-spacing: normal;
    font-weight: 500;
    color: #adb5bd;
}

.run-summary-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    font-size: 0.875rem;
    color: #6c757d;
}

.run-summary-count {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.run-summary-count-value {
    font-weight: 700;
    font-size: 1.125rem;
}

.run-summary-inspector {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

/* 86e38wwrc: a profile picture with a transparent background composited onto whatever card it
   happened to sit on. A photo is a photo — it gets its own white ground, so a logo uploaded as a
   transparent PNG looks the same wherever it appears. Scoped to `img` so the initials variant,
   which shares this class and carries its own colour, is untouched. */
img.run-summary-avatar {
    background: #fff;
}

.run-summary-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.run-summary-avatar-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #eef2ff;
    color: #4f46e5;
    font-size: 0.75rem;
    font-weight: 700;
}

.run-summary-inspector-name {
    font-weight: 600;
    color: #212529;
}

/* White footer bar, visually separated from the #f8f9fc summary box above it —
   bleeds to the box's edges/bottom corners since .run-summary has its own padding. */
.run-summary-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    margin: 0.875rem -1.25rem -1rem;
    padding: 0.875rem 1.25rem 1rem;
    border-top: 1px solid #dee2e6;
    border-radius: 0 0 0.375rem 0.375rem;
    background-color: #fff;
    font-size: 0.875rem;
    color: #6c757d;
}

.run-summary-meta-item {
    display: inline-flex;
    align-items: center;
}

.run-summary-meta-item strong {
    margin-left: 0.25rem;
    color: #212529;
    font-weight: 600;
}

/* Dark mode. */
[data-skin=dark] .run-detail-title,
[data-skin=dark] .run-summary-title,
[data-skin=dark] .run-summary-inspector-name,
[data-skin=dark] .run-summary-meta-item strong {
    color: #e9ecef;
}

[data-skin=dark] .run-summary {
    background-color: #161616;
    border-color: #343a40;
}

[data-skin=dark] .run-summary-card {
    background-color: #1f1f1f;
    border-color: #343a40;
}

[data-skin=dark] .run-summary-avatar-initials {
    background-color: #312e81;
    color: #c7d2fe;
}

[data-skin=dark] .run-summary-meta {
    background-color: #1f1f1f;
    border-top-color: #343a40;
}

/* Mobile: keep the run detail (View Details) page from wrapping awkwardly —
   emphasize the inspection name/date, shrink the summary counts + padding so
   they hold one line, stack Duration/Location/Wash Bay cleanly (all three, never
   two-on-one), and keep the Inspection Items tabs on a single scrollable row. */
@media (max-width: 575.98px) {
    .run-detail {
        padding: 1rem 0.85rem 0.5rem;
    }

    .run-detail-title {
        font-size: 1.5rem;
    }

    .run-detail-when {
        font-size: 0.9375rem;
    }

    .run-summary {
        padding: 0.85rem;
    }

    .run-summary-card {
        padding: 0.75rem;
    }

    .run-summary-counts {
        gap: 0.6rem;
        font-size: 0.75rem;
    }

    .run-summary-count {
        gap: 0.25rem;
    }

    .run-summary-count-value {
        font-size: 0.9375rem;
    }

    /* Bleed offsets must match the reduced .run-summary padding above. */
    .run-summary-meta {
        flex-direction: column;
        gap: 0.5rem;
        margin: 0.85rem -0.85rem -0.85rem;
        padding: 0.85rem;
        font-size: 0.8125rem;
    }

    .run-items-head {
        padding: 0.85rem;
    }

    .run-items-title {
        font-size: 1.0625rem;
    }

    /* One scrollable row instead of wrapped tab chips. */
    .run-items-tabs {
        display: flex;
        flex-wrap: nowrap;
        width: 100%;
        overflow-x: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .run-items-tabs::-webkit-scrollbar {
        display: none;
    }

    .run-items-tab {
        padding: 0.3rem 0.55rem;
        font-size: 0.75rem;
    }

    .run-item {
        padding: 0.85rem;
    }
}

/* ----------------------------------------------------------------------------
   Inspection Items section (US-9.2): All/Passed/Needs Attention/Critical filter
   tabs over the run's recorded items, each with status badge, note and photos.
   -------------------------------------------------------------------------- */
.run-items {
    margin-top: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    overflow: hidden;
}

.run-items-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background-color: #f8f9fc;
    border-bottom: 1px solid #dee2e6;
}

.run-items-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: #212529;
}

/* Segmented control: grey track, active tab a raised white chip. */
.run-items-tabs {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0.25rem;
    background-color: #f1f3f9;
    border-radius: 0.375rem;
}

.run-items-tab {
    border: 0;
    background: transparent;
    padding: 0.3rem 0.75rem;
    border-radius: 0.3rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #6c757d;
    cursor: pointer;
    white-space: nowrap;
}

.run-items-tab:hover {
    color: #212529;
}

.run-items-tab.is-active {
    background-color: #fff;
    color: #212529;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.run-items-list {
    display: flex;
    flex-direction: column;
}

.run-item {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #eef0f4;
}

.run-item:last-child {
    border-bottom: 0;
}

.run-item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.run-item-name {
    font-weight: 600;
    color: #212529;
}

.run-item-tags {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    flex-shrink: 0;
}

.run-item-ago {
    font-size: 0.75rem;
    color: #6c757d;
    background-color: #f1f3f9;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    white-space: nowrap;
}

.run-item-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    white-space: nowrap;
}

.run-item-badge--pass {
    color: #16a34a;
    background-color: #dcfce7;
}

.run-item-badge--attention {
    color: #b45309;
    background-color: #fef3c7;
}

.run-item-badge--critical {
    color: #dc2626;
    background-color: #fee2e2;
}

.run-item-note {
    margin: 0.5rem 0 0;
    font-size: 0.875rem;
    color: #495057;
}

.run-item-photos {
    margin-top: 0.625rem;
}

.run-item-photos-label {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.375rem;
}

.run-item-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.run-item-thumb {
    display: inline-flex;
    width: 64px;
    height: 64px;
    border-radius: 0.375rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.run-item-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Dark mode. */
[data-skin=dark] .run-items {
    background-color: #1f1f1f;
    border-color: #343a40;
}

[data-skin=dark] .run-items-head {
    background-color: #161616;
    border-bottom-color: #343a40;
}

[data-skin=dark] .run-items-title,
[data-skin=dark] .run-item-name {
    color: #e9ecef;
}

[data-skin=dark] .run-items-tabs {
    background-color: #161616;
}

[data-skin=dark] .run-items-tab.is-active {
    background-color: #2b2b2b;
    color: #e9ecef;
}

[data-skin=dark] .run-item {
    border-bottom-color: #2b2b2b;
}

[data-skin=dark] .run-item-ago {
    background-color: #161616;
    color: #adb5bd;
}

[data-skin=dark] .run-item-note {
    color: #adb5bd;
}

[data-skin=dark] .run-item-thumb {
    border-color: #343a40;
}

/* ============================================================================
   Focused inspection workspace — editing/performing a single inspection.
   The controller sets @inspection_fullscreen, which adds `sidebar-hide`
   (existing theme class: slides the left nav off, expands header + main to full
   width) and `inspection-fullscreen` to <body>. Here we also strip the
   dashboard chrome so the inspection fills the width edge-to-edge, matching the
   dedicated-page design. All scoped to .inspection-fullscreen so nothing else
   is affected.
   ========================================================================== */

/* Full-bleed: drop the .main-app content padding so the detail card reaches the
   viewport edges (under the fixed 72px top bar and to the right of nothing). */
.inspection-fullscreen .main.main-app {
    padding: 0 !important;
}

/* The detail card is no longer a rounded, bordered container — it's the page. */
.inspection-fullscreen-card {
    border: 0;
    border-radius: 0;
    margin-bottom: 0;
}

/* The perform bar normally uses negative margins to break out of .main-app's
   padding; with that padding removed in fullscreen those would overshoot the
   viewport, so neutralize them (it's already full-bleed here). */
.inspection-fullscreen .inspection-perform-bar {
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
}

/* WashUp brand in the top bar — hidden by default, revealed only in the focused
   workspace (where the sidebar, its usual home, is hidden). */
.fullscreen-brand {
    display: none;
}

.inspection-fullscreen .fullscreen-brand {
    display: inline-flex;
}

/* Pin the brand logo to a fixed, non-distorting size. logo.svg carries absolute
   4in×1in intrinsic dimensions, which some engines render oversized when only
   the HTML height attribute is set — lock the height in CSS (width auto keeps the
   4:1 ratio) so it can never balloon (the "huge logo" on the focused inspection
   page). Sized to match the sidebar's brand logo on the normal pages, so the
   focused inspection workspace looks consistent with the rest of the app — the
   72px top bar centers it with room to spare. */
.fullscreen-brand img {
    height: 40px;
    width: auto;
}

/* Focused workspace: the left nav is hidden here, so the hamburger only serves to
   summon it back (its full-height sidebar + 80%-width logo is the "chaotic/huge
   logo" the user reported). Hide it — the in-card back arrow is the way out. */
.inspection-fullscreen #menuSidebar {
    display: none;
}

/* The mobile top bar normally shows a centered brand icon (.d-md-none inside
   .brand-icon-centered). In the focused workspace the left-aligned .fullscreen-brand
   already provides the brand, so this would render a SECOND logo on mobile — hide
   it so only one logo shows across desktop, tablet and mobile. */
.inspection-fullscreen .brand-icon-centered {
    display: none;
}

/* ============================================================================
   US-11.1 — Sticky top bar while performing an inspection.
   Shown by the inspections-perform-bar controller on "Start Inspection": name +
   bay, a progress counter and MM:SS timer, Cancel / Save, and a progress bar.
   Sits below the fixed 72px app navbar; on mobile the actions move to a fixed
   bottom bar. Lives outside the .card (whose overflow:hidden would clip sticky).
   ========================================================================== */
.inspection-perform-bar {
    position: sticky;
    top: 72px;
    z-index: 700;
    background-color: #fff;
    /* Full-bleed: break out of .main-app's padding (p-2 = 0.5rem) so the bar
       spans the whole content width and sits flush under the 72px navbar. */
    margin: -0.5rem -0.5rem 0.75rem;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(33, 40, 48, 0.06);
}

@media (min-width: 992px) {
    .inspection-perform-bar {
        margin: -1rem -1rem 0.75rem; /* .main-app p-lg-3 = 1rem */
    }
}

.ipb-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.625rem 1.5rem;
}

/* Titles (left) and actions (right) take equal flex space so the meta chips
   (progress + timer) sit in the true centre of the bar, per the mockup. */
.ipb-titles {
    min-width: 0;
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
}

.ipb-name {
    font-size: 1.25rem;
    font-weight: 700;
    color: #212529;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ipb-bay {
    font-size: 0.875rem;
    color: #6c757d;
}

.ipb-meta {
    display: flex;
    align-items: stretch; /* both chips take the (taller) progress chip's height */
    gap: 0.5rem;
    flex-shrink: 0;
}

.ipb-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.85rem;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    background-color: #f8f9fc;
    white-space: nowrap;
}

.ipb-chip-label {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #6c757d;
}

.ipb-chip-value {
    font-weight: 700;
    color: #212529;
    font-variant-numeric: tabular-nums;
}

/* Progress chip: "Progress" label stacked above the X/N count, centred. */
.ipb-progress-chip {
    flex-direction: column;
    gap: 0;
    align-items: center;
    line-height: 1.2;
    padding: 0.2rem 0.95rem;
    background-color: #eef1f7;
    border-color: transparent;
}

.ipb-progress-chip .ipb-chip-value {
    font-size: 1rem;
}

/* Timer chip: same grey + height as the progress chip, with a blue stopwatch. */
.ipb-timer-chip {
    background-color: #eef1f7;
    border-color: transparent;
}

.ipb-timer-chip .ipb-chip-value {
    font-size: 1rem;
    letter-spacing: 0.02em;
}

.ipb-timer-icon {
    color: #0d6efd;
    flex-shrink: 0;
}

.ipb-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex: 1 1 0;
}

.ipb-btn-cancel {
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #212529;
}

.ipb-btn-cancel:hover {
    background-color: #f1f3f9;
    color: #212529;
}

.ipb-btn-save {
    background-color: #7ed98e;
    border: 1px solid #25c63f;
    color: #0b3d1f;
    font-weight: 600;
}

.ipb-btn-save:hover {
    background-color: #6fd081;
    border-color: #1fb838;
    color: #0b3d1f;
}

/* US-11.8: greyed-out, non-interactive until at least one item is marked. */
.ipb-btn-save:disabled,
.ipb-btn-save:disabled:hover {
    background-color: #e9eef7;
    border-color: #d4dbe8;
    color: #9aa5b6;
    cursor: not-allowed;
    opacity: 1;
}

/* The blue progress bar that fills as items get marked. */
.ipb-progressbar {
    height: 4px;
    background-color: #e9eef7;
}

.ipb-progressbar-fill {
    display: block;
    height: 100%;
    width: 0;
    background: linear-gradient(90deg, #0067B3 0%, #ACD7F6 50%, #3A6D93 100%);
    transition: width 0.3s ease;
}

/* Mobile fixed bottom action bar (US-11.1). Hidden on desktop/tablet. */
.inspection-perform-bottombar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 700;
    display: flex;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background-color: #fff;
    border-top: 1px solid #dee2e6;
    box-shadow: 0 -2px 8px rgba(33, 40, 48, 0.08);
}

.inspection-perform-bottombar .ipb-btn-cancel,
.inspection-perform-bottombar .ipb-btn-save {
    flex: 1 1 0;
}

/* While performing, the bar replaces the in-card topbar/header + bottom actions. */
.is-performing .inspection-detail-topbar,
.is-performing .card-header:has(.inspection-detail-topbar),
.is-performing .inspection-detail-header,
.is-performing .inspection-bottom-actions {
    display: none !important;
}

/* Desktop/tablet: actions stay in the top bar; no bottom bar. */
@media (min-width: 768px) {
    .inspection-perform-bottombar {
        display: none !important;
    }
}

/* Mobile: actions move to the fixed bottom bar; keep name/bay/progress/timer up
   top. Stack the meta chips next to the title so the bar stays compact. */
@media (max-width: 767.98px) {
    .inspection-perform-bar .ipb-actions {
        display: none;
    }

    /* Tighter side padding + smaller title so a long inspection name reads on
       one line instead of crowding / wrapping the progress + timer chips. */
    .ipb-row {
        flex-wrap: wrap;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .ipb-name {
        font-size: 1.0625rem;
    }

    .ipb-bay {
        font-size: 0.8125rem;
    }

    .ipb-meta {
        margin-left: auto;
    }

    /* Inset the item cards from the screen edges so they line up with the
       header's Edit List / Start Inspection row (px-3 = 1rem), per the mockup —
       the padding goes on the list container so the w-100 cards narrow to fit
       without overflowing. Vertical card spacing (m-1) is untouched. */
    .inspection_form ul.sortable {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .inspection-item-mobile {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* While performing, the fixed bottom Cancel/Save bar overlays the page.
       Pad the form so the last card's "Add Note" clears it instead of sitting
       cramped against the bottom edge. */
    .is-performing .inspection_form {
        padding-bottom: 5.5rem;
    }
}

/* Dark mode. */
[data-skin=dark] .inspection-perform-bar,
[data-skin=dark] .inspection-perform-bottombar {
    background-color: #1f1f1f;
    border-color: #343a40;
}

[data-skin=dark] .inspection-perform-bottombar {
    border-top-color: #343a40;
}

[data-skin=dark] .ipb-name,
[data-skin=dark] .ipb-chip-value {
    color: #e9ecef;
}

[data-skin=dark] .ipb-chip {
    background-color: #161616;
    border-color: #343a40;
}

[data-skin=dark] .ipb-btn-cancel {
    background-color: #2b2b2b;
    border-color: #343a40;
    color: #e9ecef;
}

[data-skin=dark] .ipb-progressbar {
    background-color: #161616;
}

[data-skin=dark] .ipb-btn-save:disabled,
[data-skin=dark] .ipb-btn-save:disabled:hover {
    background-color: #2b2b2b;
    border-color: #343a40;
    color: #6c757d;
}

/* ============================================================================
   All Attention Items — card redesign (US-8.x)
   Full-width summary card per item: title + bay·time, priority/progress/status
   badges, collapsible body, and a footer with Activity / inline assignment.
   ========================================================================== */
.attention-card {
    background-color: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 1rem 1.25rem;
    margin: 0.75rem 1rem;
    overflow: visible;
}

/* The Services-style date headers span the full content width, but the attention
   cards below carry a 1rem horizontal margin. Inset the header to match so their
   left/right edges line up. (Cards keep their own margin — don't add it to
   .services-for-date or they'd double-inset.) */
.inspections-content .services-date-header {
    margin-left: 1rem;
    margin-right: 1rem;
}

.attention-card--clickable {
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.attention-card--clickable:hover {
    border-color: #0067b3;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.08);
}

.attention-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.attention-card-title {
    display: inline-block;
    font-size: 1.0625rem;
    font-weight: 700;
    color: #212529;
    text-decoration: none;
}

a.attention-card-title:hover {
    color: #0067b3;
    text-decoration: none;
}

.attention-card-subtitle {
    margin-top: 0.15rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

.attention-card-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-shrink: 0;
}

.attention-card-pill {
    font-weight: 500;
}

.attention-card-status {
    padding: 0.35rem 0.85rem;
    font-size: 0.85rem;
    font-weight: 600;
}

.attention-card-body {
    margin-top: 0.65rem;
}

.attention-card-desc {
    font-size: 1rem;
    font-weight: 500;
    color: #343a40;
    line-height: 1.5;
}

.attention-card-desc + .attention-card-desc {
    margin-top: 0.35rem;
}

.attention-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.9rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
}

.attention-card-activity {
    font-size: 0.8125rem;
    color: #6c757d;
    text-decoration: none;
}

.attention-card-activity:hover {
    color: #0067b3;
    text-decoration: underline;
}

/* The attention card footer reuses the shared compact assign-to dropdown
   (shared/_assign_to_dropdown). Size the trigger to its content and left-align
   it so it reads like the Services card's Assign To button instead of the
   full-width compact pill used in Tasks rows. */
.attention-card-foot-end .assigned-dropdown {
    width: auto;
    max-width: 240px;
}

.attention-card-foot-end .assigned-dropdown-compact-trigger {
    width: auto;
    justify-content: flex-start;
}

/* Compact inline-assignment control (reuses the assigned-dropdown controller
   + assign_to.css menu, restyled to a button-sized trigger for the footer). */
.attention-card-assign {
    position: relative;
    width: auto;
}

.attention-card-assign-btn,
.attention-card-assign-readonly {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    color: #495057;
    font-size: 0.875rem;
    line-height: 1.2;
    white-space: nowrap;
}

.attention-card-assign-btn {
    cursor: pointer;
}

.attention-card-assign-btn:hover {
    border-color: #adb5bd;
}

.attention-card-assign-text.is-placeholder,
.attention-card-assign-readonly.is-placeholder {
    color: #6c757d;
}

.attention-card .assigned-user-avatar-sm {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
}

.attention-card .assigned-user-initials {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #0067b3;
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
}

/* Dark theme */
[data-skin=dark] .attention-card {
    background-color: #1f1f1f;
    border-color: #343a40;
}

[data-skin=dark] .attention-card--clickable:hover {
    border-color: #0067b3;
}

[data-skin=dark] .attention-card-title {
    color: #e9ecef;
}

[data-skin=dark] .attention-card-desc {
    color: #ced4da;
}

[data-skin=dark] .attention-card-foot {
    border-top-color: #343a40;
}

[data-skin=dark] .attention-card-pill {
    background-color: #161616;
    border-color: #343a40;
    color: #e9ecef;
}

[data-skin=dark] .attention-card-assign-btn,
[data-skin=dark] .attention-card-assign-readonly {
    background-color: #161616;
    border-color: #343a40;
    color: #e9ecef;
}

/* ------------------------------------------------------------------------
   MOBILE — attention item cards (All Attention Items list). These reuse the
   Services `.mobile-service-*` / `.mobile-meta-badge` classes so the two pages
   match; only the reported note + the photo/video grid are inspection-specific.
   ------------------------------------------------------------------------ */

/* Reported note text on a mobile attention card. */
.attention-mobile-desc {
    font-size: 0.875rem;
    color: #4b5563;
    line-height: 1.5;
    margin-top: 0.25rem;
}

/* Photo/video grid — up to 2 tiles per row, each ~50% width, wrapping to a new
   row beyond two (matches the Services/Figma mobile layout). */
.attention-mobile-media {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
    margin-top: 0.625rem;
}

.attention-mobile-media-tile {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
    background-color: #f1f3f5;
}

.attention-mobile-media-tile img,
.attention-mobile-media-tile video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.attention-mobile-media-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.5);
}

.attention-mobile-media-file {
    text-decoration: none;
    padding: 0.5rem;
}

/* Legacy inline actions (no detail page): sit below the assign control. */
.mobile-attention-legacy-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.5rem;
}

[data-skin=dark] .attention-mobile-desc {
    color: #c7c7c7;
}

[data-skin=dark] .attention-mobile-media-tile {
    background-color: #2a2a2a;
    border-color: #4f4f4f;
}

/* Vertical break between list-editing actions and the primary Start Inspection
   button in the inspection detail header (US-8.x). */
.insp-header-divider {
    width: 1px;
    align-self: stretch;
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    background-color: #dee2e6;
}

[data-skin=dark] .insp-header-divider {
    background-color: #4f4f4f;
}

/* ------------------------------------------------------------------------
   MOBILE — inspection detail header + read-only/perform item cards.
   Long inspection names were cramping the Edit List / Start Inspection
   buttons; on phones the name drops to its own line and the actions move to
   a full-width row below (Start Inspection wider than Edit List), closed off
   by a line break that reads as "top of the list".
   ------------------------------------------------------------------------ */
@media (max-width: 575.98px) {
    .inspection-detail-header {
        flex-wrap: wrap;
        padding-bottom: 1rem;
        position: relative;
    }

    /* The line break under the buttons is only as wide as the cards below
       (inset 1rem each side to match the header content + the list gutter),
       not edge-to-edge. */
    .inspection-detail-header::after {
        content: "";
        position: absolute;
        left: 1rem;
        right: 1rem;
        bottom: 0;
        border-bottom: 1px solid #dee2e6;
    }

    /* Inspection name on its own line. */
    .inspection-detail-header > .me-auto {
        flex: 0 0 100%;
        margin-bottom: 0.75rem;
    }

    /* Actions drop to a full-width second row. */
    .inspection-detail-header > .d-flex {
        flex: 0 0 100%;
        width: 100%;
        gap: 0.75rem;
    }

    /* Vertical divider between Edit List and Start Inspection (per Figma). It
       sits between the two buttons in the shared row; the row's gap gives it
       breathing space, and align-self keeps it the buttons' height. */
    .inspection-detail-header .insp-header-divider {
        display: block;
        align-self: stretch;
        flex: 0 0 1px;
        margin: 0.25rem 0 !important;
    }

    /* Each visible action shares the row; hidden (d-none) buttons take no
       space, so Edit List + Start (or Cancel + Save in edit mode) stay
       balanced with Start Inspection the widest. Content is centered so the
       button labels (esp. Start Inspection) sit in the middle, not flush left. */
    .inspection-detail-header > .d-flex > .btn {
        flex: 1 1 0;
        margin: 0 !important;
        white-space: nowrap;
        justify-content: center;
    }

    .inspection-detail-header > .d-flex > .start-inspection-button {
        flex: 2 1 0;
    }

    [data-skin=dark] .inspection-detail-header::after {
        border-bottom-color: #4f4f4f;
    }
}

/* Break between the name/photo row and the status row — the mockup shows plain
   spacing here (no visible rule), so this is a pure spacer. */
.inspection-item-mobile {
    overflow: hidden;
}

/* Per the Figma: a GREY header (#faf9fc) holds the name + photo + R/Y/G /
   numeric status, with a full-width line break between the name and the status
   controls, over a WHITE body (criteria + note). The grey→white boundary is the
   header's bottom border. */
.inspection-item-mobile-header {
    background-color: #faf9fc;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #dee2e6;
}

.inspection-item-mobile-body {
    background-color: #fff;
    padding: 0.875rem 1rem;
}

/* Full-width line break between the name and the status controls, inside the
   grey header. Negative margins cancel the header's 1rem padding so it spans the
   full card width. */
.inspection-item-mobile-divider {
    margin: 0.75rem -1rem;
    border-top: 1px solid #dee2e6;
}

/* Criteria sits on the white body — no background of its own. */
.inspection-item-mobile-criteria {
    width: 100%;
    color: #495057;
}

/* Mobile R/Y/G buttons match the numeric status chip's size (same 0.6rem tall
   padding, 0.5rem radius and 1rem text) so a marked radio item and a numeric
   item read identically across cards. */
.inspection-item-mobile .inspection-status .btn-secondary {
    border-radius: 0.5rem;
}

.inspection-item-mobile .inspection-status label {
    padding: 0.6rem 0.5rem !important;
    border-radius: 0.5rem;
    font-size: 1rem;
}

[data-skin=dark] .inspection-item-mobile-header {
    background-color: #181818;
    border-bottom-color: #343a40;
}

[data-skin=dark] .inspection-item-mobile-body {
    background-color: #1f1f1f;
}

[data-skin=dark] .inspection-item-mobile-divider {
    border-top-color: #343a40;
}

[data-skin=dark] .inspection-item-mobile-criteria {
    color: #c7c7c7;
}

/* The US-7.2 Edit Image crop/zoom modal was removed from the inspections Edit
   List — item photos now upload at their original dimensions (see
   inspections_item_edit_controller#photoChosen). Services keeps its own editor. */

/* ============================================================
   "NOTES REQUIRED BEFORE SAVING" MODAL (Save-blocking warning)
   Reuses the Services .mark-complete-* shell; only the dark warning icon, the
   "Items missing notes" bullet list, and the full-width primary button are
   inspection-specific.
   ============================================================ */
.inspection-notes-required-icon svg {
    color: #1f2937;
}

.inspection-notes-required-list-label {
    font-size: 0.875rem;
    font-weight: 700;
    color: #1f2937;
    margin: 0 0 6px 0;
}

.inspection-notes-required-list {
    margin: 0;
    padding-left: 1.25rem;
    list-style: disc;
}

.inspection-notes-required-item {
    font-size: 0.875rem;
    color: #364153;
    line-height: 1.6;
}

.inspection-notes-required-item::marker {
    color: #6a7282;
}

/* Full-width primary acknowledgment button (matches the design). Inherits the
   app's btn-primary brand blue + hover; only sizing is overridden. */
.inspection-notes-required-ack {
    width: 100%;
    height: 48px;
    border-radius: 8px;
    font-size: 0.9375rem;
    font-weight: 600;
}

[data-skin=dark] .inspection-notes-required-icon svg {
    color: #e9ecef;
}

[data-skin=dark] .inspection-notes-required-list-label {
    color: #e9ecef;
}

[data-skin=dark] .inspection-notes-required-item {
    color: #ced4da;
}

/* ------------------------------------------------------------------------
   MOBILE — inspection "Edit List" item cards.
   The desktop card is a two-column body (188px reference-photo column +
   criteria editor). On phones that leaves custom-item names, the Quill editor,
   and the photo controls badly cramped. Per the mockups, on mobile:
     • the tag ("Custom" / "My Wash") sits on its own line above the item name,
       so the name/input spans the full width (Remove stays top-right);
     • the criteria editor takes the full width first;
     • the reference photo becomes a compact horizontal row below it — small
       thumbnail + "Image attached" / "No image attached" label + pencil/trash
       icon buttons (delete greyed while empty).
   Structure/JS are unchanged; this is layout only.
   ------------------------------------------------------------------------ */
@media (max-width: 575.98px) {
    /* --- header: tag above, name full-width, Remove top-right --- */
    .edit-item-header {
        flex-wrap: wrap;
        row-gap: 0.5rem;
    }

    .edit-item-handle { order: 0; }
    .edit-item-tag,
    .edit-item-header .inspections-mywash-badge { order: 1; }
    .edit-item-remove { order: 2; margin-left: auto; }

    /* Name (custom input or My Wash label) drops to its own full-width line. */
    .edit-item-name-input,
    .edit-item-name {
        order: 3;
        flex: 0 0 100%;
        max-width: 100%;
    }

    /* --- body: stack, criteria first then the photo row --- */
    .edit-item-body {
        flex-direction: column;
        gap: 0.875rem;
        padding: 1rem;
    }

    .edit-item-criteria-col { order: 1; }

    .edit-item-photo-col {
        order: 2;
        width: 100%;
        flex-direction: row;
        align-items: center;
        gap: 0.625rem;
        padding: 0.625rem 0.75rem;
    }

    /* Thumbnail shrinks to a fixed square at the row's left. */
    .edit-item-photo-box {
        flex: 0 0 auto;
        width: 44px;
        height: 44px;
        border-radius: 0.375rem;
    }

    /* Empty state: dashed outline + smaller camera glyph (per mockup). */
    .edit-item-photo-box.is-empty {
        border-style: dashed;
        border-color: #ced4da;
        background-color: #f8f9fc;
    }

    .edit-item-photo-box.is-empty .material-icons {
        font-size: 1.375rem;
    }

    /* Status label fills the middle, pushing the icon buttons to the right. */
    .edit-item-photo-label {
        display: block;
        flex: 1 1 auto;
        min-width: 0;
        font-size: 0.9375rem;
        color: #212529;
    }

    .edit-item-photo-label-none { display: none; }
    .edit-item-photo-box.is-empty ~ .edit-item-photo-label .edit-item-photo-label-has { display: none; }
    .edit-item-photo-box.is-empty ~ .edit-item-photo-label .edit-item-photo-label-none { display: block; }

    /* Edit / Remove collapse to borderless icon buttons. */
    .edit-item-photo-btn {
        flex: 0 0 auto;
        width: auto;
        padding: 0.25rem;
        border: 0;
        background-color: transparent;
    }

    .edit-item-photo-btn:hover,
    .edit-item-photo-btn.text-danger:hover {
        background-color: transparent;
    }

    .edit-item-photo-btn .edit-item-photo-btn-label { display: none; }

    .edit-item-photo-btn .material-icons {
        margin-right: 0 !important;
        font-size: 1.25rem !important;
    }

    /* Nothing to delete while empty — grey the trash out. */
    .edit-item-photo-box.is-empty ~ .edit-item-photo-btn.text-danger {
        color: #ced4da !important;
        pointer-events: none;
    }

    [data-skin=dark] .edit-item-photo-label { color: #e9ecef; }

    [data-skin=dark] .edit-item-photo-box.is-empty {
        border-color: #4f4f4f;
        background-color: #161616;
    }
}
/* ============================================================================
   My Wash (MyWash 2.0)

   Contains two things:
     1. A generic right-side drawer primitive (.drawer-*). The app had no drawer/offcanvas
        primitive of its own — the Inspections filters panel is the same construction but
        namespaced to filters. These classes are deliberately feature-neutral so later MyWash
        work (COPY, WIZ) and other features can reuse them; hoist them out of this file if a
        third feature adopts them.
     2. The Manage Bays drawer contents (BAY-1 reorder, BAY-2 rename, BAY-3 delete).

   Bootstrap's Offcanvas is intentionally NOT used: application.js's Turbo cleanup layer handles
   Modal/Dropdown/Tooltip/Popover/Tab but not Offcanvas, so a cached-and-restored open offcanvas
   strands its backdrop. Plain class toggling plus a turbo:before-cache close avoids that.
   ============================================================================ */

/* ----------------------------------------------------------------------------
   Drawer primitive
   ---------------------------------------------------------------------------- */
.drawer-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1040;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.drawer-overlay.show {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.drawer-panel {
    position: fixed;
    top: 0;
    bottom: 0;
    right: -460px;
    width: 460px;
    max-width: 100%;
    background: #fff;
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.1);
    z-index: 1050;
    transition: right 0.3s ease;
    display: flex;
    flex-direction: column;
}

.drawer-panel.show {
    right: 0;
}

/* One mode of the panel: the bay list, or the copy flow (COPY-6). Exactly one is ever visible, and
   the visible one has to fill the panel the same way the form used to when it was the only child. */
.drawer-mode {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.drawer-mode[hidden] {
    display: none;
}

/* The panel's only flex child is the <form> wrapping header/body/footer, so the form has to be
   BOTH a filling flex item and a column flex container. Without this, .drawer-body's `flex: 1`
   and `overflow-y: auto` have no flex parent to resolve against: the form grows to its content
   instead of the panel's height, the body never scrolls, and a bay list longer than the viewport
   pushes the footer — Cancel and Save Changes — off the bottom of the screen. */
.drawer-panel > form,
.drawer-mode > form,
.drawer-mode > .copy-flow,
.drawer-mode > .copy-flow > form {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    /* The theme gives every <form> a 14px bottom margin, which would leave a strip of bare panel
       under the footer. */
    margin-bottom: 0;
}

body.drawer-open {
    overflow: hidden;
}

.drawer-header {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 1.25rem 1.25rem 1rem;
    background: #f8f9fc;
    border-bottom: 1px solid #dee2e6;
    flex-shrink: 0;
}

.drawer-title {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.drawer-subtitle {
    font-size: 0.875rem;
    color: #6c757d;
    margin: 0.25rem 0 0;
}

.drawer-close {
    margin-left: auto;
    padding: 0.125rem;
    border: none;
    background: transparent;
    color: #6c757d;
    line-height: 0;
}

.drawer-close:hover {
    color: #212529;
}

.drawer-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 1rem 1.25rem;
}

.drawer-footer {
    display: flex;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background: #f8f9fc;
    border-top: 1px solid #dee2e6;
    flex-shrink: 0;
}

.drawer-footer > .btn {
    flex: 1;
}

@media (max-width: 767.98px) {
    .drawer-panel {
        width: 100%;
        right: -100%;
    }
}

/* ----------------------------------------------------------------------------
   Manage Bays drawer — add a bay (BAY-6)

   Sits above the list: a full-width trigger that expands the two creation paths (Create Blank /
   Duplicate from Location), as in the prototype. The menu is absolutely positioned so opening it
   does not push the bay list down.
   ---------------------------------------------------------------------------- */
.bay-manage-add {
    position: relative;
    margin-bottom: 0.75rem;
}

.bay-manage-add-trigger {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: #212529;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.bay-manage-add-trigger:hover,
.bay-manage-add-trigger:focus-visible {
    background: #f8f9fc;
}

.bay-manage-add-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    flex-shrink: 0;
    color: #fff;
    background: #0067b3;
    border-radius: 0.375rem;
}

.bay-manage-add-label {
    font-weight: 500;
}

.bay-manage-add-caret {
    display: inline-flex;
    margin-left: auto;
    color: #0067b3;
    transition: transform 0.2s ease;
}

.bay-manage-add-trigger[aria-expanded="true"] .bay-manage-add-caret {
    transform: rotate(180deg);
}

.bay-manage-add-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% - 2px);
    z-index: 2;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

.bay-manage-add-option {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 0.875rem;
    text-align: left;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #f1f3f5;
}

.bay-manage-add-option:last-child {
    border-bottom: 0;
}

.bay-manage-add-option:hover,
.bay-manage-add-option:focus-visible {
    background: #f8f9fc;
}

.bay-manage-add-option-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    flex-shrink: 0;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.bay-manage-add-option-title {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.bay-manage-add-option-hint {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
}

/* ----------------------------------------------------------------------------
   Bay selector (BAY-8)

   Replaces the horizontal bay tab strip. Sizing follows the app's form-control conventions
   (~38px, 0.375rem radius, #dee2e6 border) so it sits level with "Edit Wash Bays/Areas".
   ---------------------------------------------------------------------------- */

/* The theme sets `overflow: hidden` on .card, which clips the open menu. Scoped with :has() to
   the card holding a selector, per the pattern in CLAUDE.md — do NOT drop the global rule. */
.card:has(.bay-selector),
.card:has(.bay-selector) .card-body {
    overflow: visible !important;
}

.bay-selector-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    color: #212529;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.bay-selector-toggle:hover,
.bay-selector-toggle:focus-visible {
    color: #212529;
    background: #f8f9fc;
    border-color: #dee2e6;
}

.bay-selector-toggle[aria-expanded="true"] {
    border-color: #0067b3;
    color: #0067b3;
}

.bay-selector-icon {
    display: inline-flex;
    flex-shrink: 0;
    color: #6e7985;
}

.bay-selector-toggle[aria-expanded="true"] .bay-selector-icon {
    color: #0067b3;
}

.bay-selector-current {
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bay-selector-caret {
    display: inline-flex;
    flex-shrink: 0;
    margin-left: auto;
    color: #6e7985;
    transition: transform 0.2s ease;
}

.bay-selector-toggle[aria-expanded="true"] .bay-selector-caret {
    color: #0067b3;
    transform: rotate(180deg);
}

.bay-selector-menu {
    min-width: 15rem;
    max-width: min(22rem, calc(100vw - 2rem));
    padding: 0.25rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.12);
}

.bay-selector-search {
    padding: 0.25rem 0.25rem 0;
}

/* The search field's own bottom margin is the gap to the list. */
.bay-selector-search .bay-search-field {
    margin-bottom: 0.25rem;
}

.bay-selector-list {
    max-height: 18rem;
    overflow-y: auto;
}

.bay-selector-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.625rem;
    font-size: 0.9375rem;
    color: #212529;
    text-decoration: none;
    border-radius: 0.375rem;
}

.bay-selector-item:hover,
.bay-selector-item:focus-visible {
    color: #212529;
    background: #f8f9fc;
}

.bay-selector-item.is-current {
    color: #0067b3;
    font-weight: 500;
}

.bay-selector-item-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bay-selector-item-check {
    display: inline-flex;
    flex-shrink: 0;
    color: #0067b3;
}

.bay-selector-empty {
    padding: 0.75rem 0.625rem;
    font-size: 0.875rem;
    color: #6c757d;
    text-align: center;
}

/* Full width on mobile, sized to its label from the small breakpoint up. */
@media (max-width: 575.98px) {
    .bay-selector,
    .bay-selector-toggle {
        width: 100%;
    }

    .bay-selector-menu {
        max-width: none;
        width: 100%;
    }
}

/* ----------------------------------------------------------------------------
   Bay search field (BAY-7)

   Shared by every list of bays — the manage drawer today, the copy flow and the wizard's
   destination step when they land. Sizing follows the app's form-control conventions (~38px,
   0.375rem radius, #dee2e6 border) rather than the prototype's pill.
   ---------------------------------------------------------------------------- */
.bay-search-field {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    margin-bottom: 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.bay-search-field:focus-within {
    border-color: #0067b3;
}

.bay-search-icon {
    display: inline-flex;
    flex-shrink: 0;
    color: #9aa3ad;
}

.bay-search-input {
    flex: 1;
    min-width: 0;
    border: 0;
    padding: 0;
    font-size: 0.875rem;
    color: #212529;
    background: transparent;
    outline: none;
}

.bay-search-input::placeholder {
    color: #aab0bb;
}

/* The native clear affordance would sit next to our own button. */
.bay-search-input::-webkit-search-cancel-button {
    display: none;
}

.bay-search-clear {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    padding: 0;
    border: 0;
    line-height: 0;
    color: #6c757d;
    background: transparent;
}

.bay-search-clear:hover {
    color: #212529;
}

.bay-manage-hint {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 0.75rem;
}

/* ----------------------------------------------------------------------------
   Manage Bays drawer — bay rows

   Layout follows the prototype: a stacked [up / grip / down] reorder column on the left, the
   name, then the rename + delete actions. No ordinal badge and no equipment count on the row —
   the count appears only in the delete confirmation, where BAY-3 requires it.
   ---------------------------------------------------------------------------- */
.bay-manage-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.bay-manage-row {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
    cursor: grab;
}

.bay-manage-row.is-editing,
.bay-manage-row.is-deleting {
    cursor: default;
}

.bay-manage-row-main {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
}

.bay-manage-placeholder {
    border: 1px dashed #adb5bd;
    border-radius: 0.375rem;
    background: #f1f3f5;
    margin: 0;
}

/* Reorder column: up / decorative grip / down */
.bay-manage-reorder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.0625rem;
    flex-shrink: 0;
}

.bay-manage-move-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1rem;
    padding: 0;
    border: none;
    background: transparent;
    color: #adb5bd;
    line-height: 0;
}

.bay-manage-move-btn:hover:not(:disabled) {
    color: #41505f;
}

.bay-manage-move-btn:disabled {
    opacity: 0.2;
    pointer-events: none;
}

.bay-manage-handle {
    display: inline-flex;
    align-items: center;
    color: #c5cbd4;
    line-height: 0;
}

.bay-manage-name {
    flex: 1;
    min-width: 0;
    font-size: 0.9375rem;
    font-weight: 500;
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bay-manage-name-input {
    flex: 1;
    min-width: 0;
}

.bay-manage-actions {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-left: auto;
    flex-shrink: 0;
}

.bay-manage-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    color: #6c757d;
    line-height: 0;
}

.bay-manage-icon-btn:hover:not(:disabled) {
    background: #f8f9fc;
    color: #212529;
}

.bay-manage-delete-btn:hover:not(:disabled) {
    border-color: #dc3545;
    background: #fff5f5;
    color: #dc3545;
}

.bay-manage-row.is-deleting .bay-manage-delete-btn {
    border-color: #dc3545;
    background: #fff5f5;
    color: #dc3545;
}

/* Rename confirm is the one filled control in the row */
.bay-manage-rename-confirm {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 1px solid #0067b3;
    border-radius: 0.375rem;
    background: #0067b3;
    color: #fff;
    line-height: 0;
}

.bay-manage-rename-confirm:hover {
    background: #005a9e;
    border-color: #005a9e;
    color: #fff;
}

/* Duplicate name flagged client-side (BAY-2); the model validation is the real guard. */
.bay-manage-row.is-duplicate {
    border-color: #dc3545;
}

.bay-manage-error {
    display: none;
    font-size: 0.75rem;
    color: #dc3545;
    margin-top: 0.75rem;
}

.bay-manage-error.show {
    display: block;
}

.bay-manage-empty {
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #6c757d;
    text-align: center;
}

/* ----------------------------------------------------------------------------
   Delete confirmation (BAY-3) — expands inline inside the row's card
   ---------------------------------------------------------------------------- */
.bay-manage-delete-panel {
    border-top: 1px solid #ffe0de;
    background: #fff8f8;
    padding: 0.875rem 1rem;
}

.bay-manage-delete-panel[hidden] {
    display: none;
}

.bay-manage-delete-warning {
    display: flex;
    gap: 0.625rem;
    margin-bottom: 0.75rem;
}

.bay-manage-delete-warning svg {
    flex-shrink: 0;
    margin-top: 0.125rem;
    color: #dc3545;
}

.bay-manage-delete-warning p {
    margin: 0;
    font-size: 0.78125rem;
    line-height: 1.55;
    color: #b02a37;
}

.bay-manage-delete-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #b02a37;
    margin-bottom: 0.375rem;
}

.bay-manage-delete-input {
    margin-bottom: 0.75rem;
}

.bay-manage-delete-input.is-match {
    border-color: #198754;
    box-shadow: 0 0 0 0.2rem rgb(25 135 84 / 15%);
}

.bay-manage-delete-input.is-mismatch {
    border-color: #dc3545;
    box-shadow: 0 0 0 0.2rem rgb(220 53 69 / 10%);
}

.bay-manage-delete-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.bay-manage-delete-submit {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.8125rem;
    font-weight: 600;
}

.bay-manage-delete-submit:disabled {
    opacity: 0.3;
}

.bay-manage-delete-cancel {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #6c757d;
    font-size: 0.8125rem;
}

.bay-manage-delete-cancel:hover,
.bay-manage-delete-cancel:focus,
.bay-manage-delete-cancel:active {
    background: #f8f9fc;
    border-color: #dee2e6;
    color: #212529;
}


/* ----------------------------------------------------------------------------
   Manage Bays trigger, in the My Wash tab strip
   ---------------------------------------------------------------------------- */
/* 86e36t2z1: sized and coloured off the prototype — 40px tall on 16px side padding, a 14px/500
   label in #41505f on white, 8px icon gap. It was a 35px, weight-400, grey-on-transparent
   control, which read as disabled next to the primary button beside it.
   Radius stays the app's 0.375rem rather than the prototype's 10px: app convention wins on
   shared control shape (see docs/mywash-2.0/ui-parity/README.md "Decisions taken"). */
.bay-manage-trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 40px;
    padding: 0 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #41505f;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
    white-space: nowrap;
}

.bay-manage-trigger:hover {
    background: #f8f9fc;
    border-color: #c9d2dc;
    color: #212830;
}

/* The Sort / Options pair beside the search box. Same treatment at the prototype's 38px, and
   deliberately NOT .btn-outline-secondary .btn-sm — that combination is 8px short and carries
   the theme's white-text-on-hover bug (CLAUDE.md). */
/* ----------------------------------------------------------------------------
   86e38wttr — the equipment toolbar row: one set of metrics, and a rule under it

   The four control types in this row came from three different sources: .bay-selector-toggle's
   own rule, the theme's Bootstrap .form-control for the search input (which had no rule of its
   own at all), and .bay-equipment-toolbar-btn for Sort/Options. Measured, they disagreed on all
   three things you notice at a glance — height (38 / 36 / 38 desktop, 44 / 44 / 38 mobile),
   border colour (#dee2e6 / #ccd2da / #e2e5ec) and radius (6 / 4 / 6px). The prototype draws every
   one of them identically.

   Radius is CLAUDE.md's 0.375rem rather than the prototype's `rounded-lg` (8px): the ask is that
   they MATCH each other, and the app's own value does that without putting this row out of step
   with Tasks and Services.

   Height stays 38px here and is lifted to the 44px tap floor by the MOB-1 block below, which is
   where every other My Wash control gets the same treatment.
   ---------------------------------------------------------------------------- */
.bay-equipment-toolbar-row .bay-selector-toggle,
.bay-equipment-toolbar-row .bay-equipment-search-input,
.bay-equipment-toolbar-row .bay-equipment-toolbar-btn {
    height: 38px;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

/* The rule between the controls and the equipment list, as the prototype's control row carries
   (`border-b border-[#e2e5ec]`). Inset with the row's own mx-3 so it lines up with the list. */
.bay-equipment-toolbar-row {
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e2e5ec;
}

.bay-equipment-toolbar-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 38px;
    padding: 0 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #41505f;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
    white-space: nowrap;
}

.bay-equipment-toolbar-btn:hover,
.bay-equipment-toolbar-btn:focus,
.bay-equipment-toolbar-btn[aria-expanded="true"] {
    color: #212830;
    background: #f8f9fc;
    border-color: #c9d2dc;
}

.bay-equipment-toolbar-btn svg {
    flex-shrink: 0;
    color: #6e7985;
}

[data-skin=dark] .bay-manage-trigger,
[data-skin=dark] .bay-equipment-toolbar-btn {
    color: #d4dae1;
    background: #2e3641;
    border-color: #3a4450;
}

[data-skin=dark] .bay-manage-trigger:hover,
[data-skin=dark] .bay-equipment-toolbar-btn:hover {
    color: #fff;
    background: #38414d;
    border-color: #4a5563;
}

/* The theme's .btn-outline-secondary:hover sets color:#fff, which is invisible on a light
   button — this button is standalone precisely to avoid that. */
.bay-manage-trigger:hover,
.bay-manage-trigger:focus,
.bay-manage-trigger:active,
.bay-manage-trigger:focus-visible {
    color: #212529;
    background: #f8f9fc;
    border-color: #dee2e6;
}

/* LIST-5: chevron rotates open when the "Archived in [bay]" section expands. */
/* 86e36t2z1 §A.17: measured off the prototype — a 46px row on 12px/6px padding, 12px gaps, an
   archive-box icon before the label, and the count in a grey pill. It also needs room: the
   prototype leaves 11px above the row and 21px below it, where ours sat flush against the
   bottom edge of the card. */
.archived-bay-equipment-section {
    margin-top: 11px;
    margin-bottom: 21px;
}

.archived-bay-equipment-toggle {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 6px;
    font-size: 16px;
    font-weight: 500;
    color: #41505f;
    /* Bootstrap's .btn brings a 1px transparent border and line-height 1.5, which together put
       the row 4px over the prototype's 46px. */
    border: 0;
    line-height: 22px;
}

.archived-bay-equipment-toggle:hover .archived-bay-equipment-label {
    color: #212830;
}

.archived-bay-equipment-toggle > svg {
    flex-shrink: 0;
    color: #6e7985;
}

.archived-bay-equipment-label {
    color: #41505f;
}

.archived-bay-equipment-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    font-size: 13px;
    font-weight: 400;
    color: #6e7985;
    background: #f0f0f0;
    border-radius: 999px;
}

.archived-bay-equipment-toggle .archived-bay-equipment-chevron {
    transition: transform 0.2s ease;
    transform: rotate(90deg);
    /* The chevron is the quiet part of the row, not a link-blue accent. */
    color: #6e7985;
    /* material-icons default to 24px, which is taller than the row's line box and pushed it
       2px past the prototype's 46px. */
    font-size: 20px;
    line-height: 22px;
}

[data-skin=dark] .archived-bay-equipment-label,
[data-skin=dark] .archived-bay-equipment-toggle {
    color: #d4dae1;
}

[data-skin=dark] .archived-bay-equipment-count {
    color: #99a1af;
    background: #38414d;
}

.archived-bay-equipment-toggle.collapsed .archived-bay-equipment-chevron {
    transform: rotate(0deg);
}

/* LIST-6: written empty state shown instead of a blank equipment list. */
.empty-bay-equipment {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    /* 86e38px27: 1.25rem above and below, matching the prototype's `my-5` on this card
       (src/app/App.tsx, WashBayEmptyState). The top margin was 0, so the card sat flush against
       the bay picker / search / Options row with a measured 0px gap — the toolbar looked like it
       belonged to the card. The bottom was 0.5rem, which left it tight against the card edge too. */
    margin: 1.25rem 0.75rem;
    padding: 2rem 1.5rem;
    text-align: center;
    background: #f9fafb;
    border: 1px dashed #dee2e6;
    border-radius: 0.375rem;
}

.empty-bay-equipment-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4.5rem;
    height: 4.5rem;
    color: #0067b3;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

/* The bubble_chart material glyph, sized to the lucide icons it sits among (86e31tk14). */
.empty-bay-equipment-icon .material-icons {
    font-size: 2rem;
}

.empty-bay-equipment-title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 600;
    color: #212529;
}

.empty-bay-equipment-subtitle {
    max-width: 32rem;
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

.empty-bay-equipment-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    width: 100%;
    max-width: 40rem;
}

/* §A.32: the tip the prototype closes the empty state with. Sits under a divider that spans
   the same 40rem the action row does, so the two read as one block. */
.empty-bay-equipment-tip {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
    max-width: 40rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e2e5ec;
    font-size: 0.875rem;
    color: #6e7985;
    text-align: left;
}

.empty-bay-equipment-tip-icon {
    flex-shrink: 0;
    margin-top: 0.125rem;
    color: #e0a800;
}

.empty-bay-equipment-tip strong {
    font-weight: 600;
    color: #41505f;
}

[data-skin=dark] .empty-bay-equipment-tip {
    border-top-color: #3a4450;
    color: #9aa3ad;
}

[data-skin=dark] .empty-bay-equipment-tip strong {
    color: #d4dae1;
}

.empty-bay-equipment-action {
    position: relative;
    display: flex;
    flex: 1 1 12rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    min-height: 6rem;
    padding: 1rem 0.75rem;
    color: #212529;
    text-decoration: none;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.empty-bay-equipment-action:hover {
    color: #212529;
    text-decoration: none;
    background: #f0f7ff;
    border-color: #0067b3;
}

.empty-bay-equipment-action.is-recommended {
    border-color: #0067b3;
}

.empty-bay-equipment-badge {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    padding: 0.125rem 0.4375rem;
    font-size: 0.65625rem;
    font-weight: 700;
    color: #0067b3;
    background: #dbeafe;
    border-radius: 50rem;
}

.empty-bay-equipment-action-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.empty-bay-equipment-action-title {
    font-size: 0.875rem;
    font-weight: 600;
}

.empty-bay-equipment-action-desc {
    font-size: 0.75rem;
    color: #6c757d;
}

/* 86e31qwkr — the "no wash bays yet" empty state. It reuses every .empty-bay-equipment-* rule
   above (same section, one level up) and adds only what that screen does not have: a wider panel
   for the longer copy and the Services-style divider + Pro Tips. The tip
   values mirror `.services-empty-state .pro-tip` in services.css. */
.empty-bays .empty-bay-equipment-subtitle {
    max-width: 44rem;
}

.empty-bays-divider {
    width: 100%;
    max-width: 50rem;
    margin: 0.5rem 0 0;
    border: 0;
    border-top: 1px solid #dee2e6;
    opacity: 1;
}

.empty-bays-tips {
    width: 100%;
    max-width: 50rem;
    margin: 0;
    padding: 0;
    text-align: left;
    list-style: none;
}

.empty-bays-tip {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.25rem 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.empty-bays-tip + .empty-bays-tip {
    margin-top: 0.75rem;
}

.empty-bays-tip-icon {
    flex-shrink: 0;
    margin-top: 0.125rem;
    color: #6c757d;
}

/* ITEM-1: labelled record table on the equipment detail page. */
.equipment-record-table-wrapper {
    /* The frame moved to .equipment-record-fields so the header shares it. */
    margin: 0;
}

.equipment-record-table {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
}

.equipment-record-table tr:not(:last-child) th,
.equipment-record-table tr:not(:last-child) td {
    border-bottom: 1px solid #dee2e6;
}

/* 86e36t2z1: measured off the prototype rather than approximated — 48px rows on 14/24 padding,
   a 180px label column, and a value that is the heavier of the two (the label is the quiet half). */
.equipment-record-table th,
.equipment-record-table td {
    padding: 14px 24px;
    vertical-align: top;
    border-top: none;
}

.equipment-record-table-label {
    width: 180px;
    line-height: 19px;
    font-size: 14px;
    font-weight: 400;
    color: #41505f;
    white-space: nowrap;
}

.equipment-record-table-value {
    line-height: 19px;
    font-size: 15px;
    font-weight: 500;
    color: #212830;
    white-space: pre-wrap;
    word-break: break-word;
}

/* ITEM-2: Recent Activity card + photo card, shown side by side. */
.item-activity-row {
    align-items: stretch;
}

/* 86e38wvr8: #recent_activity (the ITEM-6 Turbo Stream target, which sits inside the grid column
   rather than being it so a replacement cannot drop the layout classes) used to carry
   `height: 100%` as well, purely to pass the height chain down to .recent-activity-card. That
   card no longer takes a height — see below — so there is nothing left to pass down. */

.recent-activity-card,
.equipment-photo-card {
    background: #f9fafb;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
}

/* Neither of these cards takes a height. The photo card lost `height: 100%` to 86e38wvdt and the
   activity card to 86e38wvr8; both notes are kept because they are the same trap twice.
   86e38wvdt (Jackson, re-opened): `height: 100%` was on both, and on the photo card it broke the
   mobile Overview outright. Below 992px the grid is one column, so `.equipment-overview-rail`
   gets its own row whose height is resolved from its content WITH the photo card treated as auto
   — measured 585px (photo 256 + Quick Actions 154 + Connections 143 + two 16px gaps). The rail
   then has a definite height, so `height: 100%` re-resolves the photo card to the whole 585, and
   because 86e38wuhg pinned `flex-shrink: 0` on these children nothing gives: Quick Actions and
   Connections were pushed to 1786-2099 against a rail box ending at 1770, i.e. 329px BELOW their
   own container and outside the page card's rounded bottom. That is "the photo is not even in
   its box" and "it's wide, it doesn't fit". On desktop the rail is `align-items: start`, so its
   height is auto, a percentage against auto resolves to auto, and the same declaration did
   nothing — which is why only mobile was broken. The prototype's rail cards set no height at all
   (src/app/App.tsx, ImagePlaceholderCard / QuickActionsCard / ConnectionsCard). */
/* 86e38wvr8 (Jackson): "a bunch of dead space at the bottom" of Recent Activity on mobile.
   .recent-activity-card used to declare `height: 100%` here. It is gone, not merely scoped to the
   two-column layout, because it never did anything in that layout either — measured identically
   with and without it at 1440px, for the same reason 86e38wvdt gives above: the grid is
   `align-items: start` at >= 992px, so the column's height is auto and a percentage against auto
   resolves to auto. Its only live effect was the bug.

   Below 992px the grid is one column, so `.equipment-overview-main` gets its own row sized from
   its content with the card treated as auto — measured 1570px (record table 595 + 24px gap + 951
   of activity). That makes the column's height DEFINITE, so `height: 100%` re-resolved the card
   against the whole 1570 instead of against its own 951. The card then ran 933 -> 2503 with its
   content ending at 1883: 620px of empty card, overflowing its own column (which ends at 1884,
   since 86e38wuhg pinned `flex-shrink: 0`) and straight over the photo / Quick Actions /
   Connections rail below it. The prototype sets no height on this card either — its
   RecentActivityCard is `bg-[#fbfbfb] rounded-xl border overflow-hidden`, nothing more
   (src/app/App.tsx).

   So: nothing in the Overview grid takes a percentage height. If this card ever needs to match
   the rail beside it, that is `align-items: stretch` on the desktop grid, not a percentage. */

.recent-activity-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
}

.recent-activity-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.recent-activity-view-history {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #0067b3;
    white-space: nowrap;
}

.recent-activity-view-history:hover {
    text-decoration: underline;
}

/* 86e36t2z1 §A.44: one line per row — pill, text, then the date pushed to the right edge —
   rather than the stacked two-line layout. §9's original note still applies below lg, where
   there isn't room for all three on one line and wrapping beats truncating the transition. */
.recent-activity-row {
    display: flex;
    align-items: baseline;
    gap: 0.625rem;
    padding: 0.75rem 1.25rem;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid #dee2e6;
}

.recent-activity-row .recent-activity-description {
    flex: 1;
    min-width: 0;
}

.recent-activity-row .recent-activity-date {
    margin-left: auto;
    flex-shrink: 0;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    .recent-activity-row {
        flex-wrap: wrap;
        align-items: flex-start;
        gap: 0.375rem;
    }

    .recent-activity-row .recent-activity-description {
        flex-basis: 100%;
        order: 3;
    }
}

.recent-activity-row:last-child {
    border-bottom: none;
}

a.recent-activity-row:hover {
    background: #f1f3f7;
    color: inherit;
}

/* 86e36t2z1: the prototype's pills are a FIXED 96px wide, so the kind column lines up down the
   list instead of ragging with the word length. Measured, not guessed. */
.recent-activity-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    flex-shrink: 0;
    padding: 3px 0;
    font-size: 0.75rem;
    line-height: 1.25;
    font-weight: 500;
    color: #0067b3;
    background: #dbeafe;
    border-radius: 999px;
}

.recent-activity-description {
    font-size: 0.875rem;
    color: #41505f;
}

.recent-activity-date {
    font-size: 0.75rem;
    color: #adadad;
}

.recent-activity-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1.5rem;
    text-align: center;
}

.recent-activity-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #0067b3;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.recent-activity-empty-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.recent-activity-empty-subtitle {
    margin: 0;
    max-width: 28rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* ITEM-7: Connections card, listing equipment this item is linked to. */
/* 86e31rqce: the section is a stack of cards — Inspections Attached, Services Attached, and
   ITEM-7's Connected Equipment when there is any. */
.equipment-connections {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.equipment-connections-card {
    background: #f9fafb;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
}

.equipment-connections-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.875rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
}

.equipment-connections-header-icon {
    display: inline-flex;
    align-items: center;
    color: #0067b3;
}

.equipment-connections-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.equipment-connections-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.375rem;
    padding: 0.0625rem 0.4375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #6e7985;
    background: #f0f0f0;
    border-radius: 999px;
}

.equipment-connections-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.875rem 1.25rem;
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid #dee2e6;
}

.equipment-connections-row:last-child {
    border-bottom: none;
}

.equipment-connections-row:hover {
    background: #f1f3f7;
    color: inherit;
}

.equipment-connections-name {
    font-size: 0.875rem;
    font-weight: 500;
    color: #212529;
}

.equipment-connections-bay {
    font-size: 0.8125rem;
    color: #6c757d;
}

/* An inspection/service row is name over a quiet meta line, then the status pill and the link
   through. The pill is the shared Services one (.pill-status-* in services.css). */
.equipment-connections-row-main {
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
    flex: 1 1 auto;
    min-width: 0;
}

.equipment-connections-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 1rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

.equipment-connections-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
}

.equipment-connections-view {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-shrink: 0;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #0067b3;
    text-decoration: none;
}

.equipment-connections-view:hover {
    color: #0067b3;
    text-decoration: underline;
}

/* The pills carry a min-width meant for the Services list; a connections row is tighter. */
.equipment-connections-row .badge[class*="pill-status-"] {
    min-width: 7rem !important;
    padding: 0.25rem 0.75rem !important;
    font-size: 0.8125rem !important;
}

@media (max-width: 575.98px) {
    .equipment-connections-row {
        flex-wrap: wrap;
    }

    .equipment-connections-row-main {
        flex: 1 0 100%;
    }
}

.equipment-connections-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 2rem 1.5rem;
    text-align: center;
}

.equipment-connections-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #0067b3;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.equipment-connections-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.equipment-connections-empty-subtitle {
    font-size: 0.875rem;
    color: #6c757d;
}

/* ITEM-8: Files & Documents, one card per fixed category. */
.equipment-files {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.equipment-files-errors {
    padding: 0.625rem 0.875rem;
    font-size: 0.8125rem;
    color: #b71c1c;
    background: #ffe2e2;
    border: 1px solid #ffb4b4;
    border-radius: 0.375rem;
}

.equipment-files-card {
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-files-header {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.equipment-files-header-icon {
    display: flex;
    color: #0067b3;
}

.equipment-files-title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212529;
}

.equipment-files-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.375rem;
    padding: 0.0625rem 0.4375rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #0067b3;
    background: #dbeafe;
    border-radius: 999px;
}

.equipment-files-upload {
    display: flex;
}

/* §A.46: measured off the prototype — 14px/500 in #0067b3 on white, inside a #b2d1e8 border.
   The prototype draws it as a pill; radius stays the app's 0.375rem by decision (README,
   "Decisions taken"), which is the one deliberate difference here. */
.equipment-files-add-btn {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    height: 36px;
    padding: 0 0.875rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #0067b3;
    background: #fff;
    border: 1px solid #b2d1e8;
    border-radius: 0.375rem;
}

.equipment-files-add-btn:hover {
    background: #e8f4ff;
}

.equipment-files-description {
    margin: 0.5rem 0 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.equipment-files-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.equipment-files-row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.75rem;
    background: #f9fafb;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-files-row-icon {
    display: flex;
    flex-shrink: 0;
    color: #0067b3;
}

/* 86e36t2z1 §A.46: the filename is now the download link (the row's own download button went
   away with the size/date column), so it needs the link states an <a> would otherwise get from
   the theme — undecorated at rest, blue and underlined on hover, so it still reads as clickable. */
.equipment-files-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    font-size: 0.875rem;
    color: #212529;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

a.equipment-files-name:hover,
a.equipment-files-name:focus-visible {
    color: #0067b3;
    text-decoration: underline;
}

.equipment-files-meta {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: #adadad;
    white-space: nowrap;
}

.equipment-files-action {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    /* button_to's <form> picks up a global `form { margin-bottom: 14px }`
       (a legacy admin-theme rule) that shifts it out of vertical center
       next to the download <a> — reset it explicitly. */
    margin: 0;
    padding: 0;
    color: #6c757d;
    background: transparent;
    border: none;
    border-radius: 0.375rem;
}

.equipment-files-action:hover {
    color: #212529;
    background: #eef0f3;
}

.equipment-files-action-remove:hover {
    color: #c10007;
    background: #ffe2e2;
}

/* button_to wraps its <button> in a <form> — .equipment-files-action (sized,
   centered) lives on that form via the `form:` option, so the button itself
   just needs to fill it edge-to-edge with no default button chrome. */
.equipment-files-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 0;
    color: inherit;
    background: transparent;
    border: none;
    cursor: pointer;
}

.equipment-photo-card-image-wrapper {
    aspect-ratio: 4 / 3;
    background: #f1f3f7;
}

.equipment-photo-card-image {
    position: relative;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.equipment-photo-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.15s ease;
}

/* 86e31rpv6: the photo is on the record from the moment the copy lands, but the browser still
   has to fetch it. A shimmer says "on its way" so an in-flight photo never reads as a missing
   one; equipment_photo_controller drops .is-loading once the image decodes. */
.equipment-photo-card-image.is-loading {
    background: linear-gradient(90deg, #eef1f5 25%, #f7f9fb 37%, #eef1f5 63%);
    background-size: 400% 100%;
    animation: equipment-photo-shimmer 1.4s ease infinite;
}

.equipment-photo-card-image.is-loading img,
.equipment-photo-card-image.is-broken img {
    opacity: 0;
}

.equipment-photo-card-image.is-broken {
    background: #f1f3f7;
    cursor: default;
}

/* The loading target carries only screen-reader text; the error one is the visible fallback. */
.equipment-photo-card-image-state {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem;
    font-size: 0.8125rem;
    font-weight: 500;
    text-align: center;
    color: #6c757d;
    pointer-events: none;
}

@keyframes equipment-photo-shimmer {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

@media (prefers-reduced-motion: reduce) {
    .equipment-photo-card-image.is-loading {
        animation: none;
    }
}

.equipment-photo-card-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    height: 100%;
    padding: 2.5rem 1.5rem;
    text-align: center;
    color: inherit;
    text-decoration: none;
}

.equipment-photo-card-placeholder:hover {
    color: inherit;
}

.equipment-photo-card-placeholder-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 50%;
}

.equipment-photo-card-placeholder-title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.equipment-photo-card-placeholder-subtitle {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.5;
    color: #6c757d;
}

.equipment-photo-card-upload-button {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #fff;
    background: #0067b3;
    border-radius: 0.375rem;
}

/* 86e31rpv6: a photo that is on the record but cannot be rendered (an SVG, say) is its own
   state — showing the empty "No photo yet" placeholder instead is what let a real, unsupported
   file pass for a copy that silently failed. */
.equipment-photo-card-placeholder--error .equipment-photo-card-placeholder-icon {
    color: #b45309;
    background: #fef3c7;
}

/* ITEM-4: the equipment History section, flattened into one searchable,
   groupable list — each row is a single event (date, type, status, who
   recorded it), replacing the old collapsible service/inspection accordion. */
.equipment-history-list {
    display: flex;
    flex-direction: column;
}

.equipment-history-row {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid #dee2e6;
}

.equipment-history-row:last-child {
    border-bottom: none;
}

.equipment-history-row-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 2.25rem;
    height: 2.25rem;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 50%;
}

.equipment-history-row-body {
    flex: 1;
    min-width: 0;
}

.equipment-history-row-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.375rem;
}

.equipment-history-type-pill,
.equipment-history-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 0.125rem 0.625rem;
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: 999px;
}

.equipment-history-type-pill {
    color: #0067b3;
    background: #dbeafe;
}

.equipment-history-status-pill {
    color: #41505f;
    background: #e9ecef;
}

.equipment-history-description {
    font-size: 0.875rem;
    color: #41505f;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.equipment-history-extra {
    font-size: 0.8125rem;
    color: #6c757d;
    white-space: pre-wrap;
}

.equipment-history-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.625rem;
}

.equipment-history-attachment {
    cursor: pointer;
}

.equipment-history-attachment-img {
    display: block;
    width: 96px;
    height: 96px;
    object-fit: cover;
    border-radius: 0.375rem;
}

.equipment-history-attachment--broken {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 96px;
    height: 96px;
    color: #adb5bd;
    background: #f1f3f7;
    border-radius: 0.375rem;
}

.equipment-history-row-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex-shrink: 0;
    gap: 0.125rem;
    text-align: right;
    white-space: nowrap;
}

.equipment-history-row-author {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #212529;
}

.equipment-history-row-date {
    font-size: 0.75rem;
    color: #adadad;
}

.equipment-history-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.375rem;
    padding: 2.5rem 1.5rem;
    text-align: center;
}

.equipment-history-empty-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.equipment-history-empty-subtitle {
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

/* ----------------------------------------------------------------------------
   ITEM-12: empty states. Every section on the item page says what belongs in
   it and, where there is one, offers the action that fills it — so an item
   that has just been created reads as new rather than as broken.
   ---------------------------------------------------------------------------- */
.equipment-empty-action {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.875rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #212830;
    text-decoration: none;
}

.equipment-empty-action:hover {
    background: #f8f9fc;
    border-color: #0067b3;
    color: #212830;
}

.equipment-empty-action-primary {
    background: #0067b3;
    border-color: #0067b3;
    color: #fff;
}

.equipment-empty-action-primary:hover {
    background: #005a9e;
    border-color: #005a9e;
    color: #fff;
}

/* ITEM-1's record table, before any of the ADD-2 optional fields are filled. */
.equipment-record-table-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 2rem 1.5rem;
    background: #f9fafb;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    text-align: center;
}

.equipment-record-table-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #0067b3;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.equipment-record-table-empty-title {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.equipment-record-table-empty-subtitle {
    max-width: 32rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* ITEM-4's history list, on an item nothing has been logged against yet. */
.equipment-history-empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin-bottom: 0.25rem;
    color: #0067b3;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

.equipment-history-empty-subtitle {
    max-width: 30rem;
}

.equipment-history-empty-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 0.75rem;
}

/* ITEM-8's file categories, before anything has been uploaded to one. */
.equipment-files-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    margin-top: 0.5rem;
    padding: 0.625rem 1rem;
    background: transparent;
    border: 1px dashed #d1d5db;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    color: #9aa3ad;
    text-align: center;
}

.equipment-files-empty:hover,
.equipment-files-empty.dragover {
    border-color: #0067b3;
    background: #f8fbff;
}

.equipment-files-empty-browse {
    font-weight: 500;
    color: #0067b3;
}

[data-skin=dark] .equipment-empty-action {
    background: #262626;
    border-color: #3a3a3a;
    color: #e0e0e0;
}

[data-skin=dark] .equipment-empty-action:hover {
    background: #2f2f2f;
    color: #fff;
}

[data-skin=dark] .equipment-record-table-empty {
    background: #262626;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-record-table-empty-icon,
[data-skin=dark] .equipment-history-empty-icon {
    background: #1f1f1f;
}

[data-skin=dark] .equipment-record-table-empty-title {
    color: #f0f0f0;
}

[data-skin=dark] .equipment-record-table-empty-subtitle {
    color: #b0b0b0;
}

[data-skin=dark] .equipment-files-empty {
    border-color: #3a3a3a;
    color: #9aa3ad;
}

[data-skin=dark] .equipment-files-empty:hover,
[data-skin=dark] .equipment-files-empty.dragover {
    background: #262626;
    border-color: #0067b3;
}

/* ----------------------------------------------------------------------------
   ITEM-10 / ITEM-11: the item detail page's overflow menu (Print, Export PDF,
   Archive / Unarchive) and the archived state it can put the item into.
   ---------------------------------------------------------------------------- */
.equipment-actions-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    /* 86e38wu1a: white, not transparent. It sits on the card header's grey (washup-bg-gray), so
       transparent read as a grey button on a grey bar. The prototype's Actions button is
       `bg-white` at every width (src/app/App.tsx, PageHeader). */
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #41505f;
}

.equipment-actions-trigger:hover {
    background: #f8f9fc;
    border-color: #adb5bd;
}

/* 86e36t2z1 §A.9: the same trigger, but labelled "Actions" as the prototype has it.
   The base rule is a fixed 34px square for an icon-only button, so a labelled one has
   to opt out of that width or the text is clipped by the card edge. */
.equipment-actions-trigger-labelled {
    width: auto;
    gap: 0.375rem;
    padding: 0 0.75rem;
    font-size: 0.9375rem;
    color: #212529;
    white-space: nowrap;
}

[data-skin=dark] .equipment-actions-trigger-labelled {
    color: #e6e9ed;
}

.equipment-actions-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    font-size: 0.875rem;
    color: #212830;
}

.equipment-actions-item svg {
    color: #41505f;
    flex-shrink: 0;
}

.equipment-actions-item-danger,
.equipment-actions-item-danger svg {
    color: #c10007;
}

.equipment-actions-item-danger:hover {
    background: #fff5f5;
    color: #c10007;
}

.equipment-actions-item-restore,
.equipment-actions-item-restore svg {
    color: #008236;
}

.equipment-actions-item-restore:hover {
    background: #f0fdf4;
    color: #008236;
}

/* The theme sets overflow: hidden on .card, which would clip this menu — the
   same fix the app applies per dropdown context (see services.css). */
.card:has(.equipment-actions-trigger),
.card:has(.equipment-actions-trigger) .card-header {
    overflow: visible !important;
}

/* 86e38wu1a follow-up: the space to the right of the Actions button is this header's padding and
   nothing else. It used to be 24px of padding plus a `me-2` on the dropdown wrapper; stating the
   total here keeps desktop exactly where it was (24 + 8 = 32px, which is also the prototype's
   `sm:px-8` — src/app/App.tsx PageHeader) and lets the phone rule below say its own number. */
.card-header:has(.equipment-actions-trigger) {
    padding-right: 2rem;
}

/* ITEM-11 AC3: the archived badge + who/when/why, on the item's detail page. */
.equipment-archived-notice {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.625rem 0.875rem;
    background: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-archived-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.1875rem 0.625rem;
    background: #f0f0f0;
    border: 1px solid #d1d5db;
    border-radius: 20px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #6e7985;
}

.equipment-archived-meta {
    font-size: 0.875rem;
    color: #41505f;
}

.equipment-archived-reason {
    width: 100%;
    font-size: 0.8125rem;
    color: #6c757d;
}

/* ITEM-11: the two confirmations. Structure is the Services "Mark as Complete"
   modal's (.mark-complete-* in services.css); only the accents differ. */
/* 86e39efv5: the setup wizard's discard confirmation is the same shape of question, so it takes
   the same red accent and the same confirm button rather than growing a parallel set. */
.mark-complete-icon-wrapper.equipment-archive-icon svg,
.mark-complete-icon-wrapper.wizard-discard-icon svg {
    color: #c10007;
}

.mark-complete-icon-wrapper.equipment-unarchive-icon svg {
    color: #008236;
}

.equipment-archive-callout {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-archive-callout svg {
    flex-shrink: 0;
    margin-top: 0.125rem;
    color: #41505f;
}

.equipment-archive-callout p {
    margin: 0;
    font-size: 0.8125rem;
    line-height: 1.6;
    color: #41505f;
}

.equipment-archive-callout p span {
    font-weight: 500;
    color: #212830;
}

.equipment-archive-callout-danger {
    background: #fff5f5;
    border-color: #ffd5d5;
}

.equipment-archive-callout-danger svg {
    color: #c10007;
}

.equipment-archive-loading,
.equipment-archive-counts {
    font-size: 0.8125rem;
    color: #6c757d;
}

.equipment-archive-error {
    font-size: 0.8125rem;
    color: #c10007;
}

.btn-equipment-archive-confirm,
.btn-equipment-unarchive-confirm,
.btn-wizard-discard-confirm {
    min-width: 186px;
    height: 48px;
    border-radius: 0.375rem;
    padding: 12px 24px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #fff;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-equipment-archive-confirm,
.btn-wizard-discard-confirm {
    border: 1px solid #c10007;
    background-color: #c10007;
}

.btn-equipment-archive-confirm:hover,
.btn-wizard-discard-confirm:hover {
    background-color: #a50006;
}

/* The discard confirm is an <a>, not a <button>: it goes exactly where Cancel goes. Anchors bring
   their own layout and underline, and the theme colours visited links, so those are pinned here —
   .btn-* above only sets the box. */
.btn-wizard-discard-confirm,
.btn-wizard-discard-confirm:hover,
.btn-wizard-discard-confirm:focus,
.btn-wizard-discard-confirm:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    color: #fff;
}

.btn-equipment-unarchive-confirm {
    border: 1px solid #008236;
    background-color: #008236;
}

.btn-equipment-unarchive-confirm:hover {
    background-color: #006b2c;
}

.btn-equipment-archive-confirm:disabled,
.btn-equipment-unarchive-confirm:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ----------------------------------------------------------------------------
   Dark theme
   ---------------------------------------------------------------------------- */
[data-skin=dark] .equipment-actions-trigger {
    border-color: #3a3a3a;
    color: #d0d0d0;
}

[data-skin=dark] .equipment-actions-trigger:hover {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-actions-item {
    color: #e0e0e0;
}

[data-skin=dark] .equipment-actions-item svg {
    color: #b0b0b0;
}

[data-skin=dark] .equipment-archived-notice {
    background: #262626;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-archived-badge {
    background: #333;
    border-color: #4a4a4a;
    color: #c0c0c0;
}

[data-skin=dark] .equipment-archived-meta {
    color: #d0d0d0;
}

[data-skin=dark] .equipment-archive-callout {
    background: #262626;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-archive-callout p {
    color: #d0d0d0;
}

[data-skin=dark] .equipment-archive-callout p span {
    color: #f0f0f0;
}

[data-skin=dark] .equipment-archive-callout-danger {
    background: #3a2020;
    border-color: #5a2a2a;
}

[data-skin=dark] .drawer-panel {
    background: #1f1f1f;
}

[data-skin=dark] .drawer-header,
[data-skin=dark] .drawer-footer {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .drawer-title {
    color: #e9ecef;
}

[data-skin=dark] .drawer-subtitle,
[data-skin=dark] .drawer-close {
    color: #adb5bd;
}

[data-skin=dark] .drawer-close:hover {
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-row {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .bay-manage-name {
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-handle {
    color: #5a5a5a;
}

[data-skin=dark] .bay-manage-placeholder {
    background: #262626;
    border-color: #4a4a4a;
}

[data-skin=dark] .bay-manage-icon-btn {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #adb5bd;
}

[data-skin=dark] .bay-manage-icon-btn:hover:not(:disabled) {
    background: #343434;
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-move-btn:hover:not(:disabled) {
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-delete-panel {
    background: #2b1f1f;
    border-color: #4a2a2a;
}

[data-skin=dark] .bay-manage-delete-warning p,
[data-skin=dark] .bay-manage-delete-label {
    color: #f1a7a7;
}

[data-skin=dark] .bay-manage-delete-cancel {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #adb5bd;
}

[data-skin=dark] .bay-manage-delete-cancel:hover,
[data-skin=dark] .bay-manage-delete-cancel:focus,
[data-skin=dark] .bay-manage-delete-cancel:active {
    background: #343434;
    border-color: #3a3a3a;
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-empty {
    border-color: #3a3a3a;
    color: #adb5bd;
}

[data-skin=dark] .bay-manage-add-trigger,
[data-skin=dark] .bay-manage-add-menu {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-add-trigger:hover,
[data-skin=dark] .bay-manage-add-trigger:focus-visible,
[data-skin=dark] .bay-manage-add-option:hover,
[data-skin=dark] .bay-manage-add-option:focus-visible {
    background: #333;
}

[data-skin=dark] .bay-manage-add-option {
    border-bottom-color: #3a3a3a;
}

[data-skin=dark] .bay-manage-add-option-title {
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-add-option-hint {
    color: #adb5bd;
}

[data-skin=dark] .bay-manage-add-option-icon {
    background: #1f3a52;
    color: #6cb2eb;
}

[data-skin=dark] .bay-selector-toggle,
[data-skin=dark] .bay-selector-menu {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #e9ecef;
}

[data-skin=dark] .bay-selector-toggle:hover,
[data-skin=dark] .bay-selector-toggle:focus-visible,
[data-skin=dark] .bay-selector-item:hover,
[data-skin=dark] .bay-selector-item:focus-visible {
    color: #e9ecef;
    background: #333;
}

[data-skin=dark] .bay-selector-item {
    color: #e9ecef;
}

[data-skin=dark] .bay-selector-item.is-current {
    color: #6cb2eb;
}

[data-skin=dark] .bay-selector-item-check,
[data-skin=dark] .bay-selector-toggle[aria-expanded="true"] {
    color: #6cb2eb;
}

[data-skin=dark] .bay-selector-empty {
    color: #adb5bd;
}

[data-skin=dark] .bay-search-field {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .bay-search-input {
    color: #e9ecef;
}

[data-skin=dark] .bay-search-clear:hover {
    color: #e9ecef;
}

[data-skin=dark] .bay-manage-hint {
    color: #adb5bd;
}

[data-skin=dark] .bay-manage-trigger {
    color: #adb5bd;
    border-color: #3a3a3a;
}

[data-skin=dark] .bay-manage-trigger:hover,
[data-skin=dark] .bay-manage-trigger:focus,
[data-skin=dark] .bay-manage-trigger:active,
[data-skin=dark] .bay-manage-trigger:focus-visible {
    color: #e9ecef;
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .empty-bay-equipment {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

[data-skin=dark] .empty-bay-equipment-icon {
    background: #2a2a2a;
}

[data-skin=dark] .empty-bay-equipment-title {
    color: #e9ecef;
}

[data-skin=dark] .empty-bay-equipment-subtitle,
[data-skin=dark] .empty-bay-equipment-action-desc {
    color: #adb5bd;
}

[data-skin=dark] .empty-bay-equipment-action {
    color: #e9ecef;
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .empty-bay-equipment-action:hover {
    color: #e9ecef;
    background: #343434;
    border-color: #0067b3;
}

[data-skin=dark] .empty-bay-equipment-action-icon {
    background: #1f1f1f;
}

[data-skin=dark] .empty-bays-divider {
    border-top-color: #3a3a3a;
}

[data-skin=dark] .empty-bays-tip,
[data-skin=dark] .empty-bays-tip-icon {
    color: #adb5bd;
}

[data-skin=dark] .equipment-record-table-wrapper {
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-record-table tr:not(:last-child) th,
[data-skin=dark] .equipment-record-table tr:not(:last-child) td {
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-record-table-label {
    color: #adb5bd;
}

[data-skin=dark] .equipment-record-table-value {
    color: #e9ecef;
}

[data-skin=dark] .recent-activity-card,
[data-skin=dark] .equipment-photo-card {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

[data-skin=dark] .recent-activity-header {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .recent-activity-title {
    color: #e9ecef;
}

[data-skin=dark] .recent-activity-row {
    border-color: #3a3a3a;
}

[data-skin=dark] a.recent-activity-row:hover {
    background: #2a2a2a;
}

[data-skin=dark] .recent-activity-description {
    color: #e9ecef;
}

[data-skin=dark] .recent-activity-empty-icon {
    background: #2a2a2a;
}

[data-skin=dark] .recent-activity-empty-title {
    color: #e9ecef;
}

[data-skin=dark] .recent-activity-empty-subtitle,
[data-skin=dark] .recent-activity-date {
    color: #adb5bd;
}

[data-skin=dark] .equipment-photo-card-image-wrapper {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-connections-card {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-connections-header {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-connections-title {
    color: #e9ecef;
}

[data-skin=dark] .equipment-connections-row {
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-connections-row:hover {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-connections-name {
    color: #e9ecef;
}

[data-skin=dark] .equipment-connections-empty-icon {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-connections-empty-title {
    color: #e9ecef;
}

[data-skin=dark] .equipment-connections-empty-subtitle,
[data-skin=dark] .equipment-connections-meta,
[data-skin=dark] .equipment-connections-bay {
    color: #adb5bd;
}

[data-skin=dark] .equipment-connections-header-icon,
[data-skin=dark] .equipment-connections-view {
    color: #4da3e0;
}

[data-skin=dark] .equipment-files-card {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-files-title {
    color: #e9ecef;
}

[data-skin=dark] .equipment-files-add-btn:hover {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-files-row {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-files-name {
    color: #e9ecef;
}

[data-skin=dark] .equipment-files-action:hover {
    background: #3a3a3a;
}

[data-skin=dark] .equipment-photo-card-image.is-loading {
    background: linear-gradient(90deg, #2b3139 25%, #353c46 37%, #2b3139 63%);
    background-size: 400% 100%;
}

[data-skin=dark] .equipment-photo-card-image.is-broken {
    background: #2b3139;
}

[data-skin=dark] .equipment-photo-card-image-state {
    color: #adb5bd;
}

[data-skin=dark] .equipment-photo-card-placeholder--error .equipment-photo-card-placeholder-icon {
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.15);
}

[data-skin=dark] .equipment-photo-card-placeholder-icon {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-photo-card-placeholder-title {
    color: #e9ecef;
}

[data-skin=dark] .equipment-photo-card-placeholder-subtitle {
    color: #adb5bd;
}

[data-skin=dark] .equipment-history-row {
    border-color: #3a3a3a;
}

[data-skin=dark] .equipment-history-row-icon {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-history-status-pill {
    color: #adb5bd;
    background: #2a2a2a;
}

[data-skin=dark] .equipment-history-description {
    color: #dee2e6;
}

[data-skin=dark] .equipment-history-extra,
[data-skin=dark] .equipment-history-row-date,
[data-skin=dark] .equipment-history-empty-subtitle {
    color: #adb5bd;
}

[data-skin=dark] .equipment-history-attachment--broken {
    color: #6c757d;
    background: #2a2a2a;
}

[data-skin=dark] .equipment-history-row-author,
[data-skin=dark] .equipment-history-empty-title {
    color: #e9ecef;
}

/* ----------------------------------------------------------------------------
   Guided photo walk (PHOTO-1..PHOTO-5)

   Full-bleed inside the normal app chrome: @fullscreen adds `mywash-fullscreen` to <body>,
   which only drops the .main-app padding. The sidebar STAYS — the prototype keeps the app nav
   on the walk; this is not a fullscreen takeover like the inspections perform view.

   Layout is a page header bar, a scrolling centred column, and a sticky action bar at the
   bottom, so the primary action is always in thumb reach on a phone.
   ---------------------------------------------------------------------------- */
.mywash-fullscreen .main.main-app {
    padding: 0 !important;
}

.photo-walk {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 72px);
    background: #f8f9fc;
}

/* Page header bar: back chevron + the walk's name. Flush to the top because .main-app's padding
   is dropped by .mywash-fullscreen.

   86e31tkec: pinned rather than scrolling away with the column. `top: 72px` clears the fixed
   .header-main navbar — the same offset the inspections perform bar uses. The walk's other two
   bars are already sticky to the bottom, so this makes the three edges of the screen behave
   alike: the way out stays reachable however far down the page you are. */
.photo-walk-header {
    position: sticky;
    top: 72px;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
    padding: 1rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
}

.photo-walk-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    flex-shrink: 0;
    color: #6e7985;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-back:hover,
.photo-walk-back:focus-visible {
    color: #212529;
    background: #f8f9fc;
}

.photo-walk-header-title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #212529;
}

/* §A.31: the prototype's content column measures 616px (its stat row runs 752–1368 at a 1920
   viewport). Ours was 680, which read as a wider, looser page than the artifact. */
.photo-walk-panel {
    flex: 1;
    width: 100%;
    max-width: 616px;
    margin: 0 auto;
    padding: 2rem 1rem 1.5rem;
}

.photo-walk-intro-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.photo-walk-intro-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.photo-walk-title {
    margin: 1.25rem 0 0;
    font-size: 1.625rem;
    font-weight: 700;
    color: #212529;
}

.photo-walk-subtitle {
    max-width: 520px;
    margin: 0.625rem 0 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #6c757d;
}

/* PHOTO-2: the three counts, side by side and equal width. */
.photo-walk-stats {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

.photo-walk-stat {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
    padding: 1rem 0.5rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-stat-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    line-height: 1.2;
}

.photo-walk-stat-green .photo-walk-stat-value {
    color: #198754;
}

.photo-walk-stat-blue .photo-walk-stat-value {
    color: #0067b3;
}

/* 86e31tkec made the work-ahead count red; 86e36t2z1 §A.29 moved that tile back to blue to
   match the artifact ("Need one"), so nothing renders this today. Kept as the tone to reach
   for if a real gap count is added here later. */
.photo-walk-stat-red .photo-walk-stat-value {
    color: #dc3545;
}

.photo-walk-stat-label {
    font-size: 0.75rem;
    color: #6c757d;
}

/* PHOTO-2 AC3 — not in the prototype; placed next to the counts it changes. */
.photo-walk-include {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    margin-top: 0.75rem;
    padding: 0.75rem 0.875rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    cursor: pointer;
}

.photo-walk-include:has(input:disabled) {
    cursor: default;
    opacity: 0.65;
}

.photo-walk-include-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 500;
    color: #212529;
}

.photo-walk-include-hint {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
}

/* PHOTO-3 */
.photo-walk-callout {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.875rem 1rem;
    background: #f0f7ff;
    border: 1px solid #cfe4f7;
    border-radius: 0.375rem;
}

.photo-walk-callout-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    flex-shrink: 0;
    color: #0067b3;
    background: #fff;
    border-radius: 0.375rem;
}

.photo-walk-callout p {
    margin: 0;
    padding-top: 0.25rem;
    font-size: 0.875rem;
    line-height: 1.55;
    color: #41505f;
}

.photo-walk-section-title {
    margin: 1.75rem 0 0.75rem;
    font-size: 1rem;
    font-weight: 700;
    color: #212529;
}

.photo-walk-cards {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.photo-walk-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.125rem;
    height: 2.125rem;
    flex-shrink: 0;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.photo-walk-card-title {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.photo-walk-card-body {
    display: block;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: #6c757d;
}

/* --- the step (PHOTO-1 / PHOTO-4) --- */
.photo-walk-step-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.8125rem;
    color: #6c757d;
}

.photo-walk-progress {
    height: 6px;
    margin-top: 0.5rem;
    background: #edf0f5;
    border-radius: 999px;
    overflow: hidden;
}

.photo-walk-progress-fill {
    height: 100%;
    width: 0;
    background: #0067b3;
    border-radius: 999px;
    transition: width 0.3s ease;
}

.photo-walk-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.25rem;
}

.photo-walk-item-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.photo-walk-item-name {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #212529;
}

.photo-walk-item-state {
    margin: 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.photo-walk-item-state.is-captured {
    color: #198754;
}

.photo-walk-dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    margin-top: 1rem;
    padding: 2.5rem 1rem;
    text-align: center;
    background: #fff;
    border: 1px dashed #adb5bd;
    border-radius: 0.375rem;
    cursor: pointer;
}

.photo-walk-dropzone.is-dragging {
    border-color: #0067b3;
    background: #f0f7ff;
}

.photo-walk-dropzone-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 999px;
}

.photo-walk-dropzone-lead {
    margin: 0.5rem 0 0;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.photo-walk-dropzone-hint {
    margin: 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.photo-walk-upload-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.75rem;
    padding: 0.5rem 1.125rem;
    font-size: 0.9375rem;
    font-weight: 600;
}

.photo-walk-preview {
    position: relative;
    margin-top: 1rem;
    padding: 0.75rem;
    background: #eef1f6;
    border-radius: 0.375rem;
    min-height: 240px;
}

.photo-walk-preview-pill {
    position: absolute;
    top: 1.25rem;
    left: 1.25rem;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.25rem 0.625rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #198754;
    background: #fff;
    border-radius: 999px;
}

.photo-walk-preview-img {
    display: block;
    width: 100%;
    max-height: 380px;
    object-fit: contain;
    border-radius: 0.375rem;
}

.photo-walk-step-actions {
    display: flex;
    gap: 0.75rem;
    margin-top: 1rem;
}

.photo-walk-retake {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 1.125rem;
    color: #212529;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-retake:hover {
    background: #f8f9fc;
}

.photo-walk-next {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex: 1;
    padding: 0.625rem 1.125rem;
    font-weight: 600;
}

/* Plain text, as the prototype has it — skipping should not compete with the primary action. */
.photo-walk-skip {
    display: block;
    margin: 1rem auto 0;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #6c757d;
    background: transparent;
    border: 0;
}

.photo-walk-skip:hover {
    color: #212529;
}

/* --- the summary (PHOTO-1 / PHOTO-4) --- */
.photo-walk-done-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 66px;
    height: 66px;
    color: #198754;
    background: #d1fae5;
    border-radius: 999px;
}

/* Two cards, centred and narrower than the intro's three. */
.photo-walk-done-stats {
    display: flex;
    justify-content: center;
    gap: 0.75rem;
    margin-top: 1.75rem;
}

.photo-walk-done-stats .photo-walk-stat {
    flex: 0 1 210px;
}

.photo-walk-sync-pill {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    width: fit-content;
    margin: 1rem auto 0;
    padding: 0.3125rem 0.875rem;
    font-size: 0.8125rem;
    font-weight: 600;
    border-radius: 999px;
}

.photo-walk-sync-pill.is-synced {
    color: #198754;
    background: #d1fae5;
}

.photo-walk-sync-pill.is-uploading {
    color: #0067b3;
    background: #e8f1fb;
}

.photo-walk-sync-pill.is-failed {
    color: #b02a37;
    background: #fde8e8;
}

.photo-walk-done-note {
    margin: 1rem 0 0;
    font-size: 0.8125rem;
    color: #6c757d;
    text-align: center;
}

.photo-walk-done-list {
    margin-top: 1.25rem;
    padding: 0.875rem 1rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-done-list.is-failed {
    border-color: #f5c2c7;
    background: #fff8f8;
}

.photo-walk-done-list-title {
    margin: 0 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6c757d;
}

.photo-walk-done-list ul {
    margin: 0;
    padding-left: 1.125rem;
    font-size: 0.875rem;
    color: #212529;
}

.photo-walk-done-list-note {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    color: #b02a37;
}

.photo-walk-done-back {
    display: block;
    width: 100%;
    margin-top: 1.5rem;
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
}

/* --- upload status + filmstrip (PHOTO-5, and decision #4) --- */
.photo-walk-uploadbar {
    position: sticky;
    bottom: 0;
    z-index: 2;
    flex-shrink: 0;
    padding: 0.625rem 1rem 0.75rem;
    background: #fff;
    border-top: 1px solid #dee2e6;
}

.photo-walk-upload-status {
    margin: 0;
    font-size: 0.8125rem;
    color: #6c757d;
}

.photo-walk-upload-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    max-width: 680px;
    margin: 0 auto 0.5rem;
}

.photo-walk-upload-status.is-queued {
    color: #b45309;
}

.photo-walk-retry {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    flex-shrink: 0;
    padding: 0.25rem 0.625rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0067b3;
    background: #fff;
    border: 1px solid #cfe4f7;
    border-radius: 0.375rem;
}

.photo-walk-retry:hover {
    background: #f0f7ff;
}

.photo-walk-retry-done {
    margin: 0.75rem auto 0;
}

/* A photo waiting for signal is safe, not broken — amber, never red (PHOTO-6 AC2). */
.photo-walk-slot.is-queued {
    background: #fef3c7;
    border-color: #f59e0b;
}

.photo-walk-sync-pill.is-queued {
    color: #b45309;
    background: #fef3c7;
}

.photo-walk-filmstrip {
    display: flex;
    gap: 0.5rem;
    max-width: 680px;
    margin: 0 auto;
    padding: 0 0 0.25rem;
    list-style: none;
    /* A tunnel bay has far more items than the six the prototype draws. */
    overflow-x: auto;
}

.photo-walk-slot {
    position: relative;
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    padding: 0;
    background: #eef1f6;
    border: 2px solid transparent;
    border-radius: 0.375rem;
    overflow: hidden;
    /* 86e31tkec AC7: a slot is a way back to its item, not just an indicator. */
    cursor: pointer;
}

.photo-walk-slot:focus-visible {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
}

/* 86e31tkec AC6: a photo that went in successfully reads green. Declared before .is-current so
   the item you are actually standing on still shows blue when you jump back to it. */
.photo-walk-slot.is-done {
    border-color: #198754;
}

.photo-walk-slot.is-current {
    border-color: #0067b3;
}

.photo-walk-slot.is-skipped {
    background: #fef3c7;
}

.photo-walk-slot-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.photo-walk-slot.is-uploading::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.65);
    border-radius: 0.25rem;
}

.photo-walk-slot.is-failed {
    background: #fde8e8;
    border-color: #dc3545;
}

.photo-walk-upload-status.is-failed {
    color: #dc3545;
}

.photo-walk-slot-badge {
    position: absolute;
    right: 2px;
    bottom: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: #f59e0b;
    border-radius: 999px;
}

/* Sticky action bar — the primary action stays in thumb reach. */
.photo-walk-actionbar {
    position: sticky;
    bottom: 0;
    z-index: 2;
    flex-shrink: 0;
    padding: 0.875rem 1rem;
    background: #fff;
    border-top: 1px solid #dee2e6;
}

.photo-walk-start,
.photo-walk-actionbar .photo-walk-secondary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    max-width: 680px;
    margin: 0 auto;
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
}

.photo-walk-secondary {
    color: #212529;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.photo-walk-secondary:hover,
.photo-walk-secondary:focus-visible {
    color: #212529;
    background: #f8f9fc;
}

/* Dark theme */
[data-skin=dark] .photo-walk {
    background: #1f1f1f;
}

[data-skin=dark] .photo-walk-header,
[data-skin=dark] .photo-walk-actionbar,
[data-skin=dark] .photo-walk-stat,
[data-skin=dark] .photo-walk-card,
[data-skin=dark] .photo-walk-include,
[data-skin=dark] .photo-walk-secondary {
    background: #2a2a2a;
    border-color: #3a3a3a;
    color: #e9ecef;
}

[data-skin=dark] .photo-walk-back {
    border-color: #3a3a3a;
    color: #adb5bd;
}

[data-skin=dark] .photo-walk-back:hover,
[data-skin=dark] .photo-walk-back:focus-visible,
[data-skin=dark] .photo-walk-secondary:hover {
    background: #333;
    color: #e9ecef;
}

[data-skin=dark] .photo-walk-title {
    color: #e9ecef;
}

[data-skin=dark] .photo-walk-subtitle {
    color: #adb5bd;
}

[data-skin=dark] .photo-walk-intro-icon {
    background: #1f3a52;
    color: #6cb2eb;
}

[data-skin=dark] .photo-walk-header-title,
[data-skin=dark] .photo-walk-section-title,
[data-skin=dark] .photo-walk-stat-value,
[data-skin=dark] .photo-walk-card-title,
[data-skin=dark] .photo-walk-include-label {
    color: #e9ecef;
}

/* The tinted tiles keep their tone in dark. The rule above is equal in specificity and comes
   later, so it was flattening all three counts to grey — which quietly undid the green/red
   pairing 86e31tkec asks for. Lightened to carry contrast against the #2a2a2a card. */
[data-skin=dark] .photo-walk-stat-green .photo-walk-stat-value {
    color: #4ade80;
}

[data-skin=dark] .photo-walk-stat-red .photo-walk-stat-value {
    color: #f87171;
}

[data-skin=dark] .photo-walk-stat-blue .photo-walk-stat-value {
    color: #6cb2eb;
}

[data-skin=dark] .photo-walk-stat-label,
[data-skin=dark] .photo-walk-card-body,
[data-skin=dark] .photo-walk-include-hint {
    color: #adb5bd;
}

[data-skin=dark] .photo-walk-card-icon,
[data-skin=dark] .photo-walk-callout-icon {
    background: #1f3a52;
    color: #6cb2eb;
}

[data-skin=dark] .photo-walk-callout {
    background: #16293a;
    border-color: #1f3a52;
}

[data-skin=dark] .photo-walk-callout p {
    color: #cfe4f7;
}

[data-skin=dark] .photo-walk-done-list {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .photo-walk-done-list ul {
    color: #e9ecef;
}

[data-skin=dark] .photo-walk-done-note,
[data-skin=dark] .photo-walk-done-list-title {
    color: #adb5bd;
}

[data-skin=dark] .photo-walk-retry {
    background: #2a2a2a;
    border-color: #1f3a52;
    color: #6cb2eb;
}

/* ----------------------------------------------------------------------------
   Live save confirmations (PHOTO-7)

   Positioning only. The toasts themselves are the app's own flash markup — Bootstrap
   `.alert-success` / `.alert-danger` from shared/_flash_notice.html.haml — so a confirmation
   looks like every other message in the app rather than a second visual language. Top-right is
   where the WashUp Admin dashboard already puts its toasts; the offset clears the fixed 72px
   header.
   ---------------------------------------------------------------------------- */
.washup-toast-stack {
    position: fixed;
    top: 88px;
    right: 1rem;
    z-index: 1080;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: min(26rem, calc(100vw - 2rem));
    pointer-events: none;
}

.washup-toast {
    gap: 0.625rem;
    margin-bottom: 0;
    box-shadow: 0 8px 24px -4px rgba(0, 0, 0, 0.18);
    pointer-events: auto;
}

.washup-toast-icon {
    display: inline-flex;
    flex-shrink: 0;
}

.washup-toast-message {
    flex: 1;
    min-width: 0;
}

.washup-toast-action {
    flex-shrink: 0;
    white-space: nowrap;
}

/* Matches the close button in shared/_flash_notice.html.haml. */
.washup-toast-close {
    flex-shrink: 0;
    padding: 0;
    margin-left: 0.25rem;
    line-height: 0;
    color: inherit;
    background: none;
    border: none;
    cursor: pointer;
}

@media (max-width: 575.98px) {
    .washup-toast-stack {
        top: auto;
        bottom: 1rem;
        left: 1rem;
        right: 1rem;
        width: auto;
    }
}

/* ----------------------------------------------------------------------------
   ADD-1/2/3/4 — Add & Edit Equipment form (MyWash::Organisms::EquipmentFormComponent)

   The prototype's Add Equipment screen, translated to the main-app conventions per CLAUDE.md:
   #dee2e6 borders, 0.375rem radius, Bootstrap control sizing, no clamp(). The prototype's
   Tailwind rounded-xl / rounded-2xl look is deliberately not carried over — Inspections, Tasks
   and Services all sit at 0.375rem and this form has to match them, not the mockup.
   -------------------------------------------------------------------------- */
.equipment-form-section {
    padding: 1.25rem 1.5rem;
}

.equipment-form-divider {
    border-top: 1px solid #dee2e6;
}

.equipment-form-field + .equipment-form-field {
    margin-top: 1.25rem;
}

.equipment-form-label {
    display: block;
    margin-bottom: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #212529;
}

.equipment-form-label-muted {
    color: #9aa3ad;
}

.equipment-form-required {
    color: #dc3545;
}

.equipment-form-help {
    margin: 0.375rem 0 0;
    font-size: 0.75rem;
    color: #6c757d;
}

/* ADD-3: the running count of items saved during this session (86e31rp11 reworded it). */
.equipment-form-streak {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 1.5rem 0;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: #0f5132;
    background: #d1e7dd;
    border: 1px solid #badbcc;
    border-radius: 0.375rem;
}

.equipment-form-streak-icon {
    display: inline-flex;
    line-height: 0;
}

.equipment-form-errors {
    margin: 1rem 1.5rem 0;
    padding: 0.625rem 0.875rem;
    font-size: 0.875rem;
    color: #842029;
    background: #f8d7da;
    border: 1px solid #f5c2c7;
    border-radius: 0.375rem;
}

/* Photo + Files dropzones. A <button> rather than a div so it is keyboard reachable without a
   hand-rolled role/tabindex. */
.equipment-form-dropzone {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
    width: 100%;
    min-height: 140px;
    padding: 1.25rem;
    text-align: center;
    background: #f8f9fc;
    border: 2px dashed #dee2e6;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

.equipment-form-dropzone-photo {
    min-height: 180px;
}

.equipment-form-dropzone:hover,
.equipment-form-dropzone:focus-visible,
.equipment-form-dropzone.dragover {
    background: #f0f6fb;
    border-color: #0067b3;
}

.equipment-form-dropzone-icon {
    line-height: 0;
    color: #adb5bd;
}

.equipment-form-dropzone-text {
    font-size: 0.875rem;
    color: #41505f;
}

.equipment-form-dropzone-browse {
    color: #0067b3;
    text-decoration: underline;
}

.equipment-form-dropzone-hint {
    font-size: 0.75rem;
    color: #adb5bd;
}

.equipment-form-photo-preview {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin-top: 0.75rem;
}

.equipment-form-photo-thumb {
    width: 64px;
    height: 64px;
    object-fit: cover;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-form-photo-name {
    font-size: 0.75rem;
    color: #6c757d;
    overflow-wrap: anywhere;
}

/* ADD-2: "Show / Hide Additional Options". */
.equipment-form-collapse-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: #41505f;
    background: none;
    border: none;
}

.equipment-form-collapse-toggle:hover,
.equipment-form-collapse-toggle:focus-visible {
    color: #212529;
}

.equipment-form-collapse-caret {
    display: inline-flex;
    line-height: 0;
    transition: transform 0.15s ease-in-out;
}

.equipment-form-collapse-toggle.is-open .equipment-form-collapse-caret {
    transform: rotate(90deg);
}

/* ADD-4: staged files, each with its own category. */
.equipment-form-file-error {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    color: #dc3545;
}

.equipment-form-file-placeholder,
.equipment-form-file-list {
    margin-top: 0.875rem;
}

/* The locked type selector, shown until a file is staged — the same "dependency is visible, not
   inferred" treatment the Report an Issue modal gives its bay -> item cascade. */
.equipment-form-file-placeholder .form-select:disabled {
    color: #9aa3ad;
    background-color: #f8f9fc;
    cursor: not-allowed;
}

.equipment-form-file-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.625rem;
    padding: 0.625rem 0.75rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-form-file-row + .equipment-form-file-row {
    margin-top: 0.5rem;
}

.equipment-form-file-icon {
    flex-shrink: 0;
    line-height: 0;
    color: #0067b3;
}

/* 86e38xjcx: the filename truncates instead of wrapping. `overflow-wrap: anywhere` let a long
   name break across two or three lines, which is most of why the row "takes up a lot of space" —
   and once the row was that tall the type select and the remove button ended up stacked. The
   full name is on the element's title attribute (set in equipment_file_staging_controller). */
.equipment-form-file-name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.875rem;
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.equipment-form-file-size {
    flex-shrink: 0;
    font-size: 0.75rem;
    color: #6c757d;
}

/* ── 86e38xjcx (Jackson, re-opened): the app dropdown has to wear the form's own metrics ──────
   The bay picker is the shared `services/custom_select`, whose look was drawn for the Services /
   Inspections FILTER PANELS — a 44px row with an 8px radius, a lighter #e5e7eb hairline and a
   drop shadow. Dropped into a form beside `.form-control` inputs it read as a different control
   entirely, which is the ticket: "the height's different… and the border's different than it is
   here". Measured on Add Equipment at 1280px before this block: input 36px tall / 4px radius /
   #ccd2da border / no shadow, against the dropdown at 48px / 8px / #e5e7eb / shadow, with 16px
   500-weight text inside instead of 14px 400.

   The values below are the theme's own `.form-control` (style.min.css: `font-size:0.875rem;
   font-weight:400; line-height:1.5; border:1px solid #ccd2da`) and its focus ring, with the
   padding taken from what an input in this form actually computes to — not hand-picked numbers. Scoped to `.equipment-form-field`: this partial's only other callers are the
   Inspections filter panels, where the 44px filter look is correct and must not move. */
.equipment-form-field .custom-select-wrapper {
    min-width: 0;
    border: 1px solid #ccd2da;
    border-radius: 0.25rem;
    box-shadow: none;
}

.equipment-form-field .custom-select-wrapper:focus-within,
.equipment-form-field .custom-select-wrapper:focus {
    border-color: #a8b7ec;
    box-shadow: 0 0 0 0.25rem rgba(80, 111, 217, 0.25);
}

.equipment-form-field .custom-select-selected {
    min-height: 0;
    /* 0.406rem/0.6rem, not the `.406rem .75rem` style.min.css declares: something downstream
       narrows the horizontal padding, and what an input in this form actually COMPUTES to is
       6.496px/9.6px. Matched to the measurement, so the dropdown's label starts on the same
       pixel as the text in the field above it (it was 2.4px to the right of it). */
    padding: 0.406rem 0.6rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #41505f;
}

/* The last 9px. `.custom-select-arrow` is a remixicon `<i>` at `font-size: 1.25rem`, and an
   inline box inherits the row's line-height as a MULTIPLIER — 20px text against `line-height:
   1.5` gave a 30px line box, which is taller than the 21px text beside it and so became the flex
   row's height: selected 43px, wrapper 45px, against a 36px input. A native `.form-select` never
   shows this because its caret is a background-image, not a glyph on the line. `line-height: 1`
   takes the glyph's box down to its own 20px, under the 21px text, and the row goes back to being
   sized by the label. The icon is unchanged and still centred by the row's `align-items`. */
.equipment-form-field .custom-select-arrow {
    line-height: 1;
}

/* The menu keeps the app's dropdown styling — that is the whole point of not using the OS one —
   but its rows drop to the trigger's type size so the open list reads as the same control. */
.equipment-form-field .custom-select-option {
    font-size: 0.875rem;
}

/* 86e38xjcx: shrinkable. At `flex: 0 0 13rem` the select could not give up any of its 208px, so
   on a narrow screen it was pushed onto a line of its own and the remove button onto another —
   the "stacked" X in the ticket. `0 1` not `1 1`: it must SHRINK but never GROW, or it fills the
   whole line by itself and pushes the X underneath again (measured: 314px wide, X 54px below). */
.equipment-form-file-type {
    flex: 0 1 13rem;
    min-width: 0;
    max-width: 100%;
}

/* 86e38xjcx: pinned to the right of the select, never under it. */
.equipment-form-file-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: auto;
    width: 32px;
    height: 32px;
    color: #6c757d;
    background: none;
    border: none;
    border-radius: 0.375rem;
}

.equipment-form-file-remove:hover,
.equipment-form-file-remove:focus-visible {
    color: #dc3545;
    background: #f8d7da;
}

/* 86e36t2z1 §A.24/§A.78 — NOT pinned. This is a correction: an earlier pass set
   `position: sticky; bottom: 0` here and reported the finding done. It never worked.
   Why, measured rather than assumed: a sticky box is clamped to its containing block, so it can
   only rise as far as that block's bottom edge allows. This footer is the last child of the
   form, so the room is zero — and adding `padding-bottom` to the form only buys travel equal to
   that padding. On a form 350px taller than the viewport the footer stayed 350px below it at
   scroll 0, with and without the padding. Sticky cannot pin a footer from the top of a long
   page; it can only hold it for the last few pixels of scroll. (The wizard's footer looks
   pinned for the same reason in reverse: its page is barely taller than the viewport.)
   Doing this for real needs `position: fixed` offset by the sidebar — `.main-app` sits at
   margin-left: 250px — which hardcodes a layout constant across every breakpoint and the
   collapsed state. That is a layout decision, not a CSS tweak, so the footer stays in normal
   flow until it is made. The border and opaque background still read correctly there.
   DO NOT re-add `position: sticky` here. It has now been tried twice. */
.equipment-form-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 1rem 1.5rem;
    background: #fff;
    border-top: 1px solid #dee2e6;
}

/* The equipment form's card holds dropdowns (the bay select) and
   the theme's `.card { overflow: hidden }` clips them — the same :has() pattern CLAUDE.md
   documents. Harmless and useful independently of the footer. */
.card:has(.equipment-form-footer),
.card:has(.equipment-form-footer) .card-body {
    overflow: visible !important;
}

/* Cancel survives on the Edit form only (§A.25). It was .btn-secondary — a solid near-black
   button that read as the loudest thing in the footer, louder than the actual save. */
.equipment-form-cancel {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #41505f;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
    text-decoration: none;
}

.equipment-form-cancel:hover {
    color: #212830;
    background: #f8f9fc;
    border-color: #c9d2dc;
}

[data-skin=dark] .equipment-form-footer {
    background: #2a2a2a;
}

[data-skin=dark] .equipment-form-cancel {
    color: #d4dae1;
    background: #2e3641;
    border-color: #3a4450;
}

/* 86e38xheg: the Archive / Unarchive button in the Edit Equipment header. Bootstrap's
   `.btn-outline-*` is transparent, so on the header's grey ground it read as an outline drawn on
   the page rather than a button sitting on it. A white fill is what the ticket asks for and what
   the artifact's own Archive affordance sits on (its Actions menu is a white sheet).

   Deliberately NOT Bootstrap's `.bg-white` utility: that is `!important`, so it would survive
   `:hover`, where `.btn-outline-danger` turns the label white — white on white, the same trap
   CLAUDE.md records for `.btn-outline-secondary`. Plain specificity instead: this sets the
   resting fill and the theme's `:hover`/`:focus`/`:active` rules still win. */
.equipment-archive-action {
    background-color: #fff;
}

[data-skin=dark] .equipment-archive-action {
    background-color: #2e3641;
}

@media (max-width: 575.98px) {
    .equipment-form-section {
        padding: 1rem;
    }

    .equipment-form-streak,
    .equipment-form-errors {
        margin-left: 1rem;
        margin-right: 1rem;
    }

    .equipment-form-footer {
        padding: 1rem;
    }

    .equipment-form-footer .btn {
        flex: 1 1 100%;
    }

    /* 86e38xheg (Jackson): "these buttons just be on the same line ... they can take 50 and 50".
       A footer WITH a Cancel is the Edit form, whose pair is the artifact's
       `flex-1 sm:flex-none` Cancel + Save (src/app/App.tsx, the edit header) — side by side and
       equal below the breakpoint, natural width above it, which is already what happens at
       >= 576px here. The rule above put the submit on 100% and Cancel is not a `.btn`, so it
       kept its own 77px line and the submit dropped to the next one.

       `:has()` keeps the Add form out of it: that footer has no Cancel, and its pair is
       "Save & Add Another" + "Add Equipment" — two long labels that are right to stay stacked.

       The basis is a percentage, not 0: Cancel pads 1rem a side and a Bootstrap `.btn` pads
       0.75rem, so under `flex: 1 1 0` that 8px of padding difference survives into the grow —
       measured 170 / 162 on a 390px phone. A percentage basis makes the border-box halves equal
       up front. (Same reason as .mw-history-toolbar-actions, 86e38wwcx.)

       And it is 50% MINUS half the gap, because this footer wraps: a flat 50% each plus the
       0.5rem gap is wider than the row, so the two wrapped onto separate lines and then grew to
       full width — the original bug, by a new route. */
    .equipment-form-footer:has(.equipment-form-cancel) .equipment-form-cancel,
    .equipment-form-footer:has(.equipment-form-cancel) .btn {
        flex: 1 1 calc(50% - 0.25rem);
        justify-content: center;
    }

    /* 86e38xjcx: the select shares its line with the remove button instead of taking the whole
       width. `flex-basis: 100%` here was the actual cause of the "stacked" X — the select filled
       the line on its own, so the button had nowhere to go but the next one. Basis 0 + grow lets
       it take whatever the 32px button leaves. */
    .equipment-form-file-type {
        flex: 1 1 0;
    }
}

/* ----------------------------------------------------------------------------
   ADD-5 — reveal the record fields that are still empty
   -------------------------------------------------------------------------- */
.equipment-record-table-value-blank {
    color: #adb5bd;
    font-style: italic;
}

.equipment-record-fields-toggle {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: -0.75rem;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: #0067b3;
    background: none;
    border: none;
}

.equipment-record-fields-toggle:hover,
.equipment-record-fields-toggle:focus-visible {
    text-decoration: underline;
}

.equipment-record-fields-caret {
    display: inline-flex;
    line-height: 0;
    transition: transform 0.15s ease-in-out;
}

.equipment-record-fields-toggle.is-open .equipment-record-fields-caret {
    transform: rotate(90deg);
}

/* 86e36t2z1 §A.5: the control moved from under the table into a header row beside the
   section title, and swapped the caret for an eye / eye-off pair. Only the icon matching
   the current state is drawn — .is-open means the empty rows are showing, so the offered
   action is "hide". */
/* 86e36t2z1 §A.4/§A.5: the title and the show/hide control sit INSIDE the card, as a header
   row above the table — the same anatomy as .recent-activity-card beside it, which is what the
   prototype does. They used to float above the border, reading as a page heading rather than as
   this card's own header. */
.equipment-record-fields {
    background: #f9fafb;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
}

.equipment-record-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.875rem 1.25rem;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
}

.equipment-record-title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212830;
}

.equipment-record-header .equipment-record-fields-toggle {
    margin-top: 0;
    white-space: nowrap;
}

.equipment-record-fields-icon {
    display: none;
    line-height: 0;
}

.equipment-record-fields-toggle.is-open .equipment-record-fields-icon-hide,
.equipment-record-fields-toggle:not(.is-open) .equipment-record-fields-icon-show {
    display: inline-flex;
}

[data-skin=dark] .equipment-record-fields {
    background: #262d36;
    border-color: #3a4450;
}

[data-skin=dark] .equipment-record-header {
    background: #2e3641;
    border-bottom-color: #3a4450;
}

[data-skin=dark] .equipment-record-title {
    color: #e6e9ed;
}

/* ----------------------------------------------------------------------------
   Dark skin — ADD-1..5
   -------------------------------------------------------------------------- */
[data-skin=dark] .equipment-form-label {
    color: #e9ecef;
}

[data-skin=dark] .equipment-form-help,
[data-skin=dark] .equipment-form-photo-name,
[data-skin=dark] .equipment-form-file-size {
    color: #9aa3ad;
}

[data-skin=dark] .equipment-form-divider,
[data-skin=dark] .equipment-form-footer {
    border-color: #2b3035;
}

[data-skin=dark] .equipment-form-streak {
    color: #75b798;
    background: #051b11;
    border-color: #0f5132;
}

[data-skin=dark] .equipment-form-errors {
    color: #ea868f;
    background: #2c0b0e;
    border-color: #842029;
}

[data-skin=dark] .equipment-form-dropzone {
    background: #1b1f22;
    border-color: #2b3035;
}

[data-skin=dark] .equipment-form-dropzone:hover,
[data-skin=dark] .equipment-form-dropzone:focus-visible,
[data-skin=dark] .equipment-form-dropzone.dragover {
    background: #12242f;
    border-color: #0067b3;
}

[data-skin=dark] .equipment-form-dropzone-text {
    color: #ced4da;
}

[data-skin=dark] .equipment-form-photo-thumb {
    border-color: #2b3035;
}

[data-skin=dark] .equipment-form-collapse-toggle {
    color: #ced4da;
}

[data-skin=dark] .equipment-form-collapse-toggle:hover,
[data-skin=dark] .equipment-form-collapse-toggle:focus-visible {
    color: #f8f9fa;
}

[data-skin=dark] .equipment-form-file-placeholder .form-select:disabled {
    background-color: #1b1f22;
}

[data-skin=dark] .equipment-form-file-row {
    background: #22262a;
    border-color: #2b3035;
}

[data-skin=dark] .equipment-form-file-name {
    color: #e9ecef;
}

[data-skin=dark] .equipment-form-file-remove:hover,
[data-skin=dark] .equipment-form-file-remove:focus-visible {
    color: #ea868f;
    background: #2c0b0e;
}

[data-skin=dark] .equipment-record-table-value-blank {
    color: #6c757d;
}

[data-skin=dark] .equipment-record-fields-toggle {
    color: #6ea8fe;
}

/* ----------------------------------------------------------------------------
   Copy equipment flow (COPY-1..COPY-6)

   The drawer's second mode: three steps in one panel, shown one at a time. Layout and copy follow
   the MyWash 2.0 prototype's "Duplicate from another location" panel; the tokens are the app's
   (#dee2e6 borders, 0.375rem radii, Bootstrap control sizing) rather than the prototype's.

   Selection uses real radio/checkbox inputs, visually hidden and drawn as .copy-bay-mark, so the
   form serializes itself and keyboard/screen-reader behaviour is the browser's.
   ---------------------------------------------------------------------------- */
.copy-flow-header {
    align-items: flex-start;
}

.copy-flow-heading {
    min-width: 0;
}

.copy-flow-step-badge {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #0067b3;
    margin-bottom: 0.25rem;
}

.copy-flow-body {
    display: flex;
    flex-direction: column;
}

.copy-flow-step {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.copy-flow-step[hidden] {
    display: none;
}

.copy-flow-eyebrow {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6c757d;
    margin: 0.25rem 0 0;
}

.copy-flow-empty {
    font-size: 0.875rem;
    color: #6c757d;
    text-align: center;
    margin: 0.5rem 0 0;
}

.copy-flow-locations {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Location card — collapsed to its header until opened */
.copy-location {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    overflow: hidden;
}

.copy-location-header {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.625rem 0.75rem;
    background: transparent;
    border: 0;
    text-align: left;
}

.copy-location-header:hover {
    background: #f8f9fc;
}

.copy-location-pin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    border-radius: 0.375rem;
    background: #e8f1fb;
    color: #0067b3;
}

.copy-location-text {
    flex: 1;
    min-width: 0;
}

.copy-location-name {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.copy-location-current {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 999px;
    padding: 0.0625rem 0.375rem;
}

.copy-location-meta {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
}

.copy-location-meta.is-selected {
    color: #0067b3;
    font-weight: 600;
}

.copy-location-caret {
    display: inline-flex;
    flex-shrink: 0;
    color: #6c757d;
    transition: transform 0.15s ease;
}

.copy-location.is-open .copy-location-caret {
    transform: rotate(180deg);
}

.copy-location-body {
    display: none;
    padding: 0 0.75rem 0.75rem;
}

.copy-location.is-open .copy-location-body {
    display: block;
}

.copy-bay-list {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-top: 0.375rem;
}

/* A selectable bay. The real input is hidden; .copy-bay-mark is the visible control. */
.copy-bay-option {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.5rem 0.625rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    cursor: pointer;
}

.copy-bay-option:hover {
    background: #f8f9fc;
}

.copy-bay-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.copy-bay-name {
    flex: 1;
    min-width: 0;
    font-size: 0.875rem;
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.copy-bay-count {
    font-size: 0.75rem;
    color: #6c757d;
    flex-shrink: 0;
}

.copy-bay-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    border: 2px solid #adb5bd;
    border-radius: 50%;
    background: #fff;
    color: transparent;
}

.copy-bay-mark.is-box {
    border-radius: 0.25rem;
}

.copy-bay-input:checked ~ .copy-bay-mark {
    border-color: #0067b3;
    background: #0067b3;
    color: #fff;
}

/* The filled dot for a chosen radio. The checkbox draws a tick instead (a lucide check in the
   markup), so this only applies to the round mark. */
.copy-bay-input:checked ~ .copy-bay-mark:not(.is-box)::after {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
}

.copy-bay-input:checked ~ .copy-bay-name {
    font-weight: 600;
}

.copy-bay-option:has(.copy-bay-input:checked) {
    border-color: #0067b3;
    background: #f5faff;
}

.copy-bay-input:focus-visible ~ .copy-bay-mark {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
}

/* A bay with nothing in it cannot be a source, and the bay being copied FROM cannot also be a
   destination — both read as unavailable rather than disappearing, so the list stays stable. */
.copy-bay-option.is-empty,
.copy-bay-option.is-source {
    opacity: 0.55;
    cursor: not-allowed;
    background: #f8f9fa;
}

.copy-bay-option.is-empty:hover,
.copy-bay-option.is-source:hover {
    background: #f8f9fa;
}

.copy-bay-option.is-source {
    border-style: dashed;
}

/* Inline "create a bay" row (COPY-2) */
.copy-new-bay-label {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #0067b3;
    font-weight: 500;
}

.copy-new-bay-fields {
    padding: 0.5rem 0.625rem 0;
}

.copy-new-bay-fields[hidden] {
    display: none;
}

.copy-new-bay-field-label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.25rem;
}

.copy-new-bay-input {
    font-size: 1rem;
}

.copy-new-bay-hint {
    font-size: 0.75rem;
    color: #6c757d;
    margin: 0.25rem 0 0;
    visibility: hidden;
}

.copy-new-bay.is-unnamed .copy-new-bay-hint {
    visibility: visible;
    color: #b02a37;
}

.copy-new-bay.is-unnamed .copy-new-bay-input {
    border-color: #b02a37;
}

/* Step 2 — "Copying from <bay> · <location>" banner */
.copy-flow-source-banner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    padding: 0.625rem 0.75rem;
    font-size: 0.875rem;
    color: #495057;
    background: #f5faff;
    border: 1px solid #cfe4f5;
    border-radius: 0.375rem;
}

.copy-flow-source-pin {
    display: inline-flex;
    color: #0067b3;
    flex-shrink: 0;
}

/* Step 2 — the three content toggles (COPY-4) */
.copy-toggle-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.copy-toggle {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.copy-toggle-icon {
    display: inline-flex;
    color: #6c757d;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.copy-toggle-text {
    flex: 1;
    min-width: 0;
}

.copy-toggle-label {
    display: block;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.copy-toggle-desc {
    display: block;
    font-size: 0.75rem;
    color: #6c757d;
}

.copy-switch {
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.copy-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.copy-switch-track {
    display: block;
    position: relative;
    width: 40px;
    height: 22px;
    border-radius: 999px;
    background: #ced4da;
    transition: background 0.15s ease;
}

.copy-switch-track::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    transition: left 0.15s ease;
}

.copy-switch input:checked ~ .copy-switch-track {
    background: #0067b3;
}

.copy-switch input:checked ~ .copy-switch-track::after {
    left: 21px;
}

.copy-switch input:focus-visible ~ .copy-switch-track {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
}

/* COPY-5's warning, on step 2 and again as chips on step 3 */
.copy-flow-note {
    display: flex;
    gap: 0.625rem;
    padding: 0.75rem;
    background: #fff9e6;
    border: 1px solid #f2d380;
    border-radius: 0.375rem;
}

.copy-flow-note-icon {
    display: inline-flex;
    color: #b45309;
    flex-shrink: 0;
    margin-top: 0.125rem;
}

.copy-flow-note-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #92400e;
    margin: 0;
}

.copy-flow-note-body {
    font-size: 0.75rem;
    line-height: 1.5;
    color: #92400e;
    margin: 0.25rem 0 0;
}

/* Step 3 — review */
.copy-review-card {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.copy-review-block {
    padding: 0.75rem;
}

.copy-review-block .copy-flow-eyebrow {
    margin-top: 0;
}

.copy-review-divider {
    height: 1px;
    background: #dee2e6;
}

.copy-review-value {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    margin: 0.25rem 0 0;
}

.copy-review-destinations {
    list-style: none;
    margin: 0.25rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.125rem;
}

.copy-review-destination {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.copy-flow-append-note {
    font-size: 0.75rem;
    line-height: 1.5;
    color: #6c757d;
    margin: 0;
}

.copy-review-panel {
    padding: 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid #dee2e6;
}

.copy-review-panel.is-included {
    border-color: #badbcc;
    background: #f4fbf6;
}

.copy-review-panel.is-excluded {
    border-color: #f2d380;
    background: #fff9e6;
}

.copy-review-panel-title {
    font-size: 0.875rem;
    font-weight: 600;
    margin: 0;
}

.copy-review-panel.is-included .copy-review-panel-title {
    color: #276d40;
}

.copy-review-panel.is-excluded .copy-review-panel-title {
    color: #92400e;
}

.copy-review-panel-subtitle {
    font-size: 0.75rem;
    color: #92400e;
    margin: 0.125rem 0 0;
}

.copy-review-list {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.copy-review-item {
    position: relative;
    padding-left: 1.25rem;
    font-size: 0.875rem;
    color: #276d40;
}

.copy-review-item::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.375rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #43a047;
}

.copy-review-chips {
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.copy-review-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 500;
    color: #92400e;
    border: 1px solid #e0b840;
    border-radius: 999px;
    padding: 0.125rem 0.5rem;
}

/* Footer: Back sits alongside whichever forward button the step is on (Continue, then Copy). */
.copy-flow-footer > .btn[hidden] {
    display: none;
}

.copy-flow-footer .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.375rem;
}

/* ---------------------------------------------------------------- dark theme */
[data-skin=dark] .copy-location,
[data-skin=dark] .copy-bay-option,
[data-skin=dark] .copy-toggle,
[data-skin=dark] .copy-review-card {
    background: #2b3035;
    border-color: #495057;
}

[data-skin=dark] .copy-location-header:hover,
[data-skin=dark] .copy-bay-option:hover {
    background: #343a40;
}

[data-skin=dark] .copy-location-name,
[data-skin=dark] .copy-bay-name,
[data-skin=dark] .copy-toggle-label,
[data-skin=dark] .copy-review-value,
[data-skin=dark] .copy-review-destination {
    color: #e9ecef;
}

[data-skin=dark] .copy-location-pin,
[data-skin=dark] .copy-location-current {
    background: #143a5a;
    color: #6ea8fe;
}

[data-skin=dark] .copy-location-meta.is-selected,
[data-skin=dark] .copy-new-bay-label,
[data-skin=dark] .copy-flow-step-badge,
[data-skin=dark] .copy-flow-source-pin {
    color: #6ea8fe;
}

[data-skin=dark] .copy-bay-mark {
    background: #2b3035;
    border-color: #6c757d;
}

[data-skin=dark] .copy-bay-option:has(.copy-bay-input:checked) {
    background: #14293d;
    border-color: #0067b3;
}

[data-skin=dark] .copy-bay-option.is-empty,
[data-skin=dark] .copy-bay-option.is-source,
[data-skin=dark] .copy-bay-option.is-empty:hover,
[data-skin=dark] .copy-bay-option.is-source:hover {
    background: #212529;
}

[data-skin=dark] .copy-flow-source-banner {
    background: #14293d;
    border-color: #1b4d75;
    color: #ced4da;
}

[data-skin=dark] .copy-switch-track {
    background: #495057;
}

[data-skin=dark] .copy-flow-note,
[data-skin=dark] .copy-review-panel.is-excluded {
    background: #2e2410;
    border-color: #8a6d1f;
}

[data-skin=dark] .copy-flow-note-title,
[data-skin=dark] .copy-flow-note-body,
[data-skin=dark] .copy-review-panel.is-excluded .copy-review-panel-title,
[data-skin=dark] .copy-review-panel-subtitle,
[data-skin=dark] .copy-review-chip {
    color: #ffda6a;
}

[data-skin=dark] .copy-review-chip {
    border-color: #8a6d1f;
}

[data-skin=dark] .copy-review-panel.is-included {
    background: #10251a;
    border-color: #2f6b45;
}

[data-skin=dark] .copy-review-panel.is-included .copy-review-panel-title,
[data-skin=dark] .copy-review-item {
    color: #75b798;
}

[data-skin=dark] .copy-review-divider {
    background: #495057;
}

[data-skin=dark] .copy-new-bay-field-label {
    color: #ced4da;
}

/* ----------------------------------------------------------------------------
   CSV-1/2/3 — Import Equipment from CSV
   (MyWash::Organisms::EquipmentImportComponent + EquipmentImportReviewComponent)

   Follows the prototype's CSV import screen, translated to the main-app conventions per
   CLAUDE.md: #dee2e6 borders, 0.375rem radius, Bootstrap control sizing, no clamp(). The
   dropzone and the footer are EquipmentFormComponent's own `.equipment-form-*` classes reused
   as-is, so the CSV page and the Add Equipment page read as the same screen.
   -------------------------------------------------------------------------- */

/* The Services-style back button, whose own CSS is scoped to .services-header. Same treatment
   the Inspections detail header gives it (.attention-detail-header .back-button). */
.equipment-import-header .back-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    margin-right: 0.75rem;
    padding: 0;
    background-color: transparent;
    border: 1px solid #6e7985;
    border-radius: 0.375rem;
    color: #6e7985;
    text-decoration: none;
    transition: background-color 0.15s, color 0.15s;
    flex-shrink: 0;
}

.equipment-import-header .back-button:hover,
.equipment-import-header .back-button:focus-visible {
    background-color: #6e7985;
    border-color: #6e7985;
    color: #fff;
}

/* 86e36t2z1 §A.79: the artifact's column measures 820px; ours was 900. */
.equipment-import {
    max-width: 820px;
    margin: 0 auto;
    padding: 1.25rem 1.5rem 0;
}

.equipment-import-intro {
    margin: 0 0 1.25rem;
    font-size: 1rem;
    color: #6c757d;
}

.equipment-import-errors {
    margin: 0 0 1.25rem;
}

/* "Importing into <bay>" — the destination is fixed by where the user started, so it is stated
   rather than chosen. */
.equipment-import-destination {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
    background: #f0f7ff;
    border: 1px solid #cfe4f7;
    border-radius: 0.375rem;
}

.equipment-import-destination-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    background: #fff;
    border-radius: 0.375rem;
    color: #0067b3;
    flex-shrink: 0;
}

.equipment-import-destination-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
}

.equipment-import-destination-label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #41505f;
}

.equipment-import-destination-name {
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.equipment-import-destination-note {
    font-size: 0.75rem;
    text-align: right;
    color: #6c757d;
    flex-shrink: 0;
    max-width: 170px;
}

.equipment-import-step {
    margin-top: 2rem;
}

.equipment-import-step-title {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    font-size: 1.125rem;
    font-weight: 700;
    color: #212529;
}

.equipment-import-step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    font-size: 0.875rem;
    font-weight: 700;
    background: #eef1f5;
    border-radius: 50%;
    flex-shrink: 0;
}

.equipment-import-step-body {
    padding-left: 2.5rem;
}

.equipment-import-step-text {
    margin: 0.75rem 0 1rem;
    font-size: 0.875rem;
    color: #6c757d;
}

.equipment-import-step-note {
    margin: 0.75rem 0 1rem;
    font-size: 0.75rem;
    color: #6c757d;
}

/* CSV-1 AC1: the template's column layout, before a file is chosen. */
.equipment-import-columns {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    overflow: hidden;
}

.equipment-import-column {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.875rem 1rem;
}

.equipment-import-column + .equipment-import-column {
    border-top: 1px solid #eef1f5;
}

.equipment-import-column-main {
    flex: 1 1 auto;
    min-width: 0;
}

.equipment-import-column-heading {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem 0.75rem;
}

.equipment-import-column-key {
    padding: 0.125rem 0.375rem;
    font-size: 0.75rem;
    background: #f1f3f6;
    border-radius: 0.375rem;
    color: #41505f;
}

.equipment-import-column-key.is-required {
    background: #fdeef0;
    color: #c10046;
}

.equipment-import-column-name {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
}

.equipment-import-column-desc {
    font-size: 0.8125rem;
    color: #6c757d;
}

.equipment-import-column-help {
    margin: 0.375rem 0 0;
    font-size: 0.75rem;
    color: #9aa3ad;
}

.equipment-import-column-badge {
    padding: 0.25rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 600;
    border-radius: 999px;
    flex-shrink: 0;
}

.equipment-import-column-badge.is-required {
    background: #ffe2e2;
    color: #c10007;
}

.equipment-import-column-badge.is-optional {
    background: #f0f2f5;
    color: #6e7985;
}

.equipment-import-template-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.equipment-import-dropzone {
    min-height: 200px;
}

/* The chosen file, in place of the dropzone. */
.equipment-import-file {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-import-file-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: #d1e7dd;
    border-radius: 0.375rem;
    color: #0f5132;
    flex-shrink: 0;
}

.equipment-import-file-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
}

.equipment-import-file-name {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212529;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.equipment-import-file-size {
    font-size: 0.75rem;
    color: #6c757d;
}

.equipment-import-file-replace {
    padding: 0;
    font-size: 0.8125rem;
    font-weight: 500;
    background: none;
    border: 0;
    color: #0067b3;
    text-decoration: underline;
    flex-shrink: 0;
}

.equipment-import-file-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    background: none;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #6c757d;
    flex-shrink: 0;
}

.equipment-import-file-remove:hover,
.equipment-import-file-remove:focus-visible {
    color: #dc3545;
    background: #f8d7da;
}

.equipment-import-file-error {
    margin: 0.75rem 0 0;
    font-size: 0.8125rem;
    color: #dc3545;
}

/* --- Review step (CSV-3) --------------------------------------------------- */

.equipment-import-summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem 1.25rem;
    margin-top: 1.25rem;
    padding: 1rem 1.25rem;
    background: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-import-count {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    flex-shrink: 0;
}

.equipment-import-count.is-ready {
    background: #d1e7dd;
    border-color: #badbcc;
    color: #0f5132;
}

.equipment-import-count.is-failed {
    background: #f8d7da;
    border-color: #f5c2c7;
    color: #842029;
}

.equipment-import-count.is-clean {
    background: #eef1f5;
    border-color: #dee2e6;
    color: #6c757d;
}

.equipment-import-count-value {
    font-size: 1.25rem;
    font-weight: 700;
}

.equipment-import-count-label {
    font-size: 0.8125rem;
    font-weight: 500;
}

.equipment-import-summary-text {
    margin: 0;
    font-size: 0.875rem;
    color: #41505f;
    flex: 1 1 240px;
}

.equipment-import-section {
    margin-top: 1.75rem;
}

.equipment-import-section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

.equipment-import-section-title.is-ready {
    color: #0f5132;
}

.equipment-import-section-title.is-failed {
    color: #842029;
}

.equipment-import-section-text {
    margin: 0.5rem 0 0.875rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Wide tables scroll inside their own container so the page never scrolls sideways. */
.equipment-import-table-scroll {
    overflow-x: auto;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.equipment-import-table {
    margin: 0;
    font-size: 0.875rem;
}

.equipment-import-table > :not(caption) > * > * {
    padding: 0.625rem 0.875rem;
}

.equipment-import-table thead th {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    color: #6c757d;
    background: #f8f9fc;
    white-space: nowrap;
}

.equipment-import-table tbody td {
    color: #212529;
    vertical-align: top;
}

.equipment-import-col-row {
    width: 1%;
    white-space: nowrap;
    color: #6c757d;
}

.equipment-import-cell-name {
    font-weight: 500;
}

.equipment-import-reason {
    color: #842029;
}

.equipment-import-blank {
    color: #adb5bd;
}

.equipment-import-empty {
    padding: 2rem 1.25rem;
    text-align: center;
    background: #f8f9fc;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.equipment-import-empty-icon {
    display: inline-flex;
    color: #adb5bd;
}

.equipment-import-empty-title {
    margin: 0.5rem 0 0.25rem;
    font-size: 1rem;
    font-weight: 600;
    color: #212529;
}

.equipment-import-empty-text {
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

/* The footer is EquipmentFormComponent's, but this page centres its body on a 900px column, so
   the rule has to sit flush with the card rather than the column. */
.equipment-import .equipment-form-footer {
    margin: 1.75rem -1.5rem 0;
}

@media (max-width: 575.98px) {
    .equipment-import {
        padding: 1rem 1rem 0;
    }

    .equipment-import .equipment-form-footer {
        margin: 1.5rem -1rem 0;
        padding: 1rem;
    }

    .equipment-import-step-body {
        padding-left: 0;
    }

    .equipment-import-destination-note {
        display: none;
    }
}

/* --- Dark theme ------------------------------------------------------------ */

[data-skin=dark] .equipment-import-intro,
[data-skin=dark] .equipment-import-step-text,
[data-skin=dark] .equipment-import-step-note,
[data-skin=dark] .equipment-import-section-text,
[data-skin=dark] .equipment-import-file-size,
[data-skin=dark] .equipment-import-empty-text {
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-step-title,
[data-skin=dark] .equipment-import-column-name,
[data-skin=dark] .equipment-import-destination-name,
[data-skin=dark] .equipment-import-file-name,
[data-skin=dark] .equipment-import-empty-title,
[data-skin=dark] .equipment-import-table tbody td {
    color: #f8f9fa;
}

[data-skin=dark] .equipment-import-header .back-button {
    border-color: #adb5bd;
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-header .back-button:hover,
[data-skin=dark] .equipment-import-header .back-button:focus-visible {
    background-color: #adb5bd;
    border-color: #adb5bd;
    color: #212529;
}

[data-skin=dark] .equipment-import-destination {
    background: #14293d;
    border-color: #1b4d75;
}

[data-skin=dark] .equipment-import-destination-icon {
    background: #212529;
    color: #6ea8d8;
}

[data-skin=dark] .equipment-import-destination-label,
[data-skin=dark] .equipment-import-destination-note,
[data-skin=dark] .equipment-import-summary-text {
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-step-number {
    background: #343a40;
    color: #f8f9fa;
}

[data-skin=dark] .equipment-import-columns,
[data-skin=dark] .equipment-import-file,
[data-skin=dark] .equipment-import-table-scroll {
    background: #2b3035;
    border-color: #495057;
}

[data-skin=dark] .equipment-import-column + .equipment-import-column {
    border-top-color: #495057;
}

[data-skin=dark] .equipment-import-column-key {
    background: #343a40;
    color: #ced4da;
}

[data-skin=dark] .equipment-import-column-key.is-required {
    background: #3d1620;
    color: #ea868f;
}

[data-skin=dark] .equipment-import-column-desc,
[data-skin=dark] .equipment-import-column-help,
[data-skin=dark] .equipment-import-col-row,
[data-skin=dark] .equipment-import-blank {
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-column-badge.is-required {
    background: #3d1620;
    color: #ea868f;
}

[data-skin=dark] .equipment-import-column-badge.is-optional {
    background: #343a40;
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-file-icon {
    background: #10251a;
    color: #75b798;
}

[data-skin=dark] .equipment-import-file-remove {
    border-color: #495057;
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-file-remove:hover,
[data-skin=dark] .equipment-import-file-remove:focus-visible {
    background: #3d1620;
    color: #ea868f;
}

[data-skin=dark] .equipment-import-file-error,
[data-skin=dark] .equipment-import-reason,
[data-skin=dark] .equipment-import-section-title.is-failed {
    color: #ea868f;
}

[data-skin=dark] .equipment-import-section-title.is-ready {
    color: #75b798;
}

[data-skin=dark] .equipment-import-summary,
[data-skin=dark] .equipment-import-empty {
    background: #2b3035;
    border-color: #495057;
}

[data-skin=dark] .equipment-import-count.is-ready {
    background: #10251a;
    border-color: #2f6b45;
    color: #75b798;
}

[data-skin=dark] .equipment-import-count.is-failed {
    background: #3d1620;
    border-color: #6f2b36;
    color: #ea868f;
}

[data-skin=dark] .equipment-import-count.is-clean {
    background: #343a40;
    border-color: #495057;
    color: #adb5bd;
}

[data-skin=dark] .equipment-import-table thead th {
    background: #343a40;
    color: #adb5bd;
    border-color: #495057;
}

[data-skin=dark] .equipment-import-table tbody td {
    border-color: #495057;
}

/* ----------------------------------------------------------------------------
   WIZ-1..WIZ-8 — Equipment Setup Wizard
   (MyWash::Organisms::SetupWizardComponent, setup_wizard_controller.js)

   Follows the prototype's "Equipment Setup" screen, translated to the main-app conventions per
   CLAUDE.md: #dee2e6 borders, 0.375rem radius, Bootstrap control sizing, no clamp(), no Tailwind.
   Step 4's bay picker deliberately has no styles of its own — it reuses the copy flow's `.copy-*`
   picker above, because it is the same list shown for the same reason.
   -------------------------------------------------------------------------- */

.wizard {
    padding: 1.5rem 1rem 0;
}

@media (min-width: 768px) {
    .wizard {
        padding: 2rem 2rem 0;
    }
}

/* The Services-style back button, whose own CSS is scoped to .services-header. Same treatment as
   the CSV import page's header, for the same reason. */
.wizard-header .back-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    margin-right: 0.75rem;
    padding: 0;
    border: 1px solid #6e7985;
    border-radius: 0.375rem;
    background: transparent;
    color: #6e7985;
    flex-shrink: 0;
}

.wizard-header .back-button:hover {
    background: #6e7985;
    color: #fff;
}

/* --- The four-step indicator ------------------------------------------------ */

/* ── 86e36t2z1 §A.55: the four-step indicator ─────────────────────────────────────────────
   The artifact replaced the Aug 4 design's centred, stacked "title over subtitle" markers with a
   full-width single line: marker and label side by side, and the rail between them stretching to
   fill whatever space is left. Measured off prototype-latest/wizard-step1-bay.png and
   wizard-step2-top.png — 24px markers, the rail turning blue behind every step the user has
   already finished, and a completed step showing a check in place of its number. */
/* 86e38xk4f — the wizard's sticky top chrome: the step counter, plus the context bar on steps
   2-4. One block so a single offset positions both and they cannot overlap.

   `top: 72px` clears the fixed .header-main navbar, the same offset .photo-walk-header and the
   inspections perform bar use. Opaque background because the step list scrolls under it.

   This CAN pin, unlike .equipment-form-footer above: a sticky box is clamped to its containing
   block, and this one's is the whole wizard form — tall enough to travel. That note explains why
   a sticky FOOTER on a long form cannot work; a header near the top of one is the easy direction.

   The "Equipment Setup" title is deliberately NOT in here — it lives in the card header and
   scrolls away, per the ticket, even though the prototype pins it too. */
.wizard-sticky {
    position: sticky;
    top: 72px;
    z-index: 4;
    background: #fff;
}

.wizard-steps {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 0 1.75rem;
    padding: 0 0 1rem;
    border-bottom: 1px solid #e2e5ec;
    list-style: none;
}

.wizard-step {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

/* Every step but the last grows, so its rail takes all the slack and the four steps spread
   evenly across the row however wide it is. */
.wizard-step:not(:last-child) {
    flex: 1 1 0;
}

.wizard-step:not(:last-child)::after {
    content: "";
    flex: 1 1 auto;
    min-width: 1rem;
    height: 2px;
    margin: 0 0.75rem;
    background: #dee2e6;
}

/* Blue behind a step the user is past — the rail fills in as they go. */
.wizard-step.is-done:not(:last-child)::after {
    background: #0067b3;
}

.wizard-step-marker {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background: #e2e5ec;
    color: #8a94a0;
    font-size: 0.75rem;
    font-weight: 600;
}

.wizard-step.is-current .wizard-step-marker,
.wizard-step.is-done .wizard-step-marker {
    background: #0067b3;
    color: #fff;
}

.wizard-step-tick {
    display: none;
}

.wizard-step.is-done .wizard-step-number {
    display: none;
}

.wizard-step.is-done .wizard-step-tick {
    display: inline-flex;
}

.wizard-step-label {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: 500;
    color: #8a94a0;
    white-space: nowrap;
}

.wizard-step.is-current .wizard-step-label {
    font-weight: 600;
    color: #212830;
}

.wizard-step.is-done .wizard-step-label {
    color: #212830;
}

/* Narrow screens cannot fit four labels on one line; the markers and rail still tell the story,
   so only the current step keeps its label. */
@media (max-width: 767.98px) {
    .wizard-step:not(.is-current) .wizard-step-label {
        display: none;
    }
}

/* --- The current step's heading --------------------------------------------- */

.wizard-heading {
    margin-bottom: 1.75rem;
    text-align: center;
}

/* §A.56: a large centred heading, no step pill — the stepper right above it already says which
   step this is. 1.75rem matches the artifact's H1. */
/* 86e38xkbe: 27px, down from 28 — and 22px on a phone, where 28 was "way in the user's face".
   These are the prototype's own two sizes for this heading (`text-[22px] sm:text-[27px]`,
   src/app/EquipmentSetupWizard.tsx). Every step's head uses this class, so steps 2-4 follow
   step 1 automatically, which is what the ticket asks for. */
.wizard-heading-title {
    margin: 0;
    font-size: 1.6875rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #212830;
}

.wizard-heading-description {
    max-width: 38.75rem;
    margin: 0.6875rem auto 0;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: #6e7985;
}

/* 86e38xkbe: the prototype's phone sizes for the step head — `text-[22px]` on the title and
   `text-[14px]` on the description. */
@media (max-width: 575.98px) {
    .wizard-heading-title {
        font-size: 1.375rem;
    }

    .wizard-heading-description {
        font-size: 0.875rem;
    }
}

.wizard-explainer-link {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.875rem;
    padding: 0;
    border: 0;
    background: none;
    color: #0067b3;
    font-size: 0.875rem;
    font-weight: 600;
}

.wizard-explainer-link:hover {
    text-decoration: underline;
}

/* --- Panels ----------------------------------------------------------------- */

.wizard-panel {
    max-width: 65rem;
    margin: 0 auto;
}

.wizard-note {
    display: flex;
    /* 86e38xkbe: flex-start, not center — once the sentence wraps to two or three lines on a
       phone, a vertically centred icon floats in the middle of the paragraph. */
    align-items: flex-start;
    justify-content: center;
    gap: 0.5625rem;
    margin-bottom: 1.125rem;
    font-size: 0.8125rem;
    color: #6e7985;
}

.wizard-note svg {
    color: #0067b3;
    flex-shrink: 0;
}

.wizard-eyebrow {
    margin: 1.25rem 0 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #6e7985;
}

/* --- Step 1: the six types (WIZ-2) ------------------------------------------ */

.wizard-type-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

@media (min-width: 576px) {
    .wizard-type-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* §A.57: one line of content, so the row centres rather than top-aligning. */
.wizard-type-card {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0;
    padding: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    cursor: pointer;
}

.wizard-type-card:hover {
    background: #f8f9fc;
}

/* The radio itself is the control; .wizard-type-mark is what is drawn. */
.wizard-type-input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.wizard-type-card:has(.wizard-type-input:checked) {
    border-color: #0067b3;
    box-shadow: inset 0 0 0 1px #0067b3;
    background: #f2f8fc;
}

.wizard-type-card:has(.wizard-type-input:focus-visible) {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
}

.wizard-type-icon {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    flex-shrink: 0;
    border-radius: 0.375rem;
    background: #f8f9fc;
    color: #6e7985;
}

.wizard-type-card:has(.wizard-type-input:checked) .wizard-type-icon {
    background: #0067b3;
    color: #fff;
}

/* §A.57: the description line is gone, so the name takes the wrapper's place as the flexing
   middle of the row. .wizard-type-body / .wizard-type-desc are no longer rendered. */
.wizard-type-name {
    flex: 1;
    min-width: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212830;
}

.wizard-type-mark {
    display: grid;
    place-items: center;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    border: 1.5px solid #c9cfd8;
    border-radius: 50%;
    background: #fff;
}

.wizard-type-card:has(.wizard-type-input:checked) .wizard-type-mark {
    border-color: #0067b3;
    background: #0067b3;
}

.wizard-type-card:has(.wizard-type-input:checked) .wizard-type-mark::after {
    content: "";
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #fff;
}

/* --- Step 2: the checklist (WIZ-3) ------------------------------------------ */

.wizard-progress-card {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1rem;
    margin-bottom: 1rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.wizard-progress-icon,
.wizard-rename-icon,
.wizard-source-icon {
    display: grid;
    place-items: center;
    width: 2.125rem;
    height: 2.125rem;
    flex-shrink: 0;
    border-radius: 0.375rem;
    background: #e5f0f8;
    color: #0067b3;
}

.wizard-progress-body {
    flex: 1;
    min-width: 0;
}

.wizard-progress-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.625rem;
    margin-bottom: 0.5rem;
}

.wizard-progress-name {
    font-size: 0.875rem;
    font-weight: 600;
    color: #212830;
}

.wizard-progress-count {
    font-size: 0.8125rem;
    color: #6e7985;
}

.wizard-progress-track {
    height: 0.5rem;
    border-radius: 999px;
    background: #edf0f5;
    overflow: hidden;
}

.wizard-progress-bar {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: #0067b3;
    transition: width 0.35s ease;
}

.wizard-progress-percent {
    flex-shrink: 0;
    font-size: 1.25rem;
    font-weight: 700;
    color: #0067b3;
    font-variant-numeric: tabular-nums;
}

/* WIZ-3 AC5: the running count, alongside the categories rather than inside the progress card, so
   it stays visible while scrolling the checklist on a phone. */
.wizard-selected-count {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #0067b3;
}

.wizard-categories {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.wizard-category {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    overflow: hidden;
}

.wizard-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.8125rem 1rem;
}

/* §A.62: a check-circle, pale until the category is answered and green once it is. It was a
   filled dot, which said "answered" but not "answered how". */
.wizard-category-tick {
    display: inline-flex;
    flex-shrink: 0;
    color: #d7dce3;
}

.wizard-category.is-answered .wizard-category-tick {
    color: #198754;
}

.wizard-category-text {
    flex: 1;
    min-width: 0;
}

.wizard-category-name {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212830;
}

.wizard-category-prompt {
    margin: 0;
    font-size: 0.75rem;
    color: #6e7985;
}

/* The No / Yes gate. Nothing is preselected — WIZ-3 AC4. */
.wizard-answer-toggle {
    display: inline-flex;
    flex-shrink: 0;
    gap: 0.125rem;
    padding: 0.1875rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #f8f9fc;
}

.wizard-answer-button {
    padding: 0.375rem 0.9375rem;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    color: #6e7985;
    font-size: 0.8125rem;
    font-weight: 600;
}

.wizard-answer-button[aria-pressed="true"] {
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
    color: #41505f;
}

.wizard-answer-button.is-yes[aria-pressed="true"] {
    color: #198754;
}

.wizard-category-body {
    padding: 0.875rem 1rem;
    border-top: 1px solid #dee2e6;
    background: #f8f9fc;
}

.wizard-category-hint {
    margin: 0 0 0.6875rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #6e7985;
}

.wizard-item-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
    gap: 0.5rem;
}

.wizard-item {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.5rem 0.5625rem 0.5rem 0.6875rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.wizard-item.is-picked {
    border-color: #0067b3;
    background: #f2f8fc;
}

.wizard-item-toggle {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
}

.wizard-item-box {
    display: grid;
    place-items: center;
    width: 1.1875rem;
    height: 1.1875rem;
    flex-shrink: 0;
    border: 1px solid #c9cfd8;
    border-radius: 0.25rem;
    background: #fff;
}

.wizard-item.is-picked .wizard-item-box {
    border-color: #0067b3;
    background: #0067b3;
}

.wizard-item.is-picked .wizard-item-box::after {
    content: "";
    width: 0.3125rem;
    height: 0.5625rem;
    margin-top: -0.125rem;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.wizard-item-name {
    font-size: 0.875rem;
    line-height: 1.3;
    color: #41505f;
}

.wizard-item.is-picked .wizard-item-name {
    color: #212830;
    font-weight: 500;
}

.wizard-quantity {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    overflow: hidden;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

.wizard-quantity-button {
    display: grid;
    place-items: center;
    width: 1.625rem;
    height: 1.75rem;
    border: 0;
    background: transparent;
    color: #6e7985;
    font-size: 1rem;
    line-height: 1;
}

.wizard-quantity-button:disabled {
    color: #c9cfd8;
}

.wizard-quantity-value {
    min-width: 1.375rem;
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #212830;
    font-variant-numeric: tabular-nums;
}

/* --- Step 3: rename (WIZ-4) ------------------------------------------------- */

.wizard-panel[data-step="3"] {
    max-width: 47.5rem;
}

.wizard-rename-head {
    display: flex;
    align-items: center;
    gap: 0.6875rem;
    margin-bottom: 1rem;
}

.wizard-rename-title {
    margin: 0;
    font-size: 1.1875rem;
    font-weight: 700;
    color: #212830;
}

.wizard-rename-count {
    padding: 0.1875rem 0.6875rem;
    border: 1px solid #dee2e6;
    border-radius: 999px;
    background: #f8f9fc;
    color: #6e7985;
    font-size: 0.8125rem;
}

.wizard-rename-list {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.wizard-rename-row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
}

.wizard-rename-input {
    flex: 1;
    min-width: 0;
    font-weight: 500;
}

.wizard-rename-input:focus {
    border-color: #0067b3;
    box-shadow: 0 0 0 0.2rem rgba(0, 103, 179, 0.18);
}

/* WIZ-4 AC2: identical units stay tellable apart while they are being renamed. */
.wizard-rename-marker {
    flex-shrink: 0;
    min-width: 4rem;
    padding: 0.375rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #f8f9fc;
    color: #6e7985;
    text-align: center;
    font-size: 0.8125rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.wizard-rename-empty {
    padding: 1.875rem;
    border: 1px dashed #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    text-align: center;
    font-size: 0.875rem;
    color: #6e7985;
}

/* --- WIZ-6: copy or download the list --------------------------------------- */

.wizard-export {
    margin-top: 1.125rem;
    padding-top: 0.875rem;
    border-top: 1px solid #dee2e6;
}

.wizard-export-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.wizard-export-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0;
    border: 0;
    background: none;
    color: #41505f;
    font-size: 0.8125rem;
    font-weight: 600;
}

.wizard-export-toggle svg {
    transition: transform 0.15s;
}

.wizard-export-toggle[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.wizard-export-actions {
    display: inline-flex;
    gap: 0.75rem;
}

.wizard-export-action {
    display: inline-flex;
    align-items: center;
    gap: 0.3125rem;
    padding: 0;
    border: 0;
    background: none;
    color: #0067b3;
    font-size: 0.8125rem;
    font-weight: 600;
}

.wizard-export-action:hover {
    text-decoration: underline;
}

.wizard-export-body {
    margin-top: 0.5625rem;
}

.wizard-export-filename {
    margin-bottom: 0.375rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.75rem;
    color: #6e7985;
}

.wizard-export-textarea {
    width: 100%;
    padding: 0.625rem;
    resize: none;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #f8f9fc;
    color: #41505f;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.75rem;
    line-height: 1.6;
    outline: none;
}

/* --- Step 4: destination (WIZ-5) -------------------------------------------- */

.wizard-source-banner {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.125rem;
    border: 1px solid #cfe2f2;
    border-radius: 0.375rem;
    background: #f2f8fc;
}

.wizard-source-banner .wizard-source-icon {
    background: #0067b3;
    color: #fff;
}

.wizard-source-text {
    min-width: 0;
}

.wizard-source-eyebrow {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #0067b3;
}

.wizard-source-name {
    display: block;
    margin-top: 0.0625rem;
    font-size: 1rem;
    font-weight: 700;
    color: #212830;
}

.wizard-source-meta {
    font-weight: 400;
    color: #6e7985;
}

/* WIZ-5 AC4, before the button is pressed.
   86e38xpr6: a grey outline, not a blue one — the artifact draws this card as neutral chrome
   (`border: 1px solid #E2E5EC` in EquipmentSetupWizard.tsx); the blue belongs to the chips inside
   it, which are the part that says something was chosen. The margin below is the artifact's 16px
   gap to the location cards — without it the card sat straight on top of them. */
.wizard-summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.6875rem;
    margin-top: 0.875rem;
    margin-bottom: 1rem;
    padding: 0.9375rem 1.125rem;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
    background: #fff;
}

.wizard-summary-icon {
    display: inline-flex;
    flex-shrink: 0;
    color: #198754;
}

.wizard-summary-lead {
    flex-shrink: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: #212830;
}

.wizard-summary-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}

.wizard-summary-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.3125rem 0.75rem;
    border: 1px solid #cfe2f2;
    border-radius: 999px;
    background: #f2f8fc;
    color: #0067b3;
    font-size: 0.8125rem;
    font-weight: 600;
}

.wizard-summary-chip.is-new {
    border-color: #badbcc;
    background: #d1e7dd;
    color: #0f5132;
}

/* --- Footer ----------------------------------------------------------------- */

.wizard-footer {
    position: sticky;
    bottom: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1.75rem;
    padding: 1rem 0;
    border-top: 1px solid #dee2e6;
    background: #fff;
}

.wizard-footer-back {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
}

/* The theme paints .btn-outline-secondary's text white on hover and focus, which is invisible on
   an unfilled button (CLAUDE.md). Pin it back for the wizard's own footer buttons. */
.wizard-footer .btn-outline-secondary:hover,
.wizard-footer .btn-outline-secondary:focus,
.wizard-footer .btn-outline-secondary:active,
.wizard-footer .btn-outline-secondary:focus-visible {
    background: #f8f9fc;
    border-color: #0067b3;
    color: #0067b3;
}

.wizard-footer-next {
    display: inline-flex;
    align-items: center;
    gap: 0.4375rem;
    margin-left: auto;
}

/* --- WIZ-7: the explainer modal --------------------------------------------- */

.wizard-explainer-dialog {
    max-width: 37.5rem;
}

.wizard-explainer-content {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
}

.wizard-explainer-header {
    border-bottom: 0;
    padding-bottom: 0.5rem;
}

.wizard-explainer-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #212830;
}

.wizard-explainer-lead {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: #41505f;
}

.wizard-explainer-duration {
    display: flex;
    align-items: center;
    gap: 0.4375rem;
    margin: 0.75rem 0 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #0067b3;
}

.wizard-explainer-subhead {
    margin: 1.375rem 0 0.75rem;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #212830;
}

.wizard-explainer-steps {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.wizard-explainer-step {
    display: flex;
    gap: 0.75rem;
}

.wizard-explainer-step-number {
    display: grid;
    place-items: center;
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
    border-radius: 50%;
    background: #e5f0f8;
    color: #0067b3;
    font-size: 0.8125rem;
    font-weight: 700;
}

.wizard-explainer-step-text {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #41505f;
}

.wizard-explainer-step-text strong {
    color: #212830;
}

.wizard-explainer-terms {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.wizard-explainer-term-name {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 600;
    color: #212830;
}

.wizard-explainer-term-definition {
    margin: 0.125rem 0 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #6e7985;
}

.wizard-explainer-links {
    margin: 0;
    padding: 0;
    list-style: none;
}

.wizard-explainer-link-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.625rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #0067b3;
    font-size: 0.875rem;
    font-weight: 600;
    text-decoration: none;
}

.wizard-explainer-link-row:hover {
    background: #f8f9fc;
}

.wizard-explainer-link-row span {
    flex: 1;
    min-width: 0;
}

.wizard-explainer-footer {
    border-top: 0;
}

/* --- Dark theme ------------------------------------------------------------- */

[data-skin=dark] .wizard-heading-description,
[data-skin=dark] .wizard-note,
[data-skin=dark] .wizard-eyebrow,
[data-skin=dark] .wizard-progress-count,
[data-skin=dark] .wizard-category-prompt,
[data-skin=dark] .wizard-category-hint,
[data-skin=dark] .wizard-item-name,
[data-skin=dark] .wizard-rename-count,
[data-skin=dark] .wizard-rename-empty,
[data-skin=dark] .wizard-rename-marker,
[data-skin=dark] .wizard-export-filename,
[data-skin=dark] .wizard-source-meta,
[data-skin=dark] .wizard-explainer-term-definition,
[data-skin=dark] .wizard-step-label {
    color: #adb5bd;
}

[data-skin=dark] .wizard-heading-title,
[data-skin=dark] .wizard-type-name,
[data-skin=dark] .wizard-progress-name,
[data-skin=dark] .wizard-category-name,
[data-skin=dark] .wizard-item.is-picked .wizard-item-name,
[data-skin=dark] .wizard-rename-title,
[data-skin=dark] .wizard-source-name,
[data-skin=dark] .wizard-summary-lead,
[data-skin=dark] .wizard-quantity-value,
[data-skin=dark] .wizard-explainer-title,
[data-skin=dark] .wizard-explainer-term-name,
[data-skin=dark] .wizard-explainer-step-text strong,
[data-skin=dark] .wizard-step.is-current .wizard-step-label,
[data-skin=dark] .wizard-step.is-done .wizard-step-label {
    color: #f8f9fa;
}

[data-skin=dark] .wizard-type-card,
[data-skin=dark] .wizard-progress-card,
[data-skin=dark] .wizard-category,
[data-skin=dark] .wizard-item,
[data-skin=dark] .wizard-quantity,
[data-skin=dark] .wizard-rename-empty,
[data-skin=dark] .wizard-summary,
[data-skin=dark] .wizard-explainer-content,
[data-skin=dark] .wizard-explainer-link-row {
    background: #2b3035;
    border-color: #495057;
}

[data-skin=dark] .wizard-type-card:hover,
[data-skin=dark] .wizard-explainer-link-row:hover {
    background: #343a40;
}

[data-skin=dark] .wizard-type-icon,
[data-skin=dark] .wizard-category-body,
[data-skin=dark] .wizard-answer-toggle,
[data-skin=dark] .wizard-rename-marker,
[data-skin=dark] .wizard-export-textarea,
[data-skin=dark] .wizard-category-tick {
    color: #495057;
}

[data-skin=dark] .wizard-answer-button[aria-pressed="true"] {
    background: #2b3035;
    color: #dee2e6;
}

[data-skin=dark] .wizard-step-marker {
    background: #495057;
    color: #adb5bd;
}

[data-skin=dark] .wizard-step:not(:last-child)::after {
    background: #495057;
}

[data-skin=dark] .wizard-type-card:has(.wizard-type-input:checked),
[data-skin=dark] .wizard-item.is-picked,
[data-skin=dark] .wizard-source-banner,
[data-skin=dark] .wizard-summary-chip {
    background: #1d3a52;
    border-color: #0067b3;
    color: #9ec5e8;
}

[data-skin=dark] .wizard-item-box,
[data-skin=dark] .wizard-type-mark {
    background: #2b3035;
    border-color: #6c757d;
}

[data-skin=dark] .wizard-progress-track {
    background: #495057;
}

[data-skin=dark] .wizard-footer,
[data-skin=dark] .wizard-header .back-button {
    background: #2b3035;
    border-color: #495057;
}

[data-skin=dark] .wizard-export,
[data-skin=dark] .wizard-heading-badge {
    border-color: #495057;
}

/* ----------------------------------------------------------------------------
   NUDGE-1 / NUDGE-2 — the "Get started with <bay>" card
   ---------------------------------------------------------------------------- */

/* The prototype's tinted panel above the equipment list. Its `rounded-xl` corners and 13.5px
   type are translated to the app's 0.375rem radius and standard sizes (CLAUDE.md) — the palette
   (#f0f7ff on #cfe4f7, #0067b3 marks) is the prototype's, and matches the LIST-6 empty state. */
.bay-nudge {
    margin: 0.5rem 0.75rem 0;
    padding: 1rem;
    background: #f0f7ff;
    border: 1px solid #cfe4f7;
    border-radius: 0.375rem;
}

.bay-nudge-head {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

/* Filled rather than tinted, as the prototype has it — this is the one mark on the card that
   carries colour on its own. */
.bay-nudge-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    color: #fff;
    background: #0067b3;
    border-radius: 0.375rem;
}

/* min-width: 0 so a long bay name wraps instead of widening the row past the card (MOB-1). */
.bay-nudge-body {
    flex: 1 1 auto;
    min-width: 0;
}

.bay-nudge-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
}

.bay-nudge-title {
    font-size: 0.9375rem;
    font-weight: 700;
    color: #212529;
}

/* NUDGE-1: what makes the 30-day window visible rather than implicit. */
.bay-nudge-badge {
    padding: 0.125rem 0.5rem;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #0067b3;
    background: #dbeafe;
    border-radius: 50rem;
}

.bay-nudge-text {
    max-width: 44rem;
    margin: 0.125rem 0 0;
    font-size: 0.875rem;
    line-height: 1.5;
    color: #41505f;
}

.bay-nudge-dismiss {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    color: #6e7985;
    background: transparent;
    border: none;
    border-radius: 0.375rem;
}

.bay-nudge-dismiss:hover,
.bay-nudge-dismiss:focus-visible {
    color: #212529;
    background: #e0edfa;
}

/* Stacked on a phone, one row from the small breakpoint up — the prototype's
   `flex-col sm:flex-row`. */
.bay-nudge-actions {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
}

.bay-nudge-action-group {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* NUDGE-2: the coverage count as the primary action — icon, two lines, chevron. */
.bay-nudge-walk,
.bay-nudge-action {
    color: #212529;
    text-decoration: none;
    background: #fff;
    border: 1px solid #cfe4f7;
    border-radius: 0.375rem;
}

.bay-nudge-walk:hover,
.bay-nudge-walk:focus-visible,
.bay-nudge-action:hover,
.bay-nudge-action:focus-visible {
    color: #212529;
    text-decoration: none;
    border-color: #0067b3;
}

.bay-nudge-walk {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 0.75rem;
    min-width: 0;
    padding: 0.75rem 1rem;
}

.bay-nudge-walk-icon {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2.375rem;
    height: 2.375rem;
    color: #0067b3;
    background: #e8f1fb;
    border-radius: 0.375rem;
}

.bay-nudge-walk-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
}

.bay-nudge-walk-title {
    font-size: 0.875rem;
    font-weight: 600;
}

.bay-nudge-walk-count {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #0067b3;
}

.bay-nudge-walk-chevron {
    display: flex;
    flex-shrink: 0;
    color: #0067b3;
}

.bay-nudge-action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.bay-nudge-action svg {
    flex-shrink: 0;
    color: #0067b3;
}

@media (min-width: 576px) {
    .bay-nudge-actions,
    .bay-nudge-action-group {
        flex-direction: row;
        align-items: stretch;
    }

    /* The two small actions size to their labels once they sit beside the walk card. */
    .bay-nudge-action-group {
        flex: 0 0 auto;
    }
}

/* MOB-1: phone-first. Every action is already a full-width row at this width; the dismiss button
   grows to the 44px minimum so it is hittable with a wet or gloved hand. */
@media (max-width: 575.98px) {
    .bay-nudge {
        padding: 0.875rem;
    }

    .bay-nudge-walk,
    .bay-nudge-action {
        min-height: 2.75rem;
    }

    .bay-nudge-dismiss {
        width: 2.75rem;
        height: 2.75rem;
        margin: -0.5rem -0.375rem 0 0;
    }
}

/* Dark theme */
[data-skin=dark] .bay-nudge {
    background: #232f3a;
    border-color: #35485a;
}

[data-skin=dark] .bay-nudge-title {
    color: #e9ecef;
}

[data-skin=dark] .bay-nudge-text {
    color: #adb5bd;
}

[data-skin=dark] .bay-nudge-badge {
    color: #cfe4f7;
    background: #1c3a55;
}

[data-skin=dark] .bay-nudge-dismiss {
    color: #adb5bd;
}

[data-skin=dark] .bay-nudge-walk,
[data-skin=dark] .bay-nudge-action {
    color: #e9ecef;
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .bay-nudge-walk:hover,
[data-skin=dark] .bay-nudge-walk:focus-visible,
[data-skin=dark] .bay-nudge-action:hover,
[data-skin=dark] .bay-nudge-action:focus-visible,
[data-skin=dark] .bay-nudge-dismiss:hover,
[data-skin=dark] .bay-nudge-dismiss:focus-visible {
    color: #e9ecef;
    background: #333;
    border-color: #4a6b87;
}

[data-skin=dark] .bay-nudge-walk-icon {
    color: #6cb6ec;
    background: #1c2733;
}

[data-skin=dark] .bay-nudge-walk-count,
[data-skin=dark] .bay-nudge-action svg {
    color: #6cb6ec;
}

/* ----------------------------------------------------------------------------
   MOB-1 — My Wash on a phone

   Everything here is scoped to `.my-wash-page`, the class every My Wash screen root carries
   (bays#index, equipments#show/#new/#edit, the setup wizard, the CSV import's two steps, the
   photo walk, and the bay modals that render outside the index wrapper). Scoped rather than
   global on purpose: raising control metrics app-wide would put Inspections, Tasks and Services
   out of step with each other, which the UI-consistency rule in CLAUDE.md forbids.

   The layouts themselves already reflow — every My Wash screen measures
   `document.scrollWidth === viewport` at 390px, which is AC4. What did NOT hold is AC3: the
   feature shipped with Bootstrap's default 38px controls and a scattering of 14-32px icon
   buttons, which is too small for the wet or gloved hands the story is written for. 2.75rem
   (44px) is the standard minimum, applied only at phone widths so desktop keeps the app's
   Bootstrap metrics exactly as they are.
   ---------------------------------------------------------------------------- */
@media (max-width: 575.98px) {
    /* AC3: the 44px floor for anything tappable or typeable. inline-flex centres the label
       inside the taller box — min-height alone would leave it sitting at the top. */
    .my-wash-page .btn,
    .my-wash-page .form-control,
    .my-wash-page .form-select,
    .my-wash-page .bay-selector-toggle,
    .my-wash-page .bay-manage-trigger,
    .my-wash-page .equipment-files-add-btn,
    .my-wash-page .equipment-import-template-btn,
    .my-wash-page .wizard-footer-back,
    .my-wash-page .wizard-footer-next {
        min-height: 2.75rem;
    }

    /* 86e38xjcx: the bay dropdown is on the same floor as the inputs beside it. Written at
       (0,3,0) so it beats the `min-height: 0` that pulls it down to the desktop input height,
       whichever order the two end up in. This is MOB-1's blanket list biting a control that
       isn't a `.form-control` — the same trap 86e38wu1a hit with the Actions button. */
    .my-wash-page .equipment-form-field .custom-select-selected {
        /* Less the wrapper's two 1px borders. The floor above is on `.form-control`, which is
           border-box and so measures 44px INCLUDING its border; here the floor has to sit on the
           inner row, and 2.75rem flat made the control 46px against the inputs' 44px. */
        min-height: calc(2.75rem - 2px);
    }

    .my-wash-page .btn,
    .my-wash-page .bay-selector-toggle,
    .my-wash-page .bay-manage-trigger {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* The bay selector keeps its name left-aligned with the caret pushed to the far edge. */
    .my-wash-page .bay-selector-toggle {
        justify-content: flex-start;
    }

    /* 86e38wttr: Sort and Options drop their label and caret on a phone and become square icon
       targets, so the search keeps the width instead of pushing them onto a third row. The
       prototype does exactly this — `hidden sm:inline` on the label, `hidden sm:block` on the
       chevron, and `w-[38px] min-w-[var(--wash-tap)] px-0 sm:px-3` on the button
       (src/app/App.tsx). The pencil added by 86e38wt6v is already icon-only and joins them. */
    .my-wash-page .bay-equipment-toolbar-btn {
        width: 2.75rem;
        min-height: 2.75rem;
        padding: 0;
        justify-content: center;
        flex-shrink: 0;
    }

    .my-wash-page .bay-equipment-toolbar-btn > span,
    .my-wash-page .bay-equipment-toolbar-caret {
        display: none;
    }

    /* The search takes whatever the three icons leave, rather than wrapping them onto a row of
       their own. The basis has to be a real length, not `auto`: flex-wrap decides where to break
       from each item's hypothetical main size, and an input's `auto` basis is its full default
       width — enough to push the third icon over on a 390px screen even though there was room
       for it once the search shrank. 10rem is the prototype's `min-w-[160px]` on this field. */
    .my-wash-page .bay-equipment-search-field {
        flex: 1 1 10rem;
        min-width: 0;
    }

    /* Icon-only controls become square 44px targets rather than 20-36px ones. */
    .my-wash-page .back-button,
    .my-wash-page .photo-walk-back,
    .my-wash-page .btn-close,
    .my-wash-page .drawer-close,
    .my-wash-page .equipment-actions-trigger:not(.equipment-actions-trigger-labelled) {
        width: 2.75rem;
        height: 2.75rem;
        min-height: 2.75rem;
        flex-shrink: 0;
    }

    /* 86e38wu1a: the LABELLED Actions button grows to fit instead of being squared off. This
       rule outranks .equipment-actions-trigger-labelled's own `width: auto` on specificity, so
       without the :not() above the button collapsed to a 44px square — measured, that crushed
       the three-dot icon to 0px wide and clipped the label. Keeps the 44px tap height. */
    .my-wash-page .equipment-actions-trigger-labelled {
        width: auto;
        height: 2.75rem;
        min-height: 2.75rem;
        padding: 0 0.875rem;
        flex-shrink: 0;
    }

    /* 86e38wu1a follow-up (Jackson, measured): the Actions button sat 32px in from the header's
       right edge — 24px of card-header padding plus the wrapper's `me-2` — while the gap between
       it and "Equipment Details" was 1px. The prototype's header is `px-4` on a phone, symmetric
       with its left, and its Actions wrapper carries no margin at all. Matching that gives the
       button back 16px: right edge 349 -> 365, so it now clears the header edge by the same 16px
       the heading clears the left one, and the heading gap goes 1px -> 17px. Page still measures
       390 at a 390 viewport. Paired with removing `me-2` in equipments/show.html.haml. */
    .my-wash-page .card-header:has(.equipment-actions-trigger) {
        padding-right: 1rem;
    }

    /* 86e38wu1a: 18px on a phone, as the prototype has it (`text-[18px] sm:text-[22px]` on the
       PageHeader title). Ours was 1.3125rem at every width, and once the Actions button took its
       proper width back the title no longer fit beside it and wrapped to two lines. */
    .my-wash-page .equipment-detail-heading {
        font-size: 1.125rem;
    }

    /* 86e38wu1a: all four tabs on one line. At 1rem with a 1.5rem gap the row measured 397px in a
       340px container and pushed the PAGE to 422px against a 390px viewport — a horizontal
       scroll on every equipment screen, not just a wrap. The prototype drops to `text-[13px]`
       with `px-3` per tab below `sm`, and keeps `overflow-x-auto` as the backstop for a
       narrower phone or a longer label. */
    .my-wash-page .equipment-detail-tabs {
        gap: 0.75rem;
        overflow-x: auto;
    }

    .my-wash-page .equipment-detail-tab {
        font-size: 0.8125rem;
    }

    /* The manage drawer's per-row controls stop at 40px: a bay row carries up to four of them
       plus the name, and 44px each would not fit a 390px panel. Still well clear of the 32px
       they shipped at. */
    .my-wash-page .bay-manage-icon-btn,
    .my-wash-page .bay-manage-move-btn,
    .my-wash-page .bay-manage-delete-btn {
        width: 2.5rem;
        height: 2.5rem;
    }

    /* The walk's "include items that already have a photo" shipped at 14px — the smallest target
       in the feature, on the screen most likely to be used in a wet bay. */
    .my-wash-page .form-check-input {
        width: 1.375rem;
        height: 1.375rem;
        margin-top: 0.0625rem;
    }

    /* Text links that act as buttons need the height without becoming filled buttons. */
    .my-wash-page .recent-activity-view-history,
    .my-wash-page .wizard-explainer-link,
    .my-wash-page .equipment-record-fields-toggle,
    .my-wash-page .equipment-form-collapse-toggle {
        display: inline-flex;
        align-items: center;
        min-height: 2.75rem;
    }

    /* Search fields that are not .form-control: the drawer's BAY-7 field shipped at 21px. */
    .my-wash-page .bay-search-input {
        min-height: 2.75rem;
    }

    /* Per-file row actions (download / delete) shipped as 28px squares. */
    .my-wash-page .equipment-files-action,
    .my-wash-page .equipment-files-action-btn {
        width: 2.5rem;
        height: 2.5rem;
    }

    /* AC1/AC4: the ITEM-1 record table stacks label over value, so a value gets the full width
       instead of the 60% left after a nowrap label column. The table still reflows rather than
       scrolling — this is about readability at 390px, not overflow. */

    .my-wash-page .equipment-record-table th,
    .my-wash-page .equipment-record-table td {
        display: block;
        width: auto;
    }

    .my-wash-page .equipment-record-table-label {
        padding-bottom: 0;
        font-size: 0.8125rem;
        white-space: normal;
    }

    .my-wash-page .equipment-record-table-value {
        padding-top: 0.125rem;
    }

    /* With the cells stacked, only the value cell should carry the row divider. */
    .my-wash-page .equipment-record-table tr:not(:last-child) th {
        border-bottom: none;
    }
}

/* ==========================================================================
   86e32ke2y — equipment History tab (§3 card anatomy, §5 badges, §6 tokens)

   §6 says every value lives in one token file and nothing hardcodes a colour or
   a size, so the scales live here as custom properties and the rules below only
   reference them.

   One deliberate departure: §6 specifies Inter as the single font family. The
   app renders in Open Sans (Bootstrap's --bs-body-font-family) and CLAUDE.md is
   explicit that a feature must not set font-family to match a mockup, because a
   font change is an app-wide migration. So the type SCALE is adopted and the
   family is inherited. Revisit if Inter is ever adopted app-wide.
   ========================================================================== */
.mw-history-list {
    --mw-h-eyebrow: 11px;
    --mw-h-meta: 12.5px;
    --mw-h-small: 13px;
    --mw-h-body: 14px;
    --mw-h-text: #212830;
    --mw-h-secondary: #6e7985;
    --mw-h-muted: #8a94a0;
    --mw-h-border: #e2e5ec;
    --mw-h-divider: #eceef2;
    --mw-h-rail: #efefef;
    --mw-h-rail-icon: #6d6d6d;
    --mw-h-card: #ffffff;
    --mw-h-inset: #fbfbfb;

    /* tokens.ts `radius`. These are the prototype's, not CLAUDE.md's app-wide 0.375rem: the feed
       is a bespoke surface with its own rail, pills and panels, and 86e38yt3w asks for it to
       match the prototype. Scoped to .mw-history-* so no Bootstrap card is affected. */
    --mw-h-radius-card: 14px;
    --mw-h-radius-inner: 12px;
    --mw-h-radius-control: 8px;

    /* tokens.ts `space`. */
    --mw-h-space-xs: 4px;
    --mw-h-space-sm: 6px;
    --mw-h-space-md: 8px;
    --mw-h-space-lg: 12px;
    --mw-h-space-xl: 16px;

    /* ── The responsive scale, from the prototype's styles/scale.css ──────────────
       Desktop is the base; each media block below narrows it. A property that does not
       change at a breakpoint is simply absent there, so a diff reads as "what is different
       about small screens". Breakpoints are where the layout breaks, not a device roster.
       This matters more here than it looks: the feed is used standing at a machine. */
    --mw-h-rail-size: 48px;
    --mw-h-rail-icon-size: 20px;
    --mw-h-rail-gap: 20px;
    /* The connector sits at the circle's centre, less half its own 2px width. Derived from the
       rail rather than stated, so it cannot drift from it when the rail resizes. */
    --mw-h-rail-line: calc(var(--mw-h-rail-size) / 2 - 1px);

    /* Padding compounds: card, then event panel. */
    --mw-h-card-pad: 20px;
    --mw-h-panel-pad: 20px;
    --mw-h-block-gap: 20px;

    --mw-h-thumb: 72px;
    --mw-h-tap: 32px;

    display: flex;
    flex-direction: column;
    gap: var(--mw-h-block-gap);
}

/* Tablet — the rail is a gutter: it says what kind of record a card is and draws the thread
   between them. Neither job needs 48px once the screen is the scarce thing. */
@media (max-width: 1023.98px) {
    .mw-history-list {
        --mw-h-rail-size: 36px;
        --mw-h-rail-icon-size: 18px;
        --mw-h-rail-gap: 14px;
        --mw-h-card-pad: 16px;
        --mw-h-panel-pad: 16px;
        --mw-h-block-gap: 16px;
        --mw-h-thumb: 64px;
        --mw-h-tap: 44px;
    }
}

/* Mobile — down to a marker. The glyph still reads at 13px and the thread still joins the
   cards, on a third of the width the desktop rail takes. */
@media (max-width: 639.98px) {
    .mw-history-list {
        --mw-h-rail-size: 26px;
        --mw-h-rail-icon-size: 13px;
        --mw-h-rail-gap: 8px;
        --mw-h-card-pad: 12px;
        --mw-h-panel-pad: 12px;
        --mw-h-block-gap: 14px;
        /* Small enough that four fit across the narrowest column rather than two, so eight
           attachments read as a grid instead of a stack. */
        --mw-h-thumb: 56px;
        --mw-h-tap: 44px;
    }
}

/* §3 — "Date divider — Between cards: Today, Yesterday, else the full date." */
/* 86e36t2z1 §A.39: centred, mixed-case, with a hairline running out to each side. The rules
   are drawn with flex siblings rather than a border on the text so they fill whatever space is
   left once the label is laid out. */
/* ActivityLog.tsx DateRule: "Aligned with the card column, not the container. The rail to its
   left is a gutter — it carries the record icons and the connector line — so a rule drawn across
   it cuts through both and runs out past the cards on the right." */
.mw-history-divider {
    display: flex;
    align-items: center;
    gap: var(--mw-h-space-xl);
    margin: var(--mw-h-block-gap) 0 0;
    margin-left: calc(var(--mw-h-rail-size) + var(--mw-h-rail-gap));
    font-size: var(--mw-h-small);
    font-weight: 400;
    color: var(--mw-h-secondary);
}

.mw-history-divider::before,
.mw-history-divider::after {
    flex: 1;
    height: 1px;
    background: var(--mw-h-divider);
    content: "";
}

.mw-history-divider span {
    white-space: nowrap;
}

/* §A.53 — the log's own heading, above the first separator. */
.mw-history-heading {
    margin-bottom: 4px;
}

.mw-history-eyebrow {
    margin: 0;
    font-size: var(--mw-h-eyebrow, 11px);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #8a94a0;
}

.mw-history-subtitle {
    margin: 2px 0 0;
    font-size: 13px;
    color: #8a94a0;
}

/* The count sits with the pager at the foot of the list, not above it. */
.mw-history-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.mw-history-footer .mw-history-count {
    margin: 0;
}

[data-skin=dark] .mw-history-eyebrow,
[data-skin=dark] .mw-history-subtitle {
    color: #8a94a0;
}

/* 86e36t2z1 §A.39: the type node sits OUTSIDE the card, on a rail that runs down the whole
   timeline, rather than inside the card's border. The card itself keeps the border and
   background; the rail is a bare sibling column beside it. */
.mw-history-card {
    position: relative;
    display: flex;
    /* The open detail becomes a full-width sibling of the rail and body, so the row has to wrap —
       without this it competes for width and squeezes the body to zero, rendering the card text
       one character per line. */
    flex-wrap: wrap;
    gap: var(--mw-h-rail-gap);
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
}

/* The connector has to bridge the gap between consecutive cards, so it runs past the bottom of
   its own card. The last card in the list stops short, or the line dangles into the footer. */
/* The list is a flex column at --mw-h-block-gap, so cards already sit apart; these only tighten
   the gap a date rule introduces, which carries its own top margin. */
.mw-history-list .mw-history-divider + .mw-history-card {
    margin-top: var(--mw-h-space-lg);
}

/* §3 — "Icon rail — Left of the card, on a vertical connector line." */
.mw-history-card-rail {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-shrink: 0;
}

/* primitives.tsx RailIcon: a 2px white ring holds the circle off the connector line running
   behind it, so the thread reads as passing under the node rather than touching it. */
.mw-history-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 var(--mw-h-rail-size);
    width: var(--mw-h-rail-size);
    height: var(--mw-h-rail-size);
    color: var(--mw-h-rail-icon);
    background: var(--mw-h-rail);
    border: 2px solid var(--mw-h-card);
    border-radius: 50%;
}

/* Lucide writes width/height as SVG attributes, which cannot hold a var() — so the rail glyph
   is sized in CSS, where the custom property resolves, and the attribute is overridden. */
.mw-history-card-icon svg {
    width: var(--mw-h-rail-icon-size);
    height: var(--mw-h-rail-icon-size);
}

/* 86e36t2z1 §A.39: the prototype runs a continuous 2px line down the node column — across date
   separators and between cards — rather than a stub per card stopping at each card's edge.
   
   Drawn per card, starting at its OWN node's centre and running far enough down to reach the
   next one. Drawing it once on the list instead put ~76px of line ABOVE the first node, joined
   to nothing, because the list starts at the first date separator. The overhang past the last
   card is clipped by the list's overflow. */
.mw-history-list {
    position: relative;
    overflow: hidden;
}

.mw-history-card::before {
    content: "";
    position: absolute;
    /* Derived from the rail so it cannot drift when the rail resizes at a breakpoint. */
    left: var(--mw-h-rail-line);
    /* Start at the node's vertical centre rather than its top, so the line emerges from it. */
    top: calc(var(--mw-h-rail-size) / 2);
    height: 100vh;
    width: 2px;
    background: var(--mw-h-border);
}

/* The node paints over the line rather than the line crossing it. */
.mw-history-card-rail {
    position: relative;
    z-index: 1;
}

.mw-history-card-body {
    flex: 1;
    min-width: 0;
    /* §A.39: the card's frame moved here from .mw-history-card so the rail can sit outside it.
       The padding is on the line-item stack rather than here, because the footer and the expanded
       detail are full-bleed strips with their own rules. */
    background: var(--mw-h-inset);
    border: 1px solid var(--mw-h-border);
    border-radius: var(--mw-h-radius-inner);
}

/* ActivityLog.tsx Card: the line items sit in their own padded stack; the footer and detail
   below them are siblings that draw their own top rule edge to edge. */
.mw-history-lines {
    display: flex;
    flex-direction: column;
    gap: var(--mw-h-space-xl);
    padding: var(--mw-h-card-pad);
}


.mw-history-card-title {
    margin: 0 0 8px;
    font-size: var(--mw-h-body);
    font-weight: 600;
    color: var(--mw-h-text);
}

/* §3 — "Divider — Hairline between line items within a card." */
/* LineItemRow: a column of blocks at space.md, ruled off from the line above at space.xl. The
   gap is on the stack now (.mw-history-lines), so this only carries the rule. */
.mw-history-line {
    display: flex;
    flex-direction: column;
    gap: var(--mw-h-space-md);
}

.mw-history-line--divided {
    padding-top: var(--mw-h-space-xl);
    border-top: 1px solid var(--mw-h-divider);
}

/* The stamp stays on one line — a date broken mid-way is unreadable — but the ROW may break, so
   under pressure the stamp drops beneath the badge rather than squeezing it. */
.mw-history-line-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    column-gap: var(--mw-h-space-lg);
    row-gap: var(--mw-h-space-xs);
}

/* §5 — flat fill, no icon. Colours come from HistoryCopy::BADGES inline, so an
   unrecognised value can fall back to neutral grey in one place. */
/* tokens.ts: font.meta 12.5, weight.medium, space.sm/space.lg padding, radius.pill, and a 1px
   border of the tone's own hue. Fill, border colour and text come inline from HistoryCopy. */
.mw-history-badge {
    padding: 6px 12px;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1;
    border: 1px solid transparent;
    border-radius: 9999px;
    white-space: nowrap;
}

.mw-history-time {
    flex-shrink: 0;
    font-size: 13px;
    color: #aaaaaa;
}

.mw-history-line-text {
    margin: 6px 0 0;
    font-size: var(--mw-h-body);
    line-height: 1.5;
    color: var(--mw-h-text);
}

.mw-history-note-body {
    margin: 6px 0 0;
    font-size: var(--mw-h-small);
    line-height: 1.55;
    color: var(--mw-h-secondary);
    white-space: pre-wrap;
}

/* §7.14 row kinds — label on its own line, values beneath. */
.mw-history-rows {
    margin: 8px 0 0;
}

/* primitives.tsx FieldLabel: a glyph plus the label at font.meta in the secondary grey — NOT an
   uppercase letter-spaced eyebrow, which is the ACTIVITY LOG heading's treatment and reads as a
   section break when it lands on every row. §7.14 gives each row kind its own glyph, so the
   reader can tell an inspection name from a due date without reading the label. */
.mw-history-rows dt {
    display: inline-flex;
    align-items: center;
    gap: var(--mw-h-space-sm);
    font-size: var(--mw-h-meta);
    font-weight: 400;
    color: var(--mw-h-secondary);
    line-height: 1.35;
}

.mw-history-rows dt svg {
    flex-shrink: 0;
}

/* Always allowed to wrap. A pair of pills plus the arrow does not fit a phone's column, and
   nowrap here does not compress it, it pushes it off the screen. Wrapped, the arrow stays with
   the value it leaves, so a broken pair reads "Needs Attention -->" then "Resolved". */
.mw-history-rows dd {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-self: flex-start;
    max-width: 100%;
    column-gap: var(--mw-h-space-lg);
    row-gap: var(--mw-h-space-sm);
    margin: var(--mw-h-space-sm) 0 0;
    font-size: var(--mw-h-body);
    color: var(--mw-h-text);
}

/* 86e39c3zh: a value and the NEXT label had no space between them (dd carries a 6px top margin,
   dt carried none), so every pair read as though the label belonged to the value above it. With
   the two or three rows these cards used to hold that was survivable; the creation card lists up
   to eight, and it made the whole block unreadable. Pairs are now separated by more than the
   label is separated from its own value, which is the grouping the ticket's mock draws. */
.mw-history-rows dd + dt {
    margin-top: var(--mw-h-space-lg);
}

/* FieldRow: each row is its own block, ruled off from the one above it. */
.mw-history-rows {
    display: flex;
    flex-direction: column;
}

.mw-history-rows .mw-history-row--divided {
    padding-top: var(--mw-h-space-lg);
    margin-top: var(--mw-h-space-lg);
    border-top: 1px solid var(--mw-h-divider);
}

/* §4.3 — "Long values wrap in full on both sides — no truncation." */
.mw-history-value {
    overflow-wrap: anywhere;
}

.mw-history-arrow {
    color: var(--mw-h-muted);
}

.mw-history-muted {
    margin: 6px 0 0;
    font-size: var(--mw-h-small);
    color: var(--mw-h-muted);
}

/* §4.3 — the archive card's "Also stopped" block. */
.mw-history-side-effects {
    margin-top: 8px;
}

.mw-history-side-effects-label {
    margin: 0 0 2px;
    font-size: var(--mw-h-eyebrow);
    font-weight: 600;
    color: var(--mw-h-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.mw-history-side-effects ul,
.mw-history-filenames {
    margin: 0;
    padding-left: 18px;
    font-size: var(--mw-h-small);
    color: var(--mw-h-secondary);
}

.mw-history-filenames {
    margin-top: 6px;
}

/* §7 — the chevron and the detail it reveals. */
/* §A.51: the detail sits at the foot of the card BODY. It was briefly a sibling of the rail and
   body, which made .mw-history-card's flex-wrap drop it onto its own row outside the card's
   border — the expander appeared to float on the page background. */
.mw-history-detail {
    display: block;
}

.mw-history-detail[open] {
    position: static;
    /* Own row beneath the rail and body, rather than a third column. */
    flex: 0 0 100%;
    width: 100%;
    margin-top: 12px;
}

/* 86e36t2z1 §A.51: a labelled full-width row rather than a bare 28px chevron in the corner. */
/* A full-width footer strip, edge to edge across the card, rather than a chevron pinned to the
   corner. White, not the card's inset ground, so the way in reads as its own strip — and
   unchanged when open, since a footer that changed colour on toggle would look like a different
   control. Carries the touch floor: this is the one thing on the card a thumb has to hit. */
.mw-history-chevron {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--mw-h-space-lg);
    min-height: var(--mw-h-tap);
    padding: var(--mw-h-space-lg) var(--mw-h-card-pad);
    border-top: 1px solid var(--mw-h-divider);
    background: var(--mw-h-card);
    color: var(--mw-h-secondary);
    font-size: var(--mw-h-meta);
    cursor: pointer;
    list-style: none;
}

/* The card's own corners, so the footer cannot square off the bottom of a rounded card. */
.mw-history-detail:last-child .mw-history-chevron {
    border-bottom-left-radius: var(--mw-h-radius-inner);
    border-bottom-right-radius: var(--mw-h-radius-inner);
}

.mw-history-detail[open]:last-child .mw-history-chevron {
    border-radius: 0;
}

.mw-history-chevron::-webkit-details-marker {
    display: none;
}

.mw-history-chevron:hover {
    color: var(--mw-h-text);
}

.mw-history-detail[open] > .mw-history-chevron svg {
    transform: rotate(180deg);
}

.mw-history-chevron svg {
    flex-shrink: 0;
    transition: transform 0.15s ease-in-out;
}

/* The detail is a full-bleed strip below the footer, ruled off with the card's border rather
   than the lighter divider — it is a new region, not another row. */
.mw-history-timeline {
    display: flex;
    flex-direction: column;
    gap: var(--mw-h-space-lg);
    padding: var(--mw-h-card-pad);
    border-top: 1px solid var(--mw-h-border);
}

.mw-history-timeline-header {
    margin: 0;
    font-size: var(--mw-h-meta);
    color: var(--mw-h-muted);
}

/* §7 — "Each event renders as its own inset panel". White, so a nested event reads as its own
   card against the record card's inset ground rather than blending into it. */
.mw-history-event {
    display: flex;
    flex-direction: column;
    gap: var(--mw-h-space-lg);
    padding: var(--mw-h-panel-pad);
    background: var(--mw-h-card);
    border: 1px solid var(--mw-h-border);
    border-radius: var(--mw-h-radius-inner);
}

/* EventPanel: the avatar sits beside a block in which the headline and its timestamp read as one
   two-line unit, so they sit tight together rather than being spaced like separate rows. */
.mw-history-event-head {
    display: flex;
    align-items: flex-start;
    gap: var(--mw-h-space-lg);
    font-size: var(--mw-h-body);
    color: var(--mw-h-text);
}

.mw-history-event .mw-history-time {
    font-size: var(--mw-h-meta);
    color: var(--mw-h-muted);
    line-height: 1.35;
}

.mw-history-record-link {
    display: inline-block;
    margin-top: 4px;
    font-size: var(--mw-h-small);
    color: #0067b3;
}

/* §7.16 — strips wrap; eight files on one event is a real case. On a phone the thumb drops to
   56px so four fit across the narrowest column and eight read as a grid, not a stack. */
/* 86e39cux2: "a big gap in between the name of the person and the date and stuff and this
   section here". Measured: `.mw-history-event` is a flex column with `gap: 12px`, and
   `.mw-history-rows` adds its own `margin-top: 8px` on top of it — 20px where 12 was intended.
   A margin stacking with a gap, which is the kind of thing that only shows up when you measure
   it. The margin is what the rows need in the MILESTONE card, whose parent does not use a gap,
   so it is dropped here rather than at the source. */
.mw-history-event > .mw-history-rows {
    margin-top: 0;
}

.mw-history-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: var(--mw-h-space-md);
    margin-top: 0;
}

/* 86e39cru8: when the strip follows a labelled field stack it IS the last row of that stack, so
   it takes the same hairline and the same FieldLabel treatment as a <dt> — the artifact's
   `<Attachments labelled>` (primitives.tsx) draws it exactly this way, paperclip included. */
.mw-history-attachments-label {
    display: flex;
    align-items: center;
    gap: var(--mw-h-space-sm);
    /* No top margin: this is a flex child of .mw-history-event, which already separates its
       children with `gap`. 12px of gap plus this element's own 12px padding-top is the same 24px
       a `.mw-history-row--divided` gets from its margin+padding pair, so the two read alike. */
    margin: 0 0 var(--mw-h-space-sm);
    padding-top: var(--mw-h-space-lg);
    border-top: 1px solid var(--mw-h-divider);
    font-size: var(--mw-h-meta);
    font-weight: 400;
    color: var(--mw-h-secondary);
    line-height: 1.35;
}

.mw-history-attachments-label svg {
    flex-shrink: 0;
}

.mw-history-attachment {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--mw-h-thumb);
    height: var(--mw-h-thumb);
    overflow: hidden;
    cursor: pointer;
    background: var(--mw-h-divider);
    border: 1px solid var(--mw-h-border);
    border-radius: var(--mw-h-radius-control);
}

.mw-history-attachment-media {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mw-history-attachment-play {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    color: #fff;
    background: rgba(0, 0, 0, 0.55);
    border-radius: 50%;
}

.mw-history-attachment--doc {
    width: auto;
    max-width: 220px;
    gap: 6px;
    padding: 0 10px;
    font-size: var(--mw-h-meta);
    color: var(--mw-h-secondary);
    text-decoration: none;
    background: #fff;
}

.mw-history-attachment-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mw-history-attachment--broken {
    color: var(--mw-h-muted);
    cursor: default;
}

/* §8 no-results and §14 empty state share a shell; only the copy differs. */
.mw-history-empty {
    padding: 32px 16px;
    text-align: center;
    background: #f9fafb;
    border: 1px dashed #dee2e6;
    border-radius: 0.375rem;
}

.mw-history-empty-title {
    margin: 0 0 4px;
    font-size: 1.0625rem;
    font-weight: 600;
    color: #212529;
}

.mw-history-empty-body {
    margin: 0;
    font-size: 0.875rem;
    color: #6c757d;
}

[data-skin=dark] .mw-history-card,
[data-skin=dark] .mw-history-attachment--doc {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .mw-history-list {
    --mw-h-text: #e9ecef;
    --mw-h-secondary: #adb5bd;
    --mw-h-muted: #8a94a0;
    --mw-h-border: #3a3a3a;
    --mw-h-divider: #3a3a3a;
    --mw-h-rail: #1f1f1f;
    --mw-h-rail-icon: #adb5bd;
}

[data-skin=dark] .mw-history-event,
[data-skin=dark] .mw-history-empty {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

[data-skin=dark] .mw-history-empty-title {
    color: #e9ecef;
}

/* §8 — the count line and the pager beneath the card list. */
.mw-history-count {
    margin: 0 0 8px;
    font-size: 12.5px;
    color: #6e7985;
}

.mw-history-pager {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    justify-content: center;
    margin-top: 16px;
}

.mw-history-pager-page,
.mw-history-pager-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    font-size: 13px;
    color: #212830;
    text-decoration: none;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

.mw-history-pager-page:hover,
.mw-history-pager-arrow:hover {
    color: #212830;
    text-decoration: none;
    background: #eceef2;
}

.mw-history-pager-page.is-current {
    color: #fff;
    background: #0067b3;
    border-color: #0067b3;
}

.mw-history-pager-gap {
    padding: 0 2px;
    color: #8a94a0;
}

/* §8: "On mobile the control collapses to first page, current page, an ellipsis, and last page,
   with the arrows kept." */
@media (max-width: 640px) {
    .mw-history-pager-page:not(.is-current):not(:first-of-type):not(:last-of-type) {
        display: none;
    }
}

[data-skin=dark] .mw-history-pager-page,
[data-skin=dark] .mw-history-pager-arrow {
    color: #e9ecef;
    border-color: #3a3a3a;
}

[data-skin=dark] .mw-history-pager-page:hover,
[data-skin=dark] .mw-history-pager-arrow:hover {
    background: #2a2a2a;
}

/* §8 — History toolbar: search on its own row, Filters beneath, drawer below that. */
/* 86e36t2z1 §A.40: search, Filters and Add Note on ONE row, measured off the prototype —
   40px tall controls, 14px radius, 8px gaps, search taking the remaining width. Wraps below
   576px, where three controls on a line stop fitting. */
.mw-history-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

.mw-history-toolbar-search {
    display: flex;
    flex: 1;
    min-width: 12rem;
    gap: 8px;
    align-items: center;
    height: 40px;
    padding: 0 12px;
    color: #8a94a0;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

.mw-history-search-input {
    flex: 1;
    min-width: 0;
    padding: 8px 0;
    font-size: 14px;
    color: #212830;
    background: transparent;
    border: 0;
}

.mw-history-search-input:focus {
    outline: none;
}

/* 86e38wwcx: Filters + Add Note as one flex child, mirroring the artifact's
   `flex-none flex items-stretch sm:items-center gap-2` around the same pair (src/app/App.tsx).
   The class existed already but nothing rendered it — the buttons were direct children of the
   toolbar — so they wrapped independently. The old `margin-top: 8px` went with that: the toolbar's
   own 8px gap now spaces this row, and the artifact likewise carries the spacing on the outer
   `gap-2` alone. */
.mw-history-toolbar-actions {
    display: flex;
    flex: none;
    gap: 8px;
    align-items: center;
}

/* 86e38wwcx (Jackson): "have the search bar be on its own row, and then have the filters and add
   note on its own row, where both of them just fill 50%".

   This is the artifact's `flex-col sm:flex-row` on the bar with `flex-1 sm:flex-none` on each
   button, at Tailwind's own `sm` (640px) — the breakpoint HistoryToolbarComponent's docstring
   already named, and where §8 says the three controls stop competing for one row. Measured on a
   390px phone before this: search 242 + Filters 91 on line one, Add Note alone on line two. */
@media (max-width: 639.98px) {
    .mw-history-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .mw-history-toolbar-actions {
        width: 100%;
    }

    /* Flex rather than `width: 50%`, so the 8px gap comes out of the halves instead of
       overflowing the row. Both buttons size from their content otherwise (flex-shrink: 0), and
       neither centres its label, which only shows once they are wider than their text.

       The basis is 50%, not 0: Filters is outlined and Add Note is filled and borderless (the
       artifact draws them that way too), so under `flex: 1 1 0` their 2px of border difference
       survives into the grow — measured 167 / 165 on a 390px phone. A percentage basis makes the
       border-box halves equal up front and the two land on the same width. */
    .mw-history-toolbar-actions > .mw-history-filters-btn,
    .mw-history-toolbar-actions > .mw-history-add-note-btn {
        flex: 1 1 50%;
        justify-content: center;
    }
}

/* Measured off the prototype: 40px tall, 14px radius, 14px side padding, 14px/500 label. */
.mw-history-filters-btn,
.mw-history-apply-inline {
    display: flex;
    flex-shrink: 0;
    gap: 6px;
    align-items: center;
    height: 40px;
    padding: 0 14px;
    font-size: 14px;
    font-weight: 500;
    color: #020817;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

.mw-history-filters-dot {
    width: 7px;
    height: 7px;
    background: #0067b3;
    border-radius: 50%;
}

/* ==========================================================================
   86e36t2z1 — History "Filters & Sort" as a right slide-out panel
   ==========================================================================
   Measured off the prototype: 360px wide, full height, #f8f9fc ground, 24px gutter,
   44px controls on a 14px radius, and a pinned footer with Apply above Clear.
   -------------------------------------------------------------------------- */

.mw-history-filters-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1045;
    background: rgba(0, 0, 0, 0.4);
}

.mw-history-filters-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1046;
    display: flex;
    flex-direction: column;
    width: 360px;
    max-width: 100vw;
    background: #f8f9fc;
    border-left: 1px solid #e2e8f0;
    box-shadow: rgba(0, 0, 0, 0.1) 0 13px 20px -4px, rgba(0, 0, 0, 0.1) 0 8px 8px -4px;
}

.mw-history-filters-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 24px 24px 16px;
}

.mw-history-filters-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    color: #020817;
}

.mw-history-filters-sub {
    margin: 6px 0 0;
    font-size: 12.5px;
    line-height: 1.4;
    color: #64748b;
}

.mw-history-filters-close {
    flex-shrink: 0;
    margin-left: auto;
    padding: 4px;
    color: #64748b;
    background: transparent;
    border: 0;
    border-radius: 0.375rem;
    cursor: pointer;
}

.mw-history-filters-close:hover {
    color: #020817;
    background: #eef1f4;
}

/* The prototype shows four filters; the app has nine (From/To appear with a custom range, plus
   Status / Inspection / Service Title). They are kept — dropping working filters for parity
   would be a functional regression — so the body scrolls when they overflow. */
.mw-history-filters-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0 24px 16px;
}

.mw-history-filter-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr;
}

.mw-history-filter {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #0a0a0a;
    text-transform: none;
    letter-spacing: normal;
}

.mw-history-filter .form-select,
.mw-history-filter .form-control {
    height: 44px;
    padding: 0 16px;
    font-size: 16px;
    font-weight: 400;
    color: #020817;
    background-color: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

.mw-history-filters-footer {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 16px 24px 24px;
    background: #f8f9fc;
    border-top: 1px solid #e2e8f0;
}

.mw-history-apply-btn {
    height: 48px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    background: #0067b3;
    border: 0;
    border-radius: 0.375rem;
}

.mw-history-clear-link {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 48px;
    font-size: 14px;
    font-weight: 500;
    color: #020817;
    text-decoration: none;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.375rem;
}

.mw-history-clear-link:hover {
    color: #020817;
    background: #f1f3f7;
}

@media (max-width: 640px) {
    .mw-history-filters-panel {
        width: 100vw;
    }
}

[data-skin=dark] .mw-history-toolbar-search,
[data-skin=dark] .mw-history-filters-btn,
[data-skin=dark] .mw-history-apply-inline {
    color: #e9ecef;
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .mw-history-search-input {
    color: #e9ecef;
}

[data-skin=dark] .mw-history-filters-panel {
    background: #1f1f1f;
    border-color: #3a3a3a;
}

/* §7.18 avatars — photo, initials, or the system's neutral circle. */
.mw-history-avatar {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    border-radius: 50%;
}

/* 86e38wwrc (Jackson): a profile picture with a transparent background showed whatever was
   behind it — here, the blue initials disc, so a logo uploaded as a transparent PNG read as
   "a W on a W". The photo needs its own opaque ground.

   The prototype's Avatar is a strict ternary — photo OR initials, never both
   (src/components/primitives.tsx: `system ? icon : photo ? <img/> : initials`) — so the question
   never arises there. We stack deliberately: the initials sit UNDER the photo so an unservable
   blob (purged, or no storage credentials) degrades to them via the img's `onerror`, which a
   ternary cannot do. Keeping that, the ground has to come from the photo itself.

   White rather than transparent, and white in dark mode too: a photo is a photo, and the
   alternative — letting the card show through — just swaps one accidental backdrop for another. */
.mw-history-avatar--photo {
    object-fit: cover;
    background: #fff;
}

.mw-history-avatar--initials {
    color: #fff;
    background: #0067b3;
}

.mw-history-avatar--system {
    color: #6d6d6d;
    background: #efefef;
}

.mw-history-event-actor {
    display: flex;
    gap: var(--mw-h-space-md);
    align-items: center;
    min-width: 0;
}

/* Inside an event panel it is the block BESIDE the avatar, holding the headline over its stamp
   as one two-line unit — not a row spread against a right-aligned timestamp. */
.mw-history-event-head > .mw-history-event-actor {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0;
    align-items: flex-start;
    min-width: 0;
}

/* §7.14 — status is a solid pill; progress, priority and measurement are quiet outlines with a
   tinted leading icon. One palette across all three; only the weight differs. */
/* tokens.ts: font.small 13, weight.medium, space.sm gap, near-black text. The two shapes differ
   only in padding and fill — §6: "The colour is shared; only the weight differs." */
.mw-history-pill {
    display: inline-flex;
    gap: 6px;
    align-items: center;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    color: #141414;
    border-radius: 9999px;
    white-space: nowrap;
}

/* §6's neutral tone, and the fallback shape. The per-value fill and stroke come from
   MyWash::HistoryCopy::TONES as an inline style, so an unrecognised value keeps this grey —
   §5: "the unrecognised-value fallback must be neutral grey", never green. */
/* The neutral tone, and the fallback. The per-value fill and border come inline from
   HistoryCopy::BADGE_TONES — §5: "the unrecognised-value fallback must be neutral grey", never
   green. A status chip is padded wider than an outline pill (space.md/space.xl). */
.mw-history-pill--status {
    padding: 8px 16px;
    background: #f0f0f0;
    border: 1px solid #4a5565;
}

.mw-history-pill--outline {
    background: #fff;
    border: 1px solid #e2e5ec;
}

.mw-history-pill-icon {
    display: inline-flex;
    align-items: center;
    color: #6e7985;
}

.mw-history-assignee {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    font-size: 13px;
}

/* §7.14 text — "full-width wrapping block". Prose, so it wraps in full and keeps its newlines
   rather than sitting on the row as a value. */
.mw-history-text-block {
    display: block;
    width: 100%;
    min-width: 0;
    font-size: var(--mw-h-small);
    color: var(--mw-h-text);
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

/* Only the outline shape follows the dark skin — a status chip keeps its own fill, and its text
   colour is set inline so it stays legible on it. */
[data-skin=dark] .mw-history-pill--outline {
    color: #e9ecef;
}

[data-skin=dark] .mw-history-pill--outline {
    background: #2a2a2a;
    border-color: #3a3a3a;
}

[data-skin=dark] .mw-history-avatar--system {
    color: #adb5bd;
    background: #1f1f1f;
}

/* §8 — a milestone line is a link into its record, but must not read as one: the card is a
   record summary, not a list of hyperlinks. Underline only on hover. */
.mw-history-line-link {
    display: block;
    color: inherit;
    text-decoration: none;
}

.mw-history-line-link:hover {
    color: inherit;
    text-decoration: underline;
}

/* The photo overlays its own initials fallback, so an unservable blob degrades rather than
   rendering a broken image (§7.18 / §7.16). */
.mw-history-avatar-stack {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}

.mw-history-avatar-stack .mw-history-avatar--photo {
    position: absolute;
    top: 0;
    left: 0;
}

/* Approved §13.4 — a removed note keeps its card so the change stays auditable, struck through
   and muted so it never reads as current. */
.mw-history-note-body--removed {
    color: #8a94a0;
    text-decoration: line-through;
}

.mw-history-edited {
    font-style: italic;
    color: #8a94a0;
}

/* 86e31rp11: the added-count banner fades out after a few seconds rather than sitting on the
   form for the rest of the session. The controller adds .is-dismissed and removes the element
   once the transition ends. */
.equipment-form-streak {
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.equipment-form-streak.is-dismissed {
    opacity: 0;
    transform: translateY(-4px);
}

@media (prefers-reduced-motion: reduce) {
    .equipment-form-streak {
        transition: none;
    }
}

/* ==========================================================================
   86e36t2z1 §A — Equipment detail page: tabbed, two-column layout
   ==========================================================================

   The prototype splits this page into four tabs and gives Overview a right
   rail, instead of the single long scroll the page used to be.

   Tab style note: the artifact uses underline tabs, which deliberately differ
   from the app's segmented `.tab-rectangle` (services.css) used on Services /
   Inspections detail pages. That divergence is a recorded decision for My Wash
   only — see docs/mywash-2.0/ui-parity/README.md. Don't "fix" it back.
   -------------------------------------------------------------------------- */

/* 86e38ww3h: the tabs and the item's name stay put while the tab panel scrolls under them, at
   every width. The prototype pins the same two elements (src/app/App.tsx, EquipmentDetailsPage:
   `sticky top-0 z-20 bg-white`).

   `top: 72px`, not 0: the app's .header-main navbar is `position: fixed`, 72px tall, z-index 800
   at every width — measured, not assumed — so a 0 offset would slide this under it. Same offset
   the photo-walk header and the inspections perform bar already use.

   The background has to be opaque or the panel scrolls through it: .card-body is transparent and
   the white comes from .card, so this restates it (#141414 for the dark skin, which is what
   .washup-bg-gray gives that card). z-index stays well under the navbar's 800. */
.equipment-detail-sticky {
    position: sticky;
    top: 72px;
    z-index: 5;
    background: #fff;
}

.equipment-detail-tabs {
    display: flex;
    gap: 1.5rem;
    padding: 0 0.25rem;
    border-bottom: 1px solid #dee2e6;
}

.equipment-detail-tab {
    padding: 0.75rem 0.125rem;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #6e7985;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    white-space: nowrap;
    cursor: pointer;
    /* The active underline sits on this element's own bottom border, so it has
       to overlap the container's 1px rule rather than stack under it. */
    margin-bottom: -1px;
}

.equipment-detail-tab:hover {
    color: #41505f;
}

.equipment-detail-tab.is-active {
    color: #0067b3;
    border-bottom-color: #0067b3;
    font-weight: 500;
}

.equipment-detail-tab:focus-visible {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* The item's name as the page heading, under the tabs. */
.equipment-detail-title {
    margin: 0;
    padding: 1.25rem 0.25rem;
    font-size: 1.75rem;
    font-weight: 700;
    color: #212529;
    border-bottom: 1px solid #dee2e6;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.equipment-detail-panel {
    padding-top: 1.25rem;
}

/* Overview: content column + right rail. Collapses to one column below lg,
   where the rail's cards stack after the main content. */
.equipment-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

@media (min-width: 992px) {
    .equipment-overview-grid {
        grid-template-columns: minmax(0, 1fr) 20rem;
        align-items: start;
    }
}


.equipment-overview-main,
.equipment-overview-rail {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}
/* 86e38wvdt: below lg there is no rail — Details, Recent Activity, the photo, Quick Actions and
   Connections are one stack, and the artifact spaces that stack at `gap-6` (24px), not the 16px
   we inherited from the two-column layout. This is the ticket's "add some padding in between
   Quick Actions and the section for the photo"; applying it to the grid and to both columns
   keeps one rhythm down the whole page rather than a wider gap at the seam between them. */
@media (max-width: 991.98px) {
    .equipment-overview-grid,
    .equipment-overview-main,
    .equipment-overview-rail {
        gap: 1.5rem;
    }
}


/* 86e38wuhg: the cards in these columns never shrink below their own content.
   Below 992px the grid has no `align-items: start`, so each column is stretched to its row
   height; a column flex item would normally refuse to shrink past its content because its
   automatic minimum size is `auto` — but that protection only applies while `overflow` is
   `visible`. .equipment-record-fields sets `overflow: hidden` for its rounded corners, which
   opted it out, so it absorbed the whole shortfall and then clipped what did not fit: measured
   342px tall around 455px of content, with the last rows cut off entirely. Hiding the empty
   fields made it obvious because the rows below moved up into the clipped region. */
.equipment-overview-main > *,
.equipment-overview-rail > * {
    flex-shrink: 0;
}

/* Rail cards: Quick Actions and the Connections summary. The photo card brings
   its own styling from EquipmentPhotoCardComponent. */
/* 86e38wuvy: #f9fafb, the same ground the other Overview cards sit on — Equipment Details,
   Recent Activity and the photo card are all #f9fafb with a #dee2e6 border, and these two
   (Quick Actions and Connections, the only users of this class) were the only white ones on the
   page. The prototype draws all of them on one colour too, though it uses #fbfbfb throughout;
   matching OUR Activity card is what the ticket asks for and keeps the page self-consistent
   rather than introducing a fifth near-white. */
.equipment-rail-card {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #f9fafb;
    padding: 1rem;
}

.equipment-rail-card-title {
    margin: 0 0 0.75rem;
    font-size: 1rem;
    font-weight: 500;
    color: #212529;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.equipment-rail-actions {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.equipment-rail-action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    color: #212529;
    font-size: 0.9375rem;
    text-decoration: none;
    cursor: pointer;
}

.equipment-rail-action:hover {
    background: #f8f9fc;
    color: #212529;
    border-color: #c9d2dc;
}

.equipment-rail-action svg {
    flex-shrink: 0;
    color: #6e7985;
}

/* Connections summary: a count per kind, linking through to the tab. */
.equipment-rail-link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    color: #0067b3;
    font-size: 0.875rem;
    font-weight: 400;
    text-decoration: none;
}

.equipment-rail-link:hover {
    text-decoration: underline;
    color: #0067b3;
}

.equipment-rail-counts {
    display: flex;
    flex-direction: column;
}

.equipment-rail-count {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    font-size: 0.9375rem;
    color: #212529;
}

.equipment-rail-count + .equipment-rail-count {
    border-top: 1px solid #eef1f4;
}

.equipment-rail-count svg {
    color: #6e7985;
    flex-shrink: 0;
}

.equipment-rail-count-value {
    margin-left: auto;
    font-variant-numeric: tabular-nums;
    color: #41505f;
}

/* Header: a round outline back button, matching the prototype (and the
   Services `.back-button` look) rather than the old filled dark pill. */
/* 86e36t2z1 §A.23: one back control for the whole My Wash area — the equipment detail page and
   the Add/Edit Equipment form. Measured off prototype-latest/add-equipment-top.png: 36x36 with
   a #6e7985 border, which is the colour the detail page already used; only the size was off
   (it was 31px). Two sizes of the same button on adjacent screens is the kind of drift this
   ticket exists to remove, so both moved together. */
.equipment-detail-back,
.equipment-form-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #6e7985;
    border-radius: 0.375rem;
    background: transparent;
    color: #41505f;
    flex-shrink: 0;
}

.equipment-detail-back:hover,
.equipment-form-back:hover {
    background: #eef1f4;
    color: #212529;
}

.equipment-detail-heading {
    font-size: 1.3125rem;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

/* ── dark ────────────────────────────────────────────────────────────────── */

[data-skin=dark] .equipment-detail-sticky {
    background: #141414;
}

[data-skin=dark] .equipment-detail-tabs,
[data-skin=dark] .equipment-detail-title {
    border-bottom-color: #3a4450;
}

[data-skin=dark] .equipment-detail-tab {
    color: #99a1af;
}

[data-skin=dark] .equipment-detail-tab:hover {
    color: #d4dae1;
}

[data-skin=dark] .equipment-detail-tab.is-active {
    color: #4da3e0;
    border-bottom-color: #4da3e0;
}

[data-skin=dark] .equipment-detail-title,
[data-skin=dark] .equipment-detail-heading {
    color: #e6e9ed;
}

[data-skin=dark] .equipment-rail-card {
    background: #262d36;
    border-color: #3a4450;
}

[data-skin=dark] .equipment-rail-card-title,
[data-skin=dark] .equipment-rail-count {
    color: #e6e9ed;
}

[data-skin=dark] .equipment-rail-action {
    background: #2e3641;
    border-color: #3a4450;
    color: #e6e9ed;
}

[data-skin=dark] .equipment-rail-action:hover {
    background: #38414d;
    border-color: #4a5563;
    color: #fff;
}

[data-skin=dark] .equipment-rail-count + .equipment-rail-count {
    border-top-color: #3a4450;
}

[data-skin=dark] .equipment-rail-count-value {
    color: #99a1af;
}

[data-skin=dark] .equipment-detail-back {
    border-color: #6e7985;
    color: #d4dae1;
}

[data-skin=dark] .equipment-detail-back:hover {
    background: #38414d;
    color: #fff;
}

/* 86e36t2z1 §A.10/§A.11: each detail tab opens with a sentence saying what the tab is for,
   then a small-caps label for the group below it. */
.equipment-connections-intro,
.equipment-files-intro {
    margin: 0 0 1rem;
    padding: 0 0.25rem;
    font-size: 0.9375rem;
    color: #41505f;
}

.equipment-connections-eyebrow,
.equipment-files-eyebrow {
    margin: 0 0 0.5rem;
    padding: 0 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #8a94a0;
}

/* The empty-state CTA on Connections. There is no attach-from-here flow yet, so it links
   through to the list the item would be attached from. */
.equipment-connections-empty-action {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.75rem;
    padding: 0.4375rem 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    color: #212529;
    font-size: 0.875rem;
    text-decoration: none;
}

.equipment-connections-empty-action:hover {
    background: #f8f9fc;
    border-color: #c9d2dc;
    color: #212529;
}

[data-skin=dark] .equipment-connections-intro,
[data-skin=dark] .equipment-files-intro {
    color: #99a1af;
}

[data-skin=dark] .equipment-connections-empty-action {
    background: #2e3641;
    border-color: #3a4450;
    color: #e6e9ed;
}

[data-skin=dark] .equipment-connections-empty-action:hover {
    background: #38414d;
    border-color: #4a5563;
    color: #fff;
}

/* 86e36t2z1 §A.12: the History empty state gains an icon and the two actions available
   from an item with nothing logged yet. */
.mw-history-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-bottom: 0.75rem;
    border-radius: 50%;
    background: #eef5fb;
    color: #0067b3;
}

.mw-history-empty-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1rem;
}

.mw-history-empty-action {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.4375rem 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
    color: #212529;
    font-size: 0.875rem;
    cursor: pointer;
}

.mw-history-empty-action:hover {
    background: #f8f9fc;
    border-color: #c9d2dc;
}

.mw-history-empty-action-primary {
    background: #0067b3;
    border-color: #0067b3;
    color: #fff;
}

.mw-history-empty-action-primary:hover {
    background: #00589a;
    border-color: #00589a;
    color: #fff;
}

[data-skin=dark] .mw-history-empty-icon {
    background: #23303c;
    color: #4da3e0;
}

[data-skin=dark] .mw-history-empty-action {
    background: #2e3641;
    border-color: #3a4450;
    color: #e6e9ed;
}

[data-skin=dark] .mw-history-empty-action:hover {
    background: #38414d;
    border-color: #4a5563;
}

[data-skin=dark] .mw-history-empty-action-primary,
[data-skin=dark] .mw-history-empty-action-primary:hover {
    background: #0067b3;
    border-color: #0067b3;
    color: #fff;
}

/* 86e36t2z1 §A.54: the actor's avatar sits inline with the line it belongs to, so a
   multi-line entry keeps the face aligned with the first line rather than centred on the
   whole block. */
.mw-history-line-actor {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    /* 86e36t2z1: the prototype leaves 6px between the badge row and the line beneath it; the
       badge was sitting directly on top of the name. */
    margin-top: 6px;
}

.mw-history-line-actor .mw-history-line-text {
    flex: 1;
    min-width: 0;
    margin: 0;
}

.mw-history-line-actor .mw-history-avatar {
    flex-shrink: 0;
    margin-top: 1px;
}

/* 86e36t2z1 §A.40: the Add Note button beside Filters. Primary, because adding a note is the
   one thing you come to this tab to *do* — everything else here is reading. Measured to match
   the prototype: 40px tall, 14px radius, borderless. */
.mw-history-add-note-btn {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.375rem;
    height: 40px;
    padding: 0 14px;
    border: 0;
    border-radius: 0.375rem;
    background: #0067b3;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
}

.mw-history-add-note-btn:hover {
    background: #00589a;
    border-color: #00589a;
    color: #fff;
}

.mw-history-add-note-btn:focus-visible {
    outline: 2px solid #0067b3;
    outline-offset: 2px;
}

/* ==========================================================================
   86e36t2z1 — Connections tab, measured against the prototype
   ==========================================================================

   Every value below came from getComputedStyle on both sides, not from eyeballing.
   All of it is scoped under .equipment-connections: the status pills reuse the shared
   `.pill-status-*` classes from services.css (CLAUDE.md's "Inspections copies Services"
   rule), and those must keep their Services appearance everywhere else.
   -------------------------------------------------------------------------- */

.equipment-connections-eyebrow {
    font-size: 11px;
    letter-spacing: 1.1px;
    color: #41505f;
}

.equipment-connections-header {
    padding: 16px 20px;
    background: #f8f9fc;
    border-bottom-color: #e2e5ec;
}

.equipment-connections-title {
    font-size: 15px;
    color: #212830;
}

.equipment-connections-row {
    padding: 13px 20px;
    border-bottom-color: #e2e5ec;
}

.equipment-connections-name {
    font-size: 15px;
    color: #212830;
}


[data-skin=dark] .equipment-connections-header {
    background: #2e3641;
    border-bottom-color: #3a4450;
}

[data-skin=dark] .equipment-connections-title,
[data-skin=dark] .equipment-connections-name {
    color: #e6e9ed;
}

[data-skin=dark] .equipment-connections-eyebrow {
    color: #99a1af;
}

[data-skin=dark] .equipment-connections-row {
    border-bottom-color: #3a4450;
}

/* 86e36t2z1 §A.17: an archived item is muted and carries an archive icon — the prototype does
   not strike the name through, which read as "deleted" rather than "put away". */
.archived-bay-equipment-name {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6e7985;
}

.archived-bay-equipment-name svg {
    flex-shrink: 0;
    color: #8a94a0;
}

[data-skin=dark] .archived-bay-equipment-name {
    color: #99a1af;
}

/* 86e36t2z1: the Add Equipment split button, measured off the prototype — 40px tall, 16px side
   padding, a 14px/500 label with an 8px icon gap, and a caret half a shade darker than the
   primary so the split reads. Radius stays the app's 0.375rem (see "Decisions taken"). */
.bay-add-equipment-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    height: 40px;
    padding: 0 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
}

.bay-add-equipment-btn svg {
    flex-shrink: 0;
}

.bay-add-equipment-caret {
    width: 36px;
    height: 40px;
    padding: 0;
    background: #005a9e;
    border-color: #005a9e;
}

.bay-add-equipment-caret:hover,
.bay-add-equipment-caret:focus {
    background: #004b85;
    border-color: #004b85;
}

/* ── 86e36t2z1 §B/§D: the equipment list toolbar, rows and rearrange mode ──────────────────
   Measured off docs/mywash-2.0/ui-parity/prototype-latest/toolbar-sort-menu.png and
   list-rearrange-mode.png. Radius stays the app's 0.375rem throughout (see "Decisions taken"). */

/* §A.16: Bootstrap's ::after caret is a CSS triangle and can never match a stroked icon set,
   so the trigger carries a real lucide chevron that flips when the menu opens. */
.bay-equipment-toolbar-caret {
    flex-shrink: 0;
    color: #6e7985;
    transition: transform 0.15s ease-in-out;
}

.bay-equipment-toolbar-btn[aria-expanded="true"] .bay-equipment-toolbar-caret {
    transform: rotate(180deg);
}

/* The open state: the prototype keeps the button white and marks it with a blue border. The
   earlier rule greyed the background, which read as a pressed/disabled control instead. */
.bay-equipment-toolbar-btn[aria-expanded="true"] {
    color: #212830;
    background: #fff;
    border-color: #0067b3;
}

.bay-equipment-toolbar-btn:disabled {
    opacity: 0.55;
    pointer-events: none;
}

/* §A.15: one tick, on the active row only, right-aligned, and the label turns blue with it.
   Previously every row carried a check glyph (the inactive ones merely `invisible`), which
   left the label column indented as if all five were selected. */
.bay-equipment-sort-menu {
    min-width: 210px;
    padding: 0.375rem;
}

.bay-equipment-sort-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    color: #41505f;
}

.bay-equipment-sort-option:hover,
.bay-equipment-sort-option:focus {
    background: #f4f6fa;
    color: #212830;
}

.bay-equipment-sort-option.active,
.bay-equipment-sort-option.active:hover,
.bay-equipment-sort-option.active:focus {
    background: transparent;
    color: #0067b3;
    font-weight: 500;
}

.bay-equipment-sort-check {
    flex-shrink: 0;
    color: #0067b3;
}

/* §A.13: the reorder controls are hidden until rearrange mode — the prototype's default list
   is just names. The column keeps its width reserved only while the mode is on, so turning it
   on shifts the names right exactly as the prototype does. */
.bay-equipment-row-controls {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 28px;
    flex-shrink: 0;
    margin-left: 0.75rem;
}

.bay-equipment-rearrange-active .bay-equipment-row-controls {
    display: flex;
}

.bay-equipment-row-grip {
    display: inline-flex;
    color: #9aa4b2;
    cursor: grab;
    line-height: 0;
}

.bay-equipment-row-grip:active {
    cursor: grabbing;
}

.bay-equipment-row-move {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 14px;
    padding: 0;
    color: #9aa4b2;
    background: none;
    border: 0;
    line-height: 0;
}

.bay-equipment-row-move:hover {
    color: #0067b3;
}

/* Nothing above the first row, nothing below the last — hidden rather than left dead.
   `visibility` keeps the three-slot column the same height on every row. */
.bay-equipment-rearrange-active li.is-first .bay-equipment-row-move:first-child,
.bay-equipment-rearrange-active li.is-last .bay-equipment-row-move:last-child {
    visibility: hidden;
}

/* §A.18: the prototype's rows sit on a ~67px pitch; ours were ~60px. The link fills the row so
   the whole width stays clickable, with the padding on it rather than on the <li>. */
.bay-equipment-row-link {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.875rem 0;
    text-decoration: none;
}

/* §A.21: the rearrange instruction banner. The prototype's is blue, not the neutral grey bar
   this replaced, and its primary action says what it saves. */
.bay-equipment-rearrange-bar {
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: #f0f7ff;
    border: 1px solid #dceaf9;
    border-radius: 0.375rem;
}

/* The prototype also lifts the rows to white for the duration of the mode, so the list reads as
   temporarily in-hand rather than at rest. Overriding [data-skin=light] .task again. */
.bay-equipment-rearrange-active li.bay-equipment-row.task {
    background-color: #fff;
}

.bay-equipment-rearrange-bar-icon {
    flex-shrink: 0;
    color: #0067b3;
}

.bay-equipment-rearrange-bar-text {
    font-size: 0.875rem;
    color: #21456b;
}

.bay-equipment-rearrange-cancel,
.bay-equipment-rearrange-save {
    height: 38px;
    padding: 0 1rem;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 0.375rem;
    white-space: nowrap;
}

.bay-equipment-rearrange-cancel {
    color: #41505f;
    background: #fff;
    border: 1px solid #e2e5ec;
}

.bay-equipment-rearrange-cancel:hover {
    color: #212830;
    background: #f8f9fc;
    border-color: #c9d2dc;
}

.bay-equipment-rearrange-save {
    color: #fff;
    background: #0067b3;
    border: 1px solid #0067b3;
}

.bay-equipment-rearrange-save:hover {
    background: #005a9e;
    border-color: #005a9e;
}

[data-skin=dark] .bay-equipment-rearrange-bar {
    background: #1e2a38;
    border-color: #2c3d50;
}

[data-skin=dark] .bay-equipment-rearrange-bar-text {
    color: #cfe0f2;
}

[data-skin=dark] .bay-equipment-rearrange-cancel {
    color: #d4dae1;
    background: #2e3641;
    border-color: #3a4450;
}

[data-skin=dark] .bay-equipment-toolbar-btn[aria-expanded="true"] {
    background: #2e3641;
    border-color: #4b9fe0;
}

[data-skin=dark] .bay-equipment-sort-option {
    color: #d4dae1;
}

[data-skin=dark] .bay-equipment-sort-option.active {
    color: #6cb6ea;
}

[data-skin=dark] .bay-equipment-sort-check {
    color: #6cb6ea;
}

/* §A.18: the prototype's rows are 56px tall on a 67px pitch (11px gaps), measured off
   prototype-latest/toolbar-sort-menu.png; ours were 60 on 68. The vertical margins moved off
   Bootstrap's .mt-2/.mb-2 (which carry !important and collapse to 8px) onto this rule so the
   gap is settable at all. */
/* Selector shape matters here: `[data-skin=light] .task` (application.css) pins a 60px
   min-height on every .task row app-wide — Tasks and Task Lists included — so this needs at
   least that specificity to win without editing the shared rule. The .task fill it also sets
   (#f8f9fc) is already the prototype's row colour, so that part stays. */
li.bay-equipment-row.task {
    min-height: 56px;
    margin-top: 0.6875rem;
    margin-bottom: 0.6875rem;
}

/* 15px above and below a 24px line = 54px of content + 1px of border each side = the 56px row. */
li.bay-equipment-row .bay-equipment-row-link {
    padding: 0.9375rem 0;
}

/* ── 86e36t2z1 §A.33: the Edit Wash Bays/Areas drawer's Save Changes ──────────────────────
   The finding was that it "reads as disabled (faded light blue)" against the prototype's solid
   blue. It *is* disabled — the drawer stages everything client-side and only enables Save once
   something actually changed, which is worth keeping: it stops a no-op PATCH and says plainly
   that nothing is pending. What was wrong is how that state looked. Bootstrap renders a
   disabled .btn-primary as the same blue at opacity .65, which reads as a broken primary button
   rather than an inert one. Neutral grey instead, so at rest it is obviously waiting for an
   edit — and the moment there is one it is the prototype's solid blue.

   The !important is unavoidable rather than careless: application.css pins
   `.btn-primary { background-color: #0067B3 !important }` app-wide, and an !important
   declaration can only be beaten by another one. Scoped to the drawer footer's disabled state,
   so no enabled button anywhere is affected. */
.drawer-footer .btn-primary:disabled,
.drawer-footer .btn-primary.disabled {
    opacity: 1;
    color: #8a94a0;
    background-color: #eef0f4 !important;
    border-color: #e2e5ec !important;
    cursor: not-allowed;
}

[data-skin=dark] .drawer-footer .btn-primary:disabled,
[data-skin=dark] .drawer-footer .btn-primary.disabled {
    color: #6e7985;
    background-color: #2e3641 !important;
    border-color: #3a4450 !important;
}

/* ── 86e36t2z1 §A.60: step 1's closing tip ────────────────────────────────────────────────
   Sits under a divider at the foot of the type grid, the way the artifact draws it. */
.wizard-tip {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-top: 1.75rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e2e5ec;
}

.wizard-tip-icon {
    flex-shrink: 0;
    margin-top: 0.0625rem;
    color: #0067b3;
}

.wizard-tip-text {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: #6e7985;
}

.wizard-tip-text strong {
    font-weight: 600;
    color: #41505f;
}

/* 86e38xkbe (comment): "Duplicate from Another Bay" now opens the Help Center article. It was a
   <strong> naming the control, so it keeps that weight — it still has to read as the name of a
   thing on screen — and takes the link colour plus a standing underline. The underline is not
   hover-only like `.wizard-explainer-link`: that one sits alone under the description and is
   obviously a link, while this is one phrase inside a grey paragraph, where colour alone is the
   only cue and it is a weak one. */
.wizard-tip-text .wizard-tip-link {
    color: #0067b3;
    font-weight: 600;
    text-decoration: underline;
}

.wizard-tip-text .wizard-tip-link:hover {
    color: #00528f;
}

[data-skin=dark] .wizard-tip {
    border-top-color: #3a4450;
}

[data-skin=dark] .wizard-tip-text {
    color: #9aa3ad;
}

[data-skin=dark] .wizard-tip-text .wizard-tip-link {
    color: #6cb6ea;
}

[data-skin=dark] .wizard-tip-text strong {
    color: #d4dae1;
}

/* ── 86e36t2z1 §A.61: the shared sticky context bar ───────────────────────────────────────
   Measured off prototype-latest/wizard-step2-top.png and wizard-step3-rename.png. Sits directly
   under the stepper on steps 2–4 and stays there while the list below it scrolls, so the chosen
   type and the search never leave the screen. Replaces three separate per-step blocks (a
   progress card, a rename head and a source banner) that all said the same thing in different
   shapes. */
/* 86e38xk4f: the stickiness moved up to .wizard-sticky, which holds this AND the stepper, so the
   two travel as one block. `top: 0` here also put it under the fixed 72px .header-main navbar —
   the "kinda sticky but not all the way" in the ticket. The negative top margin stays: it cancels
   .wizard-steps' bottom margin so the two sit flush inside the wrapper with no gap for the list
   to show through. */
.wizard-context {
    margin: -1.75rem 0 1.75rem;
    padding: 0.75rem 0 0;
    background: #fff;
}

.wizard-context-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding-bottom: 0.75rem;
}

.wizard-context-icon {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 0.375rem;
    background: #e5f0f8;
    color: #0067b3;
}

.wizard-context-name {
    flex-shrink: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #212830;
}

.wizard-context-meta {
    flex-shrink: 0;
    font-size: 0.8125rem;
    color: #6e7985;
}

.wizard-context-search {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

.wizard-context-search-icon {
    position: absolute;
    top: 50%;
    left: 0.75rem;
    display: inline-flex;
    transform: translateY(-50%);
    color: #8a94a0;
    pointer-events: none;
}

.wizard-context-search-input {
    width: 100%;
    height: 38px;
    padding: 0 0.75rem 0 2.25rem;
    font-size: 0.875rem;
    color: #212830;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.375rem;
}

.wizard-context-search-input:focus {
    outline: none;
    border-color: #0067b3;
    box-shadow: 0 0 0 3px rgba(0, 103, 179, 0.12);
}

/* Step 2 only — a thin rule the width of the bar that fills as categories are answered. */
.wizard-context-track {
    height: 3px;
    background: #e9ecef;
    border-radius: 999px;
    overflow: hidden;
}

.wizard-context-bar {
    display: block;
    height: 100%;
    background: #0067b3;
    transition: width 0.2s ease-in-out;
}

[data-skin=dark] .wizard-context {
    background: #2a2a2a;
}

[data-skin=dark] .wizard-context-name {
    color: #e9ecef;
}

[data-skin=dark] .wizard-context-search-input {
    color: #d4dae1;
    background: #2e3641;
    border-color: #3a4450;
}

[data-skin=dark] .wizard-context-track {
    background: #3a4450;
}

@media (max-width: 767.98px) {
    .wizard-context-row {
        flex-wrap: wrap;
    }

    .wizard-context-search {
        flex: 1 1 100%;
        order: 3;
    }
}

/* ── 86e36t2z1 §A.64/§A.65: the wizard's step-4 destination picker ────────────────────────
   Scoped to .wizard-destination-grid on purpose. The markup is the copy flow's `.copy-*`
   picker reused wholesale (see the component's own note), and the copy flow's own drawer is
   narrow enough that a single column is right there — so the two-column layout is the wizard's
   alone and must not leak into `.copy-bay-option` generally. */
/* 86e38xpr6: the artifact sets the picker on a grey ground inside the location card
   (`renderSiteBody`: `borderTop: 1px solid #E2E5EC; background: #F8F9FC; padding: 18px 22px 22px`),
   so the white bay cards read as items sitting on a panel rather than as more page. Scoped to the
   step-4 panel: `.copy-location-body` is the copy flow's too, and that drawer stays white. */
/* 86e38xpr6: room under the last thing on the step. The footer is sticky, so without this the
   "Add to another location" button (or the last bay card, before it exists) ends up jammed
   against it on a phone. */
.wizard-panel[data-step="4"] {
    padding-bottom: 1.5rem;
}

.wizard-panel[data-step="4"] .copy-location-body {
    padding: 1.125rem 1.125rem 1.375rem;
    background: #f8f9fc;
    border-top: 1px solid #e2e5ec;
}

/* 86e38xpr6: what a location with no bays yet says where the "Select all that apply" label
   would be. Same place, same rhythm, but sentence case — it is a statement, not a column head.
   86e39ek48: the copy flow's step 2 says the same thing in the same picker, so it shares the
   rule rather than growing a second one. */
.wizard-destination-empty,
.copy-location-empty {
    margin: 0 0 0.75rem;
    font-size: 0.875rem;
    color: #6e7985;
}

[data-skin=dark] .wizard-destination-empty,
[data-skin=dark] .copy-location-empty {
    color: #9aa3ad;
}

.wizard-destination-eyebrow {
    margin: 0 0 0.75rem;
    font-size: 0.71875rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #9ca3af;
}

.wizard-destination-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.625rem;
}

@media (min-width: 768px) {
    .wizard-destination-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* "Create new wash bay / area" is an action, not one of the choices — it spans both columns
       and sits under them, as the artifact draws it. */
    .wizard-destination-grid .copy-new-bay {
        grid-column: 1 / -1;
    }
}

/* The count moves from a right-aligned column to a subtitle under the name, so the row becomes
   checkbox + a two-line block. The checkbox leads, which is where the artifact puts it. */
.wizard-destination-grid .copy-bay-option {
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.75rem;
    flex-wrap: wrap;
}

.wizard-destination-grid .copy-bay-mark {
    order: -1;
    margin-top: 0.0625rem;
}

.wizard-destination-grid .copy-bay-name {
    flex: 1 1 auto;
    font-weight: 600;
    white-space: normal;
}

.wizard-destination-grid .copy-bay-count {
    flex: 1 1 100%;
    margin-left: 1.75rem;
    font-size: 0.8125rem;
}

/* A picked destination is filled, not just ticked — at two columns the checkbox alone is easy
   to miss. */
.wizard-destination-grid .copy-bay-option:has(.copy-bay-input:checked) {
    border-color: #0067b3;
    background: #f2f8fc;
}

/* 86e38xpr6: "Create new wash bay / area" is an action, not one of the choices, so it is drawn
   the way the artifact draws it — a centred, dashed, grey button rather than a blue row with a
   checkbox (`border: 1px dashed #B7C4D4; color: #6E7985` in EquipmentSetupWizard.tsx). The
   checkbox still drives it; it is only the tick that goes, since the button's own open/closed
   state is what the dashed field below already shows. */
.wizard-destination-grid .copy-bay-option.is-new,
.wizard-destination-grid .copy-bay-option.is-new:hover,
.wizard-destination-grid .copy-bay-option.is-new:has(.copy-bay-input:checked) {
    justify-content: center;
    gap: 0.5625rem;
    padding: 0.625rem 0.9375rem;
    background: #fff;
    border: 1px dashed #b7c4d4;
    border-radius: 0.6875rem;
}

.wizard-destination-grid .copy-bay-option.is-new:hover {
    border-color: #9aa5b1;
    background: #f8f9fc;
}

.wizard-destination-grid .copy-bay-option.is-new .copy-bay-mark {
    display: none;
}

.wizard-destination-grid .copy-bay-option.is-new .copy-new-bay-label {
    flex: 0 1 auto;
    color: #6e7985;
    font-size: 0.90625rem;
    font-weight: 600;
    white-space: normal;
}

/* §A.65: the prompt below the picker. */
.wizard-other-locations {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid #e2e5ec;
    text-align: center;
}

.wizard-other-locations-text {
    margin: 0;
    font-size: 0.875rem;
    color: #6e7985;
}

/* 86e38xpr6: grey, not blue, and a dropdown rather than a one-way reveal — the artifact's button
   carries a ChevronDown that rotates 180° while the other locations are showing, and the button
   stays put underneath them. */
.wizard-other-locations-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 38px;
    padding: 0.625rem 1rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #6e7985;
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 0.625rem;
}

.wizard-other-locations-btn:hover {
    background: #f8f9fc;
    border-color: #9aa5b1;
}

.wizard-other-locations-caret {
    display: inline-flex;
    transition: transform 0.18s ease;
}

.wizard-other-locations-btn.is-open .wizard-other-locations-caret {
    transform: rotate(180deg);
}

.wizard-other-locations-list {
    width: 100%;
    text-align: left;
}

.wizard-other-locations-list[hidden] {
    display: none;
}

[data-skin=dark] .wizard-other-locations {
    border-top-color: #3a4450;
}

[data-skin=dark] .wizard-destination-grid .copy-bay-option:has(.copy-bay-input:checked) {
    background: #1e2a38;
}

[data-skin=dark] .wizard-other-locations-btn {
    color: #adb5bd;
    background: #2e3641;
    border-color: #3a4450;
}

[data-skin=dark] .wizard-panel[data-step="4"] .copy-location-body {
    background: #262d36;
    border-top-color: #3a4450;
}

[data-skin=dark] .wizard-destination-grid .copy-bay-option.is-new,
[data-skin=dark] .wizard-destination-grid .copy-bay-option.is-new:has(.copy-bay-input:checked) {
    background: #2e3641;
    border-color: #4a5563;
}

[data-skin=dark] .wizard-destination-grid .copy-bay-option.is-new .copy-new-bay-label {
    color: #adb5bd;
}

/* ── 86e36t2z1 §A.76/§A.77: the CSV import screen ─────────────────────────────────────────
   Measured off prototype-latest/csv-import-top.png and csv-import-dropzone.png. */

/* §A.76: six rows of column reference behind a disclosure, so the upload itself is not pushed
   below the fold. A plain <details> — no controller, and it works before JS loads. */
.equipment-import-columns-disclosure {
    margin-bottom: 1rem;
}

.equipment-import-columns-summary {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #212830;
    cursor: pointer;
    list-style: none;
}

/* Safari and Chrome each draw their own marker; both are removed so the lucide caret is the
   only one. */
.equipment-import-columns-summary::-webkit-details-marker,
.equipment-import-columns-summary::marker {
    display: none;
    content: "";
}

.equipment-import-columns-caret {
    display: inline-flex;
    flex-shrink: 0;
    color: #6e7985;
    transition: transform 0.15s ease-in-out;
}

.equipment-import-columns-disclosure:not([open]) .equipment-import-columns-caret {
    transform: rotate(-90deg);
}

.equipment-import-columns-icon {
    display: inline-flex;
    flex-shrink: 0;
    color: #6e7985;
}

.equipment-import-columns-summary:hover {
    color: #0067b3;
}

/* §A.77: a full panel rather than the compact strip this was — circular blue upload mark, bold
   instruction, an "or", and a button. The whole panel is the <button>; the "Upload it from your
   computer" affordance is a <span> styled as one, because a button inside a button is invalid
   HTML and the browser hoists it out of its parent. */
.equipment-import-dropzone {
    flex-direction: column;
    gap: 0.75rem;
    min-height: 15rem;
    padding: 2.5rem 1.5rem;
    border-style: dashed;
}

.equipment-import-dropzone-mark {
    display: grid;
    place-items: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: #e5f0f8;
    color: #0067b3;
}

.equipment-import-dropzone-title {
    font-size: 1.125rem;
    font-weight: 700;
    color: #212830;
}

.equipment-import-dropzone-or {
    font-size: 0.875rem;
    color: #8a94a0;
}

.equipment-import-dropzone-cta {
    display: inline-flex;
    align-items: center;
    height: 40px;
    padding: 0 1.25rem;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #fff;
    background: #0067b3;
    border-radius: 0.375rem;
}

.equipment-import-dropzone:hover .equipment-import-dropzone-cta,
.equipment-import-dropzone:focus-visible .equipment-import-dropzone-cta {
    background: #005a9e;
}

.equipment-import-dropzone-hint {
    font-size: 0.8125rem;
    color: #8a94a0;
}

[data-skin=dark] .equipment-import-columns-summary {
    color: #e9ecef;
}

[data-skin=dark] .equipment-import-dropzone-title {
    color: #e9ecef;
}

[data-skin=dark] .equipment-import-dropzone-mark {
    background: #1e2a38;
    color: #6cb6ea;
}

/* 86e36t2z1 §A.69: the duplicate flow's footer buttons carry the artifact's chevron and arrow. */
.duplicate-flow-back,
.duplicate-flow-next {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}
/* app/assets/stylesheets/components/media_gallery.css */

/* When gallery is open, remove transform from .main so position:fixed covers the full viewport.
   .main uses transform: translateX() for sidebar animation which creates a new containing block
   for fixed-position children, confining the modal to the content area instead of the viewport. */
body:has(.media-gallery-modal:not(.hidden)) .main {
    transform: none !important;
}

/* El contenedor del controller NO debe interferir con la modal ni con el layout */
[data-controller="media-gallery"] {
    position: static !important;
    overflow: visible !important;
    width: 100%;
    height: auto !important;
}

.media-gallery-modal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 999999 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.85);
    margin: 0 !important;
    padding: 0 !important;
}

.media-gallery-modal.hidden {
    display: none !important;
}

.media-gallery-modal .mg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: transparent;
}

/* HEADER - FUERA DEL CONTENEDOR BLANCO */
.media-gallery-modal .mg-header {
    position: absolute;
    top: 20px !important;
    left: 0;
    right: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 40px;
    pointer-events: none;
    height: 60px;
}

.media-gallery-modal .mg-header-center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
    border-radius: 100px;
    padding: 10px 24px;
    pointer-events: auto;
    z-index: 31;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.media-gallery-modal .gallery-counter {
    font-size: 1rem;
    font-weight: 600;
    color: white;
    line-height: 1;
    letter-spacing: 0.5px;
}

.media-gallery-modal .mg-header-right {
    position: absolute;
    right: 40px;
    top: 0;
    z-index: 31;
    display: flex;
    gap: 16px;
    pointer-events: auto;
}

.media-gallery-modal .gallery-download,
.media-gallery-modal .mg-close {
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
    border-radius: 100px;
    padding: 12px;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.15);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    width: 48px;
    height: 48px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.media-gallery-modal .gallery-download svg,
.media-gallery-modal .mg-close svg {
    width: 22px;
    height: 22px;
    stroke-width: 2;
}

.media-gallery-modal .gallery-download:hover,
.media-gallery-modal .mg-close:hover {
    background-color: rgba(0, 0, 0, 0.9);
    transform: scale(1.05);
    border-color: rgba(255, 255, 255, 0.3);
}

.media-gallery-modal .gallery-download.hidden,
.media-gallery-modal .gallery-nav.hidden {
    display: none !important;
}

/* CONTENEDOR BLANCO - SOLO PARA LA IMAGEN/VIDEO */
.media-gallery-modal .mg-container {
    position: relative;
    z-index: 10;
    background-color: white;
    border-radius: 16px;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5);
    width: 1936px;
    height: 1677px;
    max-width: calc(100vw - 120px);
    max-height: calc(100vh - 160px);
    margin: 100px auto 60px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.media-gallery-modal .mg-content {
    position: relative;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #f5f5f5;
}

.media-gallery-modal .gallery-media-container {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.media-gallery-modal .gallery-image {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.media-gallery-modal .gallery-video {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}

/* ============================================================
   BOTONES DE NAVEGACION - ESTILOS BASE
   ============================================================ */
.media-gallery-modal .gallery-nav {
    width: 60px;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(8px);
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    z-index: 40;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.15);
    color: white;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.media-gallery-modal .gallery-nav svg {
    width: 30px;
    height: 30px;
    stroke-width: 2;
}

.media-gallery-modal .gallery-nav:hover {
    background-color: rgba(0, 0, 0, 0.9);
    transform: translateY(-50%) scale(1.05);
    border-color: rgba(255, 255, 255, 0.3);
}

.media-gallery-modal .gallery-nav.hidden {
    display: none !important;
}

/* ============================================================
   MOBILE - BOTONES DENTRO DEL MG-CONTENT
   ============================================================ */
@media (max-width: 767.98px) {
    /* The partial renders both .mobile-nav-buttons (inside the white card)
       and .desktop-nav-buttons (fixed to the viewport). Hide the desktop
       set on mobile so only one pair of arrows is visible. */
    .media-gallery-modal .desktop-nav-buttons {
        display: none !important;
    }

    .media-gallery-modal {
        z-index: 999999 !important;
        padding: 0 !important;
        background-color: rgba(0, 0, 0, 0.95);
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
        overflow-y: auto !important;
    }

    .media-gallery-modal.hidden {
        display: none !important;
    }

    /* Header mas pequeno — bajado para despegarlo del borde superior (Figma). */
    .media-gallery-modal .mg-header {
        top: 28px !important;
        padding: 0 15px !important;
        height: 50px !important;
        position: absolute !important;
        z-index: 31 !important;
    }

    /* Counter pill — solid dark with a crisp edge so it reads on the overlay (Figma). */
    .media-gallery-modal .mg-header-center {
        padding: 6px 16px !important;
        background-color: rgba(0, 0, 0, 0.85) !important;
        border: 1px solid rgba(255, 255, 255, 0.25) !important;
    }

    .media-gallery-modal .gallery-counter {
        font-size: 0.85rem !important;
    }

    .media-gallery-modal .mg-header-right {
        right: 15px !important;
        gap: 10px !important;
    }

    /* Download / close — same solid dark pill treatment as the counter. */
    .media-gallery-modal .gallery-download,
    .media-gallery-modal .mg-close {
        width: 36px !important;
        height: 36px !important;
        padding: 8px !important;
        background-color: rgba(0, 0, 0, 0.85) !important;
        border: 1px solid rgba(255, 255, 255, 0.25) !important;
    }

    .media-gallery-modal .gallery-download svg,
    .media-gallery-modal .mg-close svg {
        width: 18px !important;
        height: 18px !important;
    }

    /* Contenedor blanco */
    .media-gallery-modal .mg-container {
        max-width: calc(100vw - 30px) !important;
        max-height: 80vh !important;
        margin: 90px auto 20px !important;
        border-radius: 12px !important;
        width: calc(100vw - 30px) !important;
        height: auto !important;
        position: relative !important;
        top: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }

    /* El contenido donde va la imagen */
    .media-gallery-modal .mg-content {
        position: relative !important;
        flex: 1 !important;
        width: 100% !important;
        min-height: 200px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Botones de navegacion - mobile */
    .media-gallery-modal .gallery-nav {
        width: 44px !important;
        height: 44px !important;
        position: absolute !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 30 !important;
    }

    .media-gallery-modal .gallery-nav svg {
        width: 22px !important;
        height: 22px !important;
    }

    .media-gallery-modal .gallery-nav-prev {
        left: 5px !important;
    }

    .media-gallery-modal .gallery-nav-next {
        right: 5px !important;
    }

    /* Contenedor de la imagen */
    .media-gallery-modal .gallery-media-container {
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Asegurar que el contenido multimedia se vea bien */
    .media-gallery-modal .gallery-image,
    .media-gallery-modal .gallery-video {
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important;
    }

    /* Para pantallas muy pequenas */
    @media (max-width: 480px) {
        .media-gallery-modal .mg-container {
            margin: 50px auto 15px !important;
            max-height: 75vh !important;
        }

        .media-gallery-modal .gallery-nav {
            width: 40px !important;
            height: 40px !important;
        }

        .media-gallery-modal .gallery-nav svg {
            width: 20px !important;
            height: 20px !important;
        }

        .media-gallery-modal .gallery-nav-prev {
            left: 3px !important;
        }

        .media-gallery-modal .gallery-nav-next {
            right: 3px !important;
        }
    }
}

/* ============================================================
   DESKTOP - BOTONES FUERA DEL CONTENEDOR
   ============================================================ */
@media (min-width: 768px) {
    /* Counterpart to the mobile rule: hide the mobile-positioned set so
       only the viewport-edge buttons are visible on desktop. */
    .media-gallery-modal .mobile-nav-buttons {
        display: none !important;
    }

    .media-gallery-modal .gallery-nav {
        position: fixed !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        width: 60px !important;
        height: 60px !important;
    }

    .media-gallery-modal .gallery-nav-prev {
        left: 30px !important;
    }

    .media-gallery-modal .gallery-nav-next {
        right: 30px !important;
    }
}

/* ============================================================
   MAIN IMAGE MOBILE BEHAVIOR
   ============================================================ */
@media (max-width: 767.98px) {
    .service-main-image-card {
        display: block !important;
        width: 100% !important;
        min-height: 160px !important;
        margin-bottom: 16px !important;
    }

    .service-main-image-wrapper {
        width: 100% !important;
    }

    .service-main-image {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        border-radius: 0.375rem !important;
    }

    .service-main-image-card.hidden {
        display: none !important;
    }

    .main-image-edit-buttons {
        display: none !important;
    }
}

/* ============================================================
   CORRECCION PARA DESKTOP - SERVICE DETAILS CARD
   ============================================================ */
@media (min-width: 768px) {

    /* Asegurar que el controller no afecte el layout de details */
    [data-controller="media-gallery"] {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        display: block !important;
    }

    /* Resetear cualquier propiedad que pueda estar afectando */
    [data-controller="media-gallery"] .service-main-image-card {
        margin-bottom: 4px !important;
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }
}
/* ===== Terms of Use / Privacy Policy blocking modal ===== */
/* Non-dismissible prompt shown over the app until the user accepts.
   Layout follows the ticket mockup (86e2x4z93); radii/borders stay on the
   main-app conventions (0.375rem, #dee2e6) per the UI consistency rule. */

/* The dim is a background on the modal element itself rather than a
   .modal-backdrop node — application.js strips every backdrop in the document
   on turbo:load/turbo:render (see removeOverlayArtifacts), which fires after
   this modal opens and would wipe a real one out from under us. */
.terms-modal {
    background-color: rgba(0, 0, 0, 0.5);
}

.terms-modal-dialog {
    max-width: 460px;
}

.terms-modal-content {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    padding: 2rem;
}

.terms-modal-heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.terms-modal-icon {
    width: 24px;
    height: 24px;
    stroke-width: 2;
    color: #1d6ac5;
    flex-shrink: 0;
}

.terms-modal-title {
    margin: 0;
    font-size: 1.375rem;
    font-weight: 700;
    line-height: 1.3;
    color: #212529;
}

.terms-modal-text {
    font-size: 1rem;
    line-height: 1.55;
    color: #212529;
    margin-bottom: 1rem;
}

/* Both documents sit side by side as equal-width outline buttons. */
.terms-modal-doc-links {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.5rem;
    margin-bottom: 1.25rem;
}

.terms-modal-doc-link,
.terms-modal-doc-link:hover,
.terms-modal-doc-link:focus {
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 44px;
    padding: 0.5rem 0.75rem;
    border: 1px solid #1d6ac5;
    border-radius: 0.375rem;
    background-color: #fff;
    color: #1d6ac5;
    font-size: 1rem;
    font-weight: 500;
    text-decoration: none;
}

.terms-modal-doc-link:hover {
    background-color: #f2f7fc;
}

.terms-modal-doc-icon {
    width: 18px;
    height: 18px;
    stroke-width: 2;
    flex-shrink: 0;
}

.terms-modal-primary-btn,
.terms-modal-primary-btn:hover,
.terms-modal-primary-btn:focus {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 50px;
    padding: 0.625rem 1rem;
    border: 1px solid #1d6ac5;
    border-radius: 0.375rem;
    background-color: #1d6ac5;
    color: #fff;
    font-size: 1.0625rem;
    font-weight: 500;
    text-decoration: none;
}

.terms-modal-primary-btn:hover {
    background-color: #145193;
    border-color: #145193;
}

.terms-modal-primary-btn:disabled {
    opacity: 0.65;
}

/* Plain centered text link, deliberately not a button — signing out is the
   de-emphasised path. */
.terms-modal-signout-link,
.terms-modal-signout-link:hover,
.terms-modal-signout-link:focus {
    display: block;
    width: 100%;
    margin-top: 1rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #6e7985;
    font-size: 1rem;
    text-align: center;
    box-shadow: none;
}

.terms-modal-signout-link:hover {
    color: #495057;
    text-decoration: underline;
}

.terms-modal-error {
    margin-top: 1rem;
    margin-bottom: 0;
    font-size: 0.875rem;
    border-radius: 0.375rem;
}

/* Mobile: tighten padding, stack the document buttons, and let the dialog
   scroll internally so the footer actions stay reachable. */
@media (max-width: 575.98px) {
    .terms-modal-dialog {
        margin: 0.75rem;
        max-height: calc(100vh - 1.5rem);
    }

    .terms-modal-content {
        padding: 1.25rem;
        max-height: calc(100vh - 1.5rem);
        overflow-y: auto;
    }

    .terms-modal-title {
        font-size: 1.1875rem;
    }

    .terms-modal-doc-links {
        flex-direction: column;
    }
}

/* ===== Dark theme ===== */
[data-skin="dark"] .terms-modal-content {
    background-color: #1f1f1f;
    border-color: #3b3b3b;
}

[data-skin="dark"] .terms-modal-title {
    color: #f1f1f1;
}

[data-skin="dark"] .terms-modal-text {
    color: #d6d6d6;
}

[data-skin="dark"] .terms-modal-icon {
    color: #4a9ae8;
}

[data-skin="dark"] .terms-modal-doc-link,
[data-skin="dark"] .terms-modal-doc-link:hover,
[data-skin="dark"] .terms-modal-doc-link:focus {
    background-color: #1f1f1f;
    border-color: #4a9ae8;
    color: #4a9ae8;
}

[data-skin="dark"] .terms-modal-doc-link:hover {
    background-color: #23334a;
}

[data-skin="dark"] .terms-modal-signout-link,
[data-skin="dark"] .terms-modal-signout-link:hover,
[data-skin="dark"] .terms-modal-signout-link:focus {
    color: #adb5bd;
}

/* ===== Signup step 1 terms checkbox ===== */
/* Sits in its own tinted panel directly above the Continue button. */
.signup-terms-check {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    margin-top: 1rem;
    padding: 0.75rem 1rem;
    border-radius: 0.375rem;
    background-color: #f8f9fc;
}

.signup-terms-check .form-check-input {
    flex-shrink: 0;
    margin: 0.125rem 0 0;
    width: 1.125rem;
    height: 1.125rem;
}

.signup-terms-label {
    margin: 0;
    font-size: 0.9375rem;
    line-height: 1.45;
    color: #212529;
    cursor: pointer;
}

.signup-terms-label a {
    color: #1d6ac5;
    font-weight: 700;
    text-decoration: underline;
}

.signup-terms-label a:hover {
    color: #145193;
}

[data-skin="dark"] .signup-terms-check {
    background-color: #262626;
}

[data-skin="dark"] .signup-terms-label {
    color: #e6e6e6;
}

[data-skin="dark"] .signup-terms-label a {
    color: #4a9ae8;
}
/*



































*/

/* ===== Tailwind / Bootstrap conflict fix ===== */
/* Tailwind's .collapse { visibility: collapse } overrides Bootstrap's collapse component.
   Restore Bootstrap behavior so accordion/collapse panels work correctly. */
.collapse:not(.show) {
    display: none !important;
    visibility: visible !important;
}

.collapse.show {
    visibility: visible !important;
}


/* ===== Send Email / Send SMS Modals ===== */
.send-sms-icon-wrapper {
    width: 36px;
    height: 36px;
    background-color: #fff;
    color: #1d6ac5;
    border: 1.5px solid #1d6ac5;
    border-radius: 6px;
    flex-shrink: 0;
}

.send-sms-icon-wrapper i,
.send-sms-icon-wrapper svg {
    width: 18px;
    height: 18px;
}

.send-email-icon-wrapper {
    width: 36px;
    height: 36px;
    background-color: #fff;
    color: #1d6ac5;
    border: 1.5px solid #1d6ac5;
    border-radius: 6px;
    flex-shrink: 0;
}

.send-email-icon-wrapper i,
.send-email-icon-wrapper svg {
    width: 18px;
    height: 18px;
}

.send-email-chips-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.send-email-chips-container:empty {
    display: none;
}

.send-email-to-field {
    cursor: text;
    padding: 0.375rem 0.75rem;
}

.send-email-to-input {
    border: none;
    outline: none;
    background: transparent;
    width: 100%;
    padding: 0;
    font-size: inherit;
    line-height: 1.5;
}

.send-email-chip {
    background-color: #eff6ff;
    color: #1d6ac5;
    border: 1px solid #bfdbfe;
    font-size: 0.8rem;
    padding: 0.25rem 0.6rem;
    white-space: nowrap;
}

.send-email-dropdown {
    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    right: 0;
    z-index: 1050;
    max-height: 220px;
    overflow-y: auto;
}

.send-email-dropdown-item {
    cursor: pointer;
    transition: background-color 0.1s ease;
}

.send-email-dropdown-item:hover {
    background-color: #f0f4ff;
}

/* Shift Break Pill Animation */
@keyframes pulse-sb {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.8;
        transform: scale(1.05);
    }
}

/* Date Picker Z-Index Fix for Modals */
.datepicker.datepicker-dropdown {
    z-index: 10000 !important;
}

.datepicker-dropdown.dropdown {
    z-index: 10000 !important;
}

/* Ensure date picker appears above modal overlays */
.time-off-modal .datepicker,
.admin-time-off-modal .datepicker,
.edit-time-off-modal .datepicker {
    z-index: 10000 !important;
}

/* Fix date picker positioning on small mobile screens */
@media (max-width: 640px) {

    /* Force date picker to appear in a fixed position for small screens */
    div.datepicker.datepicker-dropdown.dropdown.absolute[style] {
        position: fixed !important;
        top: 200px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        width: calc(100vw - 2rem) !important;
        max-width: 350px !important;
        margin: 0 !important;
        z-index: 9999 !important;
    }
}

/* iPad and Touch Device Improvements */
@media (max-width: 1024px) {

    /* Fix modal scrolling on iPad */
    .fixed.inset-0.overflow-hidden {
        -webkit-overflow-scrolling: touch;
        overflow-y: auto;
    }

    .h-full.flex.flex-col.bg-white.shadow-xl {
        max-height: 100vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Improve touch targets */
    .edit-shift-btn,
    .shift-breaks-toggle,
    .toggle-arrow {
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        min-height: 44px;
        min-width: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Ensure shift cards are clickable on touch devices */
    .shift-event {
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        cursor: pointer;
    }

    /* Fix z-index stacking for touch interactions */
    .shift-breaks-toggle {
        position: relative;
        z-index: 30;
    }

    .shift-breaks-content {
        position: relative;
        z-index: 25;
    }

    /* Edit Shift Modal Scrolling Fix */
    .edit-shift-modal-container {
        max-height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .edit-shift-modal-container .overflow-y-auto {
        -webkit-overflow-scrolling: touch;
        overflow-y: auto;
        flex: 1;
        min-height: 0;
        /* Important for flex child to be scrollable */
    }

    /* Ensure Save button is always visible */
    .edit-shift-modal .fixed.inset-y-0 {
        display: flex;
        align-items: center;
    }

    /* Better spacing for shift breaks in modal on small screens */
    .edit-shift-modal-container .shift-break-card {
        margin-bottom: 1rem;
    }
}

.fs-16 {
    font-size: 16px !important;
}

.fs-14 {
    font-size: 14px !important;
}

.fs-7 {
    font-size: 0.75rem !important;
}

/* <Authentication> */
[data-skin=dark] .card-sign,
[data-skin=dark] .card-sign .card-header,
[data-skin=dark] .card-sign .card-footer,
[data-skin=dark] .card-sign a {
    background-color: #222222 !important;
    color: #FFF;
}

.card-sign a:hover {
    text-decoration: underline;
}

/* </Authentcation> */

[data-skin=dark] .text-blue {
    color: #0093FF;
}

[data-skin=light] .start-inspection-button .text-dark {
    color: #FFF !important;
}

[data-skin=light] .text-blue {
    color: #0093FF !important;
}

[data-skin=light] .w-fit-content {
    width: 11rem !important;
}

[data-skin=dark] .w-fit-content {
    width: 11rem !important;
}

[data-skin=light] .w-nine-eleven {
    width: 35% !important;
}

[data-skin=dark] .w-nine-eleven {
    width: 35% !important;
}

[data-skin=light] .w-quarter {
    width: 25% !important;
}

[data-skin=dark] .w-quarter {
    width: 25% !important;
}

[data-skin=dark] .place-wolder-dark {
    --tw-placeholder-opacity: 1;
    color: rgba(255, 255, 255, var(--tw-placeholder-opacity));
}

[data-skin=dark] .washup-bg-black {
    background-color: #000000 !important;
}

[data-skin=dark] .washup-bg-gray {
    background-color: #141414 !important;
}

[data-skin=dark] .washup-bg-lightgray {
    background-color: #222222 !important;
}

[data-skin=dark] .washup-border-r-black {
    border-right: 1px solid #000000 !important;
}

[data-skin=dark] .washup-border-b-black {
    border-bottom: 1px solid #000000 !important;
}

.header-logo::after,
.sidebar-logo::after {
    content: none;
}

[data-skin=dark] .gray-icon {
    color: #BDBDBD;
}

[data-skin=light] .gray-icon {
    color: #41505f;
}

[data-skin=dark] .copy-link-btn {
    background-color: #222222;
    color: white;
}

[data-skin=dark] .select2-container--default .select2-selection--single,
[data-skin=dark] .select2-container--default .select2-results__option--selected {
    background-color: #222222;
    border-color: #4F4F4F;
    height: 35px;
}

[data-skin=light] .select2-container--default .select2-selection--single,
[data-skin=light] .select2-container--default .select2-results__option--selected {
    height: 35px;
}

@media (max-width: 518px) {
    [data-skin=light] #header-dropdown .select2-container--default .select2-selection--single {
        width: 100px;
    }
}

[data-skin=dark] .select2-container--open .select2-selection--multiple,
[data-skin=dark] .select2-container--default .select2-selection--multiple,
[data-skin=dark] .select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #222222;
    border-color: #4F4F4F;
}


.select2-selection__rendered {
    line-height: 34px !important;
}

.select2-selection--multiple>.select2-selection__rendered {
    line-height: inherit !important;
}

.select2-selection__arrow {
    height: 35px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 35px;
    line-height: 1;
}

[data-skin=dark] #select2-assigned_to-container,
[data-skin=dark] #select2-equipment-container,
[data-skin=dark] #select2-state-container,
[data-skin=dark] #select2-member-container,
[data-skin=dark] #select2-service_reminder-container {
    background-color: #000 !important;
}

[data-skin=dark] .select2-dropdown {
    background-color: #000;
    border-color: #4F4F4F;
}

[data-skin=dark] .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #333333;
    border-color: #4F4F4F;
    border-radius: 25px;
}

[data-skin=dark] .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0067B3;
}

.sidebar {
    display: flex;
    flex-direction: column;
}

.sidebar-header {
    flex-shrink: 0;
    /* Prevent header from shrinking */
}

.sidebar-body {
    overflow-y: auto;
    flex: 1;
    padding-bottom: 1rem;
    min-height: 0;
    /* Important for flex child to be scrollable */
}

.sidebar-footer {
    bottom: -146px;
    flex-shrink: 0;
    /* Prevent footer from shrinking */
}

.sidebar.footer-menu-show::before {
    opacity: 0;
}

@media screen and (max-device-width: 991px) {

    .sidebar-footer {
        bottom: -185px !important;
    }

    .sidebar.footer-menu-show .sidebar-footer {
        bottom: 20px !important;
    }

}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .sidebar-footer {
        bottom: -150px !important;
    }

    .sidebar.footer-menu-show .sidebar-footer {
        bottom: 20px !important;
    }
}

[data-skin=dark] .card .nav-link {
    color: #FFFFFF;
    font-size: 16px;
}

[data-skin=light] .card .nav-link {
    color: #41505f;
    font-size: 16px;
}

[data-skin=dark] .nav-link .material-icons {
    color: #FFF;
    border: 1px solid #141414;
    border-radius: 25px;
    width: 30px !important;
    height: 30px;
    padding-top: 3px;
    padding-left: 4px;
}

[data-skin=light] .nav-link .material-icons {
    color: #000;
    border: 1px solid #FFF;
    border-radius: 25px;
    width: 30px !important;
    height: 30px;
    padding-top: 3px;
    padding-left: 4px;
}

[data-skin=dark] .text-yellow {
    color: #FFEF2E;
}

[data-skin=light] .text-yellow {
    color: #ffc107;
}


.horizontal-tab-nav .nav-item {
    border-bottom: 4px solid transparent;
}

.horizontal-tab-nav .nav-item.active {
    border-bottom: 4px solid #0067B3;
}

[data-skin=dark] .divider::before,
[data-skin=dark] .divider::after {
    background-color: #4F4F4F !important;
}

[data-skin=light] .divider::before,
[data-skin=light] .divider::after {
    color: #ecedf1 !important;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-header {
    border-bottom-color: #000;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-body .nav-group {
    border-bottom-color: #141414;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .sidebar-footer {
    border-top-color: #000;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-item {
    border-bottom: 1px solid #000;
}


[data-skin=light] .sidebar:not(.sidebar-prime) .sidebar-header {
    border-bottom-color: #ecedf1;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .sidebar-body .nav-group {
    border-bottom-color: #FFF;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .sidebar-footer {
    border-top-color: #ecedf1;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-item {
    border-bottom: 1px solid #ecedf1;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link {
    color: #FFFFFF;
    padding: 20px 20px;
    font-size: 16px;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.active {
    color: #FFFFFF;
    background-color: #0067B3;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.active .material-icons {
    color: #FFFFFF;
    background-color: #015593;
    border: 1px solid #015593;
    border-radius: 25px;
    width: 30px;
    height: 30px;
    padding-top: 3px;
    padding-left: 4px;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link {
    padding: 20px 20px;
    font-size: 16px;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.profile-nav,
[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.profile-nav {
    font-size: 14px;
    font-weight: 300;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.active {
    color: #FFFFFF;
    background-color: #0067B3 !important;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .nav-link.active .material-icons {
    color: #FFFFFF;
    background-color: #015593;
    border: 1px solid #015593;
    border-radius: 25px;
    width: 30px;
    height: 30px;
    padding-top: 3px;
    padding-left: 4px;
}

[data-skin=dark] .nav-sidebar .nav-link:not(.active):hover,
[data-skin=dark] .nav-sidebar .nav-link:not(.active):focus {
    background-color: #222;
}

[data-skin=light] .nav-sidebar .nav-link:not(.active):hover,
[data-skin=light] .nav-sidebar .nav-link:not(.active):focus {
    background-color: #f8f9fc;
}

/* Schedule toggle button - Dark mode */
[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle {
    background-color: transparent;
    color: #FFFFFF;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle svg {
    color: #FFFFFF;
    stroke: #FFFFFF;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle.active {
    background-color: #0067B3;
    color: #FFFFFF;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle.active svg {
    color: #FFFFFF;
    stroke: #FFFFFF;
}

[data-skin=dark] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle:hover:not(.active) {
    background-color: #222;
}

/* Schedule toggle button - Light mode */
[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle {
    background-color: transparent;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle.active {
    background-color: #0067B3 !important;
    color: #FFFFFF;
}

[data-skin=light] .sidebar:not(.sidebar-prime) .nav-sidebar .schedule-toggle:hover:not(.active) {
    background-color: #f8f9fc;
}

/* Schedule submenu - Dark mode */
[data-skin=dark] .schedule-submenu {
    background-color: #141414;
}

[data-skin=dark] .schedule-submenu .text-gray-600 {
    color: #9CA3AF !important;
}

[data-skin=dark] .schedule-submenu .nav-link {
    color: #FFFFFF;
}

[data-skin=dark] .schedule-submenu .nav-link:hover {
    background-color: #222;
}

[data-skin=dark] .schedule-submenu .nav-link.schedule-active-link {
    color: #0067B3;
    background-color: transparent;
}

[data-skin=dark] .schedule-submenu .border-gray-300 {
    border-color: #374151 !important;
}

/* Sidebar footer - Dark mode */
[data-skin=dark] .sidebar-footer .text-black,
[data-skin=dark] .sidebar-footer .text-dark {
    color: #FFFFFF !important;
}

[data-skin=dark] .sidebar-footer-body span {
    color: #9CA3AF !important;
}

[data-skin=dark] .sidebar-footer-menu .nav a {
    color: #FFFFFF !important;
}

[data-skin=dark] .sidebar-footer-menu .nav a:hover {
    background-color: #222;
}

[data-skin=dark] .sidebar-footer-menu hr {
    border-color: #374151 !important;
}

/* Availabilities/Time-Off Scheduler - Dark mode specific styles */
/* Target only elements within scheduler pages to avoid affecting other Tailwind components */

/* Main container with shadow and border */
[data-skin=dark] .shadow-sm.rounded-lg.border.border-gray-200 {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* Header section and page titles */
[data-skin=dark] .bg-gray-100.border-b.border-gray-200,
[data-skin=dark] .bg-gray-100.rounded-t-lg,
[data-skin=dark] .bg-gray-100.text-dark {
    background-color: #141414 !important;
    border-color: #374151 !important;
    color: #FFFFFF !important;
}

/* Info accordion summary */
[data-skin=dark] details>summary.bg-white.border.border-gray-200 {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
    color: #FFFFFF !important;
}

[data-skin=dark] details>summary svg {
    stroke: #FFFFFF !important;
}

/* Info accordion content */
[data-skin=dark] details .bg-gray-50.text-gray-700 {
    background-color: #141414 !important;
    color: #D1D5DB !important;
}

/* Table header */
[data-skin=dark] thead.bg-gray-50 {
    background-color: #141414 !important;
}

/* Table body */
[data-skin=dark] tbody.bg-white {
    background-color: #1F1F1F !important;
}

/* Calendar day headers - bg-gray-50 with flex and border */
[data-skin=dark] .bg-gray-50.flex.flex-col {
    background-color: #141414 !important;
}

[data-skin=dark] .bg-gray-50.flex.flex-col .text-gray-600 {
    color: #9CA3AF !important;
}

[data-skin=dark] .bg-gray-50.flex.flex-col .text-gray-900 {
    color: #F3F4F6 !important;
}

[data-skin=dark] .bg-gray-50 .border-gray-200,
[data-skin=dark] .bg-gray-50.border-r {
    border-color: #374151 !important;
}

/* Time-off detail cards */
[data-skin=dark] .time-off-detail {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* User avatar background */
[data-skin=dark] .bg-gray-200.rounded-full {
    background-color: #2A2A2A !important;
}

/* Schedule navigation buttons */
[data-skin=dark] .schedule-nav-button .material-icons {
    color: #FFFFFF !important;
}

/* Week label badge */
[data-skin=dark] span.bg-\[\#eff6ff\] {
    background-color: #1e3a5f !important;
    border-color: #2563eb !important;
}

/* Approve/Deny buttons */
[data-skin=dark] .approve-button,
[data-skin=dark] .deny-button {
    background-color: #1F1F1F !important;
    border-color: #4B5563 !important;
}

[data-skin=dark] .approve-button:hover,
[data-skin=dark] .deny-button:hover {
    background-color: #2A2A2A !important;
}

/* Empty state */
[data-skin=dark] .bg-gray-100.border.border-gray-200.rounded-md {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* Text colors for scheduler - be specific to avoid affecting all Tailwind text classes */
[data-skin=dark] .shadow-sm.rounded-lg .text-dark,
[data-skin=dark] .time-off-detail .text-dark,
[data-skin=dark] thead .text-dark,
[data-skin=dark] tbody .text-dark {
    color: #FFFFFF !important;
}

[data-skin=dark] .shadow-sm.rounded-lg .text-gray-500,
[data-skin=dark] .time-off-detail .text-gray-500,
[data-skin=dark] thead .text-gray-500 {
    color: #9CA3AF !important;
}

[data-skin=dark] .shadow-sm.rounded-lg .text-gray-600,
[data-skin=dark] .time-off-detail .text-gray-600 {
    color: #9CA3AF !important;
}

[data-skin=dark] .shadow-sm.rounded-lg .text-gray-700 {
    color: #D1D5DB !important;
}

[data-skin=dark] .shadow-sm.rounded-lg .text-gray-900,
[data-skin=dark] .time-off-detail .text-gray-900 {
    color: #F3F4F6 !important;
}

[data-skin=dark] tbody .text-black {
    color: #FFFFFF !important;
}

/* Schedule navigation text */
[data-skin=dark] .schedule-nav-text {
    color: #FFFFFF !important;
}

/* Border utilities for scheduler */
[data-skin=dark] .shadow-sm.rounded-lg .border-gray-200,
[data-skin=dark] .time-off-detail .border-gray-200 {
    border-color: #374151 !important;
}

[data-skin=dark] .shadow-sm.rounded-lg .border-gray-300 {
    border-color: #4B5563 !important;
}

/* FC calendar specific classes */
[data-skin=dark] .fc-daygrid-day {
    background-color: #1F1F1F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .fc-gray-border {
    border-color: #374151 !important;
}

[data-skin=dark] .fc-rawcalendar {
    background-color: #141414 !important;
}

/* Sticky cell in table */
[data-skin=dark] .sticky-cell {
    background-color: #1F1F1F !important;
}

/* Edit Availability/Time-Off Modal - Dark mode */
/* Main modal container */
[data-skin=dark] .edit-availability-modal .bg-white.shadow-xl,
[data-skin=dark] .edit-time-off-modal .bg-white.shadow-xl {
    background-color: #1F1F1F !important;
}

/* User avatar in modal */
[data-skin=dark] .edit-availability-modal .user-logo.bg-gray-200,
[data-skin=dark] .edit-time-off-modal .user-logo.bg-gray-200 {
    background-color: #2A2A2A !important;
}

[data-skin=dark] .edit-availability-modal .text-gray-700,
[data-skin=dark] .edit-time-off-modal .text-gray-700 {
    color: #D1D5DB !important;
}

/* Status badge - Using helper event_style_classes_baged which has custom backgrounds */
/* Need to override text-dark class which would make text white in dark mode */
/* Approved badge: bg-[#E5E5E5] - light gray, needs dark text */
[data-skin=dark] .edit-availability-modal .text-dark.bg-\[\#E5E5E5\],
[data-skin=dark] .edit-time-off-modal .text-dark.bg-\[\#E5E5E5\],
[data-skin=dark] .edit-availability-modal .bg-\[\#E5E5E5\],
[data-skin=dark] .edit-time-off-modal .bg-\[\#E5E5E5\] {
    color: #000000 !important;
}

/* Pending badge: bg-[#FFF8E1] - light yellow, needs dark text */
[data-skin=dark] .edit-availability-modal .text-dark.bg-\[\#FFF8E1\],
[data-skin=dark] .edit-time-off-modal .text-dark.bg-\[\#FFF8E1\],
[data-skin=dark] .edit-availability-modal .bg-\[\#FFF8E1\],
[data-skin=dark] .edit-time-off-modal .bg-\[\#FFF8E1\] {
    color: #000000 !important;
}

/* Rejected badge: bg-[#FFEBEE] - light red, needs dark text */
[data-skin=dark] .edit-availability-modal .text-dark.bg-\[\#FFEBEE\],
[data-skin=dark] .edit-time-off-modal .text-dark.bg-\[\#FFEBEE\],
[data-skin=dark] .edit-availability-modal .bg-\[\#FFEBEE\],
[data-skin=dark] .edit-time-off-modal .bg-\[\#FFEBEE\] {
    color: #000000 !important;
}

/* Fallback for standard Tailwind badge classes if used elsewhere */
[data-skin=dark] .edit-availability-modal .bg-green-100,
[data-skin=dark] .edit-time-off-modal .bg-green-100 {
    background-color: #065f46 !important;
}

[data-skin=dark] .edit-availability-modal .text-green-800,
[data-skin=dark] .edit-time-off-modal .text-green-800 {
    color: #d1fae5 !important;
}

[data-skin=dark] .edit-availability-modal .bg-red-100,
[data-skin=dark] .edit-time-off-modal .bg-red-100 {
    background-color: #7f1d1d !important;
}

[data-skin=dark] .edit-availability-modal .text-red-800,
[data-skin=dark] .edit-time-off-modal .text-red-800 {
    color: #fecaca !important;
}

[data-skin=dark] .edit-availability-modal .bg-yellow-100,
[data-skin=dark] .edit-time-off-modal .bg-yellow-100 {
    background-color: #78350f !important;
}

[data-skin=dark] .edit-availability-modal .text-yellow-800,
[data-skin=dark] .edit-time-off-modal .text-yellow-800 {
    color: #fef3c7 !important;
}

/* Change Status section */
[data-skin=dark] .edit-availability-modal .bg-gray-100,
[data-skin=dark] .edit-time-off-modal .bg-gray-100 {
    background-color: #141414 !important;
}

[data-skin=dark] .edit-availability-modal .text-gray-500,
[data-skin=dark] .edit-time-off-modal .text-gray-500 {
    color: #9CA3AF !important;
}

[data-skin=dark] .edit-availability-modal .border-gray-300,
[data-skin=dark] .edit-time-off-modal .border-gray-300 {
    border-color: #4B5563 !important;
}

[data-skin=dark] .edit-availability-modal .text-gray-400,
[data-skin=dark] .edit-time-off-modal .text-gray-400 {
    color: #9CA3AF !important;
}

[data-skin=dark] .edit-availability-modal .placeholder-gray-400::placeholder,
[data-skin=dark] .edit-time-off-modal .placeholder-gray-400::placeholder {
    color: #6B7280 !important;
}

/* Textarea in change status */
[data-skin=dark] .edit-availability-modal textarea,
[data-skin=dark] .edit-time-off-modal textarea {
    background-color: #1F1F1F !important;
    color: #FFFFFF !important;
    border-color: #4B5563 !important;
}

/* Buttons in change status section */
[data-skin=dark] .edit-availability-modal .bg-gray-400,
[data-skin=dark] .edit-time-off-modal .bg-gray-400 {
    background-color: #4B5563 !important;
}

[data-skin=dark] .edit-availability-modal .text-white,
[data-skin=dark] .edit-time-off-modal .text-white {
    color: #FFFFFF !important;
}

[data-skin=dark] .edit-availability-modal button.bg-white,
[data-skin=dark] .edit-time-off-modal button.bg-white {
    background-color: #1F1F1F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .edit-availability-modal button.bg-white:hover,
[data-skin=dark] .edit-time-off-modal button.bg-white:hover {
    background-color: #2A2A2A !important;
}

/* History Activity cards */
[data-skin=dark] .edit-availability-modal .bg-gray-50.rounded-md,
[data-skin=dark] .edit-time-off-modal .bg-gray-50.rounded-md {
    background-color: #141414 !important;
    border-color: #374151 !important;
}

[data-skin=dark] .edit-availability-modal .bg-gray-50.rounded-md .bg-gray-200,
[data-skin=dark] .edit-time-off-modal .bg-gray-50.rounded-md .bg-gray-200 {
    background-color: #2A2A2A !important;
}

[data-skin=dark] .edit-availability-modal .bg-gray-50.rounded-md .text-gray-600,
[data-skin=dark] .edit-time-off-modal .bg-gray-50.rounded-md .text-gray-600 {
    color: #D1D5DB !important;
}

[data-skin=dark] .edit-availability-modal .bg-gray-50.rounded-md .text-gray-900,
[data-skin=dark] .edit-time-off-modal .bg-gray-50.rounded-md .text-gray-900 {
    color: #F3F4F6 !important;
}

/* Delete modal - needs inline style overrides */
[data-skin=dark] div[id*="delete-availability-modal"]>div,
[data-skin=dark] div[id*="delete-time-off-modal"]>div {
    background: #1F1F1F !important;
}

[data-skin=dark] div[id*="delete-availability-modal"] h3,
[data-skin=dark] div[id*="delete-time-off-modal"] h3 {
    color: #dc2626 !important;
}

[data-skin=dark] div[id*="delete-availability-modal"] p,
[data-skin=dark] div[id*="delete-time-off-modal"] p {
    color: #9CA3AF !important;
}

[data-skin=dark] div[id*="delete-availability-modal"] button[style*="background: #f3f4f6"],
[data-skin=dark] div[id*="delete-time-off-modal"] button[style*="background: #f3f4f6"] {
    background: #2A2A2A !important;
    color: #FFFFFF !important;
    border-color: #4B5563 !important;
}

/* Availability/Time-Off Calendar Cards - Override inline styles from helper */
/* These cards use inline styles from event_style_classes() helper */
/* Pending: background-color: #FFF8E1; border-left: 4px solid #FFD600; */
[data-skin=dark] .absolute.rounded[style*="background-color: #FFF8E1"] {
    background-color: #854d0e !important;
    border-left-color: #fbbf24 !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #FFF8E1"] .text-gray-500 {
    color: #fef3c7 !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #FFF8E1"] .font-medium {
    color: #fef9c3 !important;
}

/* Approved: background-color: #E5E5E5; border-left: 4px solid #757575; */
[data-skin=dark] .absolute.rounded[style*="background-color: #E5E5E5"] {
    background-color: #374151 !important;
    border-left-color: #9ca3af !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #E5E5E5"] .text-gray-500 {
    color: #e5e7eb !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #E5E5E5"] .font-medium {
    color: #f3f4f6 !important;
}

/* Rejected: background-color: #FFEBEE; border-left: 4px solid #EF5350; */
[data-skin=dark] .absolute.rounded[style*="background-color: #FFEBEE"] {
    background-color: #7f1d1d !important;
    border-left-color: #ef4444 !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #FFEBEE"] .text-gray-500 {
    color: #fecaca !important;
}

[data-skin=dark] .absolute.rounded[style*="background-color: #FFEBEE"] .font-medium {
    color: #fee2e2 !important;
}

/* Status badges in the list cards - event_status_classes helper */
/* These use Tailwind classes: bg-yellow-100 text-gray-800 border-2 border-yellow-300 */
[data-skin=dark] .inline-flex.rounded-full.bg-yellow-100 {
    background-color: #854d0e !important;
    border-color: #fbbf24 !important;
}

[data-skin=dark] .inline-flex.rounded-full.bg-yellow-100.text-gray-800 {
    color: #fef3c7 !important;
}

[data-skin=dark] .inline-flex.rounded-full.bg-green-100 {
    background-color: #065f46 !important;
    border-color: #34d399 !important;
}

[data-skin=dark] .inline-flex.rounded-full.bg-green-100.text-gray-800 {
    color: #d1fae5 !important;
}

[data-skin=dark] .inline-flex.rounded-full.bg-red-100 {
    background-color: #7f1d1d !important;
    border-color: #ef4444 !important;
}

[data-skin=dark] .inline-flex.rounded-full.bg-red-100.text-gray-800 {
    color: #fecaca !important;
}

/* Task Library Page - Dark mode */
/* Header with bg-light */
[data-skin=dark] .card-header.bg-light {
    background-color: #141414 !important;
    border-color: #374151 !important;
}

[data-skin=dark] .card-header .text-dark {
    color: #FFFFFF !important;
}

/* Main content area with white background */
[data-skin=dark] .p-4.px-2[style*="background-color: white"],
[data-skin=dark] .px-3.pb-3[style*="background-color: white"] {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* Task library cards */
[data-skin=dark] .task-library-card[style*="background-color: #ffffff"] {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

[data-skin=dark] .task-library-card .text-dark {
    color: #FFFFFF !important;
}

[data-skin=dark] .task-library-card .text-muted {
    color: #9CA3AF !important;
}

[data-skin=dark] .task-library-card .card-title {
    color: #FFFFFF !important;
}

/* Task library badges - Routine (blue) */
[data-skin=dark] .task-library-badges .badge[style*="background-color: rgba(219, 234, 254, 1)"] {
    background-color: #1e3a8a !important;
    color: #bfdbfe !important;
    border-color: #3b82f6 !important;
}

/* Task library badges - Situational (orange) */
[data-skin=dark] .task-library-badges .badge[style*="background-color: #fff3e0"] {
    background-color: #7c2d12 !important;
    color: #fed7aa !important;
    border-color: #f97316 !important;
}

/* Task library badges - Task Aging (gray) */
[data-skin=dark] .task-library-badges .badge[style*="background-color: #F3F4F6"] {
    background-color: #374151 !important;
    color: #e5e7eb !important;
    border-color: #4b5563 !important;
}

/* Dropdown menus */
[data-skin=dark] .dropdown-menu {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

[data-skin=dark] .dropdown-item {
    color: #FFFFFF !important;
}

[data-skin=dark] .dropdown-item:hover {
    background-color: #2A2A2A !important;
}

[data-skin=dark] .dropdown-item[style*="color: #dc3545"] {
    color: #f87171 !important;
}

/* Modals */
[data-skin=dark] .modal-content {
    background-color: #1F1F1F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .modal-header {
    border-color: #374151 !important;
}

[data-skin=dark] .modal-body {
    color: #E5E7EB !important;
}

[data-skin=dark] .modal-title {
    color: #FFFFFF !important;
}

[data-skin=dark] .modal-body p,
[data-skin=dark] .modal-body label {
    color: #D1D5DB !important;
}

[data-skin=dark] .modal-body .text-muted {
    color: #9CA3AF !important;
}

/* Form controls in modals */
[data-skin=dark] .modal .form-control {
    background-color: #141414 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .modal .form-control::placeholder {
    color: #6B7280 !important;
}

[data-skin=dark] .modal .dropdown-menu {
    background-color: #1F1F1F !important;
}

[data-skin=dark] .modal .input-group-text {
    background-color: #141414 !important;
    border-color: #4B5563 !important;
    color: #9CA3AF !important;
}

/* Alert boxes */
[data-skin=dark] .alert.alert-info {
    background-color: #1e3a5f !important;
    border-color: #3b82f6 !important;
    color: #bfdbfe !important;
}

[data-skin=dark] .alert.alert-warning {
    background-color: #78350f !important;
    border-color: #f59e0b !important;
    color: #fef3c7 !important;
}

[data-skin=dark] .alert.alert-warning strong {
    color: #fbbf24 !important;
}

/* Buttons */
[data-skin=dark] .btn.btn-outline-secondary {
    background-color: #1F1F1F !important;
    border-color: #4B5563 !important;
    color: #E5E7EB !important;
}

[data-skin=dark] .btn.btn-outline-secondary:hover {
    background-color: #2A2A2A !important;
}

[data-skin=dark] .btn.bg-white {
    background-color: #1F1F1F !important;
    color: #FFFFFF !important;
}

/* ============================================================================
   Rearrange List Modal - Dark Mode
   ============================================================================ */

/* Sortable task items in rearrange modal - Override inline white background */
[data-skin=dark] .sortable-item.task[style*="background-color: white"],
[data-skin=dark] .sortable-item.task[style*="background-color: rgb(255, 255, 255)"] {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* Task title in sortable items - Override .text-dark */
[data-skin=dark] .sortable-item.task .text-dark {
    color: #FFFFFF !important;
}

/* Move up/down buttons - ensure proper contrast */
[data-skin=dark] .sortable-item.task .btn-link.move-up,
[data-skin=dark] .sortable-item.task .btn-link.move-down {
    color: #9CA3AF !important;
}

[data-skin=dark] .sortable-item.task .btn-link.move-up:hover,
[data-skin=dark] .sortable-item.task .btn-link.move-down:hover {
    color: #FFFFFF !important;
}

/* Drag handle icon - Invert colors for dark mode */
[data-skin=dark] .sortable-item.task .drag-handle img {
    filter: brightness(0) invert(1);
    opacity: 0.6;
}

/* ============================================================================
   Shift Breaks - Create/Edit Shift Modal - Dark Mode
   ============================================================================ */

/* Shift break card container */
[data-skin=dark] .shift-break-card.bg-gray-50 {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

/* Labels in shift break card */
[data-skin=dark] .shift-break-card .text-gray-700 {
    color: #E5E7EB !important;
}

/* Input fields in shift break card */
[data-skin=dark] .shift-break-card input[type="text"] {
    background-color: #141414 !important;
    border-color: #4B5563 !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .shift-break-card input[type="text"]::placeholder {
    color: #6B7280 !important;
}

[data-skin=dark] .shift-break-card input[type="text"]:focus {
    border-color: #3B82F6 !important;
    ring-color: #3B82F6 !important;
}

/* Clock icon in time inputs */
[data-skin=dark] .shift-break-card .text-gray-700 svg {
    color: #9CA3AF !important;
    stroke: #9CA3AF !important;
}

/* Time dropdown menu */
[data-skin=dark] .shift-break-card .time-dropdown.bg-white {
    background-color: #1F1F1F !important;
    border-color: #374151 !important;
}

[data-skin=dark] .shift-break-card .time-dropdown .border {
    border-color: #374151 !important;
    background-color: #1F1F1F !important;
}

/* Time period buttons (AM/PM) */
[data-skin=dark] .shift-break-card .time-period-btn.text-dark {
    background-color: #374151 !important;
    color: #E5E7EB !important;
}

[data-skin=dark] .shift-break-card .time-period-btn.active {
    background-color: #3B82F6 !important;
    color: #FFFFFF !important;
}

/* Hour/Min labels and values in time dropdown */
[data-skin=dark] .shift-break-card .time-dropdown .text-dark {
    color: #E5E7EB !important;
}

/* Hour/Min selector buttons */
[data-skin=dark] .shift-break-card .time-dropdown .text-gray-400 {
    color: #6B7280 !important;
}

[data-skin=dark] .shift-break-card .time-dropdown .text-gray-400:hover {
    color: #9CA3AF !important;
}

/* Material icons in time selectors */
[data-skin=dark] .shift-break-card .time-dropdown .material-icons.text-dark {
    color: #E5E7EB !important;
}

/* Remove break button (trash icon) */
[data-skin=dark] .shift-break-card .remove-break-btn {
    color: #EF4444 !important;
}

[data-skin=dark] .shift-break-card .remove-break-btn:hover {
    color: #DC2626 !important;
}

/* Apply button */
[data-skin=dark] .shift-break-card .btn-primary {
    background-color: #3B82F6 !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .shift-break-card .btn-primary:hover {
    background-color: #2563EB !important;
}

/* Add Break button */
[data-skin=dark] #add-break-btn.bg-white,
[data-skin=dark] button[data-action*="shift-breaks#addBreak"].bg-white {
    background-color: #1F1F1F !important;
    border-color: #4B5563 !important;
    color: #E5E7EB !important;
}

[data-skin=dark] #add-break-btn.bg-white:hover,
[data-skin=dark] button[data-action*="shift-breaks#addBreak"].bg-white:hover {
    background-color: #2A2A2A !important;
}

[data-skin=dark] #add-break-btn svg,
[data-skin=dark] button[data-action*="shift-breaks#addBreak"] svg {
    stroke: #E5E7EB !important;
}

/* ============================================================================
   Schedule Week - Event Cards (Shifts, Time-Offs, Location Events) - Dark Mode
   ============================================================================ */

/* Shift cards - Published (#CAF2D7 background, #5FD28C border) */
[data-skin=dark] .handle[style*="background-color: #CAF2D7"],
[data-skin=dark] .handle[style*="background-color: rgb(202, 242, 215)"],
[data-skin=dark] .shift-event[style*="background-color: #CAF2D7"],
[data-skin=dark] .shift-event[style*="background-color: rgb(202, 242, 215)"] {
    background-color: #065f46 !important;
    border-left-color: #34d399 !important;
}

/* Shift cards - Unpublished (#EEEEEE background, #00BD13 border) */
[data-skin=dark] .handle[style*="background-color: #EEEEEE"][style*="border-left: 4px solid #00BD13"],
[data-skin=dark] .handle[style*="background-color: rgb(238, 238, 238)"][style*="border-left: 4px solid #00BD13"],
[data-skin=dark] .shift-event[style*="background-color: #EEEEEE"][style*="border-left: 4px solid #00BD13"],
[data-skin=dark] .shift-event[style*="background-color: rgb(238, 238, 238)"][style*="border-left: 4px solid #00BD13"] {
    background-color: #1e3a1a !important;
    border-left-color: #16a34a !important;
}

/* Location Events - Published (#E6F0FF background, #0067B3 border) */
[data-skin=dark] .location-event[style*="background-color: #E6F0FF"],
[data-skin=dark] .location-event[style*="background-color: rgb(230, 240, 255)"] {
    background-color: #1e3a8a !important;
    border-left-color: #3b82f6 !important;
}

/* Location Events - Unpublished (#EEEEEE background, #0067B3 border) */
[data-skin=dark] .location-event[style*="background-color: #EEEEEE"],
[data-skin=dark] .location-event[style*="background-color: rgb(238, 238, 238)"] {
    background-color: #1e293b !important;
    border-left-color: #60a5fa !important;
}

/* Time Off - Approved (#E5E5E5 background, #757575 border) */
[data-skin=dark] .handle[style*="background-color: #E5E5E5"][style*="border-left: 4px solid #757575"],
[data-skin=dark] .handle[style*="background-color: rgb(229, 229, 229)"][style*="border-left: 4px solid #757575"] {
    background-color: #374151 !important;
    border-left-color: #9ca3af !important;
}

/* Time Off - Pending (#fff8e1 background, #ffd600 border) */
[data-skin=dark] .handle[style*="background-color: #fff8e1"],
[data-skin=dark] .handle[style*="background-color: rgb(255, 248, 225)"] {
    background-color: #713f12 !important;
    border-left-color: #fbbf24 !important;
}

/* Time Off - Rejected (#FFD8D8 background, #FF3D3D border) */
[data-skin=dark] .handle[style*="background-color: #FFD8D8"],
[data-skin=dark] .handle[style*="background-color: rgb(255, 216, 216)"] {
    background-color: #7f1d1d !important;
    border-left-color: #ef4444 !important;
}

/* Event card text colors - Ensure readability */
[data-skin=dark] .handle .text-black,
[data-skin=dark] .shift-event .text-black,
[data-skin=dark] .location-event .text-black {
    color: #FFFFFF !important;
}

[data-skin=dark] .handle .text-gray-500,
[data-skin=dark] .shift-event .text-gray-500,
[data-skin=dark] .location-event .text-gray-500 {
    color: #D1D5DB !important;
}

[data-skin=dark] .handle .text-gray-400,
[data-skin=dark] .shift-event .text-gray-400,
[data-skin=dark] .location-event .text-gray-400 {
    color: #9CA3AF !important;
}

[data-skin=dark] .handle .text-gray-600,
[data-skin=dark] .shift-event .text-gray-600,
[data-skin=dark] .location-event .text-gray-600 {
    color: #9CA3AF !important;
}

/* Shift breaks content container - Dark mode */
[data-skin=dark] .shift-breaks-content .rounded.shadow-sm[style*="background-color: rgba(255, 255, 255"],
[data-skin=dark] .shift-breaks-content .rounded.shadow-sm.border-gray-200 {
    background-color: rgba(31, 31, 31, 0.95) !important;
    border-color: #4B5563 !important;
}

/* Shift breaks text colors */
[data-skin=dark] .shift-breaks-content .text-gray-800 {
    color: #F3F4F6 !important;
}

[data-skin=dark] .shift-breaks-content .text-gray-600 {
    color: #D1D5DB !important;
}

/* Availability cards text colors */
[data-skin=dark] .availability-handle .text-gray-800 {
    color: #F3F4F6 !important;
}

[data-skin=dark] .availability-handle .text-gray-600 {
    color: #D1D5DB !important;
}

/* Availability modal dark mode */
[data-skin=dark] .bg-\[\#FAFAFA\] {
    background-color: #374151 !important;
}

[data-skin=dark] .bg-\[\#E1E1E1\] {
    background-color: #4B5563 !important;
}

[data-skin=dark] .bg-gray-50.border.border-gray-200 {
    background-color: #374151 !important;
    border-color: #4B5563 !important;
}

[data-skin=dark] .bg-gray-50.border.border-gray-300 {
    background-color: #374151 !important;
    border-color: #4B5563 !important;
}

[data-skin=dark] .time-input.bg-gray-50 {
    background-color: #374151 !important;
    border-color: #4B5563 !important;
    color: #F3F4F6 !important;
}

[data-skin=dark] .all_day.bg-gray-50 {
    background-color: #374151 !important;
    border-color: #4B5563 !important;
}

[data-skin=dark] .text-gray-600 {
    color: #D1D5DB !important;
}

[data-skin=dark] .hover\:bg-red-50:hover {
    background-color: rgba(127, 29, 29, 0.3) !important;
}

[data-skin=dark] .bg-white.border.border-gray-300 {
    background-color: #374151 !important;
    border-color: #4B5563 !important;
    color: #F3F4F6 !important;
}

[data-skin=dark] .text-gray-700 {
    color: #D1D5DB !important;
}

/* Schedule details dark mode */
[data-skin=dark] .text-gray-800 {
    color: #F3F4F6 !important;
}

[data-skin=dark] .text-gray-900 {
    color: #FFFFFF !important;
}

[data-skin=dark] .bg-gray-100.border.border-gray-400 {
    background-color: #374151 !important;
    border-color: #6B7280 !important;
}

/* Published/Status badges - make text visible in dark mode */
[data-skin=dark] .border-2.px-2.py-1.rounded-md.text-dark.font-bold {
    color: #F3F4F6 !important;
}

[data-skin=dark] .border-2.px-2.py-1.rounded-md.text-dark.font-bold svg {
    color: #F3F4F6 !important;
}

[data-skin=dark] .schedule-details-breaks-content .bg-gray-50 {
    background-color: #374151 !important;
}

/* @media (hover: none) {

    a:hover{
        color: inherit !important;
    }

    .nav-sidebar .nav-link:hover,
    .nav-sidebar .nav-link:focus {
        background-color: inherit !important;
    }

} */

[data-skin=dark] .card-border-color {
    border-color: #4F4F4F !important;
}

/* Create New Service wizard progress indicator */
.wizard-progress .wizard-step-circle {
    width: 2rem;
    height: 2rem;
    font-size: 0.9rem;
}

.wizard-progress .wizard-step-active {
    background-color: #0067B3;
    color: #fff;
    border: none;
}

.wizard-progress .wizard-step-completed {
    background-color: #0067B3;
    color: #fff;
    border: none;
}

.wizard-progress .wizard-step-inactive {
    background-color: #e9ecef;
    color: #6c757d;
    border: none;
}

.wizard-progress .wizard-step-connector {
    width: 32px;
    height: 4px;
    background-color: #dee2e6;
    margin: 0;
    flex-shrink: 0;
}

.wizard-progress .wizard-step-connector-filled {
    background-color: #0067B3;
}

[data-skin=dark] .wizard-progress .wizard-step-inactive {
    background-color: #4F4F4F;
    color: #9ca3af;
    border-color: #4F4F4F;
}

[data-skin=dark] .wizard-progress .wizard-step-connector {
    background-color: #4F4F4F;
}

[data-skin=dark] .wizard-progress .wizard-step-connector-filled {
    background-color: #0067B3;
}

/* New service wizard: black step titles and labels, red required asterisk */
.service-wizard-step .card-body>h5.fw-bold {
    color: #000;
    font-size: 1.5rem;
}

.service-wizard-step .card-body>p.text-muted.small {
    font-size: 1rem;
}

.service-wizard-step .form-label.fw-semibold,
.service-wizard-step .form-label {
    color: #000;
    font-size: 1rem;
}

.service-wizard-step .form-text.text-muted {
    font-size: 0.9375rem;
}

.service-wizard-step .form-label .text-danger {
    color: #dc3545 !important;
}

.service-wizard-step .form-check-input {
    border-color: #0067B3 !important;
}

/* Service wizard footer left button (Cancel/Back): outlined, white bg, gray border */
.service-wizard-step .service-wizard-footer-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fff !important;
    border: 1px solid #dee2e6 !important;
    color: #212529 !important;
}

.service-wizard-step .service-wizard-footer-back:hover {
    background-color: #f8f9fa !important;
    border-color: #dee2e6 !important;
    color: #212529 !important;
}

[data-skin=dark] .service-wizard-step .card-body>h5.fw-bold,
[data-skin=dark] .service-wizard-step .form-label {
    color: inherit;
}

[data-skin=dark] .service-wizard-step .service-wizard-footer-back {
    background-color: #2d2d2d !important;
    border-color: #555 !important;
    color: #e9ecef !important;
}

[data-skin=dark] .service-wizard-step .service-wizard-footer-back:hover {
    background-color: #3d3d3d !important;
    border-color: #555 !important;
    color: #fff !important;
}

.service-wizard-step .service-wizard-create-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    background-color: #16A34A !important;
    border-color: #16A34A !important;
}

.service-wizard-step .service-wizard-create-btn:hover {
    background-color: #15803d !important;
    border-color: #15803d !important;
}

/* Ensure button_to form wrapper doesn't break alignment */
.service-wizard-step form[id="create_service_form"] {
    display: inline-flex;
    align-items: center;
    margin: 0;
}

/* Consistent button sizing for wizard footer */
.service-wizard-step .service-wizard-footer-back,
.service-wizard-step .service-wizard-create-btn {
    height: 38px;
    min-width: 100px;
}

/* Service wizard step 3: fixed width per Figma specs */
.service-wizard-step-3-col {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.service-wizard-step-3-card {
    width: 100%;
    max-width: 720px;
    border-radius: 17px !important;
    border-color: #E2E8F0 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

@media (max-width: 767px) {
    .service-wizard-step-3-card {
        max-width: 100%;
    }
}

/* Frequency selector wizard: card, tabs, weekly day options (desktop: row, mobile: column) */
.frequency-selector-wizard .frequency-selector-wizard-inner {
    background-color: #FAFAFA;
    border: 1px solid #e0e0e0;
}

.frequency-selector-wizard .frequency-tabs-banner {
    background-color: #F5F5F5;
    padding: 4px;
    gap: 0;
}

.frequency-selector-wizard .frequency-tabs-banner .btn-check {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.frequency-selector-wizard .frequency-tabs-banner .frequency-tab-label {
    background: transparent;
    color: #6c757d;
    border: none;
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    margin: 0;
    font-weight: 500;
}

.frequency-selector-wizard .frequency-tabs-banner .btn-check:checked+.frequency-tab-label {
    background-color: #fff;
    color: #020817;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.frequency-selector-wizard .frequency-day-option .frequency-day-check {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    margin: 0;
    display: block;
}

.frequency-selector-wizard .frequency-day-option {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
}

.frequency-selector-wizard .frequency-weekly-options--days .d-flex.flex-nowrap {
    gap: 0.25rem;
}

.frequency-selector-wizard .frequency-day-option .form-check-label {
    white-space: nowrap;
    font-size: 0.875rem;
}

@media (max-width: 767.98px) {
    .frequency-selector-wizard .frequency-weekly-options--days {
        text-align: left;
        width: 100%;
    }

    .frequency-selector-wizard .frequency-weekly-options--days .d-flex.flex-nowrap {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        width: 100%;
    }

    .frequency-selector-wizard .frequency-weekly-options--days .frequency-day-option {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        flex: 0 0 auto;
        width: 100%;
        max-width: 100%;
        gap: 0.5rem;
        flex-wrap: nowrap;
        margin: 0;
    }

    .frequency-selector-wizard .frequency-weekly-options--days .frequency-day-option .frequency-day-check {
        flex-shrink: 0;
    }

    .frequency-selector-wizard .frequency-weekly-options--days .frequency-day-option .form-check-label {
        white-space: nowrap;
        text-align: left;
        display: inline-block;
        margin-top: 0;
        flex-shrink: 0;
    }

    /* Monthly: keep "First" + weekday selects on the same row */
    .frequency-selector-wizard .frequency-monthly-options .form-check-label {
        display: inline-flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: 0.25rem;
    }

    .frequency-selector-wizard .frequency-monthly-options .form-check-label .form-select {
        flex: 1;
        min-width: 0;
        max-width: 48%;
    }

    /* Yearly: prevent selects from overflowing */
    .frequency-selector-wizard .frequency-yearly-options .d-flex {
        flex-wrap: nowrap;
    }

    .frequency-selector-wizard .frequency-yearly-options .form-select {
        flex: 1;
        min-width: 0;
        width: 0 !important;
    }
}

.js-frequency-selector .frequency-monthly-options .border-top {
    border-color: rgba(0, 0, 0, 0.1) !important;
}

[data-skin=dark] .js-frequency-selector .frequency-monthly-options .border-top {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Unsaved changes modal: close button with white bg, dark icon, grey border */
#unsavedChangesModal .unsaved-changes-modal-close {
    background-color: #fff;
    border: 1px solid #dee2e6;
    opacity: 1;
    border-radius: 0.25rem;
}

#unsavedChangesModal .unsaved-changes-modal-close:hover {
    background-color: #f8f9fa;
    border-color: #dee2e6;
    opacity: 1;
}

#unsavedChangesModal .unsaved-changes-modal-close {
    filter: grayscale(1) brightness(1.5);
}

/* Attachment preview: truncate long names, delete button fixed right (mobile + desktop) */
.upload-preview-item {
    max-width: 100%;
    min-width: 0;
    flex-wrap: nowrap;
}

.upload-preview-item .upload-preview-remove {
    flex-shrink: 0;
}

.upload-preview-item .overflow-hidden .text-truncate {
    min-width: 0;
}

[data-skin=dark] .card-body .divider {
    color: #4F4F4F !important;
}

[data-skin=light] .card-body .divider {
    color: #ecedf1 !important;
}

[data-skin=dark] .task {
    background-color: #222222;
    min-height: 60px;
    font-size: 16px;
}

[data-skin=light] .task {
    background-color: #f8f9fc;
    min-height: 60px;
    font-size: 16px;
}

[data-skin=dark] .task-btn {
    border-radius: 25px;
    width: 25px;
    height: 25px;
    border-color: #828282 !important;
    background-color: #222222;
}

[data-skin=light] .task-btn {
    border-radius: 25px;
    width: 25px;
    height: 25px;
    border-color: #828282 !important;
    background-color: #FFF;
}

[data-skin=dark] .text-black {
    color: #000000;
}

[data-skin=dark] .washup-text-black {
    color: #FFFFFF;
}

[data-skin=light] .washup-text-black {
    color: #000000;
}

[data-skin=dark] .text-white {
    color: #FFFFFF;
}

[data-skin=light] .text-white {
    color: #222222 !important;
}

/* Notifications settings dark mode */
[data-skin=dark] .p-4[style*="background-color: #f8f9fa"] {
    background-color: #374151 !important;
}

[data-skin=dark] .notification-dropdown-btn.btn-light {
    background-color: #4B5563 !important;
    border-color: #6B7280 !important;
    color: #F3F4F6 !important;
}

[data-skin=dark] .notification-dropdown-btn.btn-light svg {
    color: #F3F4F6 !important;
    stroke: #F3F4F6 !important;
}

/* Notification modals dark mode */
[data-skin=dark] #notificationEmailModal .modal-title,
[data-skin=dark] #notificationPushModal .modal-title {
    color: #F3F4F6 !important;
}

[data-skin=dark] #notificationEmailModal .modal-body p,
[data-skin=dark] #notificationPushModal .modal-body p {
    color: #D1D5DB !important;
}

[data-skin=dark] #notificationEmailModal .notification-description,
[data-skin=dark] #notificationPushModal .notification-description {
    color: #F3F4F6 !important;
}

[data-skin=dark] #notificationEmailModal .form-check-label,
[data-skin=dark] #notificationPushModal .form-check-label {
    color: #F3F4F6 !important;
}

[data-skin=dark] #notificationEmailModal .modal-footer .btn[style*="background-color: white"],
[data-skin=dark] #notificationPushModal .modal-footer .btn[style*="background-color: white"] {
    background-color: #374151 !important;
    border-color: #6B7280 !important;
    color: #F3F4F6 !important;
}

[data-skin=dark] #notificationEmailModal .input-group-text,
[data-skin=dark] #notificationPushModal .input-group-text {
    background-color: #374151 !important;
    border-color: #6B7280 !important;
    color: #D1D5DB !important;
}

[data-skin=dark] #notificationEmailModal .form-control,
[data-skin=dark] #notificationPushModal .form-control {
    background-color: #374151 !important;
    border-color: #6B7280 !important;
    color: #F3F4F6 !important;
}

[data-skin=dark] #notificationEmailModal .text-muted,
[data-skin=dark] #notificationPushModal .text-muted {
    color: #9CA3AF !important;
}

[data-skin=dark] .text-light-gray {
    color: #BDBDBD;
}

[data-skin=light] .text-light-gray {
    color: #4F4F4F;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:active {
    background-color: #0067B3 !important;
    border-color: #0067B3 !important;
}

.btn-secondary,
.btn-secondary:hover,
.btn-secondary:active {
    background-color: #4F4F4F !important;
    border-color: #4F4F4F !important;
}

.task-description p {
    padding: 0px;
    margin: 0px;
}

/* Rich-text formatting preserved from the Quill editor in task descriptions */
.task-description-rich ul {
    list-style: disc outside !important;
    padding-left: 1.5rem !important;
    margin: 0.25rem 0 !important;
}

.task-description-rich ol {
    list-style: decimal outside !important;
    padding-left: 1.5rem !important;
    margin: 0.25rem 0 !important;
}

.task-description-rich li {
    display: list-item !important;
}

.task-description-rich u {
    text-decoration: underline !important;
}

.task-description-rich strong,
.task-description-rich b {
    font-weight: 700 !important;
}

.task-description-rich em,
.task-description-rich i {
    font-style: italic !important;
}

.task-description-rich p {
    margin: 0;
}

/* Wraps inspection link + plain description so icon, link, and text share one vertical axis */
.task-description-with-inspection {
    display: inline-flex;
    gap: 0.35em;
    line-height: 1.4;
}

.task-inspection-link {
    color: #0067B3;
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    line-height: inherit;
}

.task-inspection-link .material-icons {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 18px;
    line-height: 1;
    /* Icon font sits high in the em box; nudge down to match adjacent text */
    position: relative;
    top: 0.08em;
}


.task-inspection-link:hover {
    text-decoration: underline !important;
}

.task-status {
    border-radius: 25px;
}

/* RTD "Today's Progress" — floating dropdown (outside task container, no layout shift) */
.rtd-progress-dropdown.dropdown-menu {
    padding: 0;
    border: none;
    min-width: 320px;
    margin-top: 4px;
    z-index: 1060;
}

/* Single control: hide Bootstrap's dropdown caret, use only the Material icon */
.rtd-progress-trigger.dropdown-toggle::after {
    display: none;
}

.rtd-progress-trigger .material-icons {
    transition: transform 0.2s ease;
}

.dropdown.show .rtd-progress-trigger .material-icons {
    transform: rotate(180deg);
}

.rtd-progress-label--hide.d-none {
    display: none !important;
}

.rtd-progress-popup {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

.rtd-progress-popup__header {
    padding: 12px 14px 8px;
    border-bottom: 1px solid #e5e7eb;
}

.rtd-progress-popup__title {
    font-size: 15px;
    font-weight: 400;
    color: #111827;
    line-height: 1.3;
}

.rtd-progress-popup__subtitle {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
    line-height: 1.35;
}

.rtd-progress-popup__body {
    padding: 8px 10px 10px;
}

/* RTD slot row */
.rtd-slot {
    display: flex;
    flex-direction: column;
    padding: 8px 10px;
    border-radius: 6px;
    margin-bottom: 6px;
}

.rtd-slot:last-child {
    margin-bottom: 0;
}

.rtd-slot__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-height: 24px;
}

.rtd-slot__left {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex-shrink: 0;
}

.rtd-slot__status-label {
    font-size: 13px;
    font-weight: 400;
    color: #111827;
    white-space: nowrap;
    flex-shrink: 0;
}

.rtd-slot__body {
    font-size: 12px;
    color: #6b7280;
    margin-top: 6px;
    padding-top: 6px;
    width: 100%;
    line-height: 1.35;
}

.rtd-slot--completed .rtd-slot__body {
    border-top: 1px solid #a7f3d0;
}

.rtd-slot--missed .rtd-slot__body {
    border-top: 1px solid #fecaca;
}

.rtd-slot--upcoming .rtd-slot__body {
    border-top: 1px solid #e5e7eb;
}

.rtd-slot--incomplete .rtd-slot__body {
    border-top: 1px solid #FDE68A;
}

.rtd-slot__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid currentColor;
}

.rtd-slot__icon svg,
.rtd-slot__icon svg.lucide-icon {
    display: block !important;
    width: 14px !important;
    height: 14px !important;
    stroke: currentColor !important;
    cursor: inherit;
    vertical-align: middle;
    flex-shrink: 0;
}

.rtd-slot__icon svg.lucide-icon:hover {
    transform: none;
}

.rtd-slot__icon--check {
    background: #d1fae5;
    border-color: #059669;
    color: #059669;
}

.rtd-slot__icon--x {
    background: #fee2e2;
    border-color: #dc2626;
    color: #dc2626;
}

.rtd-slot__icon--calendar {
    background: #f3f4f6;
    border-color: #6b7280;
    color: #6b7280;
}

.rtd-slot__icon--clock {
    background: #fef3c7;
    border-color: #d97706;
    color: #d97706;
}

.rtd-slot__time {
    font-size: 14px;
    font-weight: 400;
    color: #111827;
    white-space: nowrap;
}

/* Completed slot */
.rtd-slot--completed {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
}

/* Missed / Past due slot */
.rtd-slot--missed {
    background: #fef2f2;
    border: 1px solid #fecaca;
}

/* Upcoming slot */
.rtd-slot--upcoming {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
}

.rtd-slot--upcoming .rtd-slot__status-label {
    color: #6b7280;
}

/* Debt banner — "Past due since [date]" shown at top of RTD popup when aging debt exists */
.rtd-debt-banner {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    margin-bottom: 8px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 4px;
    color: #dc2626;
    font-size: 12px;
    font-weight: 500;
}

[data-skin=dark] .rtd-debt-banner {
    background: #7f1d1d;
    border-color: #b91c1c;
    color: #fca5a5;
}

/* Blocked slot — mirrors upcoming style but with ban icon */
.rtd-slot--blocked {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
}

.rtd-slot--blocked .rtd-slot__status-label {
    color: #6b7280;
}

.rtd-slot__icon--blocked {
    color: #6b7280;
    background: transparent;
    border: none;
}

[data-skin=dark] .rtd-slot--blocked {
    background: #374151;
    border-color: #4b5563;
}

/* Incomplete slot (current time window) */
.rtd-slot--incomplete {
    background: #FFFBEB;
    border: 1px solid #FDE68A;
    border-radius: 4px;
}

.rtd-slot--incomplete .rtd-slot__status-label {
    color: #FFC107;
    font-family: Geist, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
}

.rtd-slot__action .task-btn {
    margin-left: 4px;
}

/* Dark mode */
[data-skin=dark] .rtd-progress-popup {
    background: #1f2937;
    border-color: #374151;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

[data-skin=dark] .rtd-progress-popup__header {
    border-bottom-color: #374151;
}

[data-skin=dark] .rtd-progress-popup__title {
    color: #f3f4f6;
}

[data-skin=dark] .rtd-progress-popup__subtitle {
    color: #9ca3af;
}

[data-skin=dark] .rtd-slot--completed {
    background: #064e3b;
    border-color: #047857;
}

[data-skin=dark] .rtd-slot--completed .rtd-slot__body {
    border-top-color: #047857;
}

[data-skin=dark] .rtd-slot--missed {
    background: #7f1d1d;
    border-color: #b91c1c;
}

[data-skin=dark] .rtd-slot--missed .rtd-slot__body {
    border-top-color: #b91c1c;
}

[data-skin=dark] .rtd-slot--upcoming {
    background: #374151;
    border-color: #4b5563;
}

[data-skin=dark] .rtd-slot--incomplete {
    background: #78350f;
    border-color: #FDE68A;
}

[data-skin=dark] .rtd-slot--incomplete .rtd-slot__status-label {
    color: #FFC107;
}

[data-skin=dark] .rtd-slot--incomplete .rtd-slot__body {
    border-top-color: #FDE68A;
}

[data-skin=dark] .rtd-slot__time,
[data-skin=dark] .rtd-slot__status-label {
    color: #e5e7eb;
}

[data-skin=dark] .rtd-slot__body {
    color: #9ca3af;
}

@media (max-width: 576px) {
    .task-status {
        max-width: 110px;
    }

    .task .task-status {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: auto !important;
        min-width: 30px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 12px;
        padding-right: 12px;
    }

    .task .dashboard-mobile-status-pill {
        width: 6.5rem !important;
        min-width: 6.5rem !important;
        flex: 0 0 6.5rem;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 6px;
        padding-right: 6px;
    }
}

.bg-danger {
    border: 2px solid #FF3D3D !important;
    background-color: #FB9B9C !important;
}

.bg-warning {
    border: 2px solid #ffc107 !important;
    background-color: #FBF598 !important;
}

.bg-success {
    border: 2px solid #00BD13 !important;
    background-color: #7CDB87 !important;
}

.bg-success-new {
    border: 1.52px solid #00B749 !important;
    background-color: #CAF2D7 !important;
}

[data-skin=dark] .text-primary {
    color: #0067B3 !important;
}

.text-success {
    color: #00BD13 !important;
}

.ht-150 {
    height: 150px !important;
}

[data-skin=dark] .ql-snow.ql-toolbar {
    background-color: #222222;
    border-color: #4F4F4F;
}

[data-skin=dark] .ql-snow.ql-container {
    border-color: #4F4F4F;
}

[data-skin=dark] .ql-editor {
    background-color: #000000;
    color: #FFFFFF;
}

[data-skin=light] .ql-snow.ql-toolbar {
    background-color: var(--color-grey-98, rgba(249, 250, 251, 1));
    border: 1px solid var(--color-grey-90, rgba(228, 228, 231, 1));
}

/* WYSIWYG toolbar: flex layout so Attach Inspection / badge stay right-aligned. Disable Quill :after clearfix so it does not break flex. */
.wysiwyg-toolbar-with-actions,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions {
    display: flex !important;
    align-items: center;
    width: 100% !important;
    box-sizing: border-box;
    overflow: hidden;
}

.wysiwyg-toolbar-with-actions::after,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions::after {
    display: none !important;
    content: none !important;
}

.wysiwyg-toolbar-with-actions .ql-formats,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions .ql-formats {
    flex-shrink: 0;
}

.wysiwyg-toolbar-with-actions .wysiwyg-toolbar-spacer,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions .wysiwyg-toolbar-spacer {
    flex: 1;
    min-width: 0;
}

.wysiwyg-toolbar-with-actions .wysiwyg-toolbar-right,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions .wysiwyg-toolbar-right {
    flex-shrink: 1;
    min-width: 0;
}

.inspection-name-text {
    max-width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* Override Quill toolbar button width so Attach Inspection and Remove use natural width */
.wysiwyg-toolbar-with-actions .attach-inspection,
.wysiwyg-toolbar-with-actions .btn-remove-inspection,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions .attach-inspection,
.ql-snow.ql-toolbar.wysiwyg-toolbar-with-actions .btn-remove-inspection {
    width: auto !important;
    min-width: 0;
}

/* Allow task card grid column to pass width to toolbar so right-aligned group stays inside */
.task-card .d-flex.flex-column {
    min-width: 0;
}

[data-skin=light] .ql-snow.ql-container {
    border-color: var(--color-grey-90, rgba(228, 228, 231, 1));
}

[data-skin=light] .ql-editor {
    background-color: white;
    border-left: 1px solid var(--color-grey-90, rgba(228, 228, 231, 1));
    border-right: 1px solid var(--color-grey-90, rgba(228, 228, 231, 1));
    border-bottom: 1px solid var(--color-grey-90, rgba(228, 228, 231, 1));
    color: var(--color-grey-46, rgba(113, 113, 122, 1));
}

/* Quill Editor Placeholder */
.ql-editor.ql-blank::before {
    color: var(--color-grey-46, rgba(113, 113, 122, 1));
    font-style: italic;
}

.displayNone {
    display: none !important;
}

.displayFlex {
    display: flex !important;
}

[data-skin=dark] .modal-content {
    background-color: #222222;
}

[data-skin=dark] .modal-header {
    border-bottom-color: #000000;
}

[data-skin=dark] .modal-body .card {
    background-color: #141414;
    border-color: #000000;
    border-radius: 5px;
    font-style: bold;
    color: #FFF;
}

[data-skin=dark] .modal-body .card .material-icons {
    color: #FFEF2E;
}

[data-skin=light] .modal-body .card {
    background-color: #f8f9fc;
    border-color: #ecedf1;
    border-radius: 5px;
    font-style: bold;
    color: #212830;

}

[data-skin=light] .modal-body .card .material-icons {
    color: #FFEF2E;
}

[data-skin=dark] .modal-backdrop {
    background-color: #141414;
}

.modal-backdrop.show {
    opacity: .6;
}

/* iPad / iOS Safari: 100vw + position:fixed mis-measures the viewport when
   the page has any horizontal overflow, leaving the backdrop covering only
   part of the visible screen. Pinning all four edges sidesteps that and is
   identical to the working desktop behavior. */
.modal-backdrop,
.offcanvas-backdrop {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
}

[data-skin=dark] .main-backdrop {
    background-color: rgb(41 42 44 / 66%) !important;
}

[data-skin=dark] input,
[data-skin=dark] textarea,
[data-skin=dark] .form-control {
    background-color: #000 !important;
    border-color: #4F4F4F !important;
}

[data-skin=dark] .btn-outline-primary,
.btn-check+.btn:hover {
    border-color: #4F4F4F;
    color: #FFF;
}

[data-skin=light] .btn-outline-primary,
.btn-check+.btn:hover {
    border-color: #4F4F4F;
    color: #000;
}

.btn-check:checked+.btn {
    background-color: #4F4F4F;
    border-color: #4F4F4F;
}

[data-skin=dark] .select2-search__field {
    color: #FFF;
}

[data-skin=dark] .btn-white-icon,
[data-skin=dark] .btn-white-icon:hover {
    color: #FFF;
}

[data-skin=dark] .btn-icon-active,
[data-skin=dark] .btn-white-icon:hover {
    background-color: #000;
}

[data-skin=light] .btn-white-icon,
[data-skin=light] .btn-white-icon:hover {
    color: #000;
}

[data-skin=light] .btn-icon-active,
[data-skin=light] .btn-white-icon:hover {
    background-color: #dedede;
}

[data-skin=dark] .fc-rawcalendar {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .fc-rawcalendar {
    background-color: #FBFBFC !important;
    border-color: #c9c9c9 !important;
}

[data-skin=light] .fc-gray-border {
    border-color: #ecedf1 !important;
}

[data-skin=dark] .fc-gray-border {
    border-color: #4F4F4F !important;
}

[data-skin=dark] .fc-daygrid-day,
[data-skin=dark] .fc-col-header-cell,
[data-skin=dark] .fc-scrollgrid {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .fc-daygrid-day,
[data-skin=light] .fc-col-header-cell,
[data-skin=light] .fc-scrollgrid {
    background-color: white !important;
    border-color: #ecedf1 !important;
}

.fc .fc-day-other,
.fc .fc-daygrid-day-top {
    opacity: 1;
    flex-direction: row;
}

[data-skin=dark] .fc-daygrid-day-number,
[data-skin=dark] .fc-col-header-cell-cushion {
    color: #FFF !important;
}

[data-skin=light] .fc-daygrid-day-number,
[data-skin=light] .fc-col-header-cell-cushion {
    color: #000 !important;
}

[data-skin=dark] .fc-arrows {
    background-color: #222222 !important;
    border-color: #000 !important;
    color: #FFF !important;
}

[data-skin=dark] .fc-day-today {
    background-color: #000 !important;
}

[data-skin=light] .fc-day-today {
    background-color: #dedede !important;
}

.calendar-body {
    padding: 0px;
}

.calendar-body .fc-header-toolbar {
    display: block !important;
}

[data-skin=dark] .dropdown-menu {
    background-color: #000;
}

[data-skin=dark] .dropdown-item:hover,
[data-skin=dark] .dropdown-item:focus {
    background-color: #222;
}

[data-skin=dark] .circle-outline {
    width: 75px;
    height: 75px;
    border-radius: 75px;
    background-color: #333;
}

[data-skin=dark] .circle-outline i {
    margin-top: 20px;
    margin-left: 19px;
    font-size: 36px !important;
}

[data-skin=light] .circle-outline {
    width: 75px;
    height: 75px;
    border-radius: 75px;
    background-color: #f8f9fc;
}

[data-skin=light] .circle-outline i {
    margin-top: 20px;
    margin-left: 19px;
    font-size: 36px !important;
}

[data-skin=dark] .incident-search {
    display: block;
    width: 100%;
    padding: 0.406rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #FFFFFF;
    background-clip: padding-box;
    appearance: none;
    border-radius: 20px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    border: 1px solid #4F4F4F !important;
    background-color: #333333 !important;
}

[data-skin=light] .incident-search {
    display: block;
    width: 100%;
    padding: 0.406rem 0.75rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #000;
    background-clip: padding-box;
    appearance: none;
    border-radius: 20px;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    border: 1px solid #ecedf1 !important;
    background-color: #FFF !important;
}

/* Inspections */
[data-skin=dark] .inspection {
    background-color: #222222;
    font-size: 16px;
}

[data-skin=light] .inspection {
    background-color: #f8f9fc;
    font-size: 16px;
}

[data-skin=dark] .gray-2 {
    color: #4F4F4F;
}

[data-skin=dark] .gray-2:hover {
    color: #BDBDBD;
}

.inspection-status label,
.inspection-status input {
    display: block;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.inspection-status input[type="radio"] {
    display: none;
}

[data-skin=dark] .inspection-status input[type="radio"]:checked+label.red,
[data-skin=dark] .Checked+label.red {
    background-color: #FF3D3D;
    color: #000;
}

[data-skin=dark] .inspection-status input[type="radio"]:checked+label.yellow,
[data-skin=dark] .Checked+label.yellow {
    background-color: #FFEF2E;
    color: #000;
}

[data-skin=dark] .inspection-status input[type="radio"]:checked+label.green,
[data-skin=dark] .Checked+label.green {
    background-color: #00BD13;
    color: #000;
}

[data-skin=light] .inspection-status input[type="radio"]:checked+label.red,
[data-skin=light] .Checked+label.red {
    background-color: #F59595;
    color: #1f2937;
}

[data-skin=light] .inspection-status input[type="radio"]:checked+label.yellow,
[data-skin=light] .Checked+label.yellow {
    background-color: #FCE97A;
    color: #1f2937;
}

[data-skin=light] .inspection-status input[type="radio"]:checked+label.green,
[data-skin=light] .Checked+label.green {
    background-color: #7ED98E;
    color: #1f2937;
}

[data-skin=light] .inspection-status .btn-secondary {
    background-color: #FFF !important;
    border-color: #ecedf1 !important;
}

/* Selected R/Y/G: soft fill + a matching vivid 2px border (Figma pill look).
   The button background is filled with the SAME color as the label so the
   fill reaches the rounded corners cleanly — otherwise the white button
   backdrop shows through where the label's radius nests inside the border. */
[data-skin=light] .inspection-status .btn-secondary:has(input:checked+label.red),
[data-skin=light] .inspection-status .btn-secondary:has(.Checked+label.red) {
    border: 2px solid #FF3D3D !important;
    background-color: #F59595 !important;
}

[data-skin=light] .inspection-status .btn-secondary:has(input:checked+label.yellow),
[data-skin=light] .inspection-status .btn-secondary:has(.Checked+label.yellow) {
    border: 2px solid #FFC400 !important;
    background-color: #FCE97A !important;
}

[data-skin=light] .inspection-status .btn-secondary:has(input:checked+label.green),
[data-skin=light] .inspection-status .btn-secondary:has(.Checked+label.green) {
    border: 2px solid #25C63F !important;
    background-color: #7ED98E !important;
}

/* Dark mode: same fix — fill the button backdrop with the label color so the
   selected pill has no corner gap. */
[data-skin=dark] .inspection-status .btn-secondary:has(input:checked+label.red),
[data-skin=dark] .inspection-status .btn-secondary:has(.Checked+label.red) {
    background-color: #FF3D3D !important;
    border-color: #FF3D3D !important;
}

[data-skin=dark] .inspection-status .btn-secondary:has(input:checked+label.yellow),
[data-skin=dark] .inspection-status .btn-secondary:has(.Checked+label.yellow) {
    background-color: #FFEF2E !important;
    border-color: #FFEF2E !important;
}

[data-skin=dark] .inspection-status .btn-secondary:has(input:checked+label.green),
[data-skin=dark] .inspection-status .btn-secondary:has(.Checked+label.green) {
    background-color: #00BD13 !important;
    border-color: #00BD13 !important;
}


.inspection-status label {
    cursor: pointer;
    z-index: 90;
}

/* Time Picker */
[data-skin=dark] .ui-timepicker-standard {
    background-color: #000 !important;
    color: #FFF !important;
}

[data-skin=dark] .ui-timepicker-standard a {
    color: #FFF;
}

[data-skin=light] .ui-timepicker-standard a {
    color: #41505f;
}


ul.sortable {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

[data-skin=dark] .ui-state-hover {
    background-color: #0067B3 !important;
    color: #FFF !important;
    border: none !important;
}

[data-skin=dark] .ui-row-highlight {
    height: 60px !important;
    background-color: #4F4F4F !important;
    border: 1px solid #4F4F4F !important;
    visibility: visible !important;
    margin: .5rem 1rem !important;
    border-radius: 4px;
}

[data-skin=dark] .ui-tab-highlight {
    height: 40px;
    width: 60px;
    background-color: #4F4F4F !important;
    border: 1px solid #4F4F4F !important;
    visibility: visible !important;
    margin: 1rem 1.5rem !important;
}

.pagination {
    margin: 1rem;
    float: right;
}

.pagination span {
    padding: 0px 5px;
}

[data-skin=dark] .pagination em {
    padding: 0px 5px;
    color: #FFF;
}

[data-skin=light] .pagination em {
    padding: 0px 5px;
    color: #000;
}

[data-skin=dark] .pagination a {
    padding: 0px 5px;
    color: #BDBDBD;
}

[data-skin=light] .pagination a {
    padding: 0px 5px;
    color: #BDBDBD;
}

[data-skin=dark] .offcanvas {
    background-color: #222 !important;
}

[data-skin=dark] .resolve-button:hover {
    color: #00BD13 !important;
}

.toggle-more {
    cursor: pointer;
}

.bold {
    font-weight: bold;
}

[data-skin=dark] .dropdown-notification .dropdown-menu {
    border: 1px solid #4F4F4F !important;
}

[data-skin=dark] .dropdown-notification .dropdown-menu-header {
    border-color: #4F4F4F !important;
}

[data-skin=light] .dropdown-notification .dropdown-menu {
    border: 1px solid #ecedf1 !important;
}

[data-skin=light] .dropdown-notification .dropdown-menu-header {
    border-color: #ecedf1 !important;
}

[data-skin=dark] .dropdown-notification .list-group-item:hover,
[data-skin=dark] .dropdown-notification .list-group-item:focus {
    background-color: #222;
}

ul.notifications a:hover {
    color: inherit;
}

.realtime-inspection-note:hover {
    color: inherit;
}

@media (min-width: 576px) {

    .mx-3-sm {
        margin-left: 1rem !important;
        margin-right: 1rem !important;
    }

    .d-sm-contents {
        display: contents !important;
    }
}

[data-skin=dark] .offcanvas-header {
    border-bottom: 1px solid #4F4F4F;
}

[data-skin=light] .offcanvas-header {
    border-bottom: 1px solid #ecedf1;
}

[data-skin=dark] .icon-color {
    color: #FFEF2E !important;
}

[data-skin=light] .icon-color {
    color: #0067B3 !important;
}

[data-skin=light] .nav-link.active .material-icons.icon-color {
    color: #FFF !important;
}

.flash {
    position: relative;
}

.flash-close {
    background: 0;
    border: 0;
    box-shadow: none;
    color: inherit;
    display: inline-block;
    margin: 0 0 0 1rem;
    padding: 0;
    transform: translateY(-2px);
    position: absolute;
    right: 10px;
    top: 5px;
}

.flash-close:hover {
    box-shadow: none;
    background-color: #6f42c1;
}

.flash-close .close-icon {
    display: block;
    width: 2rem;
    height: 2rem;
    background: url(/assets/close-a3e36ab00c69ea610056ff375891785e778053b1d04673d50aff699e62c1f3cb.svg) no-repeat 50% 50%;
}

.flash-close:hover .close-icon {
    background: url(/assets/close-white-0e8af4433a441550d6aa927a589535075c52f379d3db81660be1cb793a9852bd.svg) no-repeat 50% 50%;
}

.ui-datepicker {
    z-index: 1100 !important;
}

/* PIN Authentication User Card */
[data-skin=light] .user-info-card {
    background-color: #f8f9fc !important;
    border-color: #ecedf1 !important;
}

[data-skin=dark] .user-info-card {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-name-text {
    color: #000000 !important;
}

[data-skin=dark] .user-name-text {
    color: #FFFFFF !important;
}

[data-skin=light] .user-avatar-placeholder {
    background-color: #6c757d !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .user-avatar-placeholder {
    background-color: #6c757d !important;
    color: #FFFFFF !important;
}

/* Schedule Filter/Sort/Actions Menu Dark Theme Support */
[data-skin=light] .schedule-filter-input {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

[data-skin=dark] .schedule-filter-input {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=light] .schedule-button {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

[data-skin=light] .schedule-button:hover {
    background-color: #f9fafb !important;
}

[data-skin=dark] .schedule-button {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .schedule-button:hover {
    background-color: #000000 !important;
}

[data-skin=light] .schedule-dropdown {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
}

[data-skin=dark] .schedule-dropdown {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .schedule-dropdown-item {
    color: #374151 !important;
}

[data-skin=light] .schedule-dropdown-item:hover {
    background-color: #f9fafb !important;
}

[data-skin=dark] .schedule-dropdown-item {
    color: #FFFFFF !important;
}

[data-skin=dark] .schedule-dropdown-item:hover {
    background-color: #222222 !important;
}

[data-skin=light] .schedule-calendar-container {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
    color: #111827 !important;
}

[data-skin=dark] .schedule-calendar-container {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=light] .schedule-nav-text {
    color: #374151 !important;
}

[data-skin=dark] .schedule-nav-text {
    color: #FFFFFF !important;
}

[data-skin=light] .schedule-nav-button:hover {
    background-color: #f3f4f6 !important;
}

[data-skin=dark] .schedule-nav-button:hover {
    background-color: #000000 !important;
}

/* Week Start Day Modal Dark Theme Support */
[data-skin=light] .week-start-modal-container {
    background-color: #ffffff !important;
}

[data-skin=dark] .week-start-modal-container {
    background-color: #222222 !important;
}

[data-skin=light] .week-start-modal-title {
    color: #111827 !important;
}

[data-skin=dark] .week-start-modal-title {
    color: #FFFFFF !important;
}

[data-skin=light] .week-start-modal-text {
    color: #71717A !important;
}

[data-skin=dark] .week-start-modal-text {
    color: #BDBDBD !important;
}

[data-skin=light] .week-start-warning-box {
    background-color: #fffbeb !important;
    border-color: #fff3c8 !important;
}

[data-skin=dark] .week-start-warning-box {
    background-color: #2d2d2d !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .week-start-warning-title {
    color: #b45309 !important;
}

[data-skin=dark] .week-start-warning-title {
    color: #fcd34d !important;
}

[data-skin=light] .week-start-warning-text {
    color: #92400e !important;
}

[data-skin=dark] .week-start-warning-text {
    color: #fde68a !important;
}

[data-skin=light] .week-start-cancel-btn {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

[data-skin=light] .week-start-cancel-btn:hover {
    background-color: #f9fafb !important;
}

[data-skin=dark] .week-start-cancel-btn {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .week-start-cancel-btn:hover {
    background-color: #1a1a1a !important;
}

[data-skin=light] .week-start-day-close-btn {
    color: #6b7280 !important;
}

[data-skin=light] .week-start-day-close-btn:hover {
    background-color: #f3f4f6 !important;
    color: #374151 !important;
}

[data-skin=dark] .week-start-day-close-btn {
    color: #9ca3af !important;
}

[data-skin=dark] .week-start-day-close-btn:hover {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

/* User Reorder Modal Dark Theme Support */
[data-skin=light] .user-reorder-modal {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

[data-skin=dark] .user-reorder-modal {
    background-color: rgba(0, 0, 0, 0.7) !important;
}

[data-skin=light] .user-reorder-modal-container {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-modal-container {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-title {
    color: #111827 !important;
}

[data-skin=dark] .user-reorder-title {
    color: #FFFFFF !important;
}

[data-skin=light] .user-reorder-text {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-text {
    color: #BDBDBD !important;
}

[data-skin=light] .user-reorder-border {
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-border {
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-close-btn {
    color: #6b7280 !important;
}

[data-skin=light] .user-reorder-close-btn:hover {
    background-color: #f3f4f6 !important;
    color: #374151 !important;
}

[data-skin=dark] .user-reorder-close-btn {
    color: #9ca3af !important;
}

[data-skin=dark] .user-reorder-close-btn:hover {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

[data-skin=light] .user-reorder-tip-box {
    background-color: #eff6ff !important;
    border-color: #dbeafe !important;
}

[data-skin=dark] .user-reorder-tip-box {
    background-color: #1e293b !important;
    border-color: #475569 !important;
}

[data-skin=light] .user-reorder-tip-text {
    color: #1e40af !important;
}

[data-skin=dark] .user-reorder-tip-text {
    color: #60a5fa !important;
}

[data-skin=light] .user-reorder-list-container {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-list-container {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-row {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=light] .user-reorder-row:hover {
    background-color: #f9fafb !important;
}

[data-skin=dark] .user-reorder-row {
    background-color: #1a1a1a !important;
    border-color: #374151 !important;
}

[data-skin=dark] .user-reorder-row:hover {
    background-color: #222222 !important;
}

[data-skin=light] .user-reorder-drag-handle {
    color: #9ca3af !important;
}

[data-skin=light] .user-reorder-drag-handle:hover {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-drag-handle {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-drag-handle:hover {
    color: #9ca3af !important;
}

[data-skin=light] .user-reorder-avatar-placeholder {
    background-color: #6b7280 !important;
    color: #ffffff !important;
}

[data-skin=dark] .user-reorder-avatar-placeholder {
    background-color: #6b7280 !important;
    color: #ffffff !important;
}

[data-skin=light] .user-reorder-user-name {
    color: #111827 !important;
}

[data-skin=dark] .user-reorder-user-name {
    color: #FFFFFF !important;
}

[data-skin=light] .user-reorder-user-role {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-user-role {
    color: #9ca3af !important;
}

/* Sign Out Modal Dark Theme Support */
[data-skin=light] .sign-out-modal-content {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .sign-out-modal-content {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .sign-out-modal-header {
    border-color: #e5e7eb !important;
}

[data-skin=dark] .sign-out-modal-header {
    border-color: #4F4F4F !important;
}

[data-skin=light] .sign-out-modal-title {
    color: #111827 !important;
}

[data-skin=dark] .sign-out-modal-title {
    color: #FFFFFF !important;
}

[data-skin=light] .sign-out-modal-close {
    background-color: transparent !important;
    color: #6b7280 !important;
    border: none !important;
    filter: none !important;
}

[data-skin=dark] .sign-out-modal-close {
    background-color: transparent !important;
    color: #9ca3af !important;
    border: none !important;
    filter: invert(1) grayscale(100%) brightness(200%) !important;
}

[data-skin=light] .sign-out-modal-body {
    background-color: #ffffff !important;
}

[data-skin=dark] .sign-out-modal-body {
    background-color: #222222 !important;
}

[data-skin=light] .sign-out-modal-text {
    color: #6b7280 !important;
}

[data-skin=dark] .sign-out-modal-text {
    color: #BDBDBD !important;
}

[data-skin=light] .sign-out-modal-footer {
    border-color: #e5e7eb !important;
    background-color: #ffffff !important;
}

[data-skin=dark] .sign-out-modal-footer {
    border-color: #4F4F4F !important;
    background-color: #222222 !important;
}

[data-skin=light] .sign-out-cancel-btn {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

[data-skin=light] .sign-out-cancel-btn:hover {
    background-color: #f9fafb !important;
    border-color: #9ca3af !important;
}

[data-skin=dark] .sign-out-cancel-btn {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .sign-out-cancel-btn:hover {
    background-color: #1a1a1a !important;
    border-color: #6b7280 !important;
}

/* Force blue color for sign out submit button in both themes */
[data-skin=light] #signOutModal .btn-primary,
[data-skin=light] #signOutModal .btn-primary:hover,
[data-skin=light] #signOutModal .btn-primary:active,
[data-skin=light] #signOutModal .btn-primary:focus {
    background-color: #0067B3 !important;
    border-color: #0067B3 !important;
    color: #ffffff !important;
}

[data-skin=dark] #signOutModal .btn-primary,
[data-skin=dark] #signOutModal .btn-primary:hover,
[data-skin=dark] #signOutModal .btn-primary:active,
[data-skin=dark] #signOutModal .btn-primary:focus {
    background-color: #0067B3 !important;
    border-color: #0067B3 !important;
    color: #ffffff !important;
}

[data-skin=light] .week-start-warning-title {
    color: #92400E !important;
}

[data-skin=dark] .week-start-warning-title {
    color: #FFEF2E !important;
}

[data-skin=light] .week-start-warning-text {
    color: #92400E !important;
}

[data-skin=dark] .week-start-warning-text {
    color: #FFEF2E !important;
}

[data-skin=light] .week-start-cancel-btn {
    background-color: #ffffff !important;
    border-color: #d1d5db !important;
    color: #374151 !important;
}

[data-skin=light] .week-start-cancel-btn:hover {
    background-color: #f9fafb !important;
}

[data-skin=dark] .week-start-cancel-btn {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
    color: #FFFFFF !important;
}

[data-skin=dark] .week-start-cancel-btn:hover {
    background-color: #222222 !important;
}

/* User Reorder Modal Dark Theme Support */
[data-skin=light] .user-reorder-modal-container {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-modal-container {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-title {
    color: #111827 !important;
}

[data-skin=dark] .user-reorder-title {
    color: #FFFFFF !important;
}

[data-skin=light] .user-reorder-close-btn {
    color: #6b7280 !important;
}

[data-skin=light] .user-reorder-close-btn:hover {
    color: #374151 !important;
}

[data-skin=dark] .user-reorder-close-btn {
    color: #BDBDBD !important;
}

[data-skin=dark] .user-reorder-close-btn:hover {
    color: #FFFFFF !important;
}

[data-skin=light] .user-reorder-text {
    color: #4b5563 !important;
}

[data-skin=dark] .user-reorder-text {
    color: #BDBDBD !important;
}

[data-skin=light] .user-reorder-tip-box {
    background-color: #eff6ff !important;
}

[data-skin=dark] .user-reorder-tip-box {
    background-color: #2d2d2d !important;
}

[data-skin=light] .user-reorder-tip-text {
    color: #374151 !important;
}

[data-skin=dark] .user-reorder-tip-text {
    color: #BDBDBD !important;
}

[data-skin=light] .user-reorder-list-container {
    background-color: #f9fafb !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-list-container {
    background-color: #000000 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-item {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-item {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=light] .user-reorder-drag-handle {
    color: #9ca3af !important;
}

[data-skin=light] .user-reorder-drag-handle:hover {
    color: #4b5563 !important;
}

[data-skin=dark] .user-reorder-drag-handle {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-drag-handle:hover {
    color: #BDBDBD !important;
}

[data-skin=light] .user-reorder-avatar-placeholder {
    background-color: #e5e7eb !important;
    color: #4b5563 !important;
}

[data-skin=dark] .user-reorder-avatar-placeholder {
    background-color: #4F4F4F !important;
    color: #BDBDBD !important;
}

[data-skin=light] .user-reorder-user-name {
    color: #111827 !important;
}

[data-skin=dark] .user-reorder-user-name {
    color: #FFFFFF !important;
}

[data-skin=light] .user-reorder-user-role {
    color: #6b7280 !important;
}

[data-skin=dark] .user-reorder-user-role {
    color: #9ca3af !important;
}

[data-skin=light] .user-reorder-border {
    border-color: #e5e7eb !important;
}

[data-skin=dark] .user-reorder-border {
    border-color: #4F4F4F !important;
}

fieldset:disabled input.form-control,
select.form-select:disabled {
    background-color: transparent;
    color: inherit;
    border: none;
    cursor: default;
    box-shadow: none;
    background: none;
    pointer-events: none;
}

fieldset:disabled .select2-container .select2-selection {
    border: none;
    background: transparent;
}

fieldset:disabled .select2-container .select2-selection__arrow {
    display: none;
}

fieldset:disabled .select2-container .select2-selection__clear {
    display: none;
}

#frequency-edit:not(:disabled) {
    &:hover {
        cursor: pointer;
    }
}

.fc-daygrid-day-frame.fc-scrollgrid-sync-inner {
    display: flex;
    flex-direction: column;

    /* allow this div to take up the remaining space so the sortable dropzone is larger */
    .fc-daygrid-day-events {
        flex-grow: 1;
    }
}

.form-switch .form-check-input {
    margin-left: -1.5em;
}

.flash-close {
    color: black;
}

[data-skin=light] .form-check-input:checked {
    background-color: #0067B3 !important;
    border-color: #0067B3 !important;
}

[data-skin=dark] .form-check-input:checked {
    background-color: #0067B3 !important;
    border-color: #0067B3 !important;
}

[data-skin=dark] .form-switch .form-check-input {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e")
}

.schedule-submenu {
    transition: all 0.3s ease;
}

[data-skin=dark] .schedule-submenu {
    background-color: #141414;
}

[data-skin=light] .schedule-submenu {
    background-color: #f8f9fc;
}

.schedule-submenu .nav-link {
    padding-left: 3rem;
}

[data-skin=light] .text-white {
    color: #FFF !important;
}

[data-skin=light] .datepicker.datepicker-dropdown,
[data-skin=dark] .datepicker.datepicker-dropdown {
    z-index: 10000;
    position: fixed;
}

[data-skin=light] .time-off-time-input::-webkit-calendar-picker-indicator,
[data-skin=dark] .time-off-time-input::-webkit-calendar-picker-indicator {
    opacity: 0;
}


[data-skin=light] .period-btn {
    background: none;
    border: none;
    transition: background-color 0.2s;
}

[data-skin=light] .period-btn.active {
    background-color: #f8f9fa;
    color: #0275d8;
}

[data-skin=dark] .period-btn.active {
    color: #0275d8;
    border-color: #4F4F4F !important;
}

[data-skin=dark] .period-selector {
    border-color: #4F4F4F !important;
}

[data-skin=dark] .time-controls .time-value {
    font-weight: 600;
    border-color: #4F4F4F !important;
}


.time-picker-dropdown {
    width: 300px;
    padding: 16px;
}


.time-picker-dropdown.hidden {
    display: none;
}


[data-skin=light] .time-off-detail {
    background: #f8f9fc;
}

[data-skin=light] .time-off-detail .reason .padded {
    border-top: 1px solid #ccc;
}

[data-skin=dark] .time-off-detail {
    background-color: #222222 !important;
    border-color: #4F4F4F !important;
}

[data-skin=dark] .time-off-detail .reason .padded {
    border-top: 1px solid #4F4F4F;
}

/* datepicker */
[data-skin=dark] .datepicker-picker {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
        0 4px 6px -4px rgba(0, 0, 0, 0.1);
    border: 1px solid #4F4F4F !important;
    background-color: #222222 !important;
}

[data-skin=dark] .datepicker-picker .datepicker-cell {
    color: white !important;
}

[data-skin=dark] .datepicker-picker .datepicker-cell:hover {
    color: black !important;
}

[data-skin=dark] .datepicker-picker .datepicker-controls button,
[data-skin=dark] .datepicker-picker .datepicker-controls svg {
    background-color: #222222 !important;
    color: white;
}

.add-circle-fade {
    opacity: 0;
    transition: opacity 0.2s;
}

.flex.items-center.justify-center:hover .add-circle-fade {
    opacity: 1;
}


.sortable-events .dragging {
    display: none;
}

.schedule-pagination>* {
    border-right: 1px solid #D5D7DA;
}

[data-skin=dark] .schedule-pagination svg path,
[data-skin=dark] .schedule-pagination a:hover {
    color: white;
    stroke: white;
}

[data-skin=dark] .schedule-pagination .active-page,
[data-skin=light] .schedule-pagination a:hover {
    color: black;
}

.schedule-pagination .active-pagination {
    background-color: #EFF6FF;
    color: #0067B3 !important;
}

[data-skin=dark] .last-month-dates {
    background-color: #222211 !important;
}

[data-skin=light] .last-month-dates {
    background-color: #F9FAFB !important;
}

table thead th.sticky-cell,
table tbody td.sticky-cell {
    position: -webkit-sticky;
    /* Safari */
    position: -moz-sticky;
    /* Firefox */
    position: -ms-sticky;
    /* IE/Edge */
    position: -o-sticky;
    /* Opera */
    position: sticky;

    left: 0;
    z-index: 30;
    background: #FBFBFC;
}

.schedule-active-link {
    color: #009AFE !important;
}

[data-skin=light] .fc-bg-dark-gray {
    background: #F8F9FC !important;
}

[data-skin=dark] .fc-bg-dark-gray {
    background-color: #222222 !important;
}

[data-skin=dark] .availability-mobile-border-top {
    border-top: 1px solid #4F4F4F !important;
}

@media(max-width: 1900px) {
    .scrollable-table {
        width: 1550px !important;
    }
}

[data-skin=dark] .datepicker-picker .datepicker-cell.disabled,
[data-skin=light] .datepicker-picker .datepicker-cell.disabled {
    color: #8F929C !important;
}

[data-skin=light] .bg-table-header {
    background-color: #f9fafb !important;
}

[data-skin=dark] .bg-table-header {
    background-color: #222222 !important;
    color: white !important;
}

[data-skin=light] .btn-user-details {
    background-color: white !important;
    color: black !important;
    border: 1px solid #D5D7DA !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 1rem !important;
}

#user_role {
    height: 38px;
    border-radius: 0.3rem;
    border-color: #D5D7DA;
    padding: 0.5rem;
}

.owner-container {
    position: relative;
}

.owner-badge {
    position: absolute;
    right: 10px;
    top: 4px;
    padding: 0.225rem 0.4rem;
    font-size: 0.77rem;
    color: #92400e !important;
}

.owner-badge-transfer {
    padding: 0.225rem 0.4rem;
    font-size: 0.77rem;
    color: #92400e !important;
}

[data-skin=ligth] .alert-owner {
    color: #92400e !important;
}

[data-skin=ligth] .alert-owner {
    color: white !important;
}

.badge-pill-super-admin {
    background-color: #EFF6FF !important;
    color: #2563EB !important;
    border-radius: 0.8rem !important;
    padding: 0.25rem 0.5rem !important;
    font-size: 0.77rem !important;
    width: fit-content !important;
    font-weight: bolder !important;
}

.transfer-button {
    background-color: #F9F9F9;
}

.yellow-custom-badge {
    background-color: #FEF3C7;
    display: inline-block;
    color: #92400E;
    font-size: 11px;
    gap: 6px;
    padding: 1.5px 8px;
    border: 1px solid #FDE68A;
}

.text-yellow-badge {
    font-weight: 550;
}

.left-menu-width {
    max-width: 280px;
    min-width: 180px;
}

@media (max-width: 768px) {
    .left-menu-width {
        max-width: 100%;
        min-width: 100%;
    }

    .rearrange-modal-header {
        background: var(--color-grey-98, rgba(249, 250, 251, 1));
        border-bottom: 1px solid #e0e0e0;
    }

    .rearrange-modal-footer {
        background: var(--color-grey-98, rgba(249, 250, 251, 1));
    }

    #rearrange-lists-modal .modal-body h6 {
        font-weight: 600;
    }

    #rearrange-lists-modal .sortable-item h6 {
        font-weight: 500;
    }

    .task-library-description {
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
    }
}


.avatar-fallback {
    background-color: #F3F4F6;
    height: 94px;
    width: 94px;
    border: 1px solid #E5E7EB;
    font-weight: 600;
    font-size: 25px;
    color: #9CA3AF;
}

.fixed-owner-badge {
    position: absolute;
    right: 10px;
    top: 4px;
}

[data-skin=light] .alert-yellow-custom {
    background-color: #FFFBEB;
    display: inline-block;
    color: #B45309;
    font-size: 11px;
    gap: 6px;
    padding: 10px 15px;
    border: 0.88px solid #FDE68A;
}

[data-skin=dark] .alert-yellow-custom {
    background-color: #222222;
    display: inline-block;
    color: white;
    font-size: 11px;
    gap: 6px;
    padding: 10px 15px;
    border: 0.88px solid #6e7985;
}

[data-skin=light] .border-gray {
    border: 1px solid #E5E7EB;
    background-color: #F9FAFB;
}

[data-skin=dark] .border-gray {
    border: 1px solid #6e7985;
    background-color: #192030;
}

label.required::after {
    content: " *";
    color: #dc3545;
}

.btn-location-sign {
    color: #000 !important;

    &:hover {
        text-decoration: none !important;
    }
}

[data-skin=light] .form-background {
    background-color: #F9FAFB;
    border-radius: 4px;
    border: 0.84px solid #F3F4F6
}

[data-skin=dark] .form-background {
    background-color: #222222;
    border-radius: 4px;
    border: 0.84px solid #4F4F4F;
}

/* Fix Tailwind preflight setting svg to display:block inside Bootstrap dropdowns and text-center containers */
.dropdown-item svg {
    display: inline;
}

.upload-area svg {
    margin: 0 auto;
}

/* Duplicate Task List Modal */
.dropdown-menu .form-check {
    margin-bottom: 0;
}

.dropdown-menu .form-check:hover {
    background-color: #f8f9fa;
}


/* Task Formatting Toolbar */
.quill-format-btn {
    transition: all 0.2s ease;
    min-width: 32px;
    height: 32px;
}

.quill-format-btn:hover {
    background-color: #f8f9fa !important;
    border-color: #adb5bd !important;
    transform: translateY(-1px);
}

.quill-format-btn.btn-primary {
    background-color: #e3f2fd !important;
    border-color: #0d6efd !important;
    color: #0d6efd !important;
    font-weight: 600;
}

.quill-format-btn.btn-primary:hover {
    background-color: #bbdefb !important;
    border-color: #0b5ed7 !important;
}

/* Contenteditable Task Input */
[contenteditable="true"]:empty:before {
    content: attr(placeholder);
    color: #9ca3af;
    font-style: italic;
}

[contenteditable="true"]:focus {
    outline: none;
    border-color: #0d6efd !important;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.1) !important;
}

/* Attach Inspection Button */
.btn-outline-primary.quill-format-btn {
    border-color: #e0e0e0;
    color: #0d6efd;
    background-color: white;
}

.btn-outline-primary.quill-format-btn:hover {
    background-color: #f8f9fa;
    border-color: #0d6efd;
}

/* Frequency Selector Styling */
.frequency-selector {
    background: white;
    border-radius: 6px;
}

/* More specific selector to override any Bootstrap or other CSS */
.frequency-selector,
.frequency-selector[style] {
    background: white !important;
}

/* Force white background with maximum specificity */
.frequency-selector,
.frequency-selector[style],
div.frequency-selector,
div.frequency-selector[style] {
    background-color: white !important;
    background: white !important;
}

/* Override any Bootstrap or other grey backgrounds */
.frequency-selector,
.frequency-selector[style],
div.frequency-selector,
div.frequency-selector[style],
.frequency-selector.bg-light,
.frequency-selector.bg-secondary,
.frequency-selector.bg-light-subtle {
    background-color: white !important;
    background: white !important;
    background-image: none !important;
}

/* Ultimate override for any background */
.frequency-selector,
.frequency-selector[style],
div.frequency-selector,
div.frequency-selector[style],
.frequency-selector.bg-light,
.frequency-selector.bg-secondary,
.frequency-selector.bg-light-subtle,
.frequency-selector[class*="bg-"] {
    background-color: white !important;
    background: white !important;
    background-image: none !important;
    background: white !important;
}

/* Advanced Options Section Styling */
.advanced-options-section .separator {
    background-color: #e0e0e0 !important;
    height: 1px;
    width: 100%;
    margin: 0 0 16px 0;
}

.advanced-options-title span {
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0%;
    vertical-align: middle;
}

.advanced-options-toggle {
    font-weight: 400 !important;
    font-style: normal !important;
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: 0% !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.advanced-options-toggle .toggle-text {
    color: black !important;
}

.advanced-options-toggle {
    display: flex !important;
    align-items: center !important;
}

.advanced-options-toggle .material-icons {
    display: flex !important;
    align-items: center !important;
    line-height: 1 !important;
}

.advanced-settings-count {
    color: #666 !important;
    font-size: 12px !important;
    margin-left: 4px !important;
    display: inline-block !important;
}

/* Advanced Settings Icons - All Black */
.advanced-options-section .material-icons {
    color: black !important;
}

/* Custom Toggle Switch Styling */
.custom-toggle-switch {
    position: relative;
    display: inline-block;
}

.toggle-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 36px;
    height: 20px;
    cursor: pointer;
}

.toggle-track {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #e0e0e0;
    border-radius: 10px;
    transition: background-color 0.2s ease;
}

.toggle-handle {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    background-color: white;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease;
}

.toggle-input:checked+.toggle-switch .toggle-track {
    background-color: #0067B3;
}

.toggle-input:checked+.toggle-switch .toggle-handle {
    transform: translateX(16px);
}

.toggle-input:focus+.toggle-switch .toggle-track {
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

.frequency-option {
    position: relative;
}

.frequency-radio {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.frequency-label {
    display: block;
    padding: 8px 16px;
    margin: 0;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    transition: all 0.2s ease;
    min-width: 80px;
    text-align: center;
    background-color: white;
    border: 1px solid #e0e0e0;
}

.frequency-radio:checked+.frequency-label {
    background-color: rgba(239, 246, 255, 1) !important;
    color: var(--color-azure-35, rgba(0, 103, 179, 1)) !important;
    font-weight: 600 !important;
    border-color: var(--color-azure-35, rgba(0, 103, 179, 1)) !important;
}

/* More specific selectors to ensure the styles apply */
.frequency-option .frequency-radio:checked+.frequency-label,
.frequency-selector .frequency-radio:checked+.frequency-label {
    background-color: rgba(239, 246, 255, 1) !important;
    color: rgba(0, 103, 179, 1) !important;
    font-weight: 600 !important;
    border-color: rgba(0, 103, 179, 1) !important;
}

.frequency-label:hover {
    background-color: #f8f9fa;
}


/* Task History Timeline Styles - Matching the provided image */
.timeline-container {
    position: relative;
    padding-left: 40px;
    padding-top: 10px;
}

.timeline-item {
    position: relative;
    padding-bottom: 24px;
    margin-bottom: 16px;
}

.timeline-item:not(:last-child)::before {
    content: '';
    position: absolute;
    left: -32px;
    top: 32px;
    bottom: -16px;
    width: 2px;
    background-color: #e5e7eb;
}

[data-skin=dark] .timeline-item:not(:last-child)::before {
    background-color: #4F4F4F;
}

.timeline-icon {
    position: absolute;
    left: -40px;
    top: 4px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    z-index: 10;
    border: 2px solid white;
}

[data-skin=dark] .timeline-icon {
    border-color: #222222;
}

.timeline-icon.completed {
    background-color: #16a34a;
    color: white;
}

.timeline-icon.assigned {
    background-color: #2563eb;
    color: white;
}

.timeline-icon.created {
    background-color: #2563eb;
    color: white;
}

.timeline-icon.updated {
    background-color: #ea580c;
    color: white;
}

.timeline-icon.status-change {
    background-color: rgba(241, 245, 249, 1);
    color: white;
    border: none;
}

.timeline-icon.due-date-changed {
    background-color: #7c3aed;
    color: white;
}

.timeline-icon.missed {
    background-color: #dc2626;
    color: white;
}

.timeline-content {
    background-color: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

[data-skin=dark] .timeline-content {
    background-color: #222222;
    border-color: #4F4F4F;
    color: #FFFFFF;
    box-shadow: 0 1px 3px rgba(255, 255, 255, 0.1);
}

.timeline-title {
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 6px;
    color: #111827;
    line-height: 1.2;
}

[data-skin=dark] .timeline-title {
    color: #FFFFFF;
}

.timeline-user-info {
    margin-bottom: 4px;
}

.user-name {
    color: #6b7280;
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 0;
}

[data-skin=dark] .user-name {
    color: #9ca3af;
}

.timeline-date {
    color: #9ca3af;
    font-size: 12px;
    margin-bottom: 6px;
    font-weight: 400;
}

[data-skin=dark] .timeline-date {
    color: #6b7280;
}

.task-title-display {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 8px;
}

[data-skin=dark] .task-title-display {
    color: #FFFFFF;
}

.history-subtitle {
    color: #6b7280;
    font-size: 14px;
    margin-bottom: 20px;
}

[data-skin=dark] .history-subtitle {
    color: #9ca3af;
}

/* User Avatar Styles in Timeline */
.timeline-user-info {
    align-items: center;
    margin-bottom: 4px;
}

.user-avatar i {
    font-size: 20px;
    color: #6b7280;
}

[data-skin=dark] .user-avatar i {
    color: #9ca3af;
}

/* Timeline Changes Details */
.timeline-changes {
    padding: 8px 12px;
    background-color: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #e5e7eb;
    margin-top: 8px;
}

[data-skin=dark] .timeline-changes {
    background-color: #1a1a1a;
    border-left-color: #4F4F4F;
}

.change-detail {
    margin-bottom: 4px;
}

.change-detail:last-child {
    margin-bottom: 0;
}

.old-value {
    text-decoration: line-through;
    color: #ef4444;
}

.new-value {
    color: #10b981;
    font-weight: 500;
}

/* New timeline icon colors */
.timeline-icon.due-date-changed {
    background-color: #f59e0b;
    color: white;
}

.timeline-icon.missed {
    background-color: #ef4444;
    color: white;
}

.timeline-icon.note-added {
    background-color: #06b6d4;
    color: white;
}

.timeline-icon.photo-added {
    background-color: #8b5cf6;
    color: white;
}

/* Completion Notes and Photos Styling */
.completion-note,
.completion-photos {
    margin-top: 12px;
    padding: 12px;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #10b981;
}

[data-skin=dark] .completion-note,
[data-skin=dark] .completion-photos {
    background-color: #1a1a1a;
    border-left-color: #10b981;
}

.completion-note .note-text {
    color: #374151;
    font-size: 14px;
    line-height: 1.5;
}

[data-skin=dark] .completion-note .note-text {
    color: #d1d5db;
}

.completion-photos .photos-content p {
    color: #374151;
    font-size: 14px;
    margin-bottom: 8px;
}

[data-skin=dark] .completion-photos .photos-content p {
    color: #d1d5db;
}

/* Timeline Changes Styling */
.timeline-changes {
    padding: 12px;
    background-color: #f8f9fa;
    border-radius: 8px;
    border-left: 3px solid #e5e7eb;
    margin-top: 12px;
}

[data-skin=dark] .timeline-changes {
    background-color: #1a1a1a;
    border-left-color: #4F4F4F;
}

.change-detail {
    margin-bottom: 6px;
    color: #6b7280;
    font-size: 13px;
}

.change-detail:last-child {
    margin-bottom: 0;
}

[data-skin=dark] .change-detail {
    color: #9ca3af;
}

.old-value {
    text-decoration: line-through;
    color: #ef4444;
    font-weight: 500;
}

.new-value {
    color: #10b981;
    font-weight: 500;
}

/* Status Change Badge Styling */
.status-change-badges {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
}

.status-badge {
    padding: 4px 8px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.status-badge.incomplete {
    background-color: #fef3c7;
    color: #92400e;
    border: 1px solid #fcd34d;
}

.status-badge.past-due {
    background-color: #fee2e2;
    color: #dc2626;
    border: 1px solid #fca5a5;
}

.quill-format-btn.active {
    background-color: #e3f2fd !important;
    color: #1976d2 !important;
    border: 1px solid #bbdefb !important;
}

.quill-format-btn:hover {
    background-color: #f5f5f5 !important;
    color: #333 !important;
}

/* Custom Wide Tooltip */
.custom-wide-tooltip {
    max-width: 400px !important;
}

.custom-wide-tooltip .tooltip-inner {
    max-width: 400px !important;
    width: 400px !important;
}

/* Generic custom tooltip popup - positioned with custom_tooltip.js */
.custom-tooltip-popup,
.task-aging-tooltip-popup {
    position: fixed;
    z-index: 1080;
    max-width: 380px;
    padding: 0;
    pointer-events: none;
}

.custom-tooltip-popup .custom-tooltip-popup__inner,
.custom-tooltip-popup .task-aging-tooltip-inner,
.task-aging-tooltip-popup .custom-tooltip-popup__inner,
.task-aging-tooltip-popup .task-aging-tooltip-inner {
    padding: 12px 16px;
    font-size: 12px;
    line-height: 1.5;
    text-align: left;
    color: #fff;
    background-color: #333;
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.custom-tooltip-popup .custom-tooltip-popup__inner ul,
.custom-tooltip-popup .task-aging-tooltip-inner ul,
.task-aging-tooltip-popup .custom-tooltip-popup__inner ul,
.task-aging-tooltip-popup .task-aging-tooltip-inner ul {
    margin-bottom: 0;
    padding-left: 1rem;
}

.custom-tooltip-popup .custom-tooltip-popup__inner strong,
.custom-tooltip-popup .task-aging-tooltip-inner strong,
.task-aging-tooltip-popup .custom-tooltip-popup__inner strong,
.task-aging-tooltip-popup .task-aging-tooltip-inner strong {
    color: #fff;
    font-weight: 600;
}

/* Arrow: top placement (arrow at bottom) */
.custom-tooltip-popup--top .custom-tooltip-popup__arrow,
.custom-tooltip-popup--top .task-aging-tooltip-arrow,
.task-aging-tooltip-popup .custom-tooltip-popup__arrow,
.task-aging-tooltip-popup .task-aging-tooltip-arrow {
    position: absolute;
    left: 50%;
    bottom: -6px;
    margin-left: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #333;
}

.custom-tooltip-popup--bottom .custom-tooltip-popup__arrow {
    position: absolute;
    left: 50%;
    top: -6px;
    margin-left: -6px;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #333;
}

/* Task History Modal Specific Styles - Only for history modal */
#history_modal .task-history-link {
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    display: block;
    width: 100%;
}

#history_modal .task-history-link:hover {
    text-decoration: none;
    color: inherit;
}

#history_modal .day-group {
    margin-bottom: 32px;
}

#history_modal .day-pill {
    background: #E5E7EB;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    text-transform: capitalize;
}

#history_modal .timeline-item {
    position: relative;
    display: flex;
    margin-bottom: 24px;
}

#history_modal .timeline-icon-wrapper {
    position: relative;
    z-index: 2;
    margin-right: 20px;
    flex-shrink: 0;
}

#history_modal .day-timeline {
    position: relative;
}

#history_modal .day-events {
    position: relative;
}

#history_modal .day-timeline-line {
    position: absolute;
    left: 20px;
    top: 20px;
    bottom: -4px;
    width: 2px;
    background: #E5E7EB;
    z-index: 1;
}

#history_modal {
    --bs-offcanvas-width: 540px !important;
}

#history_modal .icon-circle {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: none;
    position: relative;
    z-index: 3;
}

#history_modal .history-card {
    background: white;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 20px;
    flex: 1;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: box-shadow 0.2s ease;
}

#history_modal .history-card:hover {
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

#history_modal .day-separator {
    margin: 40px 0 32px 0;
    text-align: center;
    position: relative;
}

#history_modal .day-separator span {
    background: #F8F9FA;
    color: #374151;
    font-size: 14px;
    font-weight: 500;
    padding: 8px 16px;
    border-radius: 20px;
    display: inline-block;
    position: relative;
    z-index: 1;
    border: 1px solid #E5E7EB;
}

#history_modal .separator-line {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background: #E5E7EB;
}

/* One-Time Task Page Styles */
#one-time-task-page .segmented-tabs {
    background: #f6f8fa;
    border: 1px solid #e5e7eb;
    padding: 2px;
    margin: 0 !important;
}

#one-time-task-page .segmented-tabs .nav-item {
    flex: 1 1 0;
}

#one-time-task-page .segmented-tabs .nav-link {
    width: 100%;
    text-align: center;
    border: 1px solid transparent;
    color: #6b7280;
    font-weight: 500;
    transition: all 0.2s ease;
}

#one-time-task-page .segmented-tabs .nav-link.active {
    background: #ffffff;
    border-color: #e5e7eb;
    color: #111827;
}

#one-time-task-page .segmented-tabs .nav-link:not(.active):hover {
    background: #eef2f7;
    color: #4b5563;
}

#one-time-task-page .segmented-tabs .nav-link:focus,
#one-time-task-page .segmented-tabs .nav-link:active {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
}

/* Routine Badge Styles */
.routine-badge {
    background-color: #e6f3ff !important;
    border: 1px solid #b3d9ff !important;
    color: #4a5fcc !important;
    border-radius: 20px !important;
    padding: 6px 12px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}

/* Situational Badge Styles */
.situational-badge {
    background-color: #fef3c7 !important;
    border: 1px solid #f59e0b !important;
    color: #92400e !important;
    border-radius: 20px !important;
    padding: 6px 12px !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}

/* Time-Off Grid Card Clickable Styling */
.time-off-grid-card {
    transition: all 0.2s ease;
}

.time-off-grid-card:hover {
    transform: translateY(-50%) scale(1.05);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);
    z-index: 20 !important;
}

[data-skin=dark] .time-off-grid-card:hover {
    box-shadow: 0 4px 6px -1px rgba(255, 255, 255, 0.2);
}

/* Day Button Selected State - Shift Modal */
.day-button.selected,
button.day-button.selected,
.day-button.selected.bg-blue-500 {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
}

/* Selected + Disabled (current day - cannot be deselected) */
.day-button.selected:disabled,
button.day-button.selected:disabled {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

[data-skin=dark] .day-button.selected,
[data-skin=dark] button.day-button.selected,
[data-skin=dark] .day-button.selected.bg-blue-500 {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
}

/* Dark mode: Selected + Disabled (current day) */
[data-skin=dark] .day-button.selected:disabled,
[data-skin=dark] button.day-button.selected:disabled {
    background-color: #3b82f6 !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

/* Dark mode: non-selected day buttons - override Tailwind bg-white */
[data-skin=dark] .day-button:not(.selected):not(:disabled),
[data-skin=dark] button.day-button:not(.selected):not(:disabled),
[data-skin=dark] .day-button.bg-white:not(.selected) {
    background-color: #374151 !important;
    color: #d1d5db !important;
    border-color: #4b5563 !important;
}

[data-skin=dark] .day-button:not(.selected):not(:disabled):hover {
    background-color: #4b5563 !important;
}

.header-title {
    font-family: font family/Font 4;
    font-weight: font weight/700;
    font-style: Bold;
    font-size: 24px;
    /* leading-trim: NONE; */
    line-height: 39.34px;
    letter-spacing: 0%;
}

/* Advanced Options: dim section header (icon + title + help) when its primary
   checkbox is disabled by mutual exclusivity (RTD vs Time Frame) or because
   an inspection is attached. The form-check label below already fades via
   Bootstrap's `.form-check-input:disabled ~ .form-check-label` rule, so this
   keeps the whole section visually consistent instead of half-faded. */
.recurring-schedule-section:has(input[type="checkbox"]:disabled)>.d-flex.align-items-center,
.time-frame-section:has(input[type="checkbox"]:disabled)>.d-flex.align-items-center {
    opacity: 0.5;
}

/* ── Weekly schedule builder: frozen header rows ─────────────────────────────
   The grid is wider than a tablet viewport, so its wrapper already scrolled
   horizontally with the first column stuck to the left (.sticky-cell). Bounding
   the wrapper's height makes it own vertical scrolling too, which is what lets
   the two header rows freeze: a sticky `top` resolves against the nearest
   scrollport, so while the page was the vertical scroller the rows scrolled
   away with it.
   Reference: app/views/employees_schedule/desktop/_schedule_table.html.haml */
.schedule-frozen-grid {
    max-height: 80vh;

    /* Fallback until schedule_frozen_header_controller.js measures the real
       header row (and if JS never runs). Row 1 is py-3 + text-sm + borders. */
    --schedule-header-h: 46px;
}

/* Row 1 — day / date. */
.schedule-frozen-grid thead th {
    position: sticky;
    top: 0;
    z-index: 25;
}

/* Row 2 — per-day hours, parked directly below row 1. */
.schedule-frozen-grid .schedule-hours-cell {
    position: sticky;
    top: var(--schedule-header-h);
    z-index: 25;
}

/* The two corner cells freeze on both axes (.sticky-cell already pins them
   left), so they have to paint above both frozen rows and the first column. */
.schedule-frozen-grid thead th.sticky-cell,
.schedule-frozen-grid .schedule-hours-cell.sticky-cell {
    z-index: 35;
}

/* Native clear ("x") button on type="search" inputs shows no pointer cursor
   by default in WebKit/Blink browsers, so it doesn't read as clickable. */
.bay-equipment-search-input::-webkit-search-cancel-button {
    cursor: pointer;
}

.bay-equipment-sort-check {
    font-size: 1rem;
    vertical-align: middle;
    margin-right: 0.25rem;
}

.bay-equipment-sort-icon {
    font-size: 1rem;
    margin-right: 0.25rem;
}

/* Dragging the equipment list is opt-in (ticket LIST-3): dim the handle by
   default so it doesn't read as draggable, and only light it up once
   "Rearrange List" is turned on from Options. */
#bay-equipment .handle {
    opacity: 0.35;
    pointer-events: none;
    cursor: not-allowed;
}

.bay-equipment-rearrange-active #bay-equipment .handle {
    opacity: 1;
    pointer-events: auto;
    cursor: grab;
}

/* 86e31rne1: the archived list is not part of what is being reordered, and leaving it on screen
   during a rearrange invites the reader to drag into it. It is a sibling of the rearrange
   controller's element (both sit directly under the bay card body), so the active class the
   controller already toggles hides it — no extra state to keep in sync, and Save and Cancel both
   restore it for free because exit() removes that class. Display only: nothing is unmounted, so
   no archived row can be altered by the reorder. */
.bay-equipment-rearrange-active ~ .archived-bay-equipment-section {
    display: none;
}

/* 86e36t2z1 §A.21: the bar's own styling moved to my_wash.css, where the rest of the My Wash
   list lives, and became the prototype's blue instruction banner. Only the archived-section
   rule above stays here. */