/* Seller Dashboard Black & White Theme with IBM Plex Sans Arabic */

/* Import IBM Plex Sans Arabic Font */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap');

/* Root Variables */
:root {
    --seller-primary: #000000;
    --seller-secondary: #ffffff;
    --seller-text: #000000;
    --seller-text-muted: #666666;
    --seller-border: #e5e5e5;
    --seller-hover: #f5f5f5;
    --seller-active: #000000;
    --seller-active-text: #ffffff;
}

/* Base Styles */
*, *::before, *::after {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}

body, html {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
    background-color: var(--seller-secondary) !important;
    color: var(--seller-text) !important;
}

/* Force font on all text elements */
h1, h2, h3, h4, h5, h6, p, span, div, a, button, input, textarea, select, label {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}

/* Cards */
.card {
    background-color: var(--seller-secondary) !important;
    border: 1px solid var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.card-header {
    background-color: var(--seller-secondary) !important;
    border-bottom: 1px solid var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.card-body {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-text) !important;
}

/* Buttons */
.btn-primary {
    background-color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

.btn-primary:hover {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-primary) !important;
}

.btn-outline-primary {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-primary) !important;
}

.btn-outline-primary:hover {
    background-color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

.btn-secondary {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.btn-secondary:hover {
    background-color: var(--seller-hover) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
}

/* Tables */
.table {
    color: var(--seller-text) !important;
    background-color: var(--seller-secondary) !important;
}

.table th {
    background-color: var(--seller-hover) !important;
    color: var(--seller-text) !important;
    border-color: var(--seller-border) !important;
}

.table td {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-text) !important;
    border-color: var(--seller-border) !important;
}

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

.table-hover tbody tr:hover {
    background-color: var(--seller-hover) !important;
    color: var(--seller-text) !important;
}

/* Forms */
.form-control {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.form-control:focus {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.1) !important;
}

.form-select {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.form-select:focus {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.1) !important;
}

/* Labels */
.form-label {
    color: var(--seller-text) !important;
    font-weight: 500 !important;
}

/* Badges */
.badge {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
}

.badge-primary {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

.badge-secondary {
    background-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

/* Alerts */
.alert {
    border: 1px solid var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.alert-success {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
}

.alert-danger {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
}

.alert-info {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

/* Pagination */
.pagination .page-link {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.pagination .page-link:hover {
    background-color: var(--seller-hover) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-text) !important;
}

.pagination .page-item.active .page-link {
    background-color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

/* Dropdowns */
.dropdown-menu {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
}

.dropdown-item {
    color: var(--seller-text) !important;
}

.dropdown-item:hover {
    background-color: var(--seller-hover) !important;
    color: var(--seller-text) !important;
}

/* Text Colors */
.text-primary {
    color: var(--seller-primary) !important;
}

.text-secondary {
    color: var(--seller-text-muted) !important;
}

.text-muted {
    color: var(--seller-text-muted) !important;
}

/* Links */
a {
    color: var(--seller-primary) !important;
}

a:hover {
    color: var(--seller-text) !important;
}

/* Progress Bars */
.progress {
    background-color: var(--seller-hover) !important;
}

.progress-bar {
    background-color: var(--seller-primary) !important;
}

/* Allow colored progress bars */
.progress-bar.bg-success {
    background-color: #198754 !important;
}

.progress-bar.bg-primary {
    background-color: #0d6efd !important;
}

.progress-bar.bg-warning {
    background-color: #ffc107 !important;
}

.progress-bar.bg-danger {
    background-color: #dc3545 !important;
}

/* Modal */
.modal-content {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-text) !important;
}

.modal-header {
    border-bottom-color: var(--seller-border) !important;
}

.modal-footer {
    border-top-color: var(--seller-border) !important;
}

/* List Groups */
.list-group-item {
    background-color: var(--seller-secondary) !important;
    border-color: var(--seller-border) !important;
    color: var(--seller-text) !important;
}

.list-group-item:hover {
    background-color: var(--seller-hover) !important;
}

/* Nav Tabs */
.nav-tabs .nav-link {
    color: var(--seller-text) !important;
    border-color: var(--seller-border) !important;
}

.nav-tabs .nav-link.active {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-primary) !important;
    border-color: var(--seller-border) !important;
}

/* Breadcrumb */
.breadcrumb {
    background-color: var(--seller-hover) !important;
}

.breadcrumb-item a {
    color: var(--seller-primary) !important;
}

.breadcrumb-item.active {
    color: var(--seller-text-muted) !important;
}

/* Additional Overrides for Bootstrap Components */
.bg-primary {
    background-color: var(--seller-primary) !important;
}

.bg-secondary {
    background-color: var(--seller-hover) !important;
}

.bg-light {
    background-color: var(--seller-secondary) !important;
}

.bg-white {
    background-color: var(--seller-secondary) !important;
}

.border-primary {
    border-color: var(--seller-primary) !important;
}

.border-secondary {
    border-color: var(--seller-border) !important;
}

/* Ensure all icons inherit color */
i, .ti, .fa, .fas, .far, .fab {
    color: inherit !important;
}

/* Override any colored backgrounds - but allow card borders and text to keep colors */
.bg-success, .bg-info, .bg-warning, .bg-danger {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

/* Allow colored text in cards and statistics */
.card .text-success {
    color: #198754 !important;
}

.card .text-info {
    color: #0dcaf0 !important;
}

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

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

.card .text-primary {
    color: #0d6efd !important;
}

/* Allow colored borders for cards */
.card.border-success {
    border-color: #198754 !important;
}

.card.border-info {
    border-color: #0dcaf0 !important;
}

.card.border-warning {
    border-color: #ffc107 !important;
}

.card.border-danger {
    border-color: #dc3545 !important;
}

.card.border-primary {
    border-color: #0d6efd !important;
}

/* Text utilities override - except in cards */
.text-success:not(.card .text-success),
.text-info:not(.card .text-info),
.text-warning:not(.card .text-warning),
.text-danger:not(.card .text-danger) {
    color: var(--seller-primary) !important;
}

/* Ensure consistent spacing and typography */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
    color: var(--seller-text) !important;
}

/* Small text elements */
.small, small {
    font-family: 'IBM Plex Sans Arabic', sans-serif !important;
    color: var(--seller-text-muted) !important;
}

/* Seller specific navigation styles */
.seller-nav-link {
    color: var(--seller-text) !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.seller-nav-link:hover,
.seller-nav-link:focus {
    background-color: var(--seller-hover) !important;
    color: var(--seller-primary) !important;
    text-decoration: none !important;
}

.seller-nav-link.active {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
    text-decoration: none !important;
}

.seller-nav-link.active:hover {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

/* Seller logout button */
.seller-logout-btn {
    background-color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.seller-logout-btn:hover,
.seller-logout-btn:focus {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    text-decoration: none !important;
}

.seller-logout-btn:active {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
    text-decoration: none !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Force link colors in seller area */
.seller-sidebar a,
.seller-header a {
    color: inherit !important;
    text-decoration: none !important;
}

.seller-sidebar a:hover,
.seller-header a:hover {
    text-decoration: none !important;
}

/* Icons in navigation */
.seller-nav-link i,
.seller-logout-btn i {
    color: inherit !important;
}

/* Override Bootstrap link styles in seller area */
.seller-sidebar .nav-link,
.seller-header .nav-link {
    color: var(--seller-text) !important;
}

.seller-sidebar .nav-link:hover,
.seller-header .nav-link:hover {
    color: var(--seller-primary) !important;
}

.seller-sidebar .nav-link.active,
.seller-header .nav-link.active {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
}

/* Ensure proper contrast for all interactive elements */
.seller-sidebar button,
.seller-header button {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
    border-color: var(--seller-primary) !important;
}

.seller-sidebar button:hover,
.seller-header button:hover {
    background-color: var(--seller-secondary) !important;
    color: var(--seller-primary) !important;
    border-color: var(--seller-primary) !important;
}

/* Additional specificity for stubborn elements */
.seller-nav-item a {
    color: var(--seller-text) !important;
    text-decoration: none !important;
}

.seller-nav-item a:hover {
    background-color: var(--seller-hover) !important;
    color: var(--seller-primary) !important;
    text-decoration: none !important;
}

.seller-nav-item a.active {
    background-color: var(--seller-primary) !important;
    color: var(--seller-secondary) !important;
    text-decoration: none !important;
}

/* User info styling */
.seller-user-info {
    color: var(--seller-text) !important;
}

.seller-user-name {
    color: var(--seller-text) !important;
    font-weight: 500 !important;
}
