/* Dark Mode For Profile Page */

.dark-mode .profile_1-5008 {
  background-color: #1a1a1a !important;
  color: #e0e0e0 !important;
  transition: background-color 0.3s ease, color 0.3s ease !important;

  /* Enhanced Breadcrumb Styling */
  .breadcrumb {
    color: #e0e0e0 !important;

    .text-shop_1-1940,
    .text-men-s-fashion_1-1942 {
      color: #e0e0e0 !important;
    }

    .left--stroke-_1-1941 svg path {
      fill: #b0b0b0 !important;
    }
  }

  /* Profile Sidebar Styling */
  .wishlist-container {
    background-color: #1a1a1a !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4) !important;

    .sidebar {
      background-color: rgba(45, 45, 45, 0.5) !important;
      border-right: 1px solid #333333 !important;

      ul li {
        a.menu-item {
          color: #e0e0e0 !important;
          transition: all 0.3s ease !important;

          i {
            color: #b0b0b0 !important;
            transition: color 0.3s ease !important;
          }

          &:hover {
            background-color: #404040 !important;
            color: #d9b69b !important;
            transform: translateX(5px) !important;

            i {
              color: #d9b69b !important;
            }
          }
        }

        &.active a {
          background-color: #404040 !important;
          color: #d9b69b !important;
          font-weight: bold;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3) !important;

          i {
            color: #d9b69b !important;
          }
        }
      }
    }
  }

  /* Nav Tabs for Orders */
  .nav-tabs {
    border-bottom-color: #404040 !important;

    .nav-link {
      color: #b0b0b0 !important;
      background-color: transparent !important;
      border-color: transparent !important;
      transition: all 0.3s ease !important;

      &:hover {
        color: #e0e0e0 !important;
        border-color: #505050 #505050 #404040 !important;
      }

      &.active {
        color: #d9b69b !important;
        background-color: #2d2d2d !important;
        border-color: #505050 #505050 #2d2d2d !important;
      }
    }
  }

  /* Order Cards */
  .order-card-list {
    .card-body {
      background-color: #2d2d2d !important;
      color: #e0e0e0 !important;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;

      .col-12 {
        background-color: #333333 !important;
        border-radius: 6px !important;
      }

      strong {
        color: #e0e0e0 !important;
      }

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

      h4 {
        color: #e0e0e0 !important;
      }

      .product-details p {
        color: #b0b0b0 !important;
      }

      .btn-outline-secondary {
        color: #b0b0b0 !important;
        border-color: #505050 !important;
        transition: all 0.3s ease !important;

        &:hover {
          background-color: #404040 !important;
          color: #e0e0e0 !important;
        }
      }

      .btn-warning {
        background-color: #d9b69b !important;
        border-color: #c17a2e !important;
        color: #1a1a1a !important;
        transition: all 0.3s ease !important;

        &:hover {
          background-color: #c17a2e !important;
          transform: translateY(-2px) !important;
        }

        &:disabled {
          background-color: #5d5143 !important;
          border-color: #5d5143 !important;
          color: #909090 !important;
          transform: none !important;
        }
      }

      .btn-dark {
        background-color: #404040 !important;
        border-color: #505050 !important;
        color: #e0e0e0 !important;
        transition: all 0.3s ease !important;

        &:hover {
          background-color: #505050 !important;
          transform: translateY(-2px) !important;
        }
      }
    }
  }

  /* Quantity Controls */
  .quantity-selector {
    .quantity-controls {
      background-color: #333333 !important;
      border-color: #505050 !important;

      .quantity-btn {
        color: #e0e0e0 !important;
        background-color: #404040 !important;
        transition: all 0.3s ease !important;

        &:hover:not(:disabled) {
          background-color: #505050 !important;
        }

        &:disabled {
          color: #909090 !important;
          background-color: #333333 !important;
        }
      }

      .quantity-input {
        background-color: #2d2d2d !important;
        color: #e0e0e0 !important;
        border-color: #505050 !important;
      }
    }
  }

  /* Empty Orders Message */
  .empty-cart-img {
    opacity: 0.8 !important;
    filter: brightness(0.8) contrast(1.2) !important;
    transition: all 0.5s ease !important;

    &:hover {
      opacity: 1 !important;
      filter: brightness(0.9) contrast(1.3) !important;
    }
  }

  h2,
  h6 {
    color: #e0e0e0 !important;
  }

  .btn-primary {
    background-color: #d9b69b !important;
    border-color: #c17a2e !important;
    color: #1a1a1a !important;
    transition: all 0.3s ease !important;

    &:hover {
      background-color: #c17a2e !important;
      transform: translateY(-2px) !important;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
    }
  }

  /* My Info Section - Enhanced */
  .container {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;

    .card-body{
      
      .addressHeader {
        color: #e0e0e0 !important;

      }
    }
    .section-title {
      border-bottom: 1px solid #404040 !important;

      h2 {
        color: #d9b69b !important;
      }

      .edit-btn {
        background-color: #404040 !important;
        color: #e0e0e0 !important;
        border: 1px solid #505050 !important;
        transition: all 0.3s ease !important;

        &:hover {
          background-color: #505050 !important;
          color: #d9b69b !important;
        }
      }
    }

    .form-group {
      margin-bottom: 1.5rem !important;

      label {
        color: #b0b0b0 !important;
      }

      input,
      select,
      textarea,
      .ng-select .ng-select-container {
        background-color: #333333 !important;
        color: #e0e0e0 !important;
        border-color: #505050 !important;
        transition: all 0.3s ease !important;

        &::placeholder {
          color: #909090 !important;
        }

        &:focus {
          border-color: #d9b69b !important;
          box-shadow: 0 0 0 0.2rem rgba(217, 182, 155, 0.25) !important;
        }

        &:disabled {
          background-color: #2a2a2a !important;
          color: #909090 !important;
          border-color: #404040 !important;
        }
      }
    }

    .input-group {
      input {
        background-color: #333333 !important;
        color: #e0e0e0 !important;
        border-color: #505050 !important;
      }
    }

    /* Business Type Selection */
    .address-card {
      background-color: #333333 !important;
      border: 1px solid #404040 !important;
      border-radius: 8px !important;
      padding: 1rem !important;
      margin-bottom: 1.5rem !important;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
      transition: all 0.3s ease !important;

      &:hover {
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
        transform: translateY(-2px) !important;
      }

      .fs-5 {
        color: #d9b69b !important;
      }

      .businessType {
        color: #e0e0e0 !important;
      }

      .form-check-input {
        background-color: #404040 !important;
        border-color: #505050 !important;

        &:checked {
          background-color: #d9b69b !important;
          border-color: #c17a2e !important;
        }
      }

      h2 {
        color: #d9b69b !important;
      }

      p {
        color: #b0b0b0 !important;
      }

      .address-actions {
        .edit-btn {
          background-color: #404040 !important;
          color: #e0e0e0 !important;
          border: 1px solid #505050 !important;
          transition: all 0.3s ease !important;

          &:hover {
            background-color: #505050 !important;
            color: #d9b69b !important;
          }
        }

        .btn {
          color: #b0b0b0 !important;
          transition: all 0.3s ease !important;

          &:hover {
            color: #d9b69b !important;
          }
        }
      }
    }

    /* Upload Input Styling */
    .upload-input {
      background-color: #333333 !important;
      color: #e0e0e0 !important;
      border-color: #505050 !important;
      transition: all 0.3s ease !important;

      &:hover {
        background-color: #404040 !important;
        border-color: #d9b69b !important;
      }
    }

    .upload-icon {
      color: #d9b69b !important;
    }

    /* User Image */
    .userImg {
      border: 3px solid #d9b69b !important;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
      transition: all 0.3s ease !important;

      &:hover {
        transform: scale(1.05) !important;
      }
    }
  }

  /* Order Details View */
  .order-details-container {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    padding: 1.5rem !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;

    h2 {
      color: #d9b69b !important;
    }

    .order-summary {
      background-color: #333333 !important;
      border-radius: 8px !important;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;

      .order-info {
        p {
          color: #b0b0b0 !important;

          strong {
            color: #e0e0e0 !important;
          }

          .total {
            color: #d9b69b !important;
          }
        }
      }
    }

    .order-progress {
      .progress-bar {
        background-color: #333333 !important;
        border-radius: 30px !important;
        padding: 1rem !important;
        margin: 2rem 0 !important;

        .step {
          color: #b0b0b0 !important;

          .circle {
            background-color: #404040 !important;
            border: 2px solid #505050 !important;
          }

          &.completed .circle {
            background-color: #d9b69b !important;
            border-color: #c17a2e !important;
          }

          &.active .circle {
            background-color: #505050 !important;
            border-color: #d9b69b !important;
          }

          p {
            color: #b0b0b0 !important;
          }

          &.completed p,
          &.active p {
            color: #e0e0e0 !important;
          }
        }
      }
    }

    .text-primary {
      color: #d9b69b !important;
      border-color: #505050 !important;
      background-color: #333333 !important;
    }

    .product-image {
      border: 1px solid #505050 !important;
      border-radius: 8px !important;
      transition: all 0.3s ease !important;

      &:hover {
        transform: scale(1.05) !important;
      }
    }

    .order-status {
      background-color: #333333 !important;
      border-radius: 8px !important;
    }
  }

  /* Complaints Section */
  .table {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-color: #404040 !important;

    thead {
      background-color: #333333 !important;

      th {
        color: #d9b69b !important;
        border-color: #404040 !important;
      }
    }

    tbody {
      tr {
        border-color: #404040 !important;
        transition: all 0.3s ease !important;

        &:hover {
          background-color: #333333 !important;
        }

        td,
        th {
          color: #b0b0b0 !important;
          border-color: #404040 !important;
        }
      }

      .bi-clock-history {
        color: #e6a23c !important;
      }

      .bi-check2-circle {
        color: #67c23a !important;
      }
    }

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

  /* Spinner */
  .spinner-container {
    background-color: rgba(26, 26, 26, 0.8) !important;

    .spinner .dot {
      background-color: #d9b69b !important;
    }
  }

  /* Modal styles */
  .modal-content {
    background-color: #2d2d2d !important;
    color: #e0e0e0 !important;
    border-color: #505050 !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5) !important;

    .modal-header {
      border-bottom-color: #404040 !important;

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

      .btn-close {
        filter: invert(1) brightness(0.8) !important;
      }
    }

    .modal-body {
      color: #b0b0b0 !important;

      .form-control {
        background-color: #333333 !important;
        color: #e0e0e0 !important;
        border-color: #505050 !important;

        &::placeholder {
          color: #909090 !important;
        }
      }
    }

    .modal-footer {
      border-top-color: #404040 !important;
    }
  }
}

/* Dark mode adjustments for product color display */
.dark-mode .profile_1-5008 [style*="background-color"] {
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
}

/* Dark mode transition effects */
.profile_1-5008 {
  transition: background-color 0.3s ease, color 0.3s ease !important;
}

/* Add a subtle glow effect to buttons in dark mode */
.dark-mode .profile_1-5008 .btn:hover {
  box-shadow: 0 0 10px rgba(217, 182, 155, 0.4) !important;
}

/* Enhance scrollbars in dark mode */
.dark-mode .profile_1-5008 *::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

.dark-mode .profile_1-5008 *::-webkit-scrollbar-track {
  background: #1a1a1a !important;
}

.dark-mode .profile_1-5008 *::-webkit-scrollbar-thumb {
  background-color: #505050 !important;
  border-radius: 20px !important;
  border: 2px solid #333333 !important;
}

.dark-mode .profile_1-5008 *::-webkit-scrollbar-thumb:hover {
  background-color: #d9b69b !important;
}