/* TalatYai — header validé, octobre 2026. */
:root {
  --ty-header-blue: #2477c9;
  --ty-header-dark: #173b60;
  --ty-header-orange: #f58220;
  --ty-header-line: #dce8f2;
  --ty-header-soft: #f3f8fd;
}

body.sp-site-page header.header {
  height: 148px !important;
  border-bottom: 1px solid var(--ty-header-line);
  background: #fff;
  box-shadow: 0 2px 10px rgba(25, 63, 99, .06);
}
body.sp-site-page .header-end {height: 148px !important;}
/* Évite le « coup » latéral quand la barre de défilement apparaît/disparaît entre deux pages. */
html {overflow-y: scroll; scrollbar-gutter: stable;}
body.sp-site-page header.header {z-index: 900; transition: box-shadow .2s ease;}
/* Trait du bas du header : sur toute la largeur, au-dessus du fond blanc de la grille. */
body.sp-site-page header.header::after {content: ""; position: absolute; z-index: 1000; right: 0; bottom: 0; left: 0; height: 2px; background: #c9d6e2; pointer-events: none;}
body.sp-site-page header.header.is-scrolled::after {background: #aebccb;}
body.sp-site-page header.header.is-scrolled {border-bottom-color: #b9c6d2; box-shadow: 0 6px 16px rgba(23, 59, 96, .20) !important;}
body.sp-site-page header.header .sp-header-shell {
  display: grid !important;
  width: min(calc(100% - 64px), 1480px) !important;
  max-width: 1480px !important;
  height: 148px !important;
  margin: 0 auto !important;
  grid-template-rows: 76px 72px !important;
}
body.sp-site-page header.header .sp-header-main {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 76px !important;
  height: 76px !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-template-columns: 190px minmax(300px, 1fr) auto 215px 72px;
  grid-template-areas: "logo search account deposit language";
  gap: 20px;
  align-items: center;
}
body.sp-site-page header.header .sp-header-quick-links,
body.sp-site-page header.header .sp-language-desktop,
body.sp-site-page header.header .sp-mobile-deposit {display: none !important;}
body.sp-site-page header.header .toggle-menu {display: none !important;}

body.sp-site-page header.header .header-logo {
  grid-area: logo;
  width: 190px;
  margin: 0 !important;
}
body.sp-site-page header.header .header-logo p {margin: 0;}
body.sp-site-page header.header .header-logo a {display: flex; height: 76px; align-items: center; overflow: visible;}
body.sp-site-page header.header .header-logo img {display: block; width: 174px !important; height: auto; margin: 0 !important;}

body.sp-site-page header.header .sp-header-search-wrap {
  display: block !important;
  grid-area: search;
  z-index: 510;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 620px !important;
  margin-left: 0;
  justify-self: end;
}
body.sp-site-page header.header .sp-header-search {
  display: flex;
  width: 100%;
  max-width: none !important;
  height: 48px !important;
  box-sizing: border-box;
  align-items: center;
  overflow: hidden;
  border: 1.5px solid #bdd4e8 !important;
  border-radius: 999px !important;
  background: #fff !important;
  box-shadow: 0 3px 12px rgba(36, 119, 201, .08);
}
body.sp-site-page header.header .sp-header-search input[type="search"] {
  flex: 1 1 auto;
  height: 100%;
  min-width: 0;
  padding: 0 22px !important;
  border: 0;
  background: transparent;
  color: var(--ty-header-dark);
  font: 400 17px/1 Arial, sans-serif;
}
body.sp-site-page header.header .sp-header-search input[type="search"]::placeholder {color: #8193a4 !important; opacity: 1 !important;}
body.sp-site-page header.header .sp-header-search button[type="submit"] {
  display: grid;
  flex: 0 0 42px !important;
  width: 42px !important;
  height: 42px !important;
  place-items: center;
  margin: 2px 3px 2px 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: var(--ty-header-orange) !important;
  color: #fff;
}
body.sp-site-page header.header .sp-header-search button[type="submit"]:is(:hover, :focus-visible) {background: #dd6d11 !important;}
body.sp-site-page header.header .sp-header-search button[type="submit"] svg {width: 23px; height: 23px;}

body.sp-site-page header.header .header-links {
  position: static !important;
  display: block !important;
  grid-area: account;
  width: auto !important;
  height: 64px !important;
  margin: 0 !important;
  background: transparent !important;
}
body.sp-site-page header.header .header-links .menu {
  position: static !important;
  display: flex !important;
  width: auto !important;
  height: 64px !important;
  padding: 0 !important;
  align-items: center;
  justify-content: center;
  gap: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}
body.sp-site-page header.header .header-links .sp-header-account-link,
body.sp-site-page header.header .header-links .connexion {
  position: relative;
  display: flex !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
  height: 62px !important;
  box-sizing: border-box;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 38px 2px 4px !important;
  border: 0 !important;
  border-radius: 12px;
  background: transparent !important;
  color: var(--ty-header-blue) !important;
  font: 600 14px/1.15 Arial, sans-serif !important;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  overflow: visible;
}
body.sp-site-page header.header .header-links .sp-header-account-link::before,
body.sp-site-page header.header .header-links .connexion::before {
  content: '';
  position: absolute !important;
  top: 4px !important;
  left: 50% !important;
  flex: none !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 0 0 -15px !important;
  background-color: transparent !important;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 27px 27px;
}
body.sp-site-page header.header .header-links .sp-header-searches::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232477c9' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3h10a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/%3E%3Cpath d='M9 8h6M9 12h6M9 16h4'/%3E%3C/svg%3E");
}
body.sp-site-page header.header .header-links .sp-header-favorites::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232477c9' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.8 4.6a5.5 5.5 0 0 0-7.8 0L12 5.6l-1.1-1a5.5 5.5 0 0 0-7.8 7.8l1.1 1L12 21l7.8-7.6a5.5 5.5 0 0 0 1-8.8Z'/%3E%3C/svg%3E");
}
body.sp-site-page header.header .header-links .connexion::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232477c9' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21a8 8 0 0 1 16 0'/%3E%3C/svg%3E");
}
body.sp-site-page header.header .header-links .sp-header-account-link:is(:hover, :focus-visible),
body.sp-site-page header.header .header-links .connexion:is(:hover, :focus-visible) {background: transparent !important; color: var(--ty-header-orange) !important; outline: 0; text-decoration: underline;}
body.sp-site-page header.header .dashboard-menu-mobile {display: none !important;}

body.sp-site-page header.header .sp-header-deposit {
  display: inline-flex !important;
  grid-area: deposit;
  width: 215px;
  min-height: 48px !important;
  box-sizing: border-box;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  padding: 0 18px !important;
  border: 1px solid var(--ty-header-orange) !important;
  border-radius: 11px !important;
  background: var(--ty-header-orange) !important;
  color: #fff !important;
  font: 700 14px/1 Arial, sans-serif !important;
  letter-spacing: .02em;
  text-transform: uppercase;
  white-space: nowrap;
}
body.sp-site-page header.header .sp-header-deposit:is(:hover, :focus-visible) {background: #dd6d11 !important; border-color: #dd6d11 !important;}

body.sp-site-page header.header .sp-language-mobile {
  display: block !important;
  grid-area: language;
  z-index: 700;
  width: 72px !important;
  height: 48px !important;
  margin: 0 !important;
}
body.sp-site-page header.header .sp-language-mobile > div {position: relative; display: flex; width: 72px; height: 48px; align-items: center; top: 0 !important;}
body.sp-site-page header.header .sp-language-trigger {
  display: flex;
  width: 72px;
  min-width: 72px;
  height: 48px;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0;
  border: 1px solid #d7e4ef;
  border-radius: 11px;
  background: #fff;
  color: var(--ty-header-blue);
  cursor: pointer;
}
body.sp-site-page header.header .sp-language-trigger img {width: 28px !important; height: 20px !important; margin: 0 !important; border-radius: 3px; object-fit: cover;}
body.sp-site-page header.header .sp-language-trigger span {display: flex; width: 15px; height: 15px; align-items: center; justify-content: center; font: 0/0 Arial, sans-serif; transform: none;}
body.sp-site-page header.header .sp-language-trigger span svg {display: block; width: 15px; height: 15px;}
body.sp-site-page header.header .sp-language-mobile ul {
  position: absolute;
  z-index: 701;
  top: calc(100% + 5px);
  right: 0;
  width: 72px;
  height: auto;
  box-sizing: border-box;
  margin: 0;
  padding: 4px;
  border: 1px solid #d7e4ef;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(23, 59, 96, .16);
}
body.sp-site-page header.header .sp-language-mobile ul[hidden] {display: none !important;}
body.sp-site-page header.header .sp-language-mobile li {float: none; margin: 0; padding: 0;}
body.sp-site-page header.header .sp-language-mobile li a {display: flex; min-height: 43px; align-items: center; justify-content: center; padding: 0; border-radius: 7px; color: var(--ty-header-dark); text-decoration: none;}
body.sp-site-page header.header .sp-language-mobile li a span {display: none;}
body.sp-site-page header.header .sp-language-mobile li a:is(:hover, :focus-visible) {background: var(--ty-header-soft);}

body.sp-site-page header.header .ty-category-navigation {
  position: relative;
  display: block !important;
  width: 100%;
  height: 72px;
  border-top: 1px solid #edf2f6;
  background: #fff;
}
body.sp-site-page header.header .ty-category-strip-scroll {width: 100%; height: 72px; overflow: visible;}
body.sp-site-page header.header .ty-category-list {
  display: flex !important;
  width: 100%;
  height: 72px;
  margin: 0;
  padding: 0;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1.9vw, 34px);
  list-style: none;
}
body.sp-site-page header.header .ty-category-list > li {display: block; flex: 0 0 auto; min-width: 0; height: 68px; margin: 0; padding: 0;}
body.sp-site-page header.header .ty-category-link {
  display: flex;
  width: auto;
  height: 68px;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  margin: 0;
  padding: 0 15px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: var(--ty-header-blue);
  font: 600 15px/1.15 Arial, sans-serif;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease;
}
body.sp-site-page header.header .ty-category-link svg {display: block; flex: 0 0 41px; width: 41px; height: 41px;}
body.sp-site-page header.header .ty-category-link span {display: block; white-space: nowrap;}
body.sp-site-page header.header .ty-category-link:is(:hover, :focus-visible) {background: var(--ty-header-soft); outline: 0;}
body.sp-site-page header.header .ty-category-link.is-active {background: #fdf2e9; color: var(--ty-header-orange);}
body.sp-site-page header.header .ty-category-link .ty-category-label-row {display: flex; align-items: center; gap: 6px;}
body.sp-site-page header.header .ty-category-link .ty-category-label-row > span {display: block;}
body.sp-site-page header.header .ty-category-link .ty-category-chevron {flex: 0 0 15px; width: 15px; height: 15px; transition: transform .18s ease;}
body.sp-site-page header.header .ty-all-categories-trigger {position: relative;}
body.sp-site-page header.header .ty-all-categories-trigger.is-open {background: #e8f1fb;}
body.sp-site-page header.header .ty-all-categories-trigger.is-open .ty-category-chevron {transform: rotate(180deg);}

body.sp-site-page header.header .ty-all-categories-panel {
  position: absolute;
  z-index: 680;
  top: 80px;
  right: 5%;
  left: 5%;
  box-sizing: border-box;
  max-height: calc(100vh - 170px);
  padding: 30px 0 0;
  overflow-y: auto;
  border: 1px solid #e6ecf2;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 22px 52px rgba(23, 59, 96, .15);
}
body.sp-site-page header.header .ty-all-categories-panel[hidden] {display: none !important;}
body.sp-site-page header.header .ty-category-mega-grid {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0;}
body.sp-site-page header.header .ty-category-mega-group {min-width: 0; margin: 0 0 30px; padding: 0 34px;}
body.sp-site-page header.header .ty-category-mega-group + .ty-category-mega-group {border-left: 1px solid #e9eef4;}
body.sp-site-page header.header .ty-category-mega-title {
  display: flex;
  min-height: 44px;
  align-items: center;
  margin: 0 0 12px;
  color: var(--ty-header-dark);
  font: 700 19px/1.25 Arial, sans-serif;
  letter-spacing: normal;
  text-decoration: none;
  text-transform: none;
}
body.sp-site-page header.header .ty-mega-icon {display: flex; flex: 0 0 62px; width: 62px; align-items: center; color: var(--ty-header-blue);}
body.sp-site-page header.header .ty-mega-icon svg {display: block; width: 36px; height: 36px;}
body.sp-site-page header.header .ty-mega-icon svg.ty-mega-icon-wide {width: 50px;}
body.sp-site-page header.header .ty-category-mega-group ul {margin: 0; padding: 0 0 0 62px; list-style: none;}
body.sp-site-page header.header .ty-category-mega-group li {margin: 0 0 11px;}
body.sp-site-page header.header .ty-category-mega-group li a {color: #587087; font: 400 16px/1.35 Arial, sans-serif; text-decoration: none;}
body.sp-site-page header.header .ty-category-mega-group a:is(:hover, :focus-visible) {color: var(--ty-header-blue); text-decoration: underline;}
body.sp-site-page header.header .ty-category-mega-footer {
  display: flex;
  min-height: 68px;
  align-items: center;
  justify-content: center;
  gap: 30px;
  padding: 0 28px;
  border-top: 1px solid #e9eef4;
  background: #fff;
}
body.sp-site-page header.header .ty-category-mega-more {display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px 40px;}
body.sp-site-page header.header .ty-category-mega-footer a {display: inline-flex; align-items: center; gap: 10px; color: var(--ty-header-blue); font: 600 16px/1.2 Arial, sans-serif; text-decoration: none;}
body.sp-site-page header.header .ty-category-mega-footer a svg {flex: 0 0 26px; width: 26px; height: 26px;}
body.sp-site-page header.header .ty-category-mega-footer a:is(:hover, :focus-visible) {text-decoration: underline;}
body.sp-site-page header.header .ty-category-mega-footer .ty-category-view-all {gap: 8px; padding: 6px 0 6px 30px; border-left: 1px solid #e3e9ef; color: var(--ty-header-orange);}
body.sp-site-page header.header .ty-category-mega-footer .ty-category-view-all svg {flex-basis: 20px; width: 20px; height: 20px;}
body.sp-site-page header.header .sp-category-scroll-previous,
body.sp-site-page header.header .sp-category-scroll-next {display: none !important;}

@media (max-width: 1260px) {
  body.sp-site-page header.header .sp-header-main {grid-template-columns: 176px minmax(240px, 1fr) auto 190px 68px; gap: 12px;}
  body.sp-site-page header.header .header-logo {width: 176px;}
  body.sp-site-page header.header .header-logo img {width: 166px !important;}
  body.sp-site-page header.header .sp-header-search-wrap {width: 100% !important; max-width: 540px !important; margin-left: 0;}
  body.sp-site-page header.header .header-links .sp-header-account-link,
  body.sp-site-page header.header .header-links .connexion {width: 98px !important; min-width: 98px !important; max-width: 98px !important; font-size: 13px !important;}
  body.sp-site-page header.header .sp-header-deposit {width: 190px; font-size: 13px !important;}
  body.sp-site-page header.header .ty-category-link {padding: 0 10px;}
  body.sp-site-page header.header .ty-category-list {gap: 4px;}
}

@media (max-width: 1120px) {
  body.sp-site-page header.header .header-links .sp-header-searches {display: none !important;}
}

@media (max-width: 980px) {
  body.sp-site-page header.header .sp-header-main {grid-template-columns: 48px 160px minmax(230px, 1fr) 66px; grid-template-areas: "menu logo search language"; gap: 12px;}
  body.sp-site-page header.header .toggle-menu {display: block !important; grid-area: menu;}
  body.sp-site-page header.header .header-logo {width: 160px;}
  body.sp-site-page header.header .header-logo img {width: 154px !important;}
  body.sp-site-page header.header .sp-header-search-wrap {width: 100% !important; margin-left: 0;}
  body.sp-site-page header.header .header-links,
  body.sp-site-page header.header .sp-header-deposit {display: none !important;}
  body.sp-site-page header.header .ty-category-strip-scroll {overflow-x: auto; overflow-y: hidden; scrollbar-width: none;}
  body.sp-site-page header.header .ty-category-strip-scroll::-webkit-scrollbar {display: none;}
  body.sp-site-page header.header .ty-category-list {display: flex !important; width: max-content; min-width: 100%; justify-content: flex-start; gap: 2px; padding: 0 8px; box-sizing: border-box;}
  body.sp-site-page header.header .ty-all-categories-panel {right: 2%; left: 2%;}
  body.sp-site-page header.header .ty-category-mega-grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
  body.sp-site-page header.header .ty-category-mega-group:nth-child(odd) {border-left: 0;}
}

@media (max-width: 700px) {
  body.sp-site-page header.header {height: 182px !important;}
  body.sp-site-page .header-end {height: 182px !important;}
  body.sp-site-page header.header .sp-header-shell {width: calc(100% - 24px) !important; height: 182px !important; grid-template-rows: 112px 70px !important;}
  body.sp-site-page header.header .sp-header-main {
    height: 112px !important;
    min-height: 112px !important;
    grid-template-columns: 44px minmax(0, 1fr) 58px;
    grid-template-rows: 48px 48px;
    grid-template-areas: "menu logo language" "search search search";
    gap: 8px;
  }
  body.sp-site-page header.header .header-logo {width: auto; justify-self: center;}
  body.sp-site-page header.header .header-logo a {height: 48px;}
  body.sp-site-page header.header .header-logo img {width: 128px !important;}
  body.sp-site-page header.header .sp-language-mobile,
  body.sp-site-page header.header .sp-language-mobile > div {width: 58px !important; height: 44px !important;}
  body.sp-site-page header.header .sp-language-trigger {width: 58px; min-width: 58px; height: 44px; min-height: 44px; border: 0;}
  body.sp-site-page header.header .sp-language-mobile ul {width: 58px; right: 0;}
  body.sp-site-page header.header .sp-header-search {height: 46px !important;}
  body.sp-site-page header.header .sp-header-search input[type="search"] {padding: 0 15px !important; font-size: 16px;}
  body.sp-site-page header.header .sp-header-search button[type="submit"] {flex-basis: 40px !important; width: 40px !important; height: 40px !important;}
  body.sp-site-page header.header .sp-header-search button[type="submit"] {order: initial !important; margin-right: 3px !important;}
  body.sp-site-page header.header .ty-category-navigation,
  body.sp-site-page header.header .ty-category-strip-scroll,
  body.sp-site-page header.header .ty-category-list,
  body.sp-site-page header.header .ty-category-list > li,
  body.sp-site-page header.header .ty-category-link {height: 70px;}
  body.sp-site-page header.header .ty-category-list > li {height: 62px;}
  body.sp-site-page header.header .ty-category-link {height: 62px; padding: 0 10px; font-size: 12px; gap: 3px;}
  body.sp-site-page header.header .ty-category-link svg {flex-basis: 32px; width: 32px; height: 32px;}
  body.sp-site-page header.header .ty-category-link .ty-category-chevron {flex-basis: 13px; width: 13px; height: 13px;}
  body.sp-site-page header.header .ty-all-categories-panel {position: fixed; top: 182px; right: 0; left: 0; max-height: calc(100dvh - 182px); padding: 18px 0 0; border: 0; border-radius: 0;}
  body.sp-site-page header.header .ty-category-mega-grid {grid-template-columns: minmax(0, 1fr); gap: 0;}
  body.sp-site-page header.header .ty-category-mega-group,
  body.sp-site-page header.header .ty-category-mega-group + .ty-category-mega-group {margin-bottom: 0; padding: 0 20px 18px; border-left: 0;}
  body.sp-site-page header.header .ty-category-mega-footer {align-items: flex-start; flex-direction: column; gap: 14px; padding: 16px 20px;}
  body.sp-site-page header.header .ty-category-mega-more {justify-content: flex-start; gap: 12px 26px;}
  body.sp-site-page header.header .ty-category-mega-footer .ty-category-view-all {padding-left: 0; border-left: 0;}
  body.sp-site-page .sp-header-search-menu {top: 68px; max-height: calc(100dvh - 80px);}
}

@media (max-width: 390px) {
  body.sp-site-page header.header .header-logo img {width: 116px !important;}
}

/* Les liens personnels vivent dans l'espace membre, pas dans le header public. */
body.sp-site-page .dashboard-menu a[href*="acc_search.php"],
body.sp-site-page .dashboard-menu a[href*="selection.php"] {color: var(--ty-header-blue); font-weight: 700;}
