/*
 * Pages built from the old "Content Block" sections (page.php, template-parts/legacy/).
 * Ported from the old sanchurro theme's compiled main.min.css so these pages look as they do on the live site,
 * scoped to .legacy-content so none of it reaches the new header and footer. Owl Carousel is replaced by
 * scroll-snap tracks (legacy-content.js). Font "Brandon" → --font-sans, "Archer" → --font-serif.
 */

/* The old site used content-box sizing (only a few elements opted into border-box); keep that so old widths and paddings add up the same. */
.legacy-content :where(*, *::before, *::after) { box-sizing: content-box; }

.legacy-content { --legacy-grey: #707070; --legacy-orange: #f57e29; --legacy-orange-dark: #d46a33; background: var(--color-white); line-height: normal; }

/* Old .container (renamed: the new theme's .container is different) */
.legacy-content .legacy-container { box-sizing: border-box; position: relative; width: 100%; margin: 0 auto; padding: 1rem; }

/* Typography (old base styles; sizes scale from 321px to 1920px wide). :where() keeps the old element-level
   specificity, so <style> blocks and classes inside the content still win, as they did. */
:where(.legacy-content) :is(h1, h2, h3, h4, h5, h6, p, span, ul, li) { color: var(--legacy-grey); font-family: var(--font-sans); font-weight: normal; }
:where(.legacy-content) span { font-weight: inherit; }
:where(.legacy-content) a { font-family: var(--font-sans); color: var(--legacy-orange); text-decoration: none; transition: color linear 150ms; }
:where(.legacy-content) a:hover { color: var(--legacy-orange-dark); }
:where(.legacy-content) :is(h1, h2, h3, h4) { line-height: 1; margin-bottom: 0; }
:where(.legacy-content) h1 { margin-top: .67em; font-size: clamp(30px, 30px + 40 * (100vw - 321px) / 1599, 70px); font-weight: 700; }
:where(.legacy-content) h2 { margin: .5em 0; font-size: clamp(21px, 21px + 16 * (100vw - 321px) / 1599, 37px); font-weight: 700; letter-spacing: .08em; line-height: 1.25; }
:where(.legacy-content) h3 { margin-top: 1em; font-size: clamp(24px, 24px + 3 * (100vw - 321px) / 1599, 27px); font-weight: 700; letter-spacing: 2px; }
:where(.legacy-content) h4 { margin-top: 1.33em; font-size: clamp(20px, 20px + 5 * (100vw - 321px) / 1599, 25px); font-weight: 700; letter-spacing: 1px; }
:where(.legacy-content) h6 { margin: 1em 0; font-size: clamp(16px, 16px + 4 * (100vw - 321px) / 1599, 20px); line-height: 2; }
:where(.legacy-content) p { margin: 1em 0; font-size: clamp(16px, 16px + 2 * (100vw - 321px) / 1599, 18px); line-height: 1.75; }
:where(.legacy-content) ul { margin: 1em 0; padding: 0; list-style: none; }
:where(.legacy-content) :is(b, strong) { font-weight: 700; }
:where(.legacy-content) img { display: inline; } /* the new theme's block images would stack inline images (e.g. app store badges) */

/* Buttons in content: the [button] shortcode renders <a class="shortcode shortcode-btn [color]-btn"> (see inc/legacy.php) */
.legacy-content .shortcode-btn { position: relative; display: inline-block; margin: .5em 0; padding: .5em .75em; border-radius: 25px; background: #e68440; color: var(--color-white); font-family: var(--font-serif); font-size: 18px; font-weight: 700; letter-spacing: 2px; line-height: normal; text-transform: uppercase; transition: linear 150ms; }
.legacy-content .shortcode-btn:hover { background: #d36a57; color: var(--color-white); }
.legacy-content .shortcode-btn.red-btn { background: #ea3956; }
.legacy-content .shortcode-btn.red-btn:hover { background: var(--legacy-orange); }
.legacy-content .shortcode-btn.white-btn { background: var(--color-white); color: var(--legacy-orange); }
.legacy-content .shortcode-btn.white-btn:hover { background: var(--legacy-orange); color: var(--color-white); }
.legacy-content .shortcode-btn.orange-btn { background: var(--legacy-orange-dark); }
.legacy-content .shortcode-btn.orange-btn:hover { background: #d36a57; }
.legacy-content .shortcode-btn:focus-visible { outline: 2px solid var(--color-black); outline-offset: 2px; }
.legacy-content .underline { display: block; width: 150px; margin: .45em .1em; border: 0; border-bottom: 5px solid var(--legacy-orange); }
@media (min-width: 500px) {
	.legacy-content .shortcode-btn { padding: .5em 1.25em; }
}

/* Password-protected pages */
.legacy-content .legacy-password-form { height: 30vh; padding: 25%; background: orange; font-family: var(--font-sans); }

/* Masthead */
.legacy-content .masthead { position: relative; width: 100%; height: 500px; background-position: center; background-repeat: no-repeat; background-size: cover; color: var(--color-white); }
.legacy-content .masthead .legacy-container { display: flex; flex-direction: column; justify-content: center; height: 100%; max-width: 100%; padding-top: .5rem; text-align: center; }
.legacy-content .masthead .page-title { max-width: 100%; margin: 0; color: var(--color-white); letter-spacing: .25em; text-transform: uppercase; }

/* Column */
.legacy-content section.column { padding: 1em 0; }
.legacy-content section.column .legacy-container { display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; }
.legacy-content section.column .block { box-sizing: border-box; position: relative; width: 100%; padding: 1em .5em; }
.legacy-content section.column .block.image { text-align: center; }
.legacy-content section.column .block.image img { max-width: 250px; }
.legacy-content section.column .block.image img.round { border-radius: 50%; }
.legacy-content section.column .block.fixed { position: absolute; top: 7.5%; left: 45%; }
.legacy-content section.column .legacy-container.reversed { flex-direction: column-reverse; }
.legacy-content section.column .legacy-container.row { flex-flow: row nowrap; }

/* Accordion */
.legacy-content .accordion { max-width: 980px; margin: 1em auto; padding: 2em; }
.legacy-content .accordion .accHeader h4 { margin: 1em 0; color: var(--legacy-orange); }
.legacy-content .accordion .acc_tab { position: relative; width: 100%; padding: .25em 0 .5em; border-bottom: 1px solid var(--legacy-grey); text-align: left; transition: 300ms linear; }
.legacy-content .accordion .acc_tab::after { position: absolute; top: 50%; right: 0; display: inline-block; width: 1.25em; height: .75em; background: url("../img/legacy/icon-down.svg") top / contain no-repeat; content: ""; transition: all 100ms linear; pointer-events: none; }
.legacy-content .accordion .acc_tab h4 { max-width: 95%; line-height: 1.25; }
.legacy-content .accordion .acc-active, .legacy-content .accordion .acc_tab:hover { border-bottom: 2px solid var(--legacy-orange); }
.legacy-content .accordion .acc-active::after { transform: rotate(-180deg); }
.legacy-content .accordion .acc_panel { padding-top: .25em; background-color: var(--color-white); }
/* The whole tab row toggles: the button's ::before stretches over it. */
.legacy-content .accordion .acc_toggle { padding: 0; border: 0; background: none; color: inherit; cursor: pointer; font: inherit; letter-spacing: inherit; text-align: left; }
.legacy-content .accordion .acc_toggle::before { position: absolute; inset: 0; content: ""; }
.legacy-content .accordion .acc_toggle:focus-visible { outline: 2px solid var(--legacy-orange); outline-offset: 4px; }
/* Collapsed only once the script runs, so the answers stay readable without JS. */
.js .legacy-content .accordion .acc_panel { max-height: 0; overflow: hidden; transition: max-height .2s ease-out; }

/* Carousels: scroll-snap tracks with dots (legacy-content.js adds the dots and auto-advance) */
.legacy-content [data-legacy-carousel-track] { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
.legacy-content [data-legacy-carousel-track]::-webkit-scrollbar { display: none; }
.legacy-content .legacy-carousel-dots { display: flex; justify-content: center; gap: .3em; }
.legacy-content .legacy-carousel-dot { width: 1em; height: 1em; padding: 0; border: 0; border-radius: 50%; background: rgb(245 126 41 / .5); cursor: pointer; }
.legacy-content .legacy-carousel-dot[aria-current="true"] { background: var(--legacy-orange); }
.legacy-content .legacy-carousel-dot:focus-visible { outline: 2px solid var(--color-black); outline-offset: 2px; }

/* "carousel": image tiles 1 / 2 / 3 across, 5:4 */
.legacy-content section.wide-carousel { position: relative; }
.legacy-content section.wide-carousel .multi-carousel { display: grid; grid-auto-columns: 100%; grid-auto-flow: column; }
.legacy-content section.wide-carousel .image { position: relative; padding-bottom: 80%; background: #f0e4d4; scroll-snap-align: start; }
.legacy-content section.wide-carousel .image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.legacy-content section.wide-carousel .legacy-carousel-dots { position: absolute; bottom: 5%; left: 50%; transform: translateX(-50%); }

/* "featured_carousel": half-image, half-colour circles */
.legacy-content section.circle-carousel .legacy-container { padding: 2em 0 0; }
.legacy-content section.circle-carousel .cat-carousel { display: flex; gap: 20px; padding-inline: 20px; scroll-padding-inline: 20px; }
.legacy-content section.circle-carousel .cat-attr { flex: 0 0 auto; width: 325px; height: 325px; scroll-snap-align: start; }
.legacy-content section.circle-carousel .cat-item { position: relative; display: flex; width: 325px; height: 325px; margin: .5em auto; border-radius: 50%; }
.legacy-content section.circle-carousel .cat-item_image { position: absolute; left: 0; width: 50%; height: 100%; border-radius: 250px 0 0 250px; background-size: cover; }
.legacy-content section.circle-carousel .cat-item_header { position: absolute; right: 0; display: flex; flex-direction: column; justify-content: center; width: 50%; height: 100%; padding-left: 4%; border-radius: 0 250px 250px 0; }
.legacy-content section.circle-carousel .cat-item_header :is(h3, .subheader) { margin: 0 0 .5em; color: var(--color-white); line-height: 1; }
.legacy-content section.circle-carousel .cat-item_header h3 { font-size: 1.55em; font-weight: 700; }
.legacy-content section.circle-carousel .cat-item_header hr { width: 100px; margin: .5em 0 0; border: 2px solid var(--color-white); }
.legacy-content section.circle-carousel .legacy-carousel-dots { padding-bottom: 1.5em; }

@media (min-width: 500px) {
	.legacy-content section.circle-carousel .cat-attr { width: 400px; height: 400px; }
	.legacy-content section.circle-carousel .cat-item { width: 385px; height: 385px; }
}

@media (min-width: 768px) {
	.legacy-content section.wide-carousel .multi-carousel { grid-auto-columns: 50%; }
}

@media (min-width: 769px) {
	.legacy-content .masthead .page-title { letter-spacing: .05em; }
	.legacy-content .masthead .legacy-container { align-items: flex-start; max-width: 950px; text-align: left; }
	.legacy-content section.column .block { padding: 1em; }
	.legacy-content section.column .block:first-child { padding-left: 0; }
	.legacy-content section.column .block:last-child { padding-right: 0; }
	.legacy-content section.column .block.image img { max-width: 300px; }
	.legacy-content section.column .block.fixed { position: relative; left: 0; }
	.legacy-content section.column .legacy-container { flex-direction: row; justify-content: space-around; align-items: center; }
	.legacy-content section.column .legacy-container.reversed { flex-direction: row; }
	.legacy-content section.column .legacy-container.top { align-items: flex-start; }
	.legacy-content section.column .legacy-container.bottom { align-items: flex-end; }
	.legacy-content .accordion { margin: 3em auto; }
	.legacy-content .accordion .acc_tab { padding: 1em 0; }
	.legacy-content section.circle-carousel .legacy-container { padding: 2em 0; }
	.legacy-content section.circle-carousel .legacy-carousel-dots { display: none; }
}

@media (min-width: 900px) {
	.legacy-content section.circle-carousel .cat-carousel { gap: 50px; padding-inline: 230px; scroll-padding-inline: 230px; }
}

@media (min-width: 1024px) {
	.legacy-content section.circle-carousel .cat-item { width: 400px; height: 400px; }
}

@media (min-width: 1200px) {
	.legacy-content section.wide-carousel .multi-carousel { grid-auto-columns: calc(100% / 3); }
}

/*
 * Store Locator plugin pages: page-store-locator.php, page-find-store.php, single-stores.php.
 * From the old main.min.css plus the old templates' inline styles. The plugin's own markup uses .container,
 * which keeps the old theme's meaning here.
 */
.legacy-content .container { position: relative; width: 100%; max-width: none; margin: 0 auto; padding: 1rem; box-sizing: border-box; }
/* The plugin also uses a "button" class, which the 2026 theme styles as its orange pill. Undo that at the lowest
   specificity, so the plugin's and the old theme's rules apply as they did. */
:where(.legacy-content) .button { display: inline; align-items: normal; justify-content: normal; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; text-align: inherit; transition: none; }
.legacy-content .row-width { max-width: 920px; }
/* The old global button style, which the plugin's buttons picked up. */
.legacy-content :is(.legacy-store-locator, .find-store, .store) button { position: relative; margin: .5em 0; padding: .5em .75em; border: 0; border-radius: 25px; outline: 0; background: #e68440; color: var(--color-white); cursor: pointer; font-family: var(--font-serif); font-size: 18px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; transition: linear 150ms; }
.legacy-content :is(.legacy-store-locator, .find-store, .store) button:hover { background: #d36a57; }
.legacy-content :is(.legacy-store-locator, .find-store, .store) button:focus-visible, .legacy-content #store_locator_get_my_position:focus-visible { outline: 2px solid var(--color-black); outline-offset: 2px; }

/* Find a Store */
.legacy-content section.find-store { position: relative; height: 100vh; background-color: rgb(245 126 41 / .5); background-position: center; background-size: cover; }
.legacy-content section.find-store .legacy-container { display: flex; flex-direction: column; justify-content: center; height: 100%; max-width: 100%; }
.legacy-content section.find-store .page-title { margin: 0 auto; padding: 2em 0 .5rem; color: var(--legacy-orange); font-size: clamp(24px, 24px + 3 * (100vw - 321px) / 1599, 27px); letter-spacing: 2px; line-height: 1; text-align: center; }
.legacy-content form#store_locator_embedded_search { width: 100%; }
.legacy-content form#store_locator_embedded_search #store_locator_get_my_position { position: relative; display: block; width: 100%; max-width: 260px; margin: .5em; padding: .65em 1.25em; border: 0; border-radius: 25px; outline: 0; background: #e68440; color: var(--color-white); cursor: pointer; font-family: var(--font-serif); font-size: .9em; font-weight: 700; letter-spacing: 1px; text-align: center; text-transform: uppercase; transition: linear 150ms; }
.legacy-content form#store_locator_embedded_search #store_locator_get_my_position:hover { background: #d36a57; }
.legacy-content form#store_locator_embedded_search #store_locator_get_my_position i { font-style: normal; }
.legacy-content form#store_locator_embedded_search #store_locator_address_field { width: 100%; max-width: 250px; margin: .5em; padding: .65em 2em .65em .75em; border: 0; border-radius: 25px; outline: 0; font-family: var(--font-serif); font-size: .9em; font-weight: 700; letter-spacing: 1px; text-align: center; text-overflow: ellipsis !important; white-space: nowrap !important; }
.legacy-content form#store_locator_embedded_search #store_locator_search_box { padding: 0; }
.legacy-content form#store_locator_embedded_search .store-locator-row { width: 100%; max-width: 320px; margin: 0 auto; }
.legacy-content form#store_locator_embedded_search .store-locator-row .store-locator-col-xs-12 { padding: 0; }
.legacy-content #store_locator_find_stores_button { position: absolute; top: 2%; right: 5%; display: block; width: auto; height: 37px; padding: 1.185em; background-image: url("../img/legacy/icon-glass.png"); background-position: center; background-repeat: no-repeat; background-size: 18px; }
.legacy-content .find-store #store_locator_find_stores_button { top: -1.75%; right: 7%; height: 32px; padding: 1.05em; box-sizing: border-box; } /* the old page's inline style */

/* Store Locator */
.legacy-content #store_locator { overflow-x: hidden; padding: 0; }
.legacy-content #store_locator #store_locator_sidebar_content { padding: 0 0 0 1em; }
.legacy-content #store_locator .store_locator_address_field { max-width: 300px; padding: 10px 50px 10px 11px !important; border-radius: 25px; outline: 0; font-family: var(--font-sans); font-size: .9em; }
.legacy-content #store_locator #store_locator_get_my_position { display: none; }
.legacy-content #store_locator #store_locator_search_box { height: 200px; padding-top: 100px; background-image: url("/wp-content/uploads/2019/10/map.jpg"); }
.legacy-content #store_locator #store_locator_search_box:nth-child(3) { display: none; }
.legacy-content #store_locator .store-locator-row:nth-child(2) { max-width: 350px; margin: 0 auto; }
.legacy-content #store_locator #store_locator_find_stores_button { margin: 0; right: 7.5%; }
.legacy-content #store_locator .sidebar-header { display: none; text-align: center; }
.legacy-content #store_locator .sidebar-header p { margin-bottom: 1em; }
.legacy-content #store_locator h3.store_locator_name { padding: 0; color: var(--legacy-orange); font-size: 1.25em; letter-spacing: 1px; }
.legacy-content #store_locator h3.store_locator_name i.fa-chevron-right { display: none; }
.legacy-content #store_locator #store_locator_map { height: 42vh !important; }
.legacy-content #store_locator #store_locator_result_list_box { padding-right: 0; padding-left: 0; }
.legacy-content #store_locator #store_locator_result_list { position: relative; height: auto !important; }
.legacy-content #store_locator #store_locator_result_list :is(.store_locator_result_list_item, .store_locator_street, .store_locator_city, .store_locator_zip) { font-size: 1em; letter-spacing: 1px; line-height: 1.4; }
.legacy-content #store_locator #store_locator_result_list :is(.store_locator_result_list_item, .store_locator_street, .store_locator_city, .store_locator_zip):hover { color: var(--legacy-orange); }
.legacy-content #store_locator .store_locator_result_list_item { padding: 1.5em; }
.legacy-content #store_locator .store_locator_contact { line-height: 1; }
.legacy-content #store_locator .store_locator_tel a { font-size: .9em; letter-spacing: 1px; }
.legacy-content #store_locator .store_locator_tel a:hover { color: var(--legacy-orange); }
.legacy-content #store_locator .store_modal_title { display: none; }
.legacy-content #store_locator .store_locator_icon { margin-top: 0; }
.legacy-content #store_locator .fa-map-marker { float: none; }
.legacy-content #store_locator .store_locator_actions { display: inline-flex; flex-direction: column-reverse; width: 90%; }
.legacy-content #store_locator .store_locator_get_direction { position: relative; max-width: 300px; margin: 1em 0 .5em; padding: .3em 1.75em; border: 0; border-radius: 25px; outline: 0; background: #e68440; color: var(--color-white); cursor: pointer; font-family: var(--font-serif); font-size: .8em; font-weight: 700; letter-spacing: 1px; text-align: center; text-transform: uppercase; transition: linear 150ms; }
.legacy-content #store_locator .store_locator_get_direction i.fa-compass { display: none; }
.legacy-content #store_locator .store_locator_distance { font-weight: 700; }
.legacy-content #store_locator .grey { border: 1px solid var(--legacy-orange); }
.legacy-content #store_locator .store_locator_visit_store { color: var(--legacy-grey); font-size: .9em; font-weight: 700; }
.legacy-content #store_locator .store_locator_visit_store::after { display: block; width: 85px; border-bottom: 2px solid var(--legacy-orange); content: ""; }
.legacy-content #store_locator .store_locator_visit_store:hover { color: var(--legacy-orange); }
.legacy-content #store_locator .store_locator_visit_store i.fa-long-arrow-right { display: none; }

/* Single store */
.legacy-content .single-store-masthead { height: 400px; }
.legacy-content .store .store-header { max-width: 900px; margin: 0 auto; padding: 2em .5em 0; }
.legacy-content .store .store-header .store-title { margin: 0; color: var(--legacy-orange); }
.legacy-content .store-wrapper { padding-bottom: 80px; }
.legacy-content .store-cta { position: absolute; bottom: 0; left: 0; width: 100%; padding: 1.5em 0 2em; text-align: center; }
.legacy-content .store-cta button.cta-button { margin: 0 .25em; font-size: .8em; }
.legacy-content .store-content { display: flex; flex-direction: column; }
.legacy-content .store-content.container { padding: 0; }
.legacy-content .store-map.container { padding: 0 .5em; }
.legacy-content .half-column { display: flex; flex-direction: column; padding: 1em 0; }
.legacy-content .half-column.column-left { min-width: 320px; padding-right: 0; }
.legacy-content .store-opening-hours { display: flex; max-width: 500px; }
.legacy-content .store-opening-hours p { margin: 0; line-height: 1.25; }
.legacy-content .store-opening-hours .store-day { flex-basis: 77%; }
.legacy-content .store-opening-hours .store-day p { display: inline; }
.legacy-content .store-opening-hours .store-day .store-date { float: right; padding-right: 5px; }
.legacy-content .store-opening-hours .store-hour { flex-basis: 55%; text-align: left; }
.legacy-content .store_locator_single_map { height: 300px; margin-top: 0; }
.legacy-content :is(.store_locator_single_address, .store_locator_single_contact, .store_locator_single_opening_hours) { width: 100%; padding: 0 .5em; }
.legacy-content :is(.store_locator_single_address, .store_locator_single_contact, .store_locator_single_opening_hours) p { margin: 0; }

@media (min-width: 321px) {
	.legacy-content .store-cta button.cta-button { font-size: .9em; }
}

@media (min-width: 500px) {
	.legacy-content :is(.legacy-store-locator, .find-store, .store) button { padding: .5em 1.25em; }
}

@media (min-width: 768px) {
	.legacy-content #store_locator #store_locator_search_box { height: auto; padding-top: 10px; background: none; }
	.legacy-content #store_locator #store_locator_find_stores_button { right: 10%; }
}

@media (min-width: 769px) {
	.legacy-content form#store_locator_embedded_search #store_locator_get_my_position { margin: .5em 0; }
	.legacy-content form#store_locator_embedded_search #store_locator_address_field { margin: .5em 0 1em; }
	.legacy-content #store_locator_find_stores_button { top: 2%; right: 7.5%; padding: 1.165em; }
	.legacy-content #store_locator .sidebar-header { display: block; }
	.legacy-content #store_locator #store_locator_map { height: 92vh !important; }
	.legacy-content #store_locator #store_locator_result_list_box { height: 50vh; padding-right: 15px; padding-left: 15px; }
	.legacy-content #store_locator #store_locator_result_list { height: 100vh !important; }
	.legacy-content .store .store-header { padding: 2em 1em 0; }
	.legacy-content .store-cta { padding: 2em 0; }
	.legacy-content .store-cta button.cta-button { margin: 0 1em; font-size: 1em; }
	.legacy-content .store-content { flex-direction: row-reverse; }
	.legacy-content .store-content.container { padding: 0 1em 2.5em; }
	.legacy-content .half-column.column-left { min-width: 400px; padding-right: 2em; }
	.legacy-content .store-opening-hours .store-hour { flex-basis: 50%; }
	.legacy-content .store_locator_single_map { height: 500px; }
}

@media (prefers-reduced-motion: reduce) {
	.legacy-content [data-legacy-carousel-track] { scroll-behavior: auto; }
}
