.progress {
    max-width: 10rem;
}

.iq-card .card-body {
    padding: 1.5rem;
}

.card-body {
    -webkit-box-flex: 1;
    flex: 1 1 auto;
    padding: 1.5rem;
}

.iq-card {
    position: relative;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: var(--surface-bg);
    background-clip: border-box;
    border: 1px solid hsla(0, 0%, 100%, .02);
    border-radius: 8px;
}

.card-header:first-child {
    border-radius: 0 0 0 0;
}

.card-header {
    padding: .875rem 1rem;
    margin-bottom: 0;
    background-color: transparent;
    border-bottom: 1px solid hsla(0, 0%, 100%, .1);
}

.card-header:first-child {
    background-color: transparent !important;
}

.card-header {
    border-bottom: none !important;
}

.card-footer {
    background: none !important;
    border-top: none !important;
}

thead tr {
    background: none !important;
}

[data-color="cDark"] .card-header:before {
    background-color: rgb(26, 25, 25);
}

[data-color="cGreen"] .card-header:before {
    background-color: #052128;
}

[data-color="cPurple"] .card-header:before {
    background-color: rgb(98, 54, 196);
}

[data-color="cRed"] .card-header:before {
    background-color: rgb(181, 22, 22);
}

.card-header:before {
    content: "";
    position: absolute;
    left: 0;
    padding: 3px;
    border-radius: 0 50px 50px 0;
    height: 20px;
}

.scroll {
    max-height: 21rem !important;
}

.iq-card-icon2 {
    height: 35px;
    width: 35px;
    display: inline-block;
    line-height: 35px;
    text-align: center;
    font-size: 19px;
    z-index: 1000;
}

.iq-timeline li .timeline-dots2 {
    position: absolute;
    top: -5px;
    left: -38px;
    padding: 5px;
}

.iq-timeline li {
    padding: 0 15px 0 5px !important;
}

.iq-timeline {
    border-left: 1px dashed rgba(255, 255, 255, 0.3);
}

.form-control,
.dropdown {
    border-radius: 12px !important;
}

.iq-sub-dropdown {
    width: 300px;
    max-width: 90vw;
}

.notification-scroll {
    max-height: 350px;
    overflow-y: auto;
}

.iq-sub-card {
    padding: 12px 15px;
    display: block;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    transition: background-color var(--motion-fast) var(--ease-out);
}

.iq-sub-card:hover {
    background-color: rgba(0, 0, 0, 0.02);
}

.no-notifications {
    font-size: 18px;
}

.notification-icon {
    min-width: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notification-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
}

.notification-message {
    font-size: 13px;
    color: #d6dada;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.4;
}

.media.align-items-start {
    align-items: flex-start !important;
}

.iq-tabular-nums {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

.iq-mt-10 {
    margin-top: 10px;
}

.iq-text-success {
    color: var(--iq-success) !important;
}

.iq-text-danger {
    color: var(--iq-danger) !important;
}

.iq-text-muted {
    color: var(--iq-icon-color) !important;
}

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.iq-sidebar-menu .iq-menu li a:focus-visible {
    outline: 2px solid var(--iq-primary) !important;
    outline-offset: 2px;
    border-radius: 6px;
}

.iq-sidebar-backdrop:focus-visible {
    outline: none !important;
}

.list-group-flush .list-group-item {
    border: 0 !important;
    background: transparent !important;
}

.svg-icon.svg-icon-muted svg {
    color: #96969f;
}

.svg-icon {
    line-height: 1;
}

.svg-icon.svg-icon-2hx svg {
    height: 2.5rem !important;
    width: 2.5rem !important;
}

.category-header {
    transition: background-color var(--motion-fast) var(--ease-out);
    cursor: pointer;
}

.category-header:hover {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

.server-row {
    transition: background-color var(--motion-fast) var(--ease-out);
}

.server-row:hover {
    background-color: rgba(0, 0, 0, 0.02);
}

.progress.h-7 {
    height: 8px;
    border-radius: 4px;
    margin: 0 auto;
    max-width: 90%;
}

.category-card .progress-bar {
    transition: width var(--motion-slow) var(--ease-out);
}

.category-card {
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.category-card .collapse {
    transition: all var(--motion-fast) var(--ease-out);
}

.category-header .badge-pill {
    padding: 0.4em 0.8em;
    font-weight: 500;
}

.site-bg {
  position: fixed; inset: 0; z-index: -1;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  opacity: .4; pointer-events: none;
  filter: blur(.6px);
}

body[data-bg="off"] .site-bg,
body[data-bg="off"] .hero-bg {
  display: none !important;
}

.btn2 {
  display: inline-block;
  font-weight: 500;
  line-height: 1.5;
  color: #fff;
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .75rem 1.5rem;
  font-size: 0.8rem;
  border-radius: .95rem;
  transition: color var(--motion-fast) var(--ease-out), background-color var(--motion-fast) var(--ease-out), border-color var(--motion-fast) var(--ease-out), box-shadow var(--motion-base) var(--ease-out), transform var(--motion-base) var(--ease-out);
}

.btn2.btn-light-primary {
  color: #fff;
  background-color: rgba(181, 22, 22, 0.14);
  background-color: color-mix(in srgb, var(--iq-primary) 14%, transparent);
  border: 1px solid rgba(181, 22, 22, 0.30);
  border-color: color-mix(in srgb, var(--iq-primary) 30%, transparent);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

[data-theme="Light"] .btn2.btn-light-primary {
  color: var(--iq-primary);
}

.btn2.btn-light-primary:hover,
.btn2.btn-light-primary:focus,
.btn2.btn-light-primary:active {
  color: #fff;
  background-color: var(--iq-primary);
  border-color: var(--iq-primary);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(181, 22, 22, 0.35);
  box-shadow: 0 6px 20px color-mix(in srgb, var(--iq-primary) 35%, transparent);
}

.form-control,
input.form-control,
textarea.form-control,
select.form-control {
  border: 1px solid var(--surface-border);
}

[data-theme] .form-control,
[data-theme] input.form-control,
[data-theme] textarea.form-control {
  border: 1px solid var(--surface-border);
}

.form-control:focus,
[data-theme] .form-control:focus {
  border-color: var(--iq-primary);
  box-shadow: 0 0 0 3px rgba(181, 22, 22, 0.15);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--iq-primary) 15%, transparent);
  outline: none;
}

.form-control::placeholder,
[data-theme] .form-control::placeholder {
  color: var(--text-muted);
  opacity: 1;
}

.drawer .iq-card.selected-element {
  border-color: var(--iq-primary);
  box-shadow: 0 0 0 1px var(--iq-primary), var(--surface-shadow);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}