/* ----------------------------------------------------------------
    File Name: style.css
    Description: MY OO Custom Style
-----------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .header-navbar {
    font-family: "Poppins", Helvetica, Arial, serif !important;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    line-height: 2.5rem;
}
h1, h2, h3, h4, h5 {
    font-weight: 600;
    color: #1A667B;
}
html body {
    background-color: #ffffff !important;
}
.horizontal-menu .header-navbar {
    background-color: #ffffff;
}
a {
    color: #1A667A;
}
a:hover {
    color: #39B6E7;
}
.card .card-title {
    text-transform: inherit;
}
body {color:#647579;}
.header-navbar .navbar-container ul.nav li > a.nav-link {
    color: #1A667B;
}
.text-muted {
    color: #647579 !important;
}
/*
NAVBAR LOGO
*/
.main-menu.menu-fixed.menu-shadow.menu-light .myoo-logo {
    height: 0% !important;
    width: 0% !important;
}
.horizontal-menu .header-navbar.navbar-horizontal {
    top: 68px !important;
}
.myoo-header-logo {
    top: 68px !important;
	position: fixed;
    width: 100%;
    z-index: 99 !important;
	background-color: #ffffff;
}
.myoo-header-logo-mobile {
    top: 68px !important;
	position: fixed;
    width: 100%;
    z-index: 100 !important;
	background-color: #ffffff;
	border-bottom: 1px solid #DFE3E7;
}
.navbar-light {
    background: none !important;
}
/*
ACCOUNT SETTINGS
*/
.nav-tabs .nav-link, .nav-pills .nav-link {
    background-color: transparent;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #FFFFFF;
    background-color: #39B6E7;
}
/*
MENU
*/
.myoo-logo {
	/* clamp keeps the logo readable on small screens and prevents it from
	   ballooning on ultra-wide displays. Preferred width stays at 15% of nav. */
	width: clamp(140px, 15%, 240px);
}
.myoo-logo img {
	max-width: 100%;
	height: auto;
	display: block;
}
/* Everknown logo is a wider (~4:1) PNG vs MyOO SVG (~2:1). To preserve the
   navbar's vertical whitespace, we widen the container so the rendered height
   matches MyOO's, then nudge the image right for visual balance. */
.myoo-logo.myoo-logo--everknown {
	width: clamp(220px, 25%, 380px);
}
.myoo-logo img.logo-everknown {
	max-width: 85%;
	margin-left: 1rem;
    padding-bottom: 1.2rem;
}
/* Everknown-only header border fix.
   The horizontal nav bar (core/menu/menu-types/horizontal-menu.css:48) paints
   a bottom border at its own edge. The Everknown logo makes the overlay
   (.myoo-header-logo, position:fixed, white bg) taller than that nav, so the
   nav's border shows above the overlay's white bottom edge, producing a
   visible empty strip. Move the border from the nav to the overlay so it
   always sits flush with the visible white edge. Scoped by the .is-everknown
   class added in resources/views/myoo/panels/sidebar.blade.php so vanilla
   MyOO is untouched. */
.horizontal-menu .header-navbar.navbar-horizontal.is-everknown {
    border-bottom: 0 !important;
}
.myoo-header-logo:has(.myoo-logo--everknown) {
    border-bottom: 1px solid #DFE3E7;
}
.horizontal-menu.navbar-sticky .content > .content-wrapper {
    margin-top: 10.2% !important;
}

/*
BUTTONS
*/
.btn-primary-white {
    border-color: #ffffff !important;
    background-color: #ffffff !important;
    color: #1A667A !important;
}
/* Outline/ghost variant used on the dark navbar for secondary actions
   (e.g. Log In paired with the primary Sign Up). Transparent ground,
   white border + label, fills white on hover to mirror the primary. */
.btn-outline-white {
    border-color: #ffffff !important;
    background-color: transparent !important;
    color: #ffffff !important;
}
.btn-outline-white:hover,
.btn-outline-white:focus {
    background-color: #ffffff !important;
    color: #1A667A !important;
}

/* Shared polish for the paired Log In / Sign Up actions in the navbar.
   Anchored to the viewport with position:fixed so theme quirks inside
   Frest's .header-navbar / .navbar-collapse / .navbar-wrapper (absolute
   brand positioning, z-stacked collapse panes, flex siblings fighting
   for the right-side slot) can never hide or squeeze the pair. The
   z-index sits above the fixed navbar (z:99) and below overlays. */
.navbar-auth-actions {
    position: fixed !important;
    top: 14px !important;
    right: 18px !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0.5rem;
    z-index: 1050;
    display: flex !important;
    align-items: center;
    list-style: none;
}
@media (max-width: 575.98px) {
    .navbar-auth-actions {
        top: 11px !important;
        right: 12px !important;
    }
}
.btn-auth-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* Force a consistent line-height on the button so the flex-centered
       glyph + label share a single baseline. Boxicons otherwise inherit
       their own metric box and drift above the text x-height. */
    line-height: 1 !important;
    padding: 0.5rem 1rem !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease,
                background-color 0.15s ease, color 0.15s ease;
    min-height: 36px;
}
.btn-auth-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px -6px rgba(0, 0, 0, 0.35);
}
.btn-auth-action:active {
    transform: translateY(0);
    box-shadow: none;
}
.btn-auth-action:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 3px;
}
.btn-auth-action .bx {
    font-size: 1.05em;
    line-height: 1;
    /* Override the theme's `.btn i { position: relative; top: 3px }`
     * (bootstrap-extended.css:870) which offsets every button icon
     * downward. With flex centering we don't want that shift — reset
     * to 0 so the glyph stays on the label's x-height. */
    position: static !important;
    top: 0 !important;
    flex-shrink: 0;
}
.btn-auth-action .btn-auth-label {
    line-height: 1;
    margin-left: 0.4em;
    white-space: nowrap;
}
@media (max-width: 575.98px) {
    /* Keep the icon + "Log In" label visible on phones — a labelled pill
       reads faster than an unlabeled circle, even with the universally
       understood log-in glyph. Tighten the padding slightly so the pill
       sits neatly against the navbar's right edge without crowding the
       hamburger on the left. */
    .btn-auth-action {
        padding: 0.4rem 0.75rem !important;
        font-size: 0.85rem;
    }
    .btn-auth-action .bx {
        font-size: 1.1em;
    }
}
/*
CHECKBOX LABEL
*/
.checkbox label {
    margin-top: 2px !important;
}

/* For Large Screen drop Menu Hamburger */
@media (min-width: 1200px) {
.nav-menu-main.menu-toggle {
    display: none;
}
}
/* 
For small screen move content down to make room for logo
*/
@media (max-width: 1199.98px) {
.horizontal-layout.vertical-overlay-menu .app-content .content-wrapper {
    margin-top: 9.5rem !important;
}
.myoo-logo {
    width: 200px;
}
}
/* For Small Screen drop Logo */
@media (max-width: 576px) {
  #dz-profile .dz-message:before {top:7.14rem;}
}
/* Fix for radio buttons with two line label */
.radio label::before {
    min-width: 16px;
    min-height: 16px;
}
/* Trip Application */
h3.application-section {
    font-weight: 100;
    color: #727E8C;
}
.app-content{
    background-color: #FDFDFD !important;
}