/* widget-spacer.css: estilos de presentación; comprueba sus rangos responsive al editar. */
.site-column .site-spacer-inner {
  height: var(--spacer-size);
}
.layout {
  --container-widget-width: 100%;
}
.layout-inner > .component-spacer,
.layout > .component-spacer {
  width: var(--container-widget-width, var(--spacer-size));
  --align-self: var(--container-widget-align-self, initial);
  --flex-shrink: 0;
}
.layout-inner > .component-spacer > .content-box,
.layout > .component-spacer > .content-box {
  height: 100%;
  width: 100%;
}
.layout-inner
  > .component-spacer
  > .content-box
  > .site-spacer,
.layout
  > .component-spacer
  > .content-box
  > .site-spacer {
  height: 100%;
}
.layout-inner
  > .component-spacer
  > .content-box
  > .site-spacer
  > .site-spacer-inner,
.layout
  > .component-spacer
  > .content-box
  > .site-spacer
  > .site-spacer-inner {
  height: var(--container-widget-height, var(--spacer-size));
}
.layout-inner
  > .component-spacer:not(:has(> .content-box))
  > .site-spacer,
.layout
  > .component-spacer:not(:has(> .content-box))
  > .site-spacer {
  height: 100%;
}
.layout-inner
  > .component-spacer:not(:has(> .content-box))
  > .site-spacer
  > .site-spacer-inner,
.layout
  > .component-spacer:not(:has(> .content-box))
  > .site-spacer
  > .site-spacer-inner {
  height: var(--container-widget-height, var(--spacer-size));
}
.layout-inner > .component-spacer.component-empty,
.layout > .component-spacer.component-empty {
  min-height: 22px;
  min-width: 22px;
  position: relative;
}
.layout-inner
  > .component-spacer.component-empty
  .component-empty-icon,
.layout
  > .component-spacer.component-empty
  .component-empty-icon {
  height: 22px;
  inset: 0;
  margin: auto;
  padding: 0;
  position: absolute;
  width: 22px;
}