/* ============================================================
   AIRWAY CONNECT — Admin re-skin (loaded after style.css)
   Design system: 60% pale-cyan · 30% deep teal · 10% teal accent
   Overrides the Bootstrap admin template WITHOUT touching style.css.
   IMPORTANT: every rule is scoped under .main-wrapper (admin shell)
   so these overrides never leak into public/website pages that also
   include this stylesheet (e.g. welcome, Breeze profile).
   ============================================================ */
:root {
    --ac-accent: #2FA8AE;
    --ac-accent-dark: #1C7E84;
    --ac-accent-50: #E3FDFD;
    --ac-ink: #0C3134;
    --ac-ink-2: #13474A;
    --ac-surface: #E3FDFD;
    --ac-surface-2: #CBF1F5;
    --ac-border: #A6E3E9;
    --ac-muted: #4B6B6D;
    --ac-gradient-accent: linear-gradient(135deg, #2FA8AE 0%, #1C7E84 100%);
    --ac-gradient-ink: linear-gradient(135deg, #0C3134 0%, #13474A 100%);
    --ac-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
    --ac-shadow-lg: 0 12px 32px rgba(15, 23, 42, 0.12);
    --ac-radius: 14px;
}

/* Panel-wide gradient: lightest at the very top (header) → darker at the bottom */
.main-wrapper {
    background-image: linear-gradient(180deg, #FFFFFF 0%, #E3FDFD 35%, #CBF1F5 70%, #A6E3E9 100%) !important;
    background-attachment: fixed !important;
    color: var(--ac-ink);
    font-family: 'Roboto', 'Figtree', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    position: relative;
    min-height: 100vh;
}

/* Cursor-following light across the entire admin panel */
#adminCursorGlow {
    position: fixed;
    inset: 0;
    z-index: 9998;
    pointer-events: none;
    background: radial-gradient(460px circle at var(--cx, 50%) var(--cy, -20%),
        rgba(47, 168, 174, 0.13), rgba(47, 168, 174, 0.05) 42%, transparent 66%);
    opacity: 0;
    transition: opacity .4s ease;
}

#adminCursorGlow.is-active {
    opacity: 1;
}

/* ---------------- Top header ---------------- */
.main-wrapper .header {
    background: rgba(255, 255, 255, 0.72) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: var(--ac-shadow) !important;
}

.main-wrapper .header .header-left {
    background: linear-gradient(180deg, #1E6E73 0%, #12545A 32%, #0B3B3F 66%, #061F22 100%) !important;
    background-attachment: fixed !important;
    border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.main-wrapper .header .menu-toggle a,
.main-wrapper .header .mobile_btn {
    color: var(--ac-ink) !important;
}

.main-wrapper .header .user-menu .nav-item .nav-link,
.main-wrapper .header .user-menu .nav-link i {
    color: var(--ac-ink) !important;
}

.main-wrapper .header .user-menu .user-text h6 {
    color: var(--ac-ink) !important;
}

.main-wrapper .header .user-menu .user-text span {
    color: var(--ac-muted) !important;
}

.main-wrapper .header .win-maximize img {
    filter: invert(12%) sepia(20%) saturate(1200%) hue-rotate(190deg);
}

/* ---------------- Sidebar ---------------- */
/* Vertical gradient: lighter at the top, darker toward the bottom */
.main-wrapper .sidebar {
    background: linear-gradient(180deg, #1E6E73 0%, #12545A 32%, #0B3B3F 66%, #061F22 100%) !important;
    background-attachment: fixed !important;
    border-right: 1px solid rgba(255, 255, 255, 0.05) !important;
    box-shadow: 4px 0 24px rgba(15, 23, 42, 0.28) !important;
    position: fixed;
    overflow: hidden;
}

/* Cursor-following light — a soft accent glow tracking the pointer */
.main-wrapper .sidebar::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: radial-gradient(260px circle at var(--glow-x, 50%) var(--glow-y, -20%),
        rgba(113, 201, 206, 0.35), rgba(47, 168, 174, 0.14) 42%, transparent 68%);
    opacity: 0;
    transition: opacity .35s ease;
}

.main-wrapper .sidebar.glow-active::before {
    opacity: 1;
}

.main-wrapper .sidebar .sidebar-inner {
    position: relative;
    z-index: 3;
}

.main-wrapper .sidebar .sidebar-menu > ul > li > a {
    position: relative;
    color: #A6E3E9 !important;
    border-radius: 10px !important;
    margin: 3px 12px !important;
    padding: 11px 14px 11px 16px !important;
    font-weight: 500 !important;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease !important;
}

/* Left indicator bar that grows on hover / active */
.main-wrapper .sidebar .sidebar-menu > ul > li > a::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 0;
    border-radius: 3px;
    background: #71C9CE;
    box-shadow: 0 0 10px rgba(113, 201, 206, 0.8);
    transition: height .25s ease;
}

.main-wrapper .sidebar .sidebar-menu > ul > li > a i {
    color: #7C9A9C !important;
    transition: color .25s ease, transform .25s ease !important;
}

.main-wrapper .sidebar .sidebar-menu > ul > li > a:hover {
    background: rgba(47, 168, 174, 0.16) !important;
    color: #ffffff !important;
    transform: translateX(4px);
}

.main-wrapper .sidebar .sidebar-menu > ul > li > a:hover::before {
    height: 55%;
}

.main-wrapper .sidebar .sidebar-menu > ul > li > a:hover i {
    color: #71C9CE !important;
    transform: scale(1.12);
}

.main-wrapper .sidebar .sidebar-menu > ul > li.active > a,
.main-wrapper .sidebar .sidebar-menu > ul > li > a.subdrop {
    background: var(--ac-gradient-accent) !important;
    color: #ffffff !important;
    box-shadow: 0 6px 18px rgba(47, 168, 174, 0.4) !important;
}

.main-wrapper .sidebar .sidebar-menu > ul > li.active > a::before {
    height: 60%;
    background: #ffffff;
    box-shadow: 0 0 12px rgba(255, 255, 255, 0.7);
}

.main-wrapper .sidebar .sidebar-menu > ul > li.active > a i,
.main-wrapper .sidebar .sidebar-menu > ul > li > a.subdrop i {
    color: #ffffff !important;
}

.main-wrapper .sidebar .sidebar-menu ul li.submenu ul {
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 10px !important;
    margin: 0 12px 6px !important;
}

.main-wrapper .sidebar .sidebar-menu ul li.submenu ul li a {
    color: #7C9A9C !important;
    padding-left: 46px !important;
}

.main-wrapper .sidebar .sidebar-menu ul li.submenu ul li a:hover,
.main-wrapper .sidebar .sidebar-menu ul li.submenu ul li.active a {
    color: #71C9CE !important;
    background: transparent !important;
}

.main-wrapper .sidebar .menu-arrow {
    filter: invert(70%);
}

/* ---------------- Page wrapper ---------------- */
.main-wrapper .page-wrapper {
    background: transparent !important;
}

.main-wrapper .page-wrapper .content,
.main-wrapper .content.container-fluid {
    background: transparent !important;
}

/* sidebar collapse toggle button */
.main-wrapper #toggle_btn,
.main-wrapper .menu-toggle > a {
    color: #7C9A9C !important;
}

/* Footer blends into the panel gradient */
.main-wrapper .page-wrapper .footer {
    background: transparent !important;
    border-top: 1px solid rgba(148, 163, 184, 0.25) !important;
    color: var(--ac-muted) !important;
}

.main-wrapper .page-wrapper .footer p {
    color: var(--ac-muted) !important;
    margin-bottom: 0;
}

.main-wrapper .page-header .page-title,
.main-wrapper .page-title {
    color: var(--ac-ink) !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
}

.main-wrapper .text-primary {
    color: var(--ac-accent) !important;
}

/* ---------------- Cards ---------------- */
.main-wrapper .card {
    background: #ffffff !important;
    border: 1px solid var(--ac-border) !important;
    border-radius: var(--ac-radius) !important;
    box-shadow: var(--ac-shadow) !important;
}

.main-wrapper .card-header {
    background: #ffffff !important;
    border-bottom: 1px solid var(--ac-border) !important;
}

/* Template forces .card-body to a blue fill with white text — reset to light */
.main-wrapper .card-body {
    background-color: #ffffff !important;
    color: var(--ac-ink) !important;
}

.main-wrapper .dashboard-card {
    position: relative;
    background: linear-gradient(180deg, #ffffff 0%, #FBFCFE 100%) !important;
    border: 1px solid var(--ac-border) !important;
    border-radius: var(--ac-radius) !important;
    box-shadow: var(--ac-shadow) !important;
    padding: 22px !important;
    overflow: hidden;
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease !important;
}

/* Accent bar that reveals on hover */
.main-wrapper .dashboard-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 3px;
    width: 100%;
    background: var(--ac-gradient-accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s ease;
}

/* Soft corner glow */
.main-wrapper .dashboard-card::after {
    content: "";
    position: absolute;
    top: -40px;
    right: -40px;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(47, 168, 174, 0.10), transparent 70%);
    opacity: 0;
    transition: opacity .35s ease;
    pointer-events: none;
}

.main-wrapper .dashboard-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--ac-shadow-lg) !important;
    border-color: rgba(47, 168, 174, 0.35) !important;
}

.main-wrapper .dashboard-card:hover::before {
    transform: scaleX(1);
}

.main-wrapper .dashboard-card:hover::after {
    opacity: 1;
}

.main-wrapper .dashboard-card h6 {
    color: var(--ac-muted) !important;
    font-size: 13px !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    font-weight: 600 !important;
}

.main-wrapper .dashboard-card h3 {
    color: var(--ac-ink) !important;
    font-weight: 700 !important;
    font-size: 30px !important;
    margin: 6px 0 !important;
    letter-spacing: -0.02em;
}

.main-wrapper .dashboard-icon {
    position: relative;
    z-index: 1;
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(135deg, #E3FDFD 0%, #CBF1F5 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(47, 168, 174, 0.12), 0 6px 14px rgba(47, 168, 174, 0.14);
    transition: transform .3s ease;
}

.main-wrapper .dashboard-card:hover .dashboard-icon {
    transform: scale(1.06) rotate(-3deg);
}

.main-wrapper .dashboard-icon img {
    width: 26px;
    height: 26px;
}

/* ---------------- Buttons ---------------- */
.main-wrapper .btn-primary,
.main-wrapper .btn-info {
    background: var(--ac-gradient-accent) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 10px !important;
    box-shadow: 0 6px 16px rgba(47, 168, 174, 0.28) !important;
    transition: transform .2s ease, box-shadow .2s ease !important;
}

.main-wrapper .btn-primary:hover,
.main-wrapper .btn-info:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 24px rgba(47, 168, 174, 0.36) !important;
}

.main-wrapper .btn-outline-primary {
    border: 1.5px solid var(--ac-accent) !important;
    color: var(--ac-accent) !important;
    border-radius: 10px !important;
}

.main-wrapper .btn-outline-primary:hover {
    background: var(--ac-accent) !important;
    color: #fff !important;
}

.main-wrapper .btn-secondary {
    background: var(--ac-ink) !important;
    border: none !important;
    border-radius: 10px !important;
}

.main-wrapper .btn {
    border-radius: 10px !important;
    font-weight: 600 !important;
}

/* ---------------- Tables ---------------- */
.main-wrapper .table {
    color: var(--ac-ink) !important;
}

.main-wrapper .table > thead {
    background: var(--ac-surface-2) !important;
}

.main-wrapper .table > thead th {
    color: var(--ac-ink) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
    letter-spacing: .03em !important;
    border-bottom: 1px solid var(--ac-border) !important;
}

.main-wrapper .table > tbody > tr {
    border-bottom: 1px solid var(--ac-surface-2) !important;
}

.main-wrapper .table > tbody > tr:hover {
    background: var(--ac-accent-50) !important;
}

.main-wrapper .table td,
.main-wrapper .table th {
    border-color: var(--ac-border) !important;
    vertical-align: middle !important;
}

.main-wrapper .table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: var(--ac-surface) !important;
}

/* ---------------- Forms ---------------- */
.main-wrapper .form-control,
.main-wrapper .form-select,
.main-wrapper textarea.form-control {
    border: 1px solid var(--ac-border) !important;
    border-radius: 10px !important;
    color: var(--ac-ink) !important;
    background-color: #fff !important;
    transition: border-color .2s ease, box-shadow .2s ease !important;
}

.main-wrapper .form-control:focus,
.main-wrapper .form-select:focus {
    border-color: var(--ac-accent) !important;
    box-shadow: 0 0 0 3px rgba(47, 168, 174, 0.15) !important;
}

.main-wrapper .form-label,
.main-wrapper label {
    color: var(--ac-ink-2) !important;
    font-weight: 600 !important;
}

/* ---------------- Badges & pills ---------------- */
.main-wrapper .badge.bg-primary,
.main-wrapper .badge-primary {
    background: var(--ac-accent) !important;
}

.main-wrapper .badge.bg-success {
    background: #16A34A !important;
}

.main-wrapper .badge.bg-danger {
    background: #DC2626 !important;
}

.main-wrapper .badge.bg-warning {
    background: #F59E0B !important;
}

/* ---------------- DataTables ---------------- */
.main-wrapper .dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 8px !important;
    border: 1px solid var(--ac-border) !important;
    color: var(--ac-ink) !important;
    background: #fff !important;
    margin: 0 2px !important;
}

.main-wrapper .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.main-wrapper .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--ac-gradient-accent) !important;
    border-color: transparent !important;
    color: #fff !important;
}

.main-wrapper .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--ac-accent-50) !important;
    color: var(--ac-accent-dark) !important;
    border-color: var(--ac-accent) !important;
}

.main-wrapper .dataTables_wrapper .dataTables_paginate .paginate_button.disabled {
    color: var(--ac-muted) !important;
}

.main-wrapper .dataTables_wrapper .dataTables_filter input,
.main-wrapper .dataTables_wrapper .dataTables_length select {
    border: 1px solid var(--ac-border) !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
}

.main-wrapper .dataTables_wrapper .dataTables_filter input:focus,
.main-wrapper .dataTables_wrapper .dataTables_length select:focus {
    border-color: var(--ac-accent) !important;
    box-shadow: 0 0 0 3px rgba(47, 168, 174, 0.15) !important;
    outline: none !important;
}

/* ---------------- Pagination (Laravel/Bootstrap) ---------------- */
.main-wrapper .pagination .page-item .page-link {
    color: var(--ac-ink) !important;
    border: 1px solid var(--ac-border) !important;
    border-radius: 8px !important;
    margin: 0 2px !important;
}

.main-wrapper .pagination .page-item.active .page-link {
    background: var(--ac-gradient-accent) !important;
    border-color: transparent !important;
    color: #fff !important;
}

/* ---------------- Dropdowns ---------------- */
.main-wrapper .dropdown-menu {
    border: 1px solid var(--ac-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--ac-shadow-lg) !important;
}

.main-wrapper .dropdown-item:hover,
.main-wrapper .dropdown-item:focus {
    background: var(--ac-accent-50) !important;
    color: var(--ac-accent-dark) !important;
}

/* focus visibility */
.main-wrapper a:focus-visible,
.main-wrapper button:focus-visible,
.main-wrapper .form-control:focus-visible {
    outline: 2px solid var(--ac-accent) !important;
    outline-offset: 2px;
}

/* ============================================================
   Preserved legacy rules (admin testimonies)
   ============================================================ */
.main-wrapper .testimonial-text p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 4;
    line-clamp: 4;
}

.main-wrapper .testimonial-text .card-body-ts {
    background-color: var(--ac-surface-2);
}
