/* Variables */
:root {
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
}

/* Dark Mode Variables */
[data-bs-theme="dark"] {
    --bs-body-bg: #1a1a1a;
    --bs-body-color: #e0e0e0;
    --bs-card-bg: #2d2d2d;
    --bs-border-color: #404040;
    --bs-secondary-bg: #2d2d2d;
    --bs-tertiary-bg: #353535;
}

body {
	color: #4c4c4c !important;
	background-image: url("../img/repeat_background.jpg") !important;
	background-repeat: repeat !important;

	font-family: "Maven Pro", sans-serif;
	font-optical-sizing: auto;
	font-weight: 400;
	font-size: 1.1rem !important;
	font-style: normal;
}

/* Dark mode body override */
[data-bs-theme="dark"] body {
	color: #e0e0e0 !important;
	background-image: none !important;
	background-color: #1a1a1a !important;
}

/* Dark mode cards */
[data-bs-theme="dark"] .card {
	background-color: #2d2d2d;
	border-color: #404040;
	color: #e0e0e0;
}

[data-bs-theme="dark"] .card-body {
	color: #e0e0e0;
}

/* Dark mode navbar */
[data-bs-theme="dark"] .navbar {
	background-color: #2d2d2d !important;
	box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

[data-bs-theme="dark"] .navbar .nav-link {
	color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .navbar-brand {
	color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .navbar-toggler {
	border-color: rgba(255,255,255,0.1);
}

[data-bs-theme="dark"] .navbar-toggler-icon {
	filter: invert(1);
}

[data-bs-theme="dark"] .navbar-ludom {
	background-color: #1e7fa0;
	background-image: linear-gradient(to bottom, #1f8aad, #1a7590);
}

/* Dark mode list-group */
[data-bs-theme="dark"] .list-group-item {
	background-color: #2d2d2d;
	border-color: #404040;
	color: #e0e0e0;
}

[data-bs-theme="dark"] .list-group-item-action:hover,
[data-bs-theme="dark"] .list-group-item-action:focus {
	background-color: #353535;
	color: #e0e0e0;
}

[data-bs-theme="dark"] .list-group-item.active {
	background-color: #229ac8;
	border-color: #1f90bb;
	color: #ffffff;
}

/* Dark mode badges */
[data-bs-theme="dark"] .badge.bg-light {
	background-color: #e0e0e0 !important;
	color: #229ac8 !important;
}

[data-bs-theme="dark"] .badge.bg-secondary {
	background-color: #6c757d !important;
	color: #ffffff !important;
}

/* Dark mode tables */
[data-bs-theme="dark"] table {
	background-color: #2d2d2d !important;
	color: #e0e0e0;
}

[data-bs-theme="dark"] table thead {
	background-color: #353535;
}

[data-bs-theme="dark"] table tbody tr:hover {
	background-color: #353535;
}

/* Dark mode form controls */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
	background-color: #2d2d2d;
	border-color: #404040;
	color: #e0e0e0;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
	background-color: #353535;
	border-color: #229ac8;
	color: #e0e0e0;
}

/* Dark mode buttons outline */
[data-bs-theme="dark"] .btn-outline-secondary {
	color: #adb5bd;
	border-color: #6c757d;
}

[data-bs-theme="dark"] .btn-outline-secondary:hover {
	background-color: #6c757d;
	border-color: #6c757d;
	color: #ffffff;
}

[data-bs-theme="dark"] .btn-outline-secondary.active {
	background-color: #6c757d;
	border-color: #6c757d;
	color: #ffffff;
}



table {
	font-size: 1rem !important;
    background: #fff;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

/* Navigation */
.navbar {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    background-color: #f8f9fa;
}

.navbar-brand {
    font-weight: 700;
    font-size: 1.5rem;
}

/* Dark mode navbar override */
[data-bs-theme="dark"] .navbar {
    background-color: #2d2d2d !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

/* Cards */
.card {
    border: none;
}

.card-img-top {
    height: 200px;
    object-fit: cover;
    background-color: #f8f9fa;
}

/* Boutons */
.btn {
    border-radius: 0.5rem;
}

.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.btn-primary:hover {
    background-color: #0b5ed7;
    border-color: #0a58ca;
}

/* Badges */
.badge {
    font-weight: 500;
    padding: 0.35em 0.65em;
}

/* Admin DataTables */
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    padding: 0.375rem 0.75rem;
}

/* Admin Actions */
.action-buttons .btn {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

/* Filtres de produits */
.btn-outline-primary.active {
    background-color: #0d6efd !important;
    color: white !important;
    border-color: #0d6efd !important;
}

/* Definition list styles */
dt {
    color: #bbb;
}

dt::after {
    content: ':';
    margin-left: 4px;
}

/* Definition list - min height and vertical alignment */
dl.row dt,
dl.row dd {
    min-height: 1.5rem;
    font-weight: inherit;
}

/* Animation d'apparition des produits */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.product-item.fade-in {
    animation: fadeIn 0.3s ease-in-out;
}

/* Featured Product Ribbon */
.ribbon-container {
    position: relative;
}

.ribbon {
    position: absolute;
    top: 12px;
    right: -8px;
    background: var(--bs-warning);
    color: #ffffff;
    padding: 6px 10px;
    font-size: 0.8rem;
    border-radius: 6px;
    font-weight: 600;
    text-transform: uppercase;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    z-index: 10;
}

.ribbon.ribbon-new {
    background: #28a745;
}

/* Placeholders */
.form-control::placeholder {
    color: #6c757d;
    opacity: 0.6;
}

/* DataTables - Highlight colonne triée */
table.dataTable tbody td.sorting_1,
table.dataTable thead th.sorting_1,
table.dataTable thead th.sorting_asc,
table.dataTable thead th.sorting_desc,
table.dataTable tbody td.sorting_asc,
table.dataTable tbody td.sorting_desc,
table.dataTable tbody td.sorting_1 {
    background-color: rgba(13, 202, 240, 0.1) !important;
}

/* color */
.fc-bordeaux {
	color: #9c0000 !important;
}

.fc-ludom {
	color: #265f9f !important;
}

/* fonts */
.ff-parisienne {
	font-family: "Parisienne", cursive !important;
}

/* buttons */
.btn-ludom {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #229ac8;
	background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
	background-repeat: repeat-x;
	border-color: #1f90bb #1f90bb #145e7a;
}
.btn-ludom:hover,
.btn-ludom:active,
.btn-ludom.active,
.btn-ludom.disabled,
.btn-ludom[disabled],
.btn-outline-ludom:hover,
.btn-outline-ludom:active,
.btn-outline-ludom.active,
.btn-outline-ludom.disabled,
.btn-outline-ludom[disabled] {
	background-color: #1f90bb !important;
	background-image: linear-gradient(to bottom, #1e95c3, #1a87ad) !important;
	background-repeat: repeat-x !important;
    color: #ffffff !important;
}
.btn-outline-ludom {
	border-color: #1f90bb;
	color: #229ac8;
}

.btn-outline-ludom:hover {
	color: #ffffff !important;
}

/* navbar */
.navbar-ludom {
	color: #ffffff;
	background-color: #229ac8;
	background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
	background-repeat: repeat-x;
	border-color: #1f90bb;
}

.navbar-ludom .navbar-brand,
.navbar-ludom .nav-link {
	color: #ffffff !important;
}

.navbar-ludom .nav-link:hover,
.navbar-ludom .nav-link:focus {
	color: #f0f0f0 !important;
}

.navbar-ludom .nav-link.active {
	color: #ffffff !important;
	font-weight: bold;
}

/* list-group */
.list-group-item-ludom {
	color: #ffffff;
	background-color: #229ac8;
	background-image: linear-gradient(to bottom, #23a1d1, #1f90bb);
	background-repeat: repeat-x;
	border-color: #1f90bb;
}

.list-group-item-ludom:hover {
	background-color: #1f90bb;
	background-image: linear-gradient(to bottom, #1f90bb, #1a7590);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
	color: #ffffff !important;
}

.list-group-item-ludom.active {
	background-color: #1f90bb;
	border-color: #1f90bb;
}

.list-group-item.active {
	background-color: #229ac8;
	border-color: #1f90bb;
}

.table-xs > :not(caption) > * > * {
	padding: 0 0.2rem !important;
}

/* Cart Progress Steps */
.progress-bar-cart {
	background-color: #000 !important;
}

.progress-cart {
	background-color: #000 !important;
}

/* Cercles de progression */
.rounded-circle.bg-light {
	border: 2px solid #000 !important;
}

.rounded-circle.bg-primary {
	background-color: #0dcaf0 !important;
	border: none !important;
}

/* Dark mode - Cercles de progression */
[data-bs-theme="dark"] .rounded-circle.bg-light {
	background-color: #404040 !important;
	border: 2px solid #808080 !important;
	color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .progress-cart {
	background-color: #404040 !important;
}

[data-bs-theme="dark"] .progress-bar-cart {
	background-color: #808080 !important;
}

/* Centrage vertical des cellules de tableau */
td {
	vertical-align: middle !important;
}

.dataTables_wrapper{
	background-color: #fff;
	padding: 10px;
	border-radius: 0.5rem;
}

/* Dark mode DataTables wrapper */
[data-bs-theme="dark"] .dataTables_wrapper {
	background-color: #2d2d2d !important;
	padding: 10px;
	border-radius: 0.5rem;
}

/* DataTable row selection - white text and links */
table.datatable tbody tr.selected,
table.datatable tbody tr.selected td {
	color: #fff !important;
}

table.datatable tbody tr.selected a,
table.datatable tbody tr.selected small {
	color: #fff !important;
}

/* Navbar - sticky only on LG and above */
@media (max-width: 991.98px) {
	.sticky-lg-top {
		position: static !important;
	}
}

@media (min-width: 992px) {
	.sticky-lg-top {
		position: sticky !important;
		top: 0 !important;
		z-index: 1020 !important;
	}
}
/* Hero Slider Carousel Caption - Responsive Width */
/* On XS (mobile): Full width, no left/right margins */
@media (max-width: 767.98px) {
	#heroCarousel .carousel-caption {
		right: 5px !important;
		left: 5px !important;
	}
}

/* On MD and above: Keep Bootstrap default 15% margins */
@media (min-width: 768px) {
	#heroCarousel .carousel-caption {
		right: 15% !important;
		left: 15% !important;
	}
}