@media all and (min-width: 992px) {
     .navbar .nav-item .dropdown-menu{ display: none; }
     .navbar .nav-item:hover .nav-link{ color: #fff;  }
     .navbar .nav-item:hover .dropdown-menu{ display: block; }
     .navbar .nav-item .dropdown-menu{ margin-top:0; }
}

@media (min-width: 576px) {
    .card-columns {
        column-count: 2;
    }
}

@media (min-width: 768px) {
    .card-columns {
        column-count: 3;
    }
}

@media (min-width: 992px) {
    .card-columns {
        column-count: 4;
    }
}

@media (min-width: 1200px) {
    .card-columns {
        column-count: 4;
    }
}

html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    margin: 0;
}

input::-webkit-input-placeholder {
     color: #999999 !important;
     font-size: 0.875rem;
}

input:-ms-input-placeholder {
     color: #999999 !important;
     font-size: 0.875rem;
}

input::placeholder {
     color: #999999 !important;
     font-size: 0.875rem;
}

td {
  vertical-align: top !important;
}

.btn-cdci {
    background-color: #12213c;
    border-color: #12213c;
}

.breadcrumb {
     padding-bottom: 15px;
     padding-top: 15px;
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #e02e3b !important;
    color: #ffffff !important;
}

.dropdown-item:hover {
    background-color: #e02e3b;
    color: #ffffff !important;
}

.fs-7 {
  font-size: 0.85rem;
}

.hanging-list label {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    gap: 0.35rem;
}

.hanging-list .form-check-input {
    margin-top: 0.2rem;
}

.my-flex-card > div > div.card {
     color: rgb(0,0,0);
     height: calc(100% - 15px);
     margin-bottom: 15px;
}

.navbar .btn-nav {
    color: #fff !important;
}

.navbar .btn-nav:hover {
    color: #f8f9fa !important;
}

.note-frame {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.page-header {
     background-color: #e02e3b;
}

.page-footer {
    background-color: #12213c;
    padding: 10px 0;
    margin-top: auto;
}

/* Remove bullets from all levels */
.posts, .posts ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Base li styling */
.posts li {
    border-left: 4px solid var(--bs-danger);
    margin: 4px 0;
    padding-left: 4px;

    /* Top + bottom invisible borders */
    border-top: 2px solid transparent;
    border-bottom: 2px solid transparent;

    /* Nested items: no right border at all */
    border-right: none;

    transition: border-color .15s ease-in-out;
}

/* ? Top-level li: reserve space for right border */
.posts > li {
    border-right: 2px solid transparent; /* prevents movement */
}

/* Hover: top + bottom borders for ALL li */
.posts li:hover {
    border-top-color: var(--bs-danger);
    border-bottom-color: var(--bs-danger);
}

/* ? Only top-level li gets the right border on hover */
.posts > li:hover {
    border-right-color: var(--bs-danger);
}

/* The visible content box */
.posts .post-item {
    padding: 8px 16px;
    transition: background-color .15s ease-in-out;
}

/* Background highlight only on the post-item */
.posts li:hover > .post-item {
    background-color: rgba(220, 53, 69, 0.05);
}


.table-fixed-width {
  width: auto !important;      /* removes Bootstrap's 100% width */
  table-layout: fixed;         /* ensures columns obey fixed widths */
}

.table-fixed-width th {
  width: 200px;
}