/**
 * App-detail enhancements layered on top of style.min.css.
 * Loaded after the main stylesheet (see apphub_assets in functions.php).
 */

/* 1. Prominent download button ------------------------------------- */
.ah-download-btn {
	background-color: var(--ah-coral);
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) );
	background-size: 100% 100%;
	color: #fff;
	padding: 18px 22px;
	box-shadow: 0 12px 28px rgba( 255, 93, 115, 0.42 );
}
/* Low-key fine print (e.g. offer fees & charges — present but not highlighted) */
.ah-offer-fineprint {
	margin-top: 18px;
	font: 400 12px/1.6 var(--ah-font-body);
	color: var(--ah-text-muted);
}
.ah-download-btn:hover {
	transform: translateY( -2px );
	box-shadow: 0 16px 34px rgba( 255, 93, 115, 0.55 );
}
.ah-download-btn:active { transform: translateY( 0 ); }
.ah-download-btn.is-filling { color: #fff; }
.ah-download-btn__label {
	font: 800 18px var(--ah-font-heading);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	letter-spacing: 0.01em;
}
.ah-download-btn__label::before {
	content: "";
	width: 22px;
	height: 22px;
	flex: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='M7 12l5 5 5-5'/%3E%3Cpath d='M4 20h16'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 2. Stat grid: fill the row, never leave an empty column ----------- */
.ah-stat-grid { grid-template-columns: repeat( auto-fit, minmax( 132px, 1fr ) ); }

/* 3. Earning highlight strip under the stats ------------------------ */
.ah-detail-highlight {
	margin: 2px 0;
	padding: 14px 18px;
	border-radius: var(--ah-radius-md);
	background: linear-gradient( 92deg, rgba( 255, 93, 115, 0.16 ), rgba( 124, 92, 191, 0.16 ) );
	border: 1px solid rgba( 255, 93, 115, 0.38 );
	color: var(--ah-text);
	font: 600 15px/1.55 var(--ah-font-body);
}

/* 4. Screenshot carousel: portrait-friendly + visible controls ------ */
.ah-slider__item {
	aspect-ratio: auto;
	height: 380px;
	background: var(--ah-bg);
}
.ah-slider__track { grid-auto-columns: minmax( 200px, auto ); }
.ah-slider__item img { object-fit: contain; }
.ah-slider__controls { display: flex; }

/* 5. Ratings & reviews --------------------------------------------- */
.ah-reviews-summary { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.ah-reviews-summary__num { font: 800 34px var(--ah-font-heading); color: var(--ah-text); }
.ah-reviews-summary__count { color: var(--ah-text-muted); font: 400 13px var(--ah-font-mono); }

.ah-review-notice {
	margin: 0 0 18px; padding: 12px 16px; border-radius: var(--ah-radius-md);
	background: rgba( 45, 212, 199, 0.12 ); border: 1px solid rgba( 45, 212, 199, 0.4 );
	color: var(--ah-text); font: 500 14px var(--ah-font-body);
}

.ah-review-list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.ah-review {
	background: var(--ah-surface); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-md); padding: 16px 18px;
}
.ah-review__head { display: flex; align-items: center; gap: 10px; }
.ah-review__author { font: 700 15px var(--ah-font-heading); color: var(--ah-text); }
.ah-review__stars { color: var(--ah-gold); letter-spacing: 1px; }
.ah-review__date { font: 400 11px var(--ah-font-mono); color: var(--ah-text-muted); margin: 2px 0 8px; }
.ah-review__body { color: var(--ah-text-secondary); font: 400 14px/1.6 var(--ah-font-body); }
.ah-review__body p { margin: 0 0 8px; }
.ah-review-empty { color: var(--ah-text-muted); margin: 0 0 24px; }

.ah-review-form-wrap {
	background: var(--ah-surface); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-lg); padding: 24px;
}
.ah-review-form-title { margin: 0 0 18px; font: 700 18px var(--ah-font-heading); color: var(--ah-text); }
.ah-review-field { margin-bottom: 16px; display: flex; flex-direction: column; gap: 6px; }
.ah-review-row { display: flex; gap: 16px; flex-wrap: wrap; }
.ah-review-row .ah-review-field { flex: 1 1 200px; }
.ah-review-label { font: 600 13px var(--ah-font-body); color: var(--ah-text-secondary); }
.ah-review-form input[type="text"],
.ah-review-form input[type="email"],
.ah-review-form textarea {
	background: var(--ah-bg); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-sm); padding: 11px 14px;
	color: var(--ah-text); font: 400 14px var(--ah-font-body); width: 100%;
}
.ah-review-form input:focus, .ah-review-form textarea:focus {
	outline: none; border-color: var(--ah-teal);
}

/* Accessible star rating input (radios styled as stars, hover/checked fill) */
.ah-star-input { display: inline-flex; flex-direction: row-reverse; gap: 4px; }
.ah-star-input input { position: absolute; opacity: 0; width: 0; height: 0; }
.ah-star-input label {
	font-size: 30px; line-height: 1; color: var(--ah-elevated); cursor: pointer; transition: color 0.15s;
}
.ah-star-input input:checked ~ label,
.ah-star-input label:hover,
.ah-star-input label:hover ~ label { color: var(--ah-gold); }
.ah-star-input input:focus-visible + label { outline: 2px solid var(--ah-teal); outline-offset: 2px; }

.ah-review-submit {
	margin-top: 4px; border: none; cursor: pointer;
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) );
	color: #fff; font: 800 15px var(--ah-font-heading);
	padding: 13px 26px; border-radius: var(--ah-radius-md);
	box-shadow: 0 8px 20px rgba( 255, 93, 115, 0.35 );
}
.ah-review-submit:hover { transform: translateY( -1px ); box-shadow: 0 12px 26px rgba( 255, 93, 115, 0.45 ); }

/* 6. Highlighted benefits — the "key benefits" list in offer/app descriptions */
.ah-detail-desc > h3 {
	margin: 22px 0 6px;
	font: 700 18px var(--ah-font-heading);
	color: var(--ah-text);
	display: flex;
	align-items: center;
	gap: 9px;
}
.ah-detail-desc > h3::before {
	content: "";
	width: 5px;
	height: 18px;
	border-radius: 3px;
	background: linear-gradient( var(--ah-coral), var(--ah-purple) );
}
.ah-detail-desc ul {
	list-style: none;
	margin: 14px 0 22px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 250px, 1fr ) );
	gap: 10px;
}
.ah-detail-desc ul li {
	position: relative;
	background: var(--ah-surface);
	border: 1px solid var(--ah-border);
	border-left: 3px solid var(--ah-teal);
	border-radius: var(--ah-radius-md);
	padding: 13px 15px 13px 44px;
	color: var(--ah-text);
	font: 600 14px/1.5 var(--ah-font-body);
	transition: transform 0.15s, border-color 0.15s;
}
.ah-detail-desc ul li:hover {
	transform: translateY( -2px );
	border-left-color: var(--ah-coral);
}
.ah-detail-desc ul li::before {
	content: "";
	position: absolute;
	left: 13px;
	top: 13px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background-color: var(--ah-teal);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
	background-size: 13px;
	background-position: center;
	background-repeat: no-repeat;
}

/* 7. Offer Finder (recommendation quiz) --------------------------- */
.fx { max-width: 760px; margin: 0 auto; }
.fx-quiz {
	background: var(--ah-surface); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-lg); padding: 26px;
}
.fx-q-title { margin: 0 0 4px; font: 800 24px var(--ah-font-heading); color: var(--ah-text); }
.fx-q-sub { margin: 0 0 20px; color: var(--ah-text-secondary); font: 400 14px var(--ah-font-body); }
.fx-field { margin-bottom: 16px; }
.fx-row { display: flex; gap: 14px; flex-wrap: wrap; }
.fx-row .fx-field { flex: 1 1 180px; }
.fx-label { display: block; margin-bottom: 8px; font: 600 13px var(--ah-font-body); color: var(--ah-text-secondary); }
.fx-seg { display: flex; flex-wrap: wrap; gap: 8px; }
.fx-seg button {
	flex: 1 1 auto; min-width: 92px; cursor: pointer;
	background: var(--ah-bg); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-pill); padding: 10px 16px;
	color: var(--ah-text-secondary); font: 600 13px var(--ah-font-body); transition: all 0.15s;
}
.fx-seg button:hover { border-color: var(--ah-teal); color: var(--ah-text); }
.fx-seg button.is-on {
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) );
	border-color: transparent; color: #fff;
}
.fx input[type="number"] {
	width: 100%; background: var(--ah-bg); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-sm); padding: 12px 14px;
	color: var(--ah-text); font: 500 15px var(--ah-font-body);
}
.fx input[type="number"]:focus { outline: none; border-color: var(--ah-teal); }
.fx-submit {
	width: 100%; margin-top: 6px; cursor: pointer; border: none;
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) );
	color: #fff; font: 800 16px var(--ah-font-heading);
	padding: 15px; border-radius: var(--ah-radius-md);
	box-shadow: 0 10px 24px rgba( 255, 93, 115, 0.4 );
}
.fx-submit:hover { transform: translateY( -2px ); }

.fx-results { margin-top: 26px; }
.fx-res-title { margin: 0 0 16px; font: 800 20px var(--ah-font-heading); color: var(--ah-text); }
.fx-res-grid { display: grid; grid-template-columns: repeat( auto-fit, minmax( 220px, 1fr ) ); gap: 14px; }
.fx-result {
	position: relative; display: flex; flex-direction: column; gap: 4px; text-decoration: none;
	background: var(--ah-surface); border: 1px solid var(--ah-border);
	border-radius: var(--ah-radius-md); padding: 18px; transition: transform 0.15s, border-color 0.15s;
}
.fx-result:hover { transform: translateY( -3px ); border-color: var(--ah-teal); }
.fx-result--best { border-color: var(--ah-coral); box-shadow: 0 10px 26px rgba( 255, 93, 115, 0.25 ); }
.fx-result__badge {
	position: absolute; top: -10px; left: 16px;
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) );
	color: #fff; font: 700 10px var(--ah-font-heading); text-transform: uppercase; letter-spacing: 0.06em;
	padding: 4px 10px; border-radius: var(--ah-radius-pill);
}
.fx-result__title { font: 700 16px var(--ah-font-heading); color: var(--ah-text); }
.fx-result__meta { font: 400 12px var(--ah-font-mono); color: var(--ah-text-muted); }
.fx-result__why { font: 600 13px var(--ah-font-body); color: var(--ah-teal); margin-top: 4px; }
.fx-result__cta { margin-top: 8px; font: 700 13px var(--ah-font-heading); color: var(--ah-coral); }
.fx-more {
	display: block; margin: 18px auto 0; cursor: pointer;
	background: var(--ah-bg); border: 1px solid var(--ah-border); color: var(--ah-text);
	border-radius: var(--ah-radius-pill); padding: 10px 22px; font: 600 13px var(--ah-font-body);
}
.fx-more-grid { margin-top: 14px; }
.fx-msg { color: var(--ah-text-secondary); font: 500 15px var(--ah-font-body); padding: 16px 0; }

/* Homepage compact CTA banner linking to the finder */
.fx-cta {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px;
	background: linear-gradient( 92deg, rgba( 255, 93, 115, 0.16 ), rgba( 124, 92, 191, 0.16 ) );
	border: 1px solid rgba( 255, 93, 115, 0.35 ); border-radius: var(--ah-radius-lg);
	padding: 22px 26px; margin: 8px 0;
}
.fx-cta__text strong { display: block; font: 800 20px var(--ah-font-heading); color: var(--ah-text); }
.fx-cta__text span { color: var(--ah-text-secondary); font: 400 14px var(--ah-font-body); }
.fx-cta__btn {
	text-decoration: none; white-space: nowrap;
	background-image: linear-gradient( 92deg, var(--ah-coral), var(--ah-purple) ); color: #fff;
	font: 800 15px var(--ah-font-heading); padding: 13px 26px; border-radius: var(--ah-radius-md);
	box-shadow: 0 8px 20px rgba( 255, 93, 115, 0.35 );
}

/* 8. Restricted / 18+ apps -------------------------------------- */
.ah-alert-red {
	background: #b91c1c;
	color: #fff;
	border-radius: var(--ah-radius-md);
	padding: 14px 18px;
	margin: 0 0 18px;
	font: 600 14px/1.55 var(--ah-font-body);
	border: 1px solid #7f1010;
}
.ah-agegate {
	display: flex; align-items: flex-start; gap: 9px;
	background: rgba( 185, 28, 28, 0.10 );
	border: 1px solid rgba( 185, 28, 28, 0.45 );
	border-radius: var(--ah-radius-sm);
	padding: 11px 13px; margin-bottom: 12px;
	font: 600 13px/1.45 var(--ah-font-body); color: var(--ah-text);
}
.ah-agegate input { margin-top: 3px; flex: none; }
.ah-cta-wrap { display: flex; flex-direction: column; gap: 10px; }
.ah-cta-wrap.is-locked .ah-download-btn { opacity: 0.45; filter: grayscale( 0.4 ); cursor: not-allowed; }
.ah-download-btn--secondary {
	background-image: none !important;
	background-color: transparent !important;
	border: 1px solid var(--ah-border) !important;
	box-shadow: none !important;
	padding: 12px 18px !important;
}
.ah-download-btn--secondary .ah-download-btn__label { font-size: 15px; }
.ah-download-btn--secondary::before { display: none; }
.ah-promo {
	font: 500 13px var(--ah-font-body); color: var(--ah-text-secondary);
	display: flex; align-items: center; gap: 8px; justify-content: center;
}
.ah-promo__code {
	user-select: all; -webkit-user-select: all;
	background: var(--ah-bg); border: 1px dashed var(--ah-teal);
	color: var(--ah-teal); border-radius: var(--ah-radius-sm);
	padding: 4px 10px; font: 700 13px var(--ah-font-mono);
}
.ah-region-block { text-align: center; padding: 80px 20px; }
.ah-region-block h1 { font: 800 28px var(--ah-font-heading); color: var(--ah-text); margin: 0 0 10px; }
.ah-region-block p { color: var(--ah-text-secondary); font: 400 15px var(--ah-font-body); }
.ah-region-block__back { color: var(--ah-coral); font-weight: 700; text-decoration: none; }
/* 18+ ribbon on grid cards */
.ah-card__age {
	position: absolute; top: 8px; left: 8px; z-index: 2;
	background: #b91c1c; color: #fff; font: 700 10px var(--ah-font-heading);
	padding: 3px 8px; border-radius: var(--ah-radius-pill); letter-spacing: 0.05em;
}

/* ============================================================
   9. Reward points (claim box, auth, dashboard)
   ============================================================ */
.ah-rp-box{margin-top:28px}
.ah-rp-note{color:var(--ah-muted,#5b6472);font-size:.95rem;margin:.25rem 0 1rem}
.ah-rp-btn{display:inline-block;background:var(--ah-accent,#0ea5a4);color:#fff;font-weight:600;border:0;border-radius:10px;padding:12px 20px;cursor:pointer;text-decoration:none;font-size:1rem;transition:filter .15s}
.ah-rp-btn:hover{filter:brightness(1.06)}
.ah-rp-form{display:flex;flex-direction:column;gap:12px;max-width:640px}
.ah-rp-row{display:flex;gap:12px;flex-wrap:wrap}
.ah-rp-row .ah-rp-field{flex:1 1 200px}
.ah-rp-field{display:flex;flex-direction:column;gap:5px;font-size:.9rem;font-weight:600;color:var(--ah-ink,#1f2733)}
.ah-rp-field input,.ah-rp-field textarea{font:inherit;font-weight:400;padding:10px 12px;border:1px solid var(--ah-border,#d7dce3);border-radius:9px;background:var(--ah-surface,#fff);color:inherit}
.ah-rp-field input:focus,.ah-rp-field textarea:focus{outline:2px solid var(--ah-accent,#0ea5a4);outline-offset:1px}
.ah-rp-msg{padding:12px 16px;border-radius:10px;margin:0 0 18px;font-weight:500}
.ah-rp-msg--ok{background:#e7f7f2;color:#0b6b5f;border:1px solid #b7e6da}
.ah-rp-msg--err{background:#fdecec;color:#b91c1c;border:1px solid #f5c6c6}
.ah-rp-auth{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;max-width:720px}
.ah-rp-card{background:var(--ah-surface,#fff);border:1px solid var(--ah-border,#e2e6ec);border-radius:14px;padding:22px}
.ah-rp-card h3{margin:0 0 14px}
.ah-rp-card form p{margin:0 0 12px}
.ah-rp-card input{width:100%;font:inherit;padding:10px 12px;border:1px solid var(--ah-border,#d7dce3);border-radius:9px}
.ah-rp-dash{max-width:760px}
.ah-rp-balance{background:linear-gradient(135deg,#0ea5a4,#0b7d7c);color:#fff;border-radius:16px;padding:26px;margin-bottom:26px}
.ah-rp-balance__num{font-size:2.6rem;font-weight:700;line-height:1}
.ah-rp-balance__num span{font-size:1rem;font-weight:500;opacity:.85;margin-left:6px}
.ah-rp-progress{height:10px;background:rgba(255,255,255,.28);border-radius:6px;margin:16px 0 8px;overflow:hidden}
.ah-rp-progress__bar{height:100%;background:#fff;border-radius:6px;transition:width .4s}
.ah-rp-balance__hint{font-size:.9rem;opacity:.9}
.ah-rp-withdraw{margin-top:16px;display:flex;flex-direction:column;gap:10px}
.ah-rp-withdraw textarea{font:inherit;padding:10px 12px;border-radius:9px;border:0}
.ah-rp-withdraw .ah-rp-btn{background:#fff;color:#0b6b5f;align-self:flex-start}
.ah-rp-h{margin:26px 0 6px}
.ah-rp-table{width:100%;border-collapse:collapse;margin-top:8px;font-size:.92rem}
.ah-rp-table th,.ah-rp-table td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--ah-border,#e6e9ee)}
.ah-rp-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--ah-muted,#6b7280)}
.ah-rp-tag{font-size:.75rem;font-weight:700;padding:3px 9px;border-radius:999px}
.ah-rp-tag--pending{background:#fff4e0;color:#b26b00}
.ah-rp-tag--approved{background:#e7f7ec;color:#1a7f37}
.ah-rp-tag--rejected{background:#fdecec;color:#b91c1c}
.ah-rp-logout{margin-top:22px}
.ah-rp-logout a{color:var(--ah-muted,#6b7280)}

/* ============================================================
   10. Collapsible filter groups + two-column option lists
   ============================================================ */
.ah-filter-sidebar form{display:flex;flex-direction:column;gap:6px}
.ah-filter-group{gap:10px;padding:10px 0;border-bottom:1px solid var(--ah-border,#2a2540)}
.ah-filter-group:last-of-type{border-bottom:0}
/* summary acts as the clickable header */
.ah-filter-group__label{display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none;user-select:none;padding:2px 0;margin:0}
.ah-filter-group__label::-webkit-details-marker{display:none}
.ah-filter-group__label::marker{content:""}
.ah-filter-group__label::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s ease;opacity:.65;margin-left:8px;flex:none}
.ah-filter-group[open] > .ah-filter-group__label::after{transform:rotate(-135deg)}
.ah-filter-group__label:hover{color:var(--ah-accent,#2DD4C7)}
/* option panels */
.ah-filter-group__options{display:flex;flex-direction:column;gap:9px;padding-top:4px}
.ah-filter-group__options--cols{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px}
.ah-filter-group__options--cols .ah-filter-checkbox{min-width:0}

/* ============================================================
   11. Earn ribbon + Goal block (offer & app cards)
   ============================================================ */
/* Anchor the ribbon to the padded card box (not the inner link) so it sits
   flush in the rounded corner. .ah-card is already position:relative. */
.ah-offer-card { position: relative; }
.ah-earn-ribbon{
	position:absolute;top:0;right:0;z-index:2;
	background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#0b6b5f;
	font-size:11px;font-weight:600;letter-spacing:.01em;
	padding:5px 12px;border-bottom-left-radius:12px;border-top-right-radius:12px;
	box-shadow:0 1px 3px rgba(0,0,0,.08);white-space:nowrap;
}
.ah-earn-ribbon strong{color:#059669;font-weight:800}
:root[data-theme="dark"] .ah-earn-ribbon,
:root:not([data-theme="light"]) .ah-earn-ribbon{background:linear-gradient(135deg,#0f3d33,#0b5147);color:#a7f3d0}
:root[data-theme="dark"] .ah-earn-ribbon strong,
:root:not([data-theme="light"]) .ah-earn-ribbon strong{color:#6ee7b7}

.ah-goal{
	background:var(--ah-surface-2,#f4f6fb);border:1px solid var(--ah-border,#e6e9ee);
	border-radius:10px;padding:10px 12px;margin:10px 0 4px;
}
.ah-goal__top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ah-goal__label{font-size:12px;font-weight:700;color:var(--ah-ink,#1f2733)}
.ah-goal__coins{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:800;color:#b8860b}
.ah-goal__coin-ico{font-size:14px}
.ah-goal__text{font-size:12px;color:var(--ah-muted,#5b6472);margin-top:3px}
:root[data-theme="dark"] .ah-goal,
:root:not([data-theme="light"]) .ah-goal{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
:root[data-theme="dark"] .ah-goal__coins,
:root:not([data-theme="light"]) .ah-goal__coins{color:#f5c451}

/* 11b. Goal reward = green ₹ + gold coins (no "Coins" word) */
.ah-goal__reward{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:800}
.ah-goal__cash{color:#059669}
.ah-goal__plus{color:var(--ah-muted,#8a93a0);font-weight:700}
.ah-goal__coins{color:#b8860b;display:inline-flex;align-items:center;gap:3px}
.ah-goal__coin-ico{font-size:14px}
:root[data-theme="dark"] .ah-goal__cash,
:root:not([data-theme="light"]) .ah-goal__cash{color:#34d399}
:root[data-theme="dark"] .ah-goal__coins,
:root:not([data-theme="light"]) .ah-goal__coins{color:#f5c451}

/* 11c. Fix goal visibility on the dark theme + badge/ribbon overlap */
.ah-goal{background:var(--ah-surface-alt);border-color:var(--ah-border)}
.ah-goal__label{color:var(--ah-text-secondary)}
.ah-goal__text{color:var(--ah-text-secondary)}
.ah-goal__cash{color:#34d399}
.ah-goal__coins{color:#f5c451}
/* trending badge -> top-left so it never sits under the Earn ribbon */
.ah-card .ah-badge{left:12px;right:auto}
/* keep the earn ribbon clear of the card's rounded corner content */
.ah-earn-ribbon{border-top-right-radius:var(--ah-radius-lg,16px)}

/* ============================================================
   12. Mobile hero: 2 featured picks + category marquee + finder popup
   ============================================================ */
.ah-hero-m{display:flex;flex-direction:column;gap:12px;padding-top:16px}
.ah-hero-m__heading{font-size:1.6rem;line-height:1.2;margin:0}
@media(min-width:800px){.ah-hero-m__heading{font-size:2.1rem}}
.ah-featured-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(min-width:800px){.ah-featured-grid{gap:20px;max-width:780px}}
/* keep the two featured cards compact so both fit the first screen */
.ah-featured-grid .ah-card__icon,.ah-featured-grid .ah-offer-card__icon{max-height:140px;overflow:hidden}

/* category marquee (auto-scroll ticker) */
.ah-marquee{overflow:hidden;margin:6px 0 2px;
	-webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
	mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ah-marquee__track{display:flex;gap:10px;width:max-content;animation:ah-marquee 28s linear infinite}
.ah-marquee:hover .ah-marquee__track,.ah-marquee:active .ah-marquee__track{animation-play-state:paused}
.ah-marquee .ah-pill{white-space:nowrap;flex:none}
@keyframes ah-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ah-marquee__track{animation:none;flex-wrap:wrap;width:auto}}

/* find-your-offer popup */
.ah-fx-modal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px}
.ah-fx-modal[hidden]{display:none}
.ah-fx-modal__backdrop{position:absolute;inset:0;background:rgba(10,6,20,.62);backdrop-filter:blur(2px)}
.ah-fx-modal__box{position:relative;z-index:1;background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);border-radius:16px;padding:26px 22px;max-width:360px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(0,0,0,.45);animation:ah-fx-pop .25s ease}
@keyframes ah-fx-pop{from{transform:translateY(12px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.ah-fx-modal__emoji{font-size:34px;margin-bottom:6px}
.ah-fx-modal__box h3{margin:0 0 8px;font-size:1.15rem;color:var(--ah-text)}
.ah-fx-modal__box p{margin:0 0 16px;color:var(--ah-text-secondary);font-size:.95rem}
.ah-fx-modal__btn{display:inline-block;background:var(--ah-accent,#2DD4C7);color:#06231f;font-weight:700;text-decoration:none;padding:12px 22px;border-radius:10px}
.ah-fx-modal__close{position:absolute;top:8px;right:10px;background:none;border:0;color:var(--ah-text-secondary);font-size:26px;line-height:1;cursor:pointer}
.ah-fx-modal__close:hover{color:var(--ah-text)}

/* ============================================================
   13. Compact BankSathi-style app/game cards (image bleeds to edges)
   ============================================================ */
.ah-card{padding:0;gap:0;overflow:hidden}
.ah-card__link{gap:0}
.ah-card__icon{aspect-ratio:1 / 0.82;border-radius:0}
.ah-card__body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:7px}
.ah-card__title{font-size:15px;line-height:1.25}
.ah-card__metarow{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ah-card__meta{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ah-card__stats{flex:none}
.ah-card .ah-goal{margin:1px 0 0;padding:9px 10px}
/* cancel the old featured-only height clamp so the image is uniform everywhere */
.ah-featured-grid .ah-card__icon,.ah-featured-grid .ah-offer-card__icon{max-height:none;overflow:visible}

/* 13b. Apps/games grids: 2 columns on mobile (was 1), more on desktop */
.ah-grid-cards{grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:700px){.ah-grid-cards{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px}}

/* 14. Quick-download icon on game cards (theme gradient, hover reacts) */
.ah-card__body{position:relative}
.ah-card__dl{
	position:absolute;top:-24px;right:12px;z-index:4;
	width:44px;height:44px;border-radius:50%;
	display:flex;align-items:center;justify-content:center;cursor:pointer;
	color:#fff;background:linear-gradient(135deg,var(--ah-coral,#FF5D73),var(--ah-purple,#7C5CBF));
	border:2px solid var(--ah-surface,#251A34);
	box-shadow:0 6px 16px rgba(255,93,115,.42);
	transition:transform .18s ease, box-shadow .18s ease;
}
.ah-card__dl svg{width:20px;height:20px}
/* whole card lifts + icon grows on card hover */
.ah-card{transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease}
.ah-card:hover{transform:translateY(-4px);border-color:var(--ah-coral,#FF5D73)}
.ah-card:hover .ah-card__dl{transform:scale(1.1)}
/* extra pop when hovering the icon itself */
.ah-card__dl:hover,.ah-card__dl:focus-visible{transform:scale(1.18);box-shadow:0 9px 22px rgba(255,93,115,.6);outline:none}

/* 14b. Download icon repositioned INSIDE the image bottom-right (cleaner look) */
.ah-card__icon{position:relative}
/* soft scrim so the icon reads on bright images */
.ah-card__icon::after{content:"";position:absolute;left:0;right:0;bottom:0;height:58px;pointer-events:none;background:linear-gradient(to top,rgba(0,0,0,.30),transparent)}
.ah-card__icon-img{transition:transform .3s ease}
.ah-card:hover .ah-card__icon-img{transform:scale(1.06)}
.ah-card__dl{
	top:auto;bottom:10px;right:10px;
	width:38px;height:38px;border:0;
	background:rgba(16,11,26,.58);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);
	box-shadow:0 4px 12px rgba(0,0,0,.4);
	transition:background .18s ease, transform .18s ease, box-shadow .18s ease;
}
.ah-card__dl svg{width:18px;height:18px}
/* card hover -> icon adopts the theme gradient; icon hover -> pop */
.ah-card:hover .ah-card__dl{background:linear-gradient(135deg,var(--ah-coral,#FF5D73),var(--ah-purple,#7C5CBF));transform:none;box-shadow:0 6px 16px rgba(255,93,115,.45)}
.ah-card__dl:hover,.ah-card__dl:focus-visible{background:linear-gradient(135deg,var(--ah-coral,#FF5D73),var(--ah-purple,#7C5CBF));transform:scale(1.14);box-shadow:0 8px 20px rgba(255,93,115,.6);outline:none}

/* ============================================================
   15. Social-proof activity toasts (slide up from bottom-left)
   ============================================================ */
.ah-sp{position:fixed;left:16px;bottom:16px;z-index:900;max-width:320px;pointer-events:none}
.ah-sp__toast{
	display:flex;align-items:center;gap:11px;pointer-events:auto;
	background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);
	border-radius:14px;padding:11px 12px;
	box-shadow:0 12px 34px rgba(0,0,0,.4);
	transform:translateY(140%);opacity:0;transition:transform .45s cubic-bezier(.22,1,.36,1),opacity .45s}
.ah-sp__toast.is-in{transform:none;opacity:1}
.ah-sp__avatar{flex:none;width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
	font-weight:700;color:#fff;background:linear-gradient(135deg,var(--ah-teal,#2DD4C7),var(--ah-purple,#7C5CBF))}
.ah-sp__text{min-width:0}
.ah-sp__msg{margin:0;font-size:13px;line-height:1.3;color:var(--ah-text)}
.ah-sp__time{font-size:11px;color:var(--ah-text-muted);display:inline-flex;align-items:center;gap:5px}
.ah-sp__time::before{content:"";width:6px;height:6px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 3px rgba(46,204,113,.18)}
.ah-sp__close{flex:none;align-self:flex-start;background:none;border:0;color:var(--ah-text-muted);font-size:18px;line-height:1;cursor:pointer;padding:0 2px}
.ah-sp__close:hover{color:var(--ah-text)}
@media(max-width:480px){.ah-sp{left:10px;right:10px;bottom:10px;max-width:none}}
@media(prefers-reduced-motion:reduce){.ah-sp__toast{transition:opacity .3s}.ah-sp__toast.is-in{transform:none}}

/* ============================================================
   16. Browse-by-category grid (uniform tiles, real links)
   ============================================================ */
.ah-cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:700px){.ah-cat-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1000px){.ah-cat-grid{grid-template-columns:repeat(4,1fr)}}
.ah-cat-tile{
	display:flex;align-items:center;gap:11px;text-decoration:none;
	background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);
	border-radius:14px;padding:13px 14px;transition:transform .18s ease,border-color .18s ease}
.ah-cat-tile:hover{transform:translateY(-3px);border-color:var(--ah-coral,#FF5D73)}
.ah-cat-tile__icon{flex:none;width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;
	background:var(--ah-surface-alt,#2F2140)}
.ah-cat-tile__text{display:flex;flex-direction:column;min-width:0;flex:1}
.ah-cat-tile__name{font:600 14px var(--ah-font-heading,inherit);color:var(--ah-text);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ah-cat-tile__count{font-size:12px;color:var(--ah-text-muted);margin-top:2px}
.ah-cat-tile__arrow{flex:none;color:var(--ah-text-muted);transition:transform .18s ease,color .18s ease}
.ah-cat-tile:hover .ah-cat-tile__arrow{color:var(--ah-coral,#FF5D73);transform:translateX(3px)}
.ah-cat-tile .ah-tag-18plus{font-size:9px;vertical-align:middle}

/* 16b. Category grid: 1 column on mobile + View-all toggle */
.ah-cat-grid{grid-template-columns:1fr}
@media(min-width:640px){.ah-cat-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.ah-cat-grid{grid-template-columns:repeat(3,1fr)}}
.ah-cat-tile--more{display:none}
.ah-cat-grid.is-expanded .ah-cat-tile--more{display:flex}
.ah-cat-viewall{
	display:block;width:100%;margin-top:14px;cursor:pointer;
	background:var(--ah-surface-alt,#2F2140);color:var(--ah-text);
	border:1px solid var(--ah-border);border-radius:12px;padding:12px 16px;
	font:600 14px var(--ah-font-heading,inherit);transition:border-color .18s,background .18s}
.ah-cat-viewall:hover{border-color:var(--ah-coral,#FF5D73)}
.ah-cat-viewall span{display:inline-block;transition:transform .2s ease}
.ah-cat-viewall[aria-expanded="true"] span{transform:rotate(180deg)}

/* 17. "How to get this & earn coins" steps section */
.ah-howto__sub{display:flex;align-items:center;gap:9px;margin:18px 0 8px;font:700 15px var(--ah-font-heading,inherit);color:var(--ah-text)}
.ah-howto__sub:first-of-type{margin-top:4px}
.ah-howto__sub span{flex:none;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;color:#fff;background:linear-gradient(135deg,var(--ah-coral,#FF5D73),var(--ah-purple,#7C5CBF))}
.ah-howto__list{margin:0 0 8px;padding-left:20px;color:var(--ah-text-secondary);font-size:14px;line-height:1.65}
.ah-howto__list li{margin-bottom:6px}
.ah-howto__list a{color:var(--ah-teal,#2DD4C7)}

/* 18. Offer card foot: benefit text + CTA on one row */
.ah-offer-card__foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.ah-offer-card__foot .ah-offer-card__desc{flex:1;min-width:0;margin:0;font-size:12.5px;line-height:1.4;color:var(--ah-text-secondary)}
.ah-offer-card__foot .ah-offer-card__cta{flex:none;white-space:nowrap}

/* 19. Offer archive: search box + sort dropdown toolbar */
.ah-offer-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.ah-offer-search{flex:1;min-width:220px;display:flex;align-items:center;gap:8px;background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);border-radius:12px;padding:9px 12px}
.ah-offer-search__icon{opacity:.6;font-size:14px}
.ah-offer-search input{flex:1;min-width:0;background:none;border:0;color:var(--ah-text);font:inherit;outline:none}
.ah-offer-search input::placeholder{color:var(--ah-text-muted)}
.ah-offer-search__go{flex:none;background:linear-gradient(135deg,var(--ah-teal,#2DD4C7),var(--ah-purple,#7C5CBF));color:#06231f;border:0;border-radius:9px;padding:7px 14px;font:700 13px var(--ah-font-heading,inherit);cursor:pointer}
.ah-offer-sort{display:inline-flex;align-items:center;gap:7px;color:var(--ah-text-secondary);font-size:13px;white-space:nowrap}
.ah-offer-sort select{background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);border-radius:10px;color:var(--ah-text);padding:9px 12px;font:inherit;cursor:pointer}
@media(max-width:520px){.ah-offer-search{order:1;flex:1 1 100%}.ah-offer-sort{order:2;margin-left:auto}}

/* 19b. Offer archive: Filters button toggles the category pills */
.ah-offer-filters-btn{flex:none;display:inline-flex;align-items:center;gap:6px;cursor:pointer;
	background:var(--ah-surface,#251A34);border:1px solid var(--ah-border);border-radius:12px;
	padding:9px 14px;color:var(--ah-text);font:600 13px var(--ah-font-heading,inherit)}
.ah-offer-filters-btn:hover{border-color:var(--ah-teal,#2DD4C7)}
.ah-offer-filters-btn__caret{transition:transform .2s ease;opacity:.7}
.ah-offer-filters-btn[aria-expanded="true"] .ah-offer-filters-btn__caret{transform:rotate(180deg)}
.ah-offer-cats{display:none;margin-top:2px}
.ah-offer-cats.is-open{display:flex}

/* 19c. Search on its own row; Filters + Sort together on the next row */
.ah-offer-search{flex:1 1 100%}
.ah-offer-sort{margin-left:0}

/* 19d. Toolbar layout: search on top, Filters + Sort together on one row */
.ah-offer-toolbar{flex-direction:column;align-items:stretch}
.ah-offer-search{flex:1 1 auto}
.ah-offer-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ah-offer-sort{margin-left:0}

/* 20. Header search icon (mobile): toggles the search bar */
.ah-search-toggle{display:none;background:none;border:1px solid var(--ah-border);border-radius:var(--ah-radius-sm,10px);width:40px;height:40px;align-items:center;justify-content:center;cursor:pointer;color:var(--ah-text)}
.ah-search-toggle svg{width:18px;height:18px}
.ah-search-toggle:hover{border-color:var(--ah-teal,#2DD4C7)}
@media(max-width:700px){
	.ah-search-toggle{display:flex;margin-left:auto}
	.ah-menu-toggle{margin-left:8px}
	.ah-search-form{display:none;flex:1 1 100%;order:99;margin-top:6px}
	.ah-search-form.is-open{display:block}
	.ah-search-form.is-open .ah-search{display:block;width:100%}
}

/* 21. Finder results use the real offer card template */
.fx-res-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:760px){.fx-res-grid{grid-template-columns:1fr 1fr}}
.fx-result-card{position:relative}
.fx-result-card .ah-offer-card{height:100%}
.fx-result-card.is-best .ah-offer-card{border-color:var(--ah-coral,#FF5D73);box-shadow:0 0 0 1px var(--ah-coral,#FF5D73),0 10px 30px rgba(255,93,115,.18)}
.fx-best-tag{position:absolute;top:-10px;left:16px;z-index:6;background:linear-gradient(135deg,var(--ah-coral,#FF5D73),var(--ah-purple,#7C5CBF));color:#fff;font-size:11px;font-weight:800;letter-spacing:.02em;padding:4px 11px;border-radius:999px;box-shadow:0 4px 12px rgba(255,93,115,.4)}

/* 22. Hide the "Goal 1" label on mobile (it wraps awkwardly in the 2-col cards) */
@media(max-width:600px){
	.ah-goal__label{display:none}
	.ah-goal__reward{margin-left:0}
}

/* 23. Responsive header — keep logo + search + menu on ONE row on mobile */
@media (max-width: 700px) {
	.ah-header__inner { gap: 10px; flex-wrap: nowrap; }
	.ah-logo { min-width: 0; }
	.ah-logo__word { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
	/* search bar becomes an overlay row so nowrap doesn't clip it when opened */
	.ah-search-form.is-open {
		position: absolute; left: 0; right: 0; top: 100%;
		background: var(--ah-surface); padding: 10px var(--ah-gutter);
		border-bottom: 1px solid var(--ah-border); z-index: 60;
	}
}
@media (max-width: 400px) {
	.ah-header__inner { gap: 8px; }
	.ah-logo__word { font-size: 14px; }
}

/* ============================================================
   24. Featured hero: 5 compact cards — row on desktop, swipe-scroll on mobile
   ============================================================ */
.ah-featured-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
	gap:14px;max-width:none;
}
/* mobile: horizontal scroll, ~2 cards visible, swipe the rest (no arrows/bullets) */
@media(max-width:700px){
	.ah-featured-grid{
		display:flex;flex-wrap:nowrap;overflow-x:auto;gap:12px;
		scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
		padding-bottom:6px;scrollbar-width:none;
	}
	.ah-featured-grid::-webkit-scrollbar{display:none}
	.ah-featured-grid > *{flex:0 0 calc(50% - 6px);scroll-snap-align:start}
}
/* keep the featured images uniform (compact, like the other cards) */
.ah-featured-grid .ah-card__icon,.ah-featured-grid .ah-offer-card__icon{max-height:none;overflow:hidden}

/* 24b. Browse by category: show ALL on desktop, top-5 + button on mobile */
@media(min-width:768px){
	.ah-cat-tile--more{display:flex}
	.ah-cat-viewall{display:none}
}

/* 25. Reward claim-form labels — use a visible token (were invisible dark on dark) */
.ah-rp-field{color:var(--ah-text-secondary)}
.ah-rp-field > span{color:var(--ah-text-secondary)}
.ah-rp-note{color:var(--ah-text-secondary)}
.ah-rp-field input,.ah-rp-field textarea{color:var(--ah-text);background:var(--ah-bg)}
.ah-rp-field input::placeholder,.ah-rp-field textarea::placeholder{color:var(--ah-text-muted)}

/* 26. Blog single: full-width heading + content (was capped at 720px with an empty sidebar) */
.ah-post-head{max-width:none}
.ah-prose{max-width:none}
.ah-post-layout{grid-template-columns:1fr}