﻿/* ======== Custom AdminLTE Light Theme with White Sidebar ======== */

/* Set the main background to white */
/* Global Font Fix */
body {
    font-family: 'Rubik', sans-serif !important; /* Ensure Rubik is applied */
    font-size: 15px !important; /* Adjust font size (reduce if needed) */
    line-height: 1.4 !important; /* Adjust spacing between lines */
    letter-spacing: -0.2px !important; /* Reduce spacing between letters */
}

/* Sidebar Text */
.nav-sidebar .nav-item > .nav-link {
    font-size: 15px !important; /* Slightly smaller font for better fit */
    letter-spacing: -0.3px !important; /* Reduce spacing */
    color: #000000 !important; /* Ensures menu text is always black */
}

/* Table Text */
.table th, .table td {
    font-size: 13px !important; /* Reduce table text size */
    /*letter-spacing: -0.2px !important;
    padding: 6px 10px !important;*/ /* Reduce padding */
}

.table td {
    padding: .25rem;
    vertical-align: middle;
}

/* Buttons */
.btn {
    font-size: 13px !important; /* Make buttons more compact */
    padding: 6px 12px !important; /* Adjust padding */
}

/* Labels */
label {
    font-size: 13px !important;
    letter-spacing: -0.2px !important;
}

/* Ensure uniform height for all buttons & input buttons */
input[type="button"], button, .btn {
    height: 40px !important; /* Standardized button height */
    padding: 8px 16px !important; /* Consistent padding */
    font-size: 14px !important; /* Ensure text consistency */
    line-height: normal !important;
    border-radius: 12px !important; /* Rounded corners */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent; /* Prevent border inconsistencies */
}

/* Ensure consistent font size for form inputs */
input, select {
    height: 38px !important; /* Uniform height */
    font-size: 14px !important;
    letter-spacing: -0.2px !important;
    padding: 5px 10px !important;
}

/* Ensure consistent font size for form inputs */
textarea {
    height: auto !important; /* Uniform height */
    font-size: 14px !important;
    letter-spacing: -0.2px !important;
    padding: 5px 10px !important;
}

.wrapper::-webkit-scrollbar {
    display: none; /* Hide scrollbar in Chrome and Safari */
}
/* Sidebar Background - White */
.main-sidebar {
    background-color: #ffffff !important; /* White Sidebar */
    border-right: 1px solid #E3E3E3 !important; /* Light grey border for separation */
}


/* Sidebar Active Menu Item */
.nav-sidebar .nav-item > .nav-link.active {
    background-color: #438FC0 !important; /* Blue */
    color: #ffffff !important;
    border-radius: 5px;
}

    .nav-sidebar .nav-item > .nav-link.active .nav-icon {
        color: white !important;
    }
/* Sidebar Menu Hover */
.nav-sidebar .nav-item > .nav-link:hover {
    background-color: #85CEBA !important; /* Teal */
    color: #ffffff !important;
    border-radius: 5px;
}

.nav-sidebar > .nav-item .nav-icon {
    color: #438FC0 !important;
}

/* Sidebar Header/Section Titles */
.nav-header {
    color: #438FC0 !important; /* Blue */
    font-weight: bold;
}

/* Top Navbar */
.main-header {
    background-color: #ffffff !important; /* Teal */
    color: #ffffff !important;
}

/* Footer */
.main-footer {
    background-color: #F8F9FA !important; /* Very light grey */
    color: #000000 !important;
}

/* Card Headers */
.card {
    background-color: white !important; /* Light Teal */
    border: 1px solid #E3E3E3 !important; /* Light Grey border */
    padding: 10px;
}

/* Card Primary Outlines */
.card-primary.card-outline {
    border-top: 3px solid #438FC0 !important; /* Blue */
}

.card-primary:not(.card-outline) > .card-header {
    background-color: white !important;
}

    .card-primary:not(.card-outline) > .card-header, .card-primary:not(.card-outline) > .card-header a {
        color: #605f5f !important;
        font-style: normal !important;
    }

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: #ffffff #ffffff #438fc0;
    border-bottom-width: medium;
}

.card-title {
    color: #8080809c !important;
    font-size: medium;
}
/* Text Color */
.text-primary {
    color: #438FC0 !important; /* Blue */
}

.text-dark {
    color: #000000 !important; /* Black */
}

/* Buttons */
.btn-primary {
    background-color: #438FC0 !important; /* Blue */
    border-color: #438FC0 !important;
}

.btn-secondary {
    background-color: transparent !important; /* Teal */
    border-color: #85CEBA !important;
    color:black;
}

.btn-dark {
    background-color: #000000 !important; /* Black */
    border-color: #000000 !important;
}

.btn-light {
    background-color: #E3E3E3 !important; /* Light Grey */
    border-color: #E3E3E3 !important;
    color: #000000 !important;
}

/* Button Hover Effects */
.btn-primary:hover {
    background-color: #3578A3 !important; /* Darker Blue */
}

.btn-secondary:hover {
    background-color: #6CB3A1 !important; /* Darker Teal */
}

/* DataTables & Tables */
.table {
    background-color: #ffffff !important;
}

    /* Table Headers */
    .table thead {
        background-color: #438FC0 !important; /* Blue Header */
        color: #ffffff !important;
    }

        .table thead th {
            border-bottom: 2px solid #FFFFFF !important; /* White border */
        }

    /* Table Row Hover Effect */
    .table tbody tr:hover {
        background-color: #DCE6F1 !important; /* Light blue instead of grey */
    }

/* Sidebar Brand Link */
[class*=sidebar-dark] .brand-link,
[class*=sidebar-dark] .brand-link .pushmenu {
    color: #438FC0;
    font-weight: bold;
}

    /* Sidebar Brand Link Hover */
    [class*=sidebar-dark] .brand-link:hover {
        color: #3578A3 !important; /* Darker Blue */
    }

/* Input Buttons */
input[type="button"] {
    background: #438FC0;
    border-color: #438FC0;
    font-weight: bold;
    color: white;
}



/* DataTables Wrapper */
.dataTables_wrapper {
    width: 100%;
    overflow-x: auto;
}

.dataTables_scroll {
    width: 100% !important;
    min-width: max-content;
    width: max-content;
}
.slimScrollDiv {
    width: 100% !important;
}
table.dataTable {
    border-radius: 12px;
    overflow: hidden;
}
/* Table Cell Alignment */
th, td {
    white-space: nowrap;
}

th {
    text-align: center;
}

/* Form Button Alignment */
.input-btn-align {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Labels */
label {
    white-space: nowrap;
}

a.btn {
    width: 30px !important;
    padding: 6px 12px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    /* color: #fff; */
    border-radius: 4px;
    transition: background-color 0.3s ease, transform 0.1s ease-in-out;
}
.btn-close {
    padding: 0;
    background: transparent;
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity 0.15s ease-in-out;
    width: 1em;
    height: 1em;
    position: relative;
}

    .btn-close:hover {
        opacity: 0.75;
    }

    .btn-close:focus {
        outline: 0;
        box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
        opacity: 1;
    }

    /* The X icon is done with two pseudo-elements forming a cross */

    .btn-close::before,
    .btn-close::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 1.25em;
        height: 0.125em;
        background-color: currentColor;
        border-radius: 0.125em;
        transform-origin: center;
    }

    .btn-close::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }

    .btn-close::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }
