/* ==========================================================================
   Among Christians — "parchment & gold" look for the header and the home page search.
   Colors and sizes are at the top (custom properties) so they are easy to change.
   The logo image itself is not touched.
   ========================================================================== */
:root {
    --ac-gold-1: #f3dda4;
    --ac-gold-2: #d9b56a;
    --ac-gold-3: #b98b3e;
    --ac-gold-line: rgba(224, 188, 120, .38);
    --ac-cream: #fdf8ee;
    --ac-parchment: #eadfc4;
    --ac-blue-1: #93bdd2;
    --ac-blue-2: #6a9db5;
    --ac-serif: "Palatino Linotype", Palatino, "Book Antiqua", Georgia, "Noto Serif", "Times New Roman", serif;
}

/* ---------- Header ---------- */
/* Home page (header over the photo): dark glass */
body.home #header-container:not(.cloned):not(.sticky):not(.not-transparent) #header {
    background: linear-gradient(180deg, rgba(8, 12, 18, .72) 0%, rgba(8, 12, 18, .30) 100%) !important;
    border-bottom: 1px solid var(--ac-gold-line) !important;
}
/* All other pages: white fading into a very light blue (instead of grey) */
body:not(.home) #header-container:not(.cloned):not(.sticky):not(.not-transparent) #header {
    background: linear-gradient(180deg, rgba(255, 251, 242, .94) 0%, rgba(240, 228, 208, .94) 100%) !important;
    border-bottom: 1px solid var(--ac-gold-line) !important;
}

/* Site name next to the logo: gold, italic serif */
#header-container #logo .scf-logo-text {
    font-family: var(--ac-serif);
    font-style: italic;
    font-weight: 700;
    letter-spacing: .3px;
    background: linear-gradient(180deg, var(--ac-gold-1), var(--ac-gold-2) 55%, var(--ac-gold-3));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    text-shadow: none;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .55));
}
/* on the light pages: a slightly deeper gold and a softer shadow so it stays readable */
body:not(.home) #header-container #logo .scf-logo-text {
    background: linear-gradient(180deg, #d4a94f, #a8772a);
    -webkit-background-clip: text;
    background-clip: text;
    filter: drop-shadow(0 1px 1px rgba(120, 90, 40, .3));
}

/* Menu: the current page is a gold pill, the others get a thin gold underline on hover */
#navigation ul li a {
    transition: color .2s ease, box-shadow .2s ease, background-size .25s ease;
}
#navigation > ul > li > a:not(.current) {
    background-image: linear-gradient(var(--ac-gold-2), var(--ac-gold-2));
    background-repeat: no-repeat;
    background-position: 50% calc(100% - 4px);
    background-size: 0 2px;
}
#navigation > ul > li > a:not(.current):hover { background-size: 60% 2px; }
#navigation ul li.current-menu-item > a,
#navigation ul li.current_page_item > a,
#navigation ul li.current-menu-ancestor > a,
#navigation ul li.current > a,
#navigation ul li a.current {
    background: linear-gradient(180deg, var(--ac-gold-1), var(--ac-gold-2) 60%, var(--ac-gold-3)) !important;
    color: #3b2a10 !important;
    border-radius: 999px;
    box-shadow: 0 2px 10px rgba(185, 139, 62, .55), inset 0 1px 0 rgba(255, 255, 255, .55);
}

/* "Add listing" button */
.header-widget a.button.border,
.header-widget a.button.border.with-icon {
    background: linear-gradient(180deg, var(--ac-blue-1), var(--ac-blue-2)) !important;
    border: 0 !important;
    color: #fff !important;
    border-radius: 999px;
    box-shadow: 0 6px 18px rgba(60, 110, 140, .45), inset 0 1px 0 rgba(255, 255, 255, .45);
    transition: transform .2s ease, box-shadow .2s ease;
}
.header-widget a.button.border:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(60, 110, 140, .55), inset 0 1px 0 rgba(255, 255, 255, .5);
}

/* ---------- Home page: title, subtitle, search bar ---------- */
.main-search-container h2,
.main-search-inner h2 {
    font-family: var(--ac-serif) !important;
    font-style: italic;
    font-weight: 700;
    font-size: clamp(36px, 7.2vw, 84px) !important;
    line-height: 1.08;
    letter-spacing: .5px;
    background: linear-gradient(180deg, var(--ac-gold-1) 0%, var(--ac-gold-2) 52%, var(--ac-gold-3) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .5));
    animation: ac-rise .9s ease both;
}
.main-search-container h2 .typed-cursor,
.main-search-inner h2 .typed-cursor {
    -webkit-text-fill-color: var(--ac-gold-2);
    color: var(--ac-gold-2) !important;
}
.main-search-container h4,
.main-search-inner h4 {
    font-family: var(--ac-serif) !important;
    font-weight: 600;
    font-size: clamp(17px, 2.6vw, 30px) !important;
    color: #fff !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, .6);
    animation: ac-rise 1.1s .12s ease both;
}
/* small gold ornament under the subtitle */
.main-search-container h4::after,
.main-search-inner h4::after {
    content: "\2014  \2726  \2014";
    display: block;
    margin-top: 10px;
    font-size: 15px;
    letter-spacing: 6px;
    color: var(--ac-gold-2);
    text-shadow: none;
}

/* Search bar: cream, like paper */
.main-search-input { animation: ac-rise 1.2s .2s ease both; }
@media (min-width: 992px) {
    .main-search-input {
        background: var(--ac-cream) !important;
        box-shadow: 0 0 0 4px rgba(255, 255, 255, .78), 0 22px 50px rgba(0, 0, 0, .38) !important;
    }
}
.main-search-input button.button,
.main-search-input .button,
.main-search-btn {
    background: linear-gradient(180deg, var(--ac-gold-1), var(--ac-gold-2) 55%, var(--ac-gold-3)) !important;
    border: 0 !important;
    color: #4a3410 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .45);
    box-shadow: 0 6px 16px rgba(150, 110, 40, .45), inset 0 1px 0 rgba(255, 255, 255, .6);
    transition: transform .2s ease, box-shadow .2s ease;
}
.main-search-input button.button:hover,
.main-search-input .button:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(150, 110, 40, .55), inset 0 1px 0 rgba(255, 255, 255, .6);
}
@media (min-width: 992px) {
    .main-search-input-item,
    .main-search-input-item input,
    .main-search-input-item .bootstrap-select > .dropdown-toggle {
        background: transparent !important;
    }
}
@media (max-width: 991px) {
    .main-search-input-item { background: var(--ac-cream) !important; }
}

/* ---------- Page frame (computers only): a thin parchment border around the window ---------- */
@media (min-width: 1025px) {
    body::after {
        content: "";
        position: fixed;
        inset: 0;
        border: 6px solid var(--ac-parchment);
        box-shadow: inset 0 0 14px rgba(120, 90, 40, .35);
        pointer-events: none;
        z-index: 100000;
    }
}

@keyframes ac-rise {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .main-search-container h2, .main-search-inner h2,
    .main-search-container h4, .main-search-inner h4,
    .main-search-input { animation: none !important; }
}


/* ---------- Search bar: no white squares inside (location icon, dropdown, fields) ---------- */
.main-search-input-item,
.main-search-input-item > *,
.main-search-input-item i,
.main-search-input-item a,
.main-search-input-item .icon,
.main-search-input-item .bootstrap-select,
.main-search-input-item .bootstrap-select > .dropdown-toggle,
.main-search-input-item .input-with-icon,
.main-search-input-item .input-with-icon i,
.main-search-input-item .location,
.main-search-input-item .location a,
.main-search-input-item .location i {
    background: transparent !important;
    box-shadow: none !important;
}
.main-search-input-item .location a,
.main-search-input-item .location i,
.main-search-input-item a.geolocate { color: var(--ac-gold-3) !important; }

/* ---------- Site name: more elegant (spaced italic serif, gold, fine gold rule) ---------- */
#header-container #logo .scf-logo-text {
    font-family: "Palatino Linotype", Palatino, "Book Antiqua", "Hoefler Text", Georgia, serif;
    font-style: italic;
    font-weight: 600;
    letter-spacing: 1.2px;
    background: linear-gradient(100deg, #f7e6b3 0%, #dcb76d 30%, #fff1c4 50%, #c99b48 72%, #a8772a 100%);
    -webkit-background-clip: text;
    background-clip: text;
    position: relative;
    padding-bottom: 0 !important;
}
#header-container #logo .scf-logo-text::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: -4px;
    height: 1px;
    background: linear-gradient(90deg, transparent, #d9b56a 25%, #d9b56a 75%, transparent);
    -webkit-text-fill-color: initial;
}
body:not(.home) #header-container #logo .scf-logo-text {
    background: linear-gradient(100deg, #e0b95e 0%, #b98b3e 45%, #e6c36f 60%, #9a6b22 100%);
    -webkit-background-clip: text;
    background-clip: text;
}

/* ---------- One accent colour everywhere: gold replaces the theme blue ---------- */
:root {
    --primary-color: #c99b48;
    --listeo-primary-color: #c99b48;
    --listeo-primary-color-rgb: 201, 155, 72;
}

/* Buttons (Add Listing, Search, Submit, Send, Save, Book…) */
a.button, button.button, input[type="submit"], input[type="button"].button,
.button.border:hover, .button.white:hover,
a.button.border:hover,
.header-widget .button, .header-widget a.button,
#add-listing, .add-listing-btn, .woocommerce a.button, .woocommerce button.button,
.woocommerce input.button, .woocommerce #respond input#submit,
.booking-widget .button, .book-now, .listing-item .button,
#backtotop a:hover, .pagination .current a, .pagination ul li a.current-page,
.pagination-next-prev a:hover {
    background: linear-gradient(180deg, var(--ac-gold-1), var(--ac-gold-2) 55%, var(--ac-gold-3)) !important;
    border-color: var(--ac-gold-2) !important;
    color: #4a3410 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .45);
    box-shadow: 0 4px 12px rgba(150, 110, 40, .35), inset 0 1px 0 rgba(255, 255, 255, .6);
}
a.button i, button.button i, .header-widget .button i { color: #4a3410 !important; }
a.button.border, .button.border { background: transparent !important; color: var(--ac-gold-3) !important; border: 1px solid var(--ac-gold-2) !important; box-shadow: none; text-shadow: none; }

/* Category labels on article cards: gold, and a little smaller */
.blog-post .post-categories a, .blog-post .post-category a, .blog-post .post-cat a,
.post-img .post-categories a, .post-img .tag, .post-img .category, .post-img .listing-badge,
.blog-post .tag, .blog-post a.tag, .blog-post .cat-link, .blog-post .blog-cat,
.post-categories li a, .post-categories a,
.amc-blog-card .amc-cat, .amc-cat, .amc-card-cat, [class*="blog-card"] [class*="cat"] a,
[class*="blog-card"] [class*="cat"], [class*="blog-card"] [class*="badge"],
.listing-badge, .featured-badge {
    background: linear-gradient(180deg, var(--ac-gold-1), var(--ac-gold-2) 55%, var(--ac-gold-3)) !important;
    color: #4a3410 !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .4);
    border: 0 !important;
    font-size: 11.5px !important;
    line-height: 1 !important;
    padding: 7px 13px !important;
    border-radius: 20px !important;
    box-shadow: 0 2px 6px rgba(120, 90, 40, .3);
}

/* Other blue accents: links on hover, icons, tabs, checkboxes, highlights */
.tabs-nav li.active a, .tabs-nav li a:hover, .tag-cloud a:hover, .tags a:hover,
.listing-type-badge, .rating-counter, .star-rating .rating-counter,
.numerical-rating, .highlighted, .ui-slider-range, .switch .slider:checked,
input[type="checkbox"]:checked + label:before, .noUi-connect {
    background-color: var(--ac-gold-2) !important;
    border-color: var(--ac-gold-2) !important;
}

/* ---------- Sticky header (the one that appears when you scroll) ---------- */
#header-container.cloned #header .container,
#header-container.sticky #header .container { display: flex; align-items: center; flex-wrap: nowrap; }
#header-container.cloned #logo img,
#header-container.sticky #logo img { height: 50px !important; width: auto !important; display: block !important; }
#header-container.cloned #logo .scf-logo-text,
#header-container.sticky #logo .scf-logo-text { font-size: 23px !important; }
#header-container.cloned #navigation ul li a,
#header-container.sticky #navigation ul li a { white-space: nowrap; }

/* ---------- Home page: dark brown outline around the title and the subtitle, so they stay readable on any photo ---------- */
/* To change the outline colour, replace #3a2610 (dark brown) by #000 (black) in the lines below. */
.main-search-container h2,
.main-search-inner h2,
.main-search-container h4,
.main-search-inner h4 {
    filter:
        drop-shadow(1.5px 0 0 #3a2610)
        drop-shadow(-1.5px 0 0 #3a2610)
        drop-shadow(0 1.5px 0 #3a2610)
        drop-shadow(0 -1.5px 0 #3a2610)
        drop-shadow(0 4px 10px rgba(0, 0, 0, .55));
}
/* the small gold ornament below the subtitle keeps its own look */
.main-search-container h4::after,
.main-search-inner h4::after { filter: none; }

/* Same outline for any other big title of the home banner (whatever heading level or wrapper the theme uses) */
:is(.main-search-container, .main-search-inner, .parallax-content, .main-search-container .container, [class*="search-container"], .home-banner, .hero) :is(h1, h2, h3, h4, h5, h6),
.main-search-inner .typed-words, .main-search-inner [class*="typed"]:not(.typed-cursor),
.main-search-container .typed-words, .main-search-container [class*="typed"]:not(.typed-cursor) {
    filter:
        drop-shadow(1.5px 0 0 #3a2610)
        drop-shadow(-1.5px 0 0 #3a2610)
        drop-shadow(0 1.5px 0 #3a2610)
        drop-shadow(0 -1.5px 0 #3a2610)
        drop-shadow(0 4px 10px rgba(0, 0, 0, .55));
}

/* ---------- Home banner spacing (v1.0.33) ---------- */
/* Mobile only: the subtitle comes up closer to the big title. Make the negative number bigger to raise it more. */
@media (max-width: 767px) {
    .main-search-container h4,
    .main-search-inner h4 { margin-top: -18px !important; }
}
/* Tablet only: the big title is larger and sits slightly lower. */
@media (min-width: 768px) and (max-width: 991px) {
    .main-search-container h2,
    .main-search-inner h2 {
        font-size: clamp(60px, 9vw, 84px) !important;
        position: relative;
        top: 12px;
    }
}

/* ---------- Home banner: no "browse featured categories" line and no category button (v1.0.34) ---------- */
/* Only the small gold ornament under the subtitle stays. To bring the line back, delete this block. */
.main-search-container .highlighted-categories,
.main-search-inner .highlighted-categories,
.main-search-container .highlighted-category,
.main-search-inner .highlighted-category,
.main-search-container .hc-title,
.main-search-inner .hc-title,
.main-search-container .featured-categories,
.main-search-inner .featured-categories,
.main-search-container [class*="highlighted-categor"],
.main-search-inner [class*="highlighted-categor"],
.main-search-container [class*="featured-categor"],
.main-search-inner [class*="featured-categor"],
.scf-hide-cats { display: none !important; }

/* ---------- Home: menu readable on the dark header (v1.0.37) ---------- */
/* While the header sits over the dark photos, the menu links are light cream with a soft shadow.
   The current page (gold pill) and the white header that appears after scrolling are not touched.
   To go back to the old look, delete this block. */
body.home #header-container:not(.cloned):not(.sticky) #navigation > ul > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):not(.current) > a:not(.current) {
    color: #fdf8ee !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .65);
    opacity: 1 !important;
}
body.home #header-container:not(.cloned):not(.sticky) #navigation > ul > li:not(.current-menu-item):not(.current_page_item):not(.current-menu-ancestor):not(.current) > a:not(.current):hover {
    color: #f3dda4 !important;
}
