/**
 * Visual Editor (EXT:visual_editor) compatibility
 *
 * VE unwraps <ve-content-element> children onto the host and replaces the
 * parent of <ve-content-area> with the area (copying classes).
 */

/* Inherit typography from surrounding headlines / text */
h1 ve-editable-text,
h2 ve-editable-text,
h3 ve-editable-text,
h4 ve-editable-text,
h5 ve-editable-text,
h6 ve-editable-text,
.headline ve-editable-text,
.subline ve-editable-text,
header ve-editable-text {
  font: inherit;
  color: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  max-width: 100%;
}

ve-editable-rich-text {
  font: inherit;
  color: inherit;
  line-height: inherit;
  display: block;
}

/* ---- zoom-teasers (Sektion): keep frames side-by-side ---- */
.zoom-teasers,
ve-content-element.zoom-teasers,
ve-content-area.zoom-teasers {
  display: flex !important;
  justify-content: center;
  text-align: center;
  flex-wrap: wrap;
}

/* If ve-content-area sits between section and frames, skip its box */
.zoom-teasers > ve-content-area,
ve-content-element.zoom-teasers > ve-content-area {
  display: contents;
}

.zoom-teasers > .frame,
.zoom-teasers > ve-content-element.frame,
.zoom-teasers > ve-content-element.frame-layout-5,
ve-content-element.zoom-teasers > ve-content-element.frame,
ve-content-element.zoom-teasers > ve-content-element.frame-layout-5,
ve-content-area.zoom-teasers > ve-content-element.frame,
ve-content-area.zoom-teasers > ve-content-element.frame-layout-5 {
  margin: 0 10px;
  flex: 0 0 auto;
}

/* ---- opening hours: keep Bootstrap row columns side-by-side in VE ---- */
ve-content-element .opening-hours > .row,
.opening-hours.wrapper > .row {
  display: flex;
  flex-wrap: wrap;
}

ve-content-element .opening-hours .row > [class*="col-"],
.opening-hours .row > [class*="col-"] {
  box-sizing: border-box;
}

/* ---- location tiles: keep text + map side-by-side in VE ---- */
ve-content-element .location-tiles .locationrow {
  display: flex;
  flex-wrap: wrap;
}

ve-content-element .location-tiles .locationrow > [class*="col-"],
ve-content-element .location-tiles .locationrow > .location-tile {
  box-sizing: border-box;
  flex: 0 0 50%;
  max-width: 50%;
}

/* Map stays on the right (template uses order-first for mobile FE) */
ve-content-element .location-tiles .locationrow > .google-map {
  order: 1;
}

ve-content-element .location-tiles .locationrow > .location_body {
  order: 0;
}

/* ---- Container / grid columns (ve-content-area replaces .imia_grid_column) ---- */
.row > ve-content-area.imia_grid_column,
.row > ve-content-area[class*="col-"] {
  position: relative;
  min-height: 1px;
  box-sizing: border-box;
}

.row.gap-90 > ve-content-area {
  padding-right: 45px;
  padding-left: 45px;
}

ve-content-element.container-element,
ve-content-element.container,
ve-content-element.scroll-box,
ve-content-element[class*="bg-"] {
  display: block;
  position: relative;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.container-inner,
ve-content-area.container-inner {
  display: block;
  width: 100%;
  max-width: 100%;
}

.imia_grid_column > ve-content-element,
ve-content-area.imia_grid_column > ve-content-element {
  display: block;
  width: 100%;
  max-width: 100%;
}

/* Only equal-height card layouts should stretch; header-only etc. must stay content-sized */
.layout-4 > .row > * > ve-content-element,
.layout-4 > .row > ve-content-area > ve-content-element {
  display: block;
  height: 100%;
}

.layout-4 > .row > * > ve-content-element.frame,
.layout-4 > .row > ve-content-area > ve-content-element.frame {
  background-color: #f5f5f5;
  border-radius: 10px;
  overflow: hidden;
  height: 100%;
}

.layout-4 > .row > * > ve-content-element.frame.frame-layout-4,
.layout-4 > .row > ve-content-area > ve-content-element.frame.frame-layout-4 {
  height: 300px;
  overflow: auto;
}

/* Header-only CEs must never inherit stretched column height in the Visual Editor */
ve-content-element.frame-type-header,
.frame-type-header {
  height: auto !important;
  min-height: 0 !important;
  align-self: flex-start;
}

ve-content-element.frame-type-header > header,
.frame-type-header > header {
  margin: 0;
}

.imia_grid_column:last-child > ve-content-element.frame-type-teaser,
ve-content-area.imia_grid_column:last-child > ve-content-element.frame-type-teaser {
  margin-bottom: 0;
}

.frame.fs-40 > ve-editable-rich-text,
.frame.fs-40 > ve-editable-rich-text .ck-content > *,
ve-content-element.frame.fs-40 > ve-editable-rich-text .ck-content > * {
  font-size: 40px;
}

.frame-type-text.lh-55 > ve-editable-rich-text,
.frame.lh-55 > ve-editable-rich-text,
ve-content-element.frame-type-text.lh-55 > ve-editable-rich-text,
ve-content-element.frame.lh-55 > ve-editable-rich-text,
.frame-type-text.lh-55 > ve-editable-rich-text .ck-content > *,
.frame.lh-55 > ve-editable-rich-text .ck-content > * {
  line-height: 55px;
}

footer > .container .row > * > ve-content-element,
footer > .container .row > ve-content-area {
  display: block;
}

footer > .container .row > *:first-child > ve-content-element.frame,
footer > .container .row > ve-content-area:first-child > ve-content-element.frame {
  display: block;
  width: max-content;
}

body.high-contrast .layout-4 > .row > ve-content-area > ve-content-element.frame {
  background-color: #000;
}

@media screen and (max-width: 991px) {
  .layout-4 > .row > ve-content-area > ve-content-element.frame {
    height: auto;
  }

  .container-element > .row > ve-content-area.imia_grid_column + ve-content-area.imia_grid_column,
  ve-content-element.container-element > .row > ve-content-area.imia_grid_column + ve-content-area.imia_grid_column {
    margin-top: 20px;
  }
}

@media screen and (max-width: 767px) {
  footer > .container .row > *:first-child > ve-content-element.frame,
  footer > .container .row > ve-content-area > ve-content-element.frame {
    width: 100%;
    max-width: 100%;
  }

  .zoom-teasers > ve-content-element.frame-layout-5,
  ve-content-element.zoom-teasers > ve-content-element.frame-layout-5 {
    margin-left: auto;
    margin-right: auto;
  }
}
