/* ============================================================
   Apps Discovery Platform — base primitives
   (cards, buttons, grids, pills) shared across all app views
   ============================================================ */
:root {
	--ai-app-radius: 14px;
	--ai-app-radius-sm: 8px;
	--ai-app-border: #e7e9ee;
	--ai-app-bg: #ffffff;
	--ai-app-muted: #6b7280;
	--ai-app-ink: #111827;
	--ai-app-primary: #FF3B3F;
	--ai-app-primary-ink: #ffffff;
	--ai-app-primary-soft: #FFF1F1;
	--ai-app-primary-border: #FECACA;
	--ai-app-good: #16a34a;
	--ai-app-bad: #dc2626;
	--ai-app-shadow: 0 1px 2px rgba(16,24,40,.06), 0 8px 24px rgba(16,24,40,.06);
	--ai-app-surface-editorial: #f8fafc;
	--ai-app-surface-muted: #f1f5f9;
	--ai-app-accent-gold: #b45309;
	--ai-app-accent-gold-soft: #fffbeb;
	--ai-app-prose-max: 72ch;
}

/* Buttons */
.appsinsight-btn {
	display:inline-flex; align-items:center; justify-content:center; gap:8px;
	padding:11px 18px; border-radius:var(--ai-app-radius-sm); font-weight:600; line-height:1;
	text-decoration:none; border:1px solid transparent; cursor:pointer; transition:transform .08s ease, box-shadow .15s ease, background .15s ease;
}
.appsinsight-btn:hover { transform:translateY(-1px); }
.appsinsight-btn--primary { background:var(--ai-app-primary); color:var(--ai-app-primary-ink) !important; }
.appsinsight-btn--ghost { background:#fff; color:var(--ai-app-ink) !important; border-color:var(--ai-app-border); }
.appsinsight-btn--block { display:flex; width:100%; margin-top:14px; }

/* Pills */
.appsinsight-pill {
	display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px;
	font-size:12px; font-weight:600; background:#f1f3f8; color:#374151;
}
.appsinsight-pill.is-good { background:#e8f7ee; color:var(--ai-app-good); }

/* Grid */
.appsinsight-app-grid { display:grid; gap:18px; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); }
.appsinsight-app-grid--3 { grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); }

/* ---------------- App card ---------------- */
.appsinsight-app-card {
	position:relative; display:flex; flex-direction:column; gap:10px;
	padding:18px; background:var(--ai-app-bg); border:1px solid var(--ai-app-border);
	border-radius:var(--ai-app-radius); box-shadow:var(--ai-app-shadow);
	transition:transform .1s ease, box-shadow .18s ease;
}
.appsinsight-app-card:hover { transform:translateY(-2px); box-shadow:0 10px 30px rgba(16,24,40,.10); }
.appsinsight-app-card__rank { position:absolute; top:12px; right:14px; font-weight:800; color:#cbd2e1; font-size:18px; }
.appsinsight-app-card__award {
	align-self:flex-start; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
	background:#fff4e5; color:#b45309; padding:3px 8px; border-radius:6px;
}
.appsinsight-app-card__logo { width:56px; height:56px; border-radius:12px; overflow:hidden; display:inline-flex; align-items:center; justify-content:center; background:#f5f7fb; border:1px solid var(--ai-app-border); }
.appsinsight-app-card__logo img { width:100%; height:100%; object-fit:cover; }
.appsinsight-app-card__logo-fallback { font-size:24px; font-weight:800; color:#94a3b8; }
.appsinsight-app-card__title { margin:0; font-size:17px; line-height:1.25; display:flex; align-items:center; gap:6px; }
.appsinsight-app-card__title a { color:var(--ai-app-ink); text-decoration:none; }
.appsinsight-app-card__tagline { margin:0; color:var(--ai-app-muted); font-size:13.5px; }
.appsinsight-app-card__meta { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.appsinsight-app-card__rating { display:inline-flex; align-items:center; gap:6px; font-size:13px; }
.appsinsight-app-card__score { font-weight:700; }
.appsinsight-app-card__reviews { color:var(--ai-app-muted); }
.appsinsight-app-card__pricing { font-size:12px; font-weight:600; color:#374151; background:#f1f3f8; padding:3px 8px; border-radius:6px; }
.appsinsight-app-card__platforms { display:flex; gap:6px; flex-wrap:wrap; list-style:none; margin:0; padding:0; }
.appsinsight-app-card__platforms li { font-size:11px; color:var(--ai-app-muted); border:1px solid var(--ai-app-border); padding:2px 7px; border-radius:6px; }
.appsinsight-app-card__category { font-size:12px; color:var(--ai-app-primary); text-decoration:none; font-weight:600; }
.appsinsight-app-card__actions { display:flex; gap:8px; margin-top:auto; padding-top:6px; }
.appsinsight-app-card__btn { flex:1; text-align:center; padding:9px 12px; border-radius:8px; font-size:13px; font-weight:600; text-decoration:none; }
.appsinsight-app-card__btn--primary { background:var(--ai-app-primary); color:#fff; }
.appsinsight-app-card__btn--ghost { background:#fff; border:1px solid var(--ai-app-border); color:var(--ai-app-ink); }
.appsinsight-app-card--compact { padding:14px; }
.appsinsight-app-card--compact .appsinsight-app-card__actions { display:none; }

/* Verified badge fallback */
.appsinsight-verified-badge__check { color:var(--ai-app-primary); font-weight:700; }
