/* =====================================================
   RealtyPlus Custom Framework (No Bootstrap) - FINAL
   - Mobile burger menu
   - Dark theme support
   - Bootstrap-compat subset to keep old markup working
   ===================================================== */

:root{
  --container-width: 1100px;
  --header-height: 92px;
  --gap-sm: 8px;
  --gap-md: 14px;
  --gap-lg: 24px;
  --radius: 14px;
  --border: rgba(255,255,255,.14);
}

/* Reset */
*{ box-sizing:border-box; margin:0; padding:0; }
html, body{ height:100%; }
a{ color: inherit; text-decoration:none; }
a:hover{ text-decoration: underline; }

/* Container */
.container{
  width: 100%;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 18px;
}

/* Main spacing for fixed header */
.main{ padding-top: var(--header-height); }

/* Header */
.site-header{
  position: fixed;
  top: 0; left: 0; right: 0;
  height: var(--header-height);
  z-index: 9999;
  display:flex;
  align-items:center;
}
.header-row{
  height: 100%;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: var(--gap-md);
}
.logo{
  font-weight: 800;
  letter-spacing: .2px;
  font-size: 22px;
  line-height: 1;
  white-space: nowrap;
}

/* Desktop nav */
.nav-menu{
  display:flex;
  align-items:center;
  gap: var(--gap-lg);
  font-size: 16px;
}
.nav-menu a{
  padding: 8px 10px;
  border-radius: 10px;
}

/* Toggle */
.nav-check{ display:none; }
.burger{
  display:none;
  width: 44px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid var(--border);
  align-items:center;
  justify-content:center;
  flex-direction: column;
  gap: 6px;
  cursor:pointer;
  user-select:none;

  background: transparent;
  padding: 0;
  position: relative;
  z-index: 10000;
  pointer-events: auto;
}
.burger span{
  display:block;
  width: 22px;
  height: 2px;
  background: currentColor;
  opacity: .95;
}

/* Sections / cards */
.section{ padding: 22px 0; }
.card{
  border-radius: var(--radius);
  border: 1px solid var(--border);
  padding: 18px;
  margin: 14px 0;
}

/* Buttons + inputs */
.btn, button, .btn-primary, .btn-outline-primary, .btn-outline-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  cursor: pointer;
  font-weight: 700;
  background: transparent;
  color: inherit;
  text-decoration:none;
}
.btn:hover, button:hover{ text-decoration:none; filter: brightness(1.05); }
.btn:active, button:active{ transform: translateY(1px); }

.form-control, .form-select, select, input, textarea{
  width:100%;
  padding: 12px 12px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: transparent;
  color: inherit;
  outline:none;
}

/* Tables */
.table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 10px;
}
.table th{
  text-align:left;
  font-size: 12px;
  opacity: .75;
  padding: 8px 10px;
}
.table td{
  border: 1px solid var(--border);
  padding: 10px;
}
.table tr td:first-child{
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}
.table tr td:last-child{
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

/* Mobile menu */
@media (max-width: 720px){
  .burger{ display:flex; }
  .nav-menu{
    position: absolute;
    z-index: 9998;
    top: var(--header-height);
    left: 0; right: 0;
    display: none;
    flex-direction: column;
    gap: 0;
    padding: 10px 18px 14px;
    border-bottom: 1px solid var(--border);

    /* Key fix: cannot steal clicks unless open */
    pointer-events: none;
  }
  .nav-menu a{
    padding: 14px 10px;
    width: 100%;
  }
  .nav-menu.is-open{
    display:flex;
    pointer-events: auto;
  }
}

/* =====================================================
   Bootstrap-compat subset (keeps existing markup working)
   ===================================================== */
.row{ display:flex; flex-wrap:wrap; margin-left:-8px; margin-right:-8px; }
.row > [class*="col-"]{ padding-left:8px; padding-right:8px; }
.col-12{ width:100%; }
.col-6{ width:50%; }
.col-4{ width:33.3333%; }
.col-3{ width:25%; }

@media (min-width: 992px){
  .col-lg-12{ width:100%; }
  .col-lg-8{ width:66.6667%; }
  .col-lg-6{ width:50%; }
  .col-lg-4{ width:33.3333%; }
  .col-lg-3{ width:25%; }
  .text-lg-end{ text-align:right; }
  .mt-lg-0{ margin-top:0 !important; }
}

.align-items-center{ align-items:center; }
.justify-content-between{ justify-content:space-between; }

.mb-0{ margin-bottom:0 !important; }
.mb-2{ margin-bottom:8px !important; }
.mb-3{ margin-bottom:12px !important; }
.mb-4{ margin-bottom:18px !important; }
.mt-1{ margin-top:6px !important; }
.mt-2{ margin-top:8px !important; }
.mt-3{ margin-top:12px !important; }
.mt-4{ margin-top:18px !important; }

.text-muted{ opacity:.75; }
.text-primary{ color: var(--primary, #D70926); }
.text-start{ text-align:left; }
.text-end{ text-align:right; }
