/*
Theme Name: Classic Car Africa
Theme URI: https://www.classiccarafrica.com/
Author: Classic Car Africa
Description: Dark, photo-led showroom theme for Classic Car Africa. Includes a Cars listing type (price, year, mileage, status), live online bidding auctions with bidder accounts, customer vehicle submissions, Articles and News with an article importer, New Arrivals home grid, Recently Sold page template, WhatsApp button and Customizer options.
Version: 1.3.0
Requires at least: 6.0
Tested up to: 7.1
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: classiccarafrica
*/

:root {
	--cca-bg: #000;
	--cca-text: #fff;
	--cca-muted: #a8a8a8;
	--cca-line: #222;
	--cca-green: #25d366;
	--cca-head: 'Oswald', 'Arial Narrow', Arial, Helvetica, sans-serif;
	--cca-body: Arial, Helvetica, sans-serif;
	--cca-wrap: 1240px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--cca-bg);
	color: var(--cca-text);
	font-family: var(--cca-body);
	font-size: 16px;
	line-height: 1.6;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--cca-text); text-decoration: none; }
a:hover, a:focus { color: var(--cca-muted); }
h1, h2, h3, h4 { font-family: var(--cca-head); font-weight: 500; text-transform: uppercase; letter-spacing: .08em; line-height: 1.2; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); white-space: nowrap; }
.screen-reader-text:focus { clip: auto; width: auto; height: auto; background: #fff; color: #000; padding: 8px 12px; z-index: 1000; left: 8px; top: 8px; }
.cca-wrap { max-width: var(--cca-wrap); margin: 0 auto; padding: 0 24px; }

/* Header */
.site-header { background: #000; position: relative; z-index: 50; }
.site-header .cca-wrap { display: flex; align-items: center; justify-content: space-between; min-height: 96px; gap: 24px; }
.cca-logo { display: inline-flex; flex-direction: column; align-items: center; line-height: 1; color: #fff; }
.cca-logo:hover { color: #fff; }
.cca-logo__main { font-family: var(--cca-head); font-weight: 700; font-size: 38px; letter-spacing: .12em; }
.cca-logo__sub { font-family: var(--cca-head); font-weight: 400; font-size: 11px; letter-spacing: .55em; margin-top: 6px; padding-left: .55em; }
.custom-logo-link img { max-height: 70px; width: auto; }
.cca-logo__img { display: block; height: 56px; width: auto; }
.site-footer .cca-logo__img { height: 48px; }
@media (max-width: 600px) { .cca-logo__img { height: 42px; } }

.main-navigation ul { list-style: none; margin: 0; padding: 0; }
.main-navigation > div > ul, .main-navigation > ul { display: flex; gap: 34px; }
.main-navigation li { position: relative; }
.main-navigation a { display: block; font-family: var(--cca-head); font-size: 14px; font-weight: 400; text-transform: uppercase; letter-spacing: .18em; padding: 10px 0; }
.main-navigation .menu-item-has-children > a::after { content: ''; display: inline-block; margin-left: 8px; border: 4px solid transparent; border-top-color: currentColor; vertical-align: 2px; }
.main-navigation .sub-menu { position: absolute; top: 100%; left: -16px; min-width: 300px; background: #000; border: 1px solid var(--cca-line); padding: 8px 0; opacity: 0; visibility: hidden; transform: translateY(6px); transition: .15s; }
.main-navigation .sub-menu a { padding: 10px 16px; font-size: 13px; letter-spacing: .1em; }
.main-navigation li:hover > .sub-menu, .main-navigation li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.menu-toggle { display: none; background: none; border: 1px solid #444; color: #fff; padding: 8px 12px; font-family: var(--cca-head); letter-spacing: .15em; cursor: pointer; }

/* Hero */
.cca-hero { position: relative; min-height: min(72vh, 760px); background: #111 center / cover no-repeat; display: flex; align-items: flex-start; }
.cca-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,0) 45%, rgba(0,0,0,.25) 100%); }
.cca-hero .cca-wrap { position: relative; width: 100%; padding-top: 7vh; }
.cca-hero__title { margin: 0; font-size: clamp(32px, 5.4vw, 72px); font-weight: 400; letter-spacing: .32em; max-width: 14em; text-shadow: 0 2px 18px rgba(0,0,0,.5); }

/* Sections */
.cca-section { padding: 70px 0 80px; }
.cca-section__title { text-align: center; font-size: 30px; letter-spacing: .3em; margin: 0 0 48px; }
.cca-page-header { padding: 60px 0 10px; text-align: center; }
.cca-page-header h1 { font-size: clamp(28px, 4vw, 42px); letter-spacing: .25em; margin: 0; }
.cca-page-header p { color: var(--cca-muted); }

/* Car grid */
.cca-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px 36px; }
.cca-card { text-align: center; }
.cca-card__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #111; }
.cca-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.cca-card:hover .cca-card__media img { transform: scale(1.03); }
.cca-card__price { margin: 18px 0 2px; font-family: var(--cca-head); font-size: 17px; letter-spacing: .14em; }
.cca-card__title { margin: 6px 0 0; font-family: var(--cca-head); font-size: 17px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase; }
.cca-card__price + .cca-card__title { margin-top: 0; }
.cca-badge { display: inline-block; margin-top: 8px; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; border: 1px solid #555; padding: 2px 8px; color: var(--cca-muted); }
.cca-show-all { text-align: center; margin-top: 56px; }
.cca-show-all a, .cca-btn { display: inline-block; font-family: var(--cca-head); letter-spacing: .25em; text-transform: uppercase; font-size: 16px; padding: 12px 4px; border-bottom: 1px solid transparent; }
.cca-show-all a:hover { border-bottom-color: #fff; color: #fff; }
.cca-empty { text-align: center; color: var(--cca-muted); }

/* Pagination */
.cca-pagination, .navigation.pagination { margin-top: 50px; text-align: center; font-family: var(--cca-head); letter-spacing: .15em; }
.page-numbers { display: inline-block; padding: 6px 12px; border: 1px solid var(--cca-line); margin: 2px; }
.page-numbers.current { background: #fff; color: #000; }

/* Single car */
.cca-car { padding: 40px 0 80px; }
.cca-car__hero img { width: 100%; max-height: 78vh; object-fit: cover; }
.cca-car__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 16px; margin: 32px 0 24px; border-bottom: 1px solid var(--cca-line); padding-bottom: 24px; }
.cca-car__title { margin: 0; font-size: clamp(26px, 3.6vw, 40px); letter-spacing: .12em; }
.cca-car__price { font-family: var(--cca-head); font-size: 28px; letter-spacing: .12em; }
.cca-car__layout { display: grid; grid-template-columns: 2fr 1fr; gap: 48px; }
.cca-gallery { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 12px 0 32px; }
.cca-gallery a { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #111; }
.cca-gallery img { width: 100%; height: 100%; object-fit: cover; opacity: .85; transition: opacity .2s; }
.cca-gallery a:hover img, .cca-gallery a.is-active img { opacity: 1; }
.cca-car__content { color: #ddd; }
.cca-car__content .wp-block-image, .cca-car__content .wp-block-gallery, .cca-car__content figure:has(> img) { display: none; }
.cca-details { width: 100%; border-collapse: collapse; font-size: 15px; }
.cca-details th, .cca-details td { text-align: left; padding: 12px 0; border-bottom: 1px solid var(--cca-line); }
.cca-details th { font-family: var(--cca-head); font-weight: 400; letter-spacing: .15em; text-transform: uppercase; color: var(--cca-muted); width: 45%; }
.cca-wa-enquire { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 24px; background: var(--cca-green); color: #fff; font-family: var(--cca-head); letter-spacing: .12em; text-transform: uppercase; padding: 14px 18px; border-radius: 4px; }
.cca-wa-enquire:hover, .cca-wa-enquire:focus { color: #fff; filter: brightness(1.08); }
.cca-back { display: inline-block; margin-top: 40px; font-family: var(--cca-head); letter-spacing: .2em; text-transform: uppercase; }

/* Generic content */
.cca-content { max-width: 860px; margin: 0 auto; padding: 30px 24px 80px; color: #ddd; }
.cca-content a { text-decoration: underline; }
.cca-content input, .cca-content textarea, .cca-content select { background: #111; color: #fff; border: 1px solid #333; padding: 10px; font: inherit; max-width: 100%; }
.cca-content button, .cca-content input[type=submit] { background: #fff; color: #000; border: 0; padding: 10px 20px; font-family: var(--cca-head); letter-spacing: .15em; text-transform: uppercase; cursor: pointer; }
.cca-post-list article { border-bottom: 1px solid var(--cca-line); padding: 24px 0; }
.alignwide { max-width: 1100px; }
.alignfull { width: 100vw; margin-left: calc(50% - 50vw); }

/* WhatsApp float */
.cca-wa-float { position: fixed; right: 22px; bottom: 22px; z-index: 99; display: inline-flex; align-items: center; gap: 10px; background: var(--cca-green); color: #fff; padding: 12px 20px 12px 14px; border-radius: 40px; font-family: var(--cca-body); font-weight: 700; font-size: 15px; box-shadow: 0 6px 18px rgba(0,0,0,.4); }
.cca-wa-float:hover, .cca-wa-float:focus { color: #fff; filter: brightness(1.08); }
.cca-wa-float svg, .cca-wa-enquire svg { width: 24px; height: 24px; fill: currentColor; flex: none; }

/* Footer */
.site-footer { background: #000; border-top: 1px solid var(--cca-line); padding: 40px 0 90px; text-align: center; color: var(--cca-muted); font-size: 13px; letter-spacing: .08em; }
.site-footer .cca-logo { margin-bottom: 18px; }
.site-footer nav ul { list-style: none; margin: 0 0 16px; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; }
.site-footer nav a { font-family: var(--cca-head); text-transform: uppercase; letter-spacing: .18em; font-size: 12px; }
.site-footer nav .sub-menu { display: none; }

/* Responsive */
@media (max-width: 1024px) {
	.cca-grid { grid-template-columns: repeat(2, 1fr); }
	.main-navigation > div > ul, .main-navigation > ul { gap: 22px; }
	.cca-car__layout { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
	.menu-toggle { display: block; }
	.main-navigation { position: absolute; left: 0; right: 0; top: 100%; background: #000; border-top: 1px solid var(--cca-line); display: none; padding: 12px 24px 20px; }
	.main-navigation.is-open { display: block; }
	.main-navigation > div > ul, .main-navigation > ul { flex-direction: column; gap: 0; }
	.main-navigation .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; border: 0; padding: 0 0 0 16px; min-width: 0; }
	.cca-hero { min-height: 55vh; }
}
@media (max-width: 600px) {
	.cca-grid { grid-template-columns: 1fr; }
	.cca-logo__main { font-size: 30px; }
	.cca-gallery { grid-template-columns: repeat(3, 1fr); }
	.cca-wa-float span { display: none; }
	.cca-wa-float { padding: 14px; }
}

/* ===== Auctions ===== */
.cca-live-auctions { border-bottom: 1px solid var(--cca-line); }
.cca-card__media { position: relative; }
.cca-lot-badge { position: absolute; top: 12px; left: 12px; font-family: var(--cca-head); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; padding: 4px 10px; background: #000; color: #fff; border: 1px solid #fff; }
.cca-lot-badge.is-inline { position: static; display: inline-block; margin-bottom: 12px; }
.cca-lot-badge--live { background: #c8102e; border-color: #c8102e; }
.cca-lot-badge--upcoming { background: #000; border-color: #888; }
.cca-lot-badge--ended, .cca-lot-badge--withdrawn { background: #333; border-color: #333; color: #bbb; }
.cca-countdown { margin: 8px 0 0; font-family: var(--cca-head); letter-spacing: .12em; color: var(--cca-muted); font-size: 14px; text-transform: uppercase; }
.cca-countdown.is-urgent { color: #ff4d5e; }
.cca-countdown--big { font-size: 22px; color: #fff; margin: 0 0 16px; }
.cca-subhead { font-size: 20px; letter-spacing: .2em; margin: 36px 0 12px; }
.cca-bidbox { border: 1px solid var(--cca-line); padding: 24px; background: #0a0a0a; position: sticky; top: 20px; }
.cca-bid-form { margin-top: 20px; }
.cca-bid-form label { display: block; font-family: var(--cca-head); letter-spacing: .12em; text-transform: uppercase; font-size: 13px; color: var(--cca-muted); margin-bottom: 8px; }
.cca-bid-row { display: flex; gap: 8px; }
.cca-bid-row input { flex: 1; min-width: 0; background: #111; color: #fff; border: 1px solid #444; padding: 12px; font-size: 18px; font-family: var(--cca-head); letter-spacing: .08em; }
.cca-button { display: inline-block; background: #fff; color: #000; border: 1px solid #fff; padding: 12px 20px; font-family: var(--cca-head); letter-spacing: .15em; text-transform: uppercase; font-size: 14px; cursor: pointer; text-decoration: none !important; }
.cca-button:hover, .cca-button:focus { background: #ddd; color: #000; }
.cca-button--ghost { background: transparent; color: #fff; }
.cca-button--ghost:hover { background: #222; color: #fff; }
.cca-button--confirm { background: var(--cca-green); border-color: var(--cca-green); color: #fff; }
.cca-button--block { display: block; text-align: center; margin-top: 20px; }
.cca-bid-confirm { margin-top: 14px; padding: 14px; border: 1px solid var(--cca-green); }
.cca-bid-confirm p { margin: 0 0 12px; font-weight: 700; }
.cca-bid-message { min-height: 1.4em; margin: 14px 0 0; }
.cca-bid-message.is-ok, .cca-bid-lead { color: var(--cca-green); }
.cca-bid-message.is-error { color: #ff6b6b; }
.cca-bid-lead { margin: 14px 0 0; font-weight: 700; }
.cca-bid-closed { margin-top: 18px; color: var(--cca-muted); }
.cca-terms-note { font-size: 13px; color: var(--cca-muted); margin: 12px 0 0; }
.cca-terms-note a { text-decoration: underline; }
.cca-history td, .cca-history th { width: auto; }
.cca-history tr.is-mine td { color: var(--cca-green); }
[hidden] { display: none !important; }

/* Account */
.cca-account-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.cca-form label { display: block; font-family: var(--cca-head); letter-spacing: .12em; text-transform: uppercase; font-size: 13px; color: var(--cca-muted); margin-bottom: 6px; }
.cca-form input[type=text], .cca-form input[type=email], .cca-form input[type=tel], .cca-form input[type=password] { width: 100%; }
.cca-form .cca-check label { text-transform: none; letter-spacing: 0; font-family: var(--cca-body); font-size: 14px; color: #ddd; }
.cca-form .cca-check input { margin-right: 8px; }
.cca-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.cca-notice { padding: 12px 16px; border: 1px solid; margin: 0 0 24px; }
.cca-notice ul { margin: 0; padding-left: 18px; }
.cca-notice.is-error { border-color: #ff6b6b; color: #ffb3b3; }
.cca-notice.is-ok { border-color: var(--cca-green); color: var(--cca-green); }
.cca-account-item a { color: var(--cca-muted); }
@media (max-width: 860px) {
	.cca-account-grid { grid-template-columns: 1fr; }
	.cca-bidbox { position: static; }
}

/* ===== Vehicle submissions ===== */
.cca-auctions-cta { margin-top: 22px; }
.cca-submit fieldset { border: 1px solid var(--cca-line); padding: 20px 22px 6px; margin: 0 0 26px; }
.cca-submit legend { font-family: var(--cca-head); letter-spacing: .2em; text-transform: uppercase; padding: 0 8px; font-size: 16px; }
.cca-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; }
.cca-submit input[type=text], .cca-submit input[type=email], .cca-submit input[type=tel], .cca-submit input[type=number], .cca-submit textarea, .cca-submit input[type=file] { width: 100%; }
.cca-submit input[type=file] { padding: 12px; border: 1px dashed #555; }
.cca-radio-row label { display: inline-block; margin-right: 20px; text-transform: none; letter-spacing: 0; font-family: var(--cca-body); font-size: 15px; color: #ddd; }
.cca-label { display: block; font-family: var(--cca-head); letter-spacing: .12em; text-transform: uppercase; font-size: 13px; color: var(--cca-muted); margin-bottom: 6px; }
.cca-muted { color: var(--cca-muted); font-size: 14px; }
.cca-muted a { text-decoration: underline; }
@media (max-width: 700px) { .cca-form-grid { grid-template-columns: 1fr; } }

/* ===== Articles & News ===== */
.cca-page-header--list { padding-bottom: 0; }
.cca-page-header--list p { max-width: 640px; margin: 14px auto 0; }
.cca-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 28px 0 0; }
.cca-pills a { font-family: var(--cca-head); font-size: 13px; letter-spacing: .2em; text-transform: uppercase; padding: 7px 16px; border: 1px solid #333; color: var(--cca-muted); }
.cca-pills a:hover, .cca-pills a:focus { border-color: #888; color: #fff; }
.cca-pills a.is-active { background: #fff; border-color: #fff; color: #000; }
.cca-section--articles { padding-top: 46px; }
.cca-agrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px 36px; }
.cca-acard { display: flex; flex-direction: column; }
.cca-acard__media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: #111; }
.cca-acard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.cca-acard:hover .cca-acard__media img { transform: scale(1.03); }
.cca-card__noimg { display: block; width: 100%; height: 100%; background: linear-gradient(135deg, #151515, #050505); }
.cca-acard__body { padding-top: 16px; }
.cca-acard__meta { margin: 0 0 8px; font-family: var(--cca-head); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--cca-muted); }
.cca-acard__cat { color: #fff; }
.cca-acard__sep { margin: 0 6px; }
.cca-acard__title { margin: 0 0 10px; font-size: 19px; font-weight: 400; letter-spacing: .1em; line-height: 1.3; }
.cca-acard__excerpt { margin: 0; color: var(--cca-muted); font-size: 15px; line-height: 1.55; }

.cca-longread__head { padding: 56px 0 0; }
.cca-longread__intro { max-width: 860px; margin: 0 auto; padding: 0 24px; text-align: center; }
.cca-longread__kicker { margin: 0 0 16px; font-family: var(--cca-head); font-size: 13px; letter-spacing: .3em; text-transform: uppercase; }
.cca-longread__kicker a { color: var(--cca-muted); border-bottom: 1px solid #444; padding-bottom: 2px; }
.cca-longread__title { margin: 0; font-size: clamp(30px, 5vw, 56px); letter-spacing: .12em; line-height: 1.12; }
.cca-longread__standfirst { margin: 22px auto 0; max-width: 720px; font-size: 20px; line-height: 1.55; color: #cfcfcf; }
.cca-longread__meta { margin: 22px 0 0; font-family: var(--cca-head); font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--cca-muted); display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.cca-longread__by { color: #fff; }
.cca-longread__hero { margin: 44px auto 0; max-width: 1400px; padding: 0 24px; }
.cca-longread__hero img { width: 100%; max-height: 78vh; object-fit: cover; }
.cca-longread__body { max-width: 740px; margin: 0 auto; padding: 50px 24px 20px; color: #e4e4e4; font-family: Georgia, 'Times New Roman', serif; font-size: 19px; line-height: 1.78; }
.cca-longread__body > * { margin: 0 0 1.25em; }
.cca-longread__body > p:first-child::first-letter { float: left; font-family: var(--cca-head); font-size: 4.1em; line-height: .86; margin: .06em .1em 0 0; color: #fff; }
.cca-longread__body h2, .cca-longread__body h3, .cca-longread__body h4 { color: #fff; margin: 1.9em 0 .7em; font-size: 22px; letter-spacing: .16em; }
.cca-longread__body h3 { font-size: 19px; }
.cca-longread__body a { color: #fff; text-decoration: underline; text-decoration-color: #666; text-underline-offset: 3px; }
.cca-longread__body a:hover { text-decoration-color: #fff; }
.cca-longread__body img { margin: 2em auto; width: auto; max-width: 100%; }
.cca-longread__body > img, .cca-longread__body > p > img:only-child { width: calc(100% + 120px); max-width: calc(100vw - 48px); margin-left: 50%; transform: translateX(-50%); }
.cca-longread__body figure { margin: 2em 0; }
.cca-longread__body figcaption, .cca-longread__body .wp-caption-text { font-family: var(--cca-body); font-size: 13px; color: var(--cca-muted); text-align: center; margin-top: 8px; }
.cca-longread__body blockquote { margin: 2em 0; padding: 0 0 0 24px; border-left: 3px solid #fff; font-size: 22px; font-style: italic; color: #fff; }
.cca-longread__body ul, .cca-longread__body ol { padding-left: 1.3em; }
.cca-longread__body li { margin-bottom: .4em; }
.cca-longread__body hr { border: 0; border-top: 1px solid var(--cca-line); margin: 2.5em 0; }
.cca-longread__body iframe, .cca-longread__body .wp-block-embed, .cca-longread__body video { width: 100%; max-width: 100%; aspect-ratio: 16 / 9; height: auto; margin: 2em 0; border: 0; }
.cca-longread__tags, .cca-longread__back { max-width: 740px; margin: 0 auto; padding: 0 24px; }
.cca-longread__tags a { display: inline-block; margin: 0 10px 8px 0; color: var(--cca-muted); font-size: 14px; }
.cca-longread__back .cca-back { margin-top: 20px; }
.cca-related { border-top: 1px solid var(--cca-line); margin-top: 60px; }
.cca-comments { padding-top: 0; }
@media (max-width: 1024px) { .cca-agrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .cca-longread__body > img, .cca-longread__body > p > img:only-child { width: 100%; max-width: 100%; margin-left: 0; transform: none; } }
@media (max-width: 600px) {
	.cca-agrid { grid-template-columns: 1fr; }
	.cca-longread__body { font-size: 17px; padding-top: 34px; }
	.cca-longread__standfirst { font-size: 17px; }
	.cca-longread__hero { padding: 0; }
}

/* ===== Importer (wp-admin) uses inline admin styles ===== */
