/* *******************************************************
                         Global
******************************************************* */
:root {

}
@media screen and (min-width: 601px) {
    body {
        font-size: 0.8rem !important;
    }
    div.content-base{
        margin-left: 50px;
        margin-right: 50px;
    }
    .shortfield{
        width: 40em !important;
    }
}

@media screen and (max-width: 600px) {
    body {
        font-size: 0.9rem !important;
    }

    .logostrain{
        display: none;
    }
    .shortfield{
        width: 20em !important;
    }
}



div.content-small-table{
    /*margin-left: 20rem;
    margin-right: 20rem;*/
}

.title_my_plants{
    color: var(--label-color);
}
/* *******************************************************
                         Nav
******************************************************* */
.btn-secondary {
    /*background-color: var(--default-color) !important;*/
    background: var(--default-background-linear-default);
    border: 1px solid var(--default-color) !important;
}

.germ {
    color: blue;
}

.crois {
    color: green;
}

.preflo {
    color: orange;
}

.flo {
    color: red;
}

.rec {
    color: darkred;
}

h1 {
    font-size: 1.2rem !important;
}

label {
    color: var(--label-color);
}

/* *******************************************************
                          Datatables
******************************************************* */
table.datatables {
    table-layout: auto;
    /*width: fit-content;*/

    thead {
        color: white;
        background-color: var(--head-background-color);
    }

    tbody tr td {
        color: var(--default-color);
    }

    td, tr, th {
        background: transparent !important;
        height: 40px;
        vertical-align: middle;
    }
}

.button_action {
    color: var(--action-color);
    font-size: 1.2rem;
    cursor: pointer;
}

div.dt-container .dt-info {
    color: var(--action-color) !important;
}
table.dataTable thead>tr>th.dt-ordering-asc span.dt-column-order:before,
table.dataTable thead>tr>th.dt-ordering-desc span.dt-column-order:after{
    opacity: 1;
}
span.dt-content-name{
    font-style: italic;
    font-size: 0.9rem;
}
.changestate{
    color: var(--label-color) !important;
}
/* *******************************************************
                          forms
******************************************************* */
.form-control:focus {
    border-color: var(--default-color) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgb(102, 153, 73) !important;
}

.form-check-input:checked {
    background-color: var(--default-color) !important;
    border-color: var(--default-color) !important;
}

input, textarea {
    background: transparent !important;
}

.focus .ts-control {
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgb(102, 153, 73) !important;
}

.btn-success {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--default-color) !important;
    --bs-btn-border-color: var(--default-color) !important;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #157347;
    --bs-btn-hover-border-color: #146c43;
    --bs-btn-focus-shadow-rgb: 60, 153, 110;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #146c43;
    --bs-btn-active-border-color: #13653f;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--default-color) !important;
    --bs-btn-disabled-border-color: var(--default-color) !important;
}

::placeholder {
    color: var(--default-color) !important;
}

.required::after {
    content: ' *';
    color: red;
}

span.changestate{
    color: var(--label-color);
    font-size: 1rem;
}
input.textform{
    width: 100%;
}
/* *******************************************************
                          dashboard
******************************************************* */

.carddashboard {
    min-width: 15rem;
}

.dashboard-body-content {
    color: var(--default-color);
    font-size: var(--font-size-buttons);
}

.card.headercarddashboardgermination{
    border: var(--bs-card-border-width) solid var(--germination-color)
}

.card.headercarddashboardgrowth{
    border: var(--bs-card-border-width) solid var(--growth-color)
}

.card.headercarddashboardprebloom{
    border: var(--bs-card-border-width) solid var(--prebloom-color)
}

.card.headercarddashboardbloom{
    border: var(--bs-card-border-width) solid var(--bloom-color)
}

.card.headercarddashboardharvest{
    border: var(--bs-card-border-width) solid var(--harvest-color)
}

.card-header.headercarddashboarddefault {
    background: var(--default-background-linear-default);
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.card-header.headercarddashboardgermination {
    /*background-color: var(--germination-color);*/
    background: var(--default-background-linear-germination);
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.card-header.headercarddashboardgrowth {
    background: var(--default-background-linear-growth);
    /*background-color: var(--growth-color);*/
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.card-header.headercarddashboardprebloom {
    background: var(--default-background-linear-prebloom);
    /*background-color: var(--prebloom-color);*/
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.card-header.headercarddashboardbloom {
    background: var(--default-background-linear-bloom);
    /*background-color: var(--bloom-color);*/
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.card-header.headercarddashboardharvest {
    background: var(--default-background-linear-harvest);
    /*background-color: var(--harvest-color);*/
    color: var(--label-color);
    padding: 15px;
    font-size: 1.25rem;
}

.btn-close {
    width: 2rem;
}

/* *******************************************************
                          modals
******************************************************* */
.modal-header {
    background-color: var(--default-color);
    color: var(--label-color);
}
.modal-body-info{
    padding: 5px;
    color: var(--label-color);
}

.labelbreedermodal{
    vertical-align: middle;
    min-height: inherit;
}
.info-text{
    color: var(--default-color);
}
.info-inline{
    display: inline-block;
}
.info-text-title{
    font-size: 1rem;
}
/* *******************************************************
                          images
******************************************************* */

img.logo{
    max-width: 50px;
    min-height: 30px;
}

/* *******************************************************
                          cards
******************************************************* */
.card-diary{
    width: 5rem;
    padding: 0px !important;
}

hr.info {
    border: 1px solid var(--default-color);
}

div.content-info{
    display: flex;
}