/* Modern Grey-Black Theme - High Contrast for Readability */

/* ===================================
   BASE COLORS & BACKGROUND
   =================================== */

body {
    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a1a 100%) !important;
    color: #e8e8e8 !important;
}

.container {
    background-color: #1e1e1e !important;
    border: 1px solid #3a3a3a !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6) !important;
}

/* ===================================
   TYPOGRAPHY
   =================================== */

h1, h2, h3, h4, h5, h6 {
    color: #f5f5f5 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}

p, span, div, li {
    color: #d4d4d4 !important;
}

.form-section .panel-title a {
    color: #ffffff !important;
}

small, .small {
    color: #b0b0b0 !important;
}

strong, b {
    color: #f0f0f0 !important;
}

/* ===================================
   NAVIGATION TABS
   =================================== */

.panel-heading {
    background: linear-gradient(135deg, #252525 0%, #1a1a1a 100%) !important;
    border-bottom: 2px solid #404040 !important;
}

.nav-tabs {
    border-bottom: 2px solid #404040 !important;
}

.nav-tabs .nav-link {
    color: #b8b8b8 !important;
    background-color: transparent !important;
    border-color: transparent !important;
}

.nav-tabs .nav-link:hover {
    background-color: #2a2a2a !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}

.nav-tabs .nav-link.active {
    background: linear-gradient(135deg, #2d2d2d 0%, #1f1f1f 100%) !important;
    color: #ffffff !important;
    border-color: #404040 #404040 transparent !important;
    font-weight: 600 !important;
}

/* ===================================
   PANELS & SECTIONS
   =================================== */

.panel-body {
    background-color: #1a1a1a !important;
    color: #d4d4d4 !important;
}

.form-section {
    border: 1px solid #3a3a3a !important;
    background-color: #1a1a1a !important;
}

.panel.with-tabs {
    background-color: #1e1e1e !important;
}

/* ===================================
   FORM ELEMENTS
   =================================== */

.form-group label {
    color: #e0e0e0 !important;
    font-weight: 500 !important;
}

.form-control {
    background-color: #2a2a2a !important;
    border: 2px solid #404040 !important;
    color: #f0f0f0 !important;
}

.form-control:focus {
    border-color: #5a5a5a !important;
    background-color: #333333 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.2rem rgba(90, 90, 90, 0.25) !important;
}

.form-control::placeholder {
    color: #808080 !important;
}

.form-control:disabled,
.form-control[readonly] {
    background-color: #222222 !important;
    color: #999999 !important;
}

select.form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23e0e0e0' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
}

textarea.form-control {
    color: #f0f0f0 !important;
}

/* ===================================
   CHECKBOXES & RADIOS
   =================================== */

.form-check-label {
    color: #d4d4d4 !important;
    cursor: pointer !important;
}

.form-check-input {
    cursor: pointer !important;
    border-color: #606060 !important;
}

/* ===================================
   BUTTONS
   =================================== */

.btn-primary {
    background: linear-gradient(135deg, #3a3a3a 0%, #2a2a2a 100%) !important;
    border: 1px solid #505050 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #4a4a4a 0%, #3a3a3a 100%) !important;
    border-color: #606060 !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.7) !important;
}

.btn-secondary {
    background: linear-gradient(135deg, #404040 0%, #2f2f2f 100%) !important;
    border: 1px solid #555555 !important;
    color: #e8e8e8 !important;
}

.btn-secondary:hover {
    background: linear-gradient(135deg, #505050 0%, #3f3f3f 100%) !important;
    color: #ffffff !important;
}

.btn-success {
    background: linear-gradient(135deg, #28a745 0%, #218838 100%) !important;
    border: 1px solid #28a745 !important;
    color: #ffffff !important;
}

.btn-success:hover {
    background: linear-gradient(135deg, #2dbd4e 0%, #28a745 100%) !important;
    color: #ffffff !important;
}

.btn-warning {
    background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%) !important;
    border: 1px solid #ffc107 !important;
    color: #212529 !important;
}

.btn-warning:hover {
    background: linear-gradient(135deg, #ffcd39 0%, #ffc107 100%) !important;
    color: #000000 !important;
}

.btn-danger {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%) !important;
    border: 1px solid #dc3545 !important;
    color: #ffffff !important;
}

.btn-danger:hover {
    background: linear-gradient(135deg, #e4606d 0%, #dc3545 100%) !important;
    color: #ffffff !important;
}

.btn-info {
    background: linear-gradient(135deg, #17a2b8 0%, #138496 100%) !important;
    border: 1px solid #17a2b8 !important;
    color: #ffffff !important;
}

.btn-info:hover {
    background: linear-gradient(135deg, #1fc8e3 0%, #17a2b8 100%) !important;
    color: #ffffff !important;
}

/* ===================================
   ALERTS
   =================================== */

.alert {
    border: 1px solid #404040 !important;
    border-radius: 8px !important;
}

.alert-success {
    background: linear-gradient(135deg, #1e3a24 0%, #1a3020 100%) !important;
    color: #a8e6a3 !important;
    border-left: 4px solid #28a745 !important;
}

.alert-info {
    background: linear-gradient(135deg, #1a3942 0%, #163238 100%) !important;
    color: #a3d9e8 !important;
    border-left: 4px solid #17a2b8 !important;
}

.alert-warning {
    background: linear-gradient(135deg, #4a3f1a 0%, #3f3616 100%) !important;
    color: #ffe69c !important;
    border-left: 4px solid #ffc107 !important;
}

.alert-danger {
    background: linear-gradient(135deg, #3d1a1e 0%, #33161a 100%) !important;
    color: #f5a5ad !important;
    border-left: 4px solid #dc3545 !important;
}

.alert-heading {
    color: #ffffff !important;
}

/* ===================================
   TEXT UTILITIES
   =================================== */

.text-danger {
    color: #ff6b6b !important;
}

.text-success {
    color: #51cf66 !important;
}

.text-warning {
    color: #ffd43b !important;
}

.text-info {
    color: #4dabf7 !important;
}

.text-muted {
    color: #868e96 !important;
}

.text-white {
    color: #ffffff !important;
}

/* ===================================
   CARDS (for admin and other pages)
   =================================== */

.card {
    background-color: #1e1e1e !important;
    border: 1px solid #3a3a3a !important;
    color: #e8e8e8 !important;
}

.card-header {
    background: linear-gradient(135deg, #252525 0%, #1a1a1a 100%) !important;
    border-bottom: 1px solid #404040 !important;
    color: #f5f5f5 !important;
}

.card-body {
    background-color: #1a1a1a !important;
    color: #d4d4d4 !important;
}

/* ===================================
   TABLES
   =================================== */

.table {
    color: #e8e8e8 !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #202020 !important;
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: #1a1a1a !important;
}

.table thead th {
    background-color: #2a2a2a !important;
    color: #f5f5f5 !important;
    border-color: #404040 !important;
}

.table td, .table th {
    border-color: #3a3a3a !important;
    color: #e8e8e8 !important;
}

.table-hover tbody tr:hover {
    background-color: #252525 !important;
}

/* ===================================
   MODALS
   =================================== */

.modal-content {
    background-color: #1e1e1e !important;
    border: 1px solid #3a3a3a !important;
    color: #e8e8e8 !important;
}

.modal-header {
    border-bottom: 1px solid #404040 !important;
}

.modal-footer {
    border-top: 1px solid #404040 !important;
}

.modal-title {
    color: #f5f5f5 !important;
}

.close {
    color: #e8e8e8 !important;
    text-shadow: 0 1px 0 #000 !important;
}

/* ===================================
   LINKS
   =================================== */

a {
    color: #6ea8fe !important;
}

a:hover {
    color: #9ec5fe !important;
}

.alert-link {
    color: #a3d9e8 !important;
    font-weight: 600 !important;
}

/* ===================================
   PROGRESS BARS
   =================================== */

.progress {
    background-color: #2a2a2a !important;
    border: 1px solid #404040 !important;
}

.progress-bar {
    color: #ffffff !important;
}

/* ===================================
   BADGES
   =================================== */

.badge-success {
    background-color: #28a745 !important;
    color: #ffffff !important;
}

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

.badge-warning {
    background-color: #ffc107 !important;
    color: #212529 !important;
}

.badge-info {
    background-color: #17a2b8 !important;
    color: #ffffff !important;
}
