/* Costanti del tema */
:root {
    /* Font del tema */
    --theme-font: 'Jost', sans-serif;
    /* Colori del tema */
    --theme-color-primary: #4461f2;
    --theme-color-primary-dark: #3b55d6;
    --theme-color-primary-light: #e8ebfc;
    --theme-color-secondary: #e8ebfc;
    --theme-color-secondary-dark: #d7dcfa;
    --theme-color-danger: #fcdce1;
    --theme-color-danger-dark: #fccdd5;
    --theme-color-success: #e9f9ef;
    --theme-color-success-dark: #93dcaf;
    --theme-color-light: #f8fafb;
    --theme-color-dark: #303d4b;
    --theme-color-link: #0E79B2;
    --theme-color-type: #303d4b;
    --theme-color-type-light: #414c58;
    /* Colori tipografici */
    --typo-primary: #686868;
    --color-test: #c0d8e7;
}

/* Scrollbar */
/*
select::-webkit-scrollbar {
    width: 8px;
    border-radius: 10px;
}
  
select::-webkit-scrollbar-track {
    background: #f1f1f1;
}

select::-webkit-scrollbar-thumb {
    background: #888;
}

select::-webkit-scrollbar-thumb:hover {
    background: #555;
}
*/

/* Colori */
.color-primary {
    color: var(--theme-color-primary);
}

/* Layout */
html {
    /* overflow-x: hidden; */
    overflow: hidden !important;
}

body {
    font-family: var(--theme-font);
    background-color: var(--theme-color-light);
    color: var(--theme-color-type);
}

/* Bootstrap */
.d-inline-flex {
    display: inline-flex;
}

/* Tipografia */
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5 {
    font-weight: 400;
}

h6 {
    font-weight: 600;
}

.text-small {
    font-size: 14px;
}

/* Link */
a {
    opacity: 0.75;
    transition: all 0.25s ease-in-out;
}

a:hover {
    opacity: 1;
}

a, a:hover, a:visited, a:active {
    color: var(--theme-color-primary);
    text-decoration: none;
}

.link {
    opacity: 0.75;
    transition: all 0.25s ease-in-out;
    cursor: pointer;
    color: var(--theme-color-primary);
}

.link:hover {
    opacity: 1;
}

.link.link-danger {
    color: #fd6939;
}

/* Table */
table thead th {
    padding: 20px 15px !important;
    color: var(--theme-color-type);
    font-weight: 700;
    border-bottom-color: #f5f5f8 !important;
}

table tbody td {
    padding: 20px 15px !important;
    color: var(--theme-color-type-light);
    border-bottom-color: #fafafa !important;
}

/* Badge */
.badge.bg-primary {
    border-radius: 6px;
    background-color: var(--theme-color-primary) !important;
}

/* Inizio Bootstrap */
/* Dropdown */
.dropdown-menu {
    border: none;
    box-shadow: 0 0 12px 2px rgb(62 57 107 / 13%);
}

.dropdown-menu .dropdown-item {
    font-size: 14px;
}

/* Card */
.card {
    border-radius: 6px;
    border: none;
}

.card-link {
    cursor: pointer;
}

.card-border {
    border-left: 5px solid #00c48f;
}

.card-header {
    border-bottom: none;
    background-color: transparent;
}

.card-footer {
    border-top: none;
    background-color: transparent;
}

.card.condensed {
    border-radius: 6px;
}

.card.card.condensed .card-body {
    padding: 8px 12px;
}

/* Separator */
.separator {
    width: 80%;
    border-bottom: 1px solid #f3f3f3 !important;
}

/* Dropdown */
.dropdown-item:active {
    color: #16181b;
    background-color: #d5d7da;
}

/* Spinner */
.spinner-border-primary {
    border-bottom-color: var(--theme-color-primary);
    border-left-color: var(--theme-color-primary);
    border-top-color: var(--theme-color-primary);
}

/* Modal */
.modal .modal-content {
    border-radius: 15px;
    border: none;
}

/* Alert */
.alert {
    border-radius: 15px;
    font-size: 14px;
}

/* Font */
.font-weight-bold {
    font-weight: 500 !important;
}
/* Fine Bootstrap */

/* Text colors */
.text-primary {
    color: var(--theme-color-primary) !important;
}

.text-secondary {
    color: var(--theme-color-secondary) !important;
}

/* Details */
.detail label.key,
.detail span.key,
.detail label.value,
.detail span.value {
  display: block;
  margin-bottom: 0;
}

.detail label.key,
.detail span.key {
  font-size: 14px;
  color: #b3b3b3;
}

.detail label.value,
.detail span.value {
    font-weight: 500;
}

/* Delay (Animazioni) */
.delay-100 {
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
}

.delay-200 {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.delay-300 {
    -webkit-animation-delay: 0.3s;
    animation-delay: 0.3s;
}

.delay-400 {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

.delay-500 {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

.delay-600 {
    -webkit-animation-delay: 0.6s;
    animation-delay: 0.6s;
}