/* =========================
   DALELAK NEW DARK LUXURY THEME
   Keep Existing Class Names
========================= */

body,
.maincont {
    background: #050816;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

/* =========================
   HEADER
========================= */

.headertopsection {
    background:
        linear-gradient(rgba(5,8,22,0.85), rgba(5,8,22,0.92));
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 0px 0 0px 0;
}

.headertopsection::before {
    background: rgba(130, 71, 255, 0.18);
   
}

.headertopsection::after {
    background: rgba(255, 255, 255, 0.04);
   
}
.btlogoutimg
{
width:60px;
height:60px;
border-radius: 50%;

}
.btlogoutimg img
{
width:100%;
height:100%;
border-radius: 50%;

}
.btlogouticon {
  scale: 0.7;
  padding: 0;
  display: inline-block;
  vertical-align: top;
  text-align: center;
  height: 60px;
  width: 60px;
  border-radius: 50%;
  background: transparent;
}
.btlogouticon img{
  
  height: 60px;
  width: 60px;
  border-radius: 50%;
  background: transparent;
}
#menu1x .btlogouticon
{

display:none;
}

/* =========================
   NAVIGATION
========================= */

.menu ul {
    background: transparent;
}

.menu li a,
#ar .menu li a {
    color: #ffffff;
    font-size: 15px;
    font-weight: 500;
    transition: 0.3s ease;
}

.menu li a:hover {
    color: #9f5cff;
}

.toggle {
    color: #ffffff;
}

/* =========================
   LOGO
========================= */

.logoheaderstyleleft {
    color: #ffffff;
    font-size: 28px;
    font-weight: 700;
}

.logoheaderstyleright {
    color: #b16cff;
    font-size: 28px;
    font-weight: 700;
}

/* =========================
   HERO TITLE
========================= */

.headertitle,
.mainimagetitleheaderclass {
    color: #ffffff;
    text-align: left;
}

.headertitlecolor {
    color: #b16cff;
    font-size: 16px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.ml2 {
    font-size: 4rem;
    line-height: 1.2;
    color: #ffffff;
}

.gradient-text {
    color: #f9b233;
    -webkit-text-fill-color: #f9b233;
}

/* =========================
   BUTTONS
========================= */

.btn,
.btnstandard,
.continue,
.btnaction,
.addtocart,
.moreinfo {
    background: linear-gradient(135deg, #7b2ff7, #b16cff);
    border: none;
    color: #ffffff;
    border-radius: 14px;
    padding: 12px 24px;
    transition: all 0.3s ease;
    box-shadow: 0 10px 30px rgba(123, 47, 247, 0.35);
}

.btn:hover,
.btnstandard:hover,
.continue:hover,
.btnaction:hover,
.addtocart:hover,
.moreinfo:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 40px rgba(123, 47, 247, 0.55);
}

/* =========================
   SEARCH AREA
========================= */

.locationoutsidebox,
.contact-form-style,
.wrappingbox {
    background: rgba(14, 18, 40, 0.92);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 24px;
    backdrop-filter: blur(12px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.45);
}

.locationinsidebox {
    padding: 18px;
}

.inputtextbox,
.inputtextareabox,
.textarea,
.singletextarea,
.searchbox {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.08);
    color: #ffffff;
    border-radius: 14px;
    padding: 14px;
}

.inputtextbox::placeholder,
.textarea::placeholder {
    color: rgba(255,255,255,0.5);
}

/* =========================
   PROPERTY CARDS
========================= */

.item-box,
.divwrapperdynamic,
.divwrapperdynamicnoheight {
    background: linear-gradient(
        180deg,
        rgba(17,22,48,0.95),
        rgba(7,10,25,0.98)
    );
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 10px 35px rgba(0,0,0,0.35);
    transition: all 0.35s ease;
}

.item-box:hover,
.divwrapperdynamic:hover {
    transform: translateY(-8px);
    border-color: rgba(177,108,255,0.5);
    box-shadow: 0 20px 50px rgba(123,47,247,0.25);
}

.item-box img,
.mainimageclass img,
.image-responsive img {
    border-radius: 20px;
    object-fit: cover;
}

/* =========================
   PROPERTY PRICE
========================= */

.labelprice,
.labelpricevalue,
.pricediscount,
.priceclass {
    color: #ffffff;
    font-weight: 700;
}

.labelpricevalue {
    color: #f9b233;
    font-size: 24px;
}

/* =========================
   TITLES
========================= */

h1,
h2,
h3,
h4,
h5,
.section-title .title,
.pageheadertitle,
.deptnametitle {
    color: #ffffff;
    font-weight: 700;
}

.section-title .title {
    font-size: 42px;
}

/* =========================
   CITY CARDS
========================= */

.item-box-cats {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.02);
}

.item-box-cats img {
    object-fit: cover;
    transition: transform 0.4s ease;
}

.item-box-cats:hover img {
    transform: scale(1.08);
}

/* =========================
   STATS SECTION
========================= */

.innerboxwrapper,
.itemslistholderdiv {
    background: rgba(255,255,255,0.03);
    border-radius: 24px;
    border: 1px solid rgba(255,255,255,0.08);
}

/* =========================
   FOOTER
========================= */

.footer-area {
    background: #040611;
    color: rgba(255,255,255,0.8);
    border-top: 1px solid rgba(255,255,255,0.08);
}

.footer-bottom {
    background: #02040b;
    color: rgba(255,255,255,0.5);
}

.footer-area a,
.footer-bottom a {
    color: rgba(255,255,255,0.8);
    transition: 0.3s;
}

.footer-area a:hover {
    color: #b16cff;
}

/* =========================
   SOCIAL ICONS
========================= */

.social_nav li {
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 50%;
    width: 45px;
    height: 45px;
    transition: 0.3s;
}

.social_nav li:hover {
    background: #9f5cff;
    transform: translateY(-4px);
}

/* =========================
   SCROLLBAR
========================= */

::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #070b18;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(#7b2ff7, #b16cff);
    border-radius: 20px;
}

/* =========================
   ANIMATIONS
========================= */

.animate-on-scroll.visible {
    animation: fadeLuxury 0.8s ease forwards;
}

@keyframes fadeLuxury {
    from {
        opacity: 0;
        transform: translateY(40px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* =========================
   MOBILE RESPONSIVE
========================= */

@media screen and (max-width: 768px) {

    .ml2 {
        font-size: 2.3rem;
        text-align: center;
    }

    .menu.active .toggle {
        width: 90vw;
        border-radius: 20px;
        background: #0d1228;
    }

    .item-box {
        width: 100% !important;
    }

    .section-title .title {
        font-size: 28px;
    }

    .headertitle,
    .mainimagetitleheaderclass {
        text-align: center;
    }

    .btn,
    .btnstandard,
    .continue {
        width: 100%;
    }

    .locationoutsidebox {
        padding: 10px;
    }
}