@charset "UTF-8";

:root {
  /** Polices */

  --font-primary: "Fira Sans Condensed";
  /* --font-primary: "Fira Sans Extra Condensed"; */
  --font-secondary: "Bebas Neue";

  /* ~11+ pt */
  /* --bulma-body-font-size: 0.925em; */
  --bulma-family-primary: var(--font-primary), Inter, SF Pro, Segoe UI, Roboto, Oxygen, Ubuntu, Helvetica Neue, Helvetica, Arial, sans-serif;
  --bulma-family-secondary: var(--font-secondary), Inter, SF Pro, Segoe UI, Roboto, Oxygen, Ubuntu, Helvetica Neue, Helvetica, Arial, sans-serif;


  /** Couleurs */

  --bulma-primary-h: var(--c-lemon-green-h);
  --bulma-primary-s: var(--c-lemon-green-s);
  --bulma-primary-l: var(--c-lemon-green-l);

  --bulma-link-h: var(--c-lemon-green-invert-h);
  --bulma-link-s: var(--c-lemon-green-invert-s);
  --bulma-link-l: var(--c-lemon-green-invert-l);

  --bulma-info-h: var(--c-sky-blue-h);
  --bulma-info-s: var(--c-sky-blue-s);
  --bulma-info-l: var(--c-sky-blue-l);

  --bulma-success-h: var(--c-spring-green-80-h);
  --bulma-success-s: var(--c-spring-green-80-s);
  --bulma-success-l: var(--c-spring-green-80-l);

  --bulma-danger-h: var(--c-emerald-green-invert-h);
  --bulma-danger-s: var(--c-emerald-green-invert-s);
  --bulma-danger-l: var(--c-emerald-green-invert-l);

  --bulma-focus-h: var(--c-light-violet-h);
  --bulma-focus-s: var(--c-light-violet-s);
  --bulma-focus-l: var(--c-light-violet-l);

  /** Formulaires */

  --bulma-arrow-color: var(--c-light-violet-100);
  --bulma-field-block-spacing: var(--bulma-size-normal);
  --bulma-size-small: 0.8rem;

  --c-required-color: var(--c-light-violet-100);
  /* --c-required-h: var(--c-light-violet-h);
  --c-required-s: var(--c-light-violet-s);
  --c-required-l: var(--c-light-violet-l); */
  /* --c-required-h: var(--c-gray-1-h);
  --c-required-s: var(--c-gray-1-s);
  --c-required-l: var(--c-gray-1-l); */
  --c-required-border-width: 2px;

  --c-block-title-size1: 1.5em;
  --c-block-title-size2: 1.25em;
  /* --c-block-title-size3: 1.25em; */
  --c-border-color: hsl(221, 14%, 90%); /*var(--bulma-input-border-color);*/

  /* zoom: 0.9; */
}


/** Contenus **/

a:not(.button, .dropdown-item, .pagination-link, .tag):hover {
  text-decoration: underline;
}

.breadcrumb {
  font-family: var(--font-secondary);
  font-size: var(--bulma-size-medium);
  /* var(--bulma-breadcrumb-item-separator-color); */
  border-bottom: solid 1px var(--c-gray-6-100);
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  padding-top: 0.5rem;
}
.breadcrumb li span {
  padding: var(--bulma-breadcrumb-item-padding-vertical) var(--bulma-breadcrumb-item-padding-horizontal);
}

.content {
  padding-bottom: 2em;
}
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
  font-family: var(--font-secondary);
}


/** Cartes */

.card-header-title {
  font-family: var(--font-secondary);
  font-size: var(--c-block-title-size1);
  font-weight: bold;
}


/** Formulaires */

.c-required label {
  text-decoration: underline solid var(--c-required-color) var(--c-required-border-width);
  text-underline-offset: var(--c-required-border-width);
}

.c-required .input,
.c-required .select,
.c-required .select select,
.c-required .textarea {
  /* --bulma-input-h: var(--c-required-h);
  --bulma-input-s: var(--c-required-s);
  --bulma-input-l: var(--c-required-l); */
  /* background-color: rgb(from var(--c-required) r g b / 0.04) */
  border-bottom-color: var(--c-required-color);
  border-bottom-width: var(--c-required-border-width);
  color: inherit;
}
.c-required .select select:focus,
.c-required .input:focus,
.c-required .textarea:focus,
.c-required .select select:focus-within,
.c-required .input:focus-within,
.c-required .textarea:focus-within,
.c-required .select select.is-focused,
.c-required .is-focused.input,
.c-required .is-focused.textarea {
  border-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l));
  border-width: var(--bulma-control-border-width);;
}

.c-error .input,
.c-error .select,
.c-error .select select,
.c-error .textarea {
  --bulma-input-h: var(--bulma-danger-h);
  --bulma-input-s: var(--bulma-danger-s);
  --bulma-input-l: var(--bulma-danger-l);
  /* background-color: rgb(from var(--c-emerald-green-invert-100) r g b / 0.01); */
  border-color: hsl(var(--bulma-danger-h), var(--bulma-danger-s), var(--bulma-danger-l));
  color: inherit;
}

.help {
  font-size: calc(var(--bulma-size-normal) * 0.85);
  color: hsl(var(--c-light-violet-h), var(--c-light-violet-s), var(--bulma-info-on-scheme-l));
}
/* .help.is-info {
  color: hsl(var(--c-light-violet-h), var(--c-light-violet-s), var(--bulma-info-on-scheme-l));
} */
.help.is-small {
  font-size: var(--bulma-help-size); /* Taille initiale */
}

/* Il faut appliquer la classe .control sur le premier fieldset pour hériter des variables. */
fieldset {
  margin-bottom: var(--bulma-block-spacing);
  padding: 0 var(--bulma-block-spacing) var(--bulma-block-spacing) var(--bulma-block-spacing);
  border: 1px solid var(--c-border-color);
  border-radius: var(--bulma-input-radius);
  /* offset-x | offset-y | blur-radius | spread-radius | color */
  box-shadow: 0 0.125em 0.5em -0.125em hsla(var(--bulma-shadow-h), var(--bulma-shadow-s), var(--bulma-shadow-l), 0.1);
}
legend {
  font-family: var(--font-secondary);
  font-size: var(--c-block-title-size1);
  font-weight: bold;
  margin-left: -0.25em;
  padding: 0 0.25em;
}

fieldset.control {
  margin-bottom: 2em;
  margin-top: var(--c-block-title-size2);
}
fieldset.control legend {
  font-size: var(--c-block-title-size2);
  margin-bottom: .5em;
}
fieldset.control > legend:first-child {
  font-size: var(--c-block-title-size1);
}
fieldset.control > fieldset:last-child {
  margin-bottom: 0;
}

/* Sous-champs "en ligne" à valider */
/* Peut éviter des gabarits spécifiques */
/* Sous-champs */
.field.is-grouped > .field {
  display: flex;
  /*gap: 0.75rem;*/
  /* C'est la différence qui fait qu'ils sont en colonne et non en ligne : */
  flex-direction: column;
}
.field.is-grouped > .field.is-expanded,
.field.is-grouped > .field .control.is-expanded
{
  flex-grow: 1;
  flex-shrink: 1;
}

.field.is-grouped.c-valigned label {
  margin-top: 0.5em;
}

.select select[readonly], [readonly].input, [readonly].textarea, fieldset[readonly] .select select, .select fieldset[readonly] select, fieldset[readonly] .input, fieldset[readonly] .textarea {
  background-color: var(--bulma-input-disabled-background-color);
  border-color: var(--bulma-input-disabled-border-color);
  box-shadow: none;
  color: var(--bulma-input-disabled-color);
}

.control,
.input,
.textarea,
.select {
  /* --bulma-input-icon-hover-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l)); */
  --bulma-input-icon-focus-color: hsl(var(--bulma-input-focus-h), var(--bulma-input-focus-s), var(--bulma-input-focus-l));
}

/** Boutons */

.button.is-small {
  --bulma-button-weight: var(--bulma-weight-normal);
}

.button.is-danger,
.button.is-warning,
.button.is-secondary {
  color: white;
}

.button.is-secondary {
  --bulma-button-h: var(--c-sky-blue-h);
  --bulma-button-s: var(--c-sky-blue-s);
  --bulma-button-l: var(--c-sky-blue-l);
  --bulma-button-background-l: var(--c-sky-blue-l);
  --bulma-button-border-l: var(--c-sky-blue-l);
  --bulma-button-border-width: 0px;
  /* --bulma-button-color-l: var(--c-sky-blue-invert-l); */
  /* --bulma-button-outer-shadow-a: 0; */
}
.button.is-secondary:focus-visible, .button.is-secondary.is-focused {
  --bulma-button-border-width: 1px;
}
.button.is-secondary[disabled], fieldset[disabled] .button.is-secondary {
  background-color: var(--c-sky-blue-100);
  border-color: var(--c-sky-blue-100);
  box-shadow: none;
}

.button.c-small {
  /* font-weight: normal; */
  padding: 0.25em 0.5em;
}

/* Texte + boutons */
.field.is-align-items-center .label {
  margin: 0;
}

.field hr {
  margin-top: 0.5em;
  margin-bottom: 1em;
}


/** Etiquettes */

.tag.c-select {
  --bulma-tag-h: var(--c-light-violet-h);
  --bulma-tag-s: var(--c-light-violet-s);
  --bulma-tag-background-l: var(--c-light-violet-l);
  --bulma-tag-color-l: var(--bulma-black-invert-l);
}
.tag .delete {
  margin-left: 0.5em;
}
.tag.is-success,
.tag.is-info,
.tag.is-warning,
.tag.is-danger {
  color: white;
}
.tag.is-light {
  color: inherit;
}
.tag.c-info {
  background-color: var(--c-light-violet-20);
}


/** Notifications */

.c-notifications-container {
  max-width: 100%;
  padding: 1em;
  position: fixed;
  top: 0;
  right: 0;
  /* z-index: 100; */
}
.c-notifications-container .notification {
  margin-left: auto;
}

.notification {
  border-width: 1px;
  border-style: solid;
  border-color: hsl(var(--bulma-notification-h), var(--bulma-notification-s), var(--bulma-notification-color-l));
}

.notification.c-small {
  padding: 0.5em 1em;
  /* position: initial; ?? */
}
.notification.c-info-form {
  /* padding: 0.5em 1em; */
  background-color: var(--c-light-violet-20);;
  border: 1px solid var(--c-light-violet-100);
}
/* si small
  .notification.c-info-form .delete {
  top: 10px;
} */

.notification.is-info {
  border-color: hsl(var(--bulma-info-h), var(--bulma-info-s), var(--bulma-info-l));
}
.notification.is-success {
  border-color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
}
.notification.is-warning {
  border-color: hsl(var(--bulma-warning-h), var(--bulma-warning-s), var(--bulma-warning-l));
}
.notification.is-danger {
  border-color: hsl(var(--bulma-danger-h), var(--bulma-danger-s), var(--bulma-danger-l));
}


/** Tableaux */

.table tr.is-success.is-light {
  --bulma-table-cell-background-color: var(--bulma-success-95);
}
.table tr.is-info.is-light {
  --bulma-table-cell-background-color: var(--bulma-info-95);
}
.table tr.is-danger.is-light {
  --bulma-table-cell-background-color: var(--bulma-danger-95);
}

.table th.is-warning.is-light,
.table tr.is-warning.is-light,
.table td.is-warning.is-light {
  --bulma-table-cell-background-color: var(--bulma-warning-95);
}


/** Progressions */

.progress.is-secondary {
  --bulma-progress-value-background-color: var(--c-emerald-green-100);
}


/** Pagination **/

.pagination ul {
  margin: 0;
}
.content .pagination-list li {
  margin-top: 0;
}
.pagination-list a.is-disabled {
  cursor: inherit;
  pointer-events: none;
}
.c-pagination {
  position: relative;
}
.c-pagination-left {
  left: 0;
  position: absolute;
  top: 0;
}
.c-pagination-right {
  position: absolute;
  right: 0;
  top: 0;
}
.c-pagination-right label {
  font-weight: normal;
}
