/*
 * TC Admin Tools - shared "full width" helper.
 *
 * Elements with .tc-bleed are stretched to the full viewport width even when
 * the theme places the shortcode inside a narrow / off-centre content column.
 *
 * Fallback (before JS runs, or if JS is blocked): classic 100vw technique.
 * Once tc-bleed.js has measured the real position it adds .tc-bleed-ready and
 * sets negative side margins (--tc-bleed-ml / --tc-bleed-mr) so the block grows
 * to the screen edges without widening its parent. If the layout ignores that,
 * it falls back to .tc-bleed-fixed (fixed width + --tc-bleed-x shift).
 */

.tc-bleed{
  position:relative !important;
  box-sizing:border-box !important;
  width:100vw !important;
  min-width:0 !important;
  max-width:none !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:0 !important;
  float:none !important;
  flex:0 0 auto !important;
  left:0;
}

.tc-bleed.tc-bleed-ready{
  width:auto !important;
  margin-left:var(--tc-bleed-ml,0px) !important;
  margin-right:var(--tc-bleed-mr,0px) !important;
  left:0 !important;
}

/* Used only when the theme layout (e.g. centred flex column) will not let a
   negative-margin block stretch: fixed width + visual shift instead. */
.tc-bleed.tc-bleed-ready.tc-bleed-fixed{
  width:var(--tc-bleed-w,100vw) !important;
  margin-left:0 !important;
  margin-right:0 !important;
  left:var(--tc-bleed-x,0px) !important;
}

/* Added by tc-bleed.js only to ancestors of a .tc-bleed element that would
   otherwise clip it (theme wrappers with overflow:hidden/auto). */
.tc-bleed-unclip{
  overflow:visible !important;
  overflow-x:visible !important;
  contain:none !important;
  clip-path:none !important;
}

/* Safety net: never let the full-width block (or anything a theme wrapper was
   hiding) create a horizontal scrollbar on pages that use it. */
html.tc-bleed-page,
html.tc-bleed-page body{
  overflow-x:clip !important;
}
