/* ITCH Gaming theme overrides */
body {
  --default-theme-color: #7c6cff !important;
  --default-brand-color: #7c6cff !important;
  --theme-color: #7c6cff !important;
  --brand-color: #7c6cff !important;
  --default-logo-height: 28px !important;
}

@media screen and (min-width: 2200px) {
  body {
    --default-item-width: 342px !important;
    --default-max-item-width: 342px !important;
    --default-item-margin-right-width: 17px !important;
    --default-item-margin-bottom-width: 27px !important;
  }
}

/* Dark mode fix for edit media forms (metadata, trim, captions, chapters, publish) */

/* Nav bar between tabs */
body.dark_theme .media-edit-nav {
  background-color: #1a1a1a !important;
}
body.dark_theme .media-edit-nav a {
  color: #aaa !important;
}
body.dark_theme .media-edit-nav a[style*="font-weight: bold"] {
  color: #fff !important;
}

/* Form wrapper containers (plain div and .user-action-form-inner) */
body.dark_theme .user-action-form-wrap > div,
body.dark_theme .user-action-form-inner {
  background-color: #1e1e1e !important;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4) !important;
}

/* Crispy form field group cards */
body.dark_theme .user-action-form-wrap .form-group {
  background: #2a2a2a !important;
  border-color: #3a3a3a !important;
}

/* Labels */
body.dark_theme .user-action-form-wrap label,
body.dark_theme .user-action-form-wrap .control-label,
body.dark_theme .user-action-form-inner label,
body.dark_theme .user-action-form-inner h1,
body.dark_theme .user-action-form-inner h3 {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Input fields */
body.dark_theme .user-action-form-wrap .controls input:not([type="checkbox"]):not([type="radio"]),
body.dark_theme .user-action-form-wrap .controls select,
body.dark_theme .user-action-form-wrap .controls textarea,
body.dark_theme .user-action-form-wrap input[type="text"],
body.dark_theme .user-action-form-wrap input[type="email"],
body.dark_theme .user-action-form-wrap input[type="number"],
body.dark_theme .user-action-form-wrap input[type="password"],
body.dark_theme .user-action-form-wrap input[type="url"],
body.dark_theme .user-action-form-wrap select,
body.dark_theme .user-action-form-wrap textarea,
body.dark_theme .user-action-form-inner input[type="text"],
body.dark_theme .user-action-form-inner input[type="email"],
body.dark_theme .user-action-form-inner input[type="number"],
body.dark_theme .user-action-form-inner input[type="url"],
body.dark_theme .user-action-form-inner input[type="file"],
body.dark_theme .user-action-form-inner select,
body.dark_theme .user-action-form-inner textarea {
  background: #121212 !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border-color: #404040 !important;
}

/* Help text */
body.dark_theme .user-action-form-wrap .help-text-inline,
body.dark_theme .user-action-form-inner .help-text-inline {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.dark_theme .user-action-form-wrap .help-block,
body.dark_theme .user-action-form-wrap .asteriskField,
body.dark_theme .user-action-form-wrap p,
body.dark_theme .user-action-form-inner .help-block,
body.dark_theme .user-action-form-inner p,
body.dark_theme .user-action-form-inner a {
  color: rgba(255, 255, 255, 0.5) !important;
}
body.dark_theme .user-action-form-inner a:hover {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Submit / action buttons */
body.dark_theme .user-action-form-wrap button[type="submit"],
body.dark_theme .user-action-form-wrap input[type="submit"],
body.dark_theme .user-action-form-inner .primaryAction,
body.dark_theme .user-action-form-inner .secondaryAction,
body.dark_theme .user-action-form-inner button[type="submit"],
body.dark_theme .user-action-form-inner input[type="submit"] {
  background-color: #7c6cff !important;
  border-color: #7c6cff !important;
  color: #fff !important;
}

/* ===== Video editor (Trim) & Chapters editor dark mode ===== */

/* Main card containers */
body.dark_theme #video-editor-trim-root .editing-tools-container,
body.dark_theme #video-editor-trim-root .timeline-container-card,
body.dark_theme #video-editor-trim-root .clip-segments-container,
body.dark_theme #chapters-editor-root .editing-tools-container,
body.dark_theme #chapters-editor-root .timeline-container-card,
body.dark_theme #chapters-editor-root .clip-segments-container {
  background-color: #2a2a2a !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Timeline strip */
body.dark_theme #video-editor-trim-root .timeline-container,
body.dark_theme #chapters-editor-root .timeline-container {
  background-color: #1a2332 !important;
  border-color: rgba(59, 130, 246, 0.3) !important;
}

/* Time codes and segment duration badges */
body.dark_theme #video-editor-trim-root .time-code,
body.dark_theme #video-editor-trim-root .segment-duration,
body.dark_theme #chapters-editor-root .time-code,
body.dark_theme #chapters-editor-root .segment-duration {
  background-color: #333 !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Segment list items */
body.dark_theme #video-editor-trim-root .segment-item,
body.dark_theme #chapters-editor-root .segment-item {
  border-color: #404040 !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Time inputs and buttons */
body.dark_theme #video-editor-trim-root .time-input,
body.dark_theme #chapters-editor-root .time-input {
  background-color: #1e1e1e !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border-color: #404040 !important;
}
body.dark_theme #video-editor-trim-root .time-button,
body.dark_theme #chapters-editor-root .time-button {
  background-color: #404040 !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Tooltip action buttons */
body.dark_theme #video-editor-trim-root .tooltip-action-btn,
body.dark_theme #chapters-editor-root .tooltip-action-btn {
  background-color: #333 !important;
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Delete button */
body.dark_theme #video-editor-trim-root .delete-button,
body.dark_theme #chapters-editor-root .delete-button {
  background-color: #333 !important;
  color: #aaa !important;
}
body.dark_theme #video-editor-trim-root .delete-button:hover,
body.dark_theme #chapters-editor-root .delete-button:hover {
  background-color: #444 !important;
  color: #fff !important;
}

/* Segment hover states */
body.dark_theme #video-editor-trim-root .clip-segment:hover,
body.dark_theme #chapters-editor-root .clip-segment:hover {
  background-color: rgba(255, 255, 255, 0.1) !important;
}
body.dark_theme #video-editor-trim-root .clip-segment.selected:hover,
body.dark_theme #chapters-editor-root .clip-segment.selected:hover {
  background-color: rgba(59, 130, 246, 0.2) !important;
}

/* Tooltips and popups */
body.dark_theme #video-editor-trim-root .segment-tooltip,
body.dark_theme #video-editor-trim-root .empty-space-tooltip,
body.dark_theme #chapters-editor-root .segment-tooltip,
body.dark_theme #chapters-editor-root .empty-space-tooltip {
  background-color: #2a2a2a !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Modal dialogs */
body.dark_theme #video-editor-trim-root .modal-container,
body.dark_theme #chapters-editor-root .modal-container {
  background-color: #1e1e1e !important;
}
body.dark_theme #video-editor-trim-root .modal-title,
body.dark_theme #video-editor-trim-root .modal-content,
body.dark_theme #chapters-editor-root .modal-title,
body.dark_theme #chapters-editor-root .modal-content {
  color: rgba(255, 255, 255, 0.88) !important;
}
body.dark_theme #video-editor-trim-root .modal-close-button,
body.dark_theme #chapters-editor-root .modal-close-button {
  color: #aaa !important;
}

/* Divider lines */
body.dark_theme #video-editor-trim-root .divider,
body.dark_theme #chapters-editor-root .divider {
  border-color: #404040 !important;
}

/* General text inside editors */
body.dark_theme #video-editor-trim-root,
body.dark_theme #chapters-editor-root {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* Toolbar buttons (Play Preview, Undo, Redo, Reset) */
body.dark_theme #video-editor-trim-root .button-group button,
body.dark_theme #chapters-editor-root .button-group button {
  color: rgba(255, 255, 255, 0.88) !important;
}
body.dark_theme #video-editor-trim-root .button-group button:hover:not(:disabled),
body.dark_theme #chapters-editor-root .button-group button:hover:not(:disabled) {
  color: #fff !important;
}

/* Save bar row */
body.dark_theme #video-editor-trim-root .save-buttons-row,
body.dark_theme #chapters-editor-root .save-buttons-row {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* Segment item row background */
body.dark_theme #video-editor-trim-root .segment-item,
body.dark_theme #chapters-editor-root .segment-item {
  background-color: #333 !important;
  border-color: #404040 !important;
  color: rgba(255, 255, 255, 0.88) !important;
}

/* All spans, small text, labels inside editors */
body.dark_theme #video-editor-trim-root span,
body.dark_theme #video-editor-trim-root label,
body.dark_theme #chapters-editor-root span,
body.dark_theme #chapters-editor-root label {
  color: rgba(255, 255, 255, 0.88) !important;
}

/* SVG icons inside buttons */
body.dark_theme #video-editor-trim-root .button-group button svg,
body.dark_theme #chapters-editor-root .button-group button svg {
  fill: rgba(255, 255, 255, 0.88) !important;
  stroke: rgba(255, 255, 255, 0.88) !important;
}

/* Chapters editor specific */
body.dark_theme #chapters-editor-root .chapter-item,
body.dark_theme #chapters-editor-root .chapter-card {
  background-color: #2a2a2a !important;
  border-color: #404040 !important;
  color: rgba(255, 255, 255, 0.88) !important;
}
body.dark_theme #chapters-editor-root input[type="text"],
body.dark_theme #chapters-editor-root textarea {
  background-color: #1e1e1e !important;
  color: rgba(255, 255, 255, 0.88) !important;
  border-color: #404040 !important;
}
