:root {
    --primary: rgb(255, 192, 55);
    --primary-dark: rgb(194, 148, 46);
    --secondary: rgb(51, 51, 51);
    --grey: rgb(70, 70, 70);
    --dark: #212529;
    --light-grey: #f8f8f8;
}

.debug-area {
    font-family: monospace;
    background-color: white;
    padding: 30px;
    border: 3px dashed red;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
     opacity: .5!important; /* Firefox */
 }

/*
    TOOLTIPS
 */
.info-tooltip {
    border: none;
    border-radius: 100%;

    width: 30px;
    height: 30px;

    background-color: var(--primary);
    font-weight: bold;
}

.info-tooltip:hover {
    background-color: var(--primary-dark);
}

/*
    SPECIAL TEXT
 */
.text-help {
    color: var(--grey);
    font-size: 8pt;
}

.text-validation-error {
    color: var(--red);
    font-size: 10pt;

    margin-bottom: 6px;
}

/*
    PANELS
 */
.panel-centred-wrapper {
    position: relative;

    min-width: 100vw;
    min-height: 90vh;
}

.panel-centred-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.panel-transparent {
    margin: 30px auto;

    /*padding: 30px;
    border-radius: 30px;*/
}

.panel-transparent .panel-heading {
    color: var(--secondary);

    margin-bottom: 30px;
}

.panel-light-grey {
    background-color: var(--light-grey);

    margin: 30px auto;

    padding: 30px;
    border-radius: 10px;

    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

.panel-light-grey .panel-heading {
    color: var(--secondary);

    margin-bottom: 30px;
}

/*
    BUTTONS
 */
.btn-rounded {
    border-radius: 30px;
}

.btn-hover:hover {
    filter: brightness(0.9);
}

.btn-icon {
    position: relative;
}

.btn-icon-lg {
    width: 48px;
    height: 48px;
}

.btn-icon-md {
    width: 38px;
    height: 38px;
}

.btn-icon-sm {
    width: 30px;
    height: 30px;
}

.btn-icon-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.btn-white {
    background-color: white;
    border: solid 1px var(--grey);

    border-radius: 30px;

    color: var(--secondary);
}

.btn-outline-white {
    background-color: rgba(255, 255, 255, 0.22);
    border: solid 1px white;

    border-radius: 0;

    color: white;
}

.btn-outline-white:hover {
    background-color: white;
    color: var(--secondary);
}

.btn-yellow {
    background-color: var(--primary);
    border: solid 1px var(--primary-dark);

    border-radius: 30px;

    color: var(--secondary);
}

/*
    FULLSCREEN
 */
.fullscreen-message {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/*
    SPECIAL ELEMENTS
 */
.empty-message-container {
    text-align: center;
    padding: 20px;
}

.empty-message-header {
    color: #b7b7b7;
    margin-bottom: 2px;
}

.empty-message-body {
    color: #b7b7b7;
    font-size: 14pt;
}

/*
    INPUTS
 */
.input-group-bg-readonly {
    background-color: #e3e6ec !important;
}


/*
    CARDS
 */
.card-rounded {
    border-radius: 30px;
    padding: 3px;
}

.card-shadow {
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.35);
}

/*
    TABLES
 */
.min-90 {
    min-width: 90px !important;
}