/* =========================================================
   AM Downloads — fallback styling for the download card.

   On the Am_Picker product page this file is almost entirely overridden:
   that page ships its own `.amp-dlcard` rules and they win by being loaded
   later. What this covers is the other case — the shortcode dropped on a
   plain page, in a theme that knows nothing about it — where the card still
   has to look deliberate rather than like an unstyled form.

   So: no colours borrowed from a theme that may not define them, and
   everything expressed against `currentColor` and a small token set that
   works on a light ground or a dark one.
========================================================= */

.am-downloads{
  --amdl-accent:#ffae00;
  --amdl-ink:#15181d;
  --amdl-radius:10px;
  max-width:520px;
  margin:0 auto;
  text-align:left;
}

/* Only applied when the page has not styled the card itself. The product
   page sets its own background/border, which override these. */
.am-downloads:not(.amp-dlcard--themed){
  padding:28px 26px;
  border:1px solid rgba(128,128,128,.28);
  border-radius:var(--amdl-radius);
}

.am-downloads .amp-dlcard__state[hidden]{ display:none; }

.am-downloads label{
  display:block;
  margin-bottom:.55em;
  font-size:.88rem;
  font-weight:700;
}

.am-downloads input[type=email]{
  width:100%;
  box-sizing:border-box;
  padding:.85em 1em;
  border:1px solid rgba(128,128,128,.4);
  border-radius:8px;
  background:transparent;
  color:inherit;
  font:inherit;
  font-size:.95rem;
}
.am-downloads input[type=email]:focus{
  outline:2px solid var(--amdl-accent);
  outline-offset:1px;
  border-color:transparent;
}
.am-downloads input[type=email][aria-invalid="true"]{ border-color:#d33; }

.am-downloads .btn-submit{
  width:100%;
  margin-top:13px;
  padding:.95em 1em;
  border:0;
  border-radius:8px;
  background:var(--amdl-accent);
  color:var(--amdl-ink);
  font:inherit;
  font-weight:700;
  font-size:.95rem;
  cursor:pointer;
}
.am-downloads .btn-submit:hover{ filter:brightness(1.08); }
.am-downloads .btn-submit:disabled{ opacity:.55;cursor:progress;filter:none; }
.am-downloads .btn-submit:focus-visible{ outline:2px solid currentColor;outline-offset:3px; }

.am-downloads .amp-dlcard__why{
  margin-top:14px;
  font-size:.78rem;
  line-height:1.6;
  opacity:.75;
}

.am-downloads .amp-dlcard__error{
  margin-top:11px;
  font-size:.83rem;
  font-weight:700;
  color:#d33;
}

.am-downloads .amp-dlcard__sent{ text-align:center; }
.am-downloads .amp-dlcard__tick{
  width:46px;height:46px;
  margin:0 auto 16px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:rgba(255,174,0,.12);
  border:1px solid rgba(255,174,0,.35);
  color:var(--amdl-accent);
}
.am-downloads .amp-dlcard__tick svg{ width:22px;height:22px; }
/* The heading takes focus after submit; it is not interactive, so the
   default focus ring would read as a control. */
.am-downloads .amp-dlcard__sent h3:focus{ outline:none; }
.am-downloads .amp-dlcard__sent h3:focus-visible{ outline:2px solid var(--amdl-accent);outline-offset:3px; }

.am-downloads .amp-dlcard__resend{
  background:none;
  border:0;
  padding:0;
  font:inherit;
  font-weight:700;
  font-size:.85rem;
  color:var(--amdl-accent);
  text-decoration:underline;
  cursor:pointer;
}
.am-downloads .amp-dlcard__resend:disabled{
  opacity:.6;
  cursor:default;
  text-decoration:none;
  color:inherit;
}

.am-downloads__meta{
  margin:14px 0 0;
  font-size:.75rem;
  opacity:.6;
  text-align:center;
}

@media (prefers-reduced-motion:reduce){
  .am-downloads *{ transition:none !important; }
}
