.product-media-grid .upload-video-box {
  display: grid !important;
  grid-row: span 3;
  grid-template-rows: subgrid;
  grid-template-columns: minmax(0, 1fr);
  justify-content: stretch !important;
  row-gap: 12px;
  min-width: 0;
}

.product-media-grid .upload-video-box > div:first-child {
  display: contents !important;
}

.product-media-grid .upload-video-box__header,
.product-media-grid .product-media-help {
  margin-bottom: 0 !important;
}

.product-media-grid .product-media-help {
  min-height: 64px;
  padding: 10px 12px;
  border: 1px solid var(--ui-border);
  border-radius: 8px;
  background: var(--ui-surface-muted);
  color: var(--ui-text-muted);
  font-size: 12px;
  line-height: 1.6;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-sizing: border-box;
}

.product-media-grid .video-player-stack {
  margin-top: 0 !important;
  align-self: start;
}

.product-media-grid .video-player-stack > div:first-child > div:first-child {
  min-height: 22px;
  line-height: 22px;
}

.product-media-grid .upload-video-container-footer,
.product-media-grid .hidden-video-upload {
  display: none;
}

.product-media-grid #mainVideoWrap,
.product-media-grid #coverImageWrap {
  height: 180px !important;
  min-height: 180px !important;
  max-height: 180px !important;
}

.product-media-grid #coverImageWrap > img,
.product-media-grid #mainVideoWrap > video {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
}

@supports not (grid-template-rows: subgrid) {
  .product-media-grid .upload-video-box {
    grid-template-rows: minmax(36px, auto) 64px auto;
  }
}

.pricing-template-panel {
  color: var(--ui-text);
  font-size: 13px;
}

.pricing-template-panel [hidden] { display: none !important; }

.pricing-template-edit { margin: 0 0 20px; border-top: 1px solid var(--ui-border); border-bottom: 1px solid var(--ui-border); }
.pricing-template-edit summary { display: flex; align-items: center; justify-content: space-between; padding: 13px 0; color: var(--ui-text-muted); font-size: 12px; list-style: none; cursor: pointer; }
.pricing-template-edit summary::-webkit-details-marker { display: none; }
.pricing-template-edit summary svg { width: 14px; height: 14px; transition: transform .15s; }
.pricing-template-edit[open] summary svg { transform: rotate(180deg); }
.pricing-template-edit .pricing-template-fields { padding-top: 8px; }
.pricing-template-edit .form-input { border-radius: 6px; box-shadow: none; }
.pricing-template-preview-head strong { font-size: 13px; font-weight: 600; }
.pricing-template-panel .pricing-template-empty { padding: 20px 0; text-align: center; background: var(--ui-surface-muted); border-radius: 6px; }
.pricing-template-panel .pricing-template-apply { margin-bottom: 0; }
.pricing-template-panel .pricing-template-actions { justify-content: flex-start; }
.pricing-template-panel [data-delete] { margin-left: auto; border: 0; background: transparent; color: var(--ui-text-muted); }
.modal-overlay:has(.pricing-template-panel) .btn-secondary { background: transparent; border: 1px solid var(--ui-border); color: var(--ui-text-muted); box-shadow: none; }
.modal-overlay:has(.pricing-template-panel) .btn-primary,
.pricing-settings-page .btn-primary { background: #3157d5; color: #fff; box-shadow: none; }
.modal-overlay:has(.pricing-template-panel) .btn-primary::before,
.pricing-settings-page .btn-primary::before { display: none; }
.modal-overlay:has(.pricing-template-panel) .btn:hover,
.pricing-settings-page .btn:hover { transform: none; box-shadow: none; }
.pricing-settings-page [data-save-new] { border: 0; background: transparent; color: var(--ui-text-muted); }
.modal-overlay:has(.pricing-template-panel) .btn:disabled,
.pricing-settings-page button:disabled { opacity: .5; cursor: not-allowed; }

.pricing-template-note {
  margin: 0 0 16px;
  padding: 12px;
  color: var(--ui-text-muted);
  background: var(--ui-surface-muted);
  border: 1px solid var(--ui-border);
  border-radius: 10px;
  line-height: 1.7;
}

.pricing-template-picker,
.pricing-template-actions,
.pricing-template-preview-head,
.pricing-template-apply {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 16px;
}

.pricing-template-picker label {
  min-width: 220px;
  flex: 1;
}

.pricing-template-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.pricing-template-fields label,
.pricing-template-picker label {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pricing-template-fields input,
.pricing-template-fields select,
.pricing-template-picker select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.pricing-template-empty,
.pricing-template-apply span,
.pricing-template-picker span {
  color: var(--ui-text-muted);
  font-size: 12px;
  line-height: 1.7;
}

.pricing-template-table {
  overflow: auto;
  max-height: 280px;
  margin-bottom: 16px;
  border: 1px solid var(--ui-border);
  border-radius: 8px;
}

.pricing-template-table table {
  border-collapse: collapse;
  width: 100%;
  white-space: nowrap;
}

.pricing-template-table th,
.pricing-template-table td {
  padding: 10px 12px;
  text-align: right;
  border-bottom: 1px solid var(--ui-border);
}

.pricing-template-table th {
  background: var(--ui-surface-muted);
}

@media (max-width: 560px) {
  .pricing-template-fields {
    grid-template-columns: 1fr;
  }

  .pricing-template-apply button {
    width: 100%;
  }
}

.pricing-template-fields small { color: var(--ui-text-muted); font-size: 12px; line-height: 1.6; }
