
:root {
    --input_height: 45px;
}

/* TITLE */

.picto-title {
    position: relative;
    left: calc(-1 * var(--spacing) - 35px);
}
@media screen and (max-width: 1000px) {
    .picto-title { left: 0px; }
}


/* ADVANCED SEARCH */

/* 
    view/omeka/site/item/search.phtml
    view/common/advanced-search.phtml
    view/common/advanced-search/properties.phtml
*/

.advanced-search-content .field {
  border-bottom: 2px solid;
  padding-bottom: var(--spacing);
}
.advanced-search-content .field {
    border-bottom: 2px solid;
    padding-bottom: var(--spacing);
}
.advanced-search-content .field-description {
    margin: var(--spacing) auto;
}
.advanced-search-content .field-meta label,
.advanced-search-content .field-meta .label {
    margin: var(--spacing) auto;
    font-weight: bold;
    display: block;
}
.advanced-search-content .inputs {
    display: flex; flex-direction: column; align-items: start;
    gap: var(--spacing);
}
.advanced-search-content .inputs .value {
    display: flex;
    gap: var(--spacing);
    align-items: center;
    flex-wrap: wrap;
}
.advanced-search-content input {
    height: var(--input_height);
    border: 2px solid var(--bleu);
}
.advanced-search-content .inputs select {
    height: var(--input_height);
    background-color: transparent;
    border: 2px solid var(--bleu);
    padding: 0px var(--spacing);
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    cursor: inherit;
    line-height: inherit;
}
/* on cache les inputs qui arrivent à cause du module Numeric Data types */
div[id^="numeric"] {
  display: none;
}

#advanced-search button.add-value {
  margin-bottom: calc(.5 * var(--spacing));
  background: url("../media/plus-gris.svg");
}
#advanced-search button.add-value:hover {
  background: url("../media/plus-plein-gris.svg");
}
#advanced-search button.remove-value {
  margin-top: var(--spacing);
  margin-bottom: var(--spacing);
  background: url("../media/croix-gris.svg");
}
#advanced-search button.remove-value:hover {
  background: url("../media/croix-plein-gris.svg");
}

#page-actions {
    padding: 0px var(--spacing);
    margin: var(--spacing) auto;
}
#page-actions input {
    margin: auto;
    display: block;
}

/*
    STYLE POUR LA RECHERCHE CUSTOM
    AVEC LES PARTIES SCRIPT DESCRIPTOR, ETC
*/
select.query-value[disabled] {
    display: none;
}

.advanced-search-content h3 { font: var(--asap-condensed-h3); font-weight: 600; color: var(--rouge); }
.advanced-search-content h4 { font: var(--asap-condensed-h4); font-weight: 600; }
.advanced-search-content h5 { font: var(--asap-condensed-h5); font-weight: 600; }
.advanced-search-content h6 { font: var(--asap-condensed-h6); font-weight: 600; }

.advanced-search-content h3 {
  margin-top: calc(2 * var(--spacing));
  margin-bottom: var(--spacing);
  display: flex; align-items: center; gap: var(--spacing);
}
.advanced-search-content h3::before {
  content: "";
  flex-shrink: 0;
  width: var(--spacing);
  aspect-ratio: 1/3;
  background-color: var(--orange);
}
.advanced-search-content h4 {
  margin-top: calc(1 * var(--spacing));
  margin-bottom: var(--spacing);
}
.advanced-search-content h5 {
  margin-top: var(--spacing);
  margin-bottom: var(--spacing);
}
.query-type { display: none; }
.query-type.active { display: block; }


/* choices */
.choices, .choices__inner {
    margin-bottom: 0px;
    font: var(--asap-1) !important;
}
.choices__list--dropdown,
.choices__list[aria-expanded] {
  word-break: break-word;
  width: max-content;
}
.choices[data-type*="select-one"]::after {
    mask: url('../media/chevron-gris.svg') no-repeat center / 100%;
  width: var(--picto-width); height: auto;
  aspect-ratio: 1/1;
  display: block;
  background-color: var(--bleu);
  margin-top: 0px;
  top: calc(.4 * var(--spacing));
  right: calc(.3 * var(--spacing));
}
.choices[data-type*="select-one"].is-open::after {
    margin-top: 0px;
    transform: rotate(180deg);
}
.choices__list--single {
    padding: 4px calc(1.2 * var(--picto-width)) 4px 4px;
}
.choices__inner,
.is-focused .choices__inner,
.is-open .choices__list.choices__list--dropdown {
  background-color: var(--white);
  border: 2px solid var(--bleu);
}
.choices .is-highlighted {
    background-color: var(--bleu) !important;
    color: var(--white);
}
.choices__list--dropdown, .choices__list[aria-expanded] {
    z-index: 3;
}
