/*
 * Legacy fallback stylesheet.
 *
 * Brand styling lives in app/assets/tailwind/application.css and is served as
 * /assets/tailwind.css. This file only contains:
 *   1. Neutral fallbacks for .wsite-* classes embedded in CMS page bodies
 *      (ported from Weebly), so historical content keeps rendering legibly.
 *   2. Video gallery layout, kept compatible with existing markup.
 *   3. The admin-only .unchangable badge used in pages views.
 *
 * No `require_tree`/`require_self` manifest directives — this file IS the
 * legacy fallback. Tailwind handles everything else.
 */

/* ---------- Weebly / editmysite legacy class fallbacks ---------- */

.wsite-multicol,
.wsite-multicol-table-wrap,
.wsite-multicol-table,
.wsite-multicol-tbody,
.wsite-multicol-tr,
.wsite-multicol-col {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
}
@media (min-width: 768px) {
  .wsite-multicol-table { display: table; width: 100%; }
  .wsite-multicol-tbody { display: table-row-group; }
  .wsite-multicol-tr { display: table-row; }
  .wsite-multicol-col { display: table-cell; vertical-align: top; padding: 0 1rem; }
}

.wsite-image,
.wsite-image-border-none {
  text-align: center;
  margin: 0.5rem 0;
}
.wsite-image img { max-width: 100%; height: auto; }

div.paragraph { padding: 0.5em 0; }
div.paragraph ul,
div.paragraph ol {
  padding-left: 2.3em;
  margin: 0.5em 0;
}
div.paragraph li { margin: 0.25em 0; }
div.paragraph ul,
div.paragraph ul li { list-style: disc outside; }
div.paragraph ol,
div.paragraph ol li { list-style: decimal outside; }

/* Drop Weebly button-image hacks; .btn / .wsite-button reskinned via Tailwind layer */
.wsite-button-inner { background: none; padding: 0; }

/* ---------- Video gallery ---------- */

div.video {
  position: relative;
  display: inline-block;
  margin: 1rem;
  opacity: 0.92;
  transition: opacity 150ms ease;
}
div.video:hover { opacity: 1; }
.play_btn { position: absolute; top: 1.5rem; left: 2rem; }
div.admin_btns {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: rgba(44, 24, 16, 0.75);
  color: #fff;
}
.admin_btns a { font-size: 0.8125rem; color: #fff; padding: 0.25rem 0.5rem; }
span.home_page_video,
span.video_title {
  display: block;
  position: absolute;
  background-color: rgba(44, 24, 16, 0.75);
  color: #fff;
}
span.home_page_video { top: 45%; padding: 0.5rem 1rem; }
span.video_title {
  bottom: 0;
  width: 100%;
  text-align: center;
  font-size: 0.75rem;
  padding: 0.25rem 0.5rem;
}

/* ---------- Misc legacy ---------- */

.unchangable {
  display: inline-block;
  border: 1px solid #d4c4a8;
  background-color: #faf6ec;
  padding: 0.25rem 0.5rem;
  font-size: 0.8125rem;
  color: #6b6258;
  border-radius: 0.25rem;
}

/* CKEditor wraps inputs in `.cke_*` containers — keep them block-level on mobile */
.cke,
.cke_inner { max-width: 100%; }