/* Autumn Theme CSS */

/* Main Body & Backgrounds */
body {
  background: linear-gradient(135deg, #1a0a00 0%, #0f0500 100%) !important;
}

.container {
  background-color: #0a0500 !important;
}

/* Dashboard Container */
.dashboard-container {
  background: transparent !important;
}

/* Header Sections */
.header-section {
  background: linear-gradient(135deg, #2d1b00 0%, #1f1200 100%) !important;
  border: 1px solid #4a2800 !important;
  box-shadow: 0 8px 32px rgba(255, 102, 0, 0.2) !important;
}

.header-section::before {
  background: linear-gradient(90deg, #cc5500, #dd6611, #bb4400) !important;
}

/* Welcome Card (Homepage) */
.welcome-card {
  background-color: rgba(26, 10, 0, 0.85) !important;
  border: 1px solid rgba(204, 85, 0, 0.2) !important;
  box-shadow: 0 15px 35px rgba(204, 85, 0, 0.2) !important;
}

/* Text Colors */
.welcome-text h1,
.header-section h1 {
  color: #e89b5c !important;
  background: linear-gradient(135deg, #e89b5c, #f0ad72) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

.welcome-title {
  color: #e89b5c !important;
}

.welcome-text,
.header-subtitle {
  color: #d4a574 !important;
}

/* Stats Cards */
.stat-card {
  background: rgba(204, 85, 0, 0.15) !important;
  border: 1px solid rgba(204, 85, 0, 0.3) !important;
}

.stat-card:hover {
  background: rgba(204, 85, 0, 0.25) !important;
  box-shadow: 0 4px 15px rgba(204, 85, 0, 0.3) !important;
}

.stat-number {
  color: #e89b5c !important;
}

.stat-label {
  color: #d4a574 !important;
}

/* Slots/World Cards */
.slot,
.world {
  background: linear-gradient(135deg, #2d1b00, #1f1200) !important;
  border: 1px solid #4a2800 !important;
  box-shadow: 0 4px 20px rgba(204, 85, 0, 0.2) !important;
}

.slot::before,
.world::before {
  background: linear-gradient(90deg, #cc5500, #bb4400) !important;
}

.slot:hover,
.world:hover {
  border-color: #cc5500 !important;
  box-shadow: 0 12px 40px rgba(204, 85, 0, 0.3) !important;
}

/* Slot/World Titles */
.slot-title,
.world-title {
  color: #e89b5c !important;
}

.world-title i {
  color: #d9864d !important;
}

.slot-status {
  background: rgba(204, 85, 0, 0.2) !important;
  color: #e89b5c !important;
}

/* Version Badge */
.world-version {
  color: #d9864d !important;
  background: rgba(217, 134, 77, 0.15) !important;
}

/* Meta Values & Links */
.meta-value {
  color: #d4a574 !important;
}

.meta-value a,
.copy-link {
  color: #d9864d !important;
}

.meta-value a:hover,
.copy-link:hover {
  color: #e89b5c !important;
}

/* Buttons */
.button {
  background: linear-gradient(135deg, #4a2800, #5a3000) !important;
}

.button:hover {
  background: linear-gradient(135deg, #5a3000, #6a3800) !important;
  box-shadow: 0 6px 20px rgba(204, 85, 0, 0.3) !important;
}

.button.primary {
  background: linear-gradient(135deg, #cc5500, #bb4400) !important;
}

.button.primary:hover {
  background: linear-gradient(135deg, #dd6611, #cc5500) !important;
  box-shadow: 0 8px 25px rgba(204, 85, 0, 0.4) !important;
}

.button.delete {
  background: linear-gradient(135deg, #8b0000, #660000) !important;
}

.button.delete:hover {
  background: linear-gradient(135deg, #a00000, #770000) !important;
}

/* Download Link */
.download-link {
  background: linear-gradient(135deg, #cc5500, #bb4400) !important;
}

.download-link:hover {
  background: linear-gradient(135deg, #dd6611, #cc5500) !important;
  box-shadow: 0 6px 20px rgba(204, 85, 0, 0.4) !important;
}

/* Empty State */
.empty-state {
  background: linear-gradient(135deg, #2d1b00, #1f1200) !important;
  border: 2px dashed #4a2800 !important;
}

.empty-state i {
  color: #4a2800 !important;
}

.empty-state h3 {
  color: #d4a574 !important;
}

/* Modal */
.modal {
  background-color: rgba(10, 5, 0, 0.95) !important;
}

.modal-content {
  background: linear-gradient(135deg, #2d1b00, #1f1200) !important;
  border: 1px solid #4a2800 !important;
  box-shadow: 0 25px 80px rgba(204, 85, 0, 0.3) !important;
}

.modal-content h2 {
  color: #e89b5c !important;
}

.close {
  color: #d4a574 !important;
  background: rgba(204, 85, 0, 0.1) !important;
}

.close:hover {
  color: #e89b5c !important;
  background: rgba(204, 85, 0, 0.2) !important;
}

/* Form Inputs */
.modal-content input[type="text"],
.modal-content input[type="url"],
.modal-content input[type="file"],
.modal-content input[type="date"] {
  background: rgba(10, 5, 0, 0.5) !important;
  border: 1px solid #4a2800 !important;
  color: #d4a574 !important;
}

.modal-content input:focus {
  border-color: #cc5500 !important;
  background: rgba(10, 5, 0, 0.6) !important;
  box-shadow: 0 0 0 3px rgba(204, 85, 0, 0.15) !important;
}

.modal-content input::placeholder {
  color: rgba(212, 165, 116, 0.5) !important;
}

/* Radio Group */
.radio-group {
  background: rgba(10, 5, 0, 0.3) !important;
  border: 1px solid #4a2800 !important;
}

.radio-group input[type="radio"] {
  accent-color: #cc5500 !important;
}

/* Sidebar/Navbar */
.sidebar {
  background: linear-gradient(180deg, #2d1b00 0%, #1f1200 50%, #1a0a00 100%) !important;
  border-right: 3px solid #4a2800 !important;
  box-shadow: 2px 0 20px rgba(204, 85, 0, 0.2) !important;
}

.logo {
  color: #e89b5c !important;
  border-bottom: 1px solid rgba(204, 85, 0, 0.2) !important;
}

.logo:hover {
  color: #f0ad72 !important;
}

.logo-avatar {
  border: 2px solid rgba(204, 85, 0, 0.3) !important;
}

.logo:hover .logo-avatar {
  border-color: #cc5500 !important;
}

.nav-link {
  color: rgba(212, 165, 116, 0.9) !important;
}

.nav-link:hover {
  color: #e89b5c !important;
  background-color: rgba(204, 85, 0, 0.15) !important;
}

.dropdown-menu {
  background: linear-gradient(135deg, #2d1b00 0%, #1f1200 100%) !important;
  border: 1px solid rgba(204, 85, 0, 0.2) !important;
  box-shadow: 0 8px 32px rgba(204, 85, 0, 0.3) !important;
}

.dropdown-item {
  color: rgba(212, 165, 116, 0.9) !important;
}

.dropdown-item:hover {
  background-color: rgba(204, 85, 0, 0.2) !important;
  color: #e89b5c !important;
}

.nav-divider {
  background: linear-gradient(90deg, transparent, rgba(204, 85, 0, 0.3), transparent) !important;
}

/* Navbar Modal */
.navbar-modal {
  background: rgba(10, 5, 0, 0.9) !important;
}

.navbar-modal-content {
  background: linear-gradient(135deg, #2d1b00 0%, #1f1200 100%) !important;
  border: 1px solid rgba(204, 85, 0, 0.2) !important;
  box-shadow: 0 20px 60px rgba(204, 85, 0, 0.3) !important;
}

.navbar-modal-content h2 {
  color: #e89b5c !important;
}

.navbar-modal-content input {
  background: rgba(10, 5, 0, 0.3) !important;
  border: 1px solid rgba(204, 85, 0, 0.3) !important;
  color: #d4a574 !important;
}

.navbar-modal-content input:focus {
  border-color: #cc5500 !important;
  background: rgba(10, 5, 0, 0.4) !important;
}

.navbar-modal-content input::placeholder {
  color: rgba(212, 165, 116, 0.5) !important;
}

.navbar-modal-content button {
  background: linear-gradient(135deg, #cc5500 0%, #bb4400 100%) !important;
}

.navbar-modal-content button:hover {
  background: linear-gradient(135deg, #dd6611 0%, #cc5500 100%) !important;
  box-shadow: 0 8px 20px rgba(204, 85, 0, 0.4) !important;
}

/* Footer */
.footer {
  background-color: rgba(26, 10, 0, 0.9) !important;
  color: #d4a574 !important;
}

/* Loading Spinner */
.spinner {
  border: 3px solid #4a2800 !important;
  border-top: 3px solid #cc5500 !important;
}

/* Featured Worlds */
.featured-world {
  border: 2px solid #d9864d !important;
  background: linear-gradient(135deg, #3d2400, #2d1800) !important;
  box-shadow: 0 6px 25px rgba(217, 134, 77, 0.2) !important;
}

.featured-world::before {
  background: linear-gradient(90deg, #d9864d, #e89b5c) !important;
}

.featured-world:hover {
  border-color: #e89b5c !important;
  box-shadow: 0 10px 35px rgba(217, 134, 77, 0.3) !important;
}

.section-header h2 {
  color: #d9864d !important;
}

.section-header h2 i {
  color: #d9864d !important;
}