.hippo-availability { --ivory:#F5F0E6; --sand:#C8A96E; --gold:#A07835; --bark:#2A1A08; --night:#0E0A04; --sage:#6E7D60; background:var(--bark); box-sizing:border-box; color:var(--ivory); font-family:'Lato',sans-serif; margin-left:calc(50% - 50vw); padding:4rem 5rem 0; width:100vw; }
.hippo-availability *, .hippo-availability *::before, .hippo-availability *::after { box-sizing:border-box; }
.hippo-availability__search { align-items:end; background:rgba(0,0,0,.18); display:flex; flex-wrap:wrap; gap:1rem; margin-bottom:1.4rem; padding:1rem; }.hippo-availability__search label { color:rgba(245,240,230,.65); display:grid; font-size:.58rem; gap:.35rem; letter-spacing:.14em; text-transform:uppercase; }.hippo-availability input { background:transparent; border:1px solid rgba(196,154,108,.35); color:var(--ivory); font:400 .85rem Montserrat,sans-serif; min-height:40px; padding:.55rem; }.hippo-availability__search button { background:transparent; border:1px solid rgba(196,154,108,.42); color:var(--ivory); cursor:pointer; font:600 .62rem Montserrat,sans-serif; letter-spacing:.16em; min-height:40px; padding:.65rem 1rem; text-transform:uppercase; }.hippo-availability__search button:hover, .hippo-availability__search button:focus-visible { background:var(--sand); color:var(--night); }
.hippo-availability__status { color:var(--sand); font-size:.76rem; min-height:1.2em; }.hippo-availability__results { display:grid; gap:2px; grid-template-columns:repeat(3,minmax(0,1fr)); margin:0 0 1.6rem; }.hippo-availability__empty { color:rgba(245,240,230,.65); grid-column:1/-1; margin:0; padding:1rem 0; }
.hippo-availability .avail-head { align-items:flex-end; display:flex; justify-content:space-between; margin-bottom:1.8rem; }.hippo-availability .s-label { color:var(--gold); display:block; font-size:.6rem; font-weight:300; letter-spacing:.48em; margin-bottom:1rem; text-transform:uppercase; }.hippo-availability .avail-head h2 { color:var(--ivory); font-family:'Cormorant Garamond',serif; font-size:1.7rem; font-weight:300; margin:0; }.hippo-availability .avail-head h2 em { color:var(--sand); font-style:italic; }
.avail-legend { align-items:center; display:flex; flex-wrap:wrap; gap:1.2rem; justify-content:flex-end; }.leg-item { align-items:center; color:rgba(245,240,230,.5); display:flex; font-size:.6rem; font-weight:300; gap:.35rem; letter-spacing:.15em; text-transform:uppercase; }.leg-dot { border-radius:50%; flex-shrink:0; height:8px; width:8px; }.leg-available { background:var(--sage); }.leg-limited { background:var(--gold); }.leg-booked { background:#8B3A3A; }
.cal-scroll-nav { align-items:center; display:flex; justify-content:space-between; margin-bottom:1rem; }.cal-scroll-nav button { align-items:center; background:none; border:1px solid rgba(160,120,53,.25); color:var(--sand); cursor:pointer; display:flex; flex-shrink:0; font-family:'Lato',sans-serif; font-size:.9rem; font-weight:300; height:28px; justify-content:center; letter-spacing:0; min-height:0; padding:0; text-transform:none; transition:all .3s; width:28px; }.cal-scroll-nav button:hover, .cal-scroll-nav button:focus-visible { border-color:var(--gold); color:var(--ivory); }.cal-scroll-nav button:disabled { cursor:default; opacity:.2; }.cal-scroll-label { color:rgba(245,240,230,.4); font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.18em; }
.cal-grid { background:rgba(160,120,53,.08); display:grid; gap:1px; grid-template-columns:repeat(3,1fr); }.cal-month { background:var(--bark); overflow:visible; padding:1rem; position:relative; }.cal-month-title { color:var(--sand); display:block; font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.16em; margin-bottom:.8rem; text-align:center; }.cal-days-header { display:grid; grid-template-columns:repeat(7,1fr); margin-bottom:2px; }.cal-day-name { color:rgba(245,240,230,.25); font-size:.5rem; letter-spacing:.1em; padding:.3rem 0; text-align:center; text-transform:uppercase; }.cal-days { display:grid; gap:1px; grid-template-columns:repeat(7,1fr); overflow:visible; position:relative; }
.cal-day { align-items:center; aspect-ratio:1; background:rgba(160,120,53,.08); border:0; border-radius:0; color:rgba(245,240,230,.55); cursor:default; display:flex; font-family:'Lato',sans-serif; font-size:.7rem; font-weight:300; justify-content:center; outline:none; padding:0; position:relative; transition:all .2s; width:100%; }.cal-day.empty { background:transparent; }.cal-day.past { background:transparent; color:rgba(245,240,230,.15); }.cal-day.available { background:rgba(110,125,96,.2); color:rgba(245,240,230,.8); }.cal-day.available:hover,.cal-day.available:focus { background:rgba(110,125,96,.35); }.cal-day.limited { background:rgba(160,120,53,.24); color:rgba(245,240,230,.82); }.cal-day.limited:hover,.cal-day.limited:focus { background:rgba(160,120,53,.38); }.cal-day.booked { background:rgba(139,58,58,.72); border-radius:0; box-shadow:none; color:var(--ivory); }.cal-day.booked > span:first-child { text-decoration:line-through; }.cal-day.today { color:var(--sand); font-weight:400; }.cal-day.has-tooltip,.cal-day.admin-mode { cursor:pointer; }.cal-day:hover,.cal-day:focus,.cal-day:focus-within { z-index:50; }.cal-day.admin-mode.available:hover,.cal-day.admin-mode.available:focus { background:rgba(160,120,53,.35); color:rgba(245,240,230,.75); }.cal-day.admin-mode.limited:hover,.cal-day.admin-mode.limited:focus { background:rgba(160,120,53,.45); color:rgba(245,240,230,.82); }.cal-day.booked:hover,.cal-day.booked:focus,.cal-day.admin-mode.booked:hover,.cal-day.admin-mode.booked:focus { background:rgba(139,58,58,.9); color:var(--ivory); }.cal-day.selected { box-shadow:none; }
.hippo-availability .cal-days .cal-day { border:0!important; border-radius:0!important; box-shadow:none!important; outline:0!important; }
.cal-date-tooltip { background:rgba(14,10,4,.98); border:1px solid rgba(160,120,53,.42); bottom:calc(100% + 10px); box-shadow:0 16px 36px rgba(0,0,0,.48); color:rgba(245,240,230,.68); left:50%; max-width:72vw; opacity:0; padding:.75rem .85rem; pointer-events:none; position:absolute; text-align:left; text-decoration:none; transform:translateX(-50%) translateY(4px); transition:opacity .18s,transform .18s,visibility .18s; visibility:hidden; width:240px; z-index:3000; }.cal-day:hover .cal-date-tooltip,.cal-day:focus .cal-date-tooltip,.cal-day:focus-visible .cal-date-tooltip { opacity:1; transform:translateX(-50%) translateY(0); visibility:visible; }.cal-tip-title { color:var(--sand); display:block; font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.16em; margin-bottom:.35rem; text-transform:uppercase; }.cal-tip-count { color:var(--gold); display:block; font-size:.66rem; letter-spacing:.08em; margin-bottom:.35rem; text-transform:uppercase; }.cal-tip-list,.cal-tip-note { color:rgba(245,240,230,.62); display:block; font-size:.68rem; line-height:1.55; }.cal-tip-note { color:rgba(245,240,230,.58); }.cal-room-detail-btn { background:var(--gold); color:var(--night); display:inline-block; font-size:.56rem; letter-spacing:.18em; margin-top:.75rem; padding:.45rem .75rem; text-decoration:none; text-transform:uppercase; transition:background .2s,color .2s; }.cal-room-detail-btn:hover { background:var(--sand); color:var(--night); }
.cal-availability-preview { background:rgba(0,0,0,.26); border:1px solid rgba(160,120,53,.16); margin-top:1rem; min-height:58px; padding:.9rem 1rem; }.cal-preview-empty { color:rgba(245,240,230,.38); font-size:.68rem; line-height:1.55; }.admin-bar { align-items:center; background:rgba(0,0,0,.25); display:flex; flex-wrap:wrap; gap:.8rem; justify-content:space-between; margin-top:1.5rem; padding:.8rem 1.2rem; }.admin-bar p { color:rgba(245,240,230,.28); font-size:.65rem; font-weight:300; margin:0; }.admin-bar button { background:none; border:1px solid rgba(160,120,53,.18); color:rgba(245,240,230,.28); cursor:pointer; font-family:'Lato',sans-serif; font-size:.55rem; font-weight:300; letter-spacing:.2em; min-height:0; padding:.35rem .9rem; text-transform:uppercase; transition:all .3s; }.admin-bar button:hover,.admin-bar button:focus-visible { border-color:var(--gold); color:var(--sand); }.admin-bar button.active { background:rgba(160,120,53,.08); border-color:var(--gold); color:var(--gold); }
.admin-prompt,.room-editor { background:rgba(0,0,0,.4); border:1px solid rgba(160,120,53,.18); display:none; margin-top:.8rem; padding:1rem 1.2rem; }.admin-prompt p { color:rgba(245,240,230,.45); font-size:.68rem; font-weight:300; margin:0 0 .7rem; }.admin-prompt a { background:var(--gold); color:var(--night); display:inline-block; font-size:.58rem; letter-spacing:.18em; padding:.5rem 1rem; text-decoration:none; text-transform:uppercase; }.admin-active-notice { color:var(--gold); display:none; font-size:.62rem; letter-spacing:.12em; padding:.4rem 0; }.room-editor { background:rgba(0,0,0,.32); }.room-editor-head { align-items:flex-start; display:flex; gap:1rem; justify-content:space-between; margin-bottom:.8rem; }.room-editor-title { color:var(--sand); font-family:'Cinzel',serif; font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; }.room-editor-sub { color:rgba(245,240,230,.4); font-size:.68rem; font-weight:300; margin-top:.2rem; }.room-editor-close { background:none; border:1px solid rgba(160,120,53,.2); color:rgba(245,240,230,.45); cursor:pointer; font-size:1rem; height:28px; line-height:1; min-height:0; padding:0; transition:all .2s; width:28px; }.room-editor-close:hover,.room-editor-close:focus-visible { border-color:var(--gold); color:var(--sand); }.room-checks { display:grid; gap:.45rem .9rem; grid-template-columns:repeat(2,minmax(0,1fr)); }.room-check { align-items:flex-start; background:rgba(255,255,255,.03); border:1px solid rgba(160,120,53,.1); display:flex; gap:.55rem; padding:.45rem .55rem; }.room-check input { accent-color:var(--gold); margin-top:.15rem; }.room-check-name { color:rgba(245,240,230,.72); display:block; font-size:.72rem; }.room-check-note { color:rgba(245,240,230,.35); display:block; font-size:.58rem; line-height:1.45; margin-top:.1rem; }
.hippo-availability-card { background:#0c0806; min-height:290px; overflow:hidden; position:relative; }.hippo-availability-card__media { background:center/cover no-repeat; inset:0; opacity:.8; position:absolute; }.hippo-availability-card__overlay { background:linear-gradient(to top,rgba(14,10,4,.94),rgba(14,10,4,.22) 64%,transparent); color:var(--ivory); display:flex; flex-direction:column; height:100%; justify-content:flex-end; padding:1.3rem; position:relative; text-decoration:none; }.hippo-availability-card h3 { font:300 1.6rem 'Cormorant Garamond',serif; margin:.35rem 0; }.hippo-availability-card p { font-size:.8rem; line-height:1.55; margin:.2rem 0; }.hippo-availability-card footer { color:var(--sand); display:flex; font-size:.6rem; justify-content:space-between; letter-spacing:.1em; margin-top:.5rem; }.hippo-availability-card footer b { letter-spacing:.16em; }.hippo-availability-card__state { color:#cbd1c3; font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; }.hippo-availability-card__state.is-limited { color:var(--sand); }
@media(max-width:900px) { .cal-grid,.hippo-availability__results { grid-template-columns:repeat(2,1fr); } } @media(max-width:560px) { .hippo-availability { padding:4rem 1.25rem 0; }.avail-head { align-items:flex-start; flex-direction:column; }.cal-grid,.hippo-availability__results { grid-template-columns:1fr; }.hippo-availability__search { align-items:stretch; flex-direction:column; }.hippo-availability__search button { width:100%; }.cal-date-tooltip { display:none; }.room-checks { grid-template-columns:1fr; } } @media(prefers-reduced-motion:reduce) { .hippo-availability * { transition:none!important; } }