@layer properties;
@layer theme, base, components, utilities;
@layer theme {
  :root, :host {
    --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
    --color-red-50: oklch(97.1% 0.013 17.38);
    --color-red-500: oklch(63.7% 0.237 25.331);
    --color-yellow-500: oklch(79.5% 0.184 86.047);
    --color-yellow-800: oklch(47.6% 0.114 61.907);
    --color-blue-500: oklch(62.3% 0.214 259.815);
    --color-blue-600: oklch(54.6% 0.245 262.881);
    --color-gray-50: oklch(98.5% 0.002 247.839);
    --color-gray-100: oklch(96.7% 0.003 264.542);
    --color-gray-200: oklch(92.8% 0.006 264.531);
    --color-gray-300: oklch(87.2% 0.01 258.338);
    --color-gray-400: oklch(70.7% 0.022 261.325);
    --color-gray-500: oklch(55.1% 0.027 264.364);
    --color-gray-600: oklch(44.6% 0.03 256.802);
    --color-gray-700: oklch(37.3% 0.034 259.733);
    --color-gray-800: oklch(27.8% 0.033 256.848);
    --color-gray-900: oklch(21% 0.034 264.665);
    --color-black: #000;
    --color-white: #fff;
    --spacing: 0.25rem;
    --container-sm: 24rem;
    --container-3xl: 48rem;
    --container-5xl: 64rem;
    --container-7xl: 80rem;
    --text-xs: 0.75rem;
    --text-xs--line-height: calc(1 / 0.75);
    --text-sm: 0.875rem;
    --text-sm--line-height: calc(1.25 / 0.875);
    --text-base: 1rem;
    --text-base--line-height: calc(1.5 / 1);
    --text-lg: 1.125rem;
    --text-lg--line-height: calc(1.75 / 1.125);
    --text-xl: 1.25rem;
    --text-xl--line-height: calc(1.75 / 1.25);
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --leading-tight: 1.25;
    --radius-md: 0.375rem;
    --radius-lg: 0.5rem;
    --radius-xl: 0.75rem;
    --radius-2xl: 1rem;
    --blur-sm: 8px;
    --default-transition-duration: 150ms;
    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
  }
}
@layer base {
  /* 1. Scope the reset ONLY to the plugin's containers to protect your theme */
  .kba-main-search-container *, .kba-main-search-container ::after, .kba-main-search-container ::before,
  #mrt-modal *, #mrt-modal ::after, #mrt-modal ::before,
  #filter-modal *, #filter-modal ::after, #filter-modal ::before,
  #custom-toast *, #custom-toast ::after, #custom-toast ::before { 
      box-sizing: border-box; 
      border: 0 solid; 
  }
  
  /* 2. Reset buttons and inputs ONLY inside the plugin */
  .kba-main-search-container button, .kba-main-search-container input,
  #mrt-modal button, #mrt-modal input,
  #filter-modal button, #filter-modal input { 
      font: inherit; 
      color: inherit; 
      background-color: transparent; 
      margin: 0;
      padding: 0;
  }
  
  /* 3. Keep the hidden utility */
  [hidden]:where(:not([hidden='until-found'])) { display: none!important; }
}
@layer utilities {
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; }
  .absolute { position: absolute; } .fixed { position: fixed; } .relative { position: relative; }
  .inset-0 { inset: 0; } .top-6 { top: calc(var(--spacing) * 6); } .top-full { top: 100%; }
  .left-0 { left: 0; } .left-1\/2 { left: 50%; }
  .z-\[999\] { z-index: 999; } .z-\[9999\] { z-index: 9999; } .z-\[10000\] { z-index: 10000; }
  .mx-auto { margin-inline: auto; } .mt-2 { margin-top: calc(var(--spacing) * 2); } .mt-4 { margin-top: calc(var(--spacing) * 4); }
  .mb-1 { margin-bottom: var(--spacing); } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } .mb-3 { margin-bottom: calc(var(--spacing) * 3); } .mb-4 { margin-bottom: calc(var(--spacing) * 4); } .mb-5 { margin-bottom: calc(var(--spacing) * 5); }
  .ml-2 { margin-left: calc(var(--spacing) * 2); } .ml-auto { margin-left: auto; }
  .block { display: block; } .flex { display: flex; } .hidden { display: none; } .inline-flex { display: inline-flex; }
  .h-4 { height: calc(var(--spacing) * 4); } .h-5 { height: calc(var(--spacing) * 5); } .h-6 { height: calc(var(--spacing) * 6); }
  .max-h-\[85vh\] { max-height: 85vh; } .max-h-\[90vh\] { max-height: 90vh; }
  .w-1\/2 { width: 50%; } .w-4 { width: calc(var(--spacing) * 4); } .w-5 { width: calc(var(--spacing) * 5); } .w-6 { width: calc(var(--spacing) * 6); } .w-10 { width: calc(var(--spacing) * 10); } .w-16 { width: calc(var(--spacing) * 16); } .w-36 { width: calc(var(--spacing) * 36); } .w-44 { width: calc(var(--spacing) * 44); } .w-48 { width: calc(var(--spacing) * 48); } .w-56 { width: calc(var(--spacing) * 56); } .w-64 { width: calc(var(--spacing) * 64); } .w-80 { width: calc(var(--spacing) * 80); } .w-\[60\%\] { width: 60%; } .w-\[90\%\] { width: 90%; } .w-\[95\%\] { width: 95%; } .w-full { width: 100%; }
  .max-w-3xl { max-width: var(--container-3xl); } .max-w-5xl { max-width: var(--container-5xl); } .max-w-7xl { max-width: var(--container-7xl); } .max-w-sm { max-width: var(--container-sm); }
  .flex-1 { flex: 1; }
  .-translate-x-1\/2 { translate: -50% var(--tw-translate-y); }
  .cursor-pointer { cursor: pointer; } .flex-col { flex-direction: column; } .flex-wrap { flex-wrap: wrap; }
  .items-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .justify-end { justify-content: flex-end; }
  .gap-2 { gap: calc(var(--spacing) * 2); } .gap-3 { gap: calc(var(--spacing) * 3); } .gap-4 { gap: calc(var(--spacing) * 4); }
  .overflow-hidden { overflow: hidden; } .overflow-y-auto { overflow-y: auto; }
  .rounded { border-radius: 0.25rem; } .rounded-2xl { border-radius: var(--radius-2xl); } .rounded-full { border-radius: 9999px; } .rounded-lg { border-radius: var(--radius-lg); } .rounded-md { border-radius: var(--radius-md); } .rounded-xl { border-radius: var(--radius-xl); }
  .border { border-width: 1px; } .border-0 { border-width: 0px; } .border-2 { border-width: 2px; } .border-t { border-top-width: 1px; } .border-b { border-bottom-width: 1px; }
  .border-gray-100 { border-color: var(--color-gray-100); } .border-gray-200 { border-color: var(--color-gray-200); } .border-gray-300 { border-color: var(--color-gray-300); } .border-red-500 { border-color: var(--color-red-500); }
  .bg-\[\#0B5C66\] { background-color: #0B5C66; } .bg-\[\#0EA5E9\] { background-color: #0EA5E9; } .bg-\[\#F8FBFF\] { background-color: #F8FBFF; } .bg-\[\#FFC107\] { background-color: #FFC107; }
  .bg-black { background-color: var(--color-black); } .bg-gray-300 { background-color: var(--color-gray-300); } .bg-gray-700 { background-color: var(--color-gray-700); } .bg-transparent { background-color: transparent; } .bg-white { background-color: var(--color-white); }
  .p-1 { padding: var(--spacing); } .p-2 { padding: calc(var(--spacing) * 2); } .p-3 { padding: calc(var(--spacing) * 3); } .p-5 { padding: calc(var(--spacing) * 5); } .p-6 { padding: calc(var(--spacing) * 6); }
  .px-2 { padding-inline: calc(var(--spacing) * 2); } .px-3 { padding-inline: calc(var(--spacing) * 3); } .px-4 { padding-inline: calc(var(--spacing) * 4); } .px-5 { padding-inline: calc(var(--spacing) * 5); } .px-6 { padding-inline: calc(var(--spacing) * 6); } .px-8 { padding-inline: calc(var(--spacing) * 8); } .px-12 { padding-inline: calc(var(--spacing) * 12); }
  .py-0\.5 { padding-block: calc(var(--spacing) * 0.5); } .py-2 { padding-block: calc(var(--spacing) * 2); } .py-3 { padding-block: calc(var(--spacing) * 3); } .py-5 { padding-block: calc(var(--spacing) * 5); }
  .text-center { text-align: center; } .text-left { text-align: left; }
  .font-sans { font-family: var(--font-sans); }
  .text-lg { font-size: var(--text-lg); line-height: var(--text-lg--line-height); }
  .text-sm { font-size: var(--text-sm); line-height: var(--text-sm--line-height); }
  .text-xl { font-size: var(--text-xl); line-height: var(--text-xl--line-height); }
  .text-xs { font-size: var(--text-xs); line-height: var(--text-xs--line-height); }
  .text-\[11px\] { font-size: 11px; } .text-\[12px\] { font-size: 12px; } .text-\[14px\] { font-size: 14px; } .text-\[15px\] { font-size: 15px; }
  .font-bold { font-weight: var(--font-weight-bold); } .font-medium { font-weight: var(--font-weight-medium); } .font-normal { font-weight: var(--font-weight-normal); }
  .text-gray-400 { color: var(--color-gray-400); } .text-gray-500 { color: var(--color-gray-500); } .text-gray-600 { color: var(--color-gray-600); } .text-gray-700 { color: var(--color-gray-700); } .text-gray-800 { color: var(--color-gray-800); } .text-gray-900 { color: var(--color-gray-900); } .text-red-500 { color: var(--color-red-500); } .text-white { color: var(--color-white); } .text-yellow-800 { color: var(--color-yellow-800); }
  .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); } .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1); } .shadow-sm { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); }
  .transition { transition: all var(--default-transition-duration) var(--default-transition-timing-function); }
  .outline-none { outline: none; }
  .peer:checked ~ .peer-checked\:bg-blue-500 { background-color: var(--color-blue-500); }
  .peer:checked ~ .peer-checked\:after\:translate-x-full::after { translate: 100% 0; }
  .peer:checked ~ .peer-checked\:after\:border-white::after { border-color: var(--color-white); }
  .md\:block { display: none; } .md\:hidden { display: block; }
  @media (min-width: 768px) {
    .md\:block { display: block; } .md\:hidden { display: none; }
    .md\:p-8 { padding: calc(var(--spacing) * 8); }
    .md\:px-8 { padding-inline: calc(var(--spacing) * 8); }
    .md\:text-base { font-size: var(--text-base); line-height: var(--text-base--line-height); }
  }
}

.kba-filter-group {
    margin-top: 24px;
}
/* Specific styling for the 'Is Corporate' toggle container and switch */
#is-corporate-toggle-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #E5E7EB; /* Gray-200 */
    background-color: white;
    border-radius: 8px;
    padding: 12px;
    width: 256px; /* w-64 */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

/* The label wrapper */
#is-corporate-toggle-container label {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

/* The background track */
#is-corporate-toggle-container .toggle-track {
    width: 40px; /* w-10 */
    height: 20px; /* h-5 */
    background-color: #D1D5DB; /* Gray-300 */
    border-radius: 9999px;
    position: relative;
    transition: background-color 0.3s;
}

/* The circular thumb */
#is-corporate-toggle-container .toggle-track::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px; /* h-4 */
    height: 16px; /* w-4 */
    background-color: white;
    border-radius: 9999px;
    transition: transform 0.3s;
}

/* Checked State */
#is-corporate-toggle:checked + .toggle-track {
    background-color: #3B82F6; /* Blue-500 */
}

#is-corporate-toggle:checked + .toggle-track::after {
    transform: translateX(20px);
}
/* ========== Form Elements & Utilities ======== */
.custom-radio-input:checked + .custom-radio-box { background-color: #FFC107; border-color: #FFC107; }
.custom-radio-input:checked + .custom-radio-box::after { content: '✓'; color: white; font-size: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.btn-radio:checked + .btn-label { border-color: #0EA5E9; color: #0EA5E9; background-color: #F0F9FF; }
.modal-scroll::-webkit-scrollbar { width: 6px; }
.modal-scroll::-webkit-scrollbar-thumb { background-color: #CBD5E1; border-radius: 10px; }
.mrt-checkbox:checked + div { background-color: #0EA5E9; border-color: #0EA5E9; }
.mrt-checkbox:checked + div::after { content: '✓'; color: white; font-size: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.range-slider-container { position: relative; width: 100%; height: 6px; background: #CBD5E1; border-radius: 5px; margin-top: 15px; margin-bottom: 10px; }
.range-slider-progress { position: absolute; left: 0%; right: 0%; height: 100%; background: #0EA5E9; border-radius: 5px; }
.range-slider-container input[type="range"] { position: absolute; width: 100%; height: 6px; top: -2px; -webkit-appearance: none; background: none; pointer-events: none; outline: none; }
.range-slider-container input[type="range"]::-webkit-slider-thumb { height: 20px; width: 12px; border-radius: 4px; background: #0EA5E9; border: 1px solid white; pointer-events: auto; -webkit-appearance: none; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.3); }
#main-search-input { border: none !important; }

/* ========== Search Form Specific Overrides ======== */
.pb-2 { padding-bottom: 10px; }
.kba-group-title { font-size: 15px !important; }
#nav-input-min-price, #nav-input-max-price, #modal-input-min-price, #modal-input-max-price, #modal-input-min-size, #modal-input-max-size { border: none; padding: 0; width: auto; }
#btn-submit-search, #btn-apply-mrt, #btn-reset-mrt, #btn-reset-filters, #btn-apply-filters, #close-toast { border-radius: 8px; background: #5865F2; border: none; color: #fff; font-size: 13px; font-style: normal; font-weight: 700; padding: 15px 30px; }
#btn-reset-mrt, #btn-reset-filters { color: #183f69; background: #27aae21a; }
.close-mrt-modal, .close-filter-modal { border: none; background: transparent !important; color: #c36 !important; padding: 0; }
.max-w-7xl > .flex-wrap > div, .max-w-7xl > .flex-wrap > button { flex: 1 1 auto !important; width: auto !important; }
.dropdown-trigger svg { width: 20px; }
.modal-title { margin: 0; }
.kba-dd-title { color: #323232; font-family: "Encode Sans Expanded", sans-serif; font-size: 13px; font-weight: 500; white-space: nowrap; }
.kba-dd-des { color: rgba(50, 50, 50, 0.50); font-family: "Encode Sans Expanded", sans-serif; font-size: 11px; font-style: normal; font-weight: 400; }
#main-filter-badge { border-radius: 50px; background: rgba(50, 50, 50, 0.25); height: 20px; width: 20px; display: flex; justify-content: center; align-items: center; font-family: "Encode Sans Expanded", sans-serif; font-size: 12px; }
.max-w-7xl > .flex-wrap .dropdown-trigger { width: 100% !important; }
.kba-trigger-button { border-radius: 12px; border: 1px solid #D4D1EA; background: #F7F6FE !important; padding: 15px; }
.kba-mrt-list-container:not(:first-child) { margin-top: 10px; }
.dropdown-trigger.flex { display: flex; gap: 10px; }
.dropdown-container label { display: flex; }

/* Modal Blur Fixes */
#mrt-modal, #filter-modal { background-color: rgba(0, 0, 0, 0.5) !important; -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important; }
#mrt-modal > div, #filter-modal > div { background-color: #FFFFFF !important; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important; }
#mrt-container label { display: flex; }

/* MRT Grid Layout */
#mrt-modal .grid { display: grid !important; grid-template-columns: repeat(1, minmax(0, 1fr)) !important; row-gap: 12px !important; column-gap: 16px !important; padding-left: 8px !important; }
@media (min-width: 768px) { #mrt-modal .grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (min-width: 1024px) { #mrt-modal .grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
#mrt-modal .grid > label { display: flex !important; align-items: flex-start !important; gap: 12px !important; margin: 0 !important; }

/* Mobile Overrides */
@media (max-width: 768px){
    .kba-modal-header, .kba-modal-footer { padding: 10px !important; }
    #btn-submit-search { padding: 8px 10px; }
    #btn-open-filter-modal { border-radius: 8px; background: #5865F2; border: none; color: #fff; font-size: 13px; font-style: normal; font-weight: 700; padding: 8px 7px; }
    #btn-open-filter-modal path { fill: #fff; }
    .kba-main-search-container { padding: 20px 10px !important; }
    .kba-filter-button-container { flex-wrap: nowrap; gap: 3px; }
    .kba-trigger-button { gap: 3px !important; }
    .max-w-7xl > .flex-wrap .dropdown-trigger, #btn-open-mrt-modal { padding: 5px 7px; }
    .kba-dd-title { font-size: 11px; }
    .kba-dd-des { font-size: 9px; }
    #btn-submit-search svg, #btn-open-filter-modal svg { height: 15px; }
    .kba-property-type-dropdown { left: unset; right: 0; }
    .dropdown-trigger svg { width: 12px; }
    #main-search-input { font-size: 12px; }
    #btn-submit-search { display: none; }
    .kba-search-box { border: 1.2px solid #FFBF00 !important; }
    .kba-filter-group {margin-top: 15px;}
}