/* ------------------------------------------------------------------
   FIX Elementor shrink-wrap:
   - Elementor widget container can be inline/auto width
   - Our cloud uses absolutely positioned children => no intrinsic width
   => force container width to 100% for this widget
------------------------------------------------------------------- */
.elementor-widget-adk_word_mosaic,
.elementor-widget-adk_word_mosaic .elementor-widget-container{
  width:100%;
  max-width:100%;
  display:block;
}

.elementor-widget-adk_word_mosaic .elementor-widget-container{
  flex: 1 1 auto;
  min-width: 0;
}

/* Container */
.adk-word-mosaic{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  overflow:visible;
  border-radius:var(--radius,0px);
  background:var(--bg,transparent);
}

/* MODE routing */
.adk-word-mosaic[data-mode="cross"] .wm-grid{ display:grid; }
.adk-word-mosaic[data-mode="cross"] .wm-cloud{ display:none; }

.adk-word-mosaic[data-mode="cloud"] .wm-grid{ display:none; }
.adk-word-mosaic[data-mode="cloud"] .wm-cloud{ display:block; }

/* ---------------------------
   MODE: CROSS (grid)
---------------------------- */
.adk-word-mosaic .wm-grid{
  display:none;
  gap:var(--gap,6px);
  grid-auto-rows: var(--cell,28px);
  grid-auto-columns: var(--cell,28px);
  align-content:start;
  justify-content:start;
}

.adk-word-mosaic .wm-cell{
  width:var(--cell,28px);
  height:var(--cell,28px);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--color,#111);
  line-height:1;
  user-select:none;
}

.adk-word-mosaic .wm-cell.is-empty{
  visibility:hidden;
}

.adk-word-mosaic .wm-cell.is-cross{
  color:var(--cross-color, var(--color,#111));
}

/* ---------------------------
   MODE: CLOUD (word cloud)
---------------------------- */
.adk-word-mosaic .wm-cloud{
  display:none;
  position:relative;
  width:100%;
  max-width:100%;
  min-width: 120px; /* prevents 1px collapse */
  height:var(--cloud-h,360px);
  min-height:120px;
  box-sizing:border-box;
  overflow:hidden;
}

/* Inner virtual canvas scaled to fit actual width */
.adk-word-mosaic .wm-cloud-inner{
  position:relative;
  width:100%;
  height:100%;
  transform-origin: 0 0;
}

/* Words are absolutely positioned on the virtual canvas */
.adk-word-mosaic .wm-word{
  position:absolute;
  left:0;
  top:0;
  white-space:nowrap;
  line-height:1;
  user-select:none;
  transform:translate3d(var(--x,0px), var(--y,0px), 0);
  color:var(--color,#111);
}

/* palette vars defaults */
.adk-word-mosaic{
  --p1:#111111;
  --p2:#d10000;
  --p3:#0066ff;
}

/* Panel RAW_HTML helper styling */
.adk-wm-panel-tools{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.adk-wm-panel-hint{
  font-size:12px;
  opacity:.75;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .adk-word-mosaic{ scroll-behavior:auto; }
}