/* Dark Mode Evolve Styles */

:root {
  --dme-bg: #ffffff;
  --dme-text: #1a1a1a;
  --dme-accent: #3498db;
  --dme-transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.dme-dark-mode {
  --dme-bg: #121212;
  --dme-text: #fff;
  --dme-accent: #be9829;
}

/* Base changes */
html.dme-dark-mode body,
body.dme-dark-mode-active,
body.dme-dark-mode-active #page,
body.dme-dark-mode-active .site-content,
html.dme-dark-mode .elementor-section,
body.dme-dark-mode-active .elementor-section,
html.dme-dark-mode .elementor-column,
body.dme-dark-mode-active .elementor-column,
html.dme-dark-mode .elementor-widget-wrap,
body.dme-dark-mode-active .elementor-widget-wrap,
html.dme-dark-mode .elementor-container,
html.dme-dark-mode .elementor-widget-container,
html.dme-dark-mode .elementor-column-wrap,
html.dme-dark-mode .elementor-inner,
html.dme-dark-mode section,
body.dme-dark-mode-active section,
html.dme-dark-mode div[data-elementor-type],
body.dme-dark-mode-active div[data-elementor-type],
html.dme-dark-mode .elementor-background-overlay,
body.dme-dark-mode-active .elementor-background-overlay,
/* Houzez Theme Specifics */
html.dme-dark-mode #wrapper,
html.dme-dark-mode .main-wrap,
html.dme-dark-mode .houzez-content-wrap,
html.dme-dark-mode .content-wrap,
html.dme-dark-mode .page-wrap,
html.dme-dark-mode .houzez-page-wrap,
html.dme-dark-mode .property-wrap,
html.dme-dark-mode .item-wrap,
html.dme-dark-mode .item-body,
html.dme-dark-mode .item-header,
html.dme-dark-mode .agent-wrap,
html.dme-dark-mode .dashboard-wrap,
html.dme-dark-mode .dashboard-content-area,
html.dme-dark-mode .bg-white,
html.dme-dark-mode .white-bg,
html.dme-dark-mode .houzez-module,
html.dme-dark-mode .board-panel,
html.dme-dark-mode [class*="header-v"],
html.dme-dark-mode [class*="footer-v"],
html.dme-dark-mode .top-bar-wrap,
html.dme-dark-mode .top-bar,
html.dme-dark-mode .header-main-wrap,
html.dme-dark-mode .header-main,
html.dme-dark-mode .nav-area,
html.dme-dark-mode .footer-wrap,
html.dme-dark-mode .footer,
html.dme-dark-mode .advanced-search,
html.dme-dark-mode .search-wrap,
html.dme-dark-mode .fw-property-wrap,
html.dme-dark-mode .dashboard-sidebar {
  background-color: var(--dme-bg) !important;
  color: var(--dme-text) !important;
  transition: background-color var(--dme-transition),
    color var(--dme-transition);
}

html.dme-dark-mode body h1,
html.dme-dark-mode body h2,
html.dme-dark-mode body h3,
html.dme-dark-mode body h4,
html.dme-dark-mode body h5,
html.dme-dark-mode body h6,
html.dme-dark-mode body p,
html.dme-dark-mode body span,
html.dme-dark-mode body li,
html.dme-dark-mode body i,
html.dme-dark-mode body label,
html.dme-dark-mode body a:not(.btn),
html.dme-dark-mode .item-title a,
html.dme-dark-mode .item-price,
html.dme-dark-mode .item-amenities,
html.dme-dark-mode .item-address,
html.dme-dark-mode .agent-list-wrap,
html.dme-dark-mode .houzez-module-title,
html.dme-dark-mode .dashboard-content-area,
body.dme-dark-mode-active h1,
body.dme-dark-mode-active h2,
body.dme-dark-mode-active h3,
body.dme-dark-mode-active h4,
body.dme-dark-mode-active h5,
body.dme-dark-mode-active h6,
body.dme-dark-mode-active p,
body.dme-dark-mode-active span,
body.dme-dark-mode-active li,
body.dme-dark-mode-active i,
body.dme-dark-mode-active label,
body.dme-dark-mode-active a:not(.btn) {
  color: var(--dme-text) !important;
}

html.dme-dark-mode body a:hover,
body.dme-dark-mode-active a:hover {
  color: var(--dme-accent) !important;
}

/* Glassmorphism Toggle */
.dme-toggle-btn {
  position: fixed;
  z-index: 9999;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: var(--dme-transition);
}

.dme-toggle-btn:hover {
  transform: scale(1.1);
}

html.dme-dark-mode .dme-toggle-btn {
  background: rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(255, 255, 255, 0.1);
}

.dme-toggle-btn svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Toggle Positions */
.dme-bottom-right {
  bottom: 30px;
  right: 30px;
}
.dme-bottom-left {
  bottom: 30px;
  left: 30px;
}
.dme-top-right {
  top: 30px;
  right: 30px;
}
.dme-top-left {
  top: 30px;
  left: 30px;
}

/* Dark mode specific overrides */
body.dme-dark-mode-active .entry-content,
body.dme-dark-mode-active .main-navigation,
body.dme-dark-mode-active .site-header,
body.dme-dark-mode-active .site-footer,
body.dme-dark-mode-active .elementor-location-header,
body.dme-dark-mode-active .elementor-location-footer {
  background-color: var(--dme-bg) !important;
  color: var(--dme-text) !important;
}

/* Elementor: keep background images; darken text + obvious white boxes */
html.dme-dark-mode .elementor-widget-container,
html.dme-dark-mode .elementor-text-editor,
html.dme-dark-mode .elementor-heading-title,
body.dme-dark-mode-active .elementor-widget-container,
body.dme-dark-mode-active .elementor-text-editor,
body.dme-dark-mode-active .elementor-heading-title {
  color: var(--dme-text) !important;
}

html.dme-dark-mode .elementor-element.elementor-element-edit-mode,
body.dme-dark-mode-active .elementor-element.elementor-element-edit-mode {
  background-color: transparent !important;
}

/* Houzez: form fields / cards often stay light */
html.dme-dark-mode input[type="text"],
html.dme-dark-mode input[type="email"],
html.dme-dark-mode input[type="password"],
html.dme-dark-mode input[type="search"],
html.dme-dark-mode input[type="number"],
html.dme-dark-mode input[type="tel"],
html.dme-dark-mode input[type="url"],
html.dme-dark-mode textarea,
html.dme-dark-mode select,
body.dme-dark-mode-active input[type="text"],
body.dme-dark-mode-active input[type="email"],
body.dme-dark-mode-active input[type="password"],
body.dme-dark-mode-active input[type="search"],
body.dme-dark-mode-active input[type="number"],
body.dme-dark-mode-active input[type="tel"],
body.dme-dark-mode-active input[type="url"],
body.dme-dark-mode-active textarea,
body.dme-dark-mode-active select {
  background-color: rgba(255, 255, 255, 0.06) !important;
  color: var(--dme-text) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

html.dme-dark-mode input::placeholder,
html.dme-dark-mode textarea::placeholder,
body.dme-dark-mode-active input::placeholder,
body.dme-dark-mode-active textarea::placeholder {
  color: rgba(224, 224, 224, 0.7) !important;
}

/* Make toggle icon readable in both modes */
.dme-toggle-btn {
  color: var(--dme-text);
}

/* Brightness adjustment for images in dark mode */
/* body.dme-dark-mode-active img {
  filter: brightness(0.8) contrast(1.2);
  transition: filter var(--dme-transition);
} */

body.dme-dark-mode-active img:hover {
  filter: brightness(1);
}

/* Smooth transition for all elements */
* {
  transition: background-color var(--dme-transition),
    border-color var(--dme-transition), color var(--dme-transition);
}

body.dme-dark-mode-active .item-listing-wrap .item-footer {
  background: #2f3135;
  border: 0;
}

body.dme-dark-mode-active html .item-listing-wrap .item-body {
  background: #2f3135 !important;
}

body.dme-dark-mode-active .property-tabs-module .nav-tabs {
  border-color: #2f3135 !important;
}

body.dme-dark-mode-active .our-agent-darkmode .agent-item {
  background: #121212 !important;
}

body.dme-dark-mode-active .item-wrap-v9 .item-body {
  border-left: 1px solid #2f3135 !important;
  border-right: 1px solid #2f3135 !important;
  background: #2f3135 !important;
  border: 0;
}

body.dme-dark-mode-active .item-wrap-v9 .item-footer {
  border-left: 1px solid #2f3135 !important;
  border-right: 1px solid #2f3135 !important;
  border-bottom: 1px solid#2f3135 !important;
}

body.dme-dark-mode-active .item-footer button i {
  color: #ad9335 !important;
}

body.dme-dark-mode-active .item-footer button:hover i {
  color: #fff !important;
}

body.dme-dark-mode-active .header-wilson {
  background: #121212 !important;
}

body.dme-dark-mode-active .load-more-btn div#fave-pagination-loadmore a {
  border-radius: 50px;
  color: white !important;
}

.item-buttons-wrap .btn-item {
  border-radius: 30px !important;
}

html.dme-dark-mode .dark-mode-remove-bg .elementor-widget-container {
  background: transparent !important;
}

body.dme-dark-mode-active .hover-effect:before {
  display: none !important;
}

body.dme-dark-mode-active .gt-current-lang {
  background: #121212 !important;
  border: 0 !important;
}

body.dme-dark-mode-active .gt_float_switcher {
  box-shadow: none !important;
  border-radius: 0 !important;
}

body.dme-dark-mode-active .gt_float_switcher .gt_options.gt-open {
  background: #121212 !important;
}

body.dme-dark-mode-active .gt_float_switcher .gt_options {
  background: #121212 !important;
}

body.dme-dark-mode-active .gt_float_switcher .gt_options a:hover {
  background: #121212 !important;
}

div#header-mobile {
  background: #121212 !important;
}

body.dme-dark-mode-active div#nav-mobile {
  background: #121212 !important;
}

html.dme-dark-mode .dme-toggle-btn {
  display: none;
}

.area-custom .grid-item-text-link {
  display: none;
}

.area-custom .hover-effect-flat:before {
  display: none;
}

.area-custom .grid-item-subtitle {
  color: #121212;
  font-weight: 900;
}

.area-custom .grid-item-title {
  font-weight: bold;
  color: #121212;
}

html.dme-dark-mode .dark-mode-remove-bg .elementor-container {
  background: transparent !important;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  div.elementor-column.dark-mode-remove-bg-col {
  background-color: transparent !important;
}

html
  .dark-mode-remove-bg-col
  .elementor-widget-wrap.elementor-element-populated {
  background: transparent !important;
}

html.dme-dark-mode body.dme-dark-mode-active .sidebar-wrap .property-form-wrap {
  background: #121212;
  border-color: #bb9f53 !important;
}

html.dme-dark-mode body.dme-dark-mode-active #pills-tab {
  background: #121212;
  border-color: #bb9f53 !important;
}

html.dme-dark-mode body.dme-dark-mode-active .block-wrap {
  background: #121212;
  border-color: #bb9f53 !important;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  #pills-tab
  .nav-link:hover:not(.active) {
  background-color: #b89d5b;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  .property-overview-wrap
  ul
  .property-overview-item
  strong {
  color: white;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  button.houzez-ele-button.houzez_agent_property_form.btn.btn-secondary.btn-sm-full-width {
  color: #121212;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  .property-form
  button.btn-half-width:first-of-type {
  color: #121212;
}

html.dme-dark-mode
  body.dme-dark-mode-active
  .content-wrap-style-boxed
  .block-wrap,
html.dme-dark-mode body.dme-dark-mode-active .content-wrap-style-boxed .widget,
html.dme-dark-mode
  body.dme-dark-mode-active
  .content-wrap-style-boxed
  .property-form-wrap,
html.dme-dark-mode
  body.dme-dark-mode-active
  .content-wrap-style-boxed
  .item-wrap {
  border-color: #ad9335;
}

html.dme-dark-mode body.dme-dark-mode-active .btn-primary,
html.dme-dark-mode body.dme-dark-mode-active .fc-button-primary,
html.dme-dark-mode
  body.dme-dark-mode-active
  .woocommerce
  nav.woocommerce-pagination
  ul
  li
  a:focus,
html.dme-dark-mode
  body.dme-dark-mode-active
  .woocommerce
  nav.woocommerce-pagination
  ul
  li
  a:hover,
html.dme-dark-mode
  body.dme-dark-mode-active
  .woocommerce
  nav.woocommerce-pagination
  ul
  li
  span.current {
  color: #121212 !important;
}

html body .page-title-wrap .label {
  background: #b89d5b;
}

html body.dme-dark-mode-active .property-labels-wrap a:not(.btn) {
  color: #121212 !important;
}

.property-labels-wrap > div > img {
  filter: brightness(0) invert(1);
}

body .bootstrap-select > .dropdown-toggle.bs-placeholder,
body .bootstrap-select > .dropdown-toggle.bs-placeholder:active,
body .bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
body .bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
  background: #121212;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

body .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
  color: white;
}

body .bootstrap-select .dropdown-menu.inner {
  background: #202020;
}

/* Optional: Targets the list items inside the dark menu */
body .bootstrap-select .dropdown-menu li a {
  color: white;
}

body .bootstrap-select .dropdown-menu li a:hover {
  background: #333333;
}

/* Target the main button container */
body .bootstrap-select > .btn-light.dropdown-toggle,
body .bootstrap-select > .btn-light.dropdown-toggle.bs-placeholder,
body .bootstrap-select > .btn-light.dropdown-toggle:focus,
body .bootstrap-select > .btn-light.dropdown-toggle:hover,
body .bootstrap-select > .btn-light.dropdown-toggle:active {
  background-color: #121212 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: none !important; /* Removes the default Bootstrap glow */
}

/* Target the text inside the button (Të gjitha Qytetet) */
body .bootstrap-select > .btn-light.dropdown-toggle .filter-option-inner-inner {
  color: #ffffff !important;
}

/* Remove the default Bootstrap "light" background on show */
body .show > .btn-light.dropdown-toggle {
  background-color: #202020 !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

/* Style the caret (the little arrow) */
body .bootstrap-select .dropdown-toggle .bs-caret {
  color: #ffffff;
}

/* 1. The main dropdown container */
body .bootstrap-select .dropdown-menu.show {
  background-color: #202020 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* 2. The Search Box wrapper and Input field */
body .bootstrap-select .bs-searchbox {
  background-color: #202020 !important;
  padding: 10px;
}

body .bootstrap-select .bs-searchbox .form-control {
  background-color: #121212 !important;
  color: white !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* 3. The inner list container and the UL */
body .bootstrap-select .inner.show,
body .bootstrap-select ul.dropdown-menu.inner {
  background-color: #202020 !important;
  border: none !important;
}

/* 4. Individual dropdown items (Cities) */
body .bootstrap-select .dropdown-item {
  color: rgba(255, 255, 255, 0.8) !important;
  background-color: transparent !important;
  padding: 8px 20px;
}

/* 5. Hover state for items */
body .bootstrap-select .dropdown-item:hover,
body .bootstrap-select .dropdown-item:focus {
  background-color: #333333 !important;
  color: #ffffff !important;
}

/* 6. Active/Selected item state */
body .bootstrap-select .dropdown-item.active,
body .bootstrap-select .dropdown-item.selected {
  background-color: #b89d5b !important; /* Standard blue, or change to #444 for all-dark */
  color: #ffffff !important;
}

/* 7. The text inside the spans */
body .bootstrap-select .dropdown-item .text {
  color: inherit !important;
}

/* 1. The main pagination link boxes */
body .pagination .page-link {
  background-color: #121212 !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

/* 2. Hover state for page numbers */
body .pagination .page-item:not(.active) .page-link:hover {
  background-color: #202020 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

/* 3. The ACTIVE page (e.g., currently on page 1) */
body .pagination .page-item.active .page-link {
  background-color: #b89d5b !important; /* Keep the blue brand color or use #333 for all dark */
  border-color: #b89d5b !important;
  color: #ffffff !important;
}

/* 4. DISABLED arrows (e.g., the 'Previous' arrow on page 1) */
body .pagination .page-item.disabled .page-link {
  background-color: #0a0a0a !important;
  border-color: rgba(255, 255, 255, 0.05) !important;
  color: #555555 !important; /* Muted gray for disabled state */
  cursor: not-allowed;
}

/* 5. Icons inside the links (Arrows) */
body .pagination .page-link i {
  color: inherit;
}

/* Container for the mobile property title */
body .mobile-property-title {
  background-color: #121212 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1); /* Optional: adds definition */
}

/* The link/button inside the mobile title */
body .mobile-property-title a {
  background-color: #b79c5b !important;
  color: #121212 !important;
  font-weight: 600; /* Makes the text clearer against the gold background */
  display: inline-block;
  padding: 5px 15px; /* Adjusts button sizing if needed */
  border-radius: 4px; /* Matches modern UI patterns */
}

/* Hover state for the gold button */
body .mobile-property-title a:hover,
body .mobile-property-title a:focus {
  background-color: #d4bc82 !important; /* A slightly lighter gold for feedback */
  text-decoration: none;
  color: #000000 !important;
}

body .mobile-postview img {
  filter: brightness(0) invert(1);
}

@media (max-width: 600px) {
  .property-overview-wrap,
  .property-description-wrap,
  .property-detail-wrap,
  .property-contact-agent-wrap {
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 30px;
  }

  body .similar-property-wrap {
    padding: 30px 15px !important;
  }

  .property-video-wrap.property-section-wrap.video-details-block.mb-4 {
    padding-left: 15px;
    padding-right: 15px;
  }

  .page-id-31 div#ht-ctc-chat {
    display: none !important;
  }
}
