﻿@charset "UTF-8";

:root,
[data-coreui-theme="light"],
[data-coreui-theme="auto"],
.theme-light {
  --ely-bg: #e9eef5;
  --ely-surface: #fdfefe;
  --ely-surface-alt: #f2f6fb;
  --ely-surface-elevated: #ffffff;
  --ely-surface-soft: #e8eff7;
  --ely-border: #ced8e5;
  --ely-border-strong: #b9c7d8;
  --ely-shadow-sm: 0 8px 20px rgba(15, 23, 42, 0.08);
  --ely-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
  --ely-title: #1f2b3a;
  --ely-muted: #5b6b7e;
  --ely-link: #0b76ab;
  --ely-link-hover: #0a5f8b;
  --ely-row-hover: #e7eff8;
  --ely-header-bg: rgba(241, 246, 252, 0.95);
  --ely-input-bg: #ffffff;
  --ely-sidebar-bg: #dde5ef;
  --ely-sidebar-border: #c8d4e3;
  --ely-sidebar-text: #243446;
  --ely-sidebar-muted: #4f647d;
  --ely-sidebar-hover: #d0dceb;
  --ely-sidebar-active: #bfd0e3;
  --ely-sidebar-shadow: 0 12px 26px rgba(15, 23, 42, 0.12);
}

[data-coreui-theme="dark"],
.theme-dark {
  --ely-bg: #161c24;
  --ely-surface: #1f2732;
  --ely-surface-alt: #273241;
  --ely-surface-elevated: #25303f;
  --ely-surface-soft: #2b394a;
  --ely-border: #3a495c;
  --ely-border-strong: #4a5d74;
  --ely-shadow-sm: 0 10px 24px rgba(2, 6, 23, 0.4);
  --ely-shadow: 0 18px 38px rgba(2, 6, 23, 0.55);
  --ely-title: #e3ebf4;
  --ely-muted: #a9b8ca;
  --ely-link: #78c9ff;
  --ely-link-hover: #a2dcff;
  --ely-row-hover: #2d3b4d;
  --ely-header-bg: rgba(31, 39, 50, 0.96);
  --ely-input-bg: #1e2834;
  --ely-sidebar-bg: #202a36;
  --ely-sidebar-border: #344356;
  --ely-sidebar-text: #d8e2ee;
  --ely-sidebar-muted: #9fb0c3;
  --ely-sidebar-hover: #2e3b4c;
  --ely-sidebar-active: #3b4f68;
  --ely-sidebar-shadow: 0 16px 34px rgba(2, 6, 23, 0.62);
}

@media (prefers-color-scheme: dark) {
  [data-coreui-theme="auto"] {
    --ely-bg: #161c24;
    --ely-surface: #1f2732;
    --ely-surface-alt: #273241;
    --ely-surface-elevated: #25303f;
    --ely-surface-soft: #2b394a;
    --ely-border: #3a495c;
    --ely-border-strong: #4a5d74;
    --ely-shadow-sm: 0 10px 24px rgba(2, 6, 23, 0.4);
    --ely-shadow: 0 18px 38px rgba(2, 6, 23, 0.55);
    --ely-title: #e3ebf4;
    --ely-muted: #a9b8ca;
    --ely-link: #78c9ff;
    --ely-link-hover: #a2dcff;
    --ely-row-hover: #2d3b4d;
    --ely-header-bg: rgba(31, 39, 50, 0.96);
    --ely-input-bg: #1e2834;
    --ely-sidebar-bg: #202a36;
    --ely-sidebar-border: #344356;
    --ely-sidebar-text: #d8e2ee;
    --ely-sidebar-muted: #9fb0c3;
    --ely-sidebar-hover: #2e3b4c;
    --ely-sidebar-active: #3b4f68;
    --ely-sidebar-shadow: 0 16px 34px rgba(2, 6, 23, 0.62);
  }
}

body {
  margin: 0;
  padding: 0;
  background: var(--ely-bg);
  color: var(--cui-body-color);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.wrapper {
  margin-top: 0;
  padding-top: 0;
  background: transparent;
}

.sidebar.sidebar-dark {
  background: var(--ely-sidebar-bg) !important;
  border-right: 1px solid var(--ely-sidebar-border) !important;
  box-shadow: var(--ely-sidebar-shadow);
}

.sidebar .sidebar-header {
  min-height: 60px;
  border-bottom-color: var(--ely-sidebar-border) !important;
  background: var(--ely-sidebar-bg) !important;
}

.sidebar .sidebar-nav .nav-title {
  color: var(--ely-sidebar-muted) !important;
  letter-spacing: 0.08em;
  font-size: 0.69rem;
  text-transform: uppercase;
  margin-top: 0.65rem;
}

.sidebar .sidebar-nav .nav-link {
  color: var(--ely-sidebar-text) !important;
  border-radius: 10px;
  margin: 0.14rem 0.48rem;
  padding: 0.62rem 0.72rem;
  transition: background-color 0.14s ease, transform 0.14s ease;
}

.sidebar .sidebar-nav .nav-link .nav-icon,
.sidebar .sidebar-nav .nav-link .fa-solid,
.sidebar .sidebar-nav .nav-link .nav-icon-bullet {
  color: var(--ely-sidebar-muted) !important;
}

.sidebar .sidebar-nav .nav-link:hover {
  background: var(--ely-sidebar-hover) !important;
  transform: translateX(2px);
}

.sidebar .sidebar-nav .nav-link:hover .nav-icon,
.sidebar .sidebar-nav .nav-link:hover .fa-solid,
.sidebar .sidebar-nav .nav-link:hover .nav-icon-bullet {
  color: var(--ely-sidebar-text) !important;
}

.sidebar .sidebar-nav .nav-link.active,
.sidebar .sidebar-nav .nav-group.show > .nav-link {
  background: var(--ely-sidebar-active) !important;
  color: var(--ely-sidebar-text) !important;
  box-shadow: inset 0 0 0 1px var(--ely-sidebar-border);
}

.sidebar .sidebar-nav .nav-group-items .nav-link {
  padding-left: 1.25rem;
  opacity: 0.95;
}

.sidebar .sidebar-footer {
  border-top-color: var(--ely-sidebar-border) !important;
  background: var(--ely-sidebar-bg) !important;
}

@media (min-width: 992px) {
  .sidebar.sidebar-narrow-unfoldable:not(:hover),
  .sidebar.sidebar-narrow {
    box-shadow: var(--ely-sidebar-shadow);
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-header,
  .sidebar.sidebar-narrow .sidebar-header {
    padding-inline: 0 !important;
    justify-content: center;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-brand,
  .sidebar.sidebar-narrow .sidebar-brand {
    justify-content: center;
    width: 100%;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-nav .nav-link,
  .sidebar.sidebar-narrow .sidebar-nav .nav-link {
    margin-inline: 0.28rem;
    padding-inline: 0.5rem;
    transform: none !important;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-nav .nav-link:hover,
  .sidebar.sidebar-narrow .sidebar-nav .nav-link:hover {
    transform: none !important;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-nav .nav-group-toggle::after,
  .sidebar.sidebar-narrow .sidebar-nav .nav-group-toggle::after {
    display: none;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-footer,
  .sidebar.sidebar-narrow .sidebar-footer {
    justify-content: center;
    padding-inline: 0.35rem;
  }

  .sidebar.sidebar-narrow-unfoldable:not(:hover) .sidebar-toggler,
  .sidebar.sidebar-narrow .sidebar-toggler {
    width: 1.5rem;
    height: 1.5rem;
  }
}

.header.header-sticky {
  position: sticky;
  top: 0;
  z-index: 1030;
  margin-bottom: 0.95rem !important;
  padding: 0.42rem 0.55rem;
  background: transparent;
  border-bottom: 0;
  backdrop-filter: none;
}

.header.header-sticky .container-fluid.border-bottom {
  border: 1px solid var(--ely-border) !important;
  border-radius: 12px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  background: var(--ely-header-bg);
  box-shadow: var(--ely-shadow-sm);
}

.header .header-nav .nav-link,
.header .header-toggler,
.header .btn-link.nav-link {
  color: var(--ely-title) !important;
  border-radius: 8px;
}

.header .header-nav .nav-link:hover,
.header .header-toggler:hover,
.header .btn-link.nav-link:hover {
  background: var(--ely-surface-soft);
}

.header .icon,
.header .icon use,
.header .theme-icon-active,
.header .theme-icon-active use {
  color: var(--ely-title) !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

.header .dropdown-menu {
  background: var(--ely-surface-elevated);
  border: 1px solid var(--ely-border);
  border-radius: 10px;
  box-shadow: var(--ely-shadow-sm);
}

.header .dropdown-item {
  color: var(--ely-title);
}

.header .dropdown-item .icon,
.header .dropdown-item .icon use {
  color: var(--ely-muted) !important;
  fill: currentColor !important;
}

.header .dropdown-item:hover,
.header .dropdown-item:focus,
.header .dropdown-item.active {
  background: var(--ely-surface-soft);
  color: var(--ely-title);
}

.topbar-time-chip {
  border: 1px solid var(--ely-border);
  border-radius: 999px;
  padding: 0.26rem 0.68rem;
  margin-right: 0.45rem;
  background: var(--ely-surface);
}

.topbar-time-text {
  font-size: 0.8rem;
  color: var(--ely-muted);
  font-weight: 600;
  white-space: nowrap;
}

.topbar-time-text strong {
  color: var(--ely-title);
  font-weight: 700;
}

.timezone-select {
  min-width: 210px;
  height: 33px;
  border-radius: 999px;
  border: 1px solid var(--ely-border-strong);
  background: var(--ely-surface);
  color: var(--ely-title);
  font-size: 0.78rem;
  padding: 0.14rem 0.72rem;
}

.timezone-select:focus {
  border-color: var(--ely-link);
  box-shadow: 0 0 0 0.15rem rgba(11, 118, 171, 0.2);
}

.wrapper .body .container-lg.px-4 {
  padding-top: 0;
  padding-bottom: 1.2rem;
}

.wrapper .body .container-lg.px-4 > .fs-2.fw-semibold {
  color: var(--ely-title);
  font-size: clamp(1.52rem, 1.2rem + 0.72vw, 1.98rem) !important;
  letter-spacing: 0.01em;
  margin-bottom: 0.2rem;
}

.wrapper .body .container-lg.px-4 > nav[aria-label="breadcrumb"] {
  margin-bottom: 1rem !important;
}

.wrapper .body .breadcrumb.my-0 {
  padding: 0.35rem 0 0.08rem;
}

.wrapper .body .breadcrumb .breadcrumb-item,
.wrapper .body .breadcrumb .breadcrumb-item a {
  color: var(--ely-muted);
  font-size: 0.85rem;
}

.wrapper .body .breadcrumb .breadcrumb-item.active,
.wrapper .body .breadcrumb .breadcrumb-item.active span {
  color: var(--ely-title);
  font-weight: 600;
}

.wrapper .body .card,
.wrapper .body .card.shadow,
.wrapper .body .card.shadow-sm {
  border: 1px solid var(--ely-border);
  border-radius: 14px;
  background: var(--ely-surface);
  box-shadow: var(--ely-shadow-sm);
}

.wrapper .body .card:hover {
  box-shadow: var(--ely-shadow);
}

.wrapper .body .card .card-header {
  border-bottom: 1px solid var(--ely-border);
  background: var(--ely-surface-alt);
  color: var(--ely-title);
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0.72rem 1rem;
}

.wrapper .body .card .card-header h6,
.wrapper .body .card .card-header .text-primary {
  color: var(--ely-title) !important;
}

.wrapper .body .card .card-body {
  color: var(--cui-body-color);
}

.wrapper .body .stats-card,
.wrapper .body .staff-card,
.wrapper .body .award-card,
.wrapper .body .rank-card,
.wrapper .body .hub-info-card,
.wrapper .body .fleet-wrap-card,
.wrapper .body .fleet-detail-card,
.wrapper .body .pilots-wrap-card,
.wrapper .body .profile-main-card,
.wrapper .body .profile-section-card,
.wrapper .body .profile-edit-card,
.wrapper .body .profile-password-card {
  border-color: var(--ely-border) !important;
  box-shadow: var(--ely-shadow-sm);
}

.wrapper .body .stats-column,
.wrapper .body .hub-stat-item,
.wrapper .body .hub-side-box,
.wrapper .body .rank-image-wrap,
.wrapper .body .aircraft-image-wrap,
.wrapper .body .award-thumb-wrap,
.wrapper .body .award-thumb,
.wrapper .body .staff-avatar,
.wrapper .body .profile-image-preview-wrap,
.wrapper .body .profile-quote,
.wrapper .body .profile-edit-guide,
.wrapper .body .password-guide,
.wrapper .body .fleet-summary,
.wrapper .body .ranks-summary,
.wrapper .body .pilots-summary {
  border-color: var(--ely-border) !important;
  background: var(--ely-surface-alt) !important;
}

.wrapper .body .row.g-4.mb-4 {
  margin-bottom: 1.1rem !important;
}

.wrapper .body .table {
  margin-bottom: 0;
}

.wrapper .body .table > :not(caption) > * > * {
  border-bottom-color: var(--ely-border);
  vertical-align: middle;
}

.wrapper .body .table > thead > tr > th {
  color: var(--ely-muted);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.wrapper .body .table tbody tr {
  transition: background-color 0.14s ease;
}

.wrapper .body .table tbody tr:hover {
  background: var(--ely-row-hover);
}

.wrapper .body .table.table-striped > tbody > tr:nth-of-type(odd) > * {
  --cui-table-bg-type: var(--ely-surface-alt);
}

.wrapper .body .dataTables_wrapper .dataTables_filter input,
.wrapper .body .dataTables_wrapper .dataTables_length select,
.wrapper .body .form-control,
.wrapper .body .form-select {
  border: 1px solid var(--ely-border-strong);
  border-radius: 10px;
  background-color: var(--ely-input-bg);
  color: var(--cui-body-color);
  box-shadow: none;
}

.wrapper .body .form-control:focus,
.wrapper .body .form-select:focus,
.wrapper .body .dataTables_wrapper .dataTables_filter input:focus,
.wrapper .body .dataTables_wrapper .dataTables_length select:focus {
  border-color: var(--ely-link);
  box-shadow: 0 0 0 0.18rem rgba(11, 118, 171, 0.15);
}

.wrapper .body .form-group label,
.wrapper .body label {
  color: var(--ely-title);
  font-weight: 700;
}

.wrapper .body .help-block,
.wrapper .body .form-text {
  color: var(--ely-muted);
  font-size: 0.8rem;
}

.wrapper .body .dataTables_wrapper .dataTables_info,
.wrapper .body .dataTables_wrapper .dataTables_paginate {
  padding-top: 0.85rem;
}

.wrapper .body .dataTables_wrapper .paginate_button.page-item .page-link {
  background: var(--ely-surface-alt);
  border: 1px solid var(--ely-border);
  color: var(--ely-title);
}

.wrapper .body .dataTables_wrapper .paginate_button.page-item.active .page-link {
  background: var(--ely-link);
  border-color: var(--ely-link);
  color: #fff;
}

.wrapper .body .dataTables_wrapper .paginate_button.page-item.disabled .page-link {
  background: var(--ely-surface-alt);
  opacity: 0.72;
}

.wrapper .body .btn {
  border-radius: 10px;
  font-weight: 600;
  transition: transform 0.14s ease;
}

.wrapper .body .btn:hover {
  transform: translateY(-1px);
}

.wrapper .body .btn.btn-sm {
  border-radius: 8px;
}

.wrapper .body .badge {
  border-radius: 999px;
  padding: 0.42em 0.66em;
}

.wrapper .body .alert {
  border-radius: 12px;
  border-width: 1px;
}

.wrapper .body .list-group-item {
  border-color: var(--ely-border);
  background: var(--ely-surface);
  color: var(--cui-body-color);
}

.wrapper .body .modal-content {
  border-radius: 14px;
  border: 1px solid var(--ely-border);
  background: var(--ely-surface-elevated);
  box-shadow: var(--ely-shadow);
}

.wrapper .body .modal-header,
.wrapper .body .modal-footer {
  border-color: var(--ely-border);
}

.wrapper .body .nav-tabs {
  border-bottom-color: var(--ely-border);
}

.wrapper .body .nav-tabs .nav-link {
  color: var(--ely-muted);
  border: 1px solid transparent;
  border-bottom: 0;
  border-radius: 10px 10px 0 0;
}

.wrapper .body .nav-tabs .nav-link:hover {
  background: var(--ely-surface-soft);
  color: var(--ely-title);
}

.wrapper .body .nav-tabs .nav-link.active {
  color: var(--ely-title);
  background: var(--ely-surface);
  border-color: var(--ely-border);
  border-bottom-color: var(--ely-surface);
}

.wrapper .body a {
  color: var(--ely-link);
}

.wrapper .body a:hover {
  color: var(--ely-link-hover);
}

.footer {
  border-top: 1px solid var(--ely-border);
  background: var(--ely-surface-alt);
  color: var(--ely-muted);
}

.footer a {
  color: var(--ely-link);
}

@keyframes elyFadeInUp {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.wrapper .body .row.g-4.mb-4 > [class*="col-"] {
  animation: elyFadeInUp 0.24s ease both;
}

@media (max-width: 991.98px) {
  .header.header-sticky {
    margin-bottom: 0.7rem !important;
    padding: 0.35rem;
  }

  .header.header-sticky .container-fluid.border-bottom {
    border-radius: 10px;
  }

  .wrapper .body .container-lg.px-4 > .fs-2.fw-semibold {
    font-size: 1.4rem !important;
  }

  .wrapper .body .card {
    border-radius: 12px;
  }

  .sidebar .sidebar-nav .nav-link {
    margin-inline: 0.34rem;
  }
}
