/*
 * dialog.css — small companion stylesheet for js/ui/confirmDialog.js.
 *
 * Everything structural (.dialog-overlay, .dialog-box, .dialog-box__title,
 * .dialog-box__message, .dialog-box__actions, .btn-pill and its variants)
 * already exists in css/base.css per the shared contract — this file only
 * adds the two modifier classes confirmDialog.js references for the
 * `gradientBackground` / `centerText` options (ConfirmDialog.kt params used
 * exclusively, per SPEC.md Section 6, by the training-plan/settings
 * "unsaved changes" dialog). Import this AFTER base.css on any page that
 * passes gradientBackground/centerText to showConfirmDialog; pages that only
 * use plain confirm dialogs don't need it.
 */

/*
 * gradientBackground: true swaps the dialog's flat `?attr/colorCardBg` fill
 * for the app's themed paper/slate texture image (the same
 * --bg-texture-image used for the page body in base.css), instead of the
 * plain --color-card-bg. Kept as an additive class (not a replacement of
 * .dialog-box) so the base rule's radius/padding/width still apply.
 */
.dialog-box--gradient {
  background-color: var(--color-card-bg);
  background-image: var(--bg-texture-image);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* centerText: true centers the title + message (only ever paired with
   gradientBackground so far, per SPEC.md 6). */
.dialog-box--center .confirm-dialog__title,
.dialog-box--center .confirm-dialog__message {
  text-align: center;
}