/* ============================================================================
   AI Chatbot (Readable UI / High-Contrast) - Visibility Boosted (Final)
   - 視認性と読みやすさ最優先
   - 既存ID互換: #ai-chatbot-window / #chatbot-messages / #chatbot-form /
                 #chatbot-input / #chatbot-close / #chatbot-submit
   - Pマークには干渉しない（Pマーク関連セレクタ無し）
   ========================================================================== */

/* -------------------- Theme Tokens -------------------- */
:root{
  /* Surfaces */
  --chat-bg: #ffffff;
  --chat-surface: #ffffff;

  /* messages背景：白バブルとの差を作る */
  --chat-surface-2: #f3f5f8;
  --chat-surface-3: #eef1f5;

  /* Borders / Shadows */
  --chat-border: #d7dde6;
  --chat-border-strong: #b9c4d6;
  --chat-shadow: 0 18px 40px rgba(15, 23, 42, .18);
  --chat-radius: 16px;

  /* Text */
  --text-strong: #0b1220;
  --text-muted: #334155;
  --text-subtle: #64748b;

  /* Accent */
  --accent: #e11d48;
  --accent-700: #be123c;
  --accent-800: #9f1239;

  /* Bubbles */
  --ai-bubble: #ffffff;
  --ai-bubble-border: #bfcbdc;
  --ai-bubble-shadow: 0 6px 18px rgba(15,23,42,.08);

  --user-bubble: #0b1220;
  --user-text: #ffffff;
  --user-bubble-border: rgba(0,0,0,.10);

  /* Links */
  --link: #0a58ca;
  --link-hover: #073f93;

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(225, 29, 72, .28);

  /* Typography */
  --msg-font-size: 15px;
  --msg-line-height: 1.70;

  /* Scrollbar */
  --scroll-thumb: rgba(100,116,139,.40);

  /* Input placeholder (explicit token) */
  --input-placeholder: #94a3b8;
}

/* Dark mode */
@media (prefers-color-scheme: dark){
  :root{
    --chat-bg: #0b1220;
    --chat-surface: #0e172a;
    --chat-surface-2: #0b1220;
    --chat-surface-3: #121c33;

    --chat-border: #24314b;
    --chat-border-strong: #3a4a6f;
    --chat-shadow: 0 20px 44px rgba(0,0,0,.55);

    --text-strong: #e5e7eb;
    --text-muted: #cbd5e1;
    --text-subtle: #94a3b8;

    --ai-bubble: #0e172a;
    --ai-bubble-border: #3a4a6f;
    --ai-bubble-shadow: 0 10px 26px rgba(0,0,0,.28);

    --user-bubble: #e11d48;
    --user-text: #ffffff;

    --link: #8ec0ff;
    --link-hover: #b8d7ff;

    --scroll-thumb: rgba(148,163,184,.40);

    /* ダーク時のplaceholderは少し明るめに（でも入力文字より薄く） */
    --input-placeholder: rgba(229,231,235,.60);
  }
}

/* -------------------- Banner -------------------- */
.ai-chatbot-banner-container{ text-align:center; }
.ai-chatbot-banner-container .ai-chatbot-banner{
  display:inline-block;
  width:90%;
  max-width:820px;
  border-radius:12px;
  overflow:hidden;
  transform:translateY(0);
  transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  cursor:pointer;
  box-shadow:0 10px 26px rgba(15, 23, 42, .10);
}
.ai-chatbot-banner-container .ai-chatbot-banner:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(15, 23, 42, .16);
}
.ai-chatbot-banner-container .ai-chatbot-banner:focus-visible{
  outline:none;
  box-shadow:var(--focus-ring), 0 10px 26px rgba(15, 23, 42, .14);
}
.ai-chatbot-banner-container .ai-chatbot-banner img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
}

/* -------------------- Overlay -------------------- */
#ai-chatbot-overlay,
.ai-chatbot-overlay{
  position:fixed;
  inset:0;
  background:rgba(2, 6, 23, .42);
  -webkit-backdrop-filter: blur(4px) saturate(120%);
  backdrop-filter: blur(4px) saturate(120%);
  opacity:0;
  visibility:hidden;
  transition:opacity .18s ease, visibility .18s ease;
  z-index:999998;
}
#ai-chatbot-overlay.is-open{ opacity:1; visibility:visible; }

/* -------------------- Window -------------------- */
#ai-chatbot-window,
.ai-chatbot-window{
  position:fixed;
  right:18px;
  bottom:18px;
  width:390px;
  max-width:calc(100vw - 24px);
  height:580px;
  max-height:calc(100vh - 24px);
  display:flex;
  flex-direction:column;
  background:var(--chat-surface);
  border:1px solid var(--chat-border);
  border-radius:var(--chat-radius);
  box-shadow:var(--chat-shadow);
  color:var(--text-strong);
  overflow:hidden;
  z-index:999999;

  opacity:0;
  visibility:hidden;
  transform:translateY(10px) scale(.985);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  pointer-events:none;
}
#ai-chatbot-window.is-open{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

/* Mobile bottom sheet */
@media (max-width: 640px){
  #ai-chatbot-window{
    right:0;
    bottom:env(safe-area-inset-bottom, 0);
    width:100vw;
    height:70dvh;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top,0) - env(safe-area-inset-bottom,0));
    border-radius:16px 16px 0 0;
    border-left:none;
    border-right:none;
  }
}

/* -------------------- Header -------------------- */
.ai-chatbot__header,
#chatbot-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  color:#fff;
  background:
    radial-gradient(120% 120% at 100% 0%, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(135deg, var(--accent) 0%, var(--accent-800) 100%);
  border-bottom:1px solid rgba(255,255,255,.14);
}
.ai-chatbot__title{
  font-size:14px;
  font-weight:800;
  letter-spacing:.2px;
}
.ai-chatbot__close,
#chatbot-close{
  appearance:none;
  border:1px solid rgba(255,255,255,.30);
  background:rgba(255,255,255,.14);
  color:#fff;
  width:30px; height:30px;
  border-radius:10px;
  font-size:18px; line-height:1;
  cursor:pointer;
  transition:background .15s ease, transform .05s ease, border-color .15s ease;
}
.ai-chatbot__close:hover,
#chatbot-close:hover{
  background:rgba(255,255,255,.22);
  border-color:rgba(255,255,255,.38);
}
.ai-chatbot__close:active,
#chatbot-close:active{ transform:translateY(1px); }
.ai-chatbot__close:focus-visible,
#chatbot-close:focus-visible{
  outline:none;
  box-shadow:var(--focus-ring);
}

/* -------------------- Messages -------------------- */
.ai-chatbot__messages,
#chatbot-messages,
#ai-chatbot-messages{
  flex:1;
  overflow:auto;
  padding:14px;
  background:var(--chat-surface-2);
}

/* Wrapper */
.message{
  display:flex;
  flex-direction:column;
  margin:10px 0;
  max-width:88%;
}

/* Base bubble */
.message .bubble{
  border-radius:16px;
}

/* Paragraph */
.message p{
  margin:0;
  padding:11px 12px;
  font-size:var(--msg-font-size);
  line-height:var(--msg-line-height);
  letter-spacing:.01em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color:var(--text-strong);
}

/* List in replies */
.ai-message ul{
  margin:8px 0 0;
  padding:0 0 10px 18px;
}
.ai-message li{
  padding:4px 0;
  font-size:var(--msg-font-size);
  line-height:var(--msg-line-height);
}

/* AI */
.ai-message{ align-items:flex-start; }
.ai-message .bubble{
  background:var(--ai-bubble);
  border:1px solid var(--ai-bubble-border);
  border-bottom-left-radius:8px;
  box-shadow:var(--ai-bubble-shadow);
}
.ai-message p{ color:var(--text-strong); }

/* User */
.user-message{ align-items:flex-end; }
.user-message .bubble{
  background:var(--user-bubble);
  border:1px solid var(--user-bubble-border);
  border-bottom-right-radius:8px;
  box-shadow:0 8px 22px rgba(15,23,42,.12);
}
.user-message p{ color:var(--user-text); }

/* Links */
.ai-message a,
.user-message a{
  color:var(--link);
  text-decoration:underline;
  text-underline-offset:2px;
  text-decoration-thickness:2px;
  word-break:break-word;
}
.ai-message a:hover,
.user-message a:hover{ color:var(--link-hover); }

/* Emphasis */
.ai-message strong,
.user-message strong{ font-weight:800; }

/* Loading */
.loading-indicator{ align-items:flex-start; }
.loading-indicator .bubble{
  background:var(--ai-bubble);
  border:1px solid var(--ai-bubble-border);
  padding:11px 12px;
  box-shadow:var(--ai-bubble-shadow);
}
.loading-indicator p{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:0;
}
.loading-indicator span{
  display:inline-block;
  width:7px; height:7px;
  border-radius:50%;
  background:var(--text-subtle);
  animation:dotPulse 1.2s infinite ease-in-out;
}
.loading-indicator span:nth-child(2){ animation-delay:.15s; }
.loading-indicator span:nth-child(3){ animation-delay:.30s; }
@keyframes dotPulse{
  0%,80%,100%{ transform:scale(0); opacity:.55 }
  40%{ transform:scale(1); opacity:1 }
}

/* -------------------- Suggestions -------------------- */
#ai-suggestions{
  margin:10px 0 2px;
  padding:10px;
  border:1px solid var(--chat-border-strong);
  background:var(--chat-surface);
  border-radius:14px;
}
.ai-suggestions__title{
  margin:0 0 8px;
  font-size:12px;
  color:var(--text-subtle);
  font-weight:800;
}
.ai-suggestions__chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.ai-suggestion-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:9px 11px;
  border:1px solid var(--chat-border-strong);
  background:var(--chat-surface);
  border-radius:999px;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  color:var(--text-strong);
  box-shadow:0 6px 18px rgba(15,23,42,.06);
  user-select:none;
  transition:transform .05s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.ai-suggestion-chip:hover{
  transform:translateY(-1px);
  border-color:rgba(225,29,72,.55);
  background:var(--chat-surface);
  box-shadow:0 10px 26px rgba(15,23,42,.10);
}
.ai-suggestion-chip:active{ transform:translateY(0); }

/* -------------------- Input Area -------------------- */
.ai-chatbot__form,
#chatbot-form{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px;
  background:var(--chat-surface);
  border-top:1px solid var(--chat-border);
}

/* ✅ Input: typed text should be strong, placeholder should be subtle
   - IMPORTANT: we explicitly set -webkit-text-fill-color for both
     input and placeholder to avoid "placeholder becomes too dark" */
.ai-chatbot__input,
#chatbot-input{
  flex:1;
  font-size:14px;
  line-height:1.4;
  padding:12px 12px;
  background:#ffffff;
  border:1px solid var(--chat-border-strong);
  border-radius:12px;
  outline:none;
  transition:border-color .15s ease, background .15s ease, box-shadow .15s ease;

  /* typed text */
  color: var(--text-strong);
  -webkit-text-fill-color: var(--text-strong);
  opacity:1;
}

/* placeholder (subtle) */
.ai-chatbot__input::placeholder,
#chatbot-input::placeholder{
  color: var(--input-placeholder);
  -webkit-text-fill-color: var(--input-placeholder);
  opacity:1;
}

/* Safari placeholder alias */
.ai-chatbot__input::-webkit-input-placeholder,
#chatbot-input::-webkit-input-placeholder{
  color: var(--input-placeholder);
  -webkit-text-fill-color: var(--input-placeholder);
  opacity:1;
}

.ai-chatbot__input:focus,
#chatbot-input:focus{
  border-color:rgba(225,29,72,.60);
  box-shadow:var(--focus-ring);
}

.ai-chatbot__send,
#chatbot-submit,
#chatbot-form button[type="submit"]{
  appearance:none;
  border:1px solid rgba(0,0,0,.08);
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-800) 100%);
  color:#fff;
  font-weight:800;
  font-size:13px;
  padding:11px 14px;
  border-radius:12px;
  cursor:pointer;
  transition:filter .15s ease, transform .05s ease, box-shadow .15s ease;
  white-space:nowrap;
  box-shadow:0 10px 24px rgba(225,29,72,.20);
}
.ai-chatbot__send:hover,
#chatbot-submit:hover,
#chatbot-form button[type="submit"]:hover{
  filter:brightness(1.06);
}
.ai-chatbot__send:active,
#chatbot-submit:active,
#chatbot-form button[type="submit"]:active{
  transform:translateY(1px);
}
.ai-chatbot__send:focus-visible,
#chatbot-submit:focus-visible,
#chatbot-form button[type="submit"]:focus-visible{
  outline:none;
  box-shadow:var(--focus-ring), 0 10px 26px rgba(225,29,72,.24);
}
#chatbot-form button[disabled]{
  opacity:.6;
  cursor:not-allowed;
  box-shadow:none;
}

/* -------------------- Scrollbar / Selection -------------------- */
#ai-chatbot-window *::selection{ background:rgba(225,29,72,.22); }
#ai-chatbot-messages::-webkit-scrollbar{ width:10px; }
#ai-chatbot-messages::-webkit-scrollbar-thumb{
  background:var(--scroll-thumb);
  border-radius:8px;
}
#ai-chatbot-messages::-webkit-scrollbar-track{ background:transparent; }

/* -------------------- PC/SP & Header Banner -------------------- */
.ai-only-pc{ display:block; }
.ai-only-sp{ display:none; }
@media (max-width: 767px){
  .ai-only-pc{ display:none !important; }
  .ai-only-sp{ display:inline-flex !important; }
}
.header .ai-banner-in-header{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
}
.header .ai-banner-in-header .ai-chatbot-banner{
  width:36px;
  height:auto;
  display:inline-block;
  border-radius:10px;
  overflow:hidden;
  box-shadow:0 2px 10px rgba(15,23,42,.14);
  vertical-align:middle;
  transition:transform .15s ease, box-shadow .15s ease;
}
.header .ai-banner-in-header .ai-chatbot-banner:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(15,23,42,.18);
}
.header .ai-banner-in-header .ai-chatbot-banner img{
  width:100%;
  height:auto;
  object-fit:contain;
  display:block;
}
@media (max-width: 767px){
  .header .ai-banner-in-header .ai-chatbot-banner{ width:34px; }
}

/* SP tuning */
@media (max-width: 767px){
  :root{
    --msg-font-size: 16px;
    --msg-line-height: 1.72;
  }
  .ai-chatbot__input,
  #chatbot-input{
    font-size:16px !important;
    font-weight:600;
  }
  .ai-chatbot__header{ padding:10px 12px; }
  .ai-chatbot__title{ font-size:13px; }
  .ai-chatbot__messages{ padding:10px; }
  .ai-chatbot__form,
  #chatbot-form{
    padding:8px;
    gap:6px;
    padding-bottom:calc(8px + env(safe-area-inset-bottom, 0));
  }
  .ai-chatbot__send,
  #chatbot-submit,
  #chatbot-form button[type="submit"]{
    padding:10px 12px;
    font-size:13px;
    border-radius:12px;
  }
  .ai-chatbot__messages{ overscroll-behavior:contain; }
}

/* ai-only-sp PC hide */
.header .ai-banner-in-header.ai-only-sp{ display:none !important; }
@media (max-width: 767px){
  .header .ai-banner-in-header.ai-only-sp{ display:inline-flex !important; }
}

/* ============================================================================
   ✅ FINAL OVERRIDE（ここが今回の修正本体）
   - 既存記述は一切削らず、末尾で「入力文字だけ濃く」を確実に勝たせる
   - placeholder は既存トークンのまま薄く維持
   ========================================================================== */

/* 入力済みテキスト（value）は常に濃い：OSダークでも薄くならない */
#ai-chatbot-window #chatbot-input,
#ai-chatbot-window .ai-chatbot__input{
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  opacity:1 !important;
}

/* placeholder（未入力時）は薄いまま：既存トークンを使用 */
#ai-chatbot-window #chatbot-input::placeholder,
#ai-chatbot-window .ai-chatbot__input::placeholder{
  color:#637082 !important;
  -webkit-text-fill-color:#637082 !important;
  opacity:1 !important;
}

/* Safari placeholder alias */
#ai-chatbot-window #chatbot-input::-webkit-input-placeholder,
#ai-chatbot-window .ai-chatbot__input::-webkit-input-placeholder{
  color:var(--input-placeholder) !important;
  -webkit-text-fill-color:var(--input-placeholder) !important;
  opacity:1 !important;
}

/* ============================================================================
   AI Searchbar Banner (Sidebar)
   - Google検索窓っぽい見た目 + 右側に AI検索ボタン
   - 既存の ai-chatbot-banner / open-ai-chat トリガーと互換
   ========================================================================== */

.ai-chatbot-banner-container{
  text-align:center;
}

/* バナー本体 */
.ai-searchbar{
  display:block;
  width:100%;
  border-radius:14px;
  border:1px solid var(--chat-border-strong);
  background:#fff;
  box-shadow:0 10px 26px rgba(15,23,42,.10);
  padding:12px;
  cursor:pointer;
  user-select:none;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.ai-searchbar:hover{
  transform:none;
}

.ai-searchbar:focus-visible{
  outline:none;
  box-shadow:var(--focus-ring), 0 16px 34px rgba(15,23,42,.14);
}

/* 1行目（検索窓） */
.ai-searchbar__inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border-radius:999px;
  background:var(--chat-surface-2);
  border:1px solid var(--chat-border);
}

/* 左の虫眼鏡 */
.ai-searchbar__icon{
  width:34px;
  height:34px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#64748b;
  background:#fff;
  border:1px solid var(--chat-border);
  flex:0 0 auto;
}

/* 入力欄 “風” */
.ai-searchbar__fakeinput{
  flex:1;
  min-width:0;
  display:flex;
  align-items:center;
  height:34px;
  padding:0 6px;
}

.ai-searchbar__placeholder{
  display:block;
  width:100%;
  color:#64748b;          /* placeholderは少し薄め */
  font-size:14px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* 右側のAI検索ボタン */
.ai-searchbar__cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:36px;
  padding:0 12px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-800) 100%);
  box-shadow:0 10px 24px rgba(225,29,72,.20);
  border:1px solid rgba(0,0,0,.08);
}

.ai-searchbar__ctaicon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#fff;
}

.ai-searchbar__ctatext{
  font-weight:800;
  font-size:13px;
  letter-spacing:.02em;
}

/* 2行目の説明 */
.ai-searchbar__hint{
  margin:8px 2px 0;
  font-size:12px;
  line-height:1.4;
  color:var(--text-subtle);
  text-align:left;
}

/* モバイル微調整 */
@media (max-width: 767px){
  .ai-searchbar{
    padding:10px;
    border-radius:12px;
  }
  .ai-searchbar__inner{
    padding:10px;
  }
  .ai-searchbar__placeholder{
    font-size:13px;
  }
  .ai-searchbar__ctatext{
    font-size:12.5px;
  }
}

/* ============================================================================
   AI Searchbar Banner (Functional Search UI)
   ========================================================================== */

.ai-chatbot-banner-container{ text-align:center; }

/* form全体 */
#ai-searchbar-form.ai-searchbar{
  display:block;
  width:100%;
  border-radius:14px;
  border:1px solid var(--chat-border-strong);
  background:#fff;
  box-shadow:0 10px 26px rgba(15,23,42,.10);
  padding:12px;
  margin:0;
}

/* 1行目（検索窓本体） */
#ai-searchbar-form .ai-searchbar__inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:999px;
  background:var(--chat-surface-2);
  border:1px solid var(--chat-border);
}

/* 左アイコン */
#ai-searchbar-form .ai-searchbar__icon{
  width:34px;
  height:34px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#64748b;
  background:#fff;
  border:1px solid var(--chat-border);
  flex:0 0 auto;
}

/* 入力欄（本物） */
#ai-searchbar-form .ai-searchbar__input{
  flex:1;
  min-width:0;
  height:34px;
  padding:0 6px;
  border:none;
  outline:none;
  background:transparent;
  font-size:14px;
  line-height:1.2;

  /* typed text: 濃く */
  color:#0b1220;
  -webkit-text-fill-color:#0b1220;
  opacity:1;
}

/* placeholder: 少し薄く */
#ai-searchbar-form .ai-searchbar__input::placeholder{
  color:#7a8aa0;
  -webkit-text-fill-color:#7a8aa0;
  opacity:1;
}
#ai-searchbar-form .ai-searchbar__input::-webkit-input-placeholder{
  color:#7a8aa0;
  -webkit-text-fill-color:#7a8aa0;
  opacity:1;
}

/* 右ボタン */
#ai-searchbar-form .ai-searchbar__cta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:36px;
  padding:0 12px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(135deg, var(--accent) 0%, var(--accent-800) 100%);
  box-shadow:0 10px 24px rgba(225,29,72,.20);
  border:1px solid rgba(0,0,0,.08);
  cursor:pointer;
}
#ai-searchbar-form .ai-searchbar__ctatext{
  font-weight:800;
  font-size:13px;
  letter-spacing:.02em;
}
#ai-searchbar-form .ai-searchbar__cta:active{ transform:translateY(1px); }

/* 2行目 */
#ai-searchbar-form .ai-searchbar__hint{
  margin:8px 2px 0;
  font-size:12px;
  line-height:1.4;
  color:var(--text-subtle);
  text-align:left;
}

/* クリック/フォーカス */
#ai-searchbar-form:focus-within{
  box-shadow:var(--focus-ring), 0 16px 34px rgba(15,23,42,.14);
  border-color:rgba(225,29,72,.25);
}

/* モバイル微調整 */
@media (max-width: 767px){
  #ai-searchbar-form.ai-searchbar{ padding:10px; border-radius:12px; }
  #ai-searchbar-form .ai-searchbar__inner{ padding:10px; }
  #ai-searchbar-form .ai-searchbar__input{ font-size:13.5px; }
  #ai-searchbar-form .ai-searchbar__ctatext{ font-size:12.5px; }
}

/* ============================================================================
   ✅ NEW FINAL OVERRIDE（今回：ボタンをGoogleっぽく、縁だけ控えめに回す）
   - ここで「ボタン面に色が乗る」原因を全部潰してから、縁だけ出す
   ========================================================================== */

/* 1) ボタン本体：白＋薄い縁＋青文字（面は絶対染めない） */
#ai-searchbar-form .ai-searchbar__cta{
  position:relative !important;
  isolation:isolate !important;

  background:#ffffff !important;                 /* ←面は白 */
  color:#1a73e8 !important;                      /* Google青 */
  border:1px solid #dadce0 !important;           /* Google系の薄グレー */
  box-shadow:0 1px 2px rgba(60,64,67,.12) !important;  /* ごく薄い影 */
  filter:none !important;
  backdrop-filter:none !important;

  transition:background .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

/* アイコン/テキストも青に統一 */
#ai-searchbar-form .ai-searchbar__ctaicon,
#ai-searchbar-form .ai-searchbar__ctatext{
  color:#1a73e8 !important;
}

/* hover時：影だけほんの少し上げる（モダン・控えめ） */
#ai-searchbar-form .ai-searchbar__cta:hover{
  box-shadow:0 2px 6px rgba(60,64,67,.18) !important;
  border-color:#cfd3d7 !important;
}

/* 2) 過去の疑似要素があっても完全無効化（面が染まる原因） */
#ai-searchbar-form .ai-searchbar__cta::before{
  content:none !important;
}

/* 3) 縁だけリング：超控えめ（極細／低彩度／面は透明） */
#ai-searchbar-form .ai-searchbar__cta::after{
  content:"" !important;
  position:absolute !important;
  inset:-1px !important;                       /* 1px外に出す＝縁だけ見える */
  border-radius:inherit !important;
  pointer-events:none !important;

  /* “縁だけ” を保証（中心は透明） */
  border:1px solid transparent !important;     /* ←縁の太さ（極細） */
  background:
    linear-gradient(transparent, transparent) padding-box,
    conic-gradient(
      from 0deg,
      rgba(26,115,232,.55),
      rgba(234,67,53,.55),
      rgba(251,188,5,.55),
      rgba(52,168,83,.55),
      rgba(26,115,232,.55)
    ) border-box !important;

  opacity:0 !important;                        /* 通常は見えない */
  transform:rotate(0deg) !important;
  transition:opacity .18s ease !important;

  /* “面が染まって見える” を避ける */
  mix-blend-mode:normal !important;
}

/* hover/focusだけ、うっすら出して回す（控えめ） */
#ai-searchbar-form .ai-searchbar__cta:hover::after,
#ai-searchbar-form .ai-searchbar__cta:focus-visible::after{
  opacity:.22 !important;                      /* ←超控えめ。もっと薄くなら .15 */
  animation:aiCtaRingSpin 4.6s linear infinite !important;
}

@keyframes aiCtaRingSpin{
  to{ transform:rotate(360deg); }
}

/* 動きが苦手な人配慮 */
@media (prefers-reduced-motion: reduce){
  #ai-searchbar-form .ai-searchbar__cta:hover::after,
  #ai-searchbar-form .ai-searchbar__cta:focus-visible::after{
    animation:none !important;
    opacity:.18 !important;
  }
}

/* ============================================================================
   ✅ FINAL OVERRIDE 2（今回の要望）
   - 「全体を四角い枠で囲うバナー感」を消す
   - 主役は “検索窓（ピル）” だけにする
   ========================================================================== */

/* 外側フォームのカード感（border/box-shadow/padding/background）を無効化 */
#ai-searchbar-form.ai-searchbar{
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
  padding:0 !important;
  border-radius:0 !important;
}

/* focus-within で外側フォームが光るのも無効化（四角枠が出る原因） */
#ai-searchbar-form:focus-within{
  box-shadow:none !important;
  border-color:transparent !important;
}

/* 代わりに “中の検索窓（ピル）” の方だけ上品に強調 */
#ai-searchbar-form:focus-within .ai-searchbar__inner{
  box-shadow:0 2px 10px rgba(60,64,67,.18), 0 0 0 3px rgba(26,115,232,.14) !important;
  border-color:#d2d6db !important;
  background:#ffffff !important;
}

/* 余白感を整える：内側ピルに少しだけ余白（バナーじゃない見え方） */
#ai-searchbar-form .ai-searchbar__inner{
  padding:10px 12px !important;
}

/* ヒント文：左寄せのまま、外枠が無い前提で自然な位置に */
#ai-searchbar-form .ai-searchbar__hint{
  margin:10px 2px 0 !important;
}

/* モバイルでも外枠なしを徹底 */
@media (max-width: 767px){
  #ai-searchbar-form.ai-searchbar{
    padding:0 !important;
    border-radius:0 !important;
  }
  #ai-searchbar-form .ai-searchbar__inner{
    padding:10px 12px !important;
  }
}