html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}
/* My Edited styles */
.navbar-nav .nav-item.active {
    border-bottom: 2px solid #AFCB37; /* White bottom border */
}

.bg-newman-forest {
    background-color: #40492A !important;
}

.color-newman-forest {
    color: #40492A !important;
}
/*borders*/
.border-newman-forest {
    border-color: #40492A !important;
}

.border-newman-olive {
    border-color: #8A9F61 !important;
}

.border-newman-primary {
    border-color: #006379 !important;
}

.border-newman-lime {
    border-color: #AFCB37 !important;
}

.border-left-success {
    border-left: .25rem solid #1cc88a !important;
}

.border-left-forest {
    border-left: .25rem solid #40492A !important;
}

.border-left-olive {
    border-left: .25rem solid #8A9F61 !important;
}

.border-left-primary {
    border-left: .25rem solid #006379 !important;
}

.border-left-newman-stone {
    border-left: .25rem solid #65696A !important;
}

.border-left-newman-sky {
    border-left: .25rem solid #82AEB3 !important;
}

.border-left-newman-blueberry {
    border-left: .25rem solid #002C4B !important;
}

.border-left-newman-lilac {
    border-left: .25rem solid #9A8597 !important;
}


.border-left-danger {
    border-left: .25rem solid #dc3545 !important;
}
/*borders end*/
.bg-newman-olive {
    background-color: #8A9F61 !important;
}

.color-newman-olive {
    color: #8A9F61 !important;
}

.bg-newman-primary {
    background-color: #006379 !important;
}

.color-newman-primary {
    color: #006379 !important;
}

.bg-newman-lime {
    background-color: #AFCB37 !important;
}

.color-newman-lime {
    color: #AFCB37 !important;
}

@font-face {
    font-family: 'Clarendon Bold';
    /*  src: url('font/Clarendon Bold.otf') format('opentype');*/
    font-weight: bold;
    src: url('../font/Clarendon Bold.otf');
}

@font-face {
    font-family: 'Clarendon-Regular';
    /*  src: url('font/Clarendon Bold.otf') format('opentype');*/
    /*   font-weight: bold;*/
    src: url('../font/Clarendon-Regular-Font.ttf');
}

.clarendonfont-regular {
    font-family: 'Clarendon-Regular';
}

.clarendonfont {
    font-family: 'Clarendon Bold'
}

.h1-clarendonfont {
    font-size: 2.5em; /* 40px if the base size is 16px */
    margin: 0.5em 0;
    font-family: 'Clarendon Bold'
}

.h2-clarendonfont {
    font-size: 2em; /* 32px if the base size is 16px */
    margin: 0.75em 0;
    font-family: 'Clarendon Bold'
}

.h3-clarendonfont {
    font-size: 1.75em; /* 28px if the base size is 16px */
    margin: 1em 0;
    font-family: 'Clarendon Bold'
}

.p-clarendonfont {
    font-size: 1em; /* 16px */
    margin: 1em 0;
    font-family: 'Clarendon Bold'
}

.sidebar {
    /* position: fixed;*/
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
    padding: 48px 0 0;
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
}

/* Header Styles */
.h1-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 2.5em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

.h2-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 2em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

.h3-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 1.75em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

.h4-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 1.5em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

.h5-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 1.25em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

.h6-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 1em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

/* Paragraph Style */
.p-clarendon-regular {
    font-family: 'Clarendon-Regular';
    font-size: 1em; /* Adjust the size as needed */
    font-weight: normal; /* Adjust weight if necessary */
}

ul.list-unstyled.components.mb-5 li {
    background-color: #006379;
    text-align: center;
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

    /* Hover effect for li elements */
    ul.list-unstyled.components.mb-5 li:hover {
        background-color: #004d5b; /* Change to desired hover background color */
    }

    ul.list-unstyled.components.mb-5 li a:hover {
        color: #FFF !important; /* Change to desired hover text color */
    }
    /* Active class styles */
    ul.list-unstyled.components.mb-5 li.active {
        background-color: #004d5b; /* Change to desired active background color */
    }

        ul.list-unstyled.components.mb-5 li.active a {
            color: #FFF !important; /* Change to desired active text color */
        }

.btn-newman-lime {
    background-color: #AFCB37;
    border: none;
    color: #006379;  /*white;*/
    transition: background-color 0.3s ease;
}

    .btn-newman-lime:hover {
        background-color: #98B32D; /* Slightly darker shade for hover effect */
    }

/* Outline Button */
.btn-outline-newman-lime {
    color: #AFCB37 !important;
    border: 1px solid #AFCB37 !important;
    background-color: transparent !important;
    transition: all 0.3s ease;
}

    .btn-outline-newman-lime:hover,
    .btn-outline-newman-lime:focus {
        background-color: #AFCB37 !important;
        color: #006379 !important;
        border-color: #AFCB37 !important;
    }

    /* Checked / Active / Toggle States */
    .btn-check:active + .btn-outline-newman-lime,
    .btn-check:checked + .btn-outline-newman-lime,
    .btn-outline-newman-lime.active,
    .btn-outline-newman-lime.dropdown-toggle.show,
    .btn-outline-newman-lime:active {
        color: #006379 !important;
        background-color: #AFCB37 !important;
        border-color: #AFCB37 !important;
    }

.btn-newman-primary {
    background-color: #006379 !important;
    border: none;
    color: #AFCB37 !important;
    transition: background-color 0.3s ease;
}

    .btn-newman-primary:hover {
        background-color: #004d5b; /* Slightly darker shade for hover effect */
        color: white !important;
    }

.btn-newman-primary-outline {
    background-color: #AFCB37 !important;
    border: 2px solid #006379;
    color: #006379 !important;
    transition: background-color 0.3s ease;
}

    .btn-newman-primary-outline:hover {
        background-color: #006379 !important; /* Slightly darker shade for hover effect #004d5b */
        color: #AFCB37 !important;
    }

.btn-newman-forest {
    background-color: #40492A !important;
    border: none;
    color: white;
    transition: background-color 0.3s ease;
}

    .btn-newman-forest:hover {
        background-color: #2e361e; /* Slightly darker shade for hover effect */
    }
/* Outline Button */
.btn-outline-newman-forest {
    color: #40492A !important;
    border: 1px solid #40492A !important;
    background-color: transparent !important;
    transition: all 0.3s ease;
}

    .btn-outline-newman-forest:hover,
    .btn-outline-newman-forest:focus {
        background-color: #40492A !important;
        color: #fff !important;
        border-color: #40492A !important;
    }

    /* Checked / Active / Toggle States */
    .btn-check:active + .btn-outline-newman-forest,
    .btn-check:checked + .btn-outline-newman-forest,
    .btn-outline-newman-forest.active,
    .btn-outline-newman-forest.dropdown-toggle.show,
    .btn-outline-newman-forest:active {
        color: #fff !important;
        background-color: #40492A !important;
        border-color: #40492A !important;
    }



.btn-newman-lime-outline {
    color: #AFCB37 !important;
    border-color: #AFCB37 !important;
}

    .btn-newman-lime-outline:hover {
        background-color: #AFCB37 !important;
        color: white !important;
    }


/* Sand */
.bg-newman-sand {
    background-color: #C3B192 !important;
}

.color-newman-sand {
    color: #C3B192 !important;
}

.border-newman-sand {
    border-color: #C3B192 !important;
}

/* Lilac */
.bg-newman-lilac {
    background-color: #9A8597 !important;
}

.color-newman-lilac {
    color: #9A8597 !important;
}

.border-newman-lilac {
    border-color: #9A8597 !important;
}

/* Blueberry */
.bg-newman-blueberry {
    background-color: #002C4B !important;
}

.color-newman-blueberry {
    color: #002C4B !important;
}

.border-newman-blueberry {
    border-color: #002C4B !important;
}
.btn-newman-blueberry {
    background-color: #002C4B !important;
    border: none;
    color: white;
    transition: background-color 0.3s ease;
}

    .btn-newman-blueberry:hover {
        background-color: #001C34; /* Slightly darker shade for hover effect */
        color: white;
    }
.btn-outline-newman-blueberry {
    background-color: transparent;
    border: 2px solid #002C4B;
    color: #002C4B;
    transition: background-color 0.3s ease, color 0.3s ease;
}

    .btn-outline-newman-blueberry:hover {
        background-color: #002C4B;
        color: white;
    }


/* Stone */
.bg-newman-stone {
    background-color: #65696A !important;
}

.color-newman-stone {
    color: #65696A !important;
}

.border-newman-stone {
    border-color: #65696A !important;
}

/* Sky */
.bg-newman-sky {
    background-color: #82AEB3 !important;
}

.color-newman-sky {
    color: #82AEB3 !important;
}

.border-newman-sky {
    border-color: #82AEB3 !important;
}

/* Hover effect for newman-sand card */
.card.border-newman-sand:hover {
    background-color: #C3B192 !important; /* Matches the border-newman-sand color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-sand:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-sand:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-lilac card */
.card.border-newman-lilac:hover {
    background-color: #9A8597 !important; /* Matches the border-newman-lilac color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-lilac:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-lilac:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-blueberry card */
.card.border-newman-blueberry:hover {
    background-color: #002C4B !important; /* Matches the border-newman-blueberry color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-blueberry:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-blueberry:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-stone card */
.card.border-newman-stone:hover {
    background-color: #65696A !important; /* Matches the border-newman-stone color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-stone:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-stone:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-sky card */
.card.border-newman-sky:hover {
    background-color: #82AEB3 !important; /* Matches the border-newman-sky color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-sky:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-sky:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-olive card */
.card.border-newman-olive:hover {
    background-color: #8A9F61 !important; /* Matches the border-newman-olive color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-olive:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-olive:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-primary card */
.card.border-newman-primary:hover {
    background-color: #006379 !important; /* Matches the border-newman-primary color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-primary:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-primary:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-lime card */
.card.border-newman-lime:hover {
    background-color: #AFCB37 !important; /* Matches the border-newman-lime color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-lime:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-lime:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Hover effect for newman-forest card */
.card.border-newman-forest:hover {
    background-color: #40492A !important; /* Matches the border-newman-forest color */
    color: #FFFFFF !important; /* Change text color to white */
}

    .card.border-newman-forest:hover i {
        color: #FFFFFF !important; /* Change icon color to white */
    }

    .card.border-newman-forest:hover .clarendonfont {
        color: #FFFFFF !important; /* Change text color within clarendonfont span to white */
    }

/* Default page link color */
.custom-page-link {
    color: #198754 !important; /* Bootstrap success green text */
}

    /* Hover state */
    .custom-page-link:hover {
        background-color: #198754 !important; /* Green background on hover */
        color: white !important; /* White text on hover */
    }

/* Active page styling */
.page-item.active .custom-page-link {
    background-color: #198754 !important; /* Green background for active page */
    color: white !important; /* White text for active page */
    border-color: #198754 !important; /* Green border for active page */
}
.form-check-input:checked {
    background-color: #006379;
    border-color: #006379;
}

    .form-check-input:checked:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 99, 121, 0.25);
    }

    .form-check-input:checked + .form-check-label {
        color: #006379; /* Optional: Change the label text color when checked */
    }

.auto-renew-container {
    border-radius: 8px;
    background-color: #f8f9fa;
    padding: 1rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

    .auto-renew-container:hover {
        box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    }

#btnAutoApprove {
    transition: background-color 0.3s ease, color 0.3s ease;
}

    #btnAutoApprove:hover {
        background-color: #005a6f;
        color: white;
    }

.card-dashboard {
    border-radius: 0.5rem;
    transition: transform 0.2s, box-shadow 0.2s;
}

    .card-dashboard:hover {
        transform: translateY(-3px);
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
    }

    .card-dashboard .card-body {
        padding: 1.25rem 1rem;
    }

.dashboard-number {
    font-size: 1.5rem;
    font-weight: 700;
}

.dashboard-label {
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}

.card-icon {
    opacity: 0.85;
}

.assignment-card {
    border-left: 4px solid #007bff;
    transition: transform 0.2s, box-shadow 0.2s;
}

    .assignment-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.15);
    }

    .assignment-card .card-title {
        font-weight: 600;
    }

    .assignment-card p {
        font-size: 0.9rem;
    }

    .assignment-card .btn i {
        font-size: 0.85rem;
    }
.card-container {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.btn-confirm {
    margin-top: 1rem;
}
.due-date {
    font-size: 0.9rem;
    margin-bottom: 0.25rem;
}

.badge-proposed {
    background-color: #006379;/*// #28a745;*/
    color: white;
    font-size: 0.85rem;
    margin-left: 0.5rem;
}

.current-date {
    color: #6c757d;
}
.bg-grey {
    background-color: #6c757d !important;
}