@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

:root {
    --nav-height: 64px;
    --sidebar-width: 250px;
    --body-font: 'Inter', sans-serif;
    --number-font: 'Roboto', sans-serif;
    --font-color: #020205;
    --normal-font-size: 1rem;
    --z-fixed: 100;
    --scrollbar-width: 10px;
    --bs-body-bg: #f6f6f9;
    --scrollbar-thumb-bg-color: #eff3f7;
    --scrollbar-thumb-bg-hover: #dde4ea;
    --logo_sidebar: url('../img/logo_sbragi_scuro.png');
    --card-bg: #fff;
    --color-primary: var(--bs-primary, #0d6efd);
    --color-accent: #0791d3;
    --color-underline-accent: #0791d3;
}

html[data-bs-theme='dark'] {
    --bs-body-bg: #0B0B15;
    --font-color: #e9e9ea;
    --scrollbar-thumb-bg-color: #171a1d;
    --scrollbar-thumb-bg-hover: #3c3e4d;
    --logo_sidebar: url('../img/logo_sbragi.png');
    --card-bg: #151527;
    --bs-border-color: #1c1c36;
    --form-border-color: #26264b;
    --bs-table-border-color: #1c1c36;
    --bs-border-color-translucent: #1c1c36;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: var(--scrollbar-width);
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb-bg-color);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-bg-hover)
}

/* Dati generali */
body {
    font-family: var(--body-font);
    font-size: var(--normal-font-size);
    color: var(--font-color);
}

.text-numeric {
    font-family: var(--number-font);
}

.page-wrapper {
    width: 100%;
}

/* Card */
.card {
    background-color: var(--card-bg);
}

/* Modal */
.modal-content{
    background-color: var(--card-bg);
}

/* Forms */
.form-control {
    background-color: var(--bs-body-bg);
}

/* Segna con un asterisco le label dei campi obbligatori */
.form-label:has(+ input[required])::after,
.form-label:has(+ select[required])::after,
.form-label:has(+ textarea[required])::after {
    content: " *";
    color: var(--bs-danger, #dc3545);
}

html[data-bs-theme='dark'] .form-control {
    border-color: var(--form-border-color);
}

.form-control[readonly] {
    cursor: default;
}

.form-control[readonly]:focus {
    box-shadow: none;
    border-color: var(--bs-border-color);
}

/* Table */
.table>:not(caption)>*>* {
    background-color: transparent;
}

/* Altro */
.color-accent {
    color: var(--color-accent);
}

.underline-accent {
    position: relative;
}

.underline-accent::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 70%;
    border-bottom: 1px solid var(--color-underline-accent);
}

/* Stato badge (usato sia in layout classico che moderno) */
.stato-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.8rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.stato-badge .dot {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    flex-shrink: 0;
}

.stato-accettata { background: color-mix(in srgb, #6c757d 18%, transparent); color: #6c757d; }
.stato-accettata .dot { background: #6c757d; }

.stato-in_produzione { background: color-mix(in srgb, #f0ad4e 18%, transparent); color: #b8770d; }
.stato-in_produzione .dot { background: #f0ad4e; }

.stato-in_posa { background: color-mix(in srgb, var(--color-accent) 18%, transparent); color: var(--color-accent); }
.stato-in_posa .dot { background: var(--color-accent); }

.stato-completata { background: color-mix(in srgb, #28a745 18%, transparent); color: #1e9040; }
.stato-completata .dot { background: #28a745; }

/* SELECT2 */
.select2-container--default .select2-selection--single {
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}

.select2-dropdown {
    background-color: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: none;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--font-color)
}

.select2-selection__rendered {
    line-height: 30px !important;
}
.select2-container .select2-selection--single, .select2-container .select2-selection--multiple     {
    height: 38px !important;
}

.select2-selection__arrow {
    height: 37px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.5;
    padding: 0.25rem 0.8rem;
}

html[data-bs-theme='dark'] .select2-container--default .select2-results__option--selected {
    background-color: #202020;
}

/* flatpickr */
.flatpickr-calendar {
    background: var(--card-bg);
}

.flatpickr-day, .flatpickr-time input {
    color: var(--font-color);
}

.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay {
    color: var(--font-color-muted);
}

.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus {
    background: var(--datepicker-focus);
    border-color: var(--datepicker-focus)
}

.flatpickr-day.today {
    background: var(--date-picker-today);
    border-color: var(--date-picker-today);
    color: var(--font-color);
}

.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus {
    background: var(--datepicker-focus);
}

span.flatpickr-weekday, .flatpickr-current-month .flatpickr-monthDropdown-months, .flatpickr-current-month input.cur-year,
.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm {
    color: var(--font-color);
}

.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month {
    fill: var(--font-color)
}

.text-sm {
    font-size: 0.9rem;
}

.row-riordinare {
    background-color: rgba(220, 53, 69, 0.15) !important;
}

.row-disponibile {
    background-color: rgba(40, 167, 69, 0.12) !important;
}

.text-xs {
    font-size: 0.75rem;
}