:root{--bg:var(--az-glass);--card:var(--az-glass);--card2:var(--az-glass);--stroke:var(--az-accent);--stroke2:var(--az-accent);--shadow:var(--az-glass-shadow);--glow:var(--az-accent);--accent:var(--az-accent);--text:var(--az-text);--muted:var(--az-muted);--danger:var(--az-accent);--dangerStroke:var(--az-accent);--ok:var(--az-accent);--okStroke:var(--az-accent);--warn:var(--az-accent);--warnStroke:var(--az-accent)}
html, body{margin: 0;padding: 0;height: 100%;overflow: hidden;background:var(--az-bg);color:var(--az-text);font-family:var(--az-font)}
.properties-container{position: fixed;bottom: 0;left: 50%;transform: translateX(-50%);max-width: 1400px;width: 100%;height: 100%;overflow-y: auto;padding: 14px;box-sizing: border-box;display: flex;flex-direction: column;justify-content: flex-start}
.page-title{text-align:center;margin: 16px 0 18px 0;font-size: 24px;letter-spacing: 0.3px;font-weight: 800}
.subnote{text-align:center;margin-top: -6px;margin-bottom: 14px;color:var(--az-text);font-size: 13px}
.properties-list{display:flex;flex-wrap:wrap;justify-content:center;gap: 16px;padding-bottom: 20px}
.property-box{width: 300px;border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge);box-shadow:var(--az-glass-shadow);overflow: hidden;position: relative;transform: translateZ(0);transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px)}
.property-box::before{content:"";position:absolute;inset:0;background:var(--az-accent-soft);pointer-events:none;opacity: .85}
.property-box:hover{transform: translateY(-6px);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.card-inner{position: relative;padding: 12px}
.image-container{position: relative;width: 100%;height: 178px;border-radius:var(--az-r-card);overflow: hidden;border:1px solid var(--az-glass-edge);background:var(--az-glass);cursor: pointer}
.image-container img{width:100%;height:100%;object-fit: cover;display:block;transform: scale(1.02);transition: transform .35s ease, filter .35s ease}
.property-box:hover .image-container img{transform: scale(1.07);filter: saturate(1.15) contrast(1.05)}
.img-badge{position:absolute;top:10px;left:10px;padding:6px 10px;border-radius: 999px;font-size: 12px;color:var(--az-text);background:var(--az-glass);border:1px solid var(--az-glass-edge);backdrop-filter: blur(8px);display:flex;align-items:center;gap:6px}
.heart-chip{position:absolute;top:10px;right:10px;width: 40px;height: 40px;border-radius:var(--az-r-control);border:1px solid var(--az-glass-edge);background:var(--az-glass);backdrop-filter: blur(10px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition: transform .18s ease, border-color .18s ease, background .18s ease;z-index: 5}
.heart-chip i{color:var(--az-text);font-size: 18px}
.heart-chip.favorited i{color:var(--az-text)}
.heart-chip:hover{transform: translateY(-2px);border-color:var(--az-glass-edge);background:var(--az-glass)}
.property-owner-chip{position:absolute;right:10px;bottom:10px;width:42px;height:42px;border-radius:var(--az-r-control);border:1px solid var(--az-glass-edge);background:var(--az-glass);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer;z-index:5;box-shadow:var(--az-glass-shadow);transition:transform .18s ease, border-color .18s ease, background .18s ease}
.property-owner-chip:hover{transform:translateY(-2px) scale(1.04);border-color:var(--az-glass-edge);background:var(--az-glass)}
.property-owner-chip img{width:100%;height:100%;object-fit:contain;display:block;padding:3px}
.details{padding: 12px 6px 8px 6px;display:flex;flex-direction:column;gap: 8px}
.row{display:flex;align-items:center;justify-content:space-between;gap: 10px}
.addr{font-size: 14px;font-weight: 700;color:var(--az-text);display:flex;gap:10px;align-items:flex-start;line-height: 1.25;flex: 1}
.addr i{color:var(--az-text);margin-top: 2px;filter:none}
.pill{display:inline-flex;align-items:center;gap:8px;padding: 7px 10px;border-radius: 999px;background:var(--az-glass);border:1px solid var(--az-glass-edge);font-size: 12px;color:var(--az-text);white-space: nowrap}
.pill i{color:var(--az-text)}
.price{font-size: 18px;font-weight: 900;letter-spacing: 0.2px;color:var(--az-accent)}
.price small{font-size: 11px;font-weight: 700;color:var(--az-muted)}
.meta{display:flex;justify-content:space-between;gap:10px;margin-top: 2px}
.actions{margin-top: 10px;padding-top: 10px;border-top:1px solid var(--az-glass-edge);display:flex;align-items:center;justify-content:space-between}
.icon-btn{width: 42px;height: 42px;border-radius:var(--az-r-control);border:1px solid var(--az-glass-edge);background:var(--az-raised);display:flex;align-items:center;justify-content:center;cursor:pointer;transition: transform .18s ease, border-color .18s ease, background .18s ease}
.icon-btn i{font-size: 18px;color:var(--az-accent)}
.icon-btn:hover{transform: translateY(-2px);border-color:var(--az-glass-edge);background:var(--az-raised);box-shadow:var(--az-glass-shadow)}
.icon-btn.secondary:hover{border-color:var(--az-glass-edge);background:var(--az-raised);box-shadow:var(--az-glass-shadow)}
.pagination{display:flex;justify-content:center;gap: 8px;margin: 16px 0 20px 0;flex-wrap: wrap}
.pagination a{color:var(--az-text);padding: 8px 14px;text-decoration: none;border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);background:var(--az-glass);transition: background .18s ease, border-color .18s ease}
.pagination a.active{background:var(--az-glass);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.pagination a:hover{background:var(--az-glass);border-color:var(--az-glass-edge)}
.overlay{position:fixed;inset:0;background:rgb(5 12 18 / .58);z-index: 2000;display:flex;align-items:center;justify-content:center;padding: 18px}
.popup{width: min(980px, 100%);max-height: 86vh;overflow: hidden;border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge);box-shadow:var(--az-glass-shadow);backdrop-filter: blur(12px);-webkit-backdrop-filter: blur(12px);display:grid;grid-template-columns: 1.1fr 0.9fr}
@media (max-width: 900px){.popup{grid-template-columns: 1fr}}
.popup-left{padding: 14px;border-right:1px solid var(--az-glass-edge)}
@media (max-width: 900px){.popup-left{border-right: none;border-bottom:1px solid var(--az-glass-edge)}}
.gallery{position: relative;border-radius:var(--az-r-card);overflow: hidden;border:1px solid var(--az-glass-edge);background:var(--az-glass)}
.gallery-main{height: 420px;display:flex;align-items:center;justify-content:center;background:var(--az-glass)}
@media (max-width: 900px){.gallery-main{height: 320px}}
.gallery-main img{width: 100%;height: 100%;object-fit: cover;display:block}
.gal-arrow{position:absolute;top: 50%;transform: translateY(-50%);width: 46px;height: 46px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);backdrop-filter: blur(10px);display:flex;align-items:center;justify-content:center;cursor:pointer;transition: transform .18s ease, border-color .18s ease, background .18s ease;user-select:none;z-index: 5}
.gal-arrow i{color:var(--az-text);font-size: 20px}
.gal-arrow:hover{transform: translateY(-50%) scale(1.05);border-color:var(--az-glass-edge);background:var(--az-glass);box-shadow:var(--az-glass-shadow)}
.gal-arrow.left{left: 12px}
.gal-arrow.right{right: 12px}
.thumbs{display:flex;gap: 10px;padding: 10px;overflow-x: auto;background:var(--az-glass);border-top:1px solid var(--az-glass-edge)}
.thumbs::-webkit-scrollbar{height: 8px}
.thumbs::-webkit-scrollbar-thumb{background:var(--az-glass);border-radius: 999px}
.thumb{width: 78px;height: 62px;border-radius:var(--az-r-card);overflow: hidden;border:1px solid var(--az-glass-edge);flex: 0 0 auto;cursor: pointer;opacity: 0.92;transition: transform .18s ease, border-color .18s ease, opacity .18s ease;background:var(--az-glass)}
.thumb img{width:100%;height:100%;object-fit: cover;display:block}
.thumb:hover{transform: translateY(-2px);opacity: 1}
.thumb.active{border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow);opacity: 1}
.popup-right{padding: 18px 18px 16px 18px;overflow-y: auto}
.popup-right::-webkit-scrollbar{width: 10px}
.popup-right::-webkit-scrollbar-thumb{background:var(--az-glass);border-radius: 999px}
.popup-title{margin: 0 0 10px 0;font-size: 18px;font-weight: 900;color:var(--az-text);display:flex;align-items:flex-start;gap: 10px;line-height: 1.25}
.popup-title i{margin-top: 3px;color:var(--az-text);filter:none}
.kv{display:grid;grid-template-columns: 1fr 1fr;gap: 10px;margin: 12px 0 14px 0}
@media (max-width: 900px){.kv{grid-template-columns: 1fr}}
.kv .item{border:1px solid var(--az-glass-edge);background:var(--az-glass);border-radius:var(--az-r-card);padding: 10px 12px;display:flex;gap: 10px;align-items:flex-start}
.kv .item i{color:var(--az-text);margin-top: 2px;width: 18px;text-align:center}
.kv .label{font-size: 11px;color:var(--az-muted);font-weight: 800;letter-spacing: 0.3px;text-transform: uppercase}
.kv .val{font-size: 13px;color:var(--az-text);font-weight: 700;margin-top: 2px;word-break: break-word}
.desc{border:1px solid var(--az-glass-edge);background:var(--az-glass);border-radius:var(--az-r-card);padding: 12px;line-height: 1.55;color:var(--az-text);font-size: 13px}
.desc b{color:var(--az-text)}
.popup-actions{display:flex;justify-content:space-between;align-items:center;gap: 10px;margin-top: 14px;flex-wrap: wrap}
.btn{border:none;cursor:pointer;border-radius:var(--az-r-control);padding: 10px 14px;font-weight: 900;letter-spacing: 0.2px;display:inline-flex;align-items:center;gap: 8px;transition: transform .16s ease, filter .16s ease, background .16s ease, border-color .16s ease;user-select:none}
.btn:active{transform: scale(0.98)}
.btn.primary{background:var(--az-action);color:var(--az-text);border:1px solid var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.btn.primary:hover{filter: brightness(1.15)}
.btn.secondary{background:var(--az-raised);color:var(--az-text);border:1px solid var(--az-glass-edge)}
.btn.secondary:hover{background:var(--az-raised)}
.btn.danger{background:var(--az-action);color:var(--az-danger);border:1px solid var(--az-glass-edge)}
.btn.danger:hover{filter: brightness(1.1)}
.close-x{position:absolute;top: 14px;right: 14px;width: 48px;height: 48px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);backdrop-filter: blur(10px);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index: 2100;transition: transform .18s ease, border-color .18s ease, background .18s ease}
.close-x i{color:var(--az-text);font-size: 22px}
.close-x:hover{transform: scale(1.05);border-color:var(--az-glass-edge);background:var(--az-glass);box-shadow:var(--az-glass-shadow)}
.details-wrap{width: min(1200px, 100%);margin: 16px auto 40px auto;padding: 0 10px 30px 10px}
.backline{display:flex;justify-content:center;margin-top: 12px}
.backlink{color:var(--az-text);text-decoration:none;padding: 10px 14px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass)}
.backlink:hover{background:var(--az-glass);border-color:var(--az-glass-edge)}
.booking-modal{width: min(680px, 100%);background:var(--az-glass);border:1px solid var(--az-glass-edge);border-radius:var(--az-r-card);padding: 18px 18px 16px 18px;box-shadow:var(--az-glass-shadow);max-height: 92vh;overflow-y: auto;backdrop-filter: blur(14px);-webkit-backdrop-filter: blur(14px);position: relative}
.booking-head{display:flex;align-items:center;justify-content:space-between;gap: 12px;margin-bottom: 12px}
.booking-title{font-size: 18px;font-weight: 900;letter-spacing: .2px;display:flex;align-items:center;gap: 10px}
.booking-title i{color:var(--az-text);filter:none}
.booking-close{width: 44px;height: 44px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);color:var(--az-text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition: transform .16s ease, border-color .16s ease, background .16s ease;user-select:none}
.booking-close:hover{transform: scale(1.04);border-color:var(--az-glass-edge);background:var(--az-glass);box-shadow:var(--az-glass-shadow)}
.calendar-shell{border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);overflow: hidden}
.calendar-header{display: flex;justify-content: space-between;align-items: center;padding: 12px 12px;background:var(--az-glass);border-bottom:1px solid var(--az-glass-edge);font-weight: 800;gap: 10px}
.cal-nav{width: 44px;height: 44px;border-radius:var(--az-r-card);border:1px solid var(--az-glass-edge);background:var(--az-glass);color:var(--az-text);font-size: 22px;cursor:pointer;transition: transform .16s ease, border-color .16s ease, background .16s ease}
.cal-nav:hover{transform: translateY(-1px);border-color:var(--az-glass-edge);background:var(--az-glass);box-shadow:var(--az-glass-shadow)}
#calendar-title{font-weight: 900;font-size: 15px;letter-spacing: .2px;color:var(--az-text);text-align:center;flex: 1}
.calendar-grid{display: grid;grid-template-columns: repeat(7, 1fr);gap: 8px;padding: 12px}
.day-name{text-align: center;font-size: 11px;color:var(--az-text);padding: 10px 0 6px 0;font-weight: 800;letter-spacing: .25px;text-transform: uppercase}
.calendar-day{height: 44px;display: flex;align-items: center;justify-content: center;border-radius:var(--az-r-card);font-size: 14px;cursor: pointer;transition: transform .12s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;position: relative;border:1px solid var(--az-glass-edge);background:var(--az-glass);user-select:none}
.calendar-day:hover{transform: translateY(-1px);background:var(--az-glass);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.calendar-day.disabled{background:var(--az-glass);color:var(--az-text);cursor: not-allowed;border-color:var(--az-glass-edge);box-shadow: none;transform: none;opacity: .9}
.calendar-day.today{border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.calendar-day.selected{background:var(--az-glass);color:var(--az-text);font-weight: 900;border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.calendar-day.has-booking::after{content: '';position: absolute;bottom: 7px;width: 6px;height: 6px;background:var(--az-accent-soft);border-radius: 50%;opacity: .9}
.booking-info{margin: 14px 0 0 0;border:1px solid var(--az-glass-edge);background:var(--az-glass);border-radius:var(--az-r-card);padding: 10px 12px;display:none;font-weight: 800;color:var(--az-text);text-align:center}
.booking-info strong{color:var(--az-text)}
.time-slots{display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;margin: 12px 0 0 0}
@media (max-width: 520px){.time-slots{grid-template-columns: repeat(3, 1fr)}
.calendar-grid{gap: 7px}
.calendar-day{height: 42px;border-radius:var(--az-r-card)}}
.time-btn{padding: 12px 10px;border-radius:var(--az-r-control);background:var(--az-action);border:1px solid var(--az-glass-edge);text-align: center;cursor: pointer;font-size: 13px;font-weight: 900;transition: transform .12s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;user-select:none}
.time-btn:hover{transform: translateY(-1px);background:var(--az-action);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.time-btn.disabled{background:var(--az-action);color:var(--az-text);cursor: not-allowed;border-color:var(--az-glass-edge);box-shadow: none;transform: none}
.time-btn.selected{background:var(--az-action);color:var(--az-text);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.booking-notes{width:100%;height: 86px;margin-top: 12px;padding: 12px;border-radius:var(--az-r-card);background:var(--az-glass);border:1px solid var(--az-glass-edge);color:var(--az-text);resize: vertical;outline: none}
.booking-notes:focus{border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow)}
.booking-actions{margin-top: 14px;display:flex;gap: 12px}
.booking-btn{flex: 1;padding: 13px 14px;border-radius:var(--az-r-control);font-weight: 900;border:1px solid var(--az-glass-edge);cursor: pointer;transition: transform .12s ease, filter .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;user-select:none}
.booking-btn:active{transform: scale(.99)}
.booking-btn.close{background:var(--az-raised);color:var(--az-text)}
.booking-btn.close:hover{background:var(--az-raised);border-color:var(--az-glass-edge)}
.booking-btn.confirm{background:var(--az-action);color:var(--az-text);border-color:var(--az-glass-edge);box-shadow:var(--az-glass-shadow);display:none}
.booking-btn.confirm:hover{filter: brightness(1.06)}
.booking-toast{margin-top: 12px;border-radius:var(--az-r-card);padding: 11px 12px;border:1px solid var(--az-glass-edge);background:var(--az-glass);color:var(--az-text);display:none;font-weight: 800;line-height: 1.35}
.booking-toast.success{background:var(--az-glass);border-color:var(--az-glass-edge);color:var(--az-text)}
.booking-toast.error{background:var(--az-glass);border-color:var(--az-glass-edge);color:var(--az-danger)}
