﻿@import "../../../Styles/functions.scss";

.bit-acd {
    width: 100%;
    display: flex;
    font-weight: 400;
    color: $clr-fg-pri;
    box-sizing: border-box;
    font-size: spacing(1.75);
    flex-flow: column nowrap;
    font-family: $tg-font-family;
    background-color: $clr-bg-pri;
    border-radius: $shp-border-radius;
    border: $shp-border-width $shp-border-style $clr-brd-pri;

    &.bit-dis {
        color: $clr-fg-dis;
        background-color: $clr-bg-dis;

        .bit-acd-ttl,
        .bit-acd-des {
            color: $clr-fg-dis;
        }
    }
}

.bit-acd-nbd {
    border: none;
    background-color: $clr-bg-sec;

    .bit-acd-cnt {
        background-color: $clr-bg-sec;
    }
}

.bit-acd-hdr {
    display: flex;
    cursor: pointer;
    text-align: start;
    color: $clr-fg-pri;
    align-items: center;
    padding: spacing(1.5);
    background-color: transparent;
}

.bit-acd-hic {
    display: flex;
    align-items: center;
    margin: 0 spacing(0.625);
    transform: rotate(90deg);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.bit-acd-wrp {
    flex-grow: 1;
    display: flex;
    gap: spacing(1);
    flex-wrap: wrap;
    line-height: 1.5;
    align-items: center;
}

.bit-acd-ttl {
    font-weight: 600;
    font-size: spacing(2);
}

.bit-acd-des {
    flex-grow: 1;
    color: $clr-fg-sec;
}

.bit-acd-hex {
    transform: rotate(-90deg);
}

.bit-acd-con {
    height: auto;
    overflow: hidden;
    padding: 0 spacing(1.5);
    transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
}

.bit-acd-cco {
    opacity: 0;
    max-height: 0;
    margin: spacing(-1.5) 0;
}

.bit-acd-cex {
    opacity: 1;
    height: auto;
    margin: spacing(1.5) 0;
}
