@import "//fonts.googleapis.com/css?family=Oswald";
@import "//fonts.googleapis.com/css?family=Lato:400,300";
@import "//fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
@font-face{font-family:'font-os';src:url(../font/font-os/font-os.eot?g249fy);src:url(../font/font-os/font-os.eot?#iefixg249fy) format("embedded-opentype"),url(../font/font-os/font-os.woff?g249fy) format("woff"),url(../font/font-os/font-os.ttf?g249fy) format("truetype"),url(../font/font-os/font-os.svg?g249fy#osfont) format("svg");font-weight:400;font-style:normal}
[class^="os-icon-"],[class*=" os-icon-"]{font-family:'font-os';speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.os-icon-sqmt:before{content:"\e600"}
.os-icon-bedroom:before{content:"\e601"}
.os-icon-bathroom:before{content:"\e602"}
.os-icon-parking:before{content:"\e603"}
.os-1x{font-size:16px!important}
.os-2x{font-size:18px!important}
.os-3x{font-size:24px!important}
.os-4x{font-size:28px!important}
.os-5x{font-size:32px!important}
#listings .row-fluid{width:auto}
.latestproperties{padding-top:15px;font-family:'Lato',sans-serif}
.os_item{background:none repeat scroll 0 0 #fff;border:1px solid #dedede;margin:0 0 25px!important;padding:0;font-family:"Poppins",sans-serif}
.os_property-title{padding:10px 10px 0}
#os_images{position:relative}
.os_featured{background:#e73914;color:#fff;font-size:16px;padding:10px;font-family:'Oswald',sans-serif;position:absolute;right:0;bottom:0;line-height:1}
.os_rating{padding:2px;position:absolute;right:2%;top:4%;line-height:1}
.os_sold{background:none repeat scroll 0 0 #5bc0de99;color:#FFF;font-size:15px;padding:10px;font-family:'Oswald',sans-serif;position:absolute;left:2%;bottom:4%;line-height:1;font-weight:400;text-shadow:0 1px 1px #0000004d;box-shadow:0 1px 2px #0000004d;border-radius:2px;transition:all .4s ease 0}
.os_sold:hover{background:none repeat scroll 0 0 #5bc0decc}
.os_types_red{background:#0009;color:#fff;font-size:16px;padding:10px;font-family:'Oswald',sans-serif;position:absolute;left:2%;top:4%;line-height:1;text-shadow:0 1px 1px #0000004d;box-shadow:0 1px 2px #0000004d;border-radius:2px;transition:all .4s ease 0}
.os_types_red:hover{background-color:#000c}
.os-propertytitle{font-size:20px;font-family:'Oswald',sans-serif}
.os-leftpad{padding:5px}
.os_category a{color:#535353}
.os-toppad{border-bottom:1px solid #DFDFDF;padding:0}
.ospitem-bopad p{margin:0;border-bottom:1px solid #DFDFDF;padding:3px 0}
.ospitem-bopad p:hover{background:#f1f1f1}
.ospitem-bopad .field{font-weight:600;color:#333}
.os_currency_red{background:#E73914;color:#fff;font-size:13px;padding:10px;display:inline-block;float:right;font-family:'Oswald',sans-serif}
.os_currency_orange{background:#FF7F00;color:#fff;font-size:14px;padding:10px;font-weight:600;display:inline-block;float:right}
.os_currency_green{background:#5CCE26;color:#fff;font-size:14px;padding:10px;font-weight:600;display:inline-block;float:right}
.os-address{padding:4px 0 0;font-size:12px;line-height:14px;color:#AAA}
.os-address .span12{min-height:10px!important}
.os-desc{padding:5px 0 0;font-size:13px;line-height:18px;color:#8B8B8B}
.os_bottom{padding:10px 0 0}
.os_property-meta{border-top:1px solid #dedede;background-color:#f5f5f5;overflow:hidden;width:auto;padding:0}
.os_property-meta ul{margin:0;padding:0!important}
.os_property-meta li{float:left;border-right:1px solid #dedede;padding:12px}
.os_property-meta li span{margin-left:10px}
.property-meta ul{margin:0;padding:0;display:flex;justify-content:flex-start}
.os_bottom .btn{padding:6px!important}
#listings .pagination{width:100%}
#listings .pagination select{display:inline-block;margin-left:10px}
.lightGrad{background:#fff}
.descriptionWrap h1{margin-top:10px;font-size:20px}
.descriptionWrap ul{margin:0;padding:0}
.attribute-list li{border-bottom:1px solid #eee;margin:0;padding:6px 5px 6px 10px}
.attribute-list li:hover{background:#f1f1f1}
.attribute-list li:last-child{border-bottom:none}
.attribute-list .meta-block{font-weight:600;text-transform:uppercase}
.attribute-list .meta-block span{padding:0 0 0 10px;font-weight:400;text-transform:uppercase}
.os_property-item{background:#fff;border-left:1px solid #dedede;border-right:1px solid #dedede;border-bottom:1px solid #dedede;font-family:'Lato',sans-serif}
.os_property-item .wrap{background-color:#dedede;margin-bottom:16px}
.os_property-item .title{color:#394041;float:left;font-size:14px;line-height:40px;padding:0 0 0 16px;margin:0}
.os_property-item .price{font-family:"Oswald",sans-serif;display:inline-block;float:right;padding:0 0 0 16px;margin:0;line-height:40px}
.os_property-item .price_rtl{font-family:"Oswald",sans-serif;display:inline-block;float:left;padding:0;margin:0;line-height:40px}
.os_property-item .status-type,.os_property-item .status-type_rtl{font-size:14px;background:#292d2d;color:#fff;padding:8px 20px;position:relative;font-family:'Oswald',sans-serif}
.os_property-item .status-type_rtl{padding:8px 0}
.os_property-item .status-price,.os_property-item .status-price_rtl{font-size:14px;color:#fff;padding:8px 20px;position:relative;font-family:'Oswald',sans-serif}
.status-price select{margin-bottom:5px!important}
.os_property-item .status-price_rtl{padding:8px 0}
.os_property-item .os_property_content{padding:0 15px 26px;border-bottom:1px solid #dedede}
.os_property-item .property-meta{background-color:#f5f5f5;border:1px solid #dedede;margin:0;padding:0}
.listingActions-list{margin:0}
.os_property-item .property-meta li{float:left;padding:11px 10px;}
.os_property-item .property-meta li a{color:#394041;font-size:14px;font-weight:400!important}
.os_property-item .content h4.additional-title{font-weight:500;font-size:16px;font-family:'Lato',sans-serif}
.os_property-item ul.additional-details{border-top:1px solid #f1f1f1;list-style:none outside none;margin:0;padding:0}
.os_property-item ul.additional-details li{margin:0;padding:6px 5px 6px 10px;border-bottom:1px solid #eee}
.os_property-item ul.additional-details li:hover{background-color:#f1f1f1}
.os_property-item ul.additional-details li strong{color:#394041;display:inline-block;font-weight:500;margin-right:10px;font-family:'Lato',sans-serif;text-transform:uppercase}
.os_property-item .features{background-color:#fbfbfb;border-bottom:1px solid #dedede;padding-bottom:0}
.os_property-item .features h4{background-color:#f8f8f8;border-bottom:1px solid #dedede;float:none;line-height:20px;padding:9px 5px 10px;color:#394041;font-size:14px}
.os_property-item .features .arrow-bullet-list{margin:10px}
.os_property-item .features .arrow-bullet-list .span4{padding:7px}
.os_property-item .features .arrow-bullet-list .span4:hover{background-color:#f1f1f1}
.property-video{background:none repeat scroll 0 0 #fff;border-left:1px solid #dedede;border-right:1px solid #dedede;font-family:"Lato",sans-serif;border-bottom:1px solid #dedede;padding:24px 25px}
.property-video .video-label{font-size:16px;font-weight:600;padding:6px 17px 8px 14px;color:#fff;background-color:#586162;display:inline-block}
.property-attachment{background:none repeat scroll 0 0 #fff;font-family:"Lato",sans-serif;padding:12px}
.property-attachment .attachment-label{font-size:16px;font-weight:600;padding:6px 17px 8px 14px;color:#fff;background-color:#586162;display:inline-block}
.agent-detail{background:none repeat scroll 0 0 #fff}
.agent-detail .span7{padding:10px}
.agent-detail .span5{padding:10px}
.detailsView,.property-meta,.os_property_content,.additional-details,.detailsBar{font-family:"Poppins",sans-serif}
.detailsView .row-fluid .property-title h1{font-size:21px;font-family:'Oswald',sans-serif;margin-top:10px!important}
.detailsView .row-fluid .create-on{font-style:italic;font-size:11px}
.address_details{font-style:italic}
.property-title{padding-left:10px}
.tagkeyword{font-size:13px!important}
.propertyinfoli{line-height:24px}
.property-meta .listingActions-list .propertyinfoli span{font-size:16px;color:#FFF;font-weight:700}
.propertyinfoli:hover{background-color:#ddd!important}
.property-attachment .row-fluid{border-left:1px solid #dedede;border-right:1px solid #dedede;border-top:1px solid #dedede;border-bottom:1px solid #dedede;background-color:#efefef}
.property-attachment .row-fluid .span6{padding:20px}
.agent-detail .span7 .row-fluid .agent-name{font-size:16px}
.agent-detail .span7 .row-fluid .agent-address{font-style:italic}
.accordion-toggle{font-size:16px;font-weight:400}
.calendar-detail{margin-top:10px}
.calendar-detail .row-fluid .span12 .property-calendar{font-family:"Lato",sans-serif;border-bottom:1px solid #dedede}
.calendar-detail .row-fluid .span12 .property-calendar .calendar-label{font-size:16px;font-weight:600;padding:6px 17px 8px 14px;color:#fff;background-color:#586162;display:inline-block}
.favslider1{margin:0!important}
@media (min-width: 320px) and (max-width: 480px) {
.descriptionWrap{border-left:1px solid #dedede;border-right:1px solid #dedede}
.os_property-item .price{float:none;display:block;padding:0;margin:0 15px}
.os_property-item .status-type,.os_property-item .status-price{display:block;padding:0 20px}
.os_property-item .property-meta li,.os_property-meta li{float:none;border:none}
.os_property-item .title{line-height:26px;margin:10px 18px;float:none;padding:0}
.os_property-item .wrap{background:none}
.attribute-list{margin:0}
.attribute-list .meta-block{padding:6px 0}
.tabbable{padding-bottom:10px}
.tabbable .nav-tabs{border-bottom:none}
.tabbable .nav-tabs li{float:none}
.tabbable .nav-tabs li a{border:1px solid #ddd;border-radius:inherit}
.tabbable .nav-tabs li:first-child a{border-radius:4px 4px 0 0}
.tabbable .nav-tabs li:last-child a{border-radius:0 0 4px 4px}
#comments .form-horizontal .control-group .controls,#tellafriend .form-horizontal .control-group .controls{margin:0}
#comments .form-horizontal .control-group .controls .input-large,#tellafriend .form-horizontal .control-group .controls .input-large{width:100%!important}
}
@media (min-width: 768px) and (max-width: 1024px) {
.agent-detail [class*="span"]{box-sizing:border-box;display:block;float:left;margin-left:0;min-height:30px;width:100%}
.os_property-item .property-meta li{float:none;border:none}
.attribute-list{margin:0}
.attribute-list .meta-block{padding:6px 0}
}
@media (min-width: 1280px) {
.os_property-item .status-type:after{border-bottom:19px solid transparent;border-right:9px solid #4dc7ec;border-top:19px solid transparent;content:"";position:absolute;right:0;top:0;z-index:1}
.os_property-item .status-type:before{border-bottom:19px solid transparent;border-right:9px solid #292d2d;border-top:19px solid transparent;content:"";left:-9px;position:absolute;top:0}
}
#googlemapdiv img{max-width:none!important}
.shell{margin-top:10px}
.shell .row-fluid .span12 .tabs .tab-content{border-left:1px solid #CCC;border-right:1px solid #CCC;border-bottom:1px solid #CCC;padding:10px;background:none repeat scroll 0 0 #fff}
.shell .row-fluid .span12 .tabs .tabbable .nav{margin-bottom:0!important;padding-bottom:0!important}
#oscalendardiv .span12 .tabbable .tab-content{border-left:1px solid #CCC;border-right:1px solid #CCC;padding:10px;background:none repeat scroll 0 0 #fff}
#oscalendardiv .span12 .tabbable .nav{margin-bottom:0!important;padding-bottom:0!important}
.property-calendar form{margin-bottom:0!important}
.property-icon-square:hover,.property-icon-bed:hover,.property-icon-bath:hover,.property-icon-parking:hover{background:#DDD!important}
.fav-container a:active,.favslider1 a:active,.fav-container a:focus,.favslider1 a:focus{outline:none}
.favs,.fav-control-nav,.fav-direction-nav{margin:0;padding:0;list-style:none}
.favslider1{margin:0;padding:0}
.favslider1 .favs > li{display:none;-webkit-backface-visibility:hidden;background:none!important;padding:0!important;position:relative}
.favslider1 .favs img{width:100%;display:block}
.fav-pauseplay span{text-transform:capitalize}
.favs:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
html[xmlns] .favs{display:block}
* html .favs{height:1%}
.no-js .favs > li:first-child{display:block}
.favslider1{margin:0 0 45px;position:relative;zoom:1}
.fav-viewport{max-height:2000px;-webkit-transition:all 1s ease;-moz-transition:all 1s ease;transition:all 1s ease;direction:ltr}
.loading .fav-viewport{max-height:300px}
.favslider1 .favs{zoom:1}
#carousel1 img{display:block;opacity:.5;filter:alpha(opacity=50);cursor:pointer;max-width:120px}
#carousel1 img:hover{opacity:1;filter:alpha(opacity=100)}
#carousel1 .fav-active-slide img{opacity:1;filter:alpha(opacity=100);cursor:default}
.carousel1 li{margin-right:5px}
#fav-caption{background:none;-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);zoom:1;width:96%;padding:2%;margin:0;position:absolute;left:0;bottom:0;background:#0000004d;color:#fff;text-shadow:0 -1px 0 #0000004d;font-size:14px;line-height:18px}
.fav-direction-nav{*height:0}
.fav-direction-nav a{width:52px!important;height:52px!important;margin:-26px 0 0;display:block;background:url(bg_direction_nav.png) no-repeat 0 0;position:absolute;top:50%;z-index:10;cursor:pointer;text-indent:-9999px;opacity:0;filter:alpha(opacity=0);-webkit-transition:all .3s ease}
.fav-direction-nav .fav-next{background-position:100% 0;right:0}
.fav-direction-nav .fav-prev{left:0}
.fav-direction-nav li .fav-prev{left:0}
.fav-direction-nav li .fav-next{background-position:-52px 0;right:0}
.favslider1:hover .fav-next{opacity:.8;filter:alpha(opacity=80);right:5px}
.favslider1:hover .fav-prev{opacity:.8;filter:alpha(opacity=80);left:5px}
.favslider1:hover .fav-next:hover,.favslider1:hover .fav-prev:hover{opacity:1;filter:alpha(opacity=100)}
.fav-direction-nav .fav-disabled{cursor:default}
.fav-disabled:hover{opacity:.3!important;filter:alpha(opacity=30)!important}
.fav-direction-nav li{margin:0!important;padding:0!important}
.fav-control-nav{width:100%;position:absolute;bottom:-40px;left:0;text-align:center}
.fav-control-nav li{margin:0!important;display:inline-block;zoom:1;*display:inline;background:none!important;padding:0!important}
.fav-control-paging li a{background:#fff;border:1px solid #ccc;width:11px;height:11px;display:block;cursor:pointer;text-indent:-9999px;-webkit-border-radius:20px;-moz-border-radius:20px;-o-border-radius:20px;border-radius:20px;box-shadow:inset 0 0 3px #0000004d;margin-right:5px}
.fav-control-paging li a.fav-active{cursor:default}
.fav-control-paging li a:hover,.fav-control-paging li a.fav-active{background:#111;border:1px solid #777}
.fav-control-thumbs{position:static;overflow:hidden}
.fav-control-thumbs li{width:25%;float:left;margin:0}
.fav-control-thumbs img{width:100%;display:block;opacity:.7;filter:alpha(opacity=70);cursor:pointer}
.fav-control-thumbs img:hover{opacity:1;filter:alpha(opacity=100)}
.fav-control-thumbs .fav-active{opacity:1;cursor:default;filter:alpha(opacity=100)}
#carousel1 li:active img{opacity:1}
@media screen and (max-width: 860px) {
.fav-direction-nav .fav-prev{opacity:1;filter:alpha(opacity=100);left:0}
.fav-direction-nav .fav-next{opacity:1;filter:alpha(opacity=100);right:0}
}
.favslider1 li:before{display:none}
#welcomeHero{background:#292d2d}
#slideshow-main{width:84%;float:left}
#slideshow-main ul{margin:0;padding:0}
#slideshow-main li{display:none;position:relative}
#slideshow-main li.active{display:block!important}
#slideshow-main li span.opacity{position:absolute;bottom:0;left:0;display:block;width:100%;height:60px;background:#000;filter:alpha(opacity=50);-moz-opacity:.5;-khtml-opacity:.5;opacity:.5;z-index:500}
#slideshow-main li span.content{position:absolute;bottom:0;left:0;display:block;width:100%;height:60px;z-index:1000}
#slideshow-main li span.content h1{font-size:14px;margin:5px 0;padding:0 10px;color:#42e2e8}
#slideshow-main li span.content p{font-size:11px;margin:5px 0;padding:0 10px;color:#42e2e8}
#slideshow-carousel{float:left;width:16%;position:relative;padding:9px}
#slideshow-carousel ul{margin:0;padding:0;list-style:none}
#slideshow-carousel li{padding-bottom:9px;position:relative}
#slideshow-carousel li .arrow{left:3px;top:28px;position:absolute;width:20px;height:40px;background:url(images/arrow_white.png) no-repeat 0 0;display:block}
#slideshow-carousel li a{display:block;width:100%}
#slideshow-carousel .active{filter:alpha(opacity=100);-moz-opacity:1;-khtml-opacity:1;opacity:1}
#slideshow-carousel .faded{filter:alpha(opacity=50);-moz-opacity:.5;-khtml-opacity:.5;opacity:.5}
.jcarousel-container{position:relative}
.jcarousel-clip{z-index:2;padding:0;margin:0;overflow:hidden;position:relative}
.jcarousel-list{z-index:1;overflow:hidden;position:relative;top:0;left:0;margin:0;padding:0}
.jcarousel-next{z-index:3;display:none}
.jcarousel-prev{z-index:3;display:none}
.jcarousel-skin-tango .jcarousel-container-vertical{width:100%;height:200px;padding:0}
.jcarousel-skin-tango .jcarousel-clip-vertical{width:100%;height:200px}
.jcarousel-skin-tango .jcarousel-item{width:100%}
.jcarousel-skin-tango .jcarousel-item-vertical{margin-bottom:0}
.jcarousel-skin-tango .jcarousel-item-placeholder{background:#fff;color:#000}
.jcarousel-skin-tango .jcarousel-next-vertical{width:40%;height:28px;cursor:pointer;background:#141616 url(../images/next-vertical.png) no-repeat center 6px;float:left}
.jcarousel-skin-tango .jcarousel-next-vertical:hover{background-position:center -28px}
.jcarousel-skin-tango .jcarousel-next-vertical:active{background-position:0 -64px}
.jcarousel-skin-tango .jcarousel-next-disabled-vertical,.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active{cursor:default;background-position:0 -28px}
.jcarousel-skin-tango .jcarousel-prev-vertical{width:40%;height:28px;cursor:pointer;background:#141616 url(../images/prev-vertical.png) no-repeat center 6px;float:right}
.jcarousel-skin-tango .jcarousel-prev-vertical:hover{background-position:center -28px}
.jcarousel-skin-tango .jcarousel-prev-vertical:active{background-position:0 -64px}
.propertyinfoli img,.maplink img{display:inline}
.property-title h1{margin:5px 0;font-size:30px}
#requestdetails_form input,#requestdetails_form select{margin:5px 0}
@media only screen and (max-width: 600px) {
.os_property-meta ul li.meta-block{display:inline-block}
.os_property-meta ul li.meta-block span{margin-left:5px}
.os_property-meta ul li.property-icon-square{width:37%!important}
.os_property-meta ul li.property-icon-bed,.os_property-meta ul li.property-icon-bath,.os_property-meta ul li.property-icon-packing{width:20%!important}
}
.latestproperties li,#propertydetails li{list-style:none}

.slideshow-container{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;display:none;justify-content:center;align-items:center;z-index:1000;overflow:hidden;flex-direction:column}
.slideshow-wrapper{display:flex;width:80%;height:70%;position:relative;overflow:hidden;justify-content:center}
.slideshow-track{display:flex;transition:transform .5s ease-in-out}
.slideshow-image{width:100%;height:auto;max-height:100%;object-fit:contain;flex-shrink:0}
.photo-description{color:#fff;text-align:center;margin-top:-10px;font-size:18px;padding:10px 0}
.nav-buttons{position:absolute;top:50%;transform:translateY(-50%);font-size:30px;color:#fff;background-color:#00000080;border:none;cursor:pointer;padding:15px;border-radius:8px;z-index:1002;width:50px;height:50px;display:flex;justify-content:center;align-items:center}
.nav-buttons.left{left:20px}
.nav-buttons.right{right:20px}
.grid-close-container{position:absolute;top:15px;left:15px;display:flex;gap:10px}
.grid-btn,.close-btn,.pause-btn{background-color:#fff3;color:#fff;padding:10px;border:none;cursor:pointer;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:background-color .3s ease,transform .3s ease;width:50px;height:50px}
.grid-btn:hover,.close-btn:hover, .pause-btn:hover{background-color:#ffffff80;transform:scale(1.1)}
.thumbnail-container{position:absolute;right:-150px;top:0;width:140px;height:100%;background-color:#000000e6;overflow-y:auto;display:flex;flex-direction:column;align-items:center;padding:10px;transition:right .5s ease;z-index:1002}
.thumbnail-container img{width:100px;height:70px;margin:5px;cursor:pointer;object-fit:cover;border:2px solid #fff;transition:transform .3s ease}
.grid-active .thumbnail-container{right:0}
@media (max-width: 768px) {
.slideshow-wrapper{width:90%;height:70%}
.photo-description{font-size:16px;margin-top:0;padding:8px 0}
.nav-buttons{font-size:24px;padding:10px;width:40px;height:40px}
.thumbnail-container{width:120px}
.thumbnail-container img{width:80px;height:55px}
}
@media (max-width: 480px) {
.slideshow-wrapper{width:100%;height:35%}
.photo-description{font-size:14px}
.nav-buttons{font-size:20px;padding:8px;width:35px;height:35px}
.thumbnail-container{width:100px}
.thumbnail-container img{width:70px;height:50px}
}
[dir="rtl"] .slideshow-wrapper{flex-direction:row-reverse}
[dir="rtl"] .nav-buttons.left{left:auto;right:20px}
[dir="rtl"] .nav-buttons.right{left:20px;right:auto}
[dir="rtl"] .thumbnail-container{left:-150px;right:auto}
[dir="rtl"] .grid-active .thumbnail-container{left:0}
[dir="rtl"] .grid-close-container{left:auto;right:15px}
.main-slideshow-container{position:relative;max-width:100%;overflow:hidden;margin:auto}
.main-slideshow-track{display:flex;transition:transform .5s ease-in-out;width:100%}
.main-slide{min-width:100%;position:relative;text-align:center}
.main-slide img{width:100%;height:auto;cursor:pointer}
.main-thumbnails{display:flex;justify-content:start;margin-top:0;overflow:hidden}
.thumbnails{display:flex;transition:transform .3s ease-in-out}
.thumbnails img{width:80px;margin:5px;cursor:pointer;border:2px solid transparent}
.thumbnails img.active{border:2px solid #007BFF}
.main-thumbnails img{width:90px;margin:1px;cursor:pointer;border:2px solid transparent}
.main-thumbnails img.active{border:2px solid #007BFF}
.main-nav-buttons{position:absolute;top:50%;transform:translateY(-50%);background:#00000080;color:#fff;border:none;cursor:pointer;padding:15px;border-radius:10px;z-index:10;width:50px;height:50px;display:flex;justify-content:center;align-items:center}
.main-prev{left:10px}
.main-next{right:10px}
html[dir="rtl"] .main-prev{left:auto;right:10px}
html[dir="rtl"] .main-next{right:auto;left:10px}
.popup{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;justify-content:center;align-items:center}
.popup img{max-width:90%;max-height:90%}
@media (max-width: 768px) {
.descriptionWrap ul{padding-left:15px}
}
ul.attribute-list{padding-left:0}
/* ========================================
   FAVORITE ICON - Bottom Right of Image
   ======================================== */

#os_images {
    position: relative;
    overflow: hidden;
}

.os_favorite_icon {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 100;
}

/* ========================================
   PROPERTY DETAILS HEADING - MODERN LAYOUT
   ======================================== */

.detailsView .property-title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 30px 25px;
    margin: -1px -1px 20px -1px;
    border-radius: 8px 8px 0 0;
    position: relative;
    overflow: hidden;
}

.detailsView .property-title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="rgba(255,255,255,0.1)" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,138.7C960,139,1056,117,1152,101.3C1248,85,1344,75,1392,69.3L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') no-repeat bottom;
    background-size: cover;
    opacity: 0.3;
}

.detailsView .property-title h1 {
    color: #ffffff !important;
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 15px 0 !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
    position: relative;
    z-index: 1;
    line-height: 1.3;
}

.detailsView .property-title .address_details {
    color: rgba(255,255,255,0.95);
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;
    margin-top: 10px;
    position: relative;
    z-index: 1;
}

.detailsView .property-title .address_details::before {
    content: '📍';
    margin-right: 8px;
    font-size: 18px;
}

/* Property Badges */
.property-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
    position: relative;
    z-index: 1;
}

.featuredpropertydetails,
.marketstatuspropertydetails,
.justaddedpropertydetails,
.justupdatedpropertydetails {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}

.featuredpropertydetails {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    color: #fff;
}

.marketstatuspropertydetails {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: #fff;
}

.justaddedpropertydetails {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #fff;
}

.justupdatedpropertydetails {
    background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
    color: #fff;
}

.featuredpropertydetails:hover,
.marketstatuspropertydetails:hover,
.justaddedpropertydetails:hover,
.justupdatedpropertydetails:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Property Info Bar - Modern Design */
.os_property-item .wrap {
    background: linear-gradient(to right, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.os_property-item .title {
    color: #2c3e50;
    font-size: 18px;
    font-weight: 600;
    padding: 0;
    margin: 0;
    line-height: 1.4;
}

.os_property-item .price,
.os_property-item .price_rtl {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 15px;
}

.os_property-item .status-type,
.os_property-item .status-type_rtl {
    background: #2c3e50;
    color: #fff;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.os_property-item .status-price,
.os_property-item .status-price_rtl {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 20px;
    font-weight: 700;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    flex: 1;
    text-align: center;
}

/* Key Features Grid - Modern Cards */
.descriptionWrap .attribute-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    padding: 0;
    margin: 20px 0;
}

.descriptionWrap .attribute-list li {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px;
    margin: 0;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.descriptionWrap .attribute-list li:hover {
    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
    border-color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.descriptionWrap .attribute-list li.meta-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    color: #2c3e50;
    font-size: 14px;
}

.descriptionWrap .attribute-list li.meta-block span {
    color: #667eea;
    font-weight: 700;
    font-size: 16px;
}

/* Icon Enhancements */
.property-icon-square::before,
.property-icon-bed::before,
.property-icon-bath::before,
.property-icon-parking::before {
    font-size: 20px;
    margin-right: 10px;
    color: #667eea;
}

/* Responsive Design */
@media (max-width: 768px) {
    .detailsView .property-title {
        padding: 20px 15px;
        margin: 0 0 15px 0;
        border-radius: 0;
    }
    
    .detailsView .property-title h1 {
        font-size: 24px;
        margin-bottom: 10px !important;
    }
    
    .detailsView .property-title .address_details {
        font-size: 14px;
    }
    
    .property-badges {
        gap: 6px;
    }
    
    .featuredpropertydetails,
    .marketstatuspropertydetails,
    .justaddedpropertydetails,
    .justupdatedpropertydetails {
        padding: 5px 10px;
        font-size: 11px;
    }
    
    .os_property-item .wrap {
        padding: 15px;
    }
    
    .os_property-item .price,
    .os_property-item .price_rtl {
        flex-direction: column;
        gap: 10px;
    }
    
    .os_property-item .status-type,
    .os_property-item .status-type_rtl,
    .os_property-item .status-price,
    .os_property-item .status-price_rtl {
        width: 100%;
        text-align: center;
        padding: 10px 15px;
    }
    
    .os_property-item .status-price,
    .os_property-item .status-price_rtl {
        font-size: 18px;
    }
    
    .descriptionWrap .attribute-list {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .detailsView .property-title h1 {
        font-size: 20px;
    }
    
    .detailsView .property-title .address_details {
        font-size: 13px;
    }
    
    .os_property-item .status-price,
    .os_property-item .status-price_rtl {
        font-size: 16px;
    }
}

/* Sold Badge Enhancement */
.badge.badge-warning {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    display: inline-block;
    margin-bottom: 10px;
}

/* ========================================
   PROPERTY DETAILS HEADING - MODERN LAYOUT
   ======================================== */

.detailsView .property-title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 30px 25px;
    margin: 0 0 20px 0;
    border-radius: 0;
    position: relative;
    overflow: hidden;
}

.detailsView .property-title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="rgba(255,255,255,0.1)" d="M0,96L48,112C96,128,192,160,288,160C384,160,480,128,576,122.7C672,117,768,139,864,138.7C960,139,1056,117,1152,101.3C1248,85,1344,75,1392,69.3L1440,64L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') no-repeat bottom;
    background-size: cover;
    opacity: 0.3;
}

.detailsView .property-title h1 {
    color: #ffffff !important;
    font-size: 32px;
    font-weight: 700;
    margin: 0 0 15px 0 !important;
    text-shadow: 0 2px 4px rgba(0,0,0,0.1);
    position: relative;
    z-index: 1;
    line-height: 1.3;
}

.detailsView .property-title .address_details {
    color: rgba(255,255,255,0.95);
    font-size: 16px;
    font-weight: 400;
    display: flex;
    align-items: center;
    margin-top: 10px;
    position: relative;
    z-index: 1;
}

.detailsView .property-title .address_details::before {
    content: '📍';
    margin-right: 8px;
    font-size: 18px;
}

/* Property Badges */
.property-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 15px;
    position: relative;
    z-index: 1;
}

.featuredpropertydetails,
.marketstatuspropertydetails,
.justaddedpropertydetails,
.justupdatedpropertydetails {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}

.featuredpropertydetails {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    color: #fff;
}

.marketstatuspropertydetails {
    background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
    color: #fff;
}

.justaddedpropertydetails {
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
    color: #fff;
}

.justupdatedpropertydetails {
    background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
    color: #fff;
}

.featuredpropertydetails:hover,
.marketstatuspropertydetails:hover,
.justaddedpropertydetails:hover,
.justupdatedpropertydetails:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Sold Badge Enhancement */
.badge.badge-warning {
    background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    display: inline-block;
    margin-bottom: 10px;
}

/* ========================================
   PROPERTY INFO BAR - CLEAN & MODERN
   ======================================== */

.wrap {
    background: transparent;
    border: none;
    border-bottom: 2px solid #e9ecef;
    border-radius: 0;
    padding: 20px 0;
    margin-bottom: 20px;
    box-shadow: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.wrap .title {
    color: #495057;
    font-size: 15px;
    font-weight: 500;
    padding: 0;
    margin: 0;
    line-height: 1.5;
    letter-spacing: 0.3px;
    flex: 0 0 auto;
}

.wrap .price,
.wrap .price_rtl {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    flex: 1 1 auto;
    justify-content: flex-end;
}

.wrap .status-type,
.wrap .status-type_rtl {
    background: #2c3e50;
    color: #fff;
    padding: 10px 18px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    box-shadow: 0 2px 4px rgba(44, 62, 80, 0.15);
    transition: all 0.3s ease;
    white-space: nowrap;
}

.wrap .status-type:hover,
.wrap .status-type_rtl:hover {
    background: #34495e;
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(44, 62, 80, 0.2);
}

.wrap .status-price,
.wrap .status-price_rtl {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 10px 20px;
    border-radius: 6px;
    font-size: 22px;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.25);
    transition: all 0.3s ease;
    white-space: nowrap;
    letter-spacing: 0.5px;
}

.wrap .status-price:hover,
.wrap .status-price_rtl:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.35);
}

/* Remove arrow decoration for cleaner look */
@media (min-width: 1280px) {
    .wrap .status-type:after,
    .wrap .status-type:before {
        display: none;
    }
}

/* ========================================
   KEY FEATURES GRID - MODERN CARDS
   ======================================== */

.descriptionWrap .attribute-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
    padding: 0;
    margin: 20px 0;
}

.descriptionWrap .attribute-list li {
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px;
    margin: 0;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.descriptionWrap .attribute-list li:hover {
    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
    border-color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.descriptionWrap .attribute-list li.meta-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    color: #2c3e50;
    font-size: 14px;
}

.descriptionWrap .attribute-list li.meta-block span {
    color: #667eea;
    font-weight: 700;
    font-size: 16px;
}

/* Icon Enhancements */
.property-icon-square::before,
.property-icon-bed::before,
.property-icon-bath::before,
.property-icon-parking::before {
    font-size: 20px;
    margin-right: 10px;
    color: #667eea;
}

/* ========================================
   PROPERTY SECTIONS WITH BORDERS
   ======================================== */

.os_property-item {
    background: #fff;
    font-family: 'Poppins', sans-serif;
    margin-bottom: 0;
    border: none;
}

/* Property Meta Actions */
.os_property-item .property-meta {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    border-bottom: 2px solid #e9ecef;
    margin: 0;
    padding: 0;
}

.os_property-item .property-meta ul {
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.os_property-item .property-meta li {
    float: none;
    padding: 12px 16px;
    transition: all 0.3s ease;
}

.os_property-item .property-meta li:last-child {
    border-right: none;
}

.os_property-item .property-meta li:hover {
    background-color: #e9ecef;
}

.os_property-item .property-meta li a {
    color: #495057;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.os_property-item .property-meta li i {
    font-size: 16px;
    color: #667eea;
}

/* Property Content */
.os_property-item .os_property_content {
    padding: 25px 0;
    border-bottom: 2px solid #e9ecef;
    line-height: 1.8;
    color: #495057;
}

/* Features Section */
.os_property-item .features {
    background-color: #fff;
    border-bottom: 2px solid #e9ecef;
    padding: 0;
    margin-bottom: 20px;
}

.os_property-item .features h4.title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    border-radius: 0;
}

.os_property-item .features .arrow-bullet-list {
    padding: 20px;
}

/* Additional Details */
.os_property-item ul.additional-details {
    border-top: none;
    list-style: none;
    margin: 0;
    padding: 0;
}

.os_property-item ul.additional-details li {
    margin: 0;
    padding: 12px 15px;
    border-bottom: 1px solid #e9ecef;
    transition: all 0.3s ease;
}

.os_property-item ul.additional-details li:hover {
    background-color: #f8f9fa;
}

.os_property-item ul.additional-details li strong {
    color: #2c3e50;
    font-weight: 600;
    margin-right: 10px;
}

.os_property-item .content h4.additional-title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0 0 15px 0;
    font-size: 16px;
    font-weight: 600;
}

/* Property Attachment */
.property-attachment {
    background: #fff;
    border-top: 2px solid #e9ecef;
    border-bottom: 2px solid #e9ecef;
    padding: 25px 0;
    margin-bottom: 20px;
}

.property-attachment .attachment-label {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 20px;
    border-radius: 6px;
}

/* Agent Detail */
.agent-detail {
    background: #fff;
    border-top: 2px solid #e9ecef;
    border-bottom: 2px solid #e9ecef;
    padding: 25px 0;
    margin-bottom: 20px;
}

/* Details Bar (Tabs Section) */
.detailsBar {
    background: #fff;
    border-top: 2px solid #e9ecef;
    border-bottom: 2px solid #e9ecef;
    padding: 0;
    margin-bottom: 20px;
}

.detailsBar .shell {
    margin-top: 0;
}

/* ========================================
   RESPONSIVE DESIGN
   ======================================== */

@media (max-width: 991px) {
    .wrap {
        flex-direction: column;
        align-items: flex-start;
        padding: 15px 0;
    }
    
    .wrap .title {
        width: 100%;
        margin-bottom: 10px;
    }
    
    .wrap .price,
    .wrap .price_rtl {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }
    
    .wrap .status-type,
    .wrap .status-type_rtl,
    .wrap .status-price,
    .wrap .status-price_rtl {
        padding: 8px 16px;
    }
    
    .wrap .status-price,
    .wrap .status-price_rtl {
        font-size: 20px;
    }
    
    .os_property-item .property-meta ul {
        flex-direction: column;
    }
    
    .os_property-item .property-meta li {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #e9ecef;
    }
    
    .os_property-item .property-meta li:last-child {
        border-bottom: none;
    }
}

@media (max-width: 767px) {
    .detailsView .property-title {
        padding: 20px 15px;
        margin: 0 0 15px 0;
    }
    
    .detailsView .property-title h1 {
        font-size: 24px;
        margin-bottom: 10px !important;
    }
    
    .detailsView .property-title .address_details {
        font-size: 14px;
    }
    
    .property-badges {
        gap: 6px;
    }
    
    .featuredpropertydetails,
    .marketstatuspropertydetails,
    .justaddedpropertydetails,
    .justupdatedpropertydetails {
        padding: 5px 10px;
        font-size: 11px;
    }
    
    .wrap {
        padding: 12px 0;
        gap: 10px;
    }
    
    .wrap .title {
        font-size: 14px;
    }
    
    .wrap .status-type,
    .wrap .status-type_rtl {
        font-size: 12px;
        padding: 7px 14px;
    }
    
    .wrap .status-price,
    .wrap .status-price_rtl {
        font-size: 18px;
        padding: 7px 16px;
    }
    
    .descriptionWrap .attribute-list {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

@media (max-width: 480px) {
    .detailsView .property-title h1 {
        font-size: 20px;
    }
    
    .detailsView .property-title .address_details {
        font-size: 13px;
    }
    
    .wrap .price,
    .wrap .price_rtl {
        gap: 8px;
    }
    
    .wrap .status-type,
    .wrap .status-type_rtl {
        font-size: 11px;
        padding: 6px 12px;
    }
    
    .wrap .status-price,
    .wrap .status-price_rtl {
        font-size: 16px;
        padding: 6px 14px;
    }
}

/* ========================================
   PROPERTY INFORMATION - ENHANCED STYLING
   ======================================== */

.os_property-item .content h4.additional-title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0 0 20px 0;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.os_property-item ul.additional-details {
    border-top: none;
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 15px;
}

.os_property-item ul.additional-details li {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px;
    margin: 0;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.os_property-item ul.additional-details li:hover {
    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
    border-color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.os_property-item ul.additional-details li strong {
    color: #2c3e50;
    font-weight: 600;
    margin-right: 10px;
    font-size: 14px;
}

.os_property-item ul.additional-details li span {
    color: #667eea;
    font-weight: 700;
    font-size: 16px;
}

/* ========================================
   NEIGHBORHOOD - ENHANCED STYLING
   ======================================== */

.neighborhood-section {
    background: #fff;
    border-bottom: 2px solid #e9ecef;
    padding: 30px 0;
    margin-bottom: 20px;
}

.neighborhood-section h4.additional-title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0 0 20px 0;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
}

.neighborhood-section ul.additional-details {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 15px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.neighborhood-section ul.additional-details li {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px 20px;
    margin: 0;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.neighborhood-section ul.additional-details li:hover {
    transform: translateX(5px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
    border-color: #667eea;
    background: #fff;
}

.neighborhood-section ul.additional-details li strong {
    color: #2c3e50;
    font-weight: 600;
    font-size: 14px;
    flex: 1;
}

.neighborhood-section ul.additional-details li span {
    color: #667eea;
    font-weight: 700;
    font-size: 14px;
    padding: 6px 12px;
    background: #667eea15;
    border-radius: 6px;
}

/* ========================================
   FEATURES - ENHANCED STYLING
   ======================================== */

.os_property-item .features {
    background-color: #fff;
    border-bottom: 2px solid #e9ecef;
    padding: 0;
    margin-bottom: 20px;
}

.os_property-item .features h4.title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px 8px 0 0;
}

.os_property-item .features .arrow-bullet-list {
    padding: 20px;
    margin: 0;
}

.os_property-item .features .arrow-bullet-list .listing-features {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 15px;
}

.os_property-item .features .arrow-bullet-list .span4,
.os_property-item .features .arrow-bullet-list .col-md-4 {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 12px 15px;
    margin: 0;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 10px;
}

.os_property-item .features .arrow-bullet-list .span4:hover,
.os_property-item .features .arrow-bullet-list .col-md-4:hover {
    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
    border-color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.os_property-item .features .arrow-bullet-list .span4::before,
.os_property-item .features .arrow-bullet-list .col-md-4::before {
    content: '✓';
    color: #43e97b;
    font-weight: bold;
    font-size: 16px;
    width: 20px;
    height: 20px;
    background: #43e97b20;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ========================================
   DESCRIPTION - ENHANCED STYLING
   ======================================== */

.os_property-item .os_property_content {
    padding: 25px 20px;
    border-bottom: 2px solid #e9ecef;
    line-height: 1.8;
    color: #495057;
    font-size: 15px;
}

.os_property-item .os_property_content p {
    margin-bottom: 15px;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 768px) {
    .os_property-item ul.additional-details,
    .neighborhood-section ul.additional-details,
    .os_property-item .features .arrow-bullet-list .listing-features {
        grid-template-columns: 1fr;
    }
    
    .neighborhood-section ul.additional-details li {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .neighborhood-section ul.additional-details li span {
        align-self: flex-end;
    }
}

@media (max-width: 480px) {
    .os_property-item .content h4.additional-title,
    .neighborhood-section h4.additional-title,
    .os_property-item .features h4.title {
        font-size: 14px;
        padding: 12px 15px;
    }
    
    .os_property-item ul.additional-details,
    .neighborhood-section ul.additional-details {
        gap: 10px;
    }
    
    .os_property-item ul.additional-details li,
    .neighborhood-section ul.additional-details li {
        padding: 12px 15px;
    }
}
/* ========================================
   FEATURES SECTION - MODERN TABS & LAYOUT
   ======================================== */

.os_property-item .features {
    background-color: #fff;
    border-bottom: 2px solid #e9ecef;
    padding: 0;
    margin-bottom: 20px;
}

.os_property-item .features h4.title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    padding: 15px 20px;
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 10px;
}

.os_property-item .features h4.title::before {
    content: '⭐';
    font-size: 24px;
}

/* Feature Tabs Navigation */
.feature-tabs-nav {
    display: flex;
    background: #f8f9fa;
    border-bottom: 2px solid #e9ecef;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.feature-tab-btn {
    background: transparent;
    border: none;
    padding: 15px 25px;
    font-size: 14px;
    font-weight: 600;
    color: #495057;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 8px;
}

.feature-tab-btn::before {
    content: '✓';
    width: 24px;
    height: 24px;
    background: #e9ecef;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #667eea;
    font-weight: bold;
    font-size: 14px;
}

.feature-tab-btn:hover {
    background: #e9ecef;
    color: #2c3e50;
}

.feature-tab-btn.active {
    background: #fff;
    color: #667eea;
    border-bottom: 3px solid #667eea;
}

.feature-tab-btn.active::before {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

/* Feature Content */
.os_property-item .features .arrow-bullet-list {
    padding: 0;
    margin: 0;
}

.os_property-item .features .listing-features {
    padding: 20px;
}

/* Feature Groups (Base, Parking, Building) */
.feature-group-container {
    display: none;
}

.feature-group-container.active {
    display: block;
}

.feature-group-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 15px;
    margin-bottom: 20px;
}

.feature-group-item {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 15px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.feature-group-item:hover {
    background: linear-gradient(135deg, #667eea15 0%, #764ba215 100%);
    border-color: #667eea;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15);
}

.feature-group-item strong {
    color: #2c3e50;
    font-weight: 600;
    font-size: 14px;
}

.feature-group-item span {
    color: #667eea;
    font-weight: 700;
    font-size: 16px;
}

/* Amenities List (2 columns) */
.amenities-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    padding: 20px;
}

.amenity-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 15px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 14px;
    color: #495057;
}

.amenity-item::before {
    content: '✓';
    color: #43e97b;
    font-weight: bold;
    font-size: 16px;
    width: 24px;
    height: 24px;
    background: #43e97b20;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.amenity-item:hover {
    background: linear-gradient(135deg, #43e97b15 0%, #38f9d715 100%);
    border-color: #43e97b;
    transform: translateX(5px);
}

/* Legacy support for existing structure */
.os_property-item .features .arrow-bullet-list .span4,
.os_property-item .features .arrow-bullet-list .col-md-4 {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 12px 15px;
    margin: 0 0 12px 0;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 10px;
}

.os_property-item .features .arrow-bullet-list .span4::before,
.os_property-item .features .arrow-bullet-list .col-md-4::before {
    content: '✓';
    color: #43e97b;
    font-weight: bold;
    font-size: 16px;
    width: 24px;
    height: 24px;
    background: #43e97b20;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.os_property-item .features .arrow-bullet-list .span4:hover,
.os_property-item .features .arrow-bullet-list .col-md-4:hover {
    background: linear-gradient(135deg, #43e97b15 0%, #38f9d715 100%);
    border-color: #43e97b;
    transform: translateX(5px);
}

/* Responsive */
@media (max-width: 768px) {
    .feature-tabs-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    
    .feature-tab-btn {
        padding: 12px 20px;
        font-size: 13px;
    }
    
    .amenities-list {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    
    .feature-group-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .feature-tab-btn {
        padding: 10px 15px;
        font-size: 12px;
    }
    
    .feature-tab-btn::before {
        width: 20px;
        height: 20px;
        font-size: 12px;
    }
    
    .os_property-item .features .listing-features,
    .amenities-list {
        padding: 15px;
    }
    
    .amenity-item {
        padding: 10px 12px;
        font-size: 13px;
    }
}
/* ========================================
   FEATURES SECTION - BASED ON ACTUAL HTML
   ======================================== */

.os_property-item .features {
    background-color: #fff !important;
    border-bottom: 2px solid #e9ecef !important;
    padding: 0 !important;
    margin-bottom: 20px !important;
}

.os_property-item .features h4.title {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    padding: 15px 20px !important;
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    border-radius: 0 !important;
}

.os_property-item .features .arrow-bullet-list {
    margin: 0 !important;
    padding: 0 !important;
}

.os_property-item .features .listing-features {
    display: block !important;
}

/* ========================================
   CORE FIELDS SECTION
   ======================================== */

.os_property-item .features .core-fields-section {
    padding: 25px !important;
    background: #fff !important;
    border-bottom: 3px solid #e9ecef !important;
}

/* Main row container */
.os_property-item .features .core-fields-section > .row {
    margin: 0 0 20px 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
}

.os_property-item .features .core-fields-section > .row:last-child {
    margin-bottom: 0 !important;
}

/* Each group column (col-md-6) */
.os_property-item .features .core-fields-section .col-md-6 {
    width: calc(50% - 10px) !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
    transition: all 0.3s ease !important;
}

.os_property-item .features .core-fields-section .col-md-6:hover {
    border-color: #667eea !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.15) !important;
    transform: translateY(-2px) !important;
}

/* Group heading (h4) */
.os_property-item .features .core-fields-section .col-md-6 h4 {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    padding: 12px 15px !important;
    margin: 0 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    border-bottom: 2px solid rgba(255,255,255,0.2) !important;
}

/* Field rows inside each group */
.os_property-item .features .core-fields-section .col-md-6 > .row {
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    border-bottom: 1px solid #f0f0f0 !important;
    transition: all 0.3s ease !important;
}

.os_property-item .features .core-fields-section .col-md-6 > .row:last-child {
    border-bottom: none !important;
}

.os_property-item .features .core-fields-section .col-md-6 > .row:hover {
    background: linear-gradient(135deg, #43e97b10 0%, #38f9d710 100%) !important;
}

/* Field container (col-md-12) */
.os_property-item .features .core-fields-section .col-md-6 > .row > .col-md-12 {
    width: 100% !important;
    padding: 12px 15px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* Field label (with checkmark) */
.os_property-item .features .core-fields-section .fieldlabel {
    color: #495057 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding-left: 35px !important;
    position: relative !important;
    flex: 1 !important;
}

.os_property-item .features .core-fields-section .fieldlabel::before {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 14px !important;
    width: 24px !important;
    height: 24px !important;
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%) !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 2px 6px rgba(67, 233, 123, 0.3) !important;
}

/* Field value (NO icon) */
.os_property-item .features .core-fields-section .fieldvalue {
    color: #667eea !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding-left: 15px !important;
    text-align: right !important;
}

/* ========================================
   AMENITIES SECTION
   ======================================== */

.os_property-item .features .amenities-section {
    padding: 25px !important;
    background: #fafbfc !important;
}

/* Amenities container */
.os_property-item .features .amenities-section .col-md-12 {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Amenities heading (optional - add if needed) */
.os_property-item .features .amenities-section::before {
    content: 'Amenities' !important;
    display: block !important;
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%) !important;
    color: #fff !important;
    padding: 12px 15px !important;
    margin: -25px -25px 20px -25px !important;
    font-weight: 600 !important;
    font-size: 15px !important;
}

/* Amenity rows */
.os_property-item .features .amenities-section .row {
    margin: 0 0 12px 0 !important;
    display: flex !important;
    gap: 12px !important;
}

.os_property-item .features .amenities-section .row:last-child {
    margin-bottom: 0 !important;
}

/* Amenity items (col-md-6) */
.os_property-item .features .amenities-section .col-md-6 {
    width: calc(50% - 6px) !important;
    padding: 12px 15px !important;
    margin: 0 !important;
    background: #fff !important;
    border: 1px solid #e9ecef !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
    color: #495057 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.os_property-item .features .amenities-section .col-md-6:hover {
    background: #fff !important;
    border-color: #43e97b !important;
    transform: translateX(5px) !important;
    box-shadow: 0 3px 10px rgba(67, 233, 123, 0.2) !important;
}

/* SVG icon styling */
.os_property-item .features .amenities-section .col-md-6 svg {
    width: 24px !important;
    height: 24px !important;
    padding: 4px !important;
    background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%) !important;
    border-radius: 50% !important;
    color: #fff !important;
    flex-shrink: 0 !important;
    box-shadow: 0 2px 6px rgba(67, 233, 123, 0.3) !important;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 992px) {
    .os_property-item .features .core-fields-section .col-md-6 {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    .os_property-item .features .core-fields-section,
    .os_property-item .features .amenities-section {
        padding: 20px 15px !important;
    }
    
    .os_property-item .features .core-fields-section > .row {
        gap: 15px !important;
    }
    
    .os_property-item .features .amenities-section .col-md-6 {
        width: 100% !important;
    }
    
    .os_property-item .features .amenities-section .row {
        flex-direction: column !important;
        gap: 10px !important;
    }
}

@media (max-width: 480px) {
    .os_property-item .features h4.title {
        font-size: 16px !important;
        padding: 12px 15px !important;
    }
    
    .os_property-item .features .core-fields-section,
    .os_property-item .features .amenities-section {
        padding: 15px 10px !important;
    }
    
    .os_property-item .features .core-fields-section .fieldlabel,
    .os_property-item .features .amenities-section .col-md-6 {
        font-size: 13px !important;
    }
    
    .os_property-item .features .core-fields-section .fieldlabel {
        padding-left: 30px !important;
    }
    
    .os_property-item .features .core-fields-section .fieldlabel::before,
    .os_property-item .features .amenities-section .col-md-6 svg {
        width: 22px !important;
        height: 22px !important;
    }
    
    .os_property-item .features .amenities-section::before {
        margin: -15px -10px 15px -10px !important;
    }
}

/* ========================================
   UTILITY CLASSES
   ======================================== */

.os_property-item .features .clearfix {
    display: none !important;
}

.os_property-item .features .noleftmargin {
    margin-left: 0 !important;
}

.os_property-item .features .nopadding {
    padding: 0 !important;
}

/* ========================================
   PROPERTY META ACTIONS - MODERN DESIGN
   ======================================== */

.property-meta {
    background: #fff !important;
    border: 1px solid #e9ecef !important;
    border-radius: 10px !important;
    padding: 15px 20px !important;
    margin: 20px 0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
}

.property-meta.clearfix::after {
    content: '' !important;
    display: table !important;
    clear: both !important;
}

/* List container */
.property-meta .listingActions-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}

/* Individual list items */
.property-meta .propertyinfoli {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
}

/* Action links/buttons */
.property-meta .propertyinfoli a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #f8f9fa !important;
    border: 1px solid #e9ecef !important;
    border-radius: 10px !important;
    color: #6c757d !important;
    font-size: 20px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    cursor: pointer !important;
    text-decoration: none !important;
    position: relative !important;
}

/* SVG icons */
.property-meta .propertyinfoli a svg {
    width: 22px !important;
    height: 22px !important;
    fill: currentColor !important;
    transition: all 0.3s ease !important;
}

/* ========================================
   SPECIFIC BUTTON STYLES
   ======================================== */

/* Edit button */
.property-meta .propertyinfoli a[href*="property_edit"] {
    color: #667eea !important;
}

.property-meta .propertyinfoli a[href*="property_edit"]:hover {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    border-color: #667eea !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4) !important;
}

/* Get Directions button */
.property-meta .propertyinfoli a[href*="direction_map"] {
    color: #3498db !important;
}

.property-meta .propertyinfoli a[href*="direction_map"]:hover {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%) !important;
    color: #fff !important;
    border-color: #3498db !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(52, 152, 219, 0.4) !important;
}

/* Compare button (not active) */
.property-meta .propertyinfoli a[data-action-type="compare"]:not(.active) {
    color: #667eea !important;
}

.property-meta .propertyinfoli a[data-action-type="compare"]:not(.active):hover {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    border-color: #667eea !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4) !important;
}

/* Compare button (active) */
.property-meta .propertyinfoli a[data-action-type="compare"].active {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #fff !important;
    border-color: #667eea !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3) !important;
}

.property-meta .propertyinfoli a[data-action-type="compare"].active:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4) !important;
}

/* Favorite button (not active) */
.property-meta .propertyinfoli a[data-action-type="favorite"]:not(.active) {
    color: #e74c3c !important;
}

.property-meta .propertyinfoli a[data-action-type="favorite"]:not(.active):hover {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;
    color: #fff !important;
    border-color: #e74c3c !important;
    transform: translateY(-3px) scale(1.1) !important;
    box-shadow: 0 6px 16px rgba(231, 76, 60, 0.4) !important;
}

/* Favorite button (active) */
.property-meta .propertyinfoli a[data-action-type="favorite"].active {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;
    color: #fff !important;
    border-color: #e74c3c !important;
    box-shadow: 0 4px 12px rgba(231, 76, 60, 0.3) !important;
}

.property-meta .propertyinfoli a[data-action-type="favorite"].active:hover {
    transform: translateY(-3px) scale(1.1) !important;
    box-shadow: 0 6px 16px rgba(231, 76, 60, 0.4) !important;
}

/* PDF button */
.property-meta .propertyinfoli a[href*="property_pdf"] {
    color: #e74c3c !important;
}

.property-meta .propertyinfoli a[href*="property_pdf"]:hover {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;
    color: #fff !important;
    border-color: #e74c3c !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(231, 76, 60, 0.4) !important;
}

/* Print button */
.property-meta .propertyinfoli a[href*="property_print"] {
    color: #95a5a6 !important;
}

.property-meta .propertyinfoli a[href*="property_print"]:hover {
    background: linear-gradient(135deg, #95a5a6 0%, #7f8c8d 100%) !important;
    color: #fff !important;
    border-color: #95a5a6 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(149, 165, 166, 0.4) !important;
}

/* Report button */
.property-meta .propertyinfoli a.reportmodal[href*="property_reportForm"] {
    color: #f39c12 !important;
}

.property-meta .propertyinfoli a.reportmodal[href*="property_reportForm"]:hover {
    background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%) !important;
    color: #fff !important;
    border-color: #f39c12 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(243, 156, 18, 0.4) !important;
}

/* Panorama button */
.property-meta .propertyinfoli a[href*="property_showpano"] {
    color: #9b59b6 !important;
}

.property-meta .propertyinfoli a[href*="property_showpano"]:hover {
    background: linear-gradient(135deg, #9b59b6 0%, #8e44ad 100%) !important;
    color: #fff !important;
    border-color: #9b59b6 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(155, 89, 182, 0.4) !important;
}

/* ========================================
   TOOLTIPS (Optional - add title attribute)
   ======================================== */

.property-meta .propertyinfoli a[title]::after {
    content: attr(title) !important;
    position: absolute !important;
    bottom: -40px !important;
    left: 50% !important;
    transform: translateX(-50%) scale(0.9) !important;
    background: #2c3e50 !important;
    color: #fff !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    z-index: 1000 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

.property-meta .propertyinfoli a[title]::before {
    content: '' !important;
    position: absolute !important;
    bottom: -8px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    border: 6px solid transparent !important;
    border-bottom-color: #2c3e50 !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
    z-index: 1001 !important;
}

.property-meta .propertyinfoli a[title]:hover::after,
.property-meta .propertyinfoli a[title]:hover::before {
    opacity: 1 !important;
    transform: translateX(-50%) scale(1) !important;
}

/* ========================================
   LOADING STATE
   ======================================== */

.property-meta .propertyinfoli a.loading {
    pointer-events: none !important;
    opacity: 0.6 !important;
}

.property-meta .propertyinfoli a.loading svg {
    animation: spin 0.8s linear infinite !important;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* ========================================
   PULSE ANIMATION FOR ACTIVE STATES
   ======================================== */

.property-meta .propertyinfoli a.active {
    animation: pulse 2s ease-in-out infinite !important;
}

@keyframes pulse {
    0%, 100% {
        box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
    }
    50% {
        box-shadow: 0 4px 20px rgba(102, 126, 234, 0.5);
    }
}

/* ========================================
   RESPONSIVE - MOBILE
   ======================================== */

@media (max-width: 768px) {
    .property-meta {
        padding: 12px 15px !important;
        margin: 15px 0 !important;
        border-radius: 8px !important;
    }
    
    .property-meta .listingActions-list {
        gap: 8px !important;
        justify-content: flex-start !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        padding-bottom: 5px !important;
    }
    
    /* Smaller buttons on mobile */
    .property-meta .propertyinfoli a {
        width: 40px !important;
        height: 40px !important;
        border-radius: 8px !important;
    }
    
    .property-meta .propertyinfoli a svg {
        width: 20px !important;
        height: 20px !important;
    }
    
    /* Hide tooltips on mobile */
    .property-meta .propertyinfoli a[title]::after,
    .property-meta .propertyinfoli a[title]::before {
        display: none !important;
    }
    
    /* Hide specific buttons on mobile */
    .property-meta .propertyinfoli.hidden-phone {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .property-meta {
        padding: 10px 12px !important;
        margin: 12px 0 !important;
    }
    
    .property-meta .listingActions-list {
        gap: 6px !important;
    }
    
    /* Even smaller on very small screens */
    .property-meta .propertyinfoli a {
        width: 38px !important;
        height: 38px !important;
        border-radius: 6px !important;
    }
    
    .property-meta .propertyinfoli a svg {
        width: 18px !important;
        height: 18px !important;
    }
}

/* ========================================
   SCROLLBAR STYLING FOR MOBILE
   ======================================== */

@media (max-width: 768px) {
    .property-meta .listingActions-list::-webkit-scrollbar {
        height: 4px !important;
    }
    
    .property-meta .listingActions-list::-webkit-scrollbar-track {
        background: #f1f3f5 !important;
        border-radius: 4px !important;
    }
    
    .property-meta .listingActions-list::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        border-radius: 4px !important;
    }
    
    .property-meta .listingActions-list::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #764ba2 0%, #667eea 100%) !important;
    }
}

/* ========================================
   ICON SPECIFIC STYLES (osicon-edit)
   ======================================== */

.property-meta .propertyinfoli a i.osicon-edit {
    font-size: 20px !important;
    line-height: 1 !important;
}

/* ========================================
   ACCESSIBILITY
   ======================================== */

.property-meta .propertyinfoli a:focus {
    outline: 2px solid #667eea !important;
    outline-offset: 2px !important;
}

.property-meta .propertyinfoli a:focus:not(:focus-visible) {
    outline: none !important;
}

/* ========================================
   PRINT STYLES
   ======================================== */

@media print {
    .property-meta {
        display: none !important;
    }
}
/* ========================================
   RESPONSIVE - MOBILE (FORCE ONE LINE)
   ======================================== */

@media (max-width: 768px) {
    .property-meta {
        padding: 12px 15px !important;
        margin: 15px 0 !important;
        border-radius: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .property-meta .listingActions-list {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        justify-content: flex-start !important;
        align-items: center !important;
        width: max-content !important;
        min-width: 100% !important;
    }
    
    /* Force list items inline */
    .property-meta .propertyinfoli {
        display: inline-flex !important;
        float: none !important;
        flex-shrink: 0 !important;
        width: auto !important;
    }
    
    /* Smaller buttons on mobile */
    .property-meta .propertyinfoli a {
        width: 40px !important;
        height: 40px !important;
        border-radius: 8px !important;
        flex-shrink: 0 !important;
        display: flex !important;
    }
    
    .property-meta .propertyinfoli a svg {
        width: 20px !important;
        height: 20px !important;
    }
    
    /* Hide tooltips on mobile */
    .property-meta .propertyinfoli a[title]::after,
    .property-meta .propertyinfoli a[title]::before {
        display: none !important;
    }
    
    /* Keep hidden-phone items hidden */
    .property-meta .propertyinfoli.hidden-phone {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .property-meta {
        padding: 10px 12px !important;
        margin: 12px 0 !important;
    }
    
    .property-meta .listingActions-list {
        gap: 6px !important;
    }
    
    /* Even smaller on very small screens */
    .property-meta .propertyinfoli a {
        width: 38px !important;
        height: 38px !important;
        border-radius: 6px !important;
    }
    
    .property-meta .propertyinfoli a svg {
        width: 18px !important;
        height: 18px !important;
    }
}

/* ========================================
   SCROLLBAR STYLING FOR MOBILE
   ======================================== */

@media (max-width: 768px) {
    .property-meta::-webkit-scrollbar {
        height: 4px !important;
    }
    
    .property-meta::-webkit-scrollbar-track {
        background: #f1f3f5 !important;
        border-radius: 4px !important;
        margin: 0 10px !important;
    }
    
    .property-meta::-webkit-scrollbar-thumb {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
        border-radius: 4px !important;
    }
    
    .property-meta::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #764ba2 0%, #667eea 100%) !important;
    }
}

/* Social Share - New Classes */
.social-share-wrapper {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 15px;
    margin: 20px 0;
}

.social-share-buttons {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

.share-label-item {
    background-color: #586162;
    color: #fff;
    padding: 10px 16px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 14px;
}

.share-button-item {
    background: #fff;
    border: 2px solid #e9ecef;
    border-radius: 6px;
    transition: all 0.3s ease;
    list-style: none;
}

.share-button-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.share-button-item a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    color: #333;
    text-decoration: none;
    font-size: 14px;
}

.share-button-item a svg {
    flex-shrink: 0;
}

/* Facebook */
.facebook-share:hover {
    border-color: #1877f2;
    background: #1877f2;
}

.facebook-share:hover a {
    color: #fff;
}

.facebook-share a svg {
    fill: #1877f2;
}

.facebook-share:hover a svg {
    fill: #fff;
}

/* Twitter */
.twitter-share:hover {
    border-color: #000;
    background: #000;
}

.twitter-share:hover a {
    color: #fff;
}

.twitter-share a svg {
    fill: #000;
}

.twitter-share:hover a svg {
    fill: #fff;
}

/* Mobile */
@media (max-width: 768px) {
    .social-share-wrapper {
        padding: 12px;
    }
    
    .social-share-buttons {
        gap: 8px;
    }
    
    .share-button-item a span {
        display: none;
    }
    
    .share-button-item a {
        padding: 10px;
    }
}

.property-ref-badge {
    display: inline-block;
    font-size: 12px;
    color: #6c757d;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 3px;
    padding: 2px 6px;
    margin-top: 4px;
}
