/* Westfield Directory UI */
:root{
  --wdui-max: 1240px;
  --wdui-accent: #e02424;
  --wdui-muted: #8a8a8a;
}
.wdui-container{max-width:var(--wdui-max); margin:0 auto; padding:32px 16px;}
.wdui-header{display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:22px;}
.wdui-title{font-size: clamp(36px, 6vw, 72px); font-weight:900; letter-spacing:.02em;}
.wdui-sub{color:#555; text-align:center;}

.wdui-toolbar{display:flex; align-items:center; justify-content:space-between; margin:18px 0;}
.wdui-left{display:flex; align-items:center; gap:10px;}
.wdui-filter-btn{border:1px solid #ddd; background:#fff; border-radius:999px; padding:8px 14px; cursor:pointer;}
.wdui-count{margin-left:12px; font-weight:600;}

.wdui-view{display:flex; gap:10px;}
.wdui-view button{width:36px; height:36px; border:1px solid #ddd; background:#fff; border-radius:8px; cursor:pointer;}
.wdui-view button.active{border-color:#000;}

.wdui-az{display:flex; flex-wrap:wrap; gap:18px; justify-content:center; margin:14px 0 26px;}
.wdui-az a{font-weight:700; color:#222; text-decoration:none; opacity:.6}
.wdui-az a.active,.wdui-az a:hover{opacity:1; border-bottom:3px solid var(--wdui-accent); padding-bottom:6px;}

.wdui-grid{display:grid; grid-template-columns: repeat(4,1fr); gap:22px;}
@media (max-width: 1024px){ .wdui-grid{grid-template-columns: repeat(3,1fr);} }
@media (max-width: 720px){ .wdui-grid{grid-template-columns: repeat(2,1fr);} }

.wdui-card{position:relative; overflow:hidden; border-radius:10px; background:#f5f5f5;}
.wdui-card img{width:100%; height:340px; object-fit:cover; display:block;}
.wdui-like{position:absolute; top:10px; right:10px; width:32px; height:32px; border-radius:999px; background:#fff; display:grid; place-items:center; box-shadow:0 2px 8px rgba(0,0,0,.15); cursor:pointer;}
.wdui-like.active{color:crimson}
.wdui-card .wdui-name{position:absolute; inset:auto 0 12px; text-align:center; color:#fff; font-weight:900; font-size: clamp(22px, 3.6vw, 42px); text-shadow: 0 6px 30px rgba(0,0,0,.35), 0 2px 8px rgba(0,0,0,.3);}

.wdui-list .wdui-grid{grid-template-columns: 1fr;}
.wdui-list .wdui-card{display:flex; align-items:center;}
.wdui-list .wdui-card img{width:260px; height:180px;}
.wdui-list .wdui-card .wdui-name{position:static; color:#111; text-shadow:none; padding:0 18px; font-size:26px;}

.wdui-meta{position:absolute; left:12px; bottom:12px; display:flex; gap:8px; align-items:center; color:#fff; text-shadow:0 2px 6px rgba(0,0,0,.35); font-weight:600;}
.wdui-dot{width:10px; height:10px; border-radius:50%; background:#ccc;}
.wdui-dot.open{background:#22c55e}
.wdui-dot.closed{background:#ef4444}