/* FORCE ORANGE POUR BOUTONS CADDIE - REGLE PRIORITAIRE */
.btn-cart-action.btn-outline-success,
#combatRoot .btn-cart-action.btn-outline-success,
button.btn-cart-action.btn-outline-success {
  border-color: #ff9800 !important;
  color: #ff9800 !important;
  background: rgba(255,152,0,.08) !important;
}
.btn-cart-action.btn-outline-success:hover,
#combatRoot .btn-cart-action.btn-outline-success:hover,
button.btn-cart-action.btn-outline-success:hover {
  background: #ff9800 !important;
  color: #111 !important;
  border-color: #ff9800 !important;
}

.combat-app .card{border-radius:.5rem}
.combat-app .combat-tree{font-size:.85rem;line-height:1.2;max-height:520px;overflow:auto;padding-right:.25rem}
.combat-app .combat-tree .combat-node#combatRoot .combat-drill-items .drill-item .drill-edit .form-label.tiny {
  font-size: 0.6rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: #b8c4ce !important;
  margin-bottom: 0.25rem;
}

/* Inputs dans les drill-items */
#combatRoot .combat-drill-items .drill-item input.form-control {
  background: #2a3338 !important;
  border: 1px solid #3a434a !important;
  color: #fff !important;
  font-size: 0.75rem !important;
}

#combatRoot .combat-drill-items .drill-item input.form-control:focus {
  background: #343a40 !important;
  border-color: var(--brand-accent) !important;
  box-shadow: 0 0 0 0.2rem rgba(255, 152, 0, 0.25) !important;
}

.combat-app .combat-tree .combat-node .node-label{font-weight:500}
.combat-app .combat-tree .combat-node.domaine{background:#f8f9fa}
.combat-app .combat-tree .combat-node.theme{margin-left:.75rem}
.combat-app .combat-tree .combat-node.active{background:#0d6efd;color:#fff;border-color:#0d6efd}
.combat-app .combat-tree .children{margin-top:2px;margin-bottom:4px}
#combatExercisesTable tbody tr{transition:background .15s}
#combatExercisesTable tbody tr:hover{background:rgba(13,110,253,.08)}

/* Ajustement des largeurs de colonnes - spécificité renforcée */
#combatRoot #combatExercisesTable {
  table-layout: fixed !important;
  width: 100% !important;
}

/* Colonne checkbox - largeur fixe 28px */
#combatRoot #combatExercisesTable th:first-child,
#combatRoot #combatExercisesTable td:first-child {
  width: 28px !important;
  min-width: 28px !important;
  max-width: 28px !important;
}

/* Colonne Actions - utilise l'espace restant */
#combatRoot #combatExercisesTable th:nth-child(2),
#combatRoot #combatExercisesTable td:nth-child(2) {
  width: auto !important;
  min-width: 0 !important;
  white-space: nowrap !important;
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}

/* Colonne Exercice - largeur fixe 200px */
#combatRoot #combatExercisesTable th:last-child,
#combatRoot #combatExercisesTable td:last-child {
  width: 200px !important;
  min-width: 200px !important;
  max-width: 200px !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* S'assurer que le btn-group ne déborde pas */
#combatExercisesTable td:nth-child(2) .btn-group {
  width: max-content;
}

/* Responsive pour mobile - vue tableau */
@media (max-width: 768px) {
  #combatRoot #combatExercisesTable {
    table-layout: fixed !important;
  }

  /* Colonne Exercice - largeur réduite sur mobile */
  #combatRoot #combatExercisesTable th:last-child,
  #combatRoot #combatExercisesTable td:last-child {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
  }

  /* Btn-group plus compact en mobile */
  #combatRoot #combatExercisesTable td:nth-child(2) .btn-group .btn {
    padding: 0.25rem 0.4rem !important;
    font-size: 0.75rem !important;
  }
}@media (max-width: 576px) {
  /* Colonne Exercice encore plus compacte sur très petits écrans */
  #combatRoot #combatExercisesTable th:last-child,
  #combatRoot #combatExercisesTable td:last-child {
    width: 120px !important;
    min-width: 120px !important;
    max-width: 120px !important;
  }

  /* Boutons encore plus petits */
  #combatRoot #combatExercisesTable td:nth-child(2) .btn-group .btn {
    padding: 0.2rem 0.3rem !important;
    font-size: 0.7rem !important;
  }
}/* Colonne Exercice - utilise l'espace restant */
#combatExercisesTable th:nth-child(2),
#combatExercisesTable td:nth-child(2) {
  width: auto !important;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.combat-drill-items{min-height:40px}
.combat-drill-items li{cursor:grab}
.combat-drill-items li.dragging{opacity:.5}
.combat-drill-items .drag-handle{font-size:1rem;cursor:grab;color:#888}
.combat-drill-items input{font-size:.7rem}
#combatRoot .combat-mini-list .badge{min-width:28px;text-align:center;font-weight:500}
#combatRoot .list-group.combat-mini-list{scrollbar-width:thin}
#combatRoot .list-group.combat-mini-list::-webkit-scrollbar{width:6px}
#combatRoot .list-group.combat-mini-list::-webkit-scrollbar-thumb{background:#c5c5c5;border-radius:3px}
#combatRoot .list-group.combat-mini-list::-webkit-scrollbar-thumb:hover{background:#999}
/* Drill buttons - thème sombre */
#combatDrillList .drill-btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #1f252b !important;
  color: #fff !important;
  border: 1px solid #3a434a !important;
  transition: all 0.2s ease;
}

#combatDrillList .drill-btn:hover {
  background: #2a3338 !important;
  border-color: var(--brand-accent) !important;
  transform: translateY(-1px);
}

#combatDrillList .drill-btn.active {
  background: var(--brand-accent) !important;
  color: #fff !important;
  border-color: var(--brand-accent) !important;
  box-shadow: 0 2px 8px rgba(255, 152, 0, 0.3);
}

#combatDrillList .drill-btn .badge {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important;
  font-size: 0.65rem !important;
  min-width: 1.5rem;
  text-align: center;
}

/* Gestion du débordement pour les noms de drill */
#combatDrillList .drill-btn > span:first-child {
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: calc(100% - 3rem);
}
#combatDrillItems::-webkit-scrollbar,#combatTree::-webkit-scrollbar{width:6px}
#combatDrillItems::-webkit-scrollbar-thumb,#combatTree::-webkit-scrollbar-thumb{background:#bbb;border-radius:3px}
#combatDrillItems::-webkit-scrollbar-thumb:hover,#combatTree::-webkit-scrollbar-thumb:hover{background:#999}
@media (max-width:992px){.combat-app .card{margin-bottom:1rem}}
/* FEKM-aligned filters layout for combat */
.combat-page-full{width:100%;max-width:100%;}
.combat-filters{background:#f8f9fa;border:1px solid #e2e6eb;border-radius:.65rem;padding:.55rem .65rem .6rem;display:grid;gap:.55rem .6rem;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));align-items:end}
.combat-filters{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.combat-filters .full-row{grid-column:1/-1}
.combat-filters .col-domaine,.combat-filters .col-theme,.combat-filters .col-search{min-width:180px;position:relative}
.combat-filters .col-domaine .d-flex,.combat-filters .col-theme .d-flex{flex-wrap:wrap}
.combat-filters .col-domaine .btn-group,.combat-filters .col-theme .btn-group{flex-wrap:nowrap}
.combat-filters .col-domaine select,.combat-filters .col-theme select{flex:1 1 auto;min-width:120px}
.combat-filters .col-domaine .btn-group button,.combat-filters .col-theme .btn-group button{flex:0 0 auto}
.combat-filters .col-domaine .btn-group, .combat-filters .col-theme .btn-group{display:flex;gap:2px}
.combat-filters .col-domaine .btn-group .btn,.combat-filters .col-theme .btn-group .btn{padding-left:.45rem;padding-right:.45rem}
@media (max-width: 1199.98px){
	.combat-filters{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
	.combat-filters .col-domaine,.combat-filters .col-theme,.combat-filters .col-search{min-width:150px}
	.combat-filters .col-domaine .d-flex,.combat-filters .col-theme .d-flex{flex-direction:column;align-items:stretch;gap:.35rem}
	.combat-filters .col-domaine .btn-group,.combat-filters .col-theme .btn-group{justify-content:flex-start}
}
@media (max-width: 575.98px){
	.combat-filters .col-domaine select,.combat-filters .col-theme select{min-width:100%;}
	.combat-filters .col-domaine .btn-group,.combat-filters .col-theme .btn-group{width:100%;}
}
.combat-filters .col-actions{margin-top:.15rem}
.combat-filters .help{cursor:help;color:#6c757d}
.combat-filters .help:hover{color:#0d6efd}
.combat-filters{position:relative;z-index:10}
.combat-filters .actions{min-width:150px}
.combat-filters .fg.actions .btn{white-space:nowrap}
.combat-filters select,.combat-filters input{max-width:100%}
.combat-page-full .dropdown-menu{z-index:1050}
.combat-page-full .card-header .btn-group{flex-wrap:wrap}
.combat-page-full .card-header .btn{margin-bottom:2px}

/* Boutons dans les toolbars des drill headers */
#combatRoot .card-header .btn-group .btn {
  background: transparent !important;
  border: 1px solid #3a434a !important;
  color: #b8c4ce !important;
  font-size: 0.8rem !important;
  padding: 0.25rem 0.5rem !important;
  transition: all 0.2s ease;
}

#combatRoot .card-header .btn-group .btn:hover {
  background: #3a434a !important;
  border-color: var(--brand-accent) !important;
  color: var(--brand-accent) !important;
}

#combatRoot .card-header .btn-group .btn-outline-success {
  border-color: #28a745 !important;
  color: #28a745 !important;
}

#combatRoot .card-header .btn-group .btn-outline-success:hover {
  background: #28a745 !important;
  border-color: #28a745 !important;
  color: #fff !important;
}

/* Override success color for cart action buttons to use brand accent orange - HIGH SPECIFICITY */
#combatRoot .btn.btn-outline-success.btn-cart-action {
  border-color: #ff9800 !important;
  color: #ff9800 !important;
  background: linear-gradient(180deg, rgba(255,152,0,.05), rgba(255,152,0,.02)) !important;
}

#combatRoot .btn.btn-outline-success.btn-cart-action:hover,
#combatRoot .btn.btn-outline-success.btn-cart-action:focus {
  background: #ff9800 !important;
  border-color: #ff9800 !important;
  color: #111 !important;
}

#combatRoot .btn.btn-outline-success.btn-cart-action:disabled {
  opacity: .5 !important;
  border-color: #ff9800 !important;
  color: #ff9800 !important;
  background: rgba(255,152,0,.05) !important;
}

/* Fallback sans variables CSS au cas où */
#combatRoot button[class*="btn-cart-action"].btn-outline-success {
  border-color: #ff9800 !important;
  color: #ff9800 !important;
  background: rgba(255,152,0,.05) !important;
}

#combatRoot button[class*="btn-cart-action"].btn-outline-success:hover {
  background: #ff9800 !important;
  color: #111 !important;
}

#combatRoot .card-header .btn-group .btn-outline-primary:not(:disabled) {
  border-color: var(--brand-accent) !important;
  color: var(--brand-accent) !important;
}

#combatRoot .card-header .btn-group .btn-outline-primary:hover:not(:disabled) {
  background: var(--brand-accent) !important;
  border-color: var(--brand-accent) !important;
  color: #fff !important;
}

#combatRoot .card-header .btn-group .btn:disabled {
  opacity: 0.5 !important;
  color: #666 !important;
  border-color: #444 !important;
}

#combatRoot .card-header .btn-group .btn-outline-danger {
  border-color: #dc3545 !important;
  color: #dc3545 !important;
}

#combatRoot .card-header .btn-group .btn-outline-danger:hover {
  background: #dc3545 !important;
  border-color: #dc3545 !important;
  color: #fff !important;
}

#combatRoot .card-header .btn-group .btn-outline-warning {
  border-color: #ffc107 !important;
  color: #ffc107 !important;
}

#combatRoot .card-header .btn-group .btn-outline-warning:hover {
  background: #ffc107 !important;
  border-color: #ffc107 !important;
  color: #000 !important;
}

#combatRoot .card-header .btn-group .btn-outline-secondary {
  border-color: #6c757d !important;
  color: #6c757d !important;
}

#combatRoot .card-header .btn-group .btn-outline-secondary:hover {
  background: #6c757d !important;
  border-color: #6c757d !important;
  color: #fff !important;
}

#combatRoot .card-header .btn-group .btn-outline-dark {
  border-color: #b8c4ce !important;
  color: #b8c4ce !important;
}

#combatRoot .card-header .btn-group .btn-outline-dark:hover {
  background: #b8c4ce !important;
  border-color: #b8c4ce !important;
  color: #000 !important;
}
.combat-page-full .list-group-item.active{color:#fff}
.combat-empty{padding:1rem;text-align:center;font-size:.8rem;color:#777}
.combat-filters .fg{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.combat-filters label{font-size:.6rem;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:#495057;margin:0}
.combat-filters select,.combat-filters input{font-size:.7rem;padding:.25rem .4rem;line-height:1.1}
.combat-filters .actions label{visibility:hidden}
.combat-filters .status{grid-column:1/-1;font-size:.6rem;margin-top:.15rem;color:#666;display:flex;gap:.75rem;flex-wrap:wrap}
.combat-drill-items li{cursor:grab}
.combat-drill-items li.dragging{opacity:.5}
.combat-drill-items .drag-handle{font-size:1rem;cursor:grab;color:#888}
.combat-page-full .card{border-radius:.65rem}
.combat-page-full .card-header{background:#fdfdfd;border-bottom:1px solid #e0e5e9}

/* En-têtes des cartes drill - thème sombre */
#combatRoot .card.shadow-sm {
  background: #1f252b !important;
  border: 1px solid #3a434a !important;
}

#combatRoot .card.shadow-sm .card-header {
  background: #2a3338 !important;
  border-bottom: 1px solid #3a434a !important;
  color: #fff !important;
}

#combatRoot .card.shadow-sm .card-header strong {
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
}

#combatRoot .card.shadow-sm .card-body {
  background: #1f252b !important;
  color: #fff !important;
}

/* Badges dans les en-têtes drill */
#combatRoot .card-header .badge {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Messages d'aide dans les drill cards */
#combatRoot .card .text-muted {
  color: #b8c4ce !important;
}

#combatRoot .card .small {
  color: #b8c4ce !important;
  font-size: 0.75rem !important;
}
.combat-page-full .pagination-footer select{min-width:70px}
@media (max-width: 991.98px){
	.combat-filters{padding:.5rem .6rem;grid-template-columns:1fr 1fr;}
	.combat-filters .col-actions{order:4}
	.combat-filters .full-row{grid-column:1/ -1}
}
.combat-page-full.loading{position:relative}
.combat-page-full.loading:after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.6);backdrop-filter:blur(1px);z-index:200}
.combat-page-full.loading:before{content:"";position:absolute;top:50%;left:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:4px solid #999;border-top-color:#0d6efd;border-radius:50%;animation:combat-spin 0.7s linear infinite;z-index:201}
@keyframes combat-spin{to{transform:rotate(360deg)}}

/* =============================
	 Combat Manager Extended Theme
	 - Variables (light/dark aware)
	 - Neutral badge utility
	 - Stat chips
	 - Focus ring accessibility
	 ============================= */
:root{
	--combat-neutral-bg:#eef0f2;
	--combat-neutral-border:#d3d7db;
	--combat-neutral-text:#333;
	--combat-accent:#0d6efd;
	--combat-danger:#dc3545;
	--combat-focus-ring:0 0 0 .18rem rgba(13,110,253,.35);
	--combat-chip-bg:#f1f3f5;
	--combat-chip-text:#444;
}
@media (prefers-color-scheme:dark){
	:root{
		--combat-neutral-bg:#2b3238;
		--combat-neutral-border:#3a434a;
		--combat-neutral-text:#d5dade;
		--combat-chip-bg:#1f252b;
		--combat-chip-text:#d5dade;
	}
}

#combatRoot .badge-neutral{font-weight:600;font-size:.55rem;letter-spacing:.25px;line-height:1;padding:.3em .55em;border:1px solid var(--combat-neutral-border);background:var(--combat-neutral-bg);color:var(--combat-neutral-text);border-radius:.45rem}

#combatRoot .stat-chips{display:flex;flex-wrap:wrap;gap:.35rem}
#combatRoot .stat-chip{background:var(--combat-chip-bg);color:var(--combat-chip-text);font-size:.55rem;padding:.35em .55em;border-radius:1rem;display:inline-flex;align-items:center;gap:.35rem;font-weight:600;letter-spacing:.3px;border:1px solid var(--combat-neutral-border)}
@media (prefers-color-scheme:dark){
	#combatRoot .stat-chip{border-color:var(--combat-neutral-border)}
}

/* Global focus ring for interactive elements inside combat root */
#combatRoot button:focus,#combatRoot [role="button"]:focus,#combatRoot input:focus,#combatRoot select:focus,#combatRoot textarea:focus{outline:none;box-shadow:var(--combat-focus-ring)}

/* Compact modal header/body spacing alignment with séances */
#combatRoot .modal-content .modal-header{background:#f8f9fa;border-bottom:1px solid #e0e5e9;padding:.45rem .65rem}
#combatRoot .modal-content .modal-header .modal-title{font-size:.8rem;font-weight:600;letter-spacing:.5px;text-transform:uppercase}
#combatRoot .modal-content .modal-body{padding:.75rem .85rem}
@media (prefers-color-scheme:dark){
	#combatRoot .modal-content .modal-header{background:#1f252b;border-color:#3a434a}
}

/* Utility to slightly raise contrast on hover for neutral items */
#combatRoot .mini-item:not(.active):hover{background:#e9ecef}
@media (prefers-color-scheme:dark){
	#combatRoot .mini-item:not(.active):hover{background:#273038}
}

/* Responsive refinements */
@media (max-width:575.98px){
	#combatRoot .combat-drill-items .drill-item .drill-edit .d-flex{flex-direction:column;align-items:stretch}
	#combatRoot .combat-drill-items .drill-item .drill-edit label{width:100%!important}
}

/* Exercise subrow (domain/theme badges) */
#combatRoot .exo-subrow .badge{font-weight:500;font-size:.55rem;letter-spacing:.25px;line-height:1;padding:.3em .5em;border:1px solid #d3d7db;background:#eef0f2;color:#333;border-radius:.4rem;}
@media (prefers-color-scheme:dark){
	#combatRoot .exo-subrow .badge{background:#2b3238;color:#d5dade;border-color:#3a434a;}
}
#combatRoot .exo-name{font-size:.85rem;font-weight:600;letter-spacing:.25px;color:#232a31;}
@media (prefers-color-scheme:dark){ #combatRoot .exo-name{color:#f2f4f6;text-shadow:0 0 1px rgba(255,255,255,.35);} }

/* Removed sticky right column (drills moved under exercises) */

/* Drill panel refactor - thème sombre */
#combatRoot .combat-drill-items {
  background: #1f252b;
  border: 1px solid #3a434a;
  border-radius: 0.5rem;
  padding: 0.5rem;
}

/* Amélioration de la section drill */
#combatRoot .drill-section-sep {
  font-weight: 700 !important;
  font-size: 1rem !important;
  color: var(--brand-accent) !important;
  text-align: center;
  margin: 1.5rem 0 1rem 0;
  position: relative;
}

#combatRoot .drill-section-sep span {
  background: #1f252b !important;
  padding: 0 1rem;
  border: 1px solid var(--brand-accent) !important;
  border-radius: 1rem;
}

#combatRoot .combat-drill-items .drill-item {
  padding: 0.5rem 0.7rem;
  transition: all 0.2s ease;
  background: #1f252b !important;
  color: #fff !important;
  border: 1px solid #3a434a !important;
  border-radius: 0.4rem;
  margin-bottom: 0.25rem;
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.5rem !important;
}

/* Le contenu principal du drill-item prend toute la largeur disponible */
#combatRoot .combat-drill-items .drill-item .drill-main {
  flex: 1 !important;
  min-width: 0 !important;
  width: 100% !important;
}

#combatRoot .combat-drill-items .drill-item:hover {
  background: #2a3338 !important;
  border-color: var(--brand-accent) !important;
  transform: translateY(-1px);
}

#combatRoot .combat-drill-items .drill-item.editing {
  background: #2a3338 !important;
  border-color: var(--brand-accent) !important;
  box-shadow: 0 0 0 2px rgba(255, 152, 0, 0.2);
}
#combatRoot .combat-drill-items .drill-item .exo-name {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.2;
  width: 100% !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
}

/* Container des métadonnées utilise toute la largeur avec meilleure répartition */
#combatRoot .combat-drill-items .drill-item .drill-meta {
  width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.3rem 0.4rem !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  line-height: 1.4 !important;
}

#combatRoot .combat-drill-items .drill-item .drill-meta .badge {
  font-size: 0.65rem !important;
  padding: 0.25em 0.5em;
  border: 1px solid #3a434a;
  background: rgba(255, 255, 255, 0.1) !important;
  color: #e5e8ea !important;
  border-radius: 0.3rem;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: calc(50% - 0.2rem) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  word-break: break-word !important;
}

/* Badges spécifiques pour domaine et thème */
#combatRoot .combat-drill-items .drill-item .drill-meta .badge:first-child {
  max-width: calc(60% - 0.2rem) !important;
}

#combatRoot .combat-drill-items .drill-item .drill-meta .badge:last-child {
  max-width: calc(40% - 0.2rem) !important;
}

/* Approche alternative pour 2 badges côte à côte */
#combatRoot .combat-drill-items .drill-item .drill-meta .badge + .badge:last-child {
  max-width: calc(50% - 0.2rem) !important;
}

#combatRoot .combat-drill-items .drill-item .drill-meta .badge:first-child:nth-last-child(2) {
  max-width: calc(50% - 0.2rem) !important;
}

/* Pour les badges avec du contenu très long, permettre le wrap sur plusieurs lignes */
#combatRoot .combat-drill-items .drill-item .drill-meta .badge.badge-long {
  white-space: normal !important;
  max-width: 100% !important;
  line-height: 1.3 !important;
  padding: 0.3em 0.5em !important;
}

/* Améliorer l'espacement vertical entre les lignes de badges */
#combatRoot .combat-drill-items .drill-item .drill-meta {
  row-gap: 0.4rem !important;
}
#combatRoot .combat-drill-items .drill-item .drill-edit .form-label.tiny {
  font-size: 0.6rem !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 600;
  color: #b8c4ce !important;
  margin-bottom: 0.25rem;
}
#combatRoot .combat-drill-items .drag-handle {
  cursor: grab;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  color: #b8c4ce !important;
  font-size: 1.1rem;
  transition: color 0.2s ease;
}

#combatRoot .combat-drill-items .drag-handle:hover {
  color: var(--brand-accent) !important;
}

#combatRoot .combat-drill-items .drag-handle:active {
  cursor: grabbing;
}

#combatRoot .combat-drill-items .drill-item.dragging {
  opacity: 0.6;
  border-style: dashed !important;
  border-color: var(--brand-accent) !important;
  transform: scale(1.02);
}
#combatRoot .combat-drill-items .btn-xs{--bs-btn-padding-y:.05rem;--bs-btn-padding-x:.25rem;--bs-btn-font-size:.55rem;line-height:1;border-radius:.35rem}
/* Actions drill alignées verticalement et compactes */
#combatRoot .combat-drill-items .drill-actions {
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.25rem !important;
  align-items: center !important;
}

#combatRoot .combat-drill-items .drill-actions .btn {
  padding: 0.2rem 0.3rem;
  font-size: 0.6rem;
  background: transparent !important;
  border-color: #3a434a !important;
  color: #b8c4ce !important;
  transition: all 0.2s ease;
  min-width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#combatRoot .combat-drill-items .drill-actions .btn:hover {
  border-color: var(--brand-accent) !important;
  color: var(--brand-accent) !important;
  transform: scale(1.05);
}

#combatRoot .combat-drill-items .drill-actions .btn-outline-danger:hover {
  background: #dc3545 !important;
  border-color: #dc3545 !important;
  color: #fff !important;
}

/* Assurer que tous les contenus utilisent la largeur complète */
#combatRoot .combat-drill-items .drill-item .d-flex.w-100 {
  width: 100% !important;
  min-width: 0 !important;
}

#combatRoot .combat-drill-items .drill-item .flex-grow-1 {
  flex-grow: 1 !important;
  min-width: 0 !important;
  width: 100% !important;
}

/* Améliorer l'affichage des inputs en mode édition */
#combatRoot .combat-drill-items .drill-item .drill-edit input[type="text"],
#combatRoot .combat-drill-items .drill-item .drill-edit input[type="number"],
#combatRoot .combat-drill-items .drill-item .drill-edit textarea {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Removed mini-cards styles (domaines/thèmes block deleted) */
#combatRoot .btn-xs{--bs-btn-padding-y:.1rem;--bs-btn-padding-x:.3rem;--bs-btn-font-size:.55rem;line-height:1;border-radius:.35rem}
#combatRoot .mini-card-group-header{letter-spacing:.05em}

/* Removed drills-col vertical centering (now full-width stack) */

/* Cart action buttons (accent outline consistent with FEKM) */
#combatRoot .btn-cart-action{--cart-accent:var(--brand-accent,#ff9800);border-color:var(--cart-accent);color:var(--cart-accent);background:linear-gradient(180deg,rgba(var(--brand-accent-rgb,255,152,0),.05),rgba(var(--brand-accent-rgb,255,152,0),.02));}
#combatRoot .btn-cart-action:hover,#combatRoot .btn-cart-action:focus{color:#111;background:var(--cart-accent);border-color:var(--cart-accent);}
#combatRoot .btn-cart-action:disabled{opacity:.5;border-color:var(--cart-accent);color:var(--cart-accent);}
@media (prefers-color-scheme: dark){
	#combatRoot .btn-cart-action{background:rgba(var(--brand-accent-rgb,255,152,0),.15);}
	#combatRoot .btn-cart-action:hover,#combatRoot .btn-cart-action:focus{background:var(--cart-accent);color:#111;}

	/* Dark mode for success cart action buttons */
	#combatRoot .btn-outline-success.btn-cart-action {
		background: rgba(var(--brand-accent-rgb,255,152,0),.15) !important;
	}
	#combatRoot .btn-outline-success.btn-cart-action:hover,
	#combatRoot .btn-outline-success.btn-cart-action:focus {
		background: var(--brand-accent, #ff9800) !important;
		color: #111 !important;
	}
}

/* Drill section separator */
#combatRoot .drill-section-sep{display:flex;align-items:center;gap:.75rem;font-size:.55rem;text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:#555;padding:.25rem .35rem;margin-top:.25rem;margin-bottom:.35rem;position:relative}
#combatRoot .drill-section-sep:before,#combatRoot .drill-section-sep:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,rgba(0,0,0,.15),rgba(0,0,0,.05));}
#combatRoot .drill-section-sep span{background:var(--bs-body-bg,#fff);padding:0 .4rem;border:1px solid #d3d7db;border-radius:1rem;line-height:1.1}
@media (prefers-color-scheme:dark){
	#combatRoot .drill-section-sep{color:#ccd2d7}
	#combatRoot .drill-section-sep:before,#combatRoot .drill-section-sep:after{background:linear-gradient(90deg,rgba(255,255,255,.25),rgba(255,255,255,.05))}
	#combatRoot .drill-section-sep span{background:#1f252b;border-color:#3a434a}
}

/* Scrollable drill list - thème sombre */
#combatRoot .drill-items-scroll {
  max-height: 230px;
  overflow: auto;
  scrollbar-width: thin;
  background: #1f252b;
  border: 1px solid #3a434a;
  border-radius: 0.5rem;
}
#combatRoot .drill-items-scroll::-webkit-scrollbar{width:6px}
#combatRoot .drill-items-scroll::-webkit-scrollbar-thumb{background:#c2c5c7;border-radius:3px}
#combatRoot .drill-items-scroll::-webkit-scrollbar-thumb:hover{background:#a4a8ab}
@media (prefers-color-scheme:dark){
	#combatRoot .drill-items-scroll::-webkit-scrollbar-thumb{background:#3d464d}
	#combatRoot .drill-items-scroll::-webkit-scrollbar-thumb:hover{background:#58626a}
}

/* Active drill chip */
#combatRoot .active-drill-chip{background:var(--combat-chip-bg);color:var(--combat-chip-text);font-size:.55rem;padding:.25rem .55rem;border-radius:1rem;border:1px solid var(--combat-neutral-border);line-height:1;position:relative;box-shadow:0 1px 2px rgba(0,0,0,.05);}
#combatRoot .active-drill-chip .chip-name{font-weight:600;letter-spacing:.25px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#combatRoot .active-drill-chip .badge{font-size:.55rem;padding:.2em .45em;margin-left:.1rem;background:#eef0f2;color:#222;border:1px solid #d3d7db;border-radius:.65rem}
@media (prefers-color-scheme:dark){
	#combatRoot .active-drill-chip{box-shadow:0 1px 2px rgba(0,0,0,.4);}
	#combatRoot .active-drill-chip .badge{background:#2b3238;color:#d5dade;border-color:#3a434a}
}
#combatRoot .active-drill-chip .btn{--bs-btn-padding-y:.1rem;--bs-btn-padding-x:.35rem;--bs-btn-font-size:.55rem;line-height:1;border-radius:1rem}
#combatRoot .active-drill-chip.active{background:var(--brand-accent,#0d6efd);color:#fff;border-color:var(--brand-accent,#0d6efd);}
#combatRoot .active-drill-chip.active .badge{background:rgba(255,255,255,.15);color:#fff;border-color:rgba(255,255,255,.3)}
@media (prefers-color-scheme:dark){
	#combatRoot .active-drill-chip.active{background:linear-gradient(90deg,var(--brand-accent,#0d6efd),#0b5ed7);box-shadow:0 1px 2px rgba(0,0,0,.6);}
	#combatRoot .active-drill-chip.active .badge{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.35)}
}

/* Unified exercise toolbar (align with seances .tech-toolbar) */
#combatRoot .exercise-toolbar{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;background:transparent;border-radius:.5rem;margin-bottom:.5rem;border:1px solid var(--toolbar-border,rgba(var(--bs-border-color-rgb),.1));flex-wrap:wrap}
#combatRoot .exercises-card > .card-header.card-header-transparent{background:transparent;border-bottom:0;box-shadow:none;padding-bottom:.25rem;}
#combatRoot .exercises-card{background:transparent;}
#combatRoot .exercises-card .exercise-toolbar{margin-top:.15rem;}
@media (prefers-color-scheme:dark){
	#combatRoot .exercises-card > .card-header.card-header-transparent{background:transparent;border-color:transparent;}
}
#combatRoot .exercise-toolbar::-webkit-scrollbar{height:8px}
#combatRoot .exercise-toolbar::-webkit-scrollbar-track{background:rgba(0,0,0,.03);border-radius:4px}
#combatRoot .exercise-toolbar::-webkit-scrollbar-thumb{background:rgba(0,0,0,.2);border-radius:4px;transition:background .2s ease}
#combatRoot .exercise-toolbar::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.35)}
#combatRoot .exercise-toolbar .toolbar-group{display:inline-flex;gap:1rem;flex:0 0 auto;--toolbar-active-bg:var(--brand-accent,#0d6efd);align-items:center;justify-content:center;min-width:100px;width:auto}
#combatRoot .exercise-toolbar .toolbar-group > button{padding:.4rem .6rem;font-size:.62rem;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap;line-height:1.1;border-radius:.5rem;position:relative;transition:all .15s ease;font-weight:500}
#combatRoot .exercise-toolbar .toolbar-group > button i{width:1.05rem;text-align:center;font-size:.95rem;line-height:1}
#combatRoot .exercise-toolbar .toolbar-group > button:hover:not(:disabled){background:rgba(var(--brand-accent-rgb,13,110,253),.12);border-color:rgba(var(--brand-accent-rgb,13,110,253),.3);transform:translateY(-1px)}
#combatRoot .exercise-toolbar .toolbar-group > button:active:not(:disabled){transform:translateY(0);transition-duration:.05s}
#combatRoot .exercise-toolbar .toolbar-group > button:focus{outline:none;box-shadow:0 0 0 .15rem rgba(13,110,253,.35)}
#combatRoot .exercise-toolbar .toolbar-group > button.active, #combatRoot .exercise-toolbar .toolbar-group > button[aria-pressed="true"]{background:var(--toolbar-active-bg);color:#fff;box-shadow:0 2px 6px rgba(0,0,0,.15)}
#combatRoot .exercise-toolbar .icon-accent-btn{--btn-accent:var(--brand-accent,#0d6efd);border:1px solid var(--btn-accent);background:rgba(var(--brand-accent-rgb,13,110,253),.08);color:var(--btn-accent);display:inline-flex;align-items:center;justify-content:center;width:40px !important;height:40px;padding:0 !important;border-radius:.6rem;position:relative;transition:all .18s ease;font-size:1.1rem;line-height:1;box-shadow:0 1px 3px rgba(0,0,0,.08);flex-shrink:0}
#combatRoot .exercise-toolbar .icon-accent-btn.cart-orange{--btn-accent:#ff9800;--brand-accent-rgb:255,152,0;background:rgba(255,152,0,.08);}
#combatRoot .exercise-toolbar .icon-accent-btn.cart-blue{--btn-accent:#00bfff;--brand-accent-rgb:0,191,255;background:rgba(0,191,255,.12);box-shadow:0 0 8px rgba(0,191,255,.3);}
#combatRoot .exercise-toolbar .icon-accent-btn.cart-orange:hover:not(:disabled){background:#ff9800;color:#111}
#combatRoot .exercise-toolbar .icon-accent-btn.cart-blue:hover:not(:disabled){background:#00bfff;color:#fff;box-shadow:0 0 15px rgba(0,191,255,.6);}
#combatRoot .exercise-toolbar .icon-accent-btn .badge.selection-badge{position:absolute;top:-8px;right:-8px;font-size:.5rem;padding:.15em .3em;min-width:18px;height:18px;display:flex;align-items:center;justify-content:center;background:var(--btn-accent);color:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px var(--btn-accent),0 2px 4px rgba(0,0,0,.3);z-index:2;pointer-events:none;font-weight:600;line-height:1}
#combatRoot .exercise-toolbar .icon-accent-btn:hover:not(:disabled){background:var(--btn-accent);color:#fff;transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.15)}
#combatRoot .exercise-toolbar .icon-accent-btn:active:not(:disabled){transform:translateY(0);transition-duration:.05s}
#combatRoot .exercise-toolbar .icon-accent-btn:focus{outline:none;box-shadow:0 0 0 .18rem rgba(var(--brand-accent-rgb,13,110,253),.4)}
#combatRoot .exercise-toolbar .icon-accent-btn.has-selection{box-shadow:0 0 0 .2rem rgba(var(--brand-accent-rgb,13,110,253),.35),0 0 0 .35rem rgba(var(--brand-accent-rgb,13,110,253),.18)}
#combatRoot .exercise-toolbar .icon-accent-btn:disabled{opacity:.45;cursor:not-allowed}
/* Expand/Collapse button with white outline */
#combatRoot .exercise-toolbar .icon-accent-btn.expand-collapse-btn{
  --btn-accent:#ffffff;
  --brand-accent-rgb:255,255,255;
  background:transparent;
  border:2px solid #ffffff;
  color:#ffffff;
  box-shadow:none;
}
#combatRoot .exercise-toolbar .icon-accent-btn.expand-collapse-btn:hover:not(:disabled){
  background:rgba(255,255,255,.1);
  border-color:#ffffff;
  color:#ffffff;
  transform:translateY(-1px);
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
#combatRoot .exercise-toolbar .icon-accent-btn.expand-collapse-btn:focus{
  outline:none;
  box-shadow:0 0 0 .18rem rgba(255,255,255,.4);
}
#combatRoot .exercise-toolbar .icon-accent-btn.expand-collapse-btn.partial{
  --btn-accent:#ff9800;
  --brand-accent-rgb:255,152,0;
  border-color:#ff9800;
  color:#ff9800;
}
#combatRoot .exercise-toolbar .icon-accent-btn.expand-collapse-btn.partial:hover:not(:disabled){
  background:rgba(255,152,0,.1);
  border-color:#ff9800;
  color:#ff9800;
}
/* Cart buttons should not have labels - override with-label styles */
#combatRoot .exercise-toolbar .icon-accent-btn.cart-orange,
#combatRoot .exercise-toolbar .icon-accent-btn.cart-blue {
  width:40px !important;
  height:40px !important;
  min-width:40px !important;
  max-width:40px !important;
  padding:0 !important;
  margin:0 !important;
  gap:0 !important;
  flex-shrink:0 !important;
  flex-grow:0 !important;
  box-sizing:border-box !important;
}

#combatRoot .exercise-toolbar .icon-accent-btn.with-label:not(.cart-orange):not(.cart-blue){width:auto;padding:0 .55rem;gap:.35rem;font-size:.75rem;height:34px}
#combatRoot .exercise-toolbar .icon-accent-btn.with-label:not(.cart-orange):not(.cart-blue) .btn-label{font-size:.6rem;font-weight:600;letter-spacing:.25px;line-height:1;text-transform:uppercase;}
#combatRoot .exercise-toolbar .icon-accent-btn.with-label:not(.cart-orange):not(.cart-blue) i{font-size:1rem}
/* Ultra-specific rules to prevent any overlap - simplified */
#combatRoot .exercise-toolbar .toolbar-group {
  /* Ensure container is large enough */
  min-width: 120px !important;
  width: auto !important;
  display: inline-flex !important;
  gap: 0.8rem !important;
  flex-shrink: 0 !important;
  padding: 8px !important;
  overflow: visible !important;
}

#combatRoot .exercise-toolbar .toolbar-group .btn.icon-accent-btn {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  margin: 0 8px 0 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  border-radius: 0.6rem !important;
  overflow: visible !important;
}

#combatRoot .exercise-toolbar .toolbar-group .btn.icon-accent-btn:last-child {
  margin-right: 8px !important;
}

@media (max-width:520px){
	#combatRoot .exercise-toolbar .icon-accent-btn.with-label:not(.cart-orange):not(.cart-blue) .btn-label{display:none}
	#combatRoot .exercise-toolbar .icon-accent-btn.with-label:not(.cart-orange):not(.cart-blue){width:34px;padding:0}
	#combatRoot .exercise-toolbar .icon-accent-btn.cart-orange,
	#combatRoot .exercise-toolbar .icon-accent-btn.cart-blue {width:38px !important;height:38px !important}
	#combatRoot .exercise-toolbar .toolbar-group{gap:0.8rem}
}
@media (prefers-color-scheme:dark){
	#combatRoot .exercise-toolbar .icon-accent-btn{background:rgba(var(--brand-accent-rgb,13,110,253),.15);color:var(--btn-accent);border-color:var(--btn-accent)}
	#combatRoot .exercise-toolbar .icon-accent-btn:hover:not(:disabled){background:var(--btn-accent);color:#111}
	#combatRoot .exercise-toolbar .icon-accent-btn .badge.selection-badge{border-color:rgba(255,255,255,.65);box-shadow:0 0 0 2px var(--btn-accent),0 1px 2px rgba(0,0,0,.6)}
}
#combatRoot .exercise-toolbar .selection-badge{font-size:.55rem;padding:.2em .45em;border:1px solid rgba(0,0,0,.1);}
@media (prefers-color-scheme:dark){
	#combatRoot .exercise-toolbar .selection-badge{border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.15);}
}
@media (max-width:600px){
	#combatRoot .exercise-toolbar{gap:.6rem;padding:.35rem .4rem .25rem;min-height:44px}
	#combatRoot .exercise-toolbar .toolbar-group{gap:.6rem}
	#combatRoot .exercise-toolbar .toolbar-group > button{padding:.35rem .5rem;font-size:.58rem}
	#combatRoot .exercise-toolbar .toolbar-group > button i{font-size:.9rem;width:1rem}
	#combatRoot .exercise-toolbar .icon-accent-btn{width:36px !important;height:36px;font-size:1rem}
	#combatRoot .exercise-toolbar .active-drill-chip{padding:.25rem .45rem;font-size:.58rem}
	#combatRoot .exercise-toolbar .active-drill-chip .chip-name{max-width:100px}
}
@media (prefers-color-scheme:dark){
	#combatRoot .exercise-toolbar{background:linear-gradient(90deg,#242a30,#1f2428);border-color:#3a434a;box-shadow:0 3px 8px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.5);}
	#combatRoot .exercise-toolbar::-webkit-scrollbar-track{background:rgba(255,255,255,.03)}
	#combatRoot .exercise-toolbar::-webkit-scrollbar-thumb{background:rgba(255,255,255,.25)}
	#combatRoot .exercise-toolbar::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)}
	#combatRoot .exercise-toolbar .toolbar-group > button:hover:not(:disabled){background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
}

/* Active Drill Chip */
#combatRoot .exercise-toolbar .active-drill-chip {
  background: linear-gradient(135deg, rgba(255, 152, 0, .12), rgba(255, 152, 0, .08));
  border: 1px solid rgba(255, 152, 0, .3);
  border-radius: .5rem;
  padding: .35rem .6rem;
  font-size: .62rem;
  font-weight: 500;
  color: #d68910;
  box-shadow: 0 1px 3px rgba(0,0,0,.08);
  transition: all .2s ease;
  flex-shrink: 0;
}

#combatRoot .exercise-toolbar .active-drill-chip .chip-name {
  font-weight: 600;
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#combatRoot .exercise-toolbar .active-drill-chip .chip-count {
  font-size: .55rem;
  padding: .15em .35em;
  margin-left: .25rem;
}

#combatRoot .exercise-toolbar .active-drill-chip .btn {
  padding: .1rem .25rem;
  font-size: .5rem;
  border-radius: .25rem;
  margin-left: .25rem;
}

@media (prefers-color-scheme: dark) {
  #combatRoot .exercise-toolbar .active-drill-chip {
    background: linear-gradient(135deg, rgba(255, 152, 0, .18), rgba(255, 152, 0, .12));
    border-color: rgba(255, 152, 0, .4);
    color: #ffb347;
  }
}

/* Styles pour les badges de filtrage (inspiré de FEKM) */
#combatRoot .badge.as-filter {
  border: 1px solid transparent;
  cursor: pointer;
  transition: background .18s, border-color .18s, color .18s, box-shadow .18s;
  text-decoration: none;
}

#combatRoot .badge.as-filter:hover {
  background: rgba(var(--brand-accent-rgb, 13, 110, 253), .22);
  border-color: rgba(var(--brand-accent-rgb, 13, 110, 253), .5);
  color: #fff;
  text-decoration: none;
}

#combatRoot .badge.as-filter.active-filter {
  background: var(--brand-accent, #ff9800);
  color: #fff;
  border-color: var(--brand-accent, #ff9800);
  box-shadow: 0 0 0 2px rgba(255, 152, 0, .35);
}

#combatRoot .badge.as-filter.active-filter:hover {
  background: var(--brand-accent, #ff9800);
  filter: brightness(1.1);
}

/* Mode sombre */
@media (prefers-color-scheme: dark) {
  #combatRoot .badge.as-filter:hover {
    background: rgba(var(--brand-accent-rgb, 255, 152, 0), .32);
    border-color: rgba(var(--brand-accent-rgb, 255, 152, 0), .6);
  }

  #combatRoot .badge.as-filter.active-filter {
    background: var(--brand-accent, #ff9800);
    color: #111;
    box-shadow: 0 0 0 2px rgba(255, 152, 0, .45);
  }
}

/* View Toggle Group */
#combatRoot .view-toggle-group {
  display: inline-flex;
  border: 1px solid #dee2e6;
  border-radius: 0.5rem;
  overflow: hidden;
  background: #fff;
  flex-shrink: 0;
}

#combatRoot .view-toggle-group button {
  padding: 0.4rem 0.6rem;
  border: none;
  background: transparent;
  color: #6c757d;
  font-size: 0.62rem;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  transition: all 0.15s ease;
  border-right: 1px solid #dee2e6;
}

#combatRoot .view-toggle-group button:last-child {
  border-right: none;
}

#combatRoot .view-toggle-group button:hover {
  background: rgba(var(--brand-accent-rgb, 13, 110, 253), 0.08);
  color: var(--brand-accent, #0d6efd);
}

#combatRoot .view-toggle-group button.active {
  background: var(--brand-accent, #0d6efd);
  color: #fff;
}

#combatRoot .view-toggle-group button i {
  font-size: 0.9rem;
}

/* Cards View Styles */
#combatRoot .domaine-section {
  background: #fff;
  border: 1px solid #e9ecef;
  border-radius: 0.75rem;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
  overflow: hidden;
}

#combatRoot .domaine-header {
  background: linear-gradient(135deg, #6c757d, #5a6268);
  border-bottom: 1px solid #dee2e6;
  cursor: pointer;
  user-select: none;
  transition: all 0.2s ease;
  color: white;
}

#combatRoot .domaine-header.expanded {
  background: linear-gradient(135deg, rgba(255, 152, 0, 0.8), rgba(230, 137, 0, 0.8));
  color: black;
  backdrop-filter: blur(2px);
}

#combatRoot .domaine-header .text-muted {
  color: rgba(255, 255, 255, 0.7) !important;
}

#combatRoot .domaine-header.expanded .text-muted {
  color: rgba(0, 0, 0, 0.6) !important;
}

#combatRoot .domaine-header:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

#combatRoot .domaine-header .domaine-chip {
  background: transparent !important;
  border: none !important;
}

#combatRoot .domaine-header .domaine-chip.text-white {
  color: white !important;
}

#combatRoot .domaine-header .domaine-chip.text-dark {
  color: black !important;
}

#combatRoot .domaine-content {
  padding: 1rem;
}

#combatRoot .domaine-chip {
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.5rem 1rem;
  border-radius: 1.5rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

#combatRoot .exercise-card {
  border: 1px solid #3a434a;
  border-radius: 0.5rem;
  transition: all 0.2s ease;
  background: #1f252b !important;
  color: #e5e8ea !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  overflow: visible;
}

/* Forcer le fond noir sur les cartes Bootstrap */
#combatRoot .card.exercise-card {
  background: #1f252b !important;
  background-color: #1f252b !important;
  color: #fff !important;
}

#combatRoot .card.exercise-card .card-body {
  background: transparent !important;
  color: #fff !important;
}

/* Tous les textes dans les cartes d'exercices en blanc */
#combatRoot .exercise-card * {
  color: #fff !important;
}

#combatRoot .exercise-card .card-title {
  color: #fff !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

#combatRoot .exercise-card .card-text {
  color: #e5e8ea !important;
  font-size: 0.85rem !important;
}

#combatRoot .exercise-card .text-muted {
  color: #b8c4ce !important;
  font-size: 0.8rem !important;
}

/* Icône de sélection personnalisée - cercle vert avec coche blanche */
#combatRoot .exercise-card .bi-check-circle-fill {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.3rem;
  height: 1.3rem;
  background-color: #28a745 !important;
  border-radius: 50% !important;
  color: #fff !important;
  font-size: 0.8rem !important;
}

#combatRoot .exercise-card .bi-check-circle-fill.text-success {
  color: #fff !important;
  background-color: #28a745 !important;
}

#combatRoot .exercise-card .bi-check-circle-fill::before {
  content: "✓";
  color: #fff !important;
  font-weight: bold;
  font-size: 0.9rem;
}

/* Améliorer la lisibilité générale */
#combatRoot .exercise-card .small {
  font-size: 0.8rem !important;
}

#combatRoot .exercise-card .badge {
  font-size: 0.65rem !important;
  padding: 0.25rem 0.5rem !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  display: inline-block !important;
}

/* Conteneur des badges pour gérer le wrap */
#combatRoot .exercise-card .mb-2 {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.25rem !important;
  align-items: center !important;
}

/* Badges individuels dans le conteneur flex */
#combatRoot .exercise-card .badge.as-filter {
  flex: 0 1 auto !important;
  min-width: 0 !important;
  max-width: calc(50% - 0.125rem) !important;
}

#combatRoot .exercise-card .badge {
  font-size: 0.75rem !important;
}

#combatRoot .exercise-card.selected {
  background: #2a3338;
  border-color: var(--brand-accent);
  box-shadow: 0 2px 12px rgba(255, 152, 0, 0.4);
  color: #fff;
}

#combatRoot .exercise-card:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5);
  border-color: var(--brand-accent) !important;
  transform: translateY(-3px);
}

#combatRoot .theme-block {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 0.6rem;
  padding: 1rem;
  margin-bottom: 1rem;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}

#combatRoot .theme-header {
  cursor: pointer;
  user-select: none;
  padding: 0.5rem;
  border-radius: 0.4rem;
  transition: all 0.2s ease;
}

#combatRoot .theme-header:hover {
  background: rgba(var(--brand-accent-rgb, 13, 110, 253), 0.08);
  color: var(--brand-accent, #0d6efd);
}

#combatRoot .caret {
  display: inline-block;
  width: .75rem;
  height: .75rem;
  margin-right: .25rem;
  transform: rotate(0deg);
  transition: transform .18s ease;
  opacity: 0.7;
}

#combatRoot .caret::before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-top: .35rem solid transparent;
  border-bottom: .35rem solid transparent;
  border-left: .5rem solid currentColor;
}

#combatRoot .caret.open {
  transform: rotate(90deg);
}

#combatRoot .count-badge {
  font-size: 0.65rem;
  padding: 0.25em 0.5em;
  font-weight: 600;
  border-radius: 1rem;
}

#combatRoot .exercise-cards {
  margin-top: 0.75rem;
}

#combatRoot .exercise-cards .row {
  row-gap: 0.5rem; /* Équivalent à g-2 pour l'espacement vertical */
}

#combatRoot .exercise-card .card-body {
  padding: 1rem;
  overflow: visible;
  background: transparent;
  color: inherit;
}

#combatRoot .exercise-card .card-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: #fff !important;
  margin-bottom: 0.5rem;
}

/* Force tous les textes de la carte à être blancs */
#combatRoot .exercise-card,
#combatRoot .exercise-card *:not(.badge):not(.btn) {
  color: #fff !important;
}

/* Textes spécifiques */
#combatRoot .exercise-card .card-text {
  color: #e5e8ea !important;
}

#combatRoot .exercise-card .small {
  color: #e5e8ea !important;
}

#combatRoot .exercise-card .text-muted {
  color: #b8c2cc !important;
}

#combatRoot .exercise-card .card-title.cursor-pointer {
  cursor: pointer;
  transition: color 0.2s ease;
}

#combatRoot .exercise-card .card-title.cursor-pointer:hover {
  color: var(--brand-accent, #ff9800);
}

/* Empêcher la propagation des clics sur les éléments interactifs */
#combatRoot .exercise-card .badge,
#combatRoot .exercise-card .btn,
#combatRoot .exercise-card a {
  pointer-events: auto;
  position: relative;
  z-index: 1;
}

#combatRoot .exercise-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

/* Conteneur des badges dans les cartes d'exercices */
#combatRoot .exercise-card .card-body .mb-2 {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.35rem !important;
  width: 100% !important;
  margin-bottom: 0.5rem !important;
}

/* Tous les enfants directs du conteneur mb-2 prennent toute la largeur */
#combatRoot .exercise-card .card-body .mb-2 > * {
  width: 100% !important;
  max-width: none !important;
  flex: 1 !important;
}

/* Force les badges à s'afficher en bloc dans les cartes avec meilleure largeur */
#combatRoot .exercise-card .badge {
  font-size: 0.7rem !important;
  margin-bottom: 0 !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  flex-shrink: 0;
  padding: 0.4rem 0.6rem !important;
  text-align: left !important;
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.3 !important;
}

/* Override spécifique pour les badges avec les classes Bootstrap */
#combatRoot .exercise-card .badge.me-1,
#combatRoot .exercise-card .badge.ms-1,
#combatRoot .exercise-card .badge.mx-1 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Override spécifique pour les badges avec d-inline-flex */
#combatRoot .exercise-card .badge.d-inline-flex {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
}

/* Override pour tous les badges qui sont des boutons */
#combatRoot .exercise-card button.badge {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
  border: none !important;
  text-decoration: none !important;
}

/* Règles spécifiques pour les badges dans le conteneur mb-2 */
#combatRoot .exercise-card .mb-2 .badge {
  display: flex !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
  flex-grow: 1 !important;
}

/* Override pour les liens badge aussi */
#combatRoot .exercise-card .mb-2 a.badge {
  display: flex !important;
  width: 100% !important;
  text-decoration: none !important;
}

/* Better button groups in cards - s'adapte au contenu */
#combatRoot .exercise-card .btn-group {
  border-radius: 0.4rem;
  overflow: hidden;
  display: inline-flex;
  width: auto !important;
}

/* Force l'adaptation au contenu même avec w-100 */
#combatRoot .exercise-card .btn-group.w-100 {
  width: auto !important;
  display: inline-flex !important;
}

#combatRoot .exercise-card .btn-group .btn {
  border-radius: 0;
  font-size: 0.7rem;
  padding: 0.4rem 0.6rem;
}



#combatRoot .exercise-card .btn-group .btn .bi-pencil {
  font-size: 0.75rem;
  line-height: 1;
}

#combatRoot .exercise-card .btn-group .btn:first-child {
  border-radius: 0.4rem 0 0 0.4rem;
}

#combatRoot .exercise-card .btn-group .btn:last-child {
  border-radius: 0 0.4rem 0.4rem 0;
}

/* Dark mode for cards */
@media (prefers-color-scheme: dark) {
  #combatRoot .view-toggle-group {
    border-color: #495057;
    background: #343a40;
  }

  #combatRoot .view-toggle-group button {
    color: #adb5bd;
    border-color: #495057;
  }

  #combatRoot .view-toggle-group button:hover {
    background: rgba(var(--brand-accent-rgb, 255, 152, 0), 0.15);
    color: var(--brand-accent, #ff9800);
  }

  #combatRoot .view-toggle-group button.active {
    background: var(--brand-accent, #ff9800);
    color: #111;
  }

  #combatRoot .domaine-section {
    background: #2d3436;
    border-color: #495057;
  }

  #combatRoot .domaine-header {
    background: linear-gradient(135deg, #343a40, #2d3436);
    border-color: #495057;
  }

  #combatRoot .domaine-header:hover {
    background: linear-gradient(135deg, #495057, #343a40);
    color: var(--brand-accent, #ff9800);
  }

  #combatRoot .exercise-card {
    background: #343a40;
    border-color: #495057;
  }

  #combatRoot .exercise-card:hover {
    border-color: rgba(var(--brand-accent-rgb, 255, 152, 0), 0.6);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
  }

  #combatRoot .exercise-card .card-title {
    color: #e9ecef;
  }

  #combatRoot .theme-block {
    background: #343a40;
    border-color: #495057;
  }

  #combatRoot .theme-header:hover {
    background: rgba(var(--brand-accent-rgb, 255, 152, 0), 0.15);
    color: var(--brand-accent, #ff9800);
  }
}