/* ==========================================================================
   Dark theme: primary used as a text colour

   The brand primary is a dark colour. The bundles use it as a text colour in
   many places (links, tabs, active menu items, outline buttons, pagination),
   and on the dark surfaces it can't be read. In dark mode those spots switch to
   a lightened primary; primary backgrounds such as filled buttons and the
   active tab keep the brand colour, since their text is already white.

   Loaded by the admin panel, the admin auth pages and the website, so every
   dark screen gets the same treatment. Light mode is untouched.
   ========================================================================== */

[data-bs-theme=dark] {
    --mh-primary-on-dark: color-mix(in srgb, var(--bs-primary) 45%, #ffffff);
}

/* --------------------------------------------------------------------------
   Links and text
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .text-primary,
[data-bs-theme=dark] .link-primary {
    color: var(--mh-primary-on-dark) !important;
}

[data-bs-theme=dark] .btn-link {
    --bs-btn-color: var(--mh-primary-on-dark);
    --bs-btn-hover-color: #ffffff;
    --bs-btn-active-color: #ffffff;
    color: var(--mh-primary-on-dark);
}

[data-bs-theme=dark] .btn-link:hover,
[data-bs-theme=dark] .btn-link:focus {
    color: #ffffff;
}

/* --------------------------------------------------------------------------
   Outline buttons: primary text and border on a transparent background
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .btn-outline-primary {
    --bs-btn-color: var(--mh-primary-on-dark);
    --bs-btn-border-color: var(--mh-primary-on-dark);
    --bs-btn-disabled-color: var(--mh-primary-on-dark);
    --bs-btn-disabled-border-color: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Navs, tabs and pills: body text until active
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .nav {
    --bs-nav-link-color: var(--bs-body-color);
    --bs-nav-link-hover-color: var(--mh-primary-on-dark);
}

[data-bs-theme=dark] .nav-pills .nav-link:not(.active),
[data-bs-theme=dark] .setting-pills .nav-pills .nav-link:not(.active),
[data-bs-theme=dark] .nav-tabs .nav-item .nav-link:not(.active) {
    color: var(--bs-body-color);
}

[data-bs-theme=dark] .nav-pills .nav-link:not(.active):hover,
[data-bs-theme=dark] .nav-tabs .nav-item .nav-link:not(.active):hover {
    color: var(--mh-primary-on-dark);
}

[data-bs-theme=dark] .tab-nav-pane li .active,
[data-bs-theme=dark] .topnav-toolbar li.active a {
    color: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Admin sidebar: active, open and hovered items
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu > li.active > a,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu > li.active .submenu li.active > a,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu li.active-menu > a,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu li a:hover,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu li ul a:hover,
[data-bs-theme=dark] body:not(.sidebar-main) .sidebar-default .iq-sidebar-menu .side-menu > li > a[aria-expanded=true] {
    color: var(--mh-primary-on-dark);
}

[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu > li.active > a svg,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu > li.active .submenu li.active > a svg,
[data-bs-theme=dark] .iq-sidebar.sidebar-default .iq-sidebar-menu .side-menu li a:hover svg {
    stroke: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Pagination, dropdowns, accordions, list groups
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .pagination {
    --bs-pagination-color: var(--mh-primary-on-dark);
    --bs-pagination-hover-color: #ffffff;
    --bs-pagination-focus-color: #ffffff;
}

[data-bs-theme=dark] .dropdown-menu {
    --bs-dropdown-link-hover-color: var(--mh-primary-on-dark);
    --bs-dropdown-link-active-color: #ffffff;
}

[data-bs-theme=dark] .dropdown-menu .dropdown-item:hover {
    color: var(--mh-primary-on-dark);
}

[data-bs-theme=dark] .accordion {
    --bs-accordion-active-color: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Smaller admin widgets
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] .profile-box .pro-content .p-icon,
[data-bs-theme=dark] .fc-unthemed .fc-toolbar .fc-button {
    color: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Website: booking wizard steps, tabs, sub-menus and pagination
   -------------------------------------------------------------------------- */
[data-bs-theme=dark] #top-tab-list li:not(.active) a,
[data-bs-theme=dark] .tab-bottom-bordered .nav-tabs .nav-link.active,
[data-bs-theme=dark] header .navbar .iq-nav-menu.navbar-nav li ul.sub-nav li a.nav-link.active,
[data-bs-theme=dark] header .navbar .iq-nav-menu.navbar-nav li ul.sub-nav li:hover > a.nav-link,
[data-bs-theme=dark] .iq-nav-menu .nav-item > .nav-link:hover,
[data-bs-theme=dark] .page-numbers li .page-numbers,
[data-bs-theme=dark] .btn.btn-border:hover {
    color: var(--mh-primary-on-dark);
}

/* --------------------------------------------------------------------------
   Logo: the uploaded logo in light mode, the dark-background copy in dark
   mode (see partials/_themed_logo.blade.php). The website footer is navy in
   both themes, so it always takes the dark copy.
   -------------------------------------------------------------------------- */
.logo-for-dark {
    display: none !important;
}

[data-bs-theme=dark] .logo-for-light,
.landing-refresh-footer .logo-for-light {
    display: none !important;
}

[data-bs-theme=dark] .logo-for-dark,
.landing-refresh-footer .logo-for-dark {
    display: inline-block !important;
}