/*
 * file: statics.css.whakerkit.css
 * author: Brigitte Bigi
 * Copyright 2024-2025 Brigitte Bigi, CNRS
 *
 * Override definition of Whakerexa and create new ones allowing a
 * customized style for the website.
 * See: https://whakerexa.sourceforge.io for details
 *
 */

/* ---------------- Set existing variables to custom values --------------- */

:root {
    --switch-width: calc(var(--font-size) * 4);
    --switch-height: calc(var(--font-size) * 1.8);
    /*--switch-slider-off-color: var(--a-color);
    --switch-slider-on-color: var(--a-color);*/
    --switch-slider-unselected-opacity: 10%;
}

/* -------------------- Override wexa body definitions ------------------- */

/* text inside a button, embedded into a span element */
button > span {
    color: var(--buttons-fg-color) !important;
}

/* ---------------------- Override wexa table definitions ---------------- */

table[role=presentation] td * {
    vertical-align: middle;
    margin-top: 0;
    margin-bottom: 0;
}

td > a[role=button] {
    border: var(--border-width) solid var(--buttons-fg-color);
    padding: 0.2rem;
    /*height: 1.5rem;*/
    margin-right: 0.5rem;
}

.btn_download {
    border: var(--border-width) solid var(--buttons-fg-color);
    height: 2rem;
}

td > a[role=button] {
    border: var(--border-width) solid var(--a-color);
}

.btn_download {
    align-items: center;
    overflow: hidden;
    justify-content: center;
    position: relative;
}

.btn_download > img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    max-width: 1.5rem;
    max-height: 100%;
    padding: 0;
    margin: 0;
}

.btn_download > * {
    white-space: nowrap;
}

span[name="download-count"] {
    color: var(--fg-color-alt) !important;
    display: inline;
    margin: 0;
    padding: 0;
}


#documents_table {
    table-layout: auto;
    max-width: 100%;
    width: 100%;
}

#documents_table > * > td {
    overflow: hidden;
    word-wrap: break-word;
    text-overflow: ellipsis;
    white-space: normal;
}

#documents_table th,
#documents_table td {
    min-width: 10%;
    max-width: 50%;
}

#actions_th,
#documents_table td:last-child {
    min-width: 14rem;
    width: 14rem;
    max-width: 14rem;
}

.contrast #actions_th,
.contrast #documents_table td:last-child {
    min-width: 18rem;
    width: 18rem;
    max-width: 18rem;
}

/* ------------------- Override layout cards look ---------------- */

.cards-panel {
    grid-column-gap: 0.1rem;
}

.card > main > span {
    padding-bottom: 0.5rem;
    margin: 0;
    color: var(--fg-color-alt);
}

.card > footer > *[role="button"] {
    width: 50%;
    min-height: 2rem;
    color: var(--a-color);
}

/* ------------ filters -------------- */
/* has side effects on buttons
details {
    background: var(--bg-color-alt);
}

details *:not(.action-button):not(.action-button *) {
    background: var(--bg-color-alt);
}*/
summary {
    background-color: var(--bg-color);
}

#filters_details {
    margin-bottom: 3rem;
}

#author_details,
#filetype_details,
#toggable_details {
    display: inline-block;
    width: 20rem;
    vertical-align: top;
}

#author_details,
#filetype_details {
    width: 48%;
    margin-left: 1rem;
}

#author_details:not([open]),
#filetype_details:not([open]),
#toggable_details:not([open]) {
    height: 2.2rem;
}

.summary-choice span {
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: "…";
}

.check-item:before  {
    content: "";
}

/* -------------------- other elements styling ------------------- */

/* wexa.css does not assign a specific design to submit buttons */
*[type="submit"] {
    padding: 0.5rem;
    margin: auto;
    margin-bottom: 1rem;
    width: 100%;
    max-width: 20rem;
    font-weight: var(--font-weight-semibold);
}

/* -------------- Search ----------- */

section.search {
    width: 80%;
    margin: auto;
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.search * {
    padding: 0.5rem;
    height: 4rem;
    max-height: 6rem;
    vertical-align: center;
    align-content: center;
}

.search button,
.search a[role=button] {
    border: none;
    background-color: transparent;
    padding: 0;
    margin: auto;
}

.search button img,
.search a[role=button] img {
    text-align: center;
    vertical-align: center;
    padding: 0;
    margin: 0;
}

/*.search input[name=search] {
    background-color: var(--bg-color-alt);
    color: var(--fg-color-alt);
    border-radius: 8rem;
    border-color: var(--border-color-alt);
    border-width: calc(4*(var(--border-width)));
    min-width: 50%;
    font-size: 1.2rem;
    margin: 0;}*/
.search input[name=search] {
    text-align: left;
}

/* ----------------------------------------------------------------------- */
/*                         For the documents page                          */
/* ----------------------------------------------------------------------- */

/* Details in an aside element */

.doc-aside {
    width: calc(var(--font-size) * 25);
    position: fixed;
    left: -24rem;  /* a big enough negative value allows to hide it */
    top: 0;
    height: 100%;
    box-shadow: -0.3rem 0 0.5rem rgb(1 1 1 / 65%);
    z-index: 1000;
    padding-left: 1rem;
    transition: left 0.5s ease-in-out;
    -webkit-transition: left 0.5s ease-in-out; /* WebKit for Safari */
    will-change: left;
}

.doc-aside.open {
    left: 0;
}

/* Individual elements */

#file_input {
    height: 2rem;
    width: 95%;
    text-align: left;
}

#delete_button {
     margin-left: 1rem;
}