body{
  font-size: 0.75rem !important;
}
body > main > div.container-fluid.py-2 > div > div > div > div.card-body.text-left > div:nth-child(1) > blockquote > h3,
body > main > div.container-fluid.py-2 > div > div > div > div.card-body.text-left > div:nth-child(2) > blockquote > h3 {
  font-size: 1.2rem !important;
}
body > main > div.container-fluid.py-2 > div > div > div > div.card-body.text-left > div > blockquote > ul{
  font-size: 0.9rem !important;
}

.btn-primary {
    --bs-btn-bg: unset !important;
    --bs-btn-border-color: unset !important;
}
.sidenav{
    background-color: #fff;
}
.sidenav .navbar-brand {
    height: 10em;
    margin: auto;
    text-align: center;
}
.navbar-vertical .navbar-brand>img, .navbar-vertical .navbar-brand-img {
    max-height: 3rem !important;
}
.navbar-vertical.navbar-expand-xs .navbar-collapse {
    height: 100% !important;
}
.input-group .input-group-text+.form-control {
    background: white;
}
.navbar-expand-lg .navbar-collapse {
    justify-content: flex-end;
}
.navbar-expand-lg .navbar-collapse .text-left {
    margin-right: 18px;
}
.navbar-vertical .navbar-nav>.nav-item .nav-link.bg-gradient-warning, .bg-primary {
    background-image: linear-gradient(310deg, #fbad57 0%, #ffffff 100%);
    border-radius: 10px;
}
body > main > div.container-fluid.py-4 > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div > div > div > div.col-8.text-start > h5,
body > main > div.container-fluid.py-4 > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div > div > div > div.col-8.text-start > span,
body > main > div.container-fluid.py-4 > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div > div > div > div.col-4 > p
{
  color: #2c2c2f !important;
}
.navbar-vertical .navbar-nav>.nav-item .nav-link.active .icon, .btn-primary {
    background-image: linear-gradient(310deg, #2b2863 3%, #6b6992 97%) !important;
}
div.container-fluid > div.table-settings.my-3 > div > div > div > div > a{
    background: #ffffff;
    border: #ffffff;
    border-radius: inherit;
    color: #2c2c2f;
    font-weight: 500;
}
textarea[rows="10"] {
    box-sizing: border-box;
    height: 96px;
    width: 50%;
}
input[type="text"], input[type="email"], input[type="password"], input[type="number"], textarea{
    width: 50% !important;
}
.btn {
    margin-bottom: unset !important;
}
.submit_btn {
    direction: unset !important;
}
body > main > div.container-fluid.py-2 > div.py-4.ms-4 > div > div.mb-3.mb-lg-0 > h1{
    display: none !important;
}
.card .card-header {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    background-color: #f2f4f6;
}
.card .card-header h2{
    font-size: x-large;
    color: #525252;
}
.card .module input[id^="id_subcategories-"],.card .module textarea[id^="id_subcategories-"],
.card .module input[id^="id_technical_sheets-"],.card .module textarea[id^="id_technical_sheets-"]{
    width: 100% !important;
}
form .aligned ul{
    margin-left: unset !important;
    padding-left: 1px !important;
}

/* Make the container a flex container in a column layout */
.errors {
    display: flex;
    flex-direction: column;
  }
  
  /* Set the inner div (containing label and input) to appear first */
  .errors > div {
    order: 1;
  }
  
  /* Set the error list to appear after the inner div */
  .errors > .errorlist {
    order: 2;
    margin-top: 10px;
  }
  
  .form-check {
    padding-left: 10px !important;
    }
    #changelist-form > div > table > thead > tr > th:nth-child(1) > div{
        margin-left: 6px;
    }

.table thead th{
    padding-left: 0.5rem !important;
}

/* Base table styling */
.table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    margin-bottom: 1rem;
    color: #343a40;
  }
  
  .table-hover tbody tr:hover {
    background-color: #f8f9fa;
  }
  
  /* Table Head */
  .table thead th {
    background-color: #f6f6f6;
    border-bottom: 1px solid #dee2e6;
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 700;
    color: #9ea1a6;
    letter-spacing: 0.5px;
    padding: 0.75rem;
  }
  
  /* Table Body */
  .table tbody tr {
    border-bottom: 1px solid #dee2e6;
  }
  
  .table tbody td {
    padding: 0.75rem;
    vertical-align: middle;
    font-size: 0.875rem;
    color: #333;
  }
  
  /* Avatar images */
  .avatar {
    border-radius: 50%;
    object-fit: cover;
  }
  
  .avatar-sm {
    width: 40px;
    height: 40px;
  }
  .field-image_tag img{
    border-radius: 10px;
    width: 43px;
    height: 43px;
  }
  /* Status badges */
  .badge {
    display: inline-block;
    padding: 0.35em 0.6em;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 0.375rem;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
  }
  
  .badge.bg-gradient-success {
    background: linear-gradient(90deg, #28a745, #218838);
  }
  
  .badge.bg-gradient-secondary {
    background: linear-gradient(90deg, #6c757d, #5a6268);
  }
  
  /* Utility classes (flex, text, spacing, etc.) */
  .d-flex {
    display: flex !important;
    align-items: center !important;
  }
  .me-3 {
    margin-right: 1rem !important;
  }
  .text-sm {
    font-size: 0.875rem !important;
  }
  .text-xs {
    font-size: 0.75rem !important;
  }
  .font-weight-bold {
    font-weight: 700 !important;
  }
  .text-secondary {
    color: #6c757d !important;
  }
  .mb-0 {
    margin-bottom: 0 !important;
  }
  .py-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }
  .px-2 {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
  #changelist-form > div > table > thead > tr a{
    color: #9ea1a6 !important;
  }
  .table>thead {
    vertical-align: unset !important;
}

.btn-success:not(:disabled):not(.disabled).active, .btn-success:not(:disabled):not(.disabled):active, .show>.btn-success.dropdown-toggle, .btn.bg-gradient-success:not(:disabled):not(.disabled).active, .btn.bg-gradient-success:not(:disabled):not(.disabled):active, .show>.btn.bg-gradient-success.dropdown-toggle {
    color: color-yiq(#fbad57);
    background-color: #fbad57 !important;
}
/* Make filter list items display in one line */
.filter_panel ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;  /* Makes items appear in one line */
  flex-wrap: wrap; /* Ensures responsiveness */
  gap: 10px;  /* Adds space between items */
}

/* Style filter links */
.filter_panel ul li a {
  text-decoration: none;
  color: #333;
  padding: 5px 15px;
  border-radius: 5px;
  background-color: #f5f5f5;
  transition: 0.3s;
  white-space: nowrap;  /* Prevents text from wrapping */
}

/* Highlight selected filter */
.filter_panel ul li.text-success a {
  background-image: linear-gradient(310deg, #2b2863 3%, #6b6992 97%) !important;
  color: #fff;
}
.filter_panel:not(:first-child) {
  margin-bottom: 3em;
}

#changelist-form * {
  font-size: 0.75rem !important;
}
#id_username, #id_password{
  width: 100% !important;
}