/*
 * WLSM Astra / Elementor frontend compatibility layer.
 * Loaded only when a School Management shortcode is rendered or detected on the page.
 */

.wlsm-shortcode-shell,
.wlsm-shortcode-shell *,
.wlsm-shortcode-shell *::before,
.wlsm-shortcode-shell *::after {
  box-sizing: border-box;
}

.wlsm-shortcode-shell {
  display: block;
  width: 100%;
  max-width: 100%;
  clear: both;
  position: relative;
  isolation: isolate;
  color: inherit;
  font-family: inherit;
}

.wlsm-shortcode-shell > :first-child {
  margin-top: 0;
}

.wlsm-shortcode-shell > :last-child {
  margin-bottom: 0;
}

.elementor-widget-shortcode .wlsm-shortcode-shell,
.elementor-widget-text-editor .wlsm-shortcode-shell,
.elementor-shortcode .wlsm-shortcode-shell,
.ast-container .wlsm-shortcode-shell,
.ast-separate-container .wlsm-shortcode-shell,
.entry-content .wlsm-shortcode-shell,
.site-content .wlsm-shortcode-shell {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.wlsm-shortcode-shell :where(.wlsm, .wlsm-grid, .wlsm-container, .wlsm-lesson-shortcode-wrap, .wlsm-modern-lesson-library) {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.wlsm-shortcode-shell :where(.wlsm-row) {
  max-width: none;
}

.wlsm-shortcode-shell :where(img, video, iframe, canvas) {
  max-width: 100%;
}

.wlsm-shortcode-shell :where(table) {
  width: 100%;
}

.wlsm-shortcode-shell :where(input, select, textarea, button) {
  font-family: inherit;
}

.wlsm-shortcode-shell :where(a) {
  text-decoration-thickness: auto;
}

/* Keep Astra content wrappers from clipping WLSM dashboards and lesson viewers. */
.wlsm-has-school-shortcode :where(.entry-content, .site-content, .ast-container, .elementor-widget-container):has(.wlsm-shortcode-shell) {
  overflow: visible;
}

/* Elementor editor placeholder: safe visual block instead of rendering complex dashboards in the builder canvas. */
.wlsm-elementor-shortcode-placeholder {
  padding: 18px;
  border: 2px dashed #94a3b8;
  border-radius: 12px;
  background: #f8fafc;
  color: #334155;
  font-family: Arial, sans-serif;
  line-height: 1.6;
  text-align: center;
  width: 100%;
}

.wlsm-elementor-shortcode-placeholder code {
  display: inline-block;
  margin: 8px 0 4px;
  padding: 3px 7px;
  border-radius: 6px;
  background: #e2e8f0;
  color: #0f172a;
}

/* Prevent generic Elementor/Astra button rules from flattening the dashboard controls. */
.wlsm-shortcode-shell :where(.wlsm-btn, .wlsm-container .btn, .wlsm-container button, .wlsm-container input[type="submit"], .wlsm-lesson-view-btn, .wlsm-smart-file-btn) {
  line-height: 1.25;
  cursor: pointer;
}

/* Student/parent account shells must be able to breathe inside Elementor columns. */
.wlsm-shortcode-school_management_account .wlsm-container,
.wlsm-shortcode-wlsm_account .wlsm-container,
.wlsm-shortcode-sm_account .wlsm-container {
  margin-inline: auto;
}

/* Lessons are intentionally page-content width by default; only actual file viewers go full bleed. */
.wlsm-shortcode-shell .wlsm-lesson-shortcode-wrap {
  margin-inline: auto;
}

/* RTL alignment for Arabic sites without depending on theme RTL classes. */
.wlsm-shortcode-shell.wlsm-shortcode-rtl,
.wlsm-shortcode-shell.wlsm-shortcode-rtl :where(.wlsm, .wlsm-container, .wlsm-lesson-shortcode-wrap) {
  direction: rtl;
}

.wlsm-shortcode-shell.wlsm-shortcode-rtl :where(input[type="email"], input[type="url"], input[type="number"], input[type="tel"], input[type="password"], .wlsm-force-ltr) {
  direction: ltr;
  text-align: left;
}

/* Fallback for browsers without :has(): the shell itself stays unclipped. */
.wlsm-shortcode-shell :where(.wlsm-content-area, .wlsm-smart-viewer, .wlsm-smart-panel, .wlsm-smart-inline-preview, .wlsm-smart-notebook-preview) {
  min-width: 0;
}

@media (max-width: 767px) {
  .wlsm-shortcode-shell {
    overflow-x: visible;
  }

  .wlsm-shortcode-shell :where(.wlsm-container.wlsm-container-student, .wlsm-container.wlsm-container-parent) {
    width: 100%;
  }
}