/* ─────────────────────────────────────────────────────────────────────────────
   KreaBoard - Dashboard créateur responsive
   ───────────────────────────────────────────────────────────────────────────── */

@media (max-width: 1380px){
  .kb-dashboardTop{
    grid-template-columns:minmax(0,1fr) 320px;
  }

  .kb-dashboardShortcutGrid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}@media (max-width: 1100px){.kb-dashboardTop{
    grid-template-columns:1fr;
  }.kb-dashboardUniverseGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}@media (max-width: 760px){.kb-dashboardRoot{
    padding:8px 14px 24px;
  }.kb-dashboardWelcome h2{
    font-size:28px;
  }.kb-dashboardWelcomeActions{
    flex-direction:column;
  }.kb-dashboardButton{
    width:100%;
  }.kb-dashboardKpis,
.kb-dashboardUniverseGrid{
    grid-template-columns:1fr;
  }.kb-dashboardKpi{
    min-height:98px;
  }.kb-dashboardActivityFooter{
    grid-template-columns:1fr;
  }.kb-dashboardActivityFooter div + div{
    border-left:0;
    border-top:1px solid #edf2f7;
  }
}


/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard responsive - Barre outils externes + partage rapide
   ───────────────────────────────────────────────────────────────────────────── */

@media (max-width: 1320px){
  .kb-dashboardToolbarGrid{
    grid-template-columns:1fr;
  }

  .kb-dashboardExternalToolbarGrid{
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
}

@media (max-width: 920px){
  .kb-dashboardExternalToolbarGrid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .kb-dashboardExternalToolbarGrid{
    grid-template-columns:1fr;
  }

  .kb-dashboardToolbarHead{
    align-items:flex-start;
    flex-direction:column;
  }

  .kb-dashboardShareTool{
    flex:1 1 calc(50% - 10px);
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard responsive - Partage rapide
   ───────────────────────────────────────────────────────────────────────────── */

@media (max-width: 760px){
  .kb-dashboardShareToolbarRow{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}




@media (max-width: 560px){
  .kb-dashboardPlanLevels{
    grid-template-columns:1fr;
  }

  .kb-dashboardPlanProgress{
    display:none;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard responsive - Plan évolution rectangle compact
   ───────────────────────────────────────────────────────────────────────────── */

@media (max-width: 1380px){
  .kb-dashboardPlanCard--evolution{
    padding:13px;
  }

  .kb-dashboardPlanLevel{
    min-height:72px;
    padding:9px 7px 8px;
  }

  .kb-dashboardPlanUpgrade{
    padding:11px 12px;
  }
}

@media (max-width: 1100px){
  .kb-dashboardPlanLevels{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .kb-dashboardPlanUpgradeActions{
    justify-content:flex-start;
  }
}

@media (max-width: 560px){
  .kb-dashboardPlanLevels{
    grid-template-columns:1fr;
  }

  .kb-dashboardPlanProgress{
    display:none;
  }

  .kb-dashboardPlanUpgradeActions{
    flex-direction:column;
    align-items:stretch;
  }

  .kb-dashboardPlanUpgradeButton,
  .kb-dashboardPlanCompare{
    justify-content:center;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard responsive - Top plan horizontal
   ───────────────────────────────────────────────────────────────────────────── */

@media (max-width: 1380px){
  .kb-dashboardTop{
    grid-template-columns:minmax(360px,1fr) minmax(560px,620px);
  }

  .kb-dashboardPlanUpgrade{
    grid-template-columns:1fr;
  }

  .kb-dashboardPlanUpgradeText ul{
    grid-template-columns:1fr;
  }

  .kb-dashboardPlanUpgradeActions{
    min-width:0;
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:flex-start;
  }
}

@media (max-width: 1180px){
  .kb-dashboardTop{
    grid-template-columns:1fr;
  }

  .kb-dashboardWelcome{
    min-height:auto;
  }
}

@media (max-width: 560px){
  .kb-dashboardPlanLevels{
    grid-template-columns:1fr;
  }

  .kb-dashboardPlanProgress{
    display:none;
  }

  .kb-dashboardPlanUpgradeActions{
    flex-direction:column;
    align-items:stretch;
  }

  .kb-dashboardPlanUpgradeButton,
  .kb-dashboardPlanCompare{
    justify-content:center;
  }
}



/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard adaptatif - Mesure réelle du conteneur
   Rôle : utiliser ResizeObserver sans modifier le design global KreaBoard.
   Source : data-kb-container-size posé par /modules/core/screen.
   ───────────────────────────────────────────────────────────────────────────── */

/* Conteneur dashboard moyen : cas typique PC portable / fenêtre réduite. */
.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardTop,
.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardTop,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardTop {
  grid-template-columns: 1fr;
}

@media (min-width: 1051px) {
  .kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardKpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardKpis,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardKpis {
  grid-template-columns: 1fr;
}

/* Blocs centraux :
   - md sur ordinateur : conserver les trois univers de pilotage côte à côte ;
   - sm et xs : empiler pour la tablette et le mobile. */
@media (min-width: 1051px) {
  .kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardMiddle {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "tasks appointments"
      "activity activity";
    align-items: stretch;
  }

  .kb-dashboardRoot[data-kb-container-size="md"]
  .kb-dashboardPanel--priorityActions {
    grid-area: tasks;
  }

  .kb-dashboardRoot[data-kb-container-size="md"]
  .kb-dashboardPanel--appointments {
    grid-area: appointments;
  }

  .kb-dashboardRoot[data-kb-container-size="md"]
  .kb-dashboardPanel--activity {
    grid-area: activity;
    min-height: 0;
  }
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardMiddle,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardMiddle {
  grid-template-columns: 1fr;
}

/* Vos univers : 4 colonnes sont trop serrées quand le dashboard réel est en md. */
.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardUniverseGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardUniverseGrid,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardUniverseGrid {
  grid-template-columns: 1fr;
}

/* Outils externes + partage rapide : éviter la colonne forcée à 420px. */
.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardToolbarGrid,
.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardToolbarGrid,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardToolbarGrid {
  grid-template-columns: 1fr;
}

.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardExternalToolbarGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardExternalToolbarGrid,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardExternalToolbarGrid {
  grid-template-columns: 1fr;
}

.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardShareToolbarRow {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardShareToolbarRow,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardShareToolbarRow {
  grid-template-columns: 1fr;
}

/* Plan abonnement : garder la structure, mais éviter la compression des cartes. */
.kb-dashboardRoot[data-kb-container-size="md"] .kb-dashboardPlanLevels {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardPlanLevels,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardPlanLevels {
  grid-template-columns: 1fr;
}

.kb-dashboardRoot[data-kb-container-size="sm"] .kb-dashboardPlanProgress,
.kb-dashboardRoot[data-kb-container-size="xs"] .kb-dashboardPlanProgress {
  display: none;
}


/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard créateur - PC compact adaptatif
   Rôle : conserver le rendu grand écran sur les PC portables et micro-PC.
   ───────────────────────────────────────────────────────────────────────────── */

@media (min-width: 1051px) and (max-width: 1500px) {
  /* Les quatre KPI restent toujours sur la même ligne sur ordinateur. */

  .kb-dashboardKpis {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
  }

  .kb-dashboardKpi {
    min-width: 0;
    min-height: 96px;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 12px;
    padding: 14px 15px;
    border-radius: 17px;
  }

  .kb-dashboardKpiIcon {
    width: 46px;
    height: 46px;
    font-size: 23px;
    border-radius: 13px;
  }

  .kb-dashboardKpiBody {
    min-width: 0;
  }

  .kb-dashboardKpi small {
    font-size: 12px;
    line-height: 1.2;
  }

  .kb-dashboardKpi strong {
    font-size: 24px;
    line-height: 1;
  }

  .kb-dashboardKpi em {
    margin-top: 5px;
    font-size: 11px;
    line-height: 1.25;
    white-space: normal;
  }

  /* Les trois panneaux conservent la composition du grand écran. */

  .kb-dashboardMiddle {
    grid-template-columns:
      minmax(245px, .95fr)
      minmax(360px, 1.35fr)
      minmax(245px, .95fr);
    align-items: stretch;
    gap: 12px;
  }

  .kb-dashboardPanel {
    min-width: 0;
    padding: 17px;
    border-radius: 17px;
  }

  /* Les titres ne peuvent plus chevaucher les actions de droite. */

  .kb-dashboardPanelHead {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 9px;
    min-width: 0;
    margin-bottom: 12px;
  }

  .kb-dashboardPanelHead h3 {
    min-width: 0;
    font-size: 17px;
    line-height: 1.15;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
  }

  .kb-dashboardPanelHead button {
    justify-self: end;
    padding: 3px 0;
    white-space: nowrap;
    font-size: 11px;
  }

  .kb-dashboardTabs {
    justify-self: end;
    gap: 5px;
  }

  .kb-dashboardTabs span {
    padding: 6px 10px;
    font-size: 11px;
  }

  /* Priority Actions utilise la même logique d’en-tête. */

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsHead {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 9px;
    min-width: 0;
    margin-bottom: 12px;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsTitle {
    min-width: 0;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsTitle h3 {
    min-width: 0;
    font-size: 17px;
    line-height: 1.15;
    white-space: normal !important;
    overflow-wrap: normal;
    word-break: normal;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsConfig {
    justify-self: end;
    font-size: 11px;
    white-space: nowrap;
  }

  /* Panneau gauche :
     titre sur la première ligne, action alignée à droite dessous. */

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsHead {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    row-gap: 6px;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsTitle {
    width: 100%;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsConfig {
    grid-column: 1;
    grid-row: 2;
    justify-self: end;
  }

  /* Panneau droit :
     titre sur la première ligne, Voir tout aligné à droite dessous. */

  .kb-dashboardPanel--appointments .kb-dashboardPanelHead {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    row-gap: 6px;
  }

  .kb-dashboardPanel--appointments .kb-dashboardPanelHead h3 {
    grid-column: 1;
    grid-row: 1;
    width: 100%;
  }

  .kb-dashboardPanel--appointments .kb-dashboardPanelHead button {
    grid-column: 1;
    grid-row: 2;
    justify-self: end;
  }

  .kb-dashboardEmpty,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsEmpty {
    padding: 14px;
    border-radius: 14px;
  }

  .kb-dashboardEmpty strong,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsEmpty strong {
    font-size: 13px;
  }

  .kb-dashboardEmpty span,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsEmpty span {
    font-size: 11px;
    line-height: 1.35;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard créateur - Micro-PC et faible hauteur
   Rôle : conserver les trois panneaux centraux alignés et compacts.
   ───────────────────────────────────────────────────────────────────────────── */

@media (min-width: 1051px) and (max-height: 760px) {
  .kb-dashboardMiddle {
    grid-template-columns:
      minmax(240px, .95fr)
      minmax(350px, 1.35fr)
      minmax(240px, .95fr);
    align-items: stretch;
    gap: 12px;
    margin-bottom: 18px;
  }

  .kb-dashboardPanel {
    min-width: 0;
    height: 100%;
    padding: 17px;
    border-radius: 17px;
  }

  .kb-dashboardPanel--activity,
  .kb-dashboardPanel--appointments,
  .kb-dashboardPanel--priorityActions {
    display: flex;
    flex-direction: column;
    align-self: stretch;
  }

  .kb-dashboardPanelHead {
    flex: 0 0 auto;
    min-height: 24px;
    margin-bottom: 10px;
  }

  .kb-dashboardPanelHead h3 {
    font-size: 16px;
  }

  .kb-dashboardPanel--appointments .kb-dashboardPanelHead,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsHead {
    row-gap: 4px;
  }

  .kb-dashboardPanel--appointments .kb-dashboardPanelHead button,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsConfig {
    font-size: 10.5px;
  }

  .kb-dashboardEmpty {
    flex: 1 1 auto;
    min-height: 120px;
    padding: 14px;
    border-radius: 14px;
  }

  .kb-dashboardEmpty--chart {
    min-height: 150px;
  }

  .kb-dashboardActivityFooter {
    flex: 0 0 auto;
    margin-top: 11px;
    border-radius: 14px;
  }

  .kb-dashboardActivityFooter div {
    padding: 10px 13px;
  }

  .kb-dashboardActivityFooter small {
    font-size: 11px;
  }

  .kb-dashboardActivityFooter strong {
    font-size: 16px;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsHead {
    min-height: 24px;
    margin-bottom: 12px;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsTitle h3 {
    font-size: 17px;
  }

  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsEmpty {
    flex: 1 1 auto;
    min-height: 120px;
    padding: 14px;
    border-radius: 14px;
  }
}

/* Micro-PC très court */
@media (min-width: 1051px) and (max-height: 680px) {
  .kb-dashboardMiddle {
    gap: 10px;
    margin-bottom: 14px;
  }

  .kb-dashboardPanel {
    padding: 14px;
    border-radius: 15px;
  }

  .kb-dashboardPanelHead,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsHead {
    margin-bottom: 9px;
  }

  .kb-dashboardEmpty,
  .kb-dashboardPanel.kb-dashboardPanel--priorityActions
  .kb-priorityActionsEmpty {
    min-height: 105px;
    padding: 12px;
  }

  .kb-dashboardEmpty--chart {
    min-height: 125px;
  }

  .kb-dashboardActivityFooter {
    margin-top: 9px;
  }

  .kb-dashboardActivityFooter div {
    padding: 8px 11px;
  }
}

/* ─────────────────────────────────────────────────────────────────────────────
   Dashboard adaptatif - Sous-conteneurs mesurés par Screen Manager
   Rôle : adapter réellement les pictos, cartes outils et boutons de partage.
   ───────────────────────────────────────────────────────────────────────────── */

/* Outils externes : largeur réelle du bloc outils. */
.kb-dashboardExternalToolbar[data-kb-container-size="xl"] .kb-dashboardExternalToolbarGrid,
.kb-dashboardExternalToolbar[data-kb-container-size="lg"] .kb-dashboardExternalToolbarGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalToolbarGrid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalToolbarGrid,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalToolbarGrid {
  grid-template-columns: 1fr;
}

/* Cartes outils : ne plus écraser le picto ni le texte. */
.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalTool,
.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalTool,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalTool {
  grid-template-columns: 48px minmax(0, 1fr) 20px;
  min-height: 88px;
  padding: 15px 16px;
  gap: 14px;
}

.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalToolIcon,
.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalToolIcon,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalToolIcon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}

.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalToolIcon img,
.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalToolIcon img,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalToolIcon img {
  width: 34px;
  height: 34px;
}

.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalToolText strong,
.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalToolText strong,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalToolText strong {
  font-size: 14px;
  line-height: 1.2;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

.kb-dashboardExternalToolbar[data-kb-container-size="md"] .kb-dashboardExternalToolText small,
.kb-dashboardExternalToolbar[data-kb-container-size="sm"] .kb-dashboardExternalToolText small,
.kb-dashboardExternalToolbar[data-kb-container-size="xs"] .kb-dashboardExternalToolText small {
  font-size: 12px;
  line-height: 1.3;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}

/* Partage rapide : boutons lisibles selon la largeur réelle du bloc. */
.kb-dashboardShareToolbar[data-kb-container-size="xl"] .kb-dashboardShareToolbarRow,
.kb-dashboardShareToolbar[data-kb-container-size="lg"] .kb-dashboardShareToolbarRow,
.kb-dashboardShareToolbar[data-kb-container-size="md"] .kb-dashboardShareToolbarRow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 10px;
}

.kb-dashboardShareToolbar[data-kb-container-size="xl"] .kb-dashboardShareTool,
.kb-dashboardShareToolbar[data-kb-container-size="lg"] .kb-dashboardShareTool,
.kb-dashboardShareToolbar[data-kb-container-size="md"] .kb-dashboardShareTool {
  min-height: 46px;
  padding: 0 12px;
  justify-content: center;
}

.kb-dashboardShareToolbar[data-kb-container-size="xl"] .kb-dashboardShareToolIcon,
.kb-dashboardShareToolbar[data-kb-container-size="lg"] .kb-dashboardShareToolIcon,
.kb-dashboardShareToolbar[data-kb-container-size="md"] .kb-dashboardShareToolIcon {
  width: 22px;
  height: 22px;
}

.kb-dashboardShareToolbar[data-kb-container-size="xl"] .kb-dashboardShareToolIcon img,
.kb-dashboardShareToolbar[data-kb-container-size="lg"] .kb-dashboardShareToolIcon img,
.kb-dashboardShareToolbar[data-kb-container-size="md"] .kb-dashboardShareToolIcon img {
  width: 22px;
  height: 22px;
}

.kb-dashboardShareToolbar[data-kb-container-size="sm"] .kb-dashboardShareToolbarRow,
.kb-dashboardShareToolbar[data-kb-container-size="xs"] .kb-dashboardShareToolbarRow {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.kb-dashboardShareToolbar[data-kb-container-size="sm"] .kb-dashboardShareTool,
.kb-dashboardShareToolbar[data-kb-container-size="xs"] .kb-dashboardShareTool {
  width: 100%;
  min-height: 46px;
  justify-content: center;
}