:root {
  --irie-bk-bg: #f6f7fb;
  --irie-bk-panel: #ffffff;
  --irie-bk-panel2: #f8fafc;
  --irie-bk-line: rgba(17,24,39,.10);
  --irie-bk-line2: rgba(17,24,39,.16);
  --irie-bk-text: #111827;
  --irie-bk-muted: rgba(17,24,39,.68);
  --irie-bk-muted2: rgba(17,24,39,.52);
  --irie-bk-accent: #0ea5e9;
  --irie-bk-accent2: #7c3aed;
  --irie-bk-danger: #ef4444;
  --irie-bk-ok: #10b981;
  --irie-bk-shadow: 0 18px 45px rgba(17,24,39,.10);
  --irie-bk-shadow2: 0 12px 30px rgba(17,24,39,.08);
  --irie-bk-r: 18px;
  --irie-bk-r2: 22px;
  --irie-bk-font: ui-sans-serif, system-ui, -apple-system, "Hiragino Sans", "Noto Sans JP", Arial, sans-serif;
}

.irie-bk-wrap {
  max-width: 1260px;
  margin: 0 auto;
  padding: 22px 18px 30px;
  font-family: var(--irie-bk-font);
  font-size: 15px;
  color: var(--irie-bk-text);
}

.irie-bk-wrap * { box-sizing: border-box; }
.irie-bk-wrap a { color: inherit; }

/* Layout Grid */
.irie-bk-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr);
  gap: 18px;
  align-items: start;
}
@media (max-width: 980px) {
  .irie-bk-layout { grid-template-columns: minmax(0, 1fr); }
}

/* Base Card */
.irie-bk-card {
  background: linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.88));
  border: 1px solid var(--irie-bk-line);
  border-radius: var(--irie-bk-r2);
  box-shadow: var(--irie-bk-shadow);
  /* overflow: hidden; Removed to allow sticky stepper */
}
.irie-bk-card-hd {
  padding: 16px 18px;
  border-bottom: 1px solid var(--irie-bk-line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.92));
  border-top-left-radius: var(--irie-bk-r2);
  border-top-right-radius: var(--irie-bk-r2);
}
.irie-bk-card-hd h2 {
  font-size: 15px; margin: 0; letter-spacing: .06em;
}
.irie-bk-card-bd { padding: 18px; }

/* Stepper */
.irie-bk-stepper-box {
  position: sticky;
  top: 0;
  z-index: 5;
}
.irie-bk-stepper {
  display: flex;
  align-items: stretch;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
  gap: 10px;
  padding: 14px 16px;
  /* Removed bottom border since it is standalone */
  background: rgba(255,255,255,.75);
  backdrop-filter: blur(10px);
  border-radius: var(--irie-bk-r2);
}
.irie-bk-stepper::-webkit-scrollbar {
  display: none; /* Chrome/Safari */
}
@media (max-width: 980px) {
  /* On mobile, keep it sticky against the viewport instead of relative! */
  /* Remove position: relative; top: auto; so it stays sticky */
}
.irie-bk-step {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(17,24,39,.10);
  border-radius: 16px;
  min-width: 0;
  flex: 1 0 auto; /* Ensure it doesn't shrink, making horizontal scroll possible */
  background: rgba(255,255,255,.75);
  box-shadow: 0 8px 18px rgba(17,24,39,.06);
  opacity: 0.7;
  white-space: nowrap; /* Prevent contents from wrapping */
}
.irie-bk-step-bubble {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  border-radius: 10px;
  border: 1px solid rgba(17,24,39,.14);
  background: rgba(17,24,39,.04);
  font-weight: 800; font-size: 13px; flex: 0 0 auto;
}
.irie-bk-step-txt { min-width: 0; line-height: 1.2; }
.irie-bk-step-lbl {
  font-size: 13px; letter-spacing: .04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.irie-bk-step-desc {
  font-size: 12px; color: var(--irie-bk-muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.irie-bk-step.is-active {
  opacity: 1;
  border-color: rgba(14,165,233,.35);
  background: linear-gradient(180deg, rgba(14,165,233,.10), rgba(255,255,255,.85));
  box-shadow: 0 14px 28px rgba(14,165,233,.10);
}
.irie-bk-step.is-active .irie-bk-step-bubble {
  border-color: rgba(14,165,233,.40); background: rgba(14,165,233,.10); color: var(--irie-bk-accent);
}
.irie-bk-step.is-done {
  opacity: 1;
  border-color: rgba(16,185,129,.28); background: rgba(16,185,129,.08);
}
.irie-bk-step.is-done .irie-bk-step-bubble {
  border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.14); color: var(--irie-bk-ok); background-image: url('data:image/svg+xml;utf8,<svg fill="none" stroke="%2310b981" stroke-width="3" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7"></path></svg>');
  color: transparent;
}

/* Intent/Entry Bar */
.irie-bk-entrybar {
  padding: 16px 18px 18px;
  border-bottom: 1px solid var(--irie-bk-line);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,250,252,.92));
}
.irie-bk-entrygrid {
  display: grid;
  grid-template-columns: 1.1fr .9fr .9fr;
  gap: 12px;
  align-items: stretch;
}
@media (max-width: 760px) {
  .irie-bk-entrygrid { grid-template-columns: 1fr; }
}

.irie-bk-field {
  border: 1px solid rgba(17,24,39,.12);
  border-radius: 18px;
  padding: 12px 12px 10px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 10px 22px rgba(17,24,39,.06);
}
.irie-bk-lbl {
  font-size: 13px; color: var(--irie-bk-muted); letter-spacing: .04em; margin: 0 0 8px;
}

/* Pills & Inputs */
.irie-bk-pillrow { display: flex; flex-wrap: wrap; gap: 8px; }
.irie-bk-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-radius: 999px;
  border: 1px solid rgba(17,24,39,.14);
  background: rgba(17,24,39,.03);
  cursor: pointer; user-select: none; font-size: 14px;
  transition: transform .06s ease, border-color .15s ease, background .15s ease;
}
.irie-bk-pill:active { transform: scale(.98); }
.irie-bk-pill.is-on {
  border-color: rgba(14,165,233,.38); background: rgba(14,165,233,.10);
}
.irie-bk-dot {
  width: 9px; height: 9px; border-radius: 99px;
  background: rgba(17,24,39,.25); box-shadow: 0 0 0 3px rgba(17,24,39,.06);
}
.irie-bk-pill.is-on .irie-bk-dot {
  background: rgba(14,165,233,.95); box-shadow: 0 0 0 3px rgba(14,165,233,.12);
}

.irie-bk-select {
  width: 100%; padding: 11px 12px; border-radius: 14px;
  border: 1px solid rgba(17,24,39,.14); background: rgba(255,255,255,.92);
  color: var(--irie-bk-text); outline: none; font-size: 14px; font-family:inherit;
}

.irie-bk-input {
  width: 100%; padding: 11px 12px; border-radius: 14px;
  border: 1px solid rgba(17,24,39,.14); background: rgba(255,255,255,.92);
  color: var(--irie-bk-text); outline: none; font-size: 14px; font-family:inherit;
}

/* Buttons */
.irie-bk-btn {
  border: 1px solid rgba(17,24,39,.14);
  background: rgba(255,255,255,.85);
  color: var(--irie-bk-text);
  padding: 12px 14px; border-radius: 16px;
  cursor: pointer; user-select: none; font-weight: 800; letter-spacing: .02em;
  transition: transform .06s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
  box-shadow: 0 10px 20px rgba(17,24,39,.06); font-size: 14px; text-align: center;
}
.irie-bk-btn:active { transform: scale(.98); }
.irie-bk-btn.is-primary {
  border-color: rgba(14,165,233,.35);
  background: linear-gradient(180deg, rgba(14,165,233,.16), rgba(255,255,255,.92));
  box-shadow: 0 14px 28px rgba(14,165,233,.10);
  color: var(--irie-bk-text);
}
.irie-bk-btn.is-ghost {
  background: rgba(255,255,255,.70); box-shadow: 0 8px 18px rgba(17,24,39,.05);
}
.irie-bk-btn[disabled] { opacity: .4; cursor: not-allowed; pointer-events: none; }

/* Warning / Hint */
.irie-bk-warn {
  margin-top: 10px; padding: 10px 12px; border-radius: 14px;
  border: 1px solid rgba(239,68,68,.25); background: rgba(239,68,68,.08);
  font-size: 13px; line-height: 1.5; color: var(--irie-bk-text);
  display: none;
}
.irie-bk-warn.is-on { display: block; }
.irie-bk-hint { margin-top: 10px; font-size: 14px; color: var(--irie-bk-muted); line-height: 1.6; }

/* Panels */
.irie-bk-panel { display: none; }
.irie-bk-panel.is-active { display: block; }

.irie-bk-section-title {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; margin-bottom: 12px;
}
.irie-bk-section-title h2 { margin: 0; font-size: 15px; letter-spacing: .06em; }
.irie-bk-section-title .sub { color: var(--irie-bk-muted); font-size: 13px; line-height: 1.4; }

/* Grids */
.irie-bk-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px;
}
@media (max-width: 1180px) { .irie-bk-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px) { .irie-bk-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 420px) { .irie-bk-grid { grid-template-columns: 1fr; } }
.irie-bk-grid--3col { grid-template-columns: repeat(3, minmax(0,1fr)); }

/* Card Items */
.irie-bk-carditem {
  border: 1px solid rgba(17,24,39,.12); border-radius: 18px;
  background: rgba(255,255,255,.90); overflow: hidden; cursor: pointer;
  transition: transform .08s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
  min-height: 150px; display: flex; flex-direction: column; box-shadow: var(--irie-bk-shadow2);
}
.irie-bk-carditem:hover { transform: translateY(-1px); }
.irie-bk-carditem.is-selected {
  border-color: rgba(14,165,233,.70);
  box-shadow: 0 0 0 3px rgba(14,165,233,.14), var(--irie-bk-shadow);
  background: rgba(14,165,233,.06);
}
.irie-bk-thumb {
  height: 120px;
  background: radial-gradient(80px 60px at 20% 30%, rgba(14,165,233,.18), transparent 60%), radial-gradient(70px 60px at 80% 40%, rgba(124,58,237,.16), transparent 60%), rgba(17,24,39,.02);
  border-bottom: 1px solid rgba(17,24,39,.08); position: relative;
  background-size: cover; background-position: center;
}
.irie-bk-thumb::after {
  content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent, rgba(17,24,39,.08)); pointer-events: none;
}
.irie-bk-meta { padding: 12px; display: flex; flex-direction: column; gap: 6px; flex: 1 1 auto; }
.irie-bk-name { font-weight: 900; letter-spacing: .04em; font-size: 15px; }
.irie-bk-kana { font-size: 12px; color: var(--irie-bk-muted); white-space: nowrap; }
.irie-bk-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.irie-bk-tag { font-size: 12px; color: rgba(17,24,39,.86); padding: 4px 8px; border-radius: 999px; border: 1px solid rgba(17,24,39,.12); background: rgba(17,24,39,.03); }
.irie-bk-price-row { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--irie-bk-muted); }
.irie-bk-price-row b { color: var(--irie-bk-text); }

/* Suggest Box (No Pref) */
.irie-bk-placeholder {
  border: 1px dashed rgba(17,24,39,.18); border-radius: 18px; padding: 14px;
  background: rgba(255,255,255,.7); box-shadow: 0 10px 22px rgba(17,24,39,.05);
  color: var(--irie-bk-muted); line-height: 1.7; font-size: 14px; text-align: center; cursor: pointer; transition: all 0.2s ease;
}
.irie-bk-placeholder:hover { background: rgba(14,165,233,.05); border-color: rgba(14,165,233,.38); }
.irie-bk-placeholder b { color: rgba(17,24,39,.88); font-size: 15px; }

/* Options List */
.irie-bk-opt-item {
  border: 1px solid rgba(17,24,39,.12); border-radius: 16px; padding: 12px;
  background: rgba(255,255,255,.90); display: flex; align-items: flex-start; gap: 10px; box-shadow: 0 10px 22px rgba(17,24,39,.06); margin-bottom: 10px; cursor: pointer;
}
.irie-bk-opt-item.is-selected {
  border-color: rgba(14,165,233,.70); background: rgba(14,165,233,.06);
}
.irie-bk-opt-info { flex: 1; }
.irie-bk-opt-name { font-weight: 900; font-size: 14px; margin-bottom: 4px; }
.irie-bk-opt-desc { color: var(--irie-bk-muted); font-size: 13px; line-height: 1.45; }
.irie-bk-opt-price { margin-top: 6px; font-size: 13px; color: rgba(17,24,39,.86); }
.irie-bk-pill-mini { font-size: 12px; padding: 3px 8px; border-radius: 999px; border: 1px solid rgba(17,24,39,.12); background: rgba(17,24,39,.03); display: inline-block; }

/* Calendar & Times */
.irie-bk-cal-wrap { display: flex; flex-direction: column; gap: 18px; margin-top: 10px; }
.irie-bk-cal-wrap > div { width: 100%; }
.irie-bk-cal {
  border: 1px solid rgba(17,24,39,.12); border-radius: 18px; background: rgba(255,255,255,.92); overflow: hidden; box-shadow: var(--irie-bk-shadow2);
}
.irie-bk-cal-hd {
  display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-bottom: 1px solid rgba(17,24,39,.10); background: rgba(248,250,252,.92);
}
.irie-bk-cal-grid {
  display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: rgba(17,24,39,.08);
}
.irie-bk-cell, .irie-bk-dow {
  background: rgba(255,255,255,.92); min-height: 44px; padding: 8px; font-size: 13px; color: rgba(17,24,39,.84); display: flex; align-items: flex-start; justify-content: flex-start; cursor: pointer;
}
.irie-bk-dow {
  background: rgba(17,24,39,.03); color: var(--irie-bk-muted); cursor: default; min-height: 34px; align-items: center; justify-content: center; font-size: 12px;
}
.irie-bk-cell.is-off { opacity: .38; cursor: default; }
.irie-bk-cell.is-selected { outline: 2px solid rgba(14,165,233,.65); outline-offset: -2px; background: rgba(14,165,233,.10); }

.irie-bk-times {
  border: 1px solid rgba(17,24,39,.12); border-radius: 18px; background: rgba(255,255,255,.92); padding: 12px; box-shadow: var(--irie-bk-shadow2);
}
.irie-bk-timegrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 14px; }
@media (max-width: 760px) { .irie-bk-timegrid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 420px) { .irie-bk-timegrid { grid-template-columns: repeat(2, 1fr); } }
.irie-bk-timebtn {
  padding: 10px 12px; border-radius: 999px; border: 1px solid rgba(17,24,39,.14); background: rgba(17,24,39,.03); cursor: pointer; font-size: 13.5px;
}
.irie-bk-timebtn.is-selected {
  border-color: rgba(14,165,233,.55); background: rgba(14,165,233,.12); box-shadow: 0 0 0 3px rgba(14,165,233,.10);
}
.irie-bk-timebtn.is-disabled { opacity: .38; cursor: not-allowed; }

/* Summary */
.irie-bk-sumbox {
  position: sticky; top: 0; z-index: 3;
}
@media (max-width: 980px) { .irie-bk-sumbox { position: relative; top: auto; } }
.irie-bk-sumrow {
  display: flex; justify-content: space-between; gap: 14px; align-items: baseline; padding: 10px 12px;
  border: 1px solid rgba(17,24,39,.10); border-radius: 16px; background: rgba(255,255,255,.92); box-shadow: 0 10px 22px rgba(17,24,39,.06); margin-bottom: 8px; font-size: 13.5px;
}
.irie-bk-sumrow span { color: var(--irie-bk-muted); }
.irie-bk-sumrow b { text-align: right; font-weight: bold;}

.irie-bk-sumbig {
  padding: 12px; border-radius: 18px; border: 1px solid rgba(14,165,233,.16);
  background: linear-gradient(180deg, rgba(14,165,233,.08), rgba(255,255,255,.92));
  display: grid; gap: 10px; margin-top: 10px; box-shadow: 0 14px 28px rgba(14,165,233,.08);
}
.irie-bk-kpi { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.irie-bk-kpi .lbl { color: rgba(17,24,39,.86); font-weight: 900; font-size: 13.5px; }
.irie-bk-kpi .val { font-weight: 900; font-size: 17px; }

.irie-bk-sumactions {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 10px; margin-top: 14px;
}
.irie-bk-sumactions .irie-bk-btn { padding: 15px 14px; font-size: 14.5px; border-radius: 18px; }

@media (max-width: 820px) {
  .irie-bk-sumactions {
    position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    margin: 0 !important; padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
    background: rgba(255,255,255,.92) !important; backdrop-filter: blur(10px);
    border-top: 1px solid rgba(17,24,39,.14) !important; box-shadow: 0 -14px 38px rgba(17,24,39,.14) !important;
    z-index: 9999 !important; display: flex !important; justify-content: center !important; width: 100% !important;
  }
  .irie-bk-sumactions .irie-bk-btn { flex: 1 1 160px; max-width: 420px; }
}

/* Utilities */
.irie-bk-mono { font-feature-settings: "tnum"; font-variant-numeric: tabular-nums; }

/* WordPress Admin Bar Compatibility */
body.admin-bar .irie-bk-stepper-box,
body.admin-bar .irie-bk-sumbox {
  top: 32px;
}
@media screen and (max-width: 782px) {
  body.admin-bar .irie-bk-stepper-box,
  body.admin-bar .irie-bk-sumbox {
    top: 46px;
  }
}