/*
 * Project CSS for editortvpluspanels.
 * Shared classes for website sections.
 */

/* Unified white page background. */
html,
body,
#__next,
main,
.page,
#page,
.website-page,
section,
#tvp-editor-hero,
#editor,
#iptv-editor-seo {
  background-color: #ffffff !important;
}

body {
  background: #ffffff !important;
}

/* Keep only small decorative accents inside cards; remove full-width tinted background bands. */
#tvp-editor-hero > .pointer-events-none,
#editor > .pointer-events-none {
  opacity: 0 !important;
}

/* Hide duplicated title block inside the editor input card. The main page title already appears above the tool. */
#tvpMinimalEditorUi > .mb-6,
#tvpMinimalEditorUi > h3,
#tvpMinimalEditorUi > p {
  display: none !important;
}

#tvpMinimalEditorUi > .mt-12 {
  margin-top: 0 !important;
}

/* Temporary design mode: hide saved playlist dashboard while the editor UI is being designed. */
#editorBody > .space-y-5 {
  display: none !important;
}

#editorBody.tvp-design-mode > .space-y-5 {
  display: none !important;
}

/* Editor input card contrast improvements. */
#tvpMinimalEditorUi {
  background: #f8fafc !important;
  border-color: #dbe3ec !important;
  box-shadow: 0 22px 70px rgba(15, 23, 42, 0.075) !important;
}

#tvpMinimalEditorUi > div:first-child {
  background: #eef2f7 !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.055) !important;
}

#tvpMinimalEditorUi button[id="visualM3uTab"],
#tvpMinimalEditorUi button[id="visualXtreamTab"] {
  background: #f1f5f9 !important;
  color: #334155 !important;
  border-color: #cbd5e1 !important;
}

#tvpMinimalEditorUi button[id="visualM3uTab"] {
  background: #e9eef5 !important;
  color: #111827 !important;
}

#tvpMinimalEditorUi input {
  background: #eef2f7 !important;
  border-color: #cbd5e1 !important;
  color: #111827 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.65) !important;
}

#tvpMinimalEditorUi input::placeholder {
  color: #64748b !important;
}

/* Internal editor readability. */
#editorBody [data-row] [data-name] {
  color: #111827 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  letter-spacing: -0.01em !important;
}

#editorBody .tvp-cat-prefix {
  color: #4c1d95 !important;
  font-size: 15px !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
  white-space: nowrap !important;
}

#editorBody .tvp-col-title {
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  letter-spacing: 0.18em !important;
}

#editorBody .tvp-col-count {
  color: #475569 !important;
  font-size: 12px !important;
  font-weight: 850 !important;
}

#editorBody [data-inline-content] p:first-child {
  color: #4c1d95 !important;
  font-size: 12px !important;
  letter-spacing: 0.16em !important;
}

#editorBody [data-inline-content] h4 {
  color: #111827 !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
}