/* --- MODERNIZED HEADER & NAVIGATION --- */

/* Header Container */
#header {
    background-color: #FF7D0E; /* Keep the existing orange background */
    padding: 15px 60px; /* Adjusted padding for better vertical balance */
    display: flex; /* Use Flexbox for alignment */
    align-items: center; /* Vertically center logo and menu */
    min-height: 70px; /* Ensure minimum height */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
}

/* Logo */
#logo {
    float: none; /* Remove float, Flexbox handles layout */
    margin: 0 40px 0 0; /* Remove negative top margin, adjust right margin */
    max-width: 160px; /* Slightly larger max-width if needed */
    max-height: 60px; /* Adjust max-height to fit new header padding */
    display: block; /* Ensure it's a block element */
}

#logo img {
    display: block; /* Helps with potential spacing issues */
    max-width: 100%;
    max-height: 60px; /* Match container's max-height */
    height: auto; /* Maintain aspect ratio */
}

/* Top Navigation Menu Container */
#top-menu {
    float: none; /* Remove float */
    margin: 0; /* Reset margin */
    padding: 0; /* Reset padding */
    list-style: none; /* Remove bullets */
    display: flex; /* Use flex for horizontal items */
    flex-wrap: wrap; /* Allow wrapping on smaller screens if needed */
    align-items: center; /* Align items vertically */
}

/* Top-Level Menu Items */
ul#top-menu > li {
    margin: 0; /* Reset margin, spacing handled by link padding */
    padding: 0; /* Reset padding */
    position: relative; /* Needed for dropdown positioning */
}

/* Top-Level Menu Links */
ul#top-menu > li > a {
    display: block; /* Make the whole area clickable */
    padding: 12px 18px; /* Generous padding for larger click targets */
    font-size: 17px; /* Increased font size for readability */
    font-weight: 500; /* Medium weight for clarity */
    color: #ffffff; /* White text for high contrast on orange */
    text-decoration: none; /* Remove underline */
    line-height: 1.4; /* Adjust line height for font size */
    border-radius: 4px; /* Slightly rounded corners for modern feel */
    transition: background-color 0.2s ease-in-out; /* Smooth hover transition */
    height: auto; /* Remove fixed height */
    border-bottom: none !important; /* Override existing hover border */
    margin-bottom: 0 !important; /* Override existing hover margin */
}

/* Top-Level Menu Link Hover State */
ul#top-menu > li > a:hover,
ul#top-menu > li:hover > a { /* Target hover on li as well for dropdown trigger */
    background-color: rgba(0, 0, 0, 0.1); /* Subtle dark overlay on hover */
    color: #ffffff; /* Keep text white on hover */
    text-decoration: none; /* Ensure no underline on hover */
    border-bottom: none !important; /* Ensure no border on hover */
}

/* Top-Level Menu Link Active/Current Page State */
ul#top-menu > li.current_page_item > a,
ul#top-menu > li.current-menu-item > a,
ul#top-menu > li.current-menu-ancestor > a {
    background-color: rgba(0, 0, 0, 0.2); /* Darker overlay for active state */
    color: #ffffff;
    font-weight: 500; /* Keep medium weight */
}

/* --- Dropdown Menu Styling --- */

/* Dropdown Container (ul.sub-menu) */
ul#top-menu li ul.sub-menu {
    display: none; /* Hide by default (Superfish JS likely handles visibility) */
    position: absolute; /* Position relative to parent li */
    top: 100%; /* Position below parent */
    left: 0;
    background-color: #ffffff; /* White background for high contrast */
    border: 1px solid #ddd; /* Light border */
    padding: 8px 0; /* Vertical padding */
    margin: 2px 0 0 0; /* Small top margin to offset from parent */
    min-width: 240px; /* Minimum width for dropdown */
    z-index: 1000; /* Ensure dropdown is on top */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); /* Softer shadow */
    border-radius: 4px; /* Rounded corners */
}

/* Second Level Dropdown Container */
ul#top-menu li ul.sub-menu li ul.sub-menu {
    top: -9px; /* Align top edge with parent item's top padding */
    left: 100%; /* Position to the right */
    margin-top: 0;
    margin-left: 1px; /* Slight gap */
}

/* Dropdown Menu Items */
ul#top-menu li ul.sub-menu li {
    margin: 0;
    padding: 0;
    width: 100%; /* Ensure items take full width */
    border: none; /* Remove any residual borders */
}

/* Dropdown Menu Links */
ul#top-menu li ul.sub-menu li a {
    display: block;
    padding: 10px 20px; /* Padding for dropdown links */
    font-size: 16px; /* Slightly smaller than top-level */
    font-weight: 400; /* Regular weight */
    color: #333333; /* Dark text for contrast on white */
    text-decoration: none;
    line-height: 1.4;
    width: auto; /* Override previous fixed width */
    background: none; /* Ensure no background */
    border: none; /* Ensure no border */
}

/* Dropdown Menu Link Hover State */
ul#top-menu li ul.sub-menu li a:hover {
    background-color: #f5f5f5; /* Light grey background on hover */
    color: #000000; /* Black text on hover */
    width: auto; /* Ensure width is auto */
    border-bottom: none !important; /* Override just in case */
}

/* Remove bottom 'spacer' element style if it exists */
ul#top-menu li ul li.dropdown-bottom {
    display: none !important; /* Hide this if it's just for old styling */
}

/* --- End MODERNIZED HEADER & NAVIGATION --- */



/* --- MODERNIZED TABLE STYLES (Separate Borders, Vibrant Header) --- */

/* Optional: Add a wrapper for responsiveness on small screens */
.table-responsive-wrapper {
    overflow-x: auto; /* Allows horizontal scrolling if table is too wide */
    margin-bottom: 20px; /* Space below the table */
    -webkit-overflow-scrolling: touch; /* Smoother scrolling on iOS */
}

/* General Table Wrapper (.datagrid or .dataTables_wrapper) */
.datagrid, .dataTables_wrapper {
    background: none; /* Remove any old background */
    border: none; /* Remove any old border */
    padding: 0; /* Reset padding */
    margin-bottom: 25px; /* Add some space below tables */
}

/* Base Table Styling (Targeting DataTables 'display' class) */
table.display {
    width: 100%;
    /* Use separate border model */
    border-collapse: separate;
    /* Remove spacing between cells */
    border-spacing: 0;
    margin: 0 auto;
    background-color: #ffffff; /* White background */
    border: 1px solid #aab1b9; /* Visible outer border */
    border-radius: 6px; /* Rounded corners */
    overflow: hidden; /* Clip content to border-radius */
    font-size: 16px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.07); /* Subtle shadow */
}

/* Table Header Cells */
table.display thead th {
    background-color: #4A69BD; /* Vibrant Blue Header */
    /* Optional Gradient: Uncomment below and comment out background-color above */
    /* background: linear-gradient(180deg, #5D7BCF 0%, #4A69BD 100%); */
    color: #ffffff; /* White text */
    font-weight: 500;
    padding: 12px 15px;
    text-align: left;
    line-height: 1.4;
    white-space: nowrap;
    border: none; /* Remove all default borders from th */
}

/* Add rounded corners specifically to top-left/top-right header cells */
table.display thead th:first-child {
    border-top-left-radius: 5px; /* Match table radius minus border width */
}
table.display thead th:last-child {
    border-top-right-radius: 5px; /* Match table radius minus border width */
}

/* Table Body Cells */
table.display tbody td {
    padding: 10px 15px;
    color: #343a40; /* Body text color */
    /* Use border-top for row separation in 'separate' model */
    border-top: 1px solid #dee2e6;
    border-left: none;
    border-right: none;
    border-bottom: none; /* Remove bottom border */
    vertical-align: middle;
    line-height: 1.5;
}

/* Remove top border from the very first row of the body */
table.display tbody tr:first-child td {
    border-top: none;
}

/* Add rounded corners to bottom-left/bottom-right cells of the LAST row */
table.display tbody tr:last-child td:first-child {
    border-bottom-left-radius: 5px; /* Match table radius minus border width */
}
table.display tbody tr:last-child td:last-child {
    border-bottom-right-radius: 5px; /* Match table radius minus border width */
}

/* Row Hover Effect - Apply background to TDs */
table.display tbody tr:hover td {
    background-color: #f0f3f9; /* Very light blue tint hover */
    transition: background-color 0.15s ease-in-out;
    /* Ensure hover doesn't mess up row separator border */
    border-top-color: #dee2e6; /* Keep border color consistent on hover */
}
/* Ensure first row remains borderless on top during hover */
table.display tbody tr:first-child:hover td {
    border-top: none;
}

/* Link Styling within Tables */
table.display td a {
    color: #FF7D0E; /* Keep site's primary orange for links */
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

table.display td a:hover {
    color: #cc640b; /* Darker orange on hover */
    text-decoration: underline;
}

/* DataTables specific elements styling */
.dataTables_length label,
.dataTables_filter label,
.dataTables_info {
    font-size: 14px;
    color: #495057;
    padding: 5px 0;
}

.dataTables_length select,
.dataTables_filter input {
    border: 1px solid #ced4da;
    border-radius: 4px;
    padding: 5px 8px;
    margin-left: 5px;
    margin-right: 5px;
    font-size: 14px;
}
.dataTables_filter input {
    width: auto; /* Adjust as needed */
}

.dataTables_paginate .paginate_button {
    font-size: 14px;
    padding: 5px 10px;
    margin: 0 2px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    color: #FF7D0E !important; /* Orange text */
    background-color: #ffffff;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.dataTables_paginate .paginate_button:hover {
    background-color: #f8f9fa;
    border-color: #ced4da;
    color: #cc640b !important; /* Darker Orange text on hover */
}

.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:hover {
    background-color: #4A69BD; /* Use new header blue for current page */
    border-color: #4A69BD;
    color: #ffffff !important; /* White text */
}

.dataTables_paginate .paginate_button.disabled,
.dataTables_paginate .paginate_button.disabled:hover {
    color: #adb5bd !important;
    background-color: #ffffff;
    border-color: #dee2e6;
    cursor: default;
}

/* --- END MODERNIZED TABLE STYLES (Separate Borders, Vibrant Header) --- */


ul.fancytree-container {
    font-size: 16px !important;
    font-family: inherit !important;
}

#footer p#copyright {
    font-size: 14px !important;
}

span.fancytree-node {
    margin-top: 5px !important;
}

#footer {
    padding-top: 100px;
}