/* Feinh brand kit v1.1, applied on top of the portal styles (loaded for the Feinh portal domain only).
   White-first: a white header and canvas, navy type, navy primary buttons, Feinh Green (#0E9472) only for the
   dot, verification and small marks, Green Ink (#0B7A5E) for green text and links, WhatsApp green only for WhatsApp.
   Type: Outfit (Latin) and IBM Plex Sans Arabic (Arabic). One navy: #0B1B2B. */
:root{--fh-navy:#0B1B2B;--fh-green:#0E9472;--fh-ink:#0B7A5E;--fh-slate:#5B6878;--fh-off:#F7F9FB;--fh-pale:#E7F7F2;--fh-line:#E2E8EF;--fh-wa:#25D366}

/* ---------------------------------------------------------------- header: white, navy wordmark and navigation */
.ppn{background:#FFFFFF!important;color:var(--fh-navy)!important;border-bottom:1px solid var(--fh-line)!important;box-shadow:0 1px 0 rgba(11,27,43,.02)}
.ppn-brand{color:var(--fh-navy)!important}
.ppn-brand img{height:30px!important}
html[dir=rtl] .ppn-brand img{height:38px!important}
.ppn-menu>a,.ppn-top{color:var(--fh-navy)!important}
.ppn-menu>a:hover,.ppn-item:hover .ppn-top,.ppn-item.open .ppn-top{color:var(--fh-navy)!important;background:var(--fh-off)!important}
.ppn-caret{color:var(--fh-navy)!important}
.ppn-caret:focus-visible,.ppn-top:focus-visible,.ppn-menu>a:focus-visible,.ppn-btn:focus-visible,.ppn-lang:focus-visible,.ppn-saved:focus-visible{outline:2px solid var(--fh-ink)!important;outline-offset:2px}
.ppn-drop{border:1px solid var(--fh-line);box-shadow:0 18px 44px rgba(11,27,43,.12)!important}
.ppn-drop li a:hover,.ppn-drop li a:focus-visible{background:var(--fh-off)!important;color:var(--fh-ink)!important}
.ppn-verify svg{stroke:var(--fh-green)!important}
.ppn-new{background:var(--fh-pale)!important;color:var(--fh-ink)!important}
.ppn-btn.line,.ppn-lang,.ppn-saved{border-color:var(--fh-line)!important;color:var(--fh-navy)!important;background:#fff}
.ppn-btn.line:hover,.ppn-lang:hover,.ppn-saved:hover{border-color:var(--fh-navy)!important}
/* The header button opens WhatsApp: WhatsApp green, with dark text for contrast. */
.ppn-btn.gold{background:var(--fh-wa)!important;color:#062A1A!important}
.ppn-burger{border-color:var(--fh-line)!important}
.ppn-burger span,.ppn-burger span:before,.ppn-burger span:after{background:var(--fh-navy)!important}
@media (max-width:1000px){
 .ppn-tog:checked~.ppn-menu{background:#fff!important;border-bottom:1px solid var(--fh-line)!important;box-shadow:0 18px 30px rgba(11,27,43,.08)}
 .ppn-tog:checked~.ppn-menu>a,.ppn-item{border-bottom-color:var(--fh-line)!important}
 .ppn-drop{border:0;background:var(--fh-off)!important}
}
/* Mega-menu icons: restrained. Neutral tiles, green only for the trust-related ones. */
.ppn .t-gold,.ppn .t-blue,.ppn .t-coral,.ppn .t-violet,.ppn .t-navy{--ic-bg:#EEF2F6;--ic:var(--fh-navy)}
.ppn .t-green{--ic-bg:var(--fh-pale);--ic:var(--fh-ink)}
.ppn-act:hover .ppn-tx b,.ppn-act:focus-visible .ppn-tx b,.ppn-drop .all{color:var(--fh-ink)!important}
.ppn-feat{background:var(--fh-off)!important}
.ppn-feat small{color:var(--fh-ink)!important}
.fav:focus-visible{outline-color:var(--fh-ink)!important}
.fav-toast{background:var(--fh-navy)!important}
.fav-toast a{color:#7FD1B8!important}

/* ---------------------------------------------------------------- page canvas, type and actions */
body:has(.pp){background:#FFFFFF}
.pp{color:var(--fh-navy)}
.pp .pp-sub,.pp small{color:var(--fh-slate)}
/* Primary buttons are navy. WhatsApp buttons stay WhatsApp green. */
.pp .pp-btn:not(.ghost):not(.wa):not(.dark){background:var(--fh-navy);color:#fff!important}
.pp .pp-btn:not(.ghost):not(.wa):not(.dark):hover{background:#16293D;filter:none}
.pp .pp-btn.wa,.pp a.pp-btn.wa{background:var(--fh-wa)!important;color:#062A1A!important}
/* Green text and links use Green Ink. */
.pp .pp-link-more,.pp a.pp-link,.pp .pp-eyebrow{color:var(--fh-ink)!important}
.pp-hero .pp-eyebrow,.hx .pp-eyebrow{color:#FFFFFF!important}
/* Search toggles and chips */
.pp-toggle input:checked+span{background:var(--fh-navy)!important;color:#fff!important}
.pp-chip{border-color:rgba(255,255,255,.4);color:#fff}
.pp-chip:hover{border-color:#fff;color:#fff}
/* Cards: white, fine border, soft shadow */
.pp-card{border-color:var(--fh-line)!important;box-shadow:0 4px 18px rgba(11,27,43,.05)}
.pp-card:hover{box-shadow:0 10px 28px rgba(11,27,43,.09)}
/* Verified and checked states: pale green with Green Ink, always with a word */
.pp-checked,.pp-badge.ok,.pp-verified{background:var(--fh-pale)!important;color:var(--fh-ink)!important}
.pp-verified svg path:first-child{fill:none}
/* Photo heroes: real photography under a navy scrim; white headline */
.hx:after{background:linear-gradient(180deg,rgba(11,27,43,.38) 0%,rgba(11,27,43,.62) 60%,rgba(11,27,43,.8) 100%)!important}

/* ---------------------------------------------------------------- footer: navy surface, white wordmark */
.ppf{background:var(--fh-navy)!important;color:#C5D0DA}
.ppf .ppf-trust li,.ppf .ppf-proof,.ppf .ppf-grow{color:#FFFFFF!important}
.ppf-trust li::before{color:var(--fh-green)!important}
.ppf-btn.wa{background:var(--fh-wa)!important;color:#062A1A!important}
.ppf-alerts button{background:#FFFFFF!important;color:var(--fh-navy)!important}
.ppf-alerts label.ok input{accent-color:var(--fh-green)!important}
.ppf-brand img{height:32px!important}
html[dir=rtl] .ppf-brand img{height:42px!important}

/* ---------------------------------------------------------------- loading state: the pin */
.fh-loading{display:inline-block;width:28px;height:33px;background:url(/assets/prospera_realestate/images/brands/feinh/feinh-pin.svg) center/contain no-repeat;animation:fh-bob 1s ease-in-out infinite}
@keyframes fh-bob{50%{transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.fh-loading{animation:none}}
.pp-h1-ar{color:#FFFFFF!important}
#map{position:relative}
.fh-center{position:absolute;left:50%;top:50%;margin:-17px 0 0 -14px;z-index:5}

/* ---------------------------------------------------------------- the pin on maps */
/* A single home or compound: the Feinh pin, tip on the spot, with its label above. */
.pp-pin.solo{background:none!important;box-shadow:none!important;padding:0;display:flex;flex-direction:column;align-items:center;gap:3px}
.pp-pin.solo span{background:var(--fh-navy);color:#fff;padding:5px 9px;border-radius:999px;box-shadow:0 4px 12px rgba(11,27,43,.25)}
.pp-pin.solo:after{position:static;margin:0;border:0;width:30px;height:35px;background:url(/assets/prospera_realestate/images/brands/feinh/feinh-pin.svg) center/contain no-repeat;filter:drop-shadow(0 3px 5px rgba(11,27,43,.3))}
/* Projects on the search map carry a small pin before the name; homes keep their price pills. */
.pp-pin.project span:before{content:"";display:inline-block;width:10px;height:12px;margin-inline-end:5px;vertical-align:-1px;background:url(/assets/prospera_realestate/images/brands/feinh/feinh-pin-reverse.svg) center/contain no-repeat}
/* Dark form panels: the primary button turns white so it stays visible. */
.pp .cp-ask .pp-btn:not(.ghost):not(.wa){background:#FFFFFF!important;color:var(--fh-navy)!important}
/* On photo heroes the primary button is white, with navy text. */
.pp .hx .pp-btn:not(.ghost):not(.wa),.pp .cp-hero .pp-btn:not(.ghost):not(.wa){background:#FFFFFF!important;color:var(--fh-navy)!important}