.elementor-kit-9{--e-global-color-primary:#C97B84;--e-global-color-secondary:#8A9B7E;--e-global-color-text:#2E2A26;--e-global-color-accent:#C99A3C;--e-global-color-sg_berry_dark:#6B2737;--e-global-color-sg_maroon_dk:#4F1D28;--e-global-color-sg_berry_soft:#F3E3E5;--e-global-color-sg_gold_deep:#A87B26;--e-global-color-sg_forest:#5F6E57;--e-global-color-sg_forest_dp:#46523F;--e-global-color-sg_sage:#8A9B7E;--e-global-color-sg_sage_soft:#E6EBE0;--e-global-color-sg_tan:#D8CFC3;--e-global-color-sg_tan_soft:#EFE9E1;--e-global-color-sg_cream:#FAF6F0;--e-global-color-sg_cream_dp:#F2EBE1;--e-global-color-sg_white:#FFFFFF;--e-global-color-sg_ink_soft:#4A443C;--e-global-color-sg_muted:#6E6659;--e-global-color-sg_line:#D8CFC3;--e-global-color-sg_gold_ink:#3A2A06;--e-global-typography-primary-font-family:"Fraunces";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-line-height:1.15em;--e-global-typography-primary-letter-spacing:-0.4px;--e-global-typography-secondary-font-family:"Fraunces";--e-global-typography-secondary-font-size:25px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-line-height:1.2em;--e-global-typography-secondary-letter-spacing:0px;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-size:16.5px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.7em;--e-global-typography-text-letter-spacing:0px;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-size:15px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1.5em;--e-global-typography-accent-letter-spacing:0px;--e-global-typography-sg_hero-font-family:"Fraunces";--e-global-typography-sg_hero-font-size:56px;--e-global-typography-sg_hero-font-weight:600;--e-global-typography-sg_hero-line-height:1.12em;--e-global-typography-sg_hero-letter-spacing:-0.8px;--e-global-typography-sg_h2-font-family:"Fraunces";--e-global-typography-sg_h2-font-size:40px;--e-global-typography-sg_h2-font-weight:600;--e-global-typography-sg_h2-line-height:1.15em;--e-global-typography-sg_h2-letter-spacing:-0.4px;--e-global-typography-sg_h3-font-family:"Fraunces";--e-global-typography-sg_h3-font-size:21px;--e-global-typography-sg_h3-font-weight:600;--e-global-typography-sg_h3-line-height:1.25em;--e-global-typography-sg_h3-letter-spacing:0px;--e-global-typography-sg_lede-font-family:"Inter";--e-global-typography-sg_lede-font-size:19px;--e-global-typography-sg_lede-font-weight:400;--e-global-typography-sg_lede-line-height:1.6em;--e-global-typography-sg_lede-letter-spacing:0px;--e-global-typography-sg_body-font-family:"Inter";--e-global-typography-sg_body-font-size:16.5px;--e-global-typography-sg_body-font-weight:400;--e-global-typography-sg_body-line-height:1.7em;--e-global-typography-sg_body-letter-spacing:0px;--e-global-typography-sg_small-font-family:"Inter";--e-global-typography-sg_small-font-size:14.5px;--e-global-typography-sg_small-font-weight:500;--e-global-typography-sg_small-line-height:1.6em;--e-global-typography-sg_small-letter-spacing:0px;--e-global-typography-sg_eyebrow-font-family:"Inter";--e-global-typography-sg_eyebrow-font-size:12px;--e-global-typography-sg_eyebrow-font-weight:700;--e-global-typography-sg_eyebrow-text-transform:uppercase;--e-global-typography-sg_eyebrow-line-height:1.4em;--e-global-typography-sg_eyebrow-letter-spacing:2.4px;--e-global-typography-sg_button-font-family:"Inter";--e-global-typography-sg_button-font-size:15px;--e-global-typography-sg_button-font-weight:600;--e-global-typography-sg_button-line-height:1.4em;--e-global-typography-sg_button-letter-spacing:0px;--e-global-typography-sg_pill-font-family:"Inter";--e-global-typography-sg_pill-font-size:11px;--e-global-typography-sg_pill-font-weight:700;--e-global-typography-sg_pill-text-transform:uppercase;--e-global-typography-sg_pill-line-height:1.3em;--e-global-typography-sg_pill-letter-spacing:0.7px;--e-global-typography-sg_list-font-family:"Inter";--e-global-typography-sg_list-font-size:15.5px;--e-global-typography-sg_list-font-weight:400;--e-global-typography-sg_list-line-height:1.65em;--e-global-typography-sg_list-letter-spacing:0px;background-color:var( --e-global-color-sg_cream );color:#4A443C;font-family:"Inter", Sans-serif;font-size:16.5px;line-height:1.7em;}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-kit-9 a{color:#6B2737;}.elementor-kit-9 a:hover{color:var( --e-global-color-sg_maroon_dk );}.elementor-kit-9 h1{color:#2E2A26;font-family:"Fraunces", Sans-serif;font-size:56px;font-weight:600;}.elementor-kit-9 h2{color:#6B2737;font-family:"Fraunces", Sans-serif;font-size:40px;font-weight:600;}.elementor-kit-9 h3{color:#6B2737;font-family:"Fraunces", Sans-serif;font-size:25px;font-weight:600;}.elementor-kit-9 h4{color:#6B2737;font-family:"Fraunces", Sans-serif;font-size:19px;font-weight:600;}.elementor-kit-9 h5{color:#6B2737;font-family:"Inter", Sans-serif;font-size:17px;font-weight:600;}.elementor-kit-9 h6{color:#6B2737;font-family:"Inter", Sans-serif;font-size:15px;font-weight:600;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1180px;}.e-con{--container-max-width:1180px;--container-default-padding-top:0px;--container-default-padding-right:10px;--container-default-padding-bottom:0px;--container-default-padding-left:10px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}} /* Start custom CSS *//* ===== GeoDirectory widgets brought onto the Semigrate SA design system ===== GD renders Bootstrap markup (.form-control, .btn-primary, .bg-light) which is blue out of the box and unreachable from the widget's own Elementor controls. Everything below uses global CSS variables, so it still rebrands from Site Settings > Global Colors / Fonts. */ /* --- text + select inputs --- */ .geodir-search-container .form-control, .geodir-search-container input[type="text"], .geodir-search-container select, .geodir-lm-location-switcher .form-control { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; font-size: 15px; line-height: 1.5; color: var( --e-global-color-text ); background-color: var( --e-global-color-sg_white ); border: 1px solid var( --e-global-color-sg_line ); border-radius: 7px; padding: 12px 14px; height: auto; box-shadow: none; } .geodir-search-container .form-control:focus, .geodir-lm-location-switcher .form-control:focus { border-color: var( --e-global-color-primary ); box-shadow: 0 0 0 2px rgba(201, 123, 132, 0.30); outline: none; } .geodir-search-container .form-control::placeholder { color: #9a948b; opacity: 1; } /* --- submit button: .btn-primary is Bootstrap blue by default --- */ .geodir-search-container .btn-primary, .geodir-search-container .geodir_submit_search, .geodir-search-container button[type="submit"] { background-color: var( --e-global-color-sg_berry_dark ) !important; border: 1px solid var( --e-global-color-sg_berry_dark ) !important; color: var( --e-global-color-sg_white ) !important; border-radius: 7px !important; padding: 12px 22px !important; font-family: var( --e-global-typography-sg_button-font-family ), sans-serif; font-size: 15px; font-weight: 600; box-shadow: none !important; transition: background-color .18s ease, border-color .18s ease, transform .18s ease; } .geodir-search-container .btn-primary:hover, .geodir-search-container .geodir_submit_search:hover { background-color: var( --e-global-color-sg_maroon_dk ) !important; border-color: var( --e-global-color-sg_maroon_dk ) !important; transform: translateY(-1px); } /* --- outlined variants: category boxes and filter chips (also blue by default) --- */ .geodir-search-container .btn-outline-primary, .geodir-category-list-in .card-body.btn-outline-primary, .card-body.btn-outline-primary { border-color: var( --e-global-color-primary ) !important; color: var( --e-global-color-sg_berry_dark ) !important; border-radius: 8px !important; font-family: var( --e-global-typography-sg_button-font-family ), sans-serif; } .geodir-search-container .btn-outline-primary:hover, .card-body.btn-outline-primary:hover { background-color: var( --e-global-color-sg_berry_dark ) !important; border-color: var( --e-global-color-primary ) !important; color: var( --e-global-color-sg_white ) !important; } /* --- prefix / clear icons and muted text --- */ .geodir-search-container .geodir-search-input-label i { color: var( --e-global-color-primary ); } .geodir-search-container .input-group-text { padding-right: 4px; } .geodir-search-container .text-muted, .geodir-lm-location-switcher .text-muted { color: var( --e-global-color-sg_muted ) !important; } .geodir-search-container .form-label { font-family: var( --e-global-typography-sg_small-font-family ), sans-serif; } /* --- advanced filter panel --- */ .geodir-search-container .bg-light { background-color: var( --e-global-color-sg_cream ) !important; border: 1px solid var( --e-global-color-sg_line ); border-radius: 8px !important; } /* --- location switcher trigger --- */ .geodir-lm-location-switcher .border { border-color: var( --e-global-color-sg_line ) !important; } .geodir-lm-location-switcher .rounded { border-radius: 7px !important; } .geodir-lm-location-switcher > div > a { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; font-size: 15px; color: var( --e-global-color-text ) !important; padding: 12px 14px !important; transition: border-color .18s ease; } .geodir-lm-location-switcher > div > a:hover { border-color: var( --e-global-color-primary ) !important; } .geodir-lm-location-switcher .dropdown-menu { border-color: var( --e-global-color-sg_line ); border-radius: 8px; } .geodir-lm-location-switcher .dropdown-item:hover, .geodir-lm-location-switcher .dropdown-item:focus { background-color: var( --e-global-color-sg_berry_soft ); color: var( --e-global-color-secondary ); } /* --- sit flush inside our own bordered search card --- */ .geodir-search-form-wrapper.mb-3 { margin-bottom: 0 !important; } .geodir-search-container .geodir-search.px-3 { padding-left: 0 !important; padding-right: 0 !important; } .geodir-search-container .geodir-search { row-gap: 10px !important; } /* ===== Shared GD Location template ===== */ /* Location description is admin-pasted HTML; inline font/line-height rules can arrive with !important, so these overrides are deliberately forceful. */ .sg-loc-desc, .sg-loc-desc * { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif !important; line-height: 1.7 !important; } .sg-loc-desc p { color: var( --e-global-color-sg_ink_soft ); font-size: 16.5px; margin-bottom: 1.05em; } .sg-loc-desc h2 { font-family: var( --e-global-typography-sg_h2-font-family ), Georgia, serif !important; color: var( --e-global-color-sg_berry_dark ); font-size: 32px; line-height: 1.18 !important; margin: 0 0 14px; } .sg-loc-desc h3, .sg-loc-desc h4 { font-family: var( --e-global-typography-sg_h3-font-family ), Georgia, serif !important; color: var( --e-global-color-text ); font-size: 21px; line-height: 1.25 !important; margin: 28px 0 12px; } .sg-loc-desc ul { list-style: none; padding-left: 0; margin: 0 0 1.2em; } .sg-loc-desc ul li { position: relative; padding-left: 30px; margin-bottom: 12px; color: var( --e-global-color-sg_ink_soft ); font-size: 15.5px; } .sg-loc-desc ul li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var( --e-global-color-sg_forest ); font-weight: 700; } .sg-loc-desc ul li b, .sg-loc-desc ul li strong { color: var( --e-global-color-text ); } /* the town's own image, right-hand column */ .sg-loc-image img { width: 100%; height: auto; border-radius: 10px; box-shadow: 0 4px 18px rgba(46,42,38,.10); } /* neighbourhood + other-town grids rendered by gd_locations */ .sg-loc-grid .card, .sg-loc-grid .geodir-location-grid-item { border: 1px solid var( --e-global-color-primary ) !important; border-radius: 10px !important; overflow: hidden; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; } .sg-loc-grid .card:hover, .sg-loc-grid .geodir-location-grid-item:hover { transform: translateY(-4px); box-shadow: 0 14px 40px rgba(46,42,38,.15) !important; border-color: var( --e-global-color-sg_berry_dark ) !important; } .sg-loc-grid img { object-fit: cover; } .sg-loc-grid a, .sg-loc-grid .card-title, .sg-loc-grid h5 { font-family: var( --e-global-typography-sg_h3-font-family ), Georgia, serif !important; color: var( --e-global-color-sg_berry_dark ) !important; text-transform: none !important; } .sg-loc-grid .bg-dark, .sg-loc-grid .card-img-overlay { background: rgba(46,42,38,.45) !important; } .sg-loc-grid .card-img-overlay a, .sg-loc-grid .card-img-overlay h5 { color: #fff !important; } /* hero title + tagline */ .sg-loc-title, .sg-loc-title h1 { font-family: var( --e-global-typography-sg_hero-font-family ), Georgia, serif !important; color: #fff !important; font-size: clamp(33px, 5.2vw, 56px) !important; line-height: 1.12 !important; margin: 0 !important; } .sg-loc-tagline, .sg-loc-tagline p { color: rgba(255,255,255,.93) !important; font-size: 19px !important; font-family: var( --e-global-typography-sg_lede-font-family ), sans-serif !important; margin: 12px 0 0 !important; } /* ===== GD Archive template (page 121) ===== */ /* sort + layout controls */ .sg-loop-actions .btn, .sg-loop-actions .dropdown-toggle { font-family: var( --e-global-typography-sg_button-font-family ), sans-serif !important; font-size: 14px !important; color: var( --e-global-color-text ) !important; background-color: var( --e-global-color-sg_white ) !important; border: 1px solid var( --e-global-color-sg_line ) !important; border-radius: 7px !important; padding: 9px 14px !important; box-shadow: none !important; transition: border-color .18s ease, color .18s ease; } .sg-loop-actions .btn:hover, .sg-loop-actions .dropdown-toggle:hover, .sg-loop-actions .btn.active { color: var( --e-global-color-sg_berry_dark ) !important; border-color: var( --e-global-color-sg_berry_dark ) !important; background-color: var( --e-global-color-sg_white ) !important; } .sg-loop-actions .dropdown-menu { border: 1px solid var( --e-global-color-sg_line ); border-radius: 8px; box-shadow: 0 10px 30px rgba(46,42,38,.12); font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; font-size: 14.5px; } .sg-loop-actions .dropdown-item:hover, .sg-loop-actions .dropdown-item:focus, .sg-loop-actions .dropdown-item.active { background-color: var( --e-global-color-sg_berry_soft ) !important; color: var( --e-global-color-sg_berry_dark ) !important; } .sg-loop-actions i { color: var( --e-global-color-sg_forest ); } /* pagination */ .sg-loop-paging .pagination { gap: 6px; flex-wrap: wrap; justify-content: center; } .sg-loop-paging .page-link, .sg-loop-paging .page-numbers { font-family: var( --e-global-typography-sg_button-font-family ), sans-serif !important; font-size: 14.5px !important; color: var( --e-global-color-text ) !important; background-color: var( --e-global-color-sg_white ) !important; border: 1px solid var( --e-global-color-sg_line ) !important; border-radius: 7px !important; min-width: 40px; padding: 9px 13px !important; text-align: center; box-shadow: none !important; } .sg-loop-paging .page-link:hover, .sg-loop-paging .page-numbers:hover { color: var( --e-global-color-sg_berry_dark ) !important; border-color: var( --e-global-color-sg_berry_dark ) !important; } .sg-loop-paging .page-item.active .page-link, .sg-loop-paging .page-numbers.current { background-color: var( --e-global-color-sg_berry_dark ) !important; border-color: var( --e-global-color-sg_berry_dark ) !important; color: var( --e-global-color-sg_white ) !important; } /* GD's empty state, so an unpopulated category still looks designed */ .sg-loop .geodir-no-listings, .sg-loop .gd-notification, .sg-loop .alert { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif !important; font-size: 16px !important; color: var( --e-global-color-sg_muted ) !important; background-color: var( --e-global-color-sg_white ) !important; border: 1px dashed var( --e-global-color-sg_line ) !important; border-radius: 10px !important; padding: 30px !important; text-align: center; } /* the category description block reuses the location description styling */ .sg-loc-desc .geodir-category-description, .sg-loc-desc .geodir_category_description { margin: 0; } /* ===== GD taxonomy archive (page 121, built with GD shortcodes) ===== Not Elementor: GD reads the archive page's post_content directly (class-geodir-template-loader.php:381), so the Elementor route only ever fired on empty archives. Styled here to match the rest of the site. */ .sg-archive-inner { max-width: 1180px; margin: 0 auto; padding: 0 24px; } .sg-archive-hero { background-color: var( --e-global-color-text ); background-image: linear-gradient(rgba(46,42,38,.55), rgba(46,42,38,.55)), url(/wp-content/uploads/semigrate/fynbos-coast.jpg); background-size: cover; background-position: center; padding: 78px 24px; min-height: 320px; display: flex; align-items: center; } .sg-archive-hero-inner { max-width: 1180px; margin: 0 auto; width: 100%; } .sg-archive-hero .sg-loc-title, .sg-archive-hero h1 { font-family: var( --e-global-typography-sg_hero-font-family ), Georgia, serif !important; color: #fff !important; font-size: clamp(30px, 4.6vw, 50px) !important; line-height: 1.14 !important; margin: 0 !important; } .sg-archive-eyebrow { font-family: var( --e-global-typography-sg_eyebrow-font-family ), sans-serif; font-size: 12px; font-weight: 700; letter-spacing: 2.4px; text-transform: uppercase; color: var( --e-global-color-accent ); margin-bottom: 10px; } .sg-archive-eyebrow.sg-dark { color: var( --e-global-color-sg_forest ); } .sg-archive-lede { font-family: var( --e-global-typography-sg_lede-font-family ), sans-serif; font-size: 19px; color: rgba(255,255,255,.93); margin: 12px 0 0; max-width: 62%; } .sg-archive-body { background-color: var( --e-global-color-sg_cream ); padding: 62px 0 78px; } .sg-archive-desc { max-width: 820px; margin: 0 auto 34px; } .sg-archive-search { background: var( --e-global-color-sg_white ); border: 1px solid var( --e-global-color-sg_line ); border-radius: 10px; padding: 20px; max-width: 700px; margin: 0 auto 34px; box-shadow: 0 6px 22px rgba(46,42,38,.10); } .sg-archive-h2 { font-family: var( --e-global-typography-sg_h2-font-family ), Georgia, serif !important; color: var( --e-global-color-sg_berry_dark ); font-size: clamp(24px, 3vw, 34px); text-align: center; margin: 56px 0 26px; } .sg-archive-map { border-radius: 10px; overflow: hidden; box-shadow: 0 4px 18px rgba(46,42,38,.10); } .sg-archive-cta { background-color: var( --e-global-color-sg_forest ); padding: 68px 0; text-align: center; color: #fff; } .sg-archive-cta h2 { font-family: var( --e-global-typography-sg_h2-font-family ), Georgia, serif !important; color: #fff !important; font-size: clamp(24px, 3.2vw, 38px); margin: 0 0 12px; } .sg-archive-cta p { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; color: rgba(255,255,255,.9); max-width: 580px; margin: 0 auto 24px; } .sg-archive-cta-buttons { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; } .sg-btn { display: inline-block; text-decoration: none; border-radius: 7px; padding: 13px 26px; font-weight: 600; font-size: 15px; font-family: var( --e-global-typography-sg_button-font-family ), sans-serif; border: 2px solid transparent; transition: background-color .18s ease, color .18s ease; } .sg-btn-light { background: var( --e-global-color-sg_white ); color: var( --e-global-color-sg_berry_dark ); } .sg-btn-light:hover { background: var( --e-global-color-accent ); color: var( --e-global-color-sg_gold_ink ); } .sg-btn-ghost { background: transparent; color: #fff; border-color: rgba(255,255,255,.6); } .sg-btn-ghost:hover { background: #fff; color: var( --e-global-color-sg_forest ); border-color: #fff; } @media (max-width: 640px) { .sg-archive-lede { max-width: 100%; font-size: 17px; } .sg-archive-hero { padding: 56px 16px; min-height: 0; } .sg-archive-cta-buttons .sg-btn { width: 100%; } } /* Route links - pre-filtered "moving from" entries on town pages. The heading deliberately inherits the kit's global h2 (Fraunces 40px, maroon) so this band matches every other section heading; only spacing is set here. */ .sg-routes { padding: 70px 0; } .sg-routes .sg-routes-eyebrow { font-family: var( --e-global-typography-sg_eyebrow-font-family ), sans-serif; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var( --e-global-color-sg_forest ); margin-bottom: 10px; } .sg-routes .sg-routes-title { margin: 0 0 10px; line-height: 1.2; } .sg-routes .sg-routes-lede { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; font-size: 16.5px; line-height: 1.6; color: var( --e-global-color-sg_muted ); max-width: 620px; margin: 0 0 22px; } .sg-routes .sg-routes-chips { display: flex; flex-wrap: wrap; gap: 10px; } .sg-routes .sg-route-chip { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; border-radius: 999px; padding: 10px 18px; background: var( --e-global-color-sg_white ); border: 1px solid var( --e-global-color-sg_line ); color: var( --e-global-color-sg_berry_dark ); font-family: var( --e-global-typography-sg_button-font-family ), sans-serif; font-size: 15px; font-weight: 600; line-height: 1.4; transition: background-color .18s ease, color .18s ease, border-color .18s ease; } .sg-routes .sg-route-chip:hover, .sg-routes .sg-route-chip:focus-visible { background: var( --e-global-color-sg_berry_dark ); border-color: var( --e-global-color-sg_berry_dark ); color: var( --e-global-color-sg_white ); } .sg-routes .sg-route-chip-count { display: inline-block; min-width: 20px; text-align: center; border-radius: 999px; padding: 1px 7px; background: var( --e-global-color-sg_sage_soft ); color: var( --e-global-color-sg_forest_dp ); font-family: var( --e-global-typography-sg_pill-font-family ), sans-serif; font-size: 11px; font-weight: 700; line-height: 1.7; } .sg-routes .sg-route-chip:hover .sg-route-chip-count, .sg-routes .sg-route-chip:focus-visible .sg-route-chip-count { background: rgba(255,255,255,.22); color: var( --e-global-color-sg_white ); } @media (max-width: 640px) { .sg-routes { padding: 44px 0; } .sg-routes .sg-routes-lede { font-size: 16px; } .sg-routes .sg-route-chip { font-size: 14.5px; padding: 9px 16px; } } /* sg body-copy link hover: colour alone is maroon -> darker maroon, which is near-imperceptible, so carry the affordance with an underline. Scoped to prose so buttons, nav items and linked cards are untouched. */ .elementor-widget-text-editor a:hover, .elementor-widget-theme-post-content a:hover, .sg-loc-desc a:hover, .sg-archive-desc a:hover, .sg-archive-lede a:hover { text-decoration: underline; } /* sg accordion title colour: the widgets set tab_color=text (charcoal) and tab_active_color=maroon, but the titles are elements and something upstream was painting the inactive ones protea pink (3.16:1 on white). Assert the widget's own intent. */ .elementor-widget-accordion .elementor-tab-title .elementor-accordion-title { color: var( --e-global-color-text ); } .elementor-widget-accordion .elementor-tab-title.elementor-active .elementor-accordion-title { color: var( --e-global-color-sg_berry_dark ); } /* sg category filter select: AUI renders the Category dropdown as select.form-select, which Bootstrap sizes at 40px while the neighbouring text inputs are 50px. Match them so the search bar lines up. */ .geodir-search-container select.form-select, .geodir-lm-location-switcher select.form-select { font-family: var( --e-global-typography-sg_body-font-family ), sans-serif; font-size: 15px; line-height: 1.5; color: var( --e-global-color-text ); background-color: var( --e-global-color-sg_white ); border: 1px solid var( --e-global-color-sg_line ); border-radius: 7px; padding: 12px 34px 12px 14px; height: auto; box-shadow: none; } /* ===== sg listing card fixes ===== */ /* GD widgets render inside AyeCode's .bsui Bootstrap scope, whose --bs-link-color is a default blue (#3993d5). Repoint Bootstrap's own link variables at the brand so every AUI-rendered link follows, not just the ones spotted so far. */ .bsui { --bs-link-color: var( --e-global-color-sg_berry_dark ); --bs-link-hover-color: var( --e-global-color-sg_maroon_dk ); } .sg-listing-card .bsui a, .sg-listing-card .geodir-entry-title a { color: var( --e-global-color-sg_berry_dark ); } .sg-listing-card .bsui a:hover, .sg-listing-card .geodir-entry-title a:hover { color: var( --e-global-color-sg_maroon_dk ); } /* Card thumbnails were object-fit: contain, so a wide image (the 612x205 fallback) letterboxed inside the 268px slot and left ~150px of white above the text. */ .sg-listing-card .geodir-post-slider img, .sg-listing-card .geodir-post-images img, .sg-listing-card .geodir-image-container img { object-fit: cover; object-position: center; } /* service_area is a multiselect, so GD outputs it as a bulleted