/* ARSB Project Inventory — front-end price list + booking modal
   Same navy/verdigris theme as the original static price list, now
   scoped to a re-usable class (.arsb-app) instead of a single fixed ID
   so the shortcode can be dropped onto any number of project pages. */

.arsb-app{
	--arsb-navy:#12283D;
	--arsb-stone:#EFEBE3;
	--arsb-ink:#1B2430;
	--arsb-verdigris:#3E7568;
	--arsb-verdigris-soft:#E4EFEC;
	--arsb-graphite:#8B93A0;
	--arsb-card:#FFFFFF;

	background:transparent;
	color:var(--arsb-ink);
	font-family:'Inter',sans-serif;
	-webkit-font-smoothing:antialiased;
	display:block;
	line-height:1.4;
}
.arsb-app *{box-sizing:border-box;}
.arsb-app .arsb-nums{font-family:'IBM Plex Mono',monospace; font-variant-numeric:tabular-nums;}
.arsb-app .arsb-hidden-price{color:var(--arsb-graphite); font-style:italic; font-family:'Inter',sans-serif;}

/* ---------- HERO ---------- */
.arsb-app .arsb-hero{
	background:linear-gradient(180deg,var(--arsb-navy) 0%, #0E2032 100%);
	color:#F4F1EA;
	padding:56px 32px 40px;
	position:relative;
	overflow:hidden;
	border-radius:14px;
}
.arsb-app .arsb-hero .arsb-eyebrow{
	font-size:12px; letter-spacing:3px; text-transform:uppercase;
	color:#9FC4B8; font-weight:600; margin-bottom:14px;
}
.arsb-app .arsb-hero h1{
	font-family:'Fraunces',serif; font-weight:500;
	font-size:clamp(34px,6vw,58px); margin:0 0 8px 0; letter-spacing:0.5px;
}
.arsb-app .arsb-hero p.arsb-sub{
	font-size:15px; color:#C7D2D9; max-width:560px; margin:0 0 28px 0; line-height:1.6;
}

.arsb-app .arsb-stat-strip{
	display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
	gap:1px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12);
	border-radius:10px; overflow:hidden; margin-top:8px; max-width:920px;
}
.arsb-app .arsb-stat{background:rgba(255,255,255,0.03); padding:16px 20px;}
.arsb-app .arsb-stat .arsb-num{font-family:'Fraunces',serif; font-size:26px; color:#fff;}
.arsb-app .arsb-stat .arsb-lab{font-size:11px; text-transform:uppercase; letter-spacing:1.2px; color:#9AAAB4; margin-top:2px;}

/* ---------- CONTROLS ---------- */
.arsb-app .arsb-controls-wrap{max-width:100%; margin:24px auto 0; position:relative; z-index:2;}
.arsb-app .arsb-controls{
	background:var(--arsb-card); border-radius:14px; box-shadow:0 12px 30px rgba(18,40,61,0.12);
	padding:18px 22px; display:flex; flex-wrap:wrap; align-items:center; gap:16px;
}
.arsb-app .arsb-legend-item{display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--arsb-ink);}
.arsb-app .arsb-dot{width:11px; height:11px; border-radius:50%; display:inline-block;}
.arsb-app .arsb-dot.arsb-avail{background:var(--arsb-verdigris); box-shadow:0 0 0 4px var(--arsb-verdigris-soft);}
.arsb-app .arsb-dot.arsb-sold{background:var(--arsb-graphite);}
.arsb-app .arsb-spacer{flex:1;}

.arsb-app .arsb-select, .arsb-app .arsb-input{
	font-family:'Inter',sans-serif; font-size:13.5px; padding:9px 12px; border-radius:8px;
	border:1px solid #DCD6C8; background:#FBFAF7; color:var(--arsb-ink); outline:none;
}
.arsb-app .arsb-select:focus, .arsb-app .arsb-input:focus{border-color:var(--arsb-verdigris);}

.arsb-app .arsb-toggle{
	display:flex; align-items:center; gap:8px; font-size:13.5px; font-weight:600;
	cursor:pointer; user-select:none; color:var(--arsb-navy);
}
.arsb-app .arsb-toggle input{accent-color:var(--arsb-verdigris); width:16px; height:16px; cursor:pointer;}

/* ---------- CONTENT ---------- */
.arsb-app .arsb-main{max-width:100%; margin:0 auto; padding:36px 0 40px;}
.arsb-app .arsb-floor-block{margin-bottom:36px;}
.arsb-app .arsb-floor-head{
	display:flex; align-items:baseline; gap:12px; margin-bottom:12px;
	padding-bottom:8px; border-bottom:2px solid var(--arsb-navy);
}
.arsb-app .arsb-floor-head h2{
	font-family:'Fraunces',serif; font-weight:500; font-size:21px; margin:0; color:var(--arsb-navy);
}
.arsb-app .arsb-floor-head span.arsb-count{font-size:12.5px; color:var(--arsb-graphite); font-weight:600;}

.arsb-app .arsb-table-card{
	background:var(--arsb-card); border-radius:12px; overflow-x:auto;
	box-shadow:0 4px 14px rgba(18,40,61,0.05); border:1px solid #E4DFD2;
}
.arsb-app .arsb-table{width:100%; border-collapse:collapse;}
.arsb-app .arsb-table thead th{
	background:var(--arsb-navy); color:#DCE6E2; font-size:10.5px; text-transform:uppercase;
	letter-spacing:0.8px; font-weight:600; text-align:right; padding:11px 14px; white-space:nowrap;
}
.arsb-app .arsb-table thead th:first-child, .arsb-app .arsb-table thead th:nth-child(2), .arsb-app .arsb-table thead th:nth-child(3){text-align:left;}
.arsb-app .arsb-table tbody td{
	font-size:13px; padding:11px 14px; text-align:right; border-bottom:1px solid #EFEBE1; white-space:nowrap;
}
.arsb-app .arsb-table tbody td:first-child, .arsb-app .arsb-table tbody td:nth-child(2), .arsb-app .arsb-table tbody td:nth-child(3){text-align:left;}
.arsb-app .arsb-table tbody tr:last-child td{border-bottom:none;}
.arsb-app .arsb-table tbody tr.arsb-sold{color:#98A0AB;}
.arsb-app .arsb-table tbody tr.arsb-sold td.arsb-unit{color:var(--arsb-ink); font-weight:600;}
.arsb-app .arsb-table tbody tr.arsb-avail{background:var(--arsb-verdigris-soft); cursor:pointer;}
.arsb-app .arsb-table tbody tr.arsb-avail td{color:var(--arsb-ink);}
.arsb-app .arsb-table tbody tr.arsb-avail td.arsb-unit{font-weight:700; color:var(--arsb-navy);}
.arsb-app .arsb-table tbody tr.arsb-avail td.arsb-unit::after{
	content:"→"; margin-left:8px; color:var(--arsb-verdigris); font-weight:700; opacity:0.6;
}
.arsb-app .arsb-table tbody tr:hover{background:#F5F2E8;}
.arsb-app .arsb-table tbody tr.arsb-avail:hover{background:#D9EAE4;}
.arsb-app .arsb-table td.arsb-unit{font-weight:600;}
.arsb-app .arsb-table td.arsb-type{color:var(--arsb-graphite); font-size:12px;}

.arsb-app .arsb-badge{
	display:inline-block; font-size:10px; font-weight:700; letter-spacing:0.4px;
	text-transform:uppercase; padding:3px 8px; border-radius:20px; margin-left:8px; vertical-align:middle;
}
.arsb-app .arsb-badge.arsb-avail{background:var(--arsb-verdigris); color:#fff;}
.arsb-app .arsb-badge.arsb-sold{background:#E7E3D6; color:#8B8574;}

.arsb-app .arsb-empty-msg{text-align:center; padding:40px; color:var(--arsb-graphite); font-size:14px;}
.arsb-app .arsb-footer{text-align:center; padding:26px; font-size:12px; color:var(--arsb-graphite);}

@media(max-width:640px){
	.arsb-app .arsb-hero{padding:40px 18px 30px;}
	.arsb-app .arsb-controls{padding:14px;}
	.arsb-app .arsb-main{padding:26px 0 40px;}
	.arsb-app .arsb-table thead th, .arsb-app .arsb-table tbody td{padding:9px 8px; font-size:12px;}
}

/* ---------- BOOKING MODAL (single shared instance, injected once in wp_footer) ---------- */
#arsb-modal-overlay{
	position:fixed; inset:0; background:rgba(15,32,50,0.55); backdrop-filter:blur(2px);
	display:none; align-items:center; justify-content:center; z-index:99999; padding:20px;
}
#arsb-modal-overlay.arsb-open{display:flex;}
#arsb-modal-overlay .arsb-modal{
	background:#FFFFFF; width:100%; max-width:440px; border-radius:16px; overflow:hidden;
	box-shadow:0 30px 60px rgba(10,20,35,0.35); animation:arsbModalIn 0.22s ease;
	font-family:'Inter',sans-serif; color:#1B2430;
}
@keyframes arsbModalIn{
	from{opacity:0; transform:translateY(10px) scale(0.98);}
	to{opacity:1; transform:translateY(0) scale(1);}
}
#arsb-modal-overlay .arsb-modal-head{
	background:linear-gradient(180deg,#12283D 0%, #0E2032 100%); color:#F4F1EA; padding:22px 24px 18px; position:relative;
}
#arsb-modal-overlay .arsb-modal-head .arsb-eyebrow{
	font-size:11px; letter-spacing:2.5px; text-transform:uppercase; color:#9FC4B8; font-weight:600; margin-bottom:8px;
}
#arsb-modal-overlay .arsb-modal-head h3{
	font-family:'Fraunces',serif; font-weight:500; font-size:24px; margin:0 0 4px 0; color:#fff;
}
#arsb-modal-overlay .arsb-modal-head .arsb-meta{
	font-size:12.5px; color:#C7D2D9; display:flex; gap:14px; margin-top:10px; flex-wrap:wrap;
}
#arsb-modal-overlay .arsb-modal-head .arsb-meta b{color:#fff; font-family:'IBM Plex Mono',monospace;}
#arsb-modal-overlay .arsb-modal-close{
	position:absolute; top:16px; right:18px; background:rgba(255,255,255,0.1); border:none; color:#fff;
	width:28px; height:28px; border-radius:50%; cursor:pointer; font-size:15px; line-height:1; padding:0 !important;
}
#arsb-modal-overlay .arsb-modal-close:hover{background:rgba(255,255,255,0.2);}
#arsb-modal-overlay .arsb-modal-body{padding:22px 24px 24px;}
#arsb-modal-overlay .arsb-field{margin-bottom:16px;}
#arsb-modal-overlay .arsb-field label{
	display:flex; justify-content:space-between; align-items:baseline; font-size:12.5px;
	font-weight:700; color:#12283D; margin-bottom:6px;
}
#arsb-modal-overlay .arsb-field label .arsb-req{color:#3E7568; font-size:11px;}
#arsb-modal-overlay .arsb-field label .arsb-opt{color:#8B93A0; font-weight:500; font-size:11px; text-transform:none;}
#arsb-modal-overlay .arsb-field input{
	width:100%; padding:11px 12px; border-radius:9px; border:1.5px solid #DCD6C8;
	background:#FBFAF7; font-family:'Inter',sans-serif; font-size:14px; color:#1B2430; outline:none;
}
#arsb-modal-overlay .arsb-field input:focus{border-color:#3E7568;}
#arsb-modal-overlay .arsb-hp-wrap{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
#arsb-modal-overlay .arsb-modal-submit{
	width:100%; padding:13px; border:none; border-radius:9px; background:#3E7568;
	color:#fff; font-size:14.5px; font-weight:700; letter-spacing:0.3px; cursor:pointer; margin-top:6px;
}
#arsb-modal-overlay .arsb-modal-submit:hover{background:#345F55;}
#arsb-modal-overlay .arsb-modal-submit:disabled{opacity:0.6; cursor:not-allowed;}
#arsb-modal-overlay .arsb-modal-note{font-size:11.5px; color:#8B93A0; text-align:center; margin-top:12px; line-height:1.5;}
#arsb-modal-overlay .arsb-confirm-view{text-align:center; padding:12px 4px 4px;}
#arsb-modal-overlay .arsb-confirm-check{
	width:52px; height:52px; border-radius:50%; background:#E4EFEC; color:#3E7568;
	display:flex; align-items:center; justify-content:center; font-size:26px; margin:0 auto 16px;
}
#arsb-modal-overlay .arsb-confirm-view h4{
	font-family:'Fraunces',serif; font-size:20px; font-weight:500; margin:0 0 8px; color:#12283D;
}
#arsb-modal-overlay .arsb-confirm-view p{font-size:13.5px; color:#8B93A0; line-height:1.6; margin:0 0 20px;}
#arsb-modal-overlay .arsb-error-note{font-size:12.5px; color:#B4433B; text-align:center; margin-top:10px; display:none;}
#arsb-modal-overlay .arsb-error-note.arsb-show{display:block;}