@scope (#reservationApp) {
  :scope.availability-check-app { text-align: left; }
  .availabilityHero { padding-bottom: 44px; }
  .availabilityHero h1,
  .availabilityHero p,
  .checkMain,
  .checkMain .heading,
  .checkMain .heading h2,
  .checkMain .heading p { text-align: left !important; }
  .checkMain { padding-top: 48px; }
  .availabilityLegend { justify-content: flex-start; }
  .availabilityLegend > span { display:inline-flex; align-items:center; gap:3px; white-space:nowrap; }
  .availabilityMark {
    display: grid;
    place-items: center;
    width: 100%;
    height: 48px;
    color: var(--green);
    font-weight: bold;
    user-select: none;
  }
  .availabilityMark.busy,
  .availabilityMark.hold { background: #f5f6f5; color: #97a39f; }
  .availabilityMark.inquiry {
    border: 0;
    background: #fff5ef;
    color: #b65d3e;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
  }
  .availabilityMark.inquiry img { width: 16px; height: 16px; opacity: .72; }
  .availabilityMark.inquiry:hover,
  .availabilityMark.inquiry:focus-visible { background: #ffe7da; color: #8f3f28; }
  .availabilityMark.inquiry:hover img,
  .availabilityMark.inquiry:focus-visible img { opacity: 1; }
  .availabilityLegend i.inquiry { display:grid; place-items:center; background: #fff5ef; color: #b65d3e; }
  .availabilityLegend i.inquiry img { width: 16px; height: 16px; opacity: .72;  margin: 4px 0;}
  .dateNav button:disabled,
  .calendarHead button:disabled { opacity: .35; cursor: not-allowed; }
  .availabilityInquiryDialog { width:min(680px,calc(100% - 28px)); max-width:none; padding:0; border:0; border-radius:18px; background:transparent; color:var(--ink); box-shadow:0 24px 80px #102d2655; }
  .availabilityInquiryDialog::backdrop { background:#102d267a; backdrop-filter:blur(3px); }
  .availabilityInquiryPanel { position:relative; padding:36px; border-radius:18px; background:#fff; text-align:center; }
  .availabilityInquiryClose { position:absolute; top:13px; right:13px; display:grid; place-items:center; width:38px; height:38px; padding:0; border:1px solid var(--line); border-radius:50%; background:#fff; color:var(--muted); font-size:23px; line-height:1; cursor:pointer; }
  .availabilityInquiryIcon { width:42px; height:42px; margin-bottom:10px; opacity:.78; }
  .availabilityInquiryPanel h2 { margin:0; font-size:24px; line-height:1.55; text-align:center!important; }
  .availabilityInquiryChoices { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:26px; }
  .availabilityInquiryChoices section { min-width:0; padding:23px 20px; border:1px solid var(--line); border-radius:13px; background:#fafcfb; text-align:left; }
  .availabilityInquiryChoices small { display:block; margin-bottom:10px; color:var(--muted); font-size:12px; font-weight:bold; }
  .availabilityInquiryPhone { display:block; color:var(--green); font-size:25px; font-weight:bold; letter-spacing:.02em; text-decoration:none; }
  .availabilityInquiryMail { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:45px; padding:12px 15px; border-radius:8px; background:var(--coral); color:#fff; font-size:15px; font-weight:bold; text-decoration:none; }
  .availabilityInquiryChoices p { margin:14px 0 0; color:var(--muted); font-size:12px; line-height:1.65; }
  .availabilityInquiryChoices p strong,
  .availabilityInquiryChoices p span { display:block; }
  .csvUpdatedAt { margin: 6px 4px 0; color: #99a5a1; font-size: 10px; line-height: 1.4; text-align: right; }
  .availabilityNote { margin: 14px 3px 0; color: var(--muted); font-size: 11px; text-align: left; }
  #loading { min-height: 150px; }

  @media (max-width: 850px) {
    .availabilityHero { padding-bottom: 34px; }
    .checkMain { padding-top: 38px; }
  }

  @media (max-width: 560px) {
    .availabilityHero { padding-bottom: 30px; }
    .availabilityHero h1 { font-size: 34px; }
    .checkMain { padding-top: 32px; }
    .availabilityMark { height: 46px; }
    .availabilityInquiryPanel { padding:32px 18px 20px; }
    .availabilityInquiryPanel h2 { padding:0 20px; font-size:20px; }
    .availabilityInquiryChoices { grid-template-columns:1fr; gap:10px; margin-top:20px; }
    .availabilityInquiryChoices section { padding:18px; }
    .availabilityInquiryPhone { font-size:23px; }
  }
}