/* ============================================================
   PATCH V14.0 - Upload modal clean
   ============================================================ */

.crs-upload-v14,
.crs-upload-v14 * {
  box-sizing: border-box !important;
}

.crs-upload-v14-hidden-original {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -99999px !important;
  top: -99999px !important;
}

.crs-upload-v14 {
  width: min(620px, calc(100vw - 28px)) !important;
  color: #ffffff !important;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.crs-upload-v14-shell {
  position: relative !important;
  padding: 30px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(181, 116, 255, 0.68) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(240, 75, 255, 0.22), transparent 34%),
    radial-gradient(circle at 90% 100%, rgba(0, 168, 255, 0.22), transparent 36%),
    linear-gradient(180deg, rgba(18, 13, 50, 0.98), rgba(18, 9, 43, 0.97)) !important;
  box-shadow:
    0 0 38px rgba(154, 80, 255, 0.38),
    0 0 80px rgba(0, 156, 255, 0.18),
    inset 0 0 30px rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(22px) !important;
}

.crs-upload-v14-title-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}

.crs-upload-v14-title {
  margin: 0 !important;
  font-size: 30px !important;
  font-weight: 950 !important;
  letter-spacing: -0.5px !important;
  color: #ffffff !important;
  text-shadow: 0 0 18px rgba(141, 165, 255, 0.35) !important;
}

.crs-upload-v14-close {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  border: 0 !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  color: #ffd9ff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  font-size: 28px !important;
  line-height: 1 !important;
  box-shadow: inset 0 0 18px rgba(255, 255, 255, 0.04) !important;
}

.crs-upload-v14-label {
  display: block !important;
  margin: 0 0 9px 0 !important;
  color: #f4f0ff !important;
  font-size: 15px !important;
  font-weight: 850 !important;
}

.crs-upload-v14-required {
  color: #ff58d7 !important;
}

.crs-upload-v14-preview {
  margin-bottom: 22px !important;
}

.crs-upload-v14-wave-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 48px 1fr !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 116px !important;
  padding: 14px !important;
  border-radius: 16px !important;
  border: 1px solid rgba(122, 140, 255, 0.26) !important;
  background:
    linear-gradient(180deg, rgba(13, 10, 36, 0.94), rgba(20, 12, 46, 0.92)) !important;
  box-shadow:
    inset 0 0 20px rgba(109, 84, 255, 0.10),
    0 0 22px rgba(207, 77, 255, 0.12) !important;
}

.crs-upload-v14-play {
  width: 46px !important;
  height: 46px !important;
  border: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  background: linear-gradient(135deg, #5d7cff, #f246df) !important;
  box-shadow: 0 0 22px rgba(216, 76, 255, 0.42) !important;
}

.crs-upload-v14-wave-area {
  position: relative !important;
  height: 92px !important;
  overflow: hidden !important;
  border-radius: 12px !important;
  background: rgba(8, 6, 27, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.crs-upload-v14-wave {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.crs-upload-v14-selected-zone {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  border-left: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.22) !important;
  background: rgba(195, 76, 255, 0.18) !important;
  pointer-events: none !important;
}

.crs-upload-v14-handle {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 4px !important;
  margin-left: -2px !important;
  border-radius: 999px !important;
  cursor: ew-resize !important;
  z-index: 5 !important;
  background: linear-gradient(180deg, #ffffff, #ff78f2) !important;
  box-shadow:
    0 0 18px rgba(255, 255, 255, 0.55),
    0 0 28px rgba(255, 83, 228, 0.36) !important;
}

.crs-upload-v14-handle::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: -12px !important;
  right: -12px !important;
}

.crs-upload-v14-time-row {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  margin-top: 9px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  color: #bfffd8 !important;
}

.crs-upload-v14-zoom {
  display: none !important;
  margin-top: 12px !important;
  padding: 10px !important;
  border-radius: 14px !important;
  background: rgba(7, 6, 25, 0.92) !important;
  border: 1px solid rgba(87, 210, 255, 0.36) !important;
}

.crs-upload-v14-zoom.active {
  display: block !important;
}

.crs-upload-v14-zoom-title {
  color: #8ae7ff !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  margin-bottom: 8px !important;
}

.crs-upload-v14-zoom-box {
  position: relative !important;
  height: 78px !important;
  overflow: hidden !important;
  border-radius: 10px !important;
  background: rgba(13, 11, 39, 0.95) !important;
}

.crs-upload-v14-zoom-canvas {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.crs-upload-v14-zoom-line {
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 3px !important;
  transform: translateX(-50%) !important;
  background: #ffffff !important;
  box-shadow: 0 0 14px rgba(255, 255, 255, 0.68) !important;
}

.crs-upload-v14-file-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 7px !important;
  min-height: 52px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(105, 142, 255, 0.35) !important;
  background: rgba(12, 10, 35, 0.86) !important;
  margin-bottom: 20px !important;
}

.crs-upload-v14-file-name {
  min-width: 0 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  padding-left: 10px !important;
  color: #ffffff !important;
  font-size: 15px !important;
  font-weight: 760 !important;
}

.crs-upload-v14-browse {
  height: 38px !important;
  padding: 0 17px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(128, 158, 255, 0.55) !important;
  color: #ffffff !important;
  cursor: pointer !important;
  font-weight: 850 !important;
  background: rgba(91, 89, 210, 0.38) !important;
}

.crs-upload-v14-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
  margin-bottom: 22px !important;
}

.crs-upload-v14-input,
.crs-upload-v14-emoji {
  width: 100% !important;
  height: 52px !important;
  border-radius: 13px !important;
  border: 1px solid rgba(154, 112, 255, 0.46) !important;
  background: rgba(13, 10, 35, 0.88) !important;
  color: #ffffff !important;
  padding: 0 15px !important;
  font-size: 15px !important;
  font-weight: 760 !important;
  outline: none !important;
}

.crs-upload-v14-input::placeholder {
  color: rgba(229, 221, 255, 0.58) !important;
}

.crs-upload-v14-emoji {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  color: rgba(229, 221, 255, 0.74) !important;
  text-align: left !important;
}

.crs-upload-v14-volume-wrap {
  margin-bottom: 26px !important;
}

.crs-upload-v14-volume {
  width: 100% !important;
  accent-color: #d95cff !important;
}

.crs-upload-v14-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}

.crs-upload-v14-cancel,
.crs-upload-v14-submit {
  height: 54px !important;
  border-radius: 13px !important;
  cursor: pointer !important;
  font-size: 15px !important;
  font-weight: 950 !important;
}

.crs-upload-v14-cancel {
  color: #ffffff !important;
  border: 1px solid rgba(186, 91, 255, 0.50) !important;
  background: rgba(13, 10, 35, 0.86) !important;
}

.crs-upload-v14-submit {
  color: #ffffff !important;
  border: 0 !important;
  background: linear-gradient(90deg, #5f72ff, #f03ada, #27aaff) !important;
  box-shadow: 0 0 24px rgba(213, 70, 255, 0.34) !important;
}

@media (max-width: 720px) {
  .crs-upload-v14-shell {
    padding: 22px !important;
  }

  .crs-upload-v14-grid,
  .crs-upload-v14-actions {
    grid-template-columns: 1fr !important;
  }

  .crs-upload-v14-title {
    font-size: 25px !important;
  }
}

/* PATCH_V141_INLINE_ZOOM */

.crs-upload-v14-zoom,
.crs-upload-v14-zoom.active {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.crs-upload-v14-wave-area.crs-inline-zoom-active {
  box-shadow:
    0 0 0 1px rgba(138, 231, 255, 0.45),
    0 0 26px rgba(138, 231, 255, 0.25),
    0 0 38px rgba(230, 72, 255, 0.22) !important;
}

.crs-upload-v14-wave-area.crs-inline-zoom-active .crs-upload-v14-handle {
  width: 5px !important;
  margin-left: -2.5px !important;
  box-shadow:
    0 0 20px rgba(255, 255, 255, 0.72),
    0 0 34px rgba(255, 83, 228, 0.48) !important;
}


/* PATCH_V142_PLAY_CURSOR */

.crs-upload-v14-play {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  font-size: 20px !important;
  border-radius: 999px !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,0.36), transparent 34%),
    linear-gradient(135deg, #6978ff 0%, #c958ff 48%, #ff4fd8 100%) !important;
  box-shadow:
    0 0 18px rgba(112, 139, 255, 0.45),
    0 0 30px rgba(222, 75, 255, 0.35),
    inset 0 0 14px rgba(255, 255, 255, 0.12) !important;
  transform: translateZ(0) !important;
}

.crs-upload-v14-play:hover {
  transform: translateY(-1px) scale(1.03) !important;
  box-shadow:
    0 0 22px rgba(112, 139, 255, 0.58),
    0 0 38px rgba(222, 75, 255, 0.48),
    inset 0 0 16px rgba(255, 255, 255, 0.14) !important;
}

.crs-upload-v14-play.is-playing {
  background:
    radial-gradient(circle at 35% 30%, rgba(255,255,255,0.32), transparent 34%),
    linear-gradient(135deg, #ff4fd8 0%, #b65cff 46%, #32b7ff 100%) !important;
}

.crs-upload-v14-playhead {
  position: absolute !important;
  top: 6px !important;
  bottom: 6px !important;
  width: 4px !important;
  margin-left: -2px !important;
  border-radius: 999px !important;
  z-index: 4 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, #8ae7ff 0%, #ffffff 42%, #ff62df 100%) !important;
  box-shadow:
    0 0 10px rgba(138, 231, 255, 0.85),
    0 0 20px rgba(255, 98, 223, 0.65),
    0 0 30px rgba(124, 112, 255, 0.45) !important;
  transition: opacity 0.12s ease !important;
}

.crs-upload-v14-playhead.active {
  opacity: 1 !important;
}

.crs-upload-v14-playhead::before {
  content: "" !important;
  position: absolute !important;
  top: -5px !important;
  left: 50% !important;
  width: 12px !important;
  height: 12px !important;
  transform: translateX(-50%) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow:
    0 0 10px rgba(255, 255, 255, 0.90),
    0 0 18px rgba(255, 98, 223, 0.65) !important;
}

.crs-upload-v14-wave-card {
  grid-template-columns: 62px 1fr !important;
}

@media (max-width: 720px) {
  .crs-upload-v14-play {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    font-size: 18px !important;
  }

  .crs-upload-v14-wave-card {
    grid-template-columns: 56px 1fr !important;
  }
}

/* ================= PATCH V143 ================= */

/* Emoji picker */
.crs-emoji-picker {
  position: absolute;
  margin-top: 6px;
  background: rgba(20,20,40,0.95);
  border-radius: 10px;
  padding: 6px;
  display: flex;
  gap: 4px;
  box-shadow: 0 0 20px rgba(180,100,255,0.4);
}

.crs-emoji-picker button {
  background: none;
  border: none;
  font-size: 18px;
  cursor: pointer;
}

.crs-emoji-input {
  cursor: pointer;
}

/* Volume slider */
.crs-volume-slider {
  accent-color: #c958ff;
}

/* Hover bouton fichier */
.crs-file-btn:hover {
  transform: translateY(-1px) scale(1.03);
  box-shadow: 0 0 10px rgba(200,100,255,0.5);
  transition: 0.15s;
}

/* Zone sélection validité */
.crs-upload-v14-selected-zone.valid {
  background: rgba(0,255,120,0.2);
  box-shadow: 0 0 12px rgba(0,255,120,0.4);
}

.crs-upload-v14-selected-zone.invalid {
  background: rgba(255,50,50,0.25);
  box-shadow: 0 0 14px rgba(255,50,50,0.6);
}

/* ================= END PATCH ================= */

/* PATCH_V145_UPLOAD_MODAL_COMPLETE */

.crs-upload-v14-time-duration.valid {
  color: #62ff9e !important;
  text-shadow:
    0 0 10px rgba(98, 255, 158, 0.55),
    0 0 18px rgba(98, 255, 158, 0.25) !important;
}

.crs-upload-v14-time-duration.invalid {
  color: #ff5271 !important;
  text-shadow:
    0 0 10px rgba(255, 82, 113, 0.62),
    0 0 18px rgba(255, 82, 113, 0.28) !important;
}

.crs-upload-v14-selected-zone.valid {
  background: rgba(71, 255, 145, 0.19) !important;
  border-left-color: rgba(98, 255, 158, 0.70) !important;
  border-right-color: rgba(98, 255, 158, 0.70) !important;
  box-shadow:
    inset 0 0 22px rgba(98, 255, 158, 0.16),
    0 0 16px rgba(98, 255, 158, 0.18) !important;
}

.crs-upload-v14-selected-zone.invalid {
  background: rgba(255, 82, 113, 0.20) !important;
  border-left-color: rgba(255, 82, 113, 0.78) !important;
  border-right-color: rgba(255, 82, 113, 0.78) !important;
  box-shadow:
    inset 0 0 22px rgba(255, 82, 113, 0.18),
    0 0 16px rgba(255, 82, 113, 0.22) !important;
}

.crs-upload-v14-submit.disabled,
.crs-upload-v14-submit:disabled {
  opacity: 0.48 !important;
  cursor: not-allowed !important;
  filter: grayscale(0.35) !important;
  box-shadow: none !important;
}

.crs-upload-v14-browse {
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease,
    background 0.16s ease !important;
}

.crs-upload-v14-browse:hover {
  transform: translateY(-1px) scale(1.035) !important;
  border-color: rgba(138, 231, 255, 0.82) !important;
  background: rgba(112, 126, 255, 0.52) !important;
  box-shadow:
    0 0 14px rgba(138, 231, 255, 0.32),
    0 0 20px rgba(229, 77, 255, 0.20) !important;
}

.crs-upload-v14-emoji-wrap {
  position: relative !important;
}

.crs-upload-v14-emoji-panel {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000001 !important;
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  gap: 7px !important;
  padding: 10px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(181, 116, 255, 0.55) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(229,77,255,0.20), transparent 34%),
    linear-gradient(180deg, rgba(13,10,35,0.98), rgba(22,12,52,0.98)) !important;
  box-shadow:
    0 0 28px rgba(181, 116, 255, 0.30),
    inset 0 0 18px rgba(255,255,255,0.05) !important;
}

.crs-upload-v14-emoji-item {
  height: 34px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  background: rgba(255,255,255,0.06) !important;
  cursor: pointer !important;
  font-size: 18px !important;
  transition: transform 0.14s ease, background 0.14s ease, box-shadow 0.14s ease !important;
}

.crs-upload-v14-emoji-item:hover {
  transform: translateY(-1px) scale(1.08) !important;
  background: rgba(138, 231, 255, 0.16) !important;
  box-shadow: 0 0 12px rgba(229,77,255,0.30) !important;
}

.crs-upload-v14-emoji-custom {
  grid-column: 1 / -1 !important;
  height: 36px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(138, 231, 255, 0.30) !important;
  background: rgba(8,6,27,0.92) !important;
  color: #ffffff !important;
  padding: 0 10px !important;
  outline: none !important;
}

.crs-upload-v14-emoji-picked {
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,0.09) !important;
}

.crs-upload-v14-volume {
  cursor: pointer !important;
}