/*
 * 沖縄ビーチヨガ — 管理・業務画面のデザインシステム(.by-admin-*)
 * 公開サイト(application.css / .by-page)のトークン(色・フォント・角丸・影)を再利用し、
 * 業務ツールとして情報密度と操作性を優先した専用コンポーネントを定義する。
 * 業務系レイアウト(layouts/admin)でのみ application.css に「追加」読み込みする(公開ページには載せない)。
 * 変数(--ac 等)・フォント・リセット(.by-page *)は application.css の .by-page ラッパーから継承する。
 */

/* ページ土台。.by-page の変数/フォント/背景を継承しつつ、フッターを最下部に貼る縦フレックス */
.by-admin{min-height:100dvh;display:flex;flex-direction:column;}

/* =========================================================================
   トップバー
   ========================================================================= */
.by-admin-bar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
  -webkit-backdrop-filter:saturate(120%) blur(12px);backdrop-filter:saturate(120%) blur(12px);
  border-bottom:1px solid rgba(22,50,58,.12);}
.by-admin-bar__inner{max-width:1320px;margin:0 auto;padding:0 clamp(16px,3vw,40px);
  min-height:64px;display:flex;align-items:center;gap:clamp(10px,2vw,24px);}

.by-admin-brand{display:flex;align-items:center;gap:11px;flex:none;color:#16323a;}
.by-admin-brand svg{position:relative;top:1px;}
.by-admin-brand__site{display:flex;align-items:center;}
a.by-admin-brand__en:hover,a.by-admin-brand__tag:hover{color:var(--ac,#c9743f);}
.by-admin-brand__txt{display:flex;flex-direction:column;gap:3px;line-height:1;}
.by-admin-brand__en{font-family:'Cormorant Garamond',serif;font-size:1rem;letter-spacing:.2em;
  font-weight:600;white-space:nowrap;}
.by-admin-brand__tag{font-size:.58rem;letter-spacing:.3em;color:#8a9794;white-space:nowrap;}

.by-admin-nav{display:flex;align-items:center;gap:clamp(2px,.6vw,8px);margin-left:auto;min-width:0;}
.by-admin-nav a,.by-admin-nav summary{font-size:.82rem;letter-spacing:.05em;color:#41565a;
  padding:8px 13px;border-radius:2px;white-space:nowrap;transition:background .2s ease,color .2s ease;}
.by-admin-nav a:hover,.by-admin-nav summary:hover{background:rgba(22,50,58,.06);color:#16323a;}
.by-admin-nav a.is-active{color:var(--ac,#c9743f);font-weight:600;}

/* マスタのドロップダウン(details/summary。JSレス) */
.by-admin-menu{position:relative;}
.by-admin-menu>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:7px;}
.by-admin-menu>summary::-webkit-details-marker{display:none;}
.by-admin-menu>summary::after{content:"";width:6px;height:6px;border-right:1.4px solid currentColor;
  border-bottom:1.4px solid currentColor;transform:rotate(45deg);opacity:.55;margin-top:-3px;transition:transform .2s ease;}
.by-admin-menu[open]>summary{background:rgba(22,50,58,.06);color:#16323a;}
.by-admin-menu[open]>summary::after{transform:rotate(-135deg);margin-top:2px;}
.by-admin-menu__panel{position:absolute;top:calc(100% + 8px);right:0;min-width:200px;background:#fff;
  border:1px solid rgba(22,50,58,.12);border-radius:3px;box-shadow:0 16px 44px rgba(22,50,58,.16);
  padding:6px;display:grid;gap:1px;z-index:60;}
.by-admin-menu__panel a{display:block;padding:9px 13px;font-size:.85rem;color:#41565a;border-radius:2px;letter-spacing:.03em;}
.by-admin-menu__panel a:hover{background:rgba(22,50,58,.06);color:#16323a;}

/* ログアウト(button_to が生成する form ごとレイアウトに乗せる) */
.by-admin-logout{flex:none;margin:0;}
.by-admin-logout button{font-family:inherit;cursor:pointer;font-size:.76rem;letter-spacing:.06em;
  color:#8a3b1a;background:rgba(201,116,63,.1);border:1px solid rgba(201,116,63,.28);
  padding:8px 15px;border-radius:2px;white-space:nowrap;transition:background .2s ease;}
.by-admin-logout button:hover{background:rgba(201,116,63,.18);}

/* =========================================================================
   メインコンテナ / 見出し
   ========================================================================= */
.by-admin-main{flex:1;width:100%;max-width:1240px;margin:0 auto;
  padding:clamp(24px,4vw,44px) clamp(16px,3vw,40px) clamp(56px,7vw,88px);}

/* フッター(最小) */
.by-admin-foot{padding:22px 20px;text-align:center;font-size:.72rem;letter-spacing:.06em;
  color:#8a9794;border-top:1px solid rgba(22,50,58,.08);}
.by-admin-foot a:hover{color:var(--ac,#c9743f);}

.by-admin-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;
  flex-wrap:wrap;margin-bottom:clamp(20px,3vw,32px);}
.by-admin-head__l{min-width:0;}
.by-admin-head h1{font-family:'Shippori Mincho',serif;font-weight:600;
  font-size:clamp(1.4rem,2.6vw,2rem);color:#16323a;line-height:1.4;letter-spacing:.02em;}
.by-admin-head .by-admin-sub{font-size:.85rem;color:#73827f;margin-top:7px;line-height:1.7;}
.by-admin-back{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:#73827f;margin-bottom:14px;}
.by-admin-back:hover{color:var(--ac,#c9743f);}

/* 一覧内のセクション見出し(「今後の予約」等) */
.by-admin-secttl{font-family:'Shippori Mincho',serif;font-weight:600;font-size:1.12rem;color:#16323a;
  margin:clamp(30px,4vw,44px) 0 14px;display:flex;align-items:baseline;gap:10px;}
.by-admin-secttl:first-child{margin-top:0;}

/* =========================================================================
   パネル(白カード)
   ========================================================================= */
.by-admin-panel{background:#fff;border-radius:3px;box-shadow:0 14px 40px rgba(22,50,58,.07);
  border:1px solid rgba(22,50,58,.06);}
.by-admin-panel--pad{padding:clamp(22px,3vw,36px);}
.by-admin-panel--narrow{max-width:760px;}

/* =========================================================================
   テーブル(狭幅ではラッパーが横スクロール)
   ========================================================================= */
.by-admin-tablewrap{background:#fff;border-radius:3px;box-shadow:0 14px 40px rgba(22,50,58,.07);
  border:1px solid rgba(22,50,58,.06);overflow-x:auto;}
.by-admin-table{width:100%;border-collapse:collapse;font-size:.86rem;min-width:560px;}
.by-admin-table th,.by-admin-table td{text-align:left;padding:12px 15px;vertical-align:middle;
  border-bottom:1px solid rgba(22,50,58,.08);}
.by-admin-table thead th{background:#f2f7f5;color:#46595c;font-weight:600;font-size:.73rem;
  letter-spacing:.07em;white-space:nowrap;border-bottom:1px solid rgba(22,50,58,.14);}
.by-admin-table tbody tr:last-child td{border-bottom:none;}
.by-admin-table tbody tr:hover{background:rgba(22,50,58,.022);}
.by-admin-table .num{font-family:'Cormorant Garamond',serif;font-size:1.02rem;letter-spacing:.03em;color:#16323a;}
.by-admin-table .nowrap{white-space:nowrap;}
.by-admin-table td.col-actions{white-space:nowrap;}
.by-admin-table td.msg{max-width:320px;font-size:.82rem;color:#46595c;line-height:1.7;}
.by-admin-table .masked{color:#8a9794;letter-spacing:.06em;}
.by-admin-note{margin-top:10px;font-size:.76rem;color:#8a9794;letter-spacing:.03em;}

/* 自動保存のエラートースト(成功時は無音。表示制御は schedule_form_controller) */
.by-admin-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,8px);background:#16323a;color:#eef4f3;
  font-size:.8rem;letter-spacing:.08em;padding:10px 22px;border-radius:2px;opacity:0;pointer-events:none;
  transition:opacity .25s ease,transform .25s ease;z-index:200;
  /* fixed+left:50% は shrink-to-fit が右半分幅で計算され狭くなるため、内容幅で確保して上限だけ制限する。
     body直下に追加され .by-page のリセットが効かないので box-sizing も明示する */
  width:max-content;max-width:calc(100vw - 40px);box-sizing:border-box;}
.by-admin-toast.is-error{background:#8a3b1a;}
.by-admin-toast.is-show{opacity:1;transform:translate(-50%,0);}

/* =========================================================================
   ボタン(管理用・小型)
   ========================================================================= */
.by-admin-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;font-family:inherit;
  cursor:pointer;font-size:.8rem;letter-spacing:.04em;line-height:1.2;padding:9px 18px;border-radius:2px;
  border:1px solid transparent;white-space:nowrap;
  transition:background .2s ease,color .2s ease,border-color .2s ease,filter .2s ease;}
/* 変種は二重クラスで詳細度を .by-page button リセット(background:none, 詳細度0,1,1)より上げる。
   button_to 由来の button だと単一クラスでは負けて背景が消える(primary は白文字で不可視になる)。
   公開側 .by-btn.by-btn--primary と同じ手法。 */
.by-admin-btn.by-admin-btn--primary{background:var(--ac,#c9743f);color:#fff;}
.by-admin-btn.by-admin-btn--primary:hover{filter:brightness(1.07);}
.by-admin-btn.by-admin-btn--outline{border-color:rgba(22,50,58,.28);color:#16323a;background:#fff;}
.by-admin-btn.by-admin-btn--outline:hover{border-color:#16323a;background:#16323a;color:#eef4f3;}
.by-admin-btn.by-admin-btn--subtle{background:rgba(22,50,58,.06);color:#16323a;}
.by-admin-btn.by-admin-btn--subtle:hover{background:rgba(22,50,58,.12);}
.by-admin-btn.by-admin-btn--danger{border-color:rgba(201,116,63,.35);color:#8a3b1a;background:rgba(201,116,63,.08);}
.by-admin-btn.by-admin-btn--danger:hover{background:rgba(201,116,63,.16);}
.by-admin-btn--sm{padding:6px 12px;font-size:.74rem;letter-spacing:.03em;}
.by-admin-btn--block{width:100%;}

/* button_to は form を生む。行内アクションを横並びにするラッパー */
.by-admin-actions{display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.by-admin-actions form{margin:0;}
.by-admin-actions .sep{color:rgba(22,50,58,.2);}

/* =========================================================================
   バッジ / ステータス
   ========================================================================= */
.by-admin-badge{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;letter-spacing:.04em;
  padding:3px 11px;border-radius:100px;white-space:nowrap;line-height:1.6;}
.by-admin-badge--muted{background:rgba(22,50,58,.08);color:#6c7b78;}
.by-admin-badge--ac{background:rgba(201,116,63,.13);color:#8a3b1a;}
.by-admin-badge--ok{background:rgba(42,120,88,.13);color:#2a7858;}
.by-admin-badge--dot::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;}

/* =========================================================================
   flash
   ========================================================================= */
.by-admin-flash{margin-bottom:22px;display:grid;gap:10px;}
/* 枠(背景+余白)は p 以外にも効かせる。訳の陳腐化のように、見出し行と対象一覧を
   ひとつの枠へまとめたいケースがあるため(p の中に ul は置けない) */
.by-admin-flash p,.by-admin-flash .notice,.by-admin-flash .alert{padding:13px 18px;border-radius:2px;font-size:.9rem;line-height:1.7;}
.by-admin-flash .notice{background:#e3efec;color:#16323a;border:1px solid rgba(22,50,58,.14);}
.by-admin-flash .alert{background:#f6e6dd;color:#8a3b1a;border:1px solid rgba(201,116,63,.3);}

/* =========================================================================
   フォーム
   ========================================================================= */
.by-admin-form{display:grid;gap:18px;max-width:640px;}
.by-admin-field{display:grid;gap:7px;}
.by-admin-field>label,.by-admin-form>p>label:first-child{font-family:'Shippori Mincho',serif;
  font-size:.9rem;color:#16323a;}
.by-admin-form input[type=text],.by-admin-form input[type=email],.by-admin-form input[type=tel],
.by-admin-form input[type=number],.by-admin-form input[type=password],.by-admin-form input[type=search],
.by-admin-form input[type=date],.by-admin-form input[type=datetime-local],
.by-admin-form select,.by-admin-form textarea{
  width:100%;font-family:inherit;font-size:.95rem;color:#16323a;background:#fff;
  border:1px solid rgba(22,50,58,.22);border-radius:2px;padding:10px 13px;
  transition:border-color .2s ease,box-shadow .2s ease;}
.by-admin-form input:focus,.by-admin-form select:focus,.by-admin-form textarea:focus{
  outline:none;border-color:var(--ac,#c9743f);box-shadow:0 0 0 3px rgba(201,116,63,.12);}
.by-admin-form textarea{min-height:110px;resize:vertical;line-height:1.7;}
.by-admin-form select{appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2316323a' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;padding-right:38px;}
.by-admin-check{display:inline-flex;align-items:center;gap:8px;font-size:.88rem;color:#41565a;cursor:pointer;font-family:inherit;}
.by-admin-check input{width:16px;height:16px;accent-color:var(--ac,#c9743f);}

/* ダッシュボードの自動送信予定・要対応リスト(テーブルと同じ文字サイズに揃える) */
.by-admin-loglist{font-size:.86rem;color:#41565a;}
.by-admin-loglist strong{color:#16323a;}

/* テーブル内のキャンセル理由セレクト(フォームのselectと同意匠のコンパクト版) */
.by-admin-cancelform select{font-family:inherit;font-size:.82rem;color:#16323a;background:#fff;
  border:1px solid rgba(22,50,58,.22);border-radius:2px;padding:7px 30px 7px 10px;margin-top:4px;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2316323a' stroke-width='1.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;
  transition:border-color .2s ease,box-shadow .2s ease;}
.by-admin-cancelform select:focus{outline:none;border-color:var(--ac,#c9743f);box-shadow:0 0 0 3px rgba(201,116,63,.12);}
.by-admin-hint{font-size:.78rem;color:#8a9794;line-height:1.6;}
.by-admin-errors{background:#f6e6dd;border:1px solid rgba(201,116,63,.3);border-radius:2px;
  padding:14px 18px;color:#8a3b1a;font-size:.86rem;line-height:1.8;}
.by-admin-errors ul{margin:0;padding-left:1.2em;}
.by-admin-formfoot{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:6px;}

/* =========================================================================
   定義リスト(担当確定・詳細)
   ========================================================================= */
.by-admin-dl{background:#fff;border-radius:3px;box-shadow:0 14px 40px rgba(22,50,58,.07);
  border:1px solid rgba(22,50,58,.06);overflow:hidden;margin:0;}
.by-admin-dl>div{display:grid;grid-template-columns:minmax(84px,140px) 1fr;gap:14px;padding:14px 20px;}
.by-admin-dl>div+div{border-top:1px solid rgba(22,50,58,.08);}
.by-admin-dl dt{font-family:'Shippori Mincho',serif;font-size:.86rem;color:#16323a;}
.by-admin-dl dd{margin:0;font-size:.92rem;color:#46595c;}

/* =========================================================================
   空状態 / 注記
   ========================================================================= */
.by-admin-empty{padding:38px 20px;text-align:center;color:#8a9794;font-size:.9rem;
  background:#fff;border-radius:3px;border:1px dashed rgba(22,50,58,.16);}
.by-admin-note{font-size:.83rem;color:#73827f;line-height:1.8;margin-bottom:14px;}

/* =========================================================================
   ログイン(中央カード)
   ========================================================================= */
.by-admin-auth{flex:1;min-height:100dvh;display:flex;flex-direction:column;align-items:center;
  justify-content:center;padding:40px 20px;}
.by-admin-auth__brand{display:flex;flex-direction:column;align-items:center;gap:13px;margin-bottom:30px;}
.by-admin-auth__brand .en{font-family:'Cormorant Garamond',serif;font-size:1.12rem;letter-spacing:.26em;
  font-weight:600;color:#16323a;}
.by-admin-auth__brand .jp{font-family:'Shippori Mincho',serif;font-size:.66rem;letter-spacing:.4em;color:#8a9794;}
.by-admin-auth__card{width:100%;max-width:400px;background:#fff;border-radius:4px;
  box-shadow:0 22px 60px rgba(22,50,58,.13);padding:clamp(28px,5vw,40px);}
.by-admin-auth__card h1{font-family:'Shippori Mincho',serif;font-weight:600;font-size:1.3rem;
  color:#16323a;text-align:center;margin-bottom:26px;letter-spacing:.04em;}

/* =========================================================================
   月見出し(担当スケジュールのカレンダー的リスト)
   ========================================================================= */
.by-admin-month{font-family:'Cormorant Garamond',serif;font-size:1.05rem;letter-spacing:.06em;
  color:#16323a;margin:26px 0 12px;padding-bottom:8px;border-bottom:1px solid rgba(22,50,58,.12);}
.by-admin-month:first-of-type{margin-top:0;}
.by-admin-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;}

/* 担当スケジュール: 月ごとの朝/夕カレンダー */
.by-admin-cals{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px;align-items:start;margin-bottom:26px;}
.by-admin-cal{background:#fff;border:1px solid rgba(22,50,58,.12);border-radius:2px;padding:14px 14px 16px;}
.by-admin-cal__ttl{font-size:.88rem;letter-spacing:.06em;color:#16323a;margin-bottom:10px;display:flex;align-items:baseline;gap:10px;}
.by-admin-cal__ttl .time{font-size:.76rem;color:#8a9794;letter-spacing:.04em;}
.by-admin-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.by-admin-cal__wd{text-align:center;font-size:.68rem;letter-spacing:.08em;color:#8a9794;padding:2px 0 4px;}
.by-admin-cal__wd.is-sun{color:#b8543a;}
.by-admin-cal__wd.is-sat{color:#3a7ab8;}
.by-admin-cal__cell{position:relative;aspect-ratio:1;border-radius:2px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1px;font-size:.84rem;color:#16323a;}
.by-admin-cal__cell.is-empty .d{color:#c3cdca;}
.by-admin-cal__cell.is-slot{border:1px solid rgba(22,50,58,.18);cursor:pointer;
  transition:border-color .2s ease;}
.by-admin-cal__cell.is-slot:hover{border-color:var(--ac,#c9743f);}
.by-admin-cal__cell.is-slot input{position:absolute;opacity:0;pointer-events:none;}
.by-admin-cal__cell .bg{position:absolute;inset:0;border-radius:1px;transition:background .2s ease;}
.by-admin-cal__cell .d,.by-admin-cal__cell .t,.by-admin-cal__cell .lock{position:relative;z-index:1;}
.by-admin-cal__cell input:checked ~ .bg{background:var(--ac,#c9743f);}
.by-admin-cal__cell input:checked ~ .d,.by-admin-cal__cell input:checked ~ .t{color:#fff;}
.by-admin-cal__cell .t{font-size:.6rem;color:#8a9794;}
.by-admin-cal__cell .lock{font-size:.56rem;letter-spacing:.04em;color:#fff;opacity:.9;}
.by-admin-cal__cell.is-slot.is-locked{cursor:not-allowed;border:1px dashed rgba(201,116,63,.55);}
.by-admin-cal__cell.is-slot.is-locked input:checked ~ .bg{background:rgba(201,116,63,.55);}
.by-admin-slot{display:flex;align-items:center;gap:10px;padding:11px 14px;background:#fff;
  border:1px solid rgba(22,50,58,.16);border-radius:2px;font-size:.86rem;color:#16323a;cursor:pointer;
  transition:border-color .2s ease,background .2s ease;}
.by-admin-slot:hover{border-color:var(--ac,#c9743f);}
.by-admin-slot input{width:16px;height:16px;accent-color:var(--ac,#c9743f);flex:none;}
.by-admin-slot.is-locked{background:#f3f5f5;color:#8a9794;cursor:not-allowed;border-style:dashed;}
.by-admin-slot .lock{margin-left:auto;font-size:.68rem;color:#8a9794;letter-spacing:.04em;}

/* =========================================================================
   レスポンシブ
   ========================================================================= */
@media (max-width:760px){
  .by-admin-bar__inner{flex-wrap:wrap;padding-top:10px;padding-bottom:10px;gap:10px;}
  .by-admin-brand{order:1;}
  .by-admin-logout{order:2;margin-left:auto;}
  /* 折り返しで全項目を見せる(横スクロールだと「マスタ」のドロップダウンが
     overflowにクリップされて開けないため) */
  .by-admin-nav{order:3;width:100%;margin-left:0;flex-wrap:wrap;padding-bottom:2px;gap:2px;}
  .by-admin-brand__en{font-size:.86rem;letter-spacing:.12em;}
  .by-admin-menu__panel{right:auto;left:0;}
}