/*
Theme Name: Alipur Chattha Estates
Theme URI: https://www.alipurchattha.com
Author: Alipur Chattha Estates
Author URI: https://www.alipurchattha.com
Description: A real estate listing theme built for Alipur Chattha Estates (www.alipurchattha.com). Visitors can register, submit property listings with images and a short video, and browse admin-approved properties. Owner contact details are kept private in the admin panel; all public enquiries are routed to a single WhatsApp / call number. Includes registration with email verification, a seller dashboard, admin approval workflow, social sharing, and ready-made About / Privacy / Terms pages.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ac-estates
Tags: real-estate, listings, custom-post-type, one-column

This theme, like WordPress, is licensed under the GPL.
*/

/* -------------------------------------------------------
   0. Design tokens
   Palette: clay brick, wheat sand, field green, charcoal, harvest gold
------------------------------------------------------- */
:root{
  --clay:        #A6441F;
  --clay-dark:   #7E3016;
  --sand:        #F3E9D2;
  --sand-deep:   #E7D8AF;
  --field:       #2F4A34;
  --field-dark:  #223526;
  --charcoal:    #221D18;
  --gold:        #C9962B;
  --gold-light:  #E4B655;
  --white:       #FFFFFF;
  --line:        rgba(34,29,24,0.14);

  --font-display: 'Zilla Slab', Georgia, serif;
  --font-body:    'Mukta', 'Segoe UI', sans-serif;
  --font-mono:    'IBM Plex Mono', monospace;

  --radius: 4px;
  --wrap: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--sand);
  color:var(--charcoal);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.6;
}
img{max-width:100%; display:block;}
a{color:var(--clay); text-decoration:none;}
a:hover{color:var(--gold);}
h1,h2,h3,h4{
  font-family:var(--font-display);
  color:var(--charcoal);
  line-height:1.15;
  margin:0 0 .5em;
  font-weight:600;
}
h1{font-size:clamp(2.1rem,4vw,3.2rem);}
h2{font-size:clamp(1.6rem,3vw,2.3rem);}
h3{font-size:1.3rem;}
p{margin:0 0 1em;}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 24px;}
:focus-visible{outline:3px solid var(--gold); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} }

button, .btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--font-body); font-weight:700; font-size:.95rem;
  padding:12px 22px; border-radius:var(--radius); border:2px solid transparent;
  cursor:pointer; background:var(--clay); color:var(--white);
  transition:transform .15s ease, background .15s ease;
}
.btn:hover{background:var(--clay-dark); color:var(--white); transform:translateY(-2px);}
.btn.btn-gold{background:var(--gold); color:var(--charcoal);}
.btn.btn-gold:hover{background:var(--gold-light);}
.btn.btn-outline{background:transparent; color:var(--charcoal); border-color:var(--charcoal);}
.btn.btn-outline:hover{background:var(--charcoal); color:var(--white);}
.btn.btn-whatsapp{background:#2f7a4d;}
.btn.btn-whatsapp:hover{background:#1f5c38;}
.btn.btn-call{background:var(--field); }
.btn.btn-call:hover{background:var(--field-dark);}

input[type=text], input[type=email], input[type=password], input[type=tel], input[type=number], textarea, select{
  width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius);
  font-family:var(--font-body); font-size:1rem; background:var(--white); color:var(--charcoal);
}
label{font-weight:700; display:block; margin:0 0 6px; font-size:.92rem;}
.field{margin-bottom:18px;}
/* Off-screen (not display:none) so it still fools simple bots, but is invisible and unreachable for real visitors. */
.ac-hp-field{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;}
.hint{font-size:.82rem; color:#6a5f52; margin-top:4px;}

/* -------------------------------------------------------
   1. Top bar + header
------------------------------------------------------- */
.topbar{background:var(--field); color:var(--sand); font-size:.85rem;}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding:8px 24px; flex-wrap:wrap; gap:8px;}
.topbar a{color:var(--sand);}
.topbar a:hover{color:var(--gold-light);}
.topbar .contacts{display:flex; gap:18px; flex-wrap:wrap;}
.topbar .socials{display:flex; gap:14px;}

.site-header{background:var(--white); border-bottom:3px solid var(--clay); position:relative;}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 24px;}
.site-branding{display:flex; align-items:center; gap:12px;}
.site-branding .mark{
  width:46px;height:46px;border:2px solid var(--clay); border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display); font-weight:700; color:var(--clay); font-size:1.2rem;
}
.site-title{font-family:var(--font-display); font-size:1.5rem; margin:0; font-weight:700;}
.site-title a{color:var(--charcoal);}
.site-tagline{font-size:.8rem; color:#6a5f52; margin:0;}

.main-nav ul{list-style:none; display:flex; gap:28px; margin:0; padding:0;}
.main-nav a{font-weight:700; color:var(--charcoal); font-size:.95rem;}
.main-nav a:hover{color:var(--clay);}
.nav-toggle{display:none; background:none; border:none; padding:6px;}
.nav-toggle span, .nav-toggle::before, .nav-toggle::after{display:block; width:26px; height:3px; background:var(--charcoal); margin:5px 0;}

@media(max-width:860px){
  .main-nav{position:absolute; top:100%; left:0; right:0; background:var(--white); border-top:1px solid var(--line); display:none;}
  .main-nav.open{display:block;}
  .main-nav ul{flex-direction:column; padding:16px 24px; gap:14px;}
  .nav-toggle{display:block;}
}

/* -------------------------------------------------------
   2. Hero (survey-grid motif -- signature element)
------------------------------------------------------- */
.hero{
  position:relative; overflow:hidden; color:var(--white);
  background:
    linear-gradient(rgba(34,29,24,.62), rgba(34,29,24,.72)),
    repeating-linear-gradient(0deg, transparent 0 59px, rgba(243,233,210,.18) 59px 60px),
    repeating-linear-gradient(90deg, transparent 0 59px, rgba(243,233,210,.18) 59px 60px),
    linear-gradient(135deg, var(--field-dark), var(--clay-dark));
  padding:100px 0 90px;
}
.hero .wrap{position:relative; z-index:2; max-width:760px;}
.hero .eyebrow{
  font-family:var(--font-mono); letter-spacing:.14em; text-transform:uppercase; font-size:.78rem;
  color:var(--gold-light); border:1px solid var(--gold-light); display:inline-block;
  padding:5px 12px; border-radius:2px; margin-bottom:18px;
}
.hero h1{color:var(--white); margin-bottom:.4em;}
.hero p.lede{font-size:1.15rem; color:var(--sand); max-width:560px;}
.hero-actions{display:flex; gap:14px; margin-top:28px; flex-wrap:wrap;}
.hero-stats{display:flex; gap:36px; margin-top:46px; flex-wrap:wrap;}
.hero-stats div{font-family:var(--font-mono);}
.hero-stats b{display:block; font-size:1.7rem; color:var(--gold-light); font-family:var(--font-display);}
.hero-stats span{font-size:.78rem; color:var(--sand); text-transform:uppercase; letter-spacing:.08em;}

/* -------------------------------------------------------
   3. Survey-marker card frame (signature element)
------------------------------------------------------- */
.marker-frame{position:relative; padding:10px;}
.marker-frame::before, .marker-frame::after,
.marker-frame b::before, .marker-frame b::after{content:""; position:absolute; width:22px; height:22px; border:3px solid var(--gold); z-index:2;}
.marker-frame::before{ top:0; left:0; border-right:none; border-bottom:none; }
.marker-frame::after{ top:0; right:0; border-left:none; border-bottom:none; }
.marker-frame b{position:absolute; inset:0; pointer-events:none;}
.marker-frame b::before{ bottom:0; left:0; border-right:none; border-top:none; }
.marker-frame b::after{ bottom:0; right:0; border-left:none; border-top:none; }

/* -------------------------------------------------------
   4. Sections & property cards
------------------------------------------------------- */
.section{padding:70px 0;}
.section.alt{background:var(--sand-deep);}
.section-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:36px; flex-wrap:wrap; gap:12px;}
.section-head .eyebrow-line{font-family:var(--font-mono); text-transform:uppercase; letter-spacing:.12em; font-size:.78rem; color:var(--clay);}

.property-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:28px;}
.property-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:transform .18s ease, box-shadow .18s ease;}
.property-card:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(34,29,24,.12);}
.property-card .thumb{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--sand-deep);}
.property-card .thumb img{width:100%; height:100%; object-fit:cover;}
.property-card .tag{position:absolute; top:12px; left:12px; background:var(--field); color:var(--sand); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; padding:4px 10px; border-radius:2px; font-family:var(--font-mono);}
.property-card .price-tag{position:absolute; bottom:0; right:0; background:var(--gold); color:var(--charcoal); font-family:var(--font-display); font-weight:700; padding:6px 14px; border-radius:2px 0 0 0;}
.property-card .body{padding:18px 20px;}
.property-card h3{margin-bottom:6px; font-size:1.15rem;}
.property-card .loc{font-size:.86rem; color:#6a5f52; margin-bottom:10px;}
.property-meta{display:flex; gap:16px; font-family:var(--font-mono); font-size:.82rem; color:var(--field-dark); border-top:1px dashed var(--line); padding-top:12px; margin-top:12px;}
.property-meta span{display:flex; align-items:center; gap:5px;}

.plot-ref{font-family:var(--font-mono); font-size:.75rem; color:#6a5f52;}

/* -------------------------------------------------------
   5. Single property page
------------------------------------------------------- */
.property-single .gallery-main{aspect-ratio:16/10; border-radius:var(--radius); overflow:hidden; margin-bottom:14px; background:var(--sand-deep);}
.property-single .gallery-main img, .property-single .gallery-main video{width:100%; height:100%; object-fit:cover;}
.gallery-thumbs{display:flex; gap:10px; flex-wrap:wrap;}
.gallery-thumbs img{width:84px; height:64px; object-fit:cover; border-radius:3px; cursor:pointer; border:2px solid transparent;}
.gallery-thumbs img.active{border-color:var(--clay);}
.property-price-block{background:var(--field); color:var(--white); padding:26px; border-radius:var(--radius); margin-bottom:20px;}
.property-price-block .amount{font-family:var(--font-display); font-size:2rem; color:var(--gold-light);}
.contact-box{background:var(--white); border:2px solid var(--clay); border-radius:var(--radius); padding:22px; text-align:center;}
.contact-box p{font-size:.88rem; color:#6a5f52;}
.contact-box .btn{width:100%; justify-content:center; margin-bottom:10px;}
.spec-table{width:100%; border-collapse:collapse; margin:20px 0;}
.spec-table td{padding:10px 0; border-bottom:1px solid var(--line);}
.spec-table td:first-child{font-weight:700; width:40%;}

.share-row{display:flex; gap:10px; margin-top:20px; flex-wrap:wrap;}
.share-row a{width:38px; height:38px; border-radius:50%; background:var(--charcoal); color:var(--white); display:flex; align-items:center; justify-content:center; font-size:.85rem;}
.share-row a:hover{background:var(--clay); color:var(--white);}

/* -------------------------------------------------------
   6. Forms: register / login / dashboard / submit listing
------------------------------------------------------- */
.form-card{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:36px; max-width:620px; margin:0 auto; box-shadow:0 8px 24px rgba(34,29,24,.06);}
.form-card h2{margin-bottom:6px;}
.form-card .sub{color:#6a5f52; margin-bottom:24px;}
.form-row-2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media(max-width:600px){.form-row-2{grid-template-columns:1fr;}}
.notice{padding:14px 18px; border-radius:var(--radius); margin-bottom:20px; font-size:.92rem;}
.notice.success{background:#e4f1e8; color:#1f5c38; border:1px solid #b7dcc4;}
.notice.error{background:#fbe6e0; color:var(--clay-dark); border:1px solid #f0b8a5;}
.notice.info{background:#eef2f8; color:#2c4a6b; border:1px solid #c6d6ea;}

.dash-tabs{display:flex; gap:10px; margin-bottom:26px; border-bottom:2px solid var(--line); flex-wrap:wrap;}
.dash-tabs a{padding:10px 4px; font-weight:700; color:#6a5f52; border-bottom:3px solid transparent; margin-bottom:-2px;}
.dash-tabs a.active{color:var(--clay); border-color:var(--clay);}
.status-pill{font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; padding:3px 10px; border-radius:20px;}
.status-pill.pending{background:#fbeecb; color:#8a6410;}
.status-pill.publish{background:#dcefe0; color:#1f5c38;}

.dash-table{width:100%; border-collapse:collapse; background:var(--white);}
.dash-table th, .dash-table td{padding:12px 14px; border-bottom:1px solid var(--line); text-align:left; font-size:.92rem;}
.dash-table th{background:var(--sand-deep); font-family:var(--font-mono); font-size:.75rem; text-transform:uppercase;}

.upload-box{border:2px dashed var(--line); border-radius:var(--radius); padding:20px; text-align:center; background:var(--sand);}
.upload-box input{margin-top:10px;}

/* -------------------------------------------------------
   7. Filters / search bar
------------------------------------------------------- */
.filter-bar{background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; margin-bottom:34px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:12px; align-items:end;}
@media(max-width:900px){.filter-bar{grid-template-columns:1fr 1fr;}}
.filter-bar label{font-size:.75rem; margin-bottom:4px;}

/* -------------------------------------------------------
   8. About / static pages
------------------------------------------------------- */
.static-page .wrap{max-width:820px;}
.static-page h2{margin-top:1.4em;}
.value-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:22px; margin:30px 0;}
.value-grid .item{background:var(--white); border-left:4px solid var(--gold); padding:18px 20px; border-radius:0 var(--radius) var(--radius) 0;}

/* -------------------------------------------------------
   9. Footer
------------------------------------------------------- */
.site-footer{background:var(--charcoal); color:var(--sand); padding:56px 0 20px; margin-top:60px;}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:34px; margin-bottom:36px;}
@media(max-width:800px){.footer-grid{grid-template-columns:1fr 1fr;}}
.site-footer h4{color:var(--gold-light); font-size:.85rem; text-transform:uppercase; letter-spacing:.08em; font-family:var(--font-mono); margin-bottom:14px;}
.site-footer a{color:var(--sand);}
.site-footer a:hover{color:var(--gold-light);}
.site-footer ul{list-style:none; margin:0; padding:0;}
.site-footer li{margin-bottom:8px; font-size:.92rem;}
.footer-bottom{border-top:1px solid rgba(243,233,210,.15); padding-top:18px; font-size:.82rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; color:#b8ab98;}
.footer-socials{display:flex; gap:12px;}
.footer-socials a{width:36px;height:36px;border:1px solid rgba(243,233,210,.3); border-radius:50%; display:flex; align-items:center; justify-content:center;}
.footer-socials a:hover{border-color:var(--gold-light);}

/* Floating WhatsApp button */
.whatsapp-float{
  position:fixed; bottom:22px; right:22px; z-index:999;
  background:#2f7a4d; color:#fff; width:58px; height:58px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; box-shadow:0 8px 20px rgba(0,0,0,.25);
  font-size:1.5rem;
}
.whatsapp-float:hover{background:#256239; color:#fff;}

.empty-state{text-align:center; padding:60px 20px; color:#6a5f52;}
.pagination{display:flex; gap:8px; justify-content:center; margin-top:36px;}
.pagination a, .pagination span{padding:8px 14px; border:1px solid var(--line); border-radius:3px; font-family:var(--font-mono); font-size:.85rem;}
.pagination .current{background:var(--clay); color:#fff; border-color:var(--clay);}