/* =========================================================================
   CircleTime - Elementor compatibility layer
   Loaded AFTER elementor-frontend.

   Two mechanisms carry the design into Elementor:

   1. styles-elementor.css - a generated copy of the design stylesheet whose
      selectors are prefixed with body.elementor-page, so the design's rules
      outrank Elementor's container defaults wherever the design declares a
      property.

   2. This file - which neutralises Elementor's container variables back to
      their CSS initial values. That matters because the design frequently
      relies on browser defaults it never declares (a div is display:block, a
      flex row is flex-direction:row). Elementor declares those properties on
      every container, so without this reset it silently wins wherever the
      design is implicit. Resetting the VARIABLE rather than the property
      keeps the design's own explicit rules in charge.
   ========================================================================= */

.elementor .e-con.ct-raw{
  /* Box model: a plain div has no padding, margin or imposed size. */
  --padding-top:0px; --padding-right:0px; --padding-bottom:0px; --padding-left:0px;
  --padding-block-start:0px; --padding-block-end:0px;
  --padding-inline-start:0px; --padding-inline-end:0px;
  --margin-top:0px; --margin-right:0px; --margin-bottom:0px; --margin-left:0px;
  --margin-block-start:0px; --margin-block-end:0px;
  --margin-inline-start:0px; --margin-inline-end:0px;
  --width:auto;
  --content-width:none;
  --min-height:auto;

  /* Display: block is the div default. Design blocks that need grid or flex
     declare it themselves and win on specificity. */
  --display:block;

  /* Flex and grid defaults, as the CSS initial values. */
  --flex-direction:row;
  --justify-content:normal;
  --align-items:normal;
  --align-content:normal;
  --flex-wrap:nowrap;
  --gap:0px; --row-gap:0px; --column-gap:0px;
  --grid-auto-flow:row;
  --justify-items:legacy;
  --overlay-opacity:0;
}

/* Widget wrappers must be transparent to the design's layout. */
.elementor .elementor-widget.ct-raw,
.elementor .elementor-element.ct-raw{ width:auto; max-width:none; }
.elementor .elementor-widget.ct-raw > .elementor-widget-container{ margin:0; padding:0; }

/* Elementor's heading widget imposes its kit typography; let the design's own
   heading rules cascade through. */
.elementor .elementor-widget-heading .elementor-heading-title{
  font-family:inherit; font-size:inherit; font-weight:inherit;
  line-height:inherit; color:inherit;
}

/* Elementor gives the text-editor widget its own colour and leading. */
.elementor .elementor-widget-text-editor{
  color:inherit; font-family:inherit; font-size:inherit; line-height:inherit;
}

/* The canvas template styles nothing itself. */
body.elementor-page{ margin:0; }

/* The design's .pic rules own the image box. */
body.elementor-page .pic .elementor-widget-image,
body.elementor-page .pic .elementor-widget-container,
body.elementor-page .pic figure{ margin:0; padding:0; line-height:0; }

/* Decorative doodles position against their section, so the HTML widget
   carrying them must not create a box of its own. */
.elementor .elementor-widget-html.ct-deco,
.elementor .elementor-widget-html.ct-deco > .elementor-widget-container{
  position:static; margin:0; padding:0; line-height:0;
}

/* Full-bleed sections must not be constrained by Elementor's page wrapper. */
body.elementor-page .elementor,
body.elementor-page .elementor > .e-con{ max-width:none; }