/* uzytak.com/<lang>/warranty-plugin/: demo of the registration form (rules copied from the plugin's assets/form.css,
 * .uzytak-wr) plus the mock admin list and reminder e-mail. On top of photopack.css + materials-plugin/plugin.css. */
.uzytak-wr { max-width: 760px; margin: 0; padding: 20px 22px; border: 1px solid var(--pp-line); border-radius: 12px; box-sizing: border-box; background: #fff; color: var(--pp-ink); }
.uzytak-wr *, .uzytak-wr *::before, .uzytak-wr *::after { box-sizing: border-box; }
.uzytak-wr-title { margin: 0 0 .3em; font-size: 22px; }
.uzytak-wr-intro { margin: 0 0 1em; opacity: .85; }
.uzytak-wr fieldset { border: 0; margin: 0 0 1em; padding: 0; min-width: 0; }
.uzytak-wr legend { font-weight: 700; margin-bottom: .5em; padding: 0; }
.uzytak-wr-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.uzytak-wr-field { margin: 0; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.uzytak-wr-field.is-wide { grid-column: 1 / -1; }
.uzytak-wr-field label { font-size: .92em; font-weight: 600; }
.uzytak-wr input[type=text], .uzytak-wr input[type=email], .uzytak-wr input[type=tel], .uzytak-wr input[type=date], .uzytak-wr select, .uzytak-wr textarea { width: 100%; max-width: 100%; min-height: 42px; padding: 8px 10px; border: 1px solid rgba(127,127,127,.6); border-radius: 8px; font: inherit; background: transparent; color: inherit; }
.uzytak-wr [aria-invalid=true] { border-color: #c62828; box-shadow: 0 0 0 1px #c62828; }
.uzytak-wr-consent label { display: flex; gap: 8px; align-items: flex-start; font-size: .9em; line-height: 1.4; cursor: pointer; }
.uzytak-wr-consent input { margin-top: 3px; flex: 0 0 auto; }
.uzytak-wr-actions button { min-height: 44px; padding: 10px 22px; border: 0; border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer; background: #1d5bd8; color: #fff; }
.uzytak-wr-status p { margin: .3em 0; }
.uzytak-wr-status.is-ok { padding: 12px 14px; border-radius: 8px; background: rgba(27,127,59,.1); border-left: 4px solid #1b7f3b; }
.uzytak-wr-status.is-ok p:first-child { font-weight: 700; }
.uzytak-wr-status.is-bad { color: #c62828; font-weight: 600; }
@media (max-width: 560px) { .uzytak-wr-grid { grid-template-columns: minmax(0, 1fr); } .uzytak-wr { padding: 16px; } }

.wd-demo { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 24px; margin-top: 26px; align-items: start; }
.wd-demo > * { min-width: 0; }
.wd-flag { display: inline-block; margin: 0 0 12px; padding: 5px 12px; border-radius: 999px; background: #fff4d6; color: #7a4b00; font-size: 14px; font-weight: 700; }
.wd-live { margin: 0 0 1em; padding: 12px 14px; border-radius: 8px; background: #eef4ff; border-left: 4px solid #1d5bd8; }
.wd-live p { margin: .2em 0; }
.wd-live .wd-live-title { font-weight: 700; }
.wd-small { font-size: 13px; color: var(--pp-muted); }
.wd-side h3 { margin: 0 0 6px; font-size: 18px; }
.wd-side .mp-small { margin: 0 0 12px; }
.wd-panel { margin-bottom: 22px; }
.wd-admin { width: 100%; border-collapse: collapse; font-size: 14px; background: #fff; border: 1px solid var(--pp-line); border-radius: 10px; overflow: hidden; }
.wd-admin th, .wd-admin td { padding: 8px 10px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--pp-line); }
.wd-admin th { background: #f6f7f7; font-size: 13px; }
.wd-admin tr:last-child td { border-bottom: 0; }
.wd-badge { display: inline-block; margin-top: 3px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.wd-badge.is-due { background: #fff4d6; color: #7a4b00; }
.wd-badge.is-overdue { background: #fde7e7; color: #b42318; }
.wd-badge.is-new { margin-left: 6px; background: #e3f6ec; color: #1b7f3b; }
.wd-mail { border: 1px solid var(--pp-line); border-radius: 10px; background: #fff; overflow: hidden; }
.wd-mail-subject { margin: 0; padding: 10px 14px; background: #f6f7f7; font-weight: 700; border-bottom: 1px solid var(--pp-line); }
.wd-mail-body { margin: 0; padding: 12px 14px; white-space: pre-wrap; font: inherit; font-size: 14px; line-height: 1.5; }

.wd-app { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; }
.wd-app > div:first-child { flex: 1 1 420px; min-width: 0; }
.wd-app .mp-cta { margin-top: 0; }

@media (max-width: 960px) {
  .wd-demo { grid-template-columns: minmax(0, 1fr); }
}
/* The admin list becomes cards on phones. */
@media (max-width: 640px) {
  .wd-admin thead { display: none; }
  .wd-admin, .wd-admin tbody, .wd-admin tr, .wd-admin td { display: block; width: 100%; }
  .wd-admin tr { border-bottom: 1px solid var(--pp-line); padding: 6px 0; }
  .wd-admin tr:last-child { border-bottom: 0; }
  .wd-admin td { border: 0; padding: 3px 12px; }
  .wd-admin td::before { content: attr(data-label) ": "; color: var(--pp-muted); font-size: 12px; }
}