/* fichier utile pour custom/templates/bazar/fiche-9.twig */
/**
 * SPDX-License-Identifier: AGPL-3.0-or-later
 * Author: FabLim 2023 - https://fablim.org/
 * Author: Jeremy Dufraisse 2023 - https://github.com/J9rem
 */

.custom-entry-title {
    width: 100%;
    background-color: var(--primary-color);
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: var(--neutral-color);
    margin-bottom: 1em;
}

.custom-entry-title h1,
.custom-entry-title .subtitle {
    margin-top:0;
    margin-bottom:0;
    color: var(--neutral-light-color);
    text-align: center;
}
.custom-entry-title h1 {
    font-size: 1.8em;
    padding: 0.5em;
}
.custom-entry-title .subtitle{
    font-size: 1.1em;
    padding: 0.2em;
    font-style: italic;
    font-weight: bold;
}

.buttons-header {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    gap: 0.8em 2em;
    padding-left: 1em;
    padding-right: 1em;
}

.buttons-header .btn{
    border-radius: 3em;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-basis: 250px; 
    flex-grow: 1;
    white-space: break-spaces;
    word-break: break-word;
}

.description-for-ressource a[data-id=bf_image].left,
.description-for-ressource a[data-id=bf_image] {
    float: right;
}

.website-link {
    width: 100%;
    display:flex;
    justify-content: center;
    align-items: center;
    margin: 1.2em;
    font-size: 1.1em;
}
.website-link a:not(.btn-secondary-1) > i.fas {
  color: var(--secondary-color-1);
}

.description-for-ressource {
    border-color: var(--neutral-color);
    border-radius: 1em;
    border-style: solid;
    border-width: 0.2em;
    padding: 1em;
    position: relative;
    margin-top: 8px;
    margin-bottom: 8px;
}

.description-for-ressource.collapse[aria-expanded="false"] {
    max-height: 300px;
    overflow: hidden;
    display: block;
}
.description-for-ressource.collapse.show[aria-expanded="false"] {
    height: 300px !important;
}

.description-for-ressource .read-more {
    position: absolute;
    text-align: right;
    right:1em;
    font-size: 1.1em;
    font-weight: bold;
    margin: 0.2em;
    text-decoration: none;
    color: var(--neutral-color);
}
.description-for-ressource.collapse .read-more.collapsed {
    top: 260px;
}
.description-for-ressource.collapse .read-more.collapsed > .content-more {
    display: initial;
}
.description-for-ressource.collapse .read-more.collapsed > .content-less {
    display: none;
}
.description-for-ressource.collapse .read-more:not(.collapsed) {
    bottom: 1em;
}
.description-for-ressource.collapse .read-more:not(.collapsed )> .content-more {
    display: none;
}
.description-for-ressource.collapse .read-more:not(.collapsed )> .content-less {
    display: initial;
}

.only-for-print {
    display: none;
}
@media print {
    .only-for-print {
        display: initial;
    }
    .description-for-ressource,
    .description-for-ressource.collapse[aria-expanded="false"]    {
        max-height: initial;
    }
    /* TODO manage page-break */
    .description-for-ressource .read-more {
        display: none;
    }
    .buttons-header {
       gap: 0.8em 1.0em;
    }
    .buttons-header .btn{
       flex-basis: 25%; 
    }
}

/* fixes for panels */

.bazar-list .panel:not(.collapsed) .panel {
  border-color: inherit;
  border-radius: inherit;
  /* margin-top: inherit !important; */
  padding: inherit;
}

.bazar-list .panel:not(.collapsed) .panel .panel-heading {
  border: inherit !important;
}

.bazar-list .panel .panel:not(.collapsed) .panel-collapse .panel-body {
  padding: 15px;
}

.bazar-list .panel:not(.collapsed) .panel {
  border-width: 3px;
  border-radius: 5px;
}
.bazar-list .panel:not(.collapsed) .panel-heading {
  border-radius: 0;
  padding: .6rem 1rem;
}
.bazar-list .panel:not(.collapsed) .panel-default {
  border-color: var(--neutral-color);
  --checkbox-color: var(--neutral-color);
}
.bazar-list .panel:not(.collapsed) .panel-default:not(.note-editor) > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--neutral-color);
  border-color: var(--neutral-color);
}
.bazar-list .panel:not(.collapsed) .panel-title > .alert-msg {
  margin-right: 2rem;
  font-size: .9rem;
  margin-top: 1px;
}
.bazar-list .panel:not(.collapsed) .panel-primary {
  border-color: var(--primary-color);
  --checkbox-color: var(--primary-color);
}
}
.bazar-list .panel:not(.collapsed) .panel-primary > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
.bazar-list .panel:not(.collapsed) .panel-secondary-1{
  border-color: var(--secondary-color-1);
  --checkbox-color: var(--secondary-color-1);
}
.bazar-list .panel:not(.collapsed) .panel-secondary-1 > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--secondary-color-1);
  border-color: var(--secondary-color-1);
}
.bazar-list .panel:not(.collapsed) .panel-secondary-2 {
  border-color: var(--secondary-color-2);
  --checkbox-color: var(--secondary-color-2);
}
.bazar-list .panel:not(.collapsed) .panel-secondary-2 > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--secondary-color-2);
  border-color: var(--secondary-color-2);
}
.bazar-list .panel:not(.collapsed) .panel-info {
  border-color: var(--primary-color);
  --checkbox-color: var(--primary-color);
}
.bazar-list .panel:not(.collapsed) .panel-info > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--primary-color);
  opacity: .6;
  border-color: var(--primary-color);
}
.bazar-list .panel:not(.collapsed) .panel-warning {
  border-color: var(--warning-color);
  --checkbox-color: var(--warning-color);
}
.bazar-list .panel:not(.collapsed) .panel-warning > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--warning-color);
  border-color: var(--warning-color);
}
.bazar-list .panel:not(.collapsed) .panel-success {
  border-color: var(--success-color);
  --checkbox-color: var(--success-color);
}
.bazar-list .panel:not(.collapsed) .panel-success > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--success-color);
  border-color: var(--success-color);
}
.bazar-list .panel:not(.collapsed) .panel-danger {
  border-color: var(--danger-color);
  --checkbox-color: var(--danger-color);
}
.bazar-list .panel:not(.collapsed) .panel-danger > .panel-heading {
  color: var(--neutral-light-color);
  background-color: var(--danger-color);
  border-color: var(--danger-color);
}

.bazar-list .panel:not(.collapsed) .panel-heading[data-toggle=collapse] {
  --chevron-color: var(--neutral-light-color);
  position: relative;
}
.bazar-list .panel:not(.collapsed) .panel-heading[data-toggle=collapse]:after {
  content: "";
  position: absolute;
  top: 1.3em;
  right: 1em;
  border-radius: 3px;
  opacity: .8;
  width: .7rem;
  height: .7rem;
  border-top: .17rem solid var(--chevron-color);
  border-left: .17rem solid var(--chevron-color);
  border-right: .17rem solid transparent;
  border-bottom: .17rem solid transparent;
  -webkit-transform: rotate(35deg);
  transform: rotate(45deg);
}
.bazar-list .panel:not(.collapsed) .panel-heading.collapsed[data-toggle=collapse]:after {
  top: .9em;
  border-top: .17rem solid transparent;
  border-left: .17rem solid transparent;
  border-right: .17rem solid var(--chevron-color);
  border-bottom: .17rem solid var(--chevron-color);
}
.bazar-list .panel:not(.collapsed) .panel-heading[data-toggle=collapse]:hover:after {
  opacity: 1;
}
.bazar-list .panel:not(.collapsed) .panel-heading .panel-title {
  font-size: var(--main-text-fontsize);
  color: inherit;
  line-height: inherit;
  margin-bottom: inherit;
}

.bazar-list .panel .panel .BAZ_label {
  color: var(--primary-color);
  margin: 5px 0;
  font-size: 1.2rem;
  font-weight: 600 !important;
}