/* AmzLoot front-end. Colours/fonts come from CSS variables set in Appearance. */
.aml-box, .aml-grid, .aml-insert { box-sizing: border-box; font-family: var(--aml-font-b, system-ui, sans-serif); color: var(--aml-text, #fff); line-height: 1.5; }
.aml-box *, .aml-grid *, .aml-insert * { box-sizing: border-box; }

/* Image link */
a.aml-image { display: inline-block; max-width: 100%; }
a.aml-image img { display: block; max-width: 100%; height: auto; }

/* Auto-insert container */
.aml-insert { background: var(--aml-wrap-bg); border-radius: var(--aml-radius); padding: var(--aml-wrap-pad); margin: 2em 0; }
.aml-insert__heading { margin: 0 0 14px; font-family: var(--aml-font-h); font-size: 1.15em; font-weight: 600; color: var(--aml-heading); }
.aml-insert .aml-grid, .aml-insert .aml-card--wide { margin: 0; }

/* Cards */
.aml-card { position: relative; display: flex; background: var(--aml-card-bg); border: 1px solid var(--aml-accent-soft); border-radius: var(--aml-radius); overflow: hidden; margin: 1.5em 0; }
.aml-card::before { content: ""; position: absolute; inset: auto -20% -60% -20%; height: 70%; background: radial-gradient(closest-side, var(--aml-accent-glow), transparent); opacity: var(--aml-glow, 1); pointer-events: none; }
.aml-card > * { position: relative; }
.aml-card__media { display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, .96); padding: 14px; }
.aml-card__media img { display: block; max-width: 100%; max-height: 190px; width: auto; height: auto; object-fit: contain; }
.aml-card__body { display: flex; flex-direction: column; gap: 8px; padding: 16px; flex: 1; min-width: 0; }
.aml-card__title { margin: 0; font-family: var(--aml-font-h); font-size: 1.02em; font-weight: 600; line-height: 1.3; }
.aml-card__title a { color: var(--aml-heading, #fff); text-decoration: none; }
.aml-card__title a:hover { color: var(--aml-accent); }
.aml-card__features { margin: 0; padding: 0 0 0 1.1em; color: var(--aml-text-2); font-size: .88em; }
.aml-card__features li { margin: 0 0 3px; }
.aml-card__features--check { list-style: none; padding: 0; }
.aml-card__features--check li::before { content: "✓"; color: var(--aml-accent); font-weight: 700; margin-right: 8px; }
.aml-card__price { font-family: var(--aml-font-h); font-weight: 700; font-size: 1.1em; color: var(--aml-text); }
.aml-card__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: auto; padding-top: 6px; }

/* Buttons */
.aml-btn { display: inline-block; text-align: center; padding: 10px 16px; border-radius: calc(var(--aml-radius) * .6); background: var(--aml-accent); color: var(--aml-btn-text) !important; font-family: var(--aml-font-btn); font-weight: 700; font-size: .82em; letter-spacing: .04em; text-transform: uppercase; text-decoration: none !important; border: 1px solid var(--aml-accent); transition: filter .15s, transform .15s; }
.aml-btn:hover { filter: brightness(1.1); transform: translateY(-1px); }
.aml-btn--ghost { background: transparent; color: var(--aml-accent) !important; }

/* Small: grid of 1-3 */
.aml-grid { display: grid; gap: 16px; margin: 1.5em 0; }
.aml-grid--1 { grid-template-columns: minmax(0, 360px); }
.aml-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.aml-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.aml-grid .aml-card { flex-direction: column; margin: 0; }
.aml-grid .aml-card__media { height: 190px; }
.aml-grid .aml-btn { margin-top: auto; }

/* Wide */
.aml-card--wide .aml-card__media { flex: 0 0 220px; }

/* Large */
.aml-card--large { flex-direction: column; padding: 22px; gap: 14px; }
.aml-large__tagline { font-family: var(--aml-font-btn); font-size: .72em; font-weight: 700; letter-spacing: .18em; color: var(--aml-accent); }
.aml-large__grid { display: grid; grid-template-columns: minmax(180px, 280px) 1fr; gap: 22px; }
.aml-large__grid .aml-card__media { border-radius: calc(var(--aml-radius) * .7); }
.aml-large__grid .aml-card__body { padding: 0; }
.aml-large__maker { font-family: var(--aml-font-btn); font-size: .72em; letter-spacing: .14em; color: var(--aml-text-2); }
.aml-large__key { display: inline-block; align-self: flex-start; padding: 3px 10px; border-radius: 99px; background: var(--aml-accent-soft); color: var(--aml-accent); font-size: .8em; font-weight: 600; }
.aml-large__desc { margin: 0; color: var(--aml-text-2); }
.aml-large__specs { display: flex; flex-wrap: wrap; gap: 10px 26px; margin: 0; }
.aml-large__specs div { min-width: 0; }
.aml-large__specs dt { font-family: var(--aml-font-btn); font-size: .68em; letter-spacing: .12em; color: var(--aml-text-2); }
.aml-large__specs dd { margin: 0; font-weight: 600; }
.aml-disclaimer { font-size: .72em; color: var(--aml-text-2); opacity: .85; }

@media (max-width: 720px) {
	.aml-grid--2, .aml-grid--3 { grid-template-columns: 1fr; }
	.aml-grid--1 { grid-template-columns: 1fr; }
	.aml-card--wide { flex-direction: column; }
	.aml-card--wide .aml-card__media { flex-basis: auto; }
	.aml-large__grid { grid-template-columns: 1fr; }
	.aml-card--large { padding: 16px; }
}