/* =========================================================
   AMZ-Ads.css
   Floating antique-style Amazon ad button strip
   All class names prefixed with AMZ to avoid cross-use
   ========================================================= */

/* Optional root variables for the AMZ button system */
:root {
  --AMZ-ink: #4a2d19;
  --AMZ-soft-ink: #6a4a35;
  --AMZ-border: #8d6239;
  --AMZ-highlight: rgba(255,255,255,.28);
  --AMZ-shadow: rgba(62,42,25,.18);
  --AMZ-shadow-hover: rgba(62,42,25,.22);
  --AMZ-top-glow: rgba(255,255,255,.25);
  --AMZ-top-glow-strong: rgba(255,255,255,.58);
  --AMZ-grad-top: #edd9b3;
  --AMZ-grad-bottom: #c89b63;
}

/* Optional wrapper if you want a dedicated overall ad area */
.AMZ-wrap {
  width: 100%;
  margin: 0 auto;
  background: transparent;
}

/* Transparent horizontal strip for the three floating buttons */
.AMZ-floating-button-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  align-items: stretch;
  margin: 16px 0 8px;
  padding: 8px 0;
  background: transparent;
}

/* Primary antique floating button */
.AMZ-antique-btn {
  flex: 1 1 260px;
  flex: 1 1 180px;
  max-width: 360px;
  max-width: 200px;
  min-height: 88px;
  min-height: 58px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 14px 18px;
  padding: 8px 10px;
  text-decoration: none;
  border-radius: 999px;
  border: 2px solid var(--AMZ-border);
  color: var(--AMZ-ink);
  position: relative;
  background:
    linear-gradient(180deg, var(--AMZ-top-glow), rgba(255,255,255,0)),
    linear-gradient(180deg, var(--AMZ-grad-top), var(--AMZ-grad-bottom));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.50),
    0 10px 20px var(--AMZ-shadow);
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    filter .18s ease;
}

/* Inner antique border line */
.AMZ-antique-btn::after {
  content: "";
  position: absolute;
  left: 14px;
  right: 14px;
  top: 8px;
  bottom: 8px;
  border-radius: 999px;
  border: 1px solid var(--AMZ-highlight);
  pointer-events: none;
}

/* Hover / focus states */
.AMZ-antique-btn:hover,
.AMZ-antique-btn:focus {
  transform: translateY(-2px);
  box-shadow:
    inset 0 1px 0 var(--AMZ-top-glow-strong),
    0 14px 26px var(--AMZ-shadow-hover);
  filter: saturate(1.04);
}

.AMZ-antique-btn:focus {
  outline: none;
}

/* Active press state */
.AMZ-antique-btn:active {
  transform: translateY(0);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.45),
    0 7px 14px rgba(62,42,25,.16);
}

/* First line: short product name */
.AMZ-btn-name {
  display: block;
  font-size: 1rem;
  font-weight: bold;
  line-height: 1.1;
  letter-spacing: .03em;
}

/* Second line: CTA */
.AMZ-btn-cta {
  display: block;
  margin-top: 5px;
  font-size: .79rem;
  text-transform: uppercase;
  letter-spacing: .16em;
}

/* Optional caption block above a strip */
.AMZ-target-note {
  margin: 0 0 10px;
  color: var(--AMZ-soft-ink);
  line-height: 1.4;
}

/* Optional compact variation */
.AMZ-floating-button-strip.AMZ-compact .AMZ-antique-btn {
  min-height: 76px;
  padding: 12px 16px;
}

.AMZ-floating-button-strip.AMZ-compact .AMZ-btn-name {
  font-size: .95rem;
}

.AMZ-floating-button-strip.AMZ-compact .AMZ-btn-cta {
  font-size: .75rem;
}

/* Optional wide variation */
.AMZ-floating-button-strip.AMZ-wide .AMZ-antique-btn {
  max-width: 420px;
  min-height: 94px;
}

/* Responsive stacking */
@media (max-width: 780px) {
  .AMZ-antique-btn {
    flex-basis: 100%;
    max-width: 100%;
  }
}