/* Affiliate Products (Light) - minimal, fast, SEO-friendly cards */
:root{
  --apl-radius: 16px;
  --apl-border: rgba(0,0,0,.08);
  --apl-text: rgba(0,0,0,.86);
  --apl-muted: rgba(0,0,0,.62);
  --apl-bg: #fff;
  --apl-shadow: 0 10px 30px rgba(0,0,0,.08);
  --apl-gap: 14px;
  --apl-btn-bg: #111;
  --apl-btn-text: #fff;
  --apl-btn-bg2: rgba(0,0,0,.06);
  --apl-btn-text2: rgba(0,0,0,.86);
}

.apl-grid{
  display:grid;
  grid-template-columns: repeat(var(--apl-cols, 4), minmax(0, 1fr));
  gap: var(--apl-gap);
  align-items:stretch;
}
@media (max-width: 992px){ .apl-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 768px){ .apl-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 420px){ .apl-grid{ grid-template-columns: 1fr; } }

.apl-card{
  background: var(--apl-bg);
  border: 1px solid var(--apl-border);
  border-radius: var(--apl-radius);
  overflow:hidden;
  box-shadow: var(--apl-shadow);
  display:flex;
  flex-direction:column;
  min-height: 100%;
}

.apl-card-media{
  display:block;
  position:relative;
  aspect-ratio: 4 / 3;
  overflow:hidden;
  background: rgba(0,0,0,.03);
}
.apl-card-img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.apl-card-img--ph{
  width:100%; height:100%;
}

.apl-card-body{
  padding: 14px 14px 16px;
  display:flex;
  flex-direction:column;
  gap: 10px;
  flex:1;
}

.apl-card-title{
  margin:0;
  font-size: 16px;
  line-height: 1.4;
}
.apl-card-title a{
  color: var(--apl-text);
  text-decoration:none;
}
.apl-card-title a:hover{ text-decoration: underline; }

.apl-card-merchant{
  color: var(--apl-muted);
  font-size: 13px;
}

.apl-card-price{
  display:flex;
  gap:10px;
  align-items:baseline;
  margin-top:auto;
}
.apl-old{
  color: var(--apl-muted);
  text-decoration: line-through;
  font-size: 13px;
}
.apl-now{
  color: var(--apl-text);
  font-weight: 700;
  font-size: 16px;
}

.apl-card-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.apl-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: var(--apl-btn-bg);
  color: var(--apl-btn-text);
  text-decoration:none;
  font-weight: 700;
  font-size: 14px;
  line-height:1;
}
.apl-btn:hover{ opacity:.92; }
.apl-btn:focus{ outline: 2px solid rgba(0,0,0,.2); outline-offset: 2px; }

.apl-btn-secondary{
  background: var(--apl-btn-bg2);
  color: var(--apl-btn-text2);
  border-color: var(--apl-border);
}

.apl-empty{
  padding: 12px;
  border: 1px dashed var(--apl-border);
  border-radius: var(--apl-radius);
  color: var(--apl-muted);
}

/* Single template */
.apl-single{
  max-width: 1100px;
  margin: 0 auto;
  padding: 16px;
}
.apl-single .apl-top{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:start;
}
@media (max-width: 900px){ .apl-single .apl-top{ grid-template-columns: 1fr; } }

.apl-hero{
  border: 1px solid var(--apl-border);
  border-radius: var(--apl-radius);
  overflow:hidden;
  background: rgba(0,0,0,.03);
  aspect-ratio: 4 / 3;
}
.apl-hero img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.apl-gallery{
  margin-top: 10px;
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
}
.apl-gallery a{
  width: 74px;
  height: 74px;
  border-radius: 14px;
  overflow:hidden;
  border: 1px solid var(--apl-border);
  background: rgba(0,0,0,.03);
  display:block;
}
.apl-gallery img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.apl-panel{
  border: 1px solid var(--apl-border);
  border-radius: var(--apl-radius);
  background: var(--apl-bg);
  box-shadow: var(--apl-shadow);
  padding: 14px;
}
.apl-panel h1{
  font-size: 22px;
  margin:0 0 10px;
  line-height:1.35;
}
.apl-meta{
  color: var(--apl-muted);
  font-size: 13px;
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
}
.apl-rating{
  display:inline-flex;
  gap: 8px;
  align-items:center;
}
.apl-stars{
  letter-spacing: 1px;
  font-size: 14px;
}
.apl-desc{
  margin-top: 14px;
  color: var(--apl-text);
  line-height: 1.8;
}


.apl-content{padding:18px}
.apl-content .apl-content-inner{line-height:1.9;font-size:16px;color:var(--apl-text)}
.apl-content h2,.apl-content h3{margin-top:18px}
.apl-content img{max-width:100%;height:auto;border-radius:14px}

.apl-home-block{margin-top:18px}

.apl-pagination{margin-top:16px}
.apl-pagination ul{display:flex;gap:8px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.apl-pagination li{display:inline-flex}
.apl-pagination a,.apl-pagination span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 12px;border-radius:12px;
  border:1px solid var(--apl-border);text-decoration:none;color:var(--apl-text);
  background: var(--apl-bg);
}
.apl-pagination .current{
  background: rgba(0,0,0,.08);
  font-weight:700;
}
.apl-pagination a:hover{opacity:.92}