/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* -------------------------------------------------------------------------
   Legal notice pages (Privacy, Accessibility, Fair Housing, Terms)
   -------------------------------------------------------------------------
   These four are plain content pages, not Elementor-built, so without this
   they inherit Elementor's light-grey global text colour (#818285) and run
   the full page width, which reads as unstyled and unreadable. This gives
   them a readable, centred document that matches the site: Montserrat type,
   navy (#111f70) headings, dark body text on white. Scoped by the
   legal-notice body class (added in functions.php for the four page slugs),
   so it never touches Elementor-built pages.
   ------------------------------------------------------------------------- */
body.legal-notice .site-main {
    max-width: 820px;
    margin: 0 auto;
    padding: 56px 24px 72px;
}
body.legal-notice .page-header {
    margin-bottom: 4px;
}
body.legal-notice .entry-title {
    color: #111f70;
    font-family: Montserrat, sans-serif;
    font-size: 40px;
    line-height: 1.15;
    margin: 0 0 12px;
}
body.legal-notice .page-content,
body.legal-notice .page-content p,
body.legal-notice .page-content li {
    color: #2b2b2b;
    font-family: Montserrat, sans-serif;
    font-size: 17px;
    line-height: 1.7;
}
body.legal-notice .page-content p {
    margin: 0 0 1.1em;
}
body.legal-notice .page-content h2,
body.legal-notice .page-content h3 {
    color: #111f70;
    font-family: Montserrat, sans-serif;
    line-height: 1.25;
    margin: 1.6em 0 0.45em;
}
body.legal-notice .page-content h2 {
    font-size: 26px;
}
body.legal-notice .page-content h3 {
    font-size: 20px;
}
body.legal-notice .page-content ul {
    padding-left: 1.4em;
    margin: 0 0 1.2em;
}
body.legal-notice .page-content li {
    margin-bottom: 0.45em;
}
body.legal-notice .page-content a {
    color: #111f70;
    text-decoration: underline;
}
body.legal-notice .page-content a:hover {
    color: #0b1550;
}
/* the cross-link row at the foot of each legal page */
body.legal-notice .page-content h2:last-of-type + p a,
body.legal-notice .page-content p:last-child a {
    white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Estimate Commute (Elementor popup 18799)
   -------------------------------------------------------------------------
   The shortcode renders an interactive Google Maps Embed iframe centered on
   the property, plus a destination field and travel-mode select built by
   js/commute-map.js, which redraws the iframe as a directions route on
   submit. The form carries no markup styling of its own, so without these
   rules it inherits Elementor + Bootstrap form defaults: the label text and
   its wrapped input sit inline and collide, and the two questions ("Where
   do you travel to most?" and "How do you travel?") crowd together with no
   separation. This gives the form a clean vertical rhythm: the whole form is
   a flex column with even gaps, and each label is itself a flex column so
   its caption sits above its own control with a small gap, never on top of
   it. Scoped entirely under .orion-commute-form so it touches nothing else
   in the popup or the page.
   ------------------------------------------------------------------------- */
.orion-commute-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
    max-width: 460px;
    font-family: Montserrat, sans-serif;
}
/* Each label wraps its own control (the a11y association the JS relies on),
   so make the label a column: caption on top, control below, small gap
   between. This is what stops the two fields squishing together. */
.orion-commute-label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    color: #2b2b2b;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.3;
}
.orion-commute-label input,
.orion-commute-label select {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 13px;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #2b2b2b;
    background: #fff;
    border: 1px solid #c7ccd9;
    border-radius: 7px;
    line-height: 1.3;
}
.orion-commute-label input:focus,
.orion-commute-label select:focus {
    outline: none;
    border-color: #111f70;
    box-shadow: 0 0 0 3px rgba(17, 31, 112, 0.15);
}
.orion-commute-submit {
    align-self: flex-start;
    padding: 12px 22px;
    font-family: Montserrat, sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: #111f70;
    border: none;
    border-radius: 7px;
    cursor: pointer;
    transition: background-color 0.15s ease;
}
.orion-commute-submit:hover {
    background: #0b1550;
}
.orion-commute-submit:disabled {
    opacity: 0.6;
    cursor: default;
}
/* The map itself: a Google Maps Embed iframe, browser-side, carrying the
   referrer-restricted browser key. It has no natural height like an <img>,
   so it needs an explicit size or it renders at 0 height. */
.orion-commute-map {
    display: block;
    width: 100%;
    height: 360px;
    border: 0;
    border-radius: 8px;
}

/* -------------------------------------------------------------------------
   Property action row: "Directions" label spacing
   -------------------------------------------------------------------------
   On the single-apartment page the inline "Directions" icon-list widget
   (element 6e69519a) shares a flex row (gap 20px) with the Estimate Commute
   button. The widget defaulted to flex: 0 1 auto, so the button shrank it
   until the label wrapped mid-word ("Directio / ns"). Stopping just this one
   widget from shrinking, and keeping its label on one line, restores the
   spacing without touching any other icon list on the site. The double-class
   selector matches Elementor's own specificity so no !important is needed.
   ------------------------------------------------------------------------- */
.elementor-element.elementor-element-6e69519a {
    flex-shrink: 0;
}
.elementor-element-6e69519a .elementor-icon-list-text {
    white-space: nowrap;
}

/* -------------------------------------------------------------------------
   Footer breathing room (site-wide)
   -------------------------------------------------------------------------
   The Elementor global footer (template 43) sat flush against the page
   content on every page type, with no separation. This adds a consistent
   white gap above the footer everywhere, in keeping with the site's spacing
   rhythm. Applied to the footer location wrapper so it holds for both
   default-template pages and Elementor canvas pages.
   ------------------------------------------------------------------------- */
.elementor-location-footer {
    margin-top: 56px;
}