﻿/* MarketManager/wwwroot/css/custom.css */

/* --- Search Results Page (Badge Styling) --- */

.badge.dark-background-text-light {
    color: #fff; /* White text for dark backgrounds */
}

/* Ensure default badge styles are fine, e.g., Bootstrap's .badge */
.badge {
    display: inline-block;
    padding: .35em .65em;
    font-size: .75em;
    font-weight: 700;
    line-height: 1;
    color: #fff; /* Default to white text if not specifically overridden */
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    /* Add transition for smoother color changes if you like */
    transition: color .15s ease-in-out, background-color .15s ease-in-out;
}

/* --- Search Results Page (Highlighting) --- */
.search-highlight {
    background-color: #17a2b8; /* A common yellow/orange highlight color */
    font-weight: bold;
    color: #ffffff; /* White text for contrast */
    padding: 0px 0px !important; /* More padding, larger visual area */
    border-radius: 10px !important; /* More rounded */
    box-shadow: 0 0 8px rgba(220, 53, 69, 1) !important; /* A more prominent glow matching the color */
}

/* NEW: Style for "strong" matches (all terms found in a single text field) */
.strong-search-highlight {
    /* Significantly different background and text color */
    background-color: #17a2b8 !important; /* Bootstrap's 'danger' red, or another vibrant color like #17a2b8 (info blue) */
    color: #ffffff !important; /* White text for strong contrast */
    /* Stronger visual cues */
    font-weight: bolder !important;
    padding: 0px 0px !important; /* More padding, larger visual area */
    border-radius: 10px !important; /* More rounded */
    box-shadow: 0 0 8px rgba(220, 53, 69, 1) !important; /* A more prominent glow matching the color */
    /* Consider an animation for extra flair if desired */
    /* animation: pulse-highlight 1.5s infinite alternate; */
}

/* Optional: Define pulse animation if used */
/*
@keyframes pulse-highlight {
    from { transform: scale(1); opacity: 1; }
    to { transform: scale(1.02); opacity: 0.9; }
}
*/


/* --- Custom styles for independent scrolling (assertive overrides for AdminLTE fixed layout) --- */

/* Ensure html and body take full viewport height and prevent general page scrolling */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden; /* Prevents scrollbars on the main window */
}

/* Ensure the main AdminLTE wrapper takes full height and uses flexbox for internal layout */
.wrapper {
    min-height: 100vh; /* Make sure it's at least the height of the viewport */
    display: flex; /* Use flexbox for vertical distribution of header, content, footer */
    flex-direction: column;
    overflow: hidden; /* Prevents scrollbar on the wrapper itself */
}

/* Make the main content wrapper (right side) independently scrollable */
.content-wrapper {
    /* flex-grow: 1 allows this element to take up remaining vertical space */
    flex-grow: 1;
    overflow-y: auto; /* Enable vertical scrolling for content that overflows */
    -webkit-overflow-scrolling: touch; /* For smoother scrolling on iOS devices */
    /* CRITICAL CHANGE: Explicitly calculate height by subtracting header and footer heights */
    /* AdminLTE's header (.main-header) is typically around 60px height. */
    /* AdminLTE's footer (.main-footer) is typically around 38px height. */
    /* You may need to inspect in browser dev tools for exact values if this doesn't work perfectly. */
    height: calc(100vh - 60px - 38px); /* Total viewport height minus header and footer */
    /* AdminLTE usually handles padding, but you can add more if needed */
    padding-bottom: 20px; /* Example: ensure content doesn't stick to footer */
}

/* Make the sidebar's content (menu) independently scrollable */
.main-sidebar .sidebar {
    /* Calculate height: full height of the sidebar minus the brand link at the top.
       The default brand-link height is often around 57px, but measure in your browser's
       developer tools to be precise if needed. */
    height: calc(100% - 57px);
    overflow-y: auto; /* Enable vertical scrolling for the menu items */
    -webkit-overflow-scrolling: touch; /* For smoother scrolling on iOS devices */
}

/* --- Custom styles for Sidebar Hierarchy (Targeting Parent Headers Only) --- */

/* Override AdminLTE's default dark sidebar background to be fully opaque and a dark subtle color */
.main-sidebar.sidebar-dark-navy {
    background-color: #212529 !important; /* A very dark, almost black, background */
    background-image: none !important; /* Remove any default gradients */
    filter: none !important; /* Ensure no filters are applied to the sidebar itself */
    box-shadow: none !important; /* Remove any potential transparent shadows on the sidebar */
}

/* Base style for ALL nav-links */
/* This sets default properties and ensures no unwanted inherited styles */
.main-sidebar .nav-sidebar .nav-item .nav-link {
    color: #f8f9fa !important; /* Light text for contrast */
    background: none !important; /* Ensure no background by default */
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    position: relative !important;
    z-index: 2 !important;
    font-weight: normal !important; /* Default to normal weight */
    border-left: none !important; /* No border by default */
    transition: background-color 0.3s ease; /* Smooth transition for hover */
}

/* Default subtle dark background for ALL menu items that are not parent headers */
/* This applies to all nav-links that don't get a specific colored background later */
.main-sidebar .nav-sidebar .nav-item .nav-link {
    background-color: #2c3942 !important; /* Subtle dark background for all links */
}

    /* Hover state for all links */
    .main-sidebar .nav-sidebar .nav-item .nav-link:hover {
        background-color: #3e4a55 !important; /* Slightly lighter on hover */
    }


/* LEVEL 0 (Top-level parent headers): Muted Blue background */
/* Target nav-link only if its parent nav-item has a .nav-dropdown class */
.main-sidebar .nav-sidebar > .nav-item.nav-dropdown > .nav-link {
    background-color: #46698C !important; /* Muted, slightly desaturated blue */
    background-image: none !important; /* Remove gradient */
    color: #ffffff !important;
    border-left: 3px solid #6A8BA8 !important; /* Lighter shade for border */
    font-weight: bold !important; /* Make parent headers bold */
}

/* LEVEL 1 (Sub-level parent headers - FCC Data Pulls, etc.): Darker Muted Blue background */
/* Target nav-link only if its parent nav-item has a .nav-dropdown class WITHIN a .nav-nested */
.main-sidebar .nav-nested > .nav-item.nav-dropdown > .nav-link {
    padding-left: 35px !important; /* Indent Level 1 parents */
    background-color: #3A5C7A !important; /* Noticeably darker than Level 0 */
    background-image: none !important; /* Remove gradient */
    color: #ffffff !important;
    border-left: 3px solid #5A7A90 !important; /* Lighter shade for border */
    font-weight: bold !important;
}

/* LEVEL 2 (Further sub-level parent headers): Even Darker Muted Blue background */
/* Target nav-link only if its parent nav-item has a .nav-dropdown class WITHIN nested .nav-nested */
.main-sidebar .nav-nested .nav-nested > .nav-item.nav-dropdown > .nav-link {
    padding-left: 55px !important; /* Indent Level 2 parents */
    background-color: #2F4D66 !important; /* Even darker, richer shade */
    background-image: none !important; /* Remove gradient */
    color: #ffffff !important;
    border-left: 3px solid #4A6D8C !important; /* Lighter shade for border */
    font-weight: bold !important;
}

/* --- Indentation for all menu items (including parents and children) --- */
/* Level 0 (top-level) */
.main-sidebar .nav-sidebar > .nav-item > .nav-link {
    padding-left: 15px !important;
}
/* Level 1 */
.main-sidebar .nav-nested > .nav-item > .nav-link {
    padding-left: 35px !important;
}
/* Level 2 */
.main-sidebar .nav-nested .nav-nested > .nav-item > .nav-link {
    padding-left: 55px !important;
}
/* Level 3 and deeper */
.main-sidebar .nav-nested .nav-nested .nav-nested > .nav-item > .nav-link {
    padding-left: 75px !important;
}


/* Optional: Adjust colors for active states */
/* These will use AdminLTE's default blue for active state for consistency */
.main-sidebar .nav-sidebar .nav-item > .nav-link.active {
    background-color: #007bff !important; /* AdminLTE default blue for active */
    background-image: none !important; /* Ensure no gradient interferes with active state */
    color: #fff !important;
    border-left-color: #fff !important; /* White border for active state */
    opacity: 1 !important;
    filter: none !important;
    box-shadow: none !important;
}

/* Ensure child indicators (like arrows) inherit text color and are opaque */
.main-sidebar .nav-link .right {
    color: inherit;
    opacity: 1 !important;
    filter: none !important;
}

/* AGGRESSIVE CLEARING OF POTENTIAL OVERLAYS FROM PARENT ELEMENTS OR PSEUDO-ELEMENTS */
/* This section targets common AdminLTE patterns that could cause unwanted overlays */

/* Target the nav-item itself in case it has an overlay */
.main-sidebar .nav-sidebar .nav-item {
    background: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
    filter: none !important;
    backdrop-filter: none !important;
}

    /* Target potential ::before and ::after pseudo-elements on nav-link and nav-item */
    .main-sidebar .nav-sidebar .nav-item .nav-link::before,
    .main-sidebar .nav-sidebar .nav-item .nav-link::after,
    .main-sidebar .nav-sidebar .nav-item::before,
    .main-sidebar .nav-sidebar .nav-item::after {
        background: none !important;
        opacity: 0 !important; /* Make sure they are fully transparent */
        filter: none !important;
        backdrop-filter: none !important;
        content: none !important; /* Remove them entirely if they are just decorative overlays */
        box-shadow: none !important;
        border: none !important;
    }
