html, body {
min-height: 100%;
margin: 0; }

:root::after {
display: none;
}

body {
background-color: #f0f0f0;
font-size: 0.9em;
font-family: 'Inter', sans-serif; }

body.background {
background-image: url('../img/bg2.jpg');
background-position: center 100%;
background-attachment: fixed;
background-size: cover; }

#top_button {
width: 44px;
height: 44px;
z-index: 1030; }

/* login page */
#login_layer {
min-height: 100dvh;
display: flex;
align-items: center;
justify-content: center;
padding: 15px; }

#login {
width: 100%;
max-width: 520px; }

/* faq */
.accordion-button:not(.collapsed) {
background-color: var(--bs-primary);
color: #fff; }

.accordion-button:not(.collapsed)::after {
filter: brightness(0) invert(1); }

/* table */
.table-striped tbody tr:last-child td,
.table-striped tbody tr:last-child th {
border-bottom: 0; }

.table thead th {
color: white;
padding-left: 1rem;
padding-right: 1rem;
white-space: nowrap;
text-overflow: ellipsis;
background-color: var(--bs-primary); }

.table thead th a {
text-decoration: none;
color: white; }

.table tbody td {
padding-left: 1rem;
padding-right: 1rem; }

/* form */
.form-required {
font-weight: bold; }


/* common */
.action-cell {
--action-size: 2.75rem;
gap: 5px; }

.btn {
text-transform: uppercase; }

.action-cell .btn {
width: var(--action-size);
height: var(--action-size);
line-height: var(--action-size);
padding: 0px;
flex: 0 0 var(--action-size); }

.action-icon {
font-size: 1.5rem; }

.max-w-33 {
max-width: 33%; }

.sum td {
background-color: #FFC107; }

.info {
cursor:pointer; }

.help i {
color: white;
padding: 6px;
border-radius: 4px;
margin: 2px;
background-color: #0D6EFD; }


/* responsivity */
@media (min-width: 768px) {
    .action-cell {
        --action-size: 2rem;
        gap: 4px;
    }

    .action-icon {
        font-size: 1rem;
    }
}

@media (min-width: 992px) {
    :root::after {
        display: block;
        font-family: Inter;
        opacity: 0.6;
        white-space: nowrap;
        transform: rotate(90deg);
        transform-origin: top left;
        color: #000;
        position: fixed;
        top: 150px;
        left: 60px;
        z-index: -1;
        font-weight: bold;
        font-size: 3em;
        padding: 0;
        line-height: 1em;
    }
}
