/* ===== COPYMAC デザインシステム (mockups.html 準拠) ===== */
:root{
  --fuji:#8B7DC2;        /* アクセント：藤色 */
  --fuji-deep:#473C73;   /* 濃い藤（文字） */
  --fuji-text:#2E2651;   /* AI文章の文字 */
  --fuji-bg:#fff;        /* 薄い藤の背景→白に変更 */
  --line:#1a1a1a;        /* 枠線：黒 */
  --ink:#1a1a1a;         /* 本文 */
  --sub:#6b6b6b;         /* 補助テキスト */
  --muted:#9a9a9a;       /* 非選択 */
  --panel:#f4f4f4;       /* グレーパネル */
  --star:#EF9F27;        /* 星 */
  --danger:#C0392B;      /* 警告 */
  --page:#f7f7f8;        /* ページ背景 (めちゃ薄いグレー) */
}
*{box-sizing:border-box;margin:0;padding:0;border-radius:0;}
html,body{min-height:100%;}
body{
  font-family:-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
  background:var(--page);color:var(--ink);
  display:flex;justify-content:center;align-items:flex-start;
}
/* 画面コンテナ：スマホ幅360px基準・外枠なし */
.app{width:100%;max-width:420px;min-height:100vh;background:#fff;display:flex;flex-direction:column;position:relative;}
.app.has-tab{padding-bottom:64px;}
/* 管理者(運営)画面はPC幅 */
.app.wide{max-width:950px;}
.app.wide .tab{max-width:950px;}

/* ヘッダー */
.hd{background:#fff;border-bottom:1px solid #e4e4e4;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;}
.hd.dark{background:var(--line);}
.hd.dark .hd-title{color:#fff;}
/* 会社管理者のヘッダー (薄いブルー) */
.hd.company{background:#E8F0FE;border-bottom:1px solid #D2E3FC;}
.hd.company .hd-title{color:#174EA6;}
.hd.company .hd-store{color:#174EA6;}
.hd-left{display:flex;align-items:center;gap:3px;}
.logo{width:36px;height:36px;display:flex;align-items:center;justify-content:center;}
.logo.on-dark{}
.hd-title{color:var(--fuji-deep);font-weight:600;font-size:17px;font-family:'Jost',-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;letter-spacing:1.5px;}
.hd-store{color:var(--sub);font-size:15px;font-weight:600;display:flex;align-items:center;gap:5px;}
.hd-back{color:var(--fuji-deep);text-decoration:none;font-size:20px;display:inline-flex;}
a.hd-back:hover{opacity:.85;}

/* サブページのタイトル行 */
.page-title{padding:14px 16px 0;font-size:15px;font-weight:600;display:flex;align-items:center;gap:6px;color:var(--ink);}
.page-title i{color:var(--fuji);}

/* メイン領域 */
.main{flex:1;display:flex;flex-direction:column;}

/* 統計カード */
.stats{display:flex;gap:8px;padding:14px 16px 6px;}
.stat{flex:1;border:2px solid var(--line);padding:10px;text-align:center;background:#fff;}
.stat.hl{background:#F1F3F4;}
.stat .lbl{font-size:11px;color:var(--sub);}
.stat.hl .lbl{color:var(--fuji-deep);}
.stat .num{font-size:22px;font-weight:600;}
.stat.hl .num{color:var(--fuji-deep);}

.sectlbl{padding:8px 16px 4px;font-size:13px;color:var(--sub);display:flex;align-items:center;gap:6px;justify-content:space-between;}
.sectlbl .l{display:flex;align-items:center;gap:6px;}
.list{padding:4px 16px 16px;display:flex;flex-direction:column;gap:12px;}

/* カード */
.card{border:2px solid var(--line);padding:14px;background:#fff;}
.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.who{display:flex;align-items:center;gap:8px;}
.av{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;background:#FBEAF0;color:#993556;}
.nm{font-size:13px;font-weight:600;}
.stars{font-size:12px;color:var(--star);letter-spacing:1px;}
.badge{font-size:11px;font-weight:500;color:var(--fuji-deep);background:#EDE9F7;padding:4px 11px;border-radius:20px;white-space:nowrap;}
.badge.danger{background:#FCE8E6;color:#C5221F;}
.badge.ok{background:#E6F4EA;color:#1E8E3E;}
.review{font-size:13px;line-height:1.6;margin:0 0 12px;color:var(--ink);}

/* 口コミカード (Google風: 枠線なし・角丸・薄グレー背景) */
.rcard{border:0;border-radius:14px;background:#F1F3F4;}
.rcard .stars{font-size:16px;color:#FBBC04;letter-spacing:2px;display:flex;align-items:center;}
.rev-date{font-size:11px;color:var(--muted);letter-spacing:0;margin-left:8px;}
.review-ja{font-size:12px;line-height:1.6;color:var(--sub);background:#fff;border-radius:8px;padding:8px 10px;margin:-6px 0 12px;white-space:pre-wrap;}
.review-ja-lbl{display:block;font-size:10px;font-weight:600;color:#1a73e8;margin-bottom:2px;}
.foreign-lbl{font-size:11px;color:#1a73e8;font-weight:600;display:flex;align-items:center;gap:4px;margin:10px 0 4px;padding-top:8px;border-top:1px dashed #DADCE0;}
/* 評価分布 (Google風) */
.rating-dist{display:flex;gap:16px;align-items:center;padding:10px 12px;border:1px solid #E8EAED;border-radius:12px;background:#fff;}
.rd-bars{flex:1;display:flex;flex-direction:column;gap:5px;}
.rd-row{display:flex;align-items:center;gap:8px;}
.rd-star{font-size:11px;color:var(--sub);width:8px;text-align:center;}
.rd-track{flex:1;height:9px;background:#F1F3F4;border-radius:6px;overflow:hidden;}
.rd-fill{display:block;height:100%;background:#FBBC04;border-radius:6px;}
.rd-score{text-align:center;min-width:88px;}
.rd-num{font-size:34px;font-weight:600;line-height:1;color:#202124;}
.rd-stars{font-size:13px;color:#FBBC04;letter-spacing:1px;margin:2px 0;}
.rd-count{font-size:11px;color:var(--sub);}

.rev-tabs{display:flex;gap:8px;padding:8px 16px 0;}
.rev-tabs a{flex:1;text-align:center;font-size:13px;padding:8px;border-radius:20px;text-decoration:none;color:var(--sub);background:#F1F3F4;font-weight:500;}
.rev-tabs a.on{background:#1a73e8;color:#fff;font-weight:600;}
.mom{font-size:11px;font-weight:600;margin-left:5px;vertical-align:middle;}
.mom.up{color:#1E8E3E;}
.mom.down{color:#C5221F;}
.mom.flat{color:var(--muted);}
.rcard .stars-off{color:#DADCE0;}
.rcard .ai{background:#fff;border:0;border-radius:10px;}
.rcard .ai p{color:#202124;}
.rcard .actions{gap:10px;}
.rcard .btn{border:1px solid #DADCE0;border-radius:20px;background:#fff;color:#1a73e8;font-weight:500;padding:9px 14px;}
.rcard .btn:hover{background:#F1F3F4;}
.rcard .btn.primary{background:#1a73e8;color:#fff;border-color:#1a73e8;}
.rcard .btn.primary:hover{background:#1765cc;}
.rcard .badge{border-radius:20px;font-weight:500;padding:4px 12px;background:#FCE8E6;color:#C5221F;}
.rcard .badge.ok{background:#E6F4EA;color:#1E8E3E;}
.av-wrap{position:relative;width:36px;height:36px;flex-shrink:0;}
.av-wrap .av,.av-img{width:36px;height:36px;border-radius:50%;object-fit:cover;display:block;}
.av-wrap .av{display:flex;}
.av-star{position:absolute;right:-3px;bottom:-3px;width:15px;height:15px;border-radius:50%;background:#F29900;color:#fff;font-size:9px;line-height:15px;text-align:center;border:2px solid #F1F3F4;box-sizing:content-box;}

/* AI枠 */
.ai{background:var(--fuji-bg);border:1px solid var(--fuji);padding:10px 12px;margin-bottom:10px;}
.ai .ai-lbl{font-size:11px;color:var(--fuji-deep);display:flex;align-items:center;gap:5px;margin-bottom:5px;}
.ai p{font-size:13px;line-height:1.65;margin:0;color:var(--fuji-text);white-space:pre-wrap;}

/* ボタン */
.actions{display:flex;gap:8px;}
.btn{border:2px solid var(--line);background:#fff;color:var(--ink);padding:9px;font-size:13px;display:inline-flex;align-items:center;justify-content:center;gap:5px;cursor:pointer;font-family:inherit;text-decoration:none;}
.btn:hover{background:var(--panel);}
.btn.primary{background:var(--fuji);color:#fff;font-weight:600;border-color:var(--fuji);}
.btn.primary:hover{background:#7a6cb5;}
.btn.f1{flex:1;} .btn.f14{flex:1.4;}
.btn[disabled],.btn.disabled{opacity:.45;pointer-events:none;cursor:not-allowed;}
.btn.block{width:100%;padding:12px;font-size:14px;}

/* タブバー (下部固定) */
.tab{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:420px;background:#fff;border-top:2px solid var(--line);display:flex;padding:8px 0;}
.tab a{flex:1;text-align:center;color:var(--muted);font-size:11px;text-decoration:none;}
.tab a.on{color:var(--fuji);font-weight:600;}
.tab.admin a{color:#5f6368;}
.tab.admin a.on{color:#1a1a1a;font-weight:600;}
.tab a i{font-size:20px;display:block;}

/* フォーム */
.field-lbl{padding:14px 16px 4px;font-size:12px;color:var(--sub);}
.field-lbl.tight{padding-top:4px;}
.field-lbl.ai-lbl2{color:var(--fuji-deep);display:flex;align-items:center;gap:5px;}
.input,textarea.input,select.input{display:block;width:calc(100% - 32px);margin:0 16px;border:2px solid var(--line);padding:10px 12px;font-size:13px;color:var(--ink);font-family:inherit;background:#fff;}
textarea.input{min-height:54px;line-height:1.6;resize:vertical;}
.input:focus,textarea.input:focus{outline:none;border-color:var(--fuji);}
.pad{padding:0 16px;}
.gap{padding:10px 16px;}

/* チップ・タグ */
.chiprow{padding:0 16px 12px;display:flex;gap:8px;flex-wrap:wrap;}
.chip{border:2px solid var(--line);background:#fff;padding:9px;text-align:center;font-size:13px;flex:1;cursor:pointer;color:var(--ink);}
.chip.on{background:var(--fuji);color:#fff;font-weight:600;border-color:var(--fuji);}
.tag{border:2px solid var(--line);padding:6px 12px;font-size:12px;cursor:pointer;background:#fff;}
.tag.on{background:var(--fuji-bg);}
.tag.off{color:var(--sub);}
.dashed{margin:0 16px;border:2px dashed var(--line);padding:18px;text-align:center;color:var(--muted);font-size:13px;}

.greet{padding:16px 16px 6px;font-size:14px;font-weight:600;}
.todo{border:1px solid #DADCE0;border-radius:14px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;text-decoration:none;color:var(--ink);}
.todo:hover{background:#F1F3F4;}
.todo .ic{width:38px;height:38px;border-radius:50%;background:#E8F0FE;border:0;display:flex;align-items:center;justify-content:center;color:#1a73e8;}
.todo .t1{font-size:13px;font-weight:600;}
.todo .t2{font-size:11px;color:var(--sub);}
.savebtn{padding:6px 16px 16px;}

/* ログイン */
.login-hd{background:#E8F0FE;border-bottom:1px solid #D2E3FC;padding:26px 18px 18px;text-align:center;}
.login-hd .hd-title{color:#174EA6;}
.login-hd.op{background:var(--line);border-bottom:0;}
.login-hd.op .hd-title{color:#fff;}
.login-logo{display:inline-flex;width:52px;height:52px;align-items:center;justify-content:center;margin-bottom:6px;}
.login-body{padding:20px 18px;}
.login-body .lbl{font-size:12px;color:var(--sub);margin-bottom:4px;}
.code{display:flex;gap:6px;justify-content:center;margin:0 0 18px;}
.code input{width:36px;height:44px;border:2px solid var(--line);text-align:center;font-size:18px;font-weight:600;font-family:inherit;}
.code input:focus{outline:none;border-color:var(--fuji);background:var(--fuji-bg);}
.note-link{font-size:11px;color:var(--fuji);text-decoration:none;}
.center{text-align:center;}
.muted-text{color:var(--sub);font-size:13px;line-height:1.6;}

/* 通知 */
.flash{margin:12px 16px 0;padding:10px 12px;border:2px solid var(--line);font-size:12px;}
.flash.error{border-color:var(--danger);color:var(--danger);background:#fbecea;}
.flash.ok{border-color:#3a8a4a;color:#2c6b39;background:#eaf5ec;}
.flash-inline{margin:0 0 10px;padding:8px 10px;border-radius:8px;font-size:12px;border:0;}
.flash-inline.ok{background:#eaf5ec;color:#2c6b39;}
.flash-inline.error{background:#fbecea;color:var(--danger);}

/* 営業時間編集 (Google風) */
.hrow{display:grid;grid-template-columns:26px 78px 1fr;align-items:start;gap:8px;padding:12px 0;border-bottom:1px solid #E8EAED;}
.hrow:last-of-type{border-bottom:0;}
.hrow-day{width:26px;height:26px;line-height:26px;border-radius:50%;background:#F1F3F4;font-size:12px;font-weight:600;text-align:center;margin-top:3px;}
.hrow-day.sat{color:#1a73e8;}
.hrow-day.sun{color:#C5221F;}
.hrow-switch{display:flex;align-items:center;gap:6px;cursor:pointer;margin-top:6px;}
.hrow-switch input[type=checkbox]{accent-color:#1a73e8;width:15px;height:15px;}
.hrow-status{font-size:12px;color:#202124;}
.hrow-status.closed{color:var(--muted);}
.hrow-col{display:flex;flex-direction:column;gap:6px;align-items:flex-end;}
.hrow-times{display:inline-flex;align-items:center;gap:6px;}
/* 1部の行にも削除×と同じ幅の余白を確保し、1部と2部の時刻欄の左端を揃える */
.hrow-times:not(.hrow-times2)::after{content:'';width:14px;flex:none;}
.hrow-sep{font-size:12px;color:var(--sub);}
.hrow input[type=time],.sprow input[type=time]{border:1px solid #DADCE0;border-radius:8px;padding:7px 8px;font-size:13px;font-family:inherit;background:#fff;color:#202124;}
.hrow input[type=time]:focus,.sprow input[type=time]:focus,.sprow input[type=date]:focus{outline:none;border-color:#1a73e8;}
.hrow-add2{font-size:12px;color:#1a73e8;text-decoration:none;padding:2px 0;}
.hrow-del2{color:var(--muted);text-decoration:none;font-size:14px;display:inline-flex;align-items:center;justify-content:center;width:14px;flex:none;}
.sprow{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #E8EAED;flex-wrap:wrap;}
.sprow input[type=date]{border:1px solid #DADCE0;border-radius:8px;padding:7px 8px;font-size:13px;font-family:inherit;background:#fff;color:#202124;}
.sp-del{color:var(--muted);text-decoration:none;font-size:14px;margin-left:auto;}

/* 店舗詳細: 月別推移テーブル */
.month-tbl{width:100%;border-collapse:collapse;font-size:12px;background:#fff;}
.month-tbl th{background:#F1F3F4;color:var(--sub);font-weight:600;font-size:10px;padding:6px 8px;border:1px solid #E8EAED;text-align:center;line-height:1.3;}
.month-tbl td{padding:7px 8px;border:1px solid #E8EAED;text-align:center;color:var(--ink);}
.month-tbl td:first-child{text-align:left;font-weight:600;}
.month-tbl tr.cur td{background:#E8F0FE;}

/* GBPロケーション一覧: Googleアカウント→グループ 見出し */
.loc-acct{display:flex;align-items:center;gap:6px;padding:16px 16px 4px;font-size:14px;font-weight:700;color:var(--ink);}
.loc-group{display:flex;align-items:center;gap:6px;padding:6px 16px 4px 24px;font-size:12px;font-weight:600;color:var(--sub);}
.loc-group i{color:var(--fuji);}
.loc-count{font-weight:400;color:var(--muted);font-size:11px;margin-left:6px;}

/* ダッシュボード: 祝日リマインド */
.holiday-note{border:0;border-radius:14px;background:#E8F0FE;padding:12px 14px;font-size:12px;}
.holiday-note .hn-title{font-size:11px;color:#174EA6;margin:0 0 4px;font-weight:600;}
.holiday-note .hn-row{display:flex;gap:10px;padding:2px 0;align-items:center;}

/* ダッシュボード: 現在の営業時間 */
.hours-now{border:0;border-radius:14px;background:#F1F3F4;padding:12px 14px;margin-top:8px;font-size:12px;}
.hours-now .hn-row{display:flex;gap:10px;padding:2px 0;}
.hours-now .hn-day{width:18px;font-weight:600;text-align:center;}
.hours-now .hn-day.sat{color:#1a73e8;}
.hours-now .hn-day.sun{color:#C5221F;}
.hours-now .hn-title{font-size:11px;color:var(--sub);margin:8px 0 2px;font-weight:600;}
.charcount{text-align:right;font-size:11px;color:var(--muted);margin-top:4px;}
.empty{padding:40px 16px;text-align:center;color:var(--muted);font-size:13px;}