/*
Theme Name:   MrSoldNow (Astra Child)
Theme URI:    https://mrsoldnow.com
Description:  Astra child theme implementing the approved MrSoldNow marketplace design.
Author:       MrSoldNow
Template:     astra
Version:      1.0.0
Text Domain:  mrsoldnow
*/

:root {
	--msn-navy: #0b3a78;
	--msn-navy-dark: #082c5c;
	--msn-footer: #0b2a55;
	--msn-blue: #1666d8;
	--msn-blue-light: #e8f1fd;
	--msn-red: #e5252a;
	--msn-text: #10213a;
	--msn-muted: #5a6b82;
	--msn-border: #e1e8f0;
	--msn-head-font: "Inter", system-ui, sans-serif;
	--msn-logo-font: "Poppins", "Inter", sans-serif;
}

/* Base ----------------------------------------------------------------- */
body.msn-site { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--msn-text); background: #fff; font-size: 16px; }
body.msn-site h1, body.msn-site h2, body.msn-site h3, body.msn-site h4,
body.msn-site .entry-title { font-family: var(--msn-head-font); color: var(--msn-text); font-weight: 700; letter-spacing: -.01em; }
body.msn-site a { color: var(--msn-blue); }
.msn-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); }

/* Astra wrappers: let our sections go full width, keep inner pages tidy */
.msn-site .site-content > .ast-container { max-width: none; padding: 0; display: block; }
.msn-site:not(.home) .site-content > .ast-container > #primary,
.msn-site:not(.home) .site-content > .ast-container > .content-area { max-width: 1200px; margin: 32px auto 48px; padding: 0 20px; box-sizing: border-box; width: 100%; float: none; }
.msn-site.home .site-content > .ast-container > #primary { margin: 0; padding: 0; }
.msn-site .ast-plain-container .site-main > article, .msn-site .ast-separate-container .ast-article-single { padding: 0; background: transparent; }
.msn-site.page .entry-title { font-size: 34px; margin-bottom: 18px; }
.msn-site.post-type-archive-msn_listing #primary, .msn-site.tax-msn_category #primary, .msn-site.single-msn_listing #primary { display: none; }

/* Header ---------------------------------------------------------------- */
.msn-header { background: #fff; position: relative; z-index: 50; box-shadow: 0 1px 0 rgba(0,0,0,.04); }
.msn-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 66px; padding-top: 6px; padding-bottom: 6px; }
.msn-logo { display: inline-flex; align-items: center; gap: 8px; text-decoration: none !important; color: var(--msn-navy); flex: none; }
.msn-logo-cart { width: 62px; height: 52px; color: var(--msn-navy); }
.msn-logo-text { display: flex; flex-direction: column; line-height: 1; }
.msn-logo-name { font-family: var(--msn-logo-font); font-weight: 800; font-style: italic; font-size: 33px; letter-spacing: -.02em; }
.msn-logo-mr { color: var(--msn-navy); }
.msn-logo-sold { color: var(--msn-red); }
.msn-logo-tag { font-family: var(--msn-logo-font); font-style: italic; font-weight: 700; font-size: 15px; color: var(--msn-navy); margin: 3px 0 0 22px; letter-spacing: .01em; }
.custom-logo-link img { max-height: 60px; width: auto; }

.msn-top-actions { display: flex; align-items: center; gap: 22px; }
.msn-top-link { position: relative; display: inline-flex; align-items: center; gap: 7px; color: var(--msn-text) !important; text-decoration: none !important; font-weight: 500; font-size: 15px; background: none; border: 0; padding: 4px; cursor: pointer; }
.msn-top-link:hover { color: var(--msn-blue) !important; }
.msn-top-link svg { width: 24px; height: 24px; }
.msn-badge { position: absolute; top: -4px; left: 16px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--msn-red); color: #fff; font-size: 11px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.msn-top-actions .msn-btn { padding: 8px 18px; font-size: 15px; }
.msn-top-actions .msn-btn-outline { border-width: 1.5px; }
.msn-post-btn svg { width: 16px; height: 16px; }
.msn-burger { display: none; background: none; border: 0; padding: 6px; color: var(--msn-navy); cursor: pointer; }
.msn-burger svg { width: 28px; height: 28px; }

.msn-bell { position: relative; }
.msn-bell-panel { position: absolute; right: -60px; top: calc(100% + 10px); width: 320px; background: #fff; border: 1px solid var(--msn-border); border-radius: 12px; box-shadow: 0 12px 34px rgba(16,33,58,.18); overflow: hidden; z-index: 100; }
.msn-bell-head { margin: 0; padding: 12px 16px; font-weight: 700; border-bottom: 1px solid var(--msn-border); }
.msn-bell-panel ul { list-style: none; margin: 0; padding: 0; max-height: 320px; overflow-y: auto; }
.msn-bell-panel li a { display: block; padding: 10px 16px; font-size: 14px; color: var(--msn-text); text-decoration: none; border-bottom: 1px solid #f1f4f8; }
.msn-bell-panel li.is-unread a { background: var(--msn-blue-light); }
.msn-bell-panel li small { display: block; color: var(--msn-muted); font-size: 12px; margin-top: 2px; }
.msn-bell-empty { padding: 18px 16px; margin: 0; color: var(--msn-muted); font-size: 14px; }
.msn-bell-all { display: block; text-align: center; padding: 10px; font-weight: 600; font-size: 14px; }

/* Blue navigation bar */
.msn-nav { background: var(--msn-navy); }
.msn-nav .msn-container { display: flex; align-items: center; }
.msn-menu { display: flex; align-items: center; justify-content: space-between; width: 100%; list-style: none; margin: 0; padding: 0; }
.msn-menu > li { position: relative; }
.msn-menu > li > a { display: flex; align-items: center; gap: 6px; padding: 8px 12px; margin: 5px 0; color: #fff !important; font-weight: 600; font-size: 14.5px; text-decoration: none !important; border-radius: 6px; white-space: nowrap; transition: background .15s; }
.msn-menu > li > a:hover { background: rgba(255,255,255,.12); }
.msn-menu > li.current-menu-item > a, .msn-menu > li.current_page_item > a { background: var(--msn-blue); }
.msn-menu > li.menu-item-home > a::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l9 8h-3v9h-5v-6h-2v6H6v-9H3z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3l9 8h-3v9h-5v-6h-2v6H6v-9H3z'/%3E%3C/svg%3E") center/contain no-repeat; }
.msn-menu > li.menu-item-has-children > a::after { content: ""; width: 10px; height: 10px; margin-left: 2px; border: solid currentColor; border-width: 0 2px 2px 0; transform: rotate(45deg) translateY(-3px); }
.msn-menu .sub-menu { position: absolute; top: 100%; left: 0; min-width: 220px; list-style: none; margin: 0; padding: 8px 0; background: #fff; border-radius: 10px; box-shadow: 0 14px 34px rgba(16,33,58,.2); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .15s, transform .15s, visibility .15s; z-index: 60; }
.msn-menu > li:last-child .sub-menu { left: auto; right: 0; }
.msn-menu li:hover > .sub-menu, .msn-menu li:focus-within > .sub-menu, .msn-menu li.is-open > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.msn-menu .sub-menu a { display: block; padding: 9px 18px; color: var(--msn-text) !important; font-size: 14.5px; text-decoration: none !important; }
.msn-menu .sub-menu a:hover { background: var(--msn-blue-light); color: var(--msn-blue) !important; }
.msn-nav-mobile-extra { display: none; }

/* Hero ------------------------------------------------------------------ */
.msn-hero { position: relative; overflow: hidden; background:
		linear-gradient(90deg, #e9f3fd 0%, #e9f3fd 34%, rgba(233,243,253,.85) 44%, rgba(233,243,253,0) 60%),
		linear-gradient(180deg, rgba(255,255,255,0) 38%, rgba(205,226,248,.9) 56%, #d8e9fa 100%),
		var(--msn-hero-img) right top / 62% auto no-repeat,
		linear-gradient(180deg, #cfe5fb 0%, #e3effc 60%, #cfe2f7 100%); }
.msn-hero-inner { position: relative; padding-top: 40px; padding-bottom: 22px; }
.msn-hero-title { font-family: var(--msn-head-font) !important; font-size: 42px; letter-spacing: -.02em; line-height: 1.1; font-weight: 800 !important; color: var(--msn-text) !important; margin: 0 0 14px; max-width: 640px; }
.msn-accent-red .msn-hero-title .msn-accent { color: var(--msn-red); }
.msn-hero-text { font-size: 18.5px; line-height: 1.4; color: #1c2c44; max-width: 470px; margin: 0 0 22px; }

.msn-search { display: flex; align-items: center; max-width: 770px; background: #fff; border-radius: 10px; padding: 5px; box-shadow: 0 6px 22px rgba(11,58,120,.18); }
.msn-search-field { flex: 1; display: flex; align-items: center; gap: 10px; padding: 0 12px; margin: 0; }
.msn-search-field svg { width: 22px; height: 22px; color: var(--msn-text); flex: none; }
.msn-search input[type=search] { border: 0 !important; box-shadow: none !important; outline: none; width: 100%; padding: 10px 0 !important; font-size: 15px; background: transparent; color: var(--msn-text); }
.msn-search-cat { border-left: 1px solid var(--msn-border); padding: 0 6px; margin: 0; }
.msn-search-cat select { border: 0 !important; background: transparent; font-size: 15px; padding: 8px 6px; color: var(--msn-text); cursor: pointer; box-shadow: none !important; min-width: 150px; }
.msn-search-btn { display: inline-flex; align-items: center; gap: 8px; background: var(--msn-blue); color: #fff; border: 0; border-radius: 8px; padding: 11px 26px; font-size: 17px; font-weight: 700; cursor: pointer; transition: background .15s; }
.msn-search-btn:hover { background: #0f55b9; }
.msn-search-btn svg { width: 20px; height: 20px; }
.msn-accent-red .msn-search-btn { background: var(--msn-red); }
.msn-accent-red .msn-search-btn:hover { background: #c71a1f; }

.msn-trust { display: flex; justify-content: center; flex-wrap: wrap; gap: 50px; list-style: none; margin: 26px 0 0; padding: 0; max-width: 840px; }
.msn-trust li { display: inline-flex; align-items: center; gap: 10px; background: rgba(255,255,255,.75); backdrop-filter: blur(4px); padding: 7px 18px 7px 12px; border-radius: 30px; font-weight: 600; font-size: 15px; color: var(--msn-text); box-shadow: 0 2px 8px rgba(11,58,120,.08); }
.msn-trust svg { width: 26px; height: 26px; }

/* Sections -------------------------------------------------------------- */
.msn-section { padding: 26px 0 8px; }
.msn-section-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.msn-section-head h2 { font-size: 30px !important; margin: 0 !important; font-weight: 700; }
.msn-view-all { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 15.5px; color: var(--msn-blue) !important; text-decoration: none !important; white-space: nowrap; }
.msn-view-all svg { width: 20px; height: 20px; }
.msn-view-all:hover svg { transform: translateX(3px); }

.msn-how { display: flex; align-items: center; gap: 24px; background: linear-gradient(90deg, #e9f2fd 0%, #f1f7fe 100%); border: 1px solid #d9e7f8; border-radius: 16px; padding: 22px 28px; }
.msn-how-intro { flex: 0 0 270px; border-right: 1px solid #c9daf0; padding-right: 22px; }
.msn-how-intro h2 { font-size: 32px !important; margin: 0 0 12px !important; }
.msn-how-intro p { margin: 0; font-size: 16px; line-height: 1.45; color: #23344d; }
.msn-how-steps { flex: 1; display: flex; align-items: flex-start; justify-content: space-around; gap: 8px; }
.msn-how-step { flex: 1; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; max-width: 220px; text-decoration: none !important; color: #23344d !important; font-size: 14.5px; line-height: 1.35; }
.msn-how-step strong { font-family: var(--msn-head-font); font-size: 17px; color: var(--msn-navy); }
.msn-how-icon { width: 58px; height: 58px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #3a8cf0, var(--msn-blue)); display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 16px rgba(22,102,216,.3); margin-bottom: 4px; transition: transform .15s; }
.msn-how-step:hover .msn-how-icon { transform: scale(1.06); }
.msn-how-icon svg { width: 30px; height: 30px; }
.msn-how-arrow { color: var(--msn-navy); margin-top: 38px; }
.msn-how-arrow svg { width: 24px; height: 24px; }

.msn-section-cta { padding: 28px 0 22px; }
.msn-cta { display: flex; align-items: center; gap: 26px; background: linear-gradient(90deg, #0b3a78 0%, #134a96 100%); border-radius: 14px; padding: 16px 30px 16px 40px; color: #fff; box-shadow: 0 10px 26px rgba(11,58,120,.25); }
.msn-cta-icon svg { width: 58px; height: 58px; display: block; }
.msn-cta-text { flex: 1; display: flex; flex-direction: column; padding-right: 26px; border-right: 1px solid rgba(255,255,255,.35); }
.msn-cta-text strong { font-family: var(--msn-head-font); font-size: 24px; font-weight: 700; }
.msn-cta-text span { font-size: 17px; opacity: .95; }
.msn-cta-btn { padding: 12px 34px !important; font-size: 19px !important; flex: none; }
.msn-cta-btn svg { width: 20px; height: 20px; }

/* Footer ---------------------------------------------------------------- */
.msn-footer { background: var(--msn-footer); color: #dfe8f5; padding: 24px 0 0; margin-top: 0; }
.msn-footer-grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr; gap: 26px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.14); }
.msn-footer .msn-logo { color: #fff; }
.msn-footer .msn-logo-cart, .msn-footer .msn-logo-mr, .msn-footer .msn-logo-tag { color: #fff; }
.msn-footer .msn-logo-sold { color: #fff; }
.msn-footer .msn-logo-name { font-size: 28px; }
.msn-footer .msn-logo-cart { width: 52px; height: 44px; }
.msn-footer-brand p { margin: 10px 0 0; font-size: 14.5px; line-height: 1.45; color: #e7eef8; max-width: 260px; }
.msn-footer h4 { color: #fff !important; font-size: 15.5px; margin: 0 0 8px; font-family: "Inter", sans-serif !important; font-weight: 700; }
.msn-footer ul { list-style: none; margin: 0; padding: 0; }
.msn-footer li { margin: 0 0 3px; }
.msn-footer-col a { color: #dfe8f5 !important; text-decoration: none; font-size: 14px; }
.msn-footer-col a:hover { color: #fff !important; text-decoration: underline; }
.msn-footer-social { border-left: 1px solid rgba(255,255,255,.14); padding-left: 30px; }
.msn-social { display: flex; gap: 12px; }
.msn-social svg { width: 30px; height: 30px; display: block; transition: transform .15s; }
.msn-social a:hover svg { transform: scale(1.1); }
.msn-footer-bottom { text-align: center; font-size: 13.5px; padding: 12px 20px 14px; color: #dfe8f5; }

/* Archive & single ------------------------------------------------------ */
.msn-archive { padding-top: 28px; padding-bottom: 48px; }
.msn-archive-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 16px; }
.msn-archive-head h1 { margin: 0; font-size: 32px; }
.msn-archive-head p { margin: 4px 0 0; }
.msn-filters { display: flex; flex-wrap: wrap; gap: 10px; background: #f4f8fd; border: 1px solid var(--msn-border); border-radius: 12px; padding: 12px; margin-bottom: 22px; }
.msn-filters label { margin: 0; flex: 1 1 140px; }
.msn-filters .msn-f-search { flex: 2 1 220px; }
.msn-filters .msn-f-price { flex: 0 1 110px; }
.msn-filters input, .msn-filters select { width: 100%; padding: 10px 12px; border: 1px solid #cdd7e3; border-radius: 8px; background: #fff; font-size: 14.5px; }
.msn-pagination { margin-top: 26px; display: flex; justify-content: center; gap: 6px; }
.msn-pagination .page-numbers { display: inline-flex; min-width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 8px; border: 1px solid var(--msn-border); text-decoration: none; color: var(--msn-text); padding: 0 10px; }
.msn-pagination .current { background: var(--msn-blue); color: #fff; border-color: var(--msn-blue); }
.msn-breadcrumb { padding: 18px 0 12px; font-size: 14px; color: var(--msn-muted); }
.msn-breadcrumb a { color: var(--msn-muted); text-decoration: none; }
.msn-single-side h3 { font-size: 18px; margin: 0 0 10px; }
.msn-safety p { margin: 6px 0 0; }

/* WordPress core block details (FAQ) */
.msn-site .wp-block-details { border: 1px solid var(--msn-border); border-radius: 10px; padding: 14px 18px; margin-bottom: 10px; background: #fff; }
.msn-site .wp-block-details summary { font-weight: 700; cursor: pointer; }

/* Responsive ------------------------------------------------------------ */
@media (max-width: 1100px) {
	.msn-top-actions { gap: 14px; }
	.msn-menu > li > a { padding: 8px 8px; font-size: 13.5px; }
}

@media (max-width: 900px) {	.msn-how { flex-direction: column; align-items: stretch; }
	.msn-how-intro { flex: none; border-right: 0; padding-right: 0; border-bottom: 1px solid #c9daf0; padding-bottom: 14px; }
	.msn-footer-grid { grid-template-columns: 1fr 1fr 1fr; }
	.msn-footer-brand { grid-column: 1 / -1; }
	.msn-footer-social { border-left: 0; padding-left: 0; }

	.msn-top-label, .msn-hide-sm { display: none !important; }
	.msn-burger { display: inline-flex; }
	.msn-nav { display: none; }
	.msn-nav.is-open { display: block; }
	.msn-menu { flex-direction: column; align-items: stretch; padding: 8px 0; }
	.msn-menu > li > a { margin: 2px 0; padding: 11px 12px; font-size: 15.5px; }
	.msn-menu .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: rgba(255,255,255,.07); display: none; border-radius: 8px; margin: 0 0 6px 12px; }
	.msn-menu li.is-open > .sub-menu { display: block; }
	.msn-menu .sub-menu a { color: #fff !important; }
	.msn-nav .msn-container { flex-direction: column; align-items: stretch; }
	.msn-nav-mobile-extra { display: flex; gap: 10px; padding: 6px 0 14px; border-top: 1px solid rgba(255,255,255,.15); }
	.msn-nav-mobile-extra a { flex: 1; text-align: center; padding: 10px; border: 1.5px solid rgba(255,255,255,.6); border-radius: 8px; color: #fff !important; text-decoration: none; font-weight: 600; margin-top: 10px; }
	.msn-hero { background:
		linear-gradient(180deg, rgba(233,243,253,.94) 0%, rgba(233,243,253,.88) 50%, rgba(216,233,250,.95) 100%),
		var(--msn-hero-img) center top / cover no-repeat; }
	.msn-hero-title { font-size: 34px; }
	.msn-trust { gap: 10px; }
	.msn-cta { flex-wrap: wrap; justify-content: center; text-align: center; padding: 22px; }
	.msn-cta-text { border-right: 0; padding-right: 0; flex-basis: 100%; }
	.msn-cta-icon { display: none; }
}

@media (max-width: 640px) {
	.msn-container { padding: 0 14px; }
	.msn-topbar { min-height: 58px; gap: 8px; }
	.msn-logo-cart { width: 40px; height: 34px; }
	.msn-logo-name { font-size: 22px; }
	.msn-logo-tag { font-size: 10.5px; margin-left: 12px; }
	.msn-top-actions { gap: 4px; }
	.msn-top-link svg { width: 22px; height: 22px; }
	.msn-post-btn { padding: 8px 10px !important; }
	.msn-post-btn span { display: none; }
	.msn-bell-panel { position: fixed; left: 10px; right: 10px; top: 64px; width: auto; }
	.msn-hero-inner { padding-top: 26px; }
	.msn-hero-title { font-size: 28px; }
	.msn-hero-text { font-size: 16px; }
	.msn-search { flex-wrap: wrap; padding: 6px; gap: 6px; }
	.msn-search-field { flex: 1 1 100%; border-bottom: 1px solid var(--msn-border); }
	.msn-search-cat { flex: 1; border-left: 0; }
	.msn-search-cat select { width: 100%; min-width: 0; }
	.msn-search-btn { padding: 10px 18px; }
	.msn-trust { flex-direction: column; align-items: flex-start; gap: 8px; }
	.msn-trust li { font-size: 14px; }
	.msn-section-head h2 { font-size: 22px !important; }
	.msn-view-all { font-size: 14px; }
	.msn-how { padding: 20px 16px; }
	.msn-how-intro h2 { font-size: 26px !important; }
	.msn-how-steps { flex-direction: column; align-items: center; gap: 18px; }
	.msn-how-arrow { margin: -6px 0; transform: rotate(90deg); }
	.msn-cta-text strong { font-size: 20px; }
	.msn-cta-btn { width: 100%; font-size: 17px !important; }
	.msn-footer-grid { grid-template-columns: 1fr 1fr; }
	.msn-archive-head { flex-direction: column; align-items: flex-start; }
	.msn-archive-head h1 { font-size: 26px; }
	.msn-filters .msn-f-price { flex: 1 1 40%; }
	.msn-site.page .entry-title { font-size: 26px; }
}