@charset "UTF-8";

/* One reviewed batch, with its words, image and execution settings together. */
.campaign-dialog {
  width: min(660px, calc(100vw - 40px));
  max-height: 90vh;
  max-height: 90dvh;
  padding: 28px 30px 25px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cbd7c4 transparent;
  background: #fffefa;
}
.campaign-dialog .modal-heading { margin-bottom: 20px; }
.campaign-dialog .modal-heading h2 { color: #264b38; font-size: 23px; }
.campaign-dialog .modal-heading p { color: #74816f; font-size: 12px; line-height: 1.8; }
.campaign-dialog .modal-heading .eyebrow { color: #819874; letter-spacing: 1.1px; }
.campaign-dialog .field-label { color: #4d654f; font-size: 12px; margin-bottom: 15px; }
.campaign-dialog .field-label input,
.campaign-dialog .field-label textarea,
.campaign-dialog .field-label select { color: #334e3c; border-color: #dce5d6; font-size: 13px; background: #fff; }
.campaign-dialog .field-label textarea { min-height: 114px; line-height: 1.9; }
.campaign-dialog .field-label input::placeholder,
.campaign-dialog .field-label textarea::placeholder { color: #98a390; }
.campaign-mode-note {
  padding: 11px 13px;
  margin-bottom: 19px;
  border: 1px solid #e4e8d9;
  border-radius: 7px;
  background: #f7f8ee;
  color: #786d48;
  font-size: 12px;
  line-height: 1.85;
}
.campaign-mode-note:empty { display: none; }
.campaign-mode-note.demo { border-color: #dce5ed; background: #f2f6f9; color: #5c7285; }
.campaign-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.campaign-form-row > * { min-width: 0; }
.campaign-variable-buttons { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: -5px 0 19px; color: #8a9781; font-size: 10px; line-height: 1.8; }
.campaign-variable-buttons > span:first-child { margin-right: 2px; }
.campaign-variable-buttons > span:last-child { margin-left: 3px; }
.campaign-variable-buttons > button { min-height: 27px; padding: 3px 8px; border: 1px solid #dfe8d7; border-radius: 5px; background: #f2f7ec; color: #587747; font-size: 11px; }
.campaign-variable-buttons > button:hover { border-color: #afc6a1; background: #e7f0df; color: #335b2f; }
.campaign-image-section { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 16px; margin-bottom: 15px; border: 1px dashed #cdddc0; border-radius: 8px; background: #f8faf3; }
.campaign-image-section h3 { color: #405c3e; font-size: 13px; font-weight: 600; line-height: 1.8; }
.campaign-image-section h3 > span { color: #8c9b80; font-size: 10px; font-weight: 400; margin-left: 6px; white-space: nowrap; }
.campaign-image-section p { margin-top: 3px; color: #839279; font-size: 11px; line-height: 1.8; }
.campaign-upload-button { display: inline-flex; position: relative; align-items: center; justify-content: center; flex-shrink: 0; overflow: hidden; min-height: 35px; padding: 7px 12px; border: 1px solid #cadbc0; border-radius: 6px; background: #fff; color: #44693a; font-size: 11px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.campaign-upload-button:hover { background: #edf5e5; border-color: #adc69e; }
.campaign-upload-button:focus-within { outline: 3px solid #b0cca7; outline-offset: 3px; }
.campaign-upload-button input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.campaign-image-preview { display: flex; align-items: center; gap: 15px; padding: 12px; margin: -3px 0 18px; border: 1px solid #dfe8d7; border-radius: 8px; background: #fff; }
.campaign-image-preview > img { flex: 0 0 120px; width: 120px; height: 90px; border: 1px solid #e8ece3; border-radius: 5px; background: #f4f6f0; object-fit: contain; }
.campaign-image-preview > div { display: flex; align-items: flex-start; flex-direction: column; gap: 5px; min-width: 0; }
.campaign-image-preview strong { max-width: 100%; color: #3f5842; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.campaign-image-preview span { color: #8b9980; font-size: 10px; }
.campaign-image-preview .text-button { color: #a16c54; font-size: 11px; margin-top: 3px; }
.campaign-image-preview .text-button:hover { color: #834b35; }
.campaign-number-field { display: flex; align-items: center; gap: 10px; margin-top: 6px; padding-right: 12px; border: 1px solid #dce5d6; border-radius: 6px; background: #fff; }
.campaign-number-field:focus-within { border-color: #74a27c; box-shadow: 0 0 0 3px #e7f0e5; }
.campaign-dialog .campaign-number-field input { min-width: 0; width: 100%; margin: 0; border: 0; background: transparent; font-variant-numeric: tabular-nums; }
.campaign-dialog .campaign-number-field input:focus-visible { box-shadow: none; }
.campaign-number-field > span { flex-shrink: 0; color: #8b9982; font-size: 11px; }
.campaign-run-preview { padding: 12px 14px; border: 1px solid #dce6d3; border-radius: 7px; background: #eef5e8; color: #4d6a43; font-size: 12px; line-height: 1.9; overflow-wrap: anywhere; }
.campaign-run-preview:empty { display: none; }
.campaign-run-preview strong { color: #254b32; }
.campaign-dialog .action-approval { margin-top: 17px; color: #526c48; font-size: 12px; }
.campaign-boundary-note { padding-left: 24px; margin-top: 8px; color: #92917d; font-size: 10px; line-height: 1.9; }
.campaign-dialog .inline-error { color: #a75b48; font-size: 12px; }
.campaign-dialog .modal-footer { margin-top: 20px; padding-top: 17px; }
.campaign-dialog .modal-footer .button { min-height: 40px; font-size: 12px; }
.campaign-search-hint { margin: 9px 23px 0; color: #839279; font-size: 10px; line-height: 1.8; }
.discovery-search input { flex: 1 1 140px; width: 0; }
.discovery-search .button.secondary { padding-left: 12px; padding-right: 12px; }
.queue-media-badge { display: inline-flex; align-items: center; gap: 4px; width: fit-content; margin-top: 6px; padding: 2px 6px; border: 1px solid #dce7d2; border-radius: 4px; background: #f1f6e9; color: #708a5d; font-size: 9px; line-height: 1.6; }
.queue-media-badge .icon { width: 12px; height: 12px; }
.campaign-progress-card { display: flex; flex-direction: column; gap: 5px; padding: 13px 15px; margin: 0 19px 15px; border: 1px solid #d2e2c7; border-radius: 8px; background: #f0f7e9; color: #6c845b; font-size: 11px; line-height: 1.9; overflow-wrap: anywhere; }
.campaign-progress-card strong { display: block; color: #3c6537; font-size: 13px; }
.campaign-progress-card p { color: #7d9070; font-size: 11px; }

@media (max-width: 1250px) {
  .campaign-search-hint { margin-left: 19px; margin-right: 19px; }
}
@media (max-width: 1100px) {
  .discovery-search { display: grid; position: relative; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 8px; }
  .discovery-search > .icon { position: absolute; left: 13px; top: 17px; width: 18px; height: 18px; pointer-events: none; }
  .discovery-search input { grid-column: 1 / -1; width: 100%; min-width: 0; height: 35px; padding: 3px 5px 3px 29px; }
  .discovery-search .button { width: 100%; min-width: 0; min-height: 36px; padding-left: 8px; padding-right: 8px; }
}
@media (max-width: 900px) {
  .campaign-search-hint { margin-left: 22px; margin-right: 22px; }
  .campaign-progress-card { margin-left: 21px; margin-right: 21px; }
}
@media (max-width: 700px) {
  .campaign-dialog { width: calc(100vw - 28px); max-height: 90vh; max-height: 90dvh; padding: 23px 20px 20px; }
  .campaign-dialog .modal-heading { gap: 9px; margin-bottom: 17px; }
  .campaign-dialog .modal-heading h2 { font-size: 20px; }
  .campaign-dialog .modal-heading p { font-size: 11px; }
  .campaign-dialog .modal-heading .eyebrow { font-size: 7px; letter-spacing: .65px; }
  .campaign-form-row { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .campaign-mode-note { padding: 10px 12px; font-size: 11px; }
  .campaign-variable-buttons { gap: 6px; }
  .campaign-variable-buttons > span:last-child { margin-left: 0; }
  .campaign-image-section { flex-wrap: wrap; gap: 12px; padding: 13px; }
  .campaign-image-section h3 > span { margin-left: 4px; }
  .campaign-upload-button { min-height: 37px; }
  .campaign-image-preview { gap: 12px; }
  .campaign-image-preview > img { width: 120px; height: 90px; }
  .campaign-dialog .modal-footer { gap: 8px; }
  .campaign-dialog .modal-footer .button { padding-left: 11px; padding-right: 11px; font-size: 11px; }
  .campaign-search-hint { margin-left: 17px; margin-right: 17px; font-size: 10px; }
  .campaign-progress-card { margin-left: 16px; margin-right: 16px; }
  .discovery-search .button { width: 100%; min-height: 37px; font-size: 11px; }
}
