/* SIL7 v330: approved header only; existing layout and logo stay intact. */
.sil7-header-actions {
  position: absolute;
  right: 10px;
  top: 6px;
  height: 44px;
  z-index: 81;
  display: flex;
  align-items: center;
  gap: 2px;
}
.sil7-header-button, .sil7-panel-icon {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 44px;
  padding: 8px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: #f0e7ff;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.sil7-header-button svg, .sil7-panel-icon svg {
  width: 25px;
  height: 25px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.sil7-header-sport { width: 60px; gap: 5px; }
.sil7-header-button .sil7-header-chevron { width: 13px; height: 13px; }
/* Touch browsers can retain :hover after a tap. Keep header icons unframed,
   including after focus returns from a dialog or its search input. */
.sil7-header-button:focus { outline: none; box-shadow: none; }
.sil7-header-button[aria-expanded="true"] { color: #ff83f1; }
@media (hover: hover) and (pointer: fine) {
  .sil7-header-button:hover { color: #ff83f1; }
  .sil7-panel-icon:hover { color: #ff83f1; background: rgba(255,255,255,.04); }
}
html[data-header-input="keyboard"] .sil7-header-button:focus-visible,
.sil7-header-panel button:focus-visible, .sil7-header-panel input:focus-visible, .sil7-header-panel select:focus-visible { outline: 2px solid #e966f0; outline-offset: 2px; }
.sil7-header-panel {
  position: fixed;
  inset: auto;
  margin: 0;
  padding: 12px;
  width: min(340px, calc(100vw - 24px));
  max-width: calc(100vw - 24px);
  max-height: calc(100dvh - 90px);
  overflow-y: auto;
  box-sizing: border-box;
  color: #f4eeff;
  font-family: Inter, system-ui, sans-serif;
  border: 1px solid #69409a;
  border-radius: 16px;
  background: linear-gradient(145deg, #1b1030, #090717);
  box-shadow: 0 14px 42px rgba(0,0,0,.5);
  overscroll-behavior: contain;
}
.sil7-header-panel::backdrop { background: rgba(3,2,12,.4); }
.sil7-header-panel [hidden] { display: none !important; }
.sil7-header-panel[data-view="sports"] { width: min(250px, calc(100vw - 24px)); }
.sil7-header-panel-head { display: flex; align-items: center; gap: 4px; margin-bottom: 10px; }
.sil7-header-panel-head h2 { flex: 1; margin: 0 0 0 6px; font-size: 17px; font-weight: 700; }
.sil7-panel-icon { width: 36px; height: 36px; padding: 7px; flex: none; }
.sil7-panel-icon svg { width: 20px; height: 20px; }
.sil7-sport-options { display: grid; gap: 4px; }
.sil7-sport-option { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 10px; border: 1px solid transparent; border-radius: 10px; color: inherit; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.sil7-sport-option > span:first-child { width: 24px; font-size: 22px; }
.sil7-sport-option [data-sport-symbol], .sil7-header-sport [data-sport-symbol] { display:inline-flex; align-items:center; justify-content:center; flex:0 0 24px; width:24px; height:24px; font-size:22px; line-height:1; }
[data-sport-symbol] img { display:block; width:24px; height:24px; object-fit:contain; }
.sil7-sport-option strong { flex: 1; font-size: 14px; font-weight: 600; }
.sil7-sport-option small { font-size: 10px; color: #b3a4c8; }
.sil7-sport-option:disabled { opacity: .58; cursor: default; }
.sil7-sport-option.is-selected { background: rgba(190,56,207,.13); border-color: rgba(220,85,224,.35); }
.sil7-sport-check { color: #f178e9; }
.sil7-panel-note { margin: 10px 6px 3px; color: #bfb0d0; font-size: 12px; line-height: 1.5; }
.sil7-search-label { display: block; margin: 0 4px 8px; font-size: 13px; }
#sil7HeaderSearch { display: block; width: 100%; box-sizing: border-box; min-height: 44px; border: 1px solid #654380; border-radius: 10px; padding: 10px 12px; background: #100b1e; color: #fff; font: 16px Inter, system-ui, sans-serif; color-scheme: dark; }
#sil7HeaderSearch::placeholder { color: #9b8bad; font-size: 13px; }
.sil7-search-results { display: grid; gap: 3px; margin-top: 10px; }
.sil7-search-result { display: grid; gap: 4px; padding: 11px; border: 0; border-radius: 9px; width: 100%; color: #eee4f8; background: transparent; font: inherit; text-align: left; cursor: pointer; }
.sil7-search-result:hover { background: #261434; }
.sil7-search-result strong { font-size: 13px; font-weight: 600; }
.sil7-search-result small { color: #b6a2c9; font-size: 11px; }
.sil7-search-result, .sil7-search-match, .sil7-search-entity { overflow-wrap: anywhere; }
.sil7-search-entity { display: block; padding: 6px; font-size: 14px; }
.sil7-search-match { display: grid; width: 100%; gap: 6px; margin-top: 5px; padding: 11px; border: 1px solid #432951; border-radius: 9px; background: #130c20; color: inherit; font: inherit; text-align: left; cursor: pointer; touch-action: manipulation; }
@media (hover: hover) { .sil7-search-match:hover { border-color: #b85bce; background: #21102f; } }
.sil7-search-match strong { font-size: 13px; font-weight: 600; }
.sil7-search-match small { color: #b6a2c9; font-size: 11px; line-height: 1.4; }
.sil7-search-match > span { font-size: 12px; color: #e2bfec; }
.sil7-profile-card { display: flex; align-items: center; gap: 12px; padding: 10px 5px 20px; overflow-wrap: anywhere; }
.sil7-profile-card > div { min-width: 0; }
.sil7-profile-card strong { font-size: 15px; }
.sil7-profile-card .sil7-panel-note { margin: 5px 0 0; }
.sil7-profile-avatar { display: flex; align-items: center; justify-content: center; flex: none; width: 44px; height: 44px; border: 1px solid #795399; border-radius: 50%; background: #352048; font-size: 16px; }
.sil7-profile-settings { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 46px; padding: 12px; border: 1px solid #4d305f; border-radius: 10px; background: #1a1028; color: #f4e9ff; font: 14px Inter, system-ui, sans-serif; cursor: pointer; }
.sil7-profile-settings span:last-child { font-size: 22px; color: #c897dd; }
.sil7-settings-toggle { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 10px 6px; font-size: 13px; cursor: pointer; }
.sil7-settings-toggle small { display: block; margin-top: 7px; font-size: 11px; color: #b9a7c9; }
.sil7-settings-toggle input { width: 20px; height: 20px; flex: none; accent-color: #c655d5; }
.sil7-language-label { display: block; margin: 6px 6px 9px; font-size: 13px; }
.sil7-language-select {
  display: block; width: 100%; min-height: 44px; box-sizing: border-box;
  border: 1px solid #654380; border-radius: 10px; padding: 10px 48px 10px 12px;
  appearance: none; -webkit-appearance: none;
  background: #100b1e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9 6 6 6-6' fill='none' stroke='%23dfcde9' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 14px center / 20px 20px;
  color: #fff; font: 16px Inter, system-ui, sans-serif; color-scheme: dark;
}
.sil7-language-status { margin: 8px 6px; color: #d3b4e4; font-size: 11px; line-height: 1.4; }
.sil7-language-status:empty { display: none; }
.sil7-header-panel[data-view="welcome"] { width:min(360px, calc(100vw - 24px)); padding:20px; }
.sil7-header-panel[data-view="welcome"] .sil7-header-panel-head h2 { margin-left:0; font-size:20px; }
.sil7-welcome-intro { margin:0 0 20px; font-size:13px; color:#c6b7d6; }
.sil7-header-panel[data-view="welcome"] .sil7-language-label { margin:16px 0 8px; }
.sil7-header-panel[data-view="welcome"] .sil7-panel-note { margin:10px 0; }
.sil7-welcome-continue,.sil7-welcome-skip { display:block; width:100%; min-height:44px; border-radius:10px; font:600 13px/1.4 var(--sil7-font, sans-serif); cursor:pointer; }
.sil7-welcome-continue { margin-top:20px; padding:11px; border:1px solid #e26af0; background:linear-gradient(115deg,#712283,#431b5e); color:#fff; }
.sil7-welcome-continue:disabled { opacity:.45; cursor:default; }
.sil7-welcome-skip { margin-top:6px; border:0; background:transparent; color:#c8b7d7; }
html[data-reduced-motion="true"] *, html[data-reduced-motion="true"] *::before, html[data-reduced-motion="true"] *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
@media (max-width: 360px) {
  .sil7-header-actions { right: 6px; gap: 0; }
  .sil7-header-button { width: 36px; padding-inline: 6px; }
  .sil7-header-sport { width: 48px; gap: 2px; }
  .sil7-header-button svg { width: 23px; height: 23px; }
}
