/* 转租宝 ZZB —— 紫色主题通用样式（无前端框架，兼容桌面与手机） */
:root{
    --pp:#6D28D9;        /* 主紫 */
    --pp-d:#5B21B6;      /* 深紫 */
    --pp-m:#8B5CF6;      /* 中紫 */
    --pp-l:#A78BFA;      /* 浅紫 */
    --pp-bg:#F4F1FE;     /* 紫底 */
    --pp-bg2:#EDE7FB;    /* 紫底深 */
    --ink:#241C38;
    --gray:#6B6580;
    --gray2:#9A93AC;
    --line:#E9E4F5;
    --white:#fff;
    --ok:#2E9E6B;
    --warn:#E08A1E;
    --err:#D93A5B;
    --radius:16px;
    --shadow:0 6px 22px rgba(109,40,217,.10);
    --shadow2:0 12px 32px rgba(109,40,217,.18);
}
*{box-sizing:border-box;}
/* 微信内置浏览器（X5 / WKWebView）兜底：禁止横向溢出导致顶栏右侧露白 */
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden;}
body{
    font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:17px;line-height:1.75;color:var(--ink);background:var(--pp-bg);
    -webkit-text-size-adjust:100% !important;text-size-adjust:100% !important;
}
a{color:var(--pp);text-decoration:none;}
a:hover{color:var(--pp-m);}
img{max-width:100%;display:block;border:0;}
h1,h2,h3,h4{margin:0;font-weight:800;line-height:1.4;}
ul{margin:0;padding:0;list-style:none;}
input,select,textarea,button{font-family:inherit;font-size:17px;}
.clearfix:after{content:"";display:block;clear:both;}
.inner{max-width:1200px;margin:0 auto;padding:0 18px;}
.mt10{margin-top:10px}.mt16{margin-top:16px}.mt24{margin-top:24px}.mt32{margin-top:32px}
.center{text-align:center;}
.muted{color:var(--gray);}
.small{font-size:15px;}

/* ============ 顶部导航 ============ */
.topbar{background:linear-gradient(120deg,#4C1D95 0%,#6D28D9 45%,#8B5CF6 100%);color:#fff;}
.topbar .inner{display:flex;align-items:center;gap:20px;min-height:70px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px;}
.brand{display:flex;align-items:center;gap:10px;font-size:26px;font-weight:800;letter-spacing:2px;color:#fff;}
.brand .bi{
    width:42px;height:42px;border-radius:12px;background:rgba(255,255,255,.18);
    display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;
}
.brand small{display:block;font-size:13px;letter-spacing:0;font-weight:400;opacity:.85;}
.nav{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto;}
.nav a{color:rgba(255,255,255,.92);font-size:17px;padding:9px 16px;border-radius:12px;white-space:nowrap;}
.nav a:hover{background:rgba(255,255,255,.16);color:#fff;}
.nav a.on{background:rgba(255,255,255,.24);color:#fff;font-weight:700;}
.nav .btn-in{background:#fff;color:var(--pp-d)!important;font-weight:700;}

/* ============ 首页 Hero ============ */
.hero{background:linear-gradient(135deg,#6D28D9 0%,#8B5CF6 55%,#A78BFA 100%);color:#fff;padding:44px 0 90px;}
.hero h1{font-size:38px;letter-spacing:2px;}
.hero p{font-size:18px;opacity:.92;margin:12px 0 0;}
.hero .quick{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px;}
.hero .quick a{
    background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);color:#fff;
    padding:11px 22px;border-radius:30px;font-size:17px;
}
.hero .quick a.solid{background:#fff;color:var(--pp-d);font-weight:700;border-color:#fff;}

/* ============ 搜索卡片 ============ */
.search-card{
    background:#fff;border-radius:var(--radius);box-shadow:var(--shadow2);
    margin-top:-56px;position:relative;padding:20px 22px;
}
.search-card form{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;}
.fgrp{display:flex;flex-direction:column;gap:6px;flex:1;min-width:150px;}
.fgrp label{font-size:15px;color:var(--gray);}
.fgrp input,.fgrp select{
    height:46px;border:1px solid var(--line);border-radius:12px;padding:0 12px;background:#fff;color:var(--ink);
    font-size:16px;width:100%;
}
.fgrp input:focus,.fgrp select:focus{outline:none;border-color:var(--pp-m);box-shadow:0 0 0 3px rgba(139,92,246,.15);}
.btn{
    display:inline-block;border:0;border-radius:12px;height:46px;line-height:46px;padding:0 26px;
    background:linear-gradient(120deg,var(--pp-d),var(--pp-m));color:#fff;font-size:17px;font-weight:700;
    cursor:pointer;white-space:nowrap;
}
.btn:hover{opacity:.94;color:#fff;}
.btn.ghost{background:var(--pp-bg);color:var(--pp-d);border:1px solid var(--pp-bg2);}
.btn.sm{height:36px;line-height:36px;padding:0 16px;font-size:15px;border-radius:10px;}
.btn.gray{background:#EFEAFB;color:var(--pp-d);}
.btn.danger{background:linear-gradient(120deg,#B91C4C,#D93A5B);}
.btn.block{display:block;width:100%;text-align:center;}

/* ============ 区块标题 ============ */
.sec-head{display:flex;align-items:baseline;gap:12px;margin:30px 0 16px;}
.sec-head h2{font-size:24px;}
.sec-head .more{margin-left:auto;font-size:16px;}
.line-purple{width:56px;height:5px;border-radius:3px;background:linear-gradient(90deg,var(--pp),var(--pp-l));margin-bottom:12px;}

/* ============ 房源卡片 ============ */
.house-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:20px;}
.hcard{
    background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
    transition:transform .18s ease,box-shadow .18s ease;display:flex;flex-direction:column;
}
.hcard:hover{transform:translateY(-4px);box-shadow:var(--shadow2);}
.hcard .pic{position:relative;height:200px;overflow:hidden;background:var(--pp-bg);}
.hcard .pic img{width:100%;height:100%;object-fit:cover;}
.hcard .tags{position:absolute;left:10px;top:10px;display:flex;gap:6px;flex-wrap:wrap;}
.tag{
    font-size:13px;padding:3px 10px;border-radius:20px;background:rgba(255,255,255,.92);color:var(--pp-d);font-weight:700;
}
.tag.top{background:linear-gradient(120deg,#F59E0B,#FBBF24);color:#fff;}
.tag.time{background:rgba(36,28,56,.72);color:#fff;}
.hcard .body{padding:14px 16px 16px;flex:1;display:flex;flex-direction:column;}
.hcard .t{font-size:18px;font-weight:700;line-height:1.5;min-height:54px;}
.hcard .meta{font-size:15px;color:var(--gray);margin-top:6px;}
.hcard .price{color:var(--pp-d);font-size:24px;font-weight:800;margin-top:8px;}
.hcard .price small{font-size:15px;font-weight:400;color:var(--gray);}
.hcard .foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:14px;color:var(--gray2);}

/* ============ 房源详情 ============ */
.detail-wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:24px;align-items:start;}
.detail-wrap>*{min-width:0;max-width:100%;}
.panel{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;min-width:0;max-width:100%;}
/* 画廊：比例盒子 + 绝对定位图片，兼容微信 X5/WKWebView，避免图片撑破容器与顶栏 */
.gallery{width:100%;max-width:100%;overflow:hidden;}
.gallery .main{
    position:relative;width:100%;height:0;padding-top:56.25%;   /* 16:9 */
    border-radius:14px;overflow:hidden;background:var(--pp-bg);
}
.gallery .main img{
    position:absolute;left:0;top:0;width:100%;height:100%;
    object-fit:cover;-o-object-fit:cover;display:block;
}
.gallery .thumbs{
    display:flex;flex-wrap:nowrap;gap:10px;margin-top:12px;
    width:100%;max-width:100%;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;padding-bottom:4px;
}
.gallery .thumbs img{
    width:110px;height:76px;object-fit:cover;border-radius:10px;cursor:pointer;border:3px solid transparent;flex:0 0 auto;
}
.gallery .thumbs img.on{border-color:var(--pp-m);}
.h-title{font-size:26px;}
.h-price{color:var(--pp-d);font-size:32px;font-weight:800;margin:10px 0;}
.h-price small{font-size:17px;color:var(--gray);font-weight:400;}
.info-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px 16px;margin-top:14px;}
.info-grid .it{background:var(--pp-bg);border-radius:12px;padding:10px 14px;}
.info-grid .it .k{font-size:14px;color:var(--gray);}
.info-grid .it .v{font-size:17px;font-weight:700;}
.fac-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.fac-list span{background:var(--pp-bg);color:var(--pp-d);border-radius:20px;padding:5px 14px;font-size:15px;}
.desc{white-space:pre-wrap;font-size:17px;line-height:1.9;color:#3A3252;}
.contact-card{
    background:linear-gradient(150deg,#6D28D9,#8B5CF6);color:#fff;border-radius:var(--radius);padding:22px;text-align:center;
}
.contact-card h3{font-size:20px;}
.contact-card .qrbox{background:#fff;border-radius:14px;padding:12px;margin:14px auto;width:220px;}
.contact-card .qrbox img{width:100%;border-radius:8px;}
.contact-card .cname{font-size:20px;font-weight:800;}
.contact-card .cphone{font-size:22px;font-weight:800;letter-spacing:1px;margin-top:4px;}
.contact-card .tip{font-size:14px;opacity:.9;margin-top:10px;}

/* ============ 表单 ============ */
.form-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;}
.form-card h2{font-size:24px;margin-bottom:6px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;margin-top:18px;}
.form-row.one{grid-template-columns:1fr;}
.fld{display:flex;flex-direction:column;gap:7px;}
.fld label{font-size:16px;color:#3A3252;font-weight:700;}
.fld label i{color:var(--err);font-style:normal;}
.fld input,.fld select,.fld textarea{
    border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-size:17px;background:#fff;color:var(--ink);width:100%;
}
.fld textarea{min-height:110px;line-height:1.7;resize:vertical;}
.fld input:focus,.fld select:focus,.fld textarea:focus{
    outline:none;border-color:var(--pp-m);box-shadow:0 0 0 3px rgba(139,92,246,.15);
}
.fld .hint{font-size:14px;color:var(--gray2);}
.cap-row{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;}
.cap-row input{flex:1 1 auto;min-width:0;letter-spacing:6px;text-align:center;font-size:20px;font-weight:700;}
.cap-row img{flex:0 0 auto;width:132px;height:52px;border-radius:10px;border:1px solid var(--line);cursor:pointer;background:#fff;}
.cap-row .refresh{flex:0 0 auto;font-size:15px;white-space:nowrap;}
.chk-list{display:flex;flex-wrap:wrap;gap:10px;}
.chk-list label{
    display:inline-flex;align-items:center;gap:6px;background:var(--pp-bg);border:1px solid var(--pp-bg2);
    border-radius:22px;padding:6px 14px;font-size:16px;font-weight:400;cursor:pointer;
}
.chk-list input{width:18px;height:18px;}
.form-actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;}

/* ============ 提示条 ============ */
.alert{border-radius:12px;padding:12px 16px;font-size:16px;margin-bottom:16px;}
.alert.ok{background:#E8F7EF;color:#1F7A52;}
.alert.err{background:#FDECF0;color:#B0203F;}
.alert.info{background:var(--pp-bg);color:var(--pp-d);}

/* ============ 后台布局 ============ */
.admin-body{background:#F6F4FB;}
.admin-shell{display:flex;min-height:100vh;align-items:stretch;}
.sidebar{
    width:230px;flex:0 0 230px;background:linear-gradient(170deg,#4C1D95,#6D28D9 60%,#8B5CF6);color:#fff;
    padding:20px 0;display:flex;flex-direction:column;
}
.sidebar .sbrand{padding:0 20px 18px;font-size:22px;font-weight:800;letter-spacing:1px;}
.sidebar .sbrand small{display:block;font-size:13px;opacity:.85;font-weight:400;letter-spacing:0;}
.sidebar a{
    display:block;padding:13px 22px;color:rgba(255,255,255,.92);font-size:17px;border-left:4px solid transparent;
}
.sidebar a:hover{background:rgba(255,255,255,.12);color:#fff;}
.sidebar a.on{background:rgba(255,255,255,.18);border-left-color:#fff;font-weight:700;}
.sidebar .sgroup{font-size:13px;opacity:.7;padding:14px 22px 6px;letter-spacing:1px;}
.sidebar .sfoot{margin-top:auto;padding:16px 22px;font-size:14px;opacity:.85;border-top:1px solid rgba(255,255,255,.16);}
.admin-main{flex:1;min-width:0;padding:22px 26px 40px;}
.admin-top{
    display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;border-radius:var(--radius);
    padding:16px 20px;box-shadow:var(--shadow);margin-bottom:20px;
}
.admin-top h1{font-size:22px;}
.admin-top .who{margin-left:auto;font-size:15px;color:var(--gray);}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;}
.stat{
    background:#fff;border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow);
    border-left:6px solid var(--pp-m);
}
.stat .n{font-size:30px;font-weight:800;color:var(--pp-d);}
.stat .l{font-size:15px;color:var(--gray);}
.toolbar{
    background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px 18px;margin-bottom:16px;
    display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;
}
.toolbar .fgrp{flex:0 0 auto;min-width:140px;}
.toolbar .grow{flex:1;}
.table-wrap{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;}
.table-wrap .scroll{overflow-x:auto;}
table.tbl{width:100%;border-collapse:collapse;font-size:16px;min-width:760px;}
table.tbl th{
    background:var(--pp-bg);color:var(--pp-d);text-align:left;padding:13px 14px;font-size:15px;white-space:nowrap;
}
table.tbl td{padding:13px 14px;border-top:1px solid var(--line);vertical-align:middle;}
table.tbl tr:hover td{background:#FBF9FF;}
.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:13px;font-weight:700;}
.badge.g{background:#E8F7EF;color:#1F7A52;}
.badge.r{background:#FDECF0;color:#B0203F;}
.badge.p{background:var(--pp-bg);color:var(--pp-d);}
.badge.y{background:#FEF3E2;color:#B26A0B;}
.ops a,.ops button{
    font-size:14px;margin:2px 4px 2px 0;padding:5px 12px;border-radius:8px;border:1px solid var(--pp-bg2);
    background:var(--pp-bg);color:var(--pp-d);cursor:pointer;display:inline-block;
}
.ops a:hover,.ops button:hover{background:var(--pp-m);color:#fff;border-color:var(--pp-m);}
.ops .del{color:#B0203F;border-color:#F6D9E1;background:#FDECF0;}
.ops .del:hover{background:#D93A5B;color:#fff;border-color:#D93A5B;}
.thumb60{width:72px;height:52px;object-fit:cover;border-radius:8px;}
.empty{padding:60px 20px;text-align:center;color:var(--gray2);font-size:17px;}

/* ============ 登录 / 注册 ============ */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:30px 16px;
    background:linear-gradient(135deg,#5B21B6 0%,#7C3AED 50%,#A78BFA 100%);}
.auth-box{width:100%;max-width:460px;background:#fff;border-radius:20px;box-shadow:var(--shadow2);padding:32px 30px;}
.auth-box .logo{text-align:center;margin-bottom:18px;}
.auth-box .logo b{font-size:28px;color:var(--pp-d);letter-spacing:2px;}
.auth-box .logo span{display:block;font-size:15px;color:var(--gray);}
.auth-box h2{font-size:22px;text-align:center;margin-bottom:4px;}
.auth-box .sub{text-align:center;color:var(--gray);font-size:15px;margin-bottom:18px;}

/* ============ 页脚 ============ */
.footer{margin-top:44px;background:#2B2140;color:#D8D2E8;padding:26px 0;font-size:15px;}
.footer .inner{display:flex;gap:16px;flex-wrap:wrap;align-items:center;}
.footer a{color:#C9BFF0;}
.footer .r{margin-left:auto;}

/* ============ 通用入口卡片 ============ */
.entry-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
.entry{
    background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;text-align:center;
}
.entry .ic{font-size:34px;}
.entry h3{font-size:20px;margin-top:8px;}
.entry p{color:var(--gray);font-size:15px;margin:6px 0 14px;}

/* ============ 移动端适配 ============ */
@media (max-width:992px){
    .detail-wrap{grid-template-columns:minmax(0,1fr);}
    .gallery .main{padding-top:66.66%;}     /* 3:2 */
}
@media (max-width:768px){
    body{font-size:17px;}
    .inner{padding:0 14px;}
    .topbar .inner{min-height:60px;}
    .brand{font-size:22px;}
    .brand .bi{width:36px;height:36px;font-size:19px;}
    .nav{width:100%;margin-left:0;gap:4px;}
    .nav a{padding:8px 12px;font-size:16px;}
    .hero{padding:28px 0 74px;}
    .hero h1{font-size:28px;}
    .hero p{font-size:16px;}
    .search-card{margin-top:-44px;padding:16px;}
    .search-card .fgrp{min-width:100%;}
    .search-card .btn{width:100%;}
    .house-grid{grid-template-columns:1fr;gap:16px;}
    .hcard .pic{height:210px;}
    .form-row{grid-template-columns:1fr;}
    .info-grid{grid-template-columns:1fr 1fr;}
    .admin-shell{flex-direction:column;}
    .sidebar{width:100%;flex:none;padding:12px 0;}
    .sidebar .sbrand{padding:0 16px 10px;}
    .sidebar .links{display:flex;overflow-x:auto;gap:4px;padding:0 10px;}
    .sidebar .links a{padding:9px 14px;font-size:15px;white-space:nowrap;border-left:0;border-radius:10px;}
    .sidebar .links a.on{border-left:0;background:#fff;color:var(--pp-d);}
    .sidebar .sgroup,.sidebar .sfoot{display:none;}
    .admin-main{padding:16px 14px 30px;}
    .btn{width:auto;}
    .contact-card .qrbox{width:180px;}
    .table-wrap{box-shadow:none;background:transparent;}
    .gallery .main{padding-top:72%;}                 /* 手机端 4:3 左右 */
    .gallery .thumbs img{width:92px;height:64px;}
    .gallery .thumbs{gap:8px;}
}
@media (max-width:420px){
    .cap-row img{width:118px;height:50px;}
    .cap-row input{font-size:19px;letter-spacing:4px;}
    .h-title{font-size:22px;}
    .h-price{font-size:27px;}
}