/**
 * BanKaBeul - Styles
 */

/* Container principal - fix scroll et pointer-events */
.bankabeul-container {
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
	position: relative;
	z-index: 1;
}

/* Garantir que les éléments de formulaire sont interactifs */
.bankabeul-container form,
.bankabeul-container button,
.bankabeul-container input,
.bankabeul-container .btn {
	pointer-events: auto;
	position: relative;
}

/* Quadrant badges */
.bkb-star {
	background: linear-gradient(135deg, #f5af19, #f12711) !important;
	color: white !important;
}

.bkb-safe {
	background: linear-gradient(135deg, #11998e, #38ef7d) !important;
	color: white !important;
}

.bkb-gamble {
	background: linear-gradient(135deg, #4568dc, #b06ab3) !important;
	color: white !important;
}

.bkb-avoid {
	background: linear-gradient(135deg, #636363, #a2a2a2) !important;
	color: white !important;
}

/* Row highlights */
.bkb-star-row {
	border-left: 4px solid #f5af19;
}

.bkb-safe-row {
	border-left: 4px solid #38ef7d;
}

.bkb-gamble-row {
	border-left: 4px solid #4568dc;
}

.bkb-avoid-row {
	border-left: 4px solid #a2a2a2;
}

/* Cursor pointer for sortable headers */
.cursor-pointer {
	cursor: pointer;
}

.cursor-pointer:hover {
	background-color: rgba(255, 255, 255, 0.1);
}

/* Spin animation for refresh button */
.spin {
	animation: spin 1s linear infinite;
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* Card headers platform colors */
.card-header.bg-spotify {
	background-color: #1DB954 !important;
}

/* Form range custom */
.form-range::-webkit-slider-thumb {
	background: var(--bs-primary);
}

.form-range::-moz-range-thumb {
	background: var(--bs-primary);
}

/* Stats cards */
.bkb-stat-card {
	transition: transform 0.2s ease;
}

.bkb-stat-card:hover {
	transform: translateY(-2px);
}

/* Progress bar in table */
.table .progress {
	background-color: rgba(255, 255, 255, 0.1);
}

.table .progress-bar {
	background: linear-gradient(90deg, #667eea, #764ba2);
}

/* Badge font size in table */
.table .badge.fs-6 {
	min-width: 50px;
}

/* Cellules métriques avec gradient */
.metric-cell {
	min-width: 80px;
	padding: 8px 12px !important;
	border-radius: 4px;
	transition: all 0.3s ease;
	font-family: 'Courier New', monospace;
}

.metric-cell:hover {
	transform: scale(1.05);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

/* Cellules scores (bankability, potential) avec gradient */
.score-cell {
	min-width: 70px;
	padding: 10px 15px !important;
	border-radius: 6px;
	transition: all 0.3s ease;
	font-family: 'Courier New', monospace;
}

.score-cell:hover {
	transform: scale(1.08);
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
}

/* Icons couleurs dans les headers */
.table thead th .bi-youtube {
	color: #FF0000;
}

.table thead th .bi-instagram {
	color: #E1306C;
}

.table thead th .bi-tiktok {
	color: #000000;
}

.table thead th .bi-spotify {
	color: #1DB954;
}

.table thead th .bi-facebook {
	color: #1877F2;
}
