body { font-family: Arial, Helvetica, sans-serif; background: #f7f7f7; }
.container { max-width: 960px; margin: 30px auto; background: #fff; padding: 20px; border-radius: 10px; box-shadow: 0 5px 25px rgba(0,0,0,.05); }
h1,h2 { margin-top: 0; }
.btn { display:inline-block; padding:10px 16px; border-radius:8px; border:1px solid #ddd; background:#111; color:#fff; text-decoration:none; cursor:pointer; }
.btn.secondary { background:#fff; color:#111; }
.table { width:100%; border-collapse: collapse; }
.table th, .table td { padding: 10px; border-bottom: 1px solid #eee; }
.badge { padding: 4px 8px; border-radius: 20px; font-size: 12px; }
.badge.available { background:#e6ffed; color:#0b8a2b; }
.badge.reserved { background:#fff4e5; color:#a66a00; }
.badge.paid { background:#e6f0ff; color:#0040a6; }
.badge.blocked { background:#ffe6e6; color:#a60000; }
input, select { padding:10px; border:1px solid #ddd; border-radius:8px; width:100%; box-sizing:border-box; }
.row { display:flex; gap:12px; }
.col { flex:1; }
.card { border:1px solid #eee; border-radius:10px; padding:14px; margin: 10px 0; }
.small { font-size: 12px; color:#666; }
nav a { margin-right: 10px; }
label { font-weight: bold; font-size: 14px; }
.modal { position: fixed; inset: 0; background: rgba(0,0,0,.5); display:none; align-items:center; justify-content:center; }
.modal .box { background:#fff; padding:20px; border-radius:10px; max-width:520px; width:92%; }
.text-right { text-align:right; }