/*
Theme Name: AW Center
Theme URI: https://androidwidgetcenter.com/
Author: AW Center
Author URI: https://androidwidgetcenter.com/
Description: App review theme for AW Center. Card-based home and archives, and a review layout that turns plain article HTML into verdict boxes, pros and cons, feature checklists, rating bars, FAQ cards and a table of contents.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aw-center
*/

:root {
	--awc-canvas: var(--wp--preset--color--canvas, #F5F7FB);
	--awc-surface: var(--wp--preset--color--surface, #FFFFFF);
	--awc-line: var(--wp--preset--color--line, #E3E8F0);
	--awc-muted: var(--wp--preset--color--muted, #5F6B7E);
	--awc-ink-soft: var(--wp--preset--color--ink-soft, #2B3445);
	--awc-ink: var(--wp--preset--color--ink, #0A1428);
	--awc-navy: var(--wp--preset--color--navy, #030D26);
	--awc-blue: var(--wp--preset--color--blue, #1570EF);
	--awc-blue-tint: var(--wp--preset--color--blue-tint, #EAF2FE);
	--awc-green: var(--wp--preset--color--green, #1FA463);
	--awc-green-tint: var(--wp--preset--color--green-tint, #E7F7EE);
	--awc-red: var(--wp--preset--color--red, #D93A3A);
	--awc-red-tint: var(--wp--preset--color--red-tint, #FDECEC);
	--awc-amber: var(--wp--preset--color--amber, #F5A524);
	--awc-radius: 16px;
	--awc-radius-sm: 10px;
	--awc-shadow: 0 1px 2px rgba(10, 20, 40, .06), 0 4px 16px rgba(10, 20, 40, .06);
	--awc-shadow-hover: 0 2px 4px rgba(10, 20, 40, .08), 0 12px 28px rgba(10, 20, 40, .10);
	--awc-header-h: 72px;
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

::selection { background: var(--awc-blue-tint); color: var(--awc-ink); }

a:focus-visible, button:focus-visible, input:focus-visible, summary:focus-visible, .awc-table-wrap:focus-visible {
	outline: 2px solid var(--awc-blue);
	outline-offset: 2px;
	border-radius: 4px;
}

[id] { scroll-margin-top: calc(var(--awc-header-h) + 16px); }

.wp-site-blocks { padding-top: 0; }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* ---------- Header ---------- */
.awc-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: rgba(255, 255, 255, .92);
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	backdrop-filter: saturate(180%) blur(12px);
	border-bottom: 1px solid var(--awc-line);
}
.admin-bar .awc-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .awc-header { top: 0; position: relative; } }

.awc-header__bar {
	min-height: var(--awc-header-h);
	gap: 1rem;
}
.awc-logo { display: inline-flex; align-items: center; line-height: 0; }
.awc-logo img { height: 48px; width: auto; }
@media (max-width: 600px) { .awc-logo img { height: 38px; } }

.awc-header__right { gap: .25rem; }
.awc-nav .wp-block-navigation-item__content {
	color: var(--awc-ink-soft);
	padding: .45rem .75rem !important;
	border-radius: 999px;
	transition: background .15s, color .15s;
}
.awc-nav .wp-block-navigation-item__content:hover,
.awc-nav .current-menu-item > .wp-block-navigation-item__content {
	background: var(--awc-blue-tint);
	color: var(--awc-blue);
	text-decoration: none;
}
.awc-nav.wp-block-navigation .wp-block-navigation__container { gap: .15rem; }
.awc-nav .wp-block-navigation__submenu-container {
	border: 1px solid var(--awc-line) !important;
	border-radius: var(--awc-radius-sm);
	box-shadow: var(--awc-shadow-hover);
	padding: .35rem !important;
}
.awc-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem; }

.awc-search .wp-block-search__button {
	background: transparent;
	color: var(--awc-ink-soft);
	border-radius: 999px;
	padding: .5rem;
	margin-left: 0;
}
.awc-search .wp-block-search__button:hover { background: var(--awc-blue-tint); color: var(--awc-blue); }
.awc-search .wp-block-search__input {
	border: 1px solid var(--awc-line);
	border-radius: 999px;
	padding: .45rem .9rem;
	font-size: var(--wp--preset--font-size--small);
}

/* ---------- Layout ---------- */
.awc-main {
	padding-top: var(--wp--preset--spacing--50);
	padding-bottom: var(--wp--preset--spacing--60);
}
.awc-eyebrow {
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--awc-blue);
	margin: 0;
}
.awc-section-title {
	font-size: var(--wp--preset--font-size--large) !important;
	margin-top: var(--wp--preset--spacing--60) !important;
	margin-bottom: 1.25rem !important;
}

/* ---------- Home hero ---------- */
.awc-hero {
	text-align: center;
	max-width: 760px;
	margin: 0 auto var(--wp--preset--spacing--50) !important;
}
.awc-hero > * + * { margin-top: .9rem; }
.awc-hero__title { font-size: clamp(2.1rem, 5vw, 3.4rem) !important; letter-spacing: -.03em; }
.awc-hero__lede { font-size: 1.15rem; color: var(--awc-muted); }

.awc-platforms { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin-top: 1.5rem; }
.awc-platform {
	display: inline-flex; align-items: center; gap: .5rem;
	padding: .65rem 1.15rem;
	border-radius: 999px;
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	color: var(--awc-ink);
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small);
	box-shadow: var(--awc-shadow);
	transition: transform .15s, box-shadow .15s;
}
.awc-platform:hover { transform: translateY(-1px); box-shadow: var(--awc-shadow-hover); text-decoration: none; }
.awc-platform--android svg { color: var(--awc-green); }
.awc-platform--iphone svg { color: var(--awc-ink); }

/* Lead story */
.awc-lead__card {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	border-radius: calc(var(--awc-radius) + 4px);
	overflow: hidden;
	box-shadow: var(--awc-shadow);
}
.awc-lead__img { margin: 0 !important; height: 100%; }
.awc-lead__img img { height: 100% !important; object-fit: cover; }
.awc-lead__body { padding: clamp(1.5rem, 3vw, 2.5rem); display: flex; flex-direction: column; justify-content: center; gap: .85rem; }
.awc-lead__body > * { margin: 0 !important; }
.awc-lead__title { font-size: var(--wp--preset--font-size--x-large) !important; }
.awc-lead__title a:hover { color: var(--awc-blue); text-decoration: none; }
.awc-lead .wp-block-post-excerpt__excerpt { color: var(--awc-muted); margin: 0; }
@media (max-width: 820px) { .awc-lead__card { grid-template-columns: 1fr; } }

/* ---------- Cards ---------- */
.awc-grid { gap: 1.5rem !important; }
.awc-grid--static { display: grid; grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr)); }
.awc-card {
	height: 100%;
	display: flex;
	flex-direction: column;
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	border-radius: var(--awc-radius);
	overflow: hidden;
	box-shadow: var(--awc-shadow);
	transition: transform .18s ease, box-shadow .18s ease;
}
.awc-card:hover { transform: translateY(-2px); box-shadow: var(--awc-shadow-hover); }
.awc-card__img { margin: 0 !important; display: block; background: var(--awc-navy); }
.awc-card__img img { display: block; width: 100%; }
.awc-card__body { padding: 1.1rem 1.25rem 1.3rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.awc-card__body > * { margin: 0 !important; }
.awc-card__title { font-size: 1.15rem !important; line-height: 1.3; }
.awc-card__title a { color: var(--awc-ink); }
.awc-card__title a:hover { color: var(--awc-blue); text-decoration: none; }
.awc-card__excerpt, .awc-card__excerpt p { color: var(--awc-muted); font-size: var(--wp--preset--font-size--small); line-height: 1.55; margin: 0; }
.awc-card__date { margin-top: auto !important; }
.awc-empty { text-align: center; color: var(--awc-muted); padding: 3rem 0; }

/* Category pills */
.awc-pills { display: flex; flex-wrap: wrap; gap: .35rem; font-size: 0; }
.awc-pills .wp-block-post-terms__separator { display: none; }
.awc-pills a {
	display: inline-block;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: .22rem .6rem;
	border-radius: 999px;
	background: var(--awc-blue-tint);
	color: var(--awc-blue);
}
.awc-pills a:hover { text-decoration: none; filter: brightness(.96); }
.awc-pills a[href*="/category/android"] { background: var(--awc-green-tint); color: #12804B; }
.awc-pills a[href*="/category/iphone"] { background: #EEF0F4; color: var(--awc-ink); }

/* Pagination */
.awc-pagination { margin-top: var(--wp--preset--spacing--50) !important; gap: .35rem; font-weight: 600; font-size: var(--wp--preset--font-size--small); }
.awc-pagination a, .awc-pagination .current {
	padding: .45rem .85rem; border-radius: 999px; border: 1px solid var(--awc-line); background: var(--awc-surface); color: var(--awc-ink-soft);
}
.awc-pagination .current { background: var(--awc-ink); border-color: var(--awc-ink); color: #fff; }
.awc-pagination a:hover { text-decoration: none; border-color: var(--awc-blue); color: var(--awc-blue); }

/* ---------- Archive / search heads ---------- */
.awc-archive-head { margin-bottom: var(--wp--preset--spacing--50) !important; }
.awc-archive-head > * + * { margin-top: .6rem; }
.awc-archive-head .wp-block-query-title { margin-top: .4rem; }
.awc-archive-head .wp-block-term-description { color: var(--awc-muted); max-width: 680px; }
.awc-search-big .wp-block-search__inside-wrapper {
	border: 1px solid var(--awc-line); border-radius: 999px; padding: .3rem; background: var(--awc-surface); box-shadow: var(--awc-shadow);
}
.awc-search-big .wp-block-search__input { border: 0; padding: .5rem 1rem; background: transparent; }
.awc-search-big .wp-block-search__button { margin-left: .3rem; }

/* Breadcrumbs */
.awc-crumbs { font-size: var(--wp--preset--font-size--x-small); color: var(--awc-muted); display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.awc-crumbs a { color: var(--awc-muted); font-weight: 600; }
.awc-crumbs a:hover { color: var(--awc-blue); }
.awc-crumbs [aria-current] { color: var(--awc-ink); font-weight: 600; }
.awc-crumbs__sep { opacity: .5; }

/* ---------- Single review ---------- */
.awc-article-head { max-width: 820px; margin-left: 0 !important; }
.awc-article-head > * { margin-top: 0 !important; margin-bottom: 0 !important; }
.awc-article-head > * + * { margin-top: 1rem !important; }
.awc-article-title { font-size: clamp(2rem, 4.4vw, 3rem) !important; letter-spacing: -.03em; }
.awc-article-dek, .awc-article-dek p { font-size: 1.2rem; color: var(--awc-muted); line-height: 1.55; margin: 0; }

.awc-meta { display: flex; flex-wrap: wrap; gap: .35rem 1.1rem; font-size: var(--wp--preset--font-size--x-small); color: var(--awc-muted); margin: 0; }
.awc-meta__by { color: var(--awc-ink); font-weight: 600; }
.awc-meta__time { display: inline-flex; align-items: center; gap: .3rem; }

.awc-store { display: flex; flex-wrap: wrap; gap: .6rem; }
.awc-store__btn {
	display: inline-flex; align-items: center; gap: .6rem;
	padding: .5rem 1.1rem .5rem .85rem;
	border-radius: 12px;
	background: var(--awc-navy);
	color: #fff;
	line-height: 1.1;
	font-weight: 700;
	font-size: 1rem;
	transition: transform .15s, box-shadow .15s;
}
.awc-store__btn small { display: block; font-size: .66rem; font-weight: 500; opacity: .8; letter-spacing: .02em; }
.awc-store__btn svg { width: 22px; height: 22px; flex: none; }
.awc-store__btn--play svg { color: #3DDC84; }
.awc-store__btn:hover { color: #fff; text-decoration: none; transform: translateY(-1px); box-shadow: var(--awc-shadow-hover); }

.awc-article-img { margin-top: var(--wp--preset--spacing--50) !important; }
.awc-article-img img { border-radius: calc(var(--awc-radius) + 4px); box-shadow: var(--awc-shadow); }

.awc-article-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3rem;
	margin-top: var(--wp--preset--spacing--50) !important;
}
@media (min-width: 1024px) {
	.awc-article-layout { grid-template-columns: minmax(0, 760px) 260px; justify-content: space-between; }
	.awc-aside { order: 2; }
	.awc-aside .awc-toc { position: sticky; top: calc(var(--awc-header-h) + 24px); }
	.admin-bar .awc-aside .awc-toc { top: calc(var(--awc-header-h) + 56px); }
}
@media (max-width: 1023px) {
	.awc-aside { order: -1; }
}

/* Table of contents */
.awc-toc {
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	border-radius: var(--awc-radius);
	padding: 1rem 1.1rem;
	font-size: var(--wp--preset--font-size--small);
	max-height: calc(100vh - var(--awc-header-h) - 48px);
	overflow: auto;
}
.awc-toc summary { font-weight: 700; color: var(--awc-ink); cursor: pointer; list-style: none; display: flex; justify-content: space-between; }
.awc-toc summary::-webkit-details-marker { display: none; }
.awc-toc summary::after { content: "–"; color: var(--awc-muted); }
.awc-toc details:not([open]) summary::after { content: "+"; }
.awc-toc ol { list-style: none; margin: .75rem 0 0; padding: 0; counter-reset: toc; }
.awc-toc li { counter-increment: toc; }
.awc-toc a {
	display: flex; gap: .55rem;
	padding: .35rem .5rem;
	border-radius: 8px;
	color: var(--awc-ink-soft);
	line-height: 1.35;
}
.awc-toc a::before { content: counter(toc); font-variant-numeric: tabular-nums; color: var(--awc-muted); font-size: .8em; padding-top: .1em; min-width: 1.1em; }
.awc-toc a:hover, .awc-toc a.is-active { background: var(--awc-blue-tint); color: var(--awc-blue); text-decoration: none; }

/* Prose */
.awc-prose { font-size: 1.0625rem; }
.awc-prose > * { margin-top: 0; margin-bottom: 0; }
.awc-prose > * + * { margin-top: 1.1rem; }
.awc-prose h2 { margin-top: 2.75rem !important; font-size: 1.65rem; }
.awc-prose h3 { margin-top: 2rem !important; font-size: 1.2rem; }
.awc-prose h2 + *, .awc-prose h3 + * { margin-top: .75rem; }
.awc-prose ul, .awc-prose ol { padding-left: 1.3rem; }
.awc-prose li + li { margin-top: .45rem; }
.awc-prose li::marker { color: var(--awc-blue); }
.awc-prose strong { color: var(--awc-ink); }
.awc-prose a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.awc-prose img { border-radius: var(--awc-radius-sm); }
.awc-prose blockquote {
	margin-left: 0; padding: .25rem 0 .25rem 1.25rem; border-left: 3px solid var(--awc-blue); color: var(--awc-ink); font-style: italic;
}

/* Tables */
.awc-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	border-radius: var(--awc-radius-sm);
}
.awc-prose table, .awc-table-wrap table {
	width: 100%;
	border-collapse: collapse;
	font-size: .95rem;
	line-height: 1.5;
	margin: 0;
}
.awc-prose th, .awc-prose td { padding: .7rem .9rem; border-bottom: 1px solid var(--awc-line); text-align: left; vertical-align: top; }
.awc-prose tr:last-child > * { border-bottom: 0; }
.awc-prose tr:first-child > th { background: #F8FAFD; color: var(--awc-ink); font-weight: 700; font-size: .82rem; letter-spacing: .02em; }
.awc-prose td { min-width: 7rem; }

/* "At a glance" spec card */
.awc-prose table.awc-glance th {
	background: transparent !important;
	width: 34%;
	font-size: .875rem !important;
	color: var(--awc-muted) !important;
	font-weight: 600 !important;
	letter-spacing: 0 !important;
}
.awc-prose table.awc-glance td { color: var(--awc-ink); font-weight: 500; }
.awc-prose table.awc-glance tr:nth-child(even) > * { background: #FAFBFD; }

/* Feature checklist */
.awc-status {
	display: inline-flex; align-items: center; gap: .3rem;
	padding: .15rem .55rem;
	border-radius: 999px;
	font-size: .8rem;
	font-weight: 700;
	white-space: nowrap;
}
.awc-status::before { font-weight: 800; }
.awc-status--yes { background: var(--awc-green-tint); color: #12804B; }
.awc-status--yes::before { content: "✓"; }
.awc-status--no { background: var(--awc-red-tint); color: #B32626; }
.awc-status--no::before { content: "✕"; }
.awc-status--partial { background: #FFF5E0; color: #9A6100; }
.awc-status--partial::before { content: "~"; }

/* Rating breakdown */
.awc-ratings td:last-child { min-width: 11rem; }
.awc-ratings .awc-bar {
	display: block;
	height: 8px;
	margin-top: .35rem;
	border-radius: 999px;
	background: #EEF1F6;
	overflow: hidden;
}
.awc-ratings .awc-bar i { display: block; height: 100%; background: var(--awc-amber); border-radius: inherit; }
.awc-ratings td:first-child { font-weight: 700; color: var(--awc-ink); white-space: nowrap; }
.awc-ratings td:first-child::after { content: " ★"; color: var(--awc-amber); }

/* Pros & cons */
.awc-prose ul.awc-pros, .awc-prose ul.awc-cons {
	list-style: none;
	padding: 1.1rem 1.25rem;
	border-radius: var(--awc-radius);
	border: 1px solid;
}
.awc-prose ul.awc-pros { background: #F4FBF7; border-color: #CBEBD8; }
.awc-prose ul.awc-cons { background: #FEF7F7; border-color: #F5D2D2; }
.awc-pros li, .awc-cons li { position: relative; padding-left: 1.85rem; }
.awc-pros li::before, .awc-cons li::before {
	position: absolute; left: 0; top: .2em;
	width: 1.25rem; height: 1.25rem;
	border-radius: 50%;
	display: grid; place-items: center;
	font-size: .72rem; font-weight: 800; color: #fff;
}
.awc-pros li::before { content: "✓"; background: var(--awc-green); }
.awc-cons li::before { content: "✕"; background: var(--awc-red); }

/* Callout boxes */
.awc-box {
	border-radius: var(--awc-radius);
	padding: 1.4rem 1.5rem;
	margin-top: 2.25rem !important;
}
.awc-box > * { margin: 0; }
.awc-box > * + * { margin-top: .75rem; }
.awc-box h2 { margin-top: 0 !important; font-size: 1.05rem !important; letter-spacing: .06em; text-transform: uppercase; }
.awc-box--verdict { background: var(--awc-navy); color: #DCE6F7; }
.awc-box--verdict h2 { color: #3DDC84; }
.awc-box--verdict a { color: #8DBBFF; }
.awc-box--verdict strong { color: #fff; }
.awc-box--method { background: var(--awc-blue-tint); border: 1px solid #CFE0FB; font-size: .95rem; }
.awc-box--method h2 { color: var(--awc-blue); }

/* FAQ */
.awc-faq {
	background: var(--awc-surface);
	border: 1px solid var(--awc-line);
	border-radius: var(--awc-radius-sm);
	padding: 1rem 1.2rem;
}
.awc-prose .awc-faq + .awc-faq { margin-top: .75rem; }
.awc-faq > * { margin: 0; }
.awc-faq > * + * { margin-top: .5rem; }
.awc-prose .awc-faq h3 { margin-top: 0 !important; font-size: 1.05rem; }

/* Tags */
.awc-tags { margin-top: 2.5rem !important; font-size: var(--wp--preset--font-size--x-small); color: var(--awc-muted); }
.awc-tags a { display: inline-block; padding: .15rem .55rem; border-radius: 999px; border: 1px solid var(--awc-line); color: var(--awc-ink-soft); margin: .15rem 0; }
.awc-tags .wp-block-post-terms__separator { display: none; }
.awc-tags a + a { margin-left: .3rem; }

/* Pages */
.awc-page .wp-block-post-title { margin-bottom: 1.5rem; }

/* 404 */
.awc-404 { text-align: center; padding: 3rem 0; }
.awc-404 > * + * { margin-top: 1rem; }

/* ---------- Footer ---------- */
.awc-footer {
	background: var(--awc-navy);
	color: #A9B6CC;
	padding-top: var(--wp--preset--spacing--60);
	padding-bottom: 2rem;
	font-size: var(--wp--preset--font-size--small);
}
.awc-footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 2.5rem; }
.awc-footer__brand img { display: block; margin-bottom: 1rem; border-radius: 12px; }
.awc-footer__brand p { max-width: 380px; margin: 0; }
.awc-footer__brand strong { color: #fff; }
.awc-footer h2 { color: #fff; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; margin: 0 0 .9rem; }
.awc-footer ul { list-style: none; margin: 0; padding: 0; }
.awc-footer li + li { margin-top: .5rem; }
.awc-footer a { color: #DCE6F7; }
.awc-footer a:hover { color: #3DDC84; text-decoration: none; }
.awc-footer__legal { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 2.5rem; padding-top: 1.5rem; font-size: .78rem; color: #7F8DA6; }
@media (max-width: 700px) { .awc-footer__grid { grid-template-columns: 1fr 1fr; } .awc-footer__brand { grid-column: 1 / -1; } }
