/* Basic styles for dark theme */
body {
    background-color: #060d13 !important;
    color: #ffffff !important;
}

#wrapper {
    background-color: #060d13 !important;
}

.main-sidebar {
    background-color: #0f1419 !important;
}

.main-header {
    background-color: #0f1419 !important;
}

.content-wrapper {
    background-color: #060d13 !important;
    border-bottom: none !important;
}

.content {
    background-color: #060d13 !important;
    border-bottom: none !important;
}

/* Card styles */
.card {
    background-color: #0f1419 !important;
    border: 1px solid #1a1d23 !important;
}

.card-header {
    background-color: #1a1d23 !important;
    color: #00ff9d !important;
}

.card-body {
    background-color: #0f1419 !important;
    color: #ffffff !important;
}

/* Improved table styles */
.table {
    background-color: #0f1419 !important;
    color: #ffffff !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

.table thead th {
    background: #0f1419 !important;
    color: #00ff9d !important;
    border: none !important;
    padding: 16px 20px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    vertical-align: middle !important;
    text-align: center !important;
    position: relative !important;
    border-bottom: 2px solid #00ff9d !important;
}

.table thead th:first-child {
    border-top-left-radius: 8px !important;
}

.table thead th:last-child {
    border-top-right-radius: 8px !important;
}

.table tbody tr {
    background-color: #0f1419 !important;
    color: #ffffff !important;
    transition: all 0.3s ease !important;
}

.table tbody tr:nth-child(even) {
    background-color: #1a1d23 !important;
}

.table tbody tr:hover {
    background-color: #2a2d33 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0, 255, 157, 0.1) !important;
}

.table tbody td {
    border: none !important;
    padding: 16px 20px !important;
    vertical-align: middle !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    border-bottom: 1px solid #1a1d23 !important;
}

.table tbody tr:last-child td {
    border-bottom: none !important;
}

/* ID column - green highlighting */
.table tbody td:first-child {
    color: #00ff9d !important;
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* Enabled/disabled fields styles */
.table tbody td .fa-check,
.table tbody td .fa-times,
.table tbody td .fas.fa-check,
.table tbody td .fas.fa-times {
    font-size: 16px !important;
    font-weight: bold !important;
}

.table tbody td .fa-check,
.table tbody td .fas.fa-check {
    color: #00ff9d !important;
}

.table tbody td .fa-times,
.table tbody td .fas.fa-times {
    color: #dc3545 !important;
}

/* Checkboxes in tables styles */
.table tbody td input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    accent-color: #00ff9d !important;
    cursor: pointer !important;
}

/* Status badges styles */
.badge {
    padding: 6px 12px !important;
    border-radius: 20px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.badge-success,
.badge.bg-success {
    background-color: #00ff9d !important;
    color: #000000 !important;
}

.badge-danger,
.badge.bg-danger {
    background-color: #dc3545 !important;
    color: #ffffff !important;
}

.badge-warning,
.badge.bg-warning {
    background-color: #ffc107 !important;
    color: #000000 !important;
}

.badge-secondary,
.badge.bg-secondary {
    background-color: #6c757d !important;
    color: #ffffff !important;
}

/* Filter fields styles */
.filter-section {
    background-color: #0f1419 !important;
    border: 1px solid #1a1d23 !important;
    border-radius: 8px !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

.filter-row {
    display: flex !important;
    gap: 16px !important;
    align-items: end !important;
    flex-wrap: wrap !important;
}

.filter-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    min-width: 180px !important;
    flex: 1 !important;
}

.filter-group label {
    color: #00ff9d !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-bottom: 4px !important;
}

/* Form fields styles - dark theme */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="url"],
input[type="tel"],
input[type="search"],
input[type="date"],
input[type="datetime-local"],
input[type="time"],
textarea,
select {
    background-color: #1a1d23 !important;
    border: 2px solid #2a2d33 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="date"]:focus,
input[type="datetime-local"]:focus,
input[type="time"]:focus,
textarea:focus,
select:focus {
    background-color: #1a1d23 !important;
    border-color: #00ff9d !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(0, 255, 157, 0.2) !important;
    outline: none !important;
}

.form-control::placeholder,
input::placeholder,
textarea::placeholder {
    color: #6c757d !important;
    opacity: 0.7 !important;
}

/* Select fields styles - dark theme */
.form-select {
    background-color: #1a1d23 !important;
    border: 2px solid #2a2d33 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e") !important;
    background-position: right 12px center !important;
    background-repeat: no-repeat !important;
    background-size: 16px 12px !important;
    padding-right: 40px !important;
}

.form-select:focus {
    background-color: #1a1d23 !important;
    border-color: #00ff9d !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(0, 255, 157, 0.2) !important;
    outline: none !important;
}

/* Select2 autocomplete styles */
.select2-container--default .select2-selection--single {
    background-color: #1a1d23 !important;
    border: 2px solid #2a2d33 !important;
    border-radius: 6px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding-left: 16px !important;
    padding-right: 40px !important;
    line-height: 1.5 !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: #6c757d !important;
    opacity: 0.7 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 46px !important;
    width: 30px !important;
    right: 8px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #ffffff transparent transparent transparent !important;
    border-style: solid !important;
    border-width: 5px 4px 0 4px !important;
    height: 0 !important;
    left: 50% !important;
    margin-left: -4px !important;
    margin-top: -2px !important;
    position: absolute !important;
    top: 50% !important;
    width: 0 !important;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #ffffff transparent !important;
    border-width: 0 4px 5px 4px !important;
}

.select2-container--default .select2-dropdown {
    background-color: #1a1d23 !important;
    border: 2px solid #00ff9d !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0, 255, 157, 0.2) !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: #0f1419 !important;
    border: 1px solid #2a2d33 !important;
    color: #ffffff !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #00ff9d !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0, 255, 157, 0.2) !important;
}

.select2-container--default .select2-results__option {
    color: #ffffff !important;
    padding: 8px 16px !important;
    font-size: 14px !important;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #00ff9d !important;
    color: #000000 !important;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #2a2d33 !important;
    color: #00ff9d !important;
}

.select2-container--default .select2-results__option[aria-selected=true]:hover {
    background-color: #00ff9d !important;
    color: #000000 !important;
}

/* Buttons styles */
.btn-primary {
    background: linear-gradient(135deg, #00ff9d 0%, #00cc7e 100%) !important;
    border: none !important;
    color: #060d13 !important;
    border-radius: 6px !important;
    padding: 12px 24px !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    box-shadow: 0 4px 8px rgba(0, 255, 157, 0.3) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #00cc7e 0%, #00995f 100%) !important;
    color: #060d13 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 12px rgba(0, 255, 157, 0.4) !important;
}

.btn-primary:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 4px rgba(0, 255, 157, 0.3) !important;
}

/* Improved labels styles */
label {
    color: #00ff9d !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-bottom: 8px !important;
    display: block !important;
}

/* Fields group styles */
.form-group {
    margin-bottom: 20px !important;
}

/* Help-text styles */
.help-text {
    color: #6c757d !important;
    font-size: 12px !important;
    margin-top: 4px !important;
}

/* Errors styles */
.field-error {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2) !important;
}

.errorlist {
    color: #dc3545 !important;
    font-size: 12px !important;
    margin-top: 4px !important;
    list-style: none !important;
    padding: 0 !important;
}

/* Inline form styles */
.inline-group {
    background-color: #0f1419 !important;
    border: 1px solid #1a1d23 !important;
    border-radius: 6px !important;
    padding: 16px !important;
    margin-bottom: 16px !important;
}

.inline-related h3 {
    color: #00ff9d !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin-bottom: 16px !important;
}

/* Admin forms styles */
.form-row {
    margin-bottom: 16px !important;
}

.form-row label {
    display: block !important;
    margin-bottom: 6px !important;
}

/* Readonly fields styles */
.form-control[readonly],
input[readonly],
textarea[readonly] {
    background-color: #2a2d33 !important;
    color: #6c757d !important;
    border-color: #1a1d23 !important;
}

/* Disabled fields styles */
.form-control:disabled,
input:disabled,
textarea:disabled,
select:disabled {
    background-color: #2a2d33 !important;
    color: #6c757d !important;
    border-color: #1a1d23 !important;
    cursor: not-allowed !important;
}

/* Django admin specific elements styles */
.vTextField,
.vIntegerField,
.vDecimalField,
.vURLField,
.vEmailField,
.vTextField,
.vLargeTextField,
.vSmallTextField,
.vBigIntegerField,
.vPositiveIntegerField,
.vPositiveSmallIntegerField,
.vSlugField,
.vTimeField,
.vDateField,
.vDateTimeField,
.vFileField,
.vImageField,
.vFilePathField,
.vCommaSeparatedIntegerField,
.vFloatField,
.vNullBooleanField,
.vBooleanField,
.vCharField,
.vTextField,
.vURLField,
.vEmailField,
.vSlugField,
.vFilePathField,
.vCommaSeparatedIntegerField,
.vIPAddressField,
.vGenericIPAddressField,
.vTimeField,
.vDateField,
.vDateTimeField,
.vDurationField,
.vUUIDField,
.vBinaryField {
    background-color: #1a1d23 !important;
    border: 2px solid #2a2d33 !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    padding: 12px 16px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

.vTextField:focus,
.vIntegerField:focus,
.vDecimalField:focus,
.vURLField:focus,
.vEmailField:focus,
.vTextField:focus,
.vLargeTextField:focus,
.vSmallTextField:focus,
.vBigIntegerField:focus,
.vPositiveIntegerField:focus,
.vPositiveSmallIntegerField:focus,
.vSlugField:focus,
.vTimeField:focus,
.vDateField:focus,
.vDateTimeField:focus,
.vFileField:focus,
.vImageField:focus,
.vFilePathField:focus,
.vCommaSeparatedIntegerField:focus,
.vFloatField:focus,
.vNullBooleanField:focus,
.vBooleanField:focus,
.vCharField:focus,
.vTextField:focus,
.vURLField:focus,
.vEmailField:focus,
.vSlugField:focus,
.vFilePathField:focus,
.vCommaSeparatedIntegerField:focus,
.vIPAddressField:focus,
.vGenericIPAddressField:focus,
.vTimeField:focus,
.vDateField:focus,
.vDateTimeField:focus,
.vDurationField:focus,
.vUUIDField:focus,
.vBinaryField:focus {
    background-color: #1a1d23 !important;
    border-color: #00ff9d !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 3px rgba(0, 255, 157, 0.2) !important;
    outline: none !important;
}

/* Required fields styles */
.required label::after {
    content: " *" !important;
    color: #dc3545 !important;
}

/* Page headers styles */
.content-header h1 {
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

/* Breadcrumb styles */
.breadcrumb {
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}

.breadcrumb-item a {
    color: #00ff9d !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.breadcrumb-item.active {
    color: #ffffff !important;
    font-weight: 600 !important;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: #ffffff !important;
    content: ">" !important;
    font-weight: 600 !important;
}

/* Footer styles */
footer {
    background: linear-gradient(135deg, #0f1419 0%, #1a1d23 100%) !important;
    border-top: 2px solid #00ff9d !important;
    padding: 20px 0 !important;
    margin-top: 0 !important;
    box-shadow: 0 -4px 12px rgba(0, 255, 157, 0.1) !important;
}

/* Remove grey stripe above footer */
#wrapper {
    border-bottom: none !important;
}

.main-content {
    border-bottom: none !important;
    margin-bottom: 0 !important;
}

.content-header {
    border-bottom: none !important;
    margin-bottom: 0 !important;
}

footer .container {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

footer .float-left {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-align: left !important;
}

footer .float-left a {
    color: #00ff9d !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

footer .float-left a:hover {
    color: #00cc7e !important;
    text-decoration: underline !important;
}

footer .float-right {
    display: none !important;
}



/* Mobile footer styles */
@media (max-width: 768px) {
    footer .container {
        flex-direction: column !important;
        text-align: center !important;
        gap: 12px !important;
        padding: 0 16px !important;
    }

    footer .float-left {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* Responsiveness */
@media (max-width: 768px) {
    .filter-row {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .filter-group {
        min-width: auto !important;
    }

    .table {
        font-size: 12px !important;
    }

    .table thead th,
    .table tbody td {
        padding: 12px 8px !important;
    }
}