/* Fichier CSS : /asset/css/page/reality/search.css */
.search-wrapper {
  /* 1200px = 75rem */
  max-width: calc(1200 / 16 * 1rem);
  width: 100%;
  margin: 0 auto;
  padding: 0;
}
.search-container {
  width: 100%;
  margin-top: 0;
  margin-bottom: var(--space-sm);
  padding: var(--space-lg) var(--space-lg) var(--space-sm) var(--space-lg);
  border: none;
  border-radius: var(--radius-md);
  background-color: var(--source-color-white-transparent) !important;
  box-shadow: var(--shadow-z2);
}
html[data-theme="dark"] .search-container {
  background-color: #222222 !important;
}
.search-input-group {
  border: none;
  padding: 0;
  border-radius: 0;
  background: transparent;
  margin-bottom: var(--space-sm);
  box-shadow: none;
  width: 100%;
}
.search-input-group > div {
  display: flex;
  /* 10px = 0.625rem */
  gap: calc(10 / 16 * 1rem);
  align-items: center;
}
.input {
  flex: 1 1 0;
  height: var(--space-xl);
  color: #002afd;
  padding: var(--space-sm);
  border: calc(1 / 16 * 1rem) solid var(--color-search-input-border);
  border-radius: var(--radius-md);
  font-size: 1.1rem;
  background-color: white;
}
html[data-theme="dark"] .input {
  background-color: #cacaca !important;
  color: #000080 !important;
}
.input:focus {
  outline: none;
}
html[data-theme="dark"] .input:focus,
html[data-theme="dark"] .input:not(:placeholder-shown) {
  background-color: #cacaca !important;
  color: #000080 !important;
}
html[data-theme="dark"] input:-webkit-autofill,
html[data-theme="dark"] input:-webkit-autofill:hover,
html[data-theme="dark"] input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #cacaca inset !important;
  -webkit-text-fill-color: #000080 !important;
  background-color: #cacaca !important;
  color: #000080 !important;
}
.search-input-group button.btn-search-submit,
.search-input-group a.btn-search-clear {
  font-weight: normal;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  cursor: pointer;
  flex-shrink: 0;
  height: var(--space-xl-plus);
}
/* --- RÉSULTATS DE RECHERCHE --- */
.search-result-item {
  font-size: 1.1rem;
  color: darkred;
  padding-top: var(--space-xs) !important;
  padding-bottom: var(--space-md);
  border-bottom: calc(1 / 16 * 1rem) solid var(--color-search-result-border);
}
html[data-theme="dark"] .search-result-item {
  color: #ff7777;
  font-weight: var(--fw-normal);
}
.search-result-item h3 {
  margin: var(--space-xs) 0 var(--space-sm) 0;
}
.search-result-item h3 a {
  display: inline;
  color: var(--color-search-result-h3);
  text-decoration: underline;
}
html[data-theme="dark"] .search-result-item h3 a {
  color: #8ba0ff;
  font-weight: var(--fw-normal);
}
.search-result-item h3 a:hover {
  font-weight: var(--fw-bold) !important;
}
.search-result-item a.url {
  color: var(--color-search-result-url);
  font-size: 1.1rem;
  display: inline;
  margin-top: var(--space-sm);
  text-decoration: underline;
  margin-bottom: var(--space-md);
}
html[data-theme="dark"] .search-result-item a.url {
  color: #ff7777;
}
.search-result-item a.url:hover {
  font-weight: var(--fw-bold);
}
/* --- ICÔNES (Mains pointées) --- */
.search-result-item h3 a::before,
.search-result-item a.url::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
  /* 5px = 0.3125rem */
  margin-right: calc(5 / 16 * 1rem);
  background-repeat: no-repeat;
  background-size: contain;
}
.search-result-item a.url::before {
  background-image: url("/asset/img/gl/hand-pointer-2-green.svg");
  flex-shrink: 0;
}
html[data-theme="dark"] .search-result-item a.url::before {
  background-image: url("/asset/img/gl/hand-pointer-2-dark.svg");
}
.search-result-item h3 a::before {
  background-image: url("/asset/img/gl/hand-pointer-3.svg");
  flex-shrink: 0;
}
html[data-theme="dark"] .search-result-item h3 a::before {
  background-image: url("/asset/img/gl/hand-pointer-3-dark-mode.svg");
}
.search-result-item .snippet {
  /* 8px = 0.5rem */
  margin-top: calc(8 / 16 * 1rem);
  font-size: 1.1rem;
  color: var(--color-search-result-text-excerpt);
  line-height: 1.5;
}
html[data-theme="dark"] .search-result-item .snippet {
  color: white;
}
.search-highlight {
  background: #fff6ca;
  padding: var(--space-xxs) var(--space-xs);
  border-radius: var(--radius-sm);
  font-weight: var(--fw-bold);
}
html[data-theme="dark"] .search-highlight {
  color: black;
  background: var(--color-search-highlight);
  padding: var(--space-xxs) var(--space-xs);
  border-radius: var(--radius-sm);
  font-weight: var(--fw-bold);
}
/* --- BOUTONS --- */
.search-buttons-row {
  display: flex;
  gap: var(--space-sm);
  align-items: center;
  flex-shrink: 0;
}
.search-buttons-row .btn {
  /* 150px = 9.375rem */
  max-width: calc(150 / 16 * 1rem);
  width: auto;
  flex-grow: 0;
  flex-shrink: 0;
}
.page-btn.disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
  filter: grayscale(100%);
}
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
@media (max-width: calc(550 / 16 * 1rem)) {
  .search-input-group > div {
    flex-direction: column;
    gap: 0;
    align-items: center;
  }
  .input {
    width: 100%;
    margin-bottom: var(--space-sm);
    flex-basis: auto;
  }
  .search-buttons-row {
    display: flex;
    width: auto;
    /* 15px = 0.9375rem */
    gap: calc(15 / 16 * 1rem);
    justify-content: flex-start;
    margin: 0 auto var(--space-sm) auto;
  }
  .search-buttons-row .btn-search-submit,
  .search-buttons-row .btn-search-clear {
    flex: 0 1 auto;
    width: auto;
    max-width: calc(150 / 16 * 1rem);
    justify-content: center;
    white-space: nowrap;
    margin: 0 !important;
  }
  .search-wrapper {
    /* 15px = 0.9375rem */
    padding: 0 calc(15 / 16 * 1rem);
  }
}
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
/*@media@media@media@media@media@media@media@media@media@media@media@media*/
@media (max-width: calc(635 / 16 * 1rem)) {
  .search-result-item h3 {
    font-size: 1rem !important;
  }
  .search-result-item h3 a {
    font-size: 1rem !important;
  }
  .search-result-item a.url {
    font-size: 0.9rem !important;
  }
  .search-result-item .snippet {
    font-size: 0.85rem !important;
  }
}