/* Server-clone overlay. The clone keeps the page's real classes, so the theme's
 * own stylesheet lays it out; this file grays the bones AND flattens all real
 * color to a monochrome skeleton. Bone-invariant: no url(), no non-empty content:.
 * Bone color is a CSS variable so the color scheme + Pro custom colors apply. */

/* Monochrome flatten: neutralize every real color on the clone so only bones
 * paint. DESCENDANT selector (.wsskl-overlay *), so the overlay root's own
 * backdrop is preserved. Borders keep their WIDTH (color transparent) → the
 * clone's geometry does not shift. background-image:none stops real imagery. */
.wsskl-overlay *{background-color:transparent !important;background-image:none !important;border-color:transparent !important;box-shadow:none !important;color:transparent !important;text-shadow:none !important;}

/* Suppress icon-font glyphs / generated color on pseudo-elements. No `content`
 * rule (the bone-invariant forbids a non-empty content:); color:transparent hides
 * icon-FONT glyphs since they are colored glyph text. The box is kept so
 * clearfix/spacing pseudo-elements do not shift layout. */
.wsskl-overlay *::before,
.wsskl-overlay *::after{color:transparent !important;background:transparent !important;box-shadow:none !important;}

/* Bones paint gray. Scoped under .wsskl-overlay (specificity 0,2,0) so they beat
 * the flatten rule above (0,1,0). Bone color is a CSS var (scheme + Pro colors). */
.wsskl-overlay .wsskl-bone,
.wsskl-overlay .wsskl-bone-media,
.wsskl-overlay .wsskl-bone-block,
.wsskl-overlay .wsskl-bone-bg{background:var(--wsskl-bone-color,#e5e7eb) !important;color:transparent !important;box-shadow:none !important;}
.wsskl-overlay .wsskl-bone{border-radius:4px;}
.wsskl-overlay .wsskl-bone-media,
.wsskl-overlay .wsskl-bone-block{border:0 !important;}

/* Text bones: inline so the length-matched mask wraps inside the real parent block
 * and inherits its line-height — the bone occupies the same vertical box as the
 * real text. box-decoration-break:clone gives each wrapped line its own rounded bar. */
.wsskl-overlay .wsskl-bone-text{background:var(--wsskl-bone-color,#e5e7eb) !important;color:transparent !important;-webkit-box-decoration-break:clone;box-decoration-break:clone;}
.wsskl-overlay img.wsskl-bone-media{object-fit:cover;}

/* Dark color scheme (body.wsskl-theme-dark): darker bones + backdrop. The
 * backdrop var is read by the inline critical CSS (build_overlay_critical_css). */
.wsskl-theme-dark .wsskl-overlay{--wsskl-bone-color:#2b2f36;--wsskl-overlay-bg:#14161a;}
