html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* ------------------------------------------------------------------------- */
/* White-label: il colore primario è guidato da --brand-primary, definita    */
/* in _Layout.cshtml a partire da Branding:PrimaryColor in appsettings.json. */
/* ------------------------------------------------------------------------- */

.btn-primary {
  background-color: var(--brand-primary);
  border-color:     var(--brand-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background-color: var(--brand-primary);
  border-color:     var(--brand-primary);
  filter: brightness(0.92);
}

.btn-outline-primary {
  color:        var(--brand-primary);
  border-color: var(--brand-primary);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  background-color: var(--brand-primary);
  border-color:     var(--brand-primary);
  color:            #fff;
}

.text-primary,
a.text-primary { color: var(--brand-primary) !important; }

a, a:hover { color: var(--brand-primary); }

.nav-link.active,
.nav-tabs .nav-link.active {
  color:        var(--brand-primary);
  border-color: var(--brand-primary) var(--brand-primary) transparent;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--brand-primary);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--brand-primary) 25%, transparent);
}

.badge.bg-primary { background-color: var(--brand-primary) !important; }

/* =========================================================================
   OPZIONE A — "Arte & Aste": tipografia elegante, card raffinate
   ========================================================================= */

/* Sfondo caldo — distingue l'app dallo sfondo bianco puro */
body { background-color: #f7f5f2; }

/* Navbar: ombra sottile + brand serif */
.navbar { box-shadow: 0 1px 6px rgba(0,0,0,.07); }
.navbar-brand span {
    font-family: Georgia, 'Times New Roman', serif;
    letter-spacing: .03em;
    font-weight: normal;
}

/* Titoli di pagina con classe .page-title */
.page-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: normal;
    letter-spacing: .01em;
}

/* ---- Index: card desiderata ---- */
.desiderata-card {
    border: 1px solid #e8e3db !important;
    border-left: 4px solid var(--brand-primary) !important;
    border-radius: 6px;
    background: #fff;
    transition: box-shadow .18s, transform .18s;
}
.desiderata-card:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,.09) !important;
    transform: translateY(-2px);
}
.desiderata-card .card-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: normal;
    font-size: 1.30rem;
}
desiderata-card .badge {
    font-size: 0.80rem;
}
.filtri-count-badge {
    font-size: .72rem;
    font-weight: 500;
    background: color-mix(in srgb, var(--brand-primary) 11%, transparent);
    color: var(--brand-primary);
    border: 1px solid color-mix(in srgb, var(--brand-primary) 25%, transparent);
    border-radius: 20px;
    padding: .15rem .5rem;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
}

/* ---- Form filtri: intestazione sezione con linea decorativa ---- */
.filtri-section-header {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1.25rem;
    margin-top: .25rem;
}
.filtri-section-header::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(to right, #d8d0c5, transparent);
}
.filtri-section-header span {
    font-size: .68rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #8a8278;
    white-space: nowrap;
}

/* ---- Card form Create/Edit con header colorato ---- */
.form-card {
    border: 1px solid #e8e3db !important;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.form-card-header {
    border-bottom: 1px solid #ede8e0;
    padding: 1rem 1.5rem;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--brand-primary) 5%, #fff) 0%,
        #fff 100%);
    border-radius: 8px 8px 0 0;
}
.form-card-header .form-card-title {
    font-family: Georgia, 'Times New Roman', serif;
    font-weight: normal;
    font-size: 1.1rem;
    margin: 0;
    color: var(--brand-primary);
}
.form-card-body { padding: 1.5rem; }

/* ---- Risultati: tabella lotti ---- */
.table-aste { border-collapse: separate; border-spacing: 0; }
.table-aste thead th {
    font-size: .72rem;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: #8a8278;
    border-bottom: 2px solid #e8e3db !important;
    background: transparent !important;
    padding-top: .75rem;
    padding-bottom: .75rem;
}
.table-aste tbody tr { transition: background .12s; }
.table-aste tbody tr:hover td { background: #fdf8f1 !important; }
.table-aste tbody td {
    vertical-align: middle;
    border-color: #f0ece6 !important;
}
.img-lotto {
    border-radius: 6px;
    box-shadow: 0 2px 8px rgba(0,0,0,.10);
    transition: box-shadow .18s, transform .18s;
    display: block;
    object-fit: cover;
    background: #f0ece6;
}
.img-lotto:hover {
    box-shadow: 0 5px 16px rgba(0,0,0,.18);
    transform: scale(1.04);
}

/* ---- Tabs risultati ---- */
.nav-tabs .nav-link {
    color: #6c757d;
    font-size: .88rem;
    letter-spacing: .02em;
}

/* -------------------------------------------------------------------------
   Filter blocks — highlight quando un filtro è impostato
   ------------------------------------------------------------------------- */
.filter-block {
    border-left: 3px solid transparent;
    border-radius: 6px;
    padding: .5rem .75rem .5rem .65rem;
    transition: background .18s, border-color .18s;
}
.filter-block--active {
    background: color-mix(in srgb, var(--brand-primary) 7%, transparent);
    border-left-color: var(--brand-primary);
}
.filter-block--active > .form-label {
    color: var(--brand-primary);
    font-weight: 600;
}
/* Badge ✓ dentro la label: nascosto di default, visibile quando il block è attivo */
.filter-block .filter-check {
    display: none;
    font-size: .75rem;
    margin-left: .3rem;
    color: var(--brand-primary);
}
.filter-block--active .filter-check {
    display: inline;
}

/* -------------------------------------------------------------------------
   Picker tree — modalità hierarchical (SOGGETTO, 2 livelli)
   Usato da picker.js quando il bottone ha data-picker-hierarchical="true".
   ------------------------------------------------------------------------- */
.picker-tree {
    border: 1px solid var(--bs-border-color);
    border-radius: 6px;
    overflow: hidden;
}

/* Hint testuale in cima alla modale (spiega l'interazione) */
.picker-tree__hint {
    padding: .5rem .75rem;
    background: var(--bs-info-bg-subtle, #cff4fc);
    color: var(--bs-info-text-emphasis, #055160);
    font-size: .8rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.picker-tree__hint .bi {
    margin-right: .25rem;
}

.picker-tree__node {
    display: flex;
    align-items: center;
    padding: .45rem .6rem;
    border-bottom: 1px solid var(--bs-border-color);
    transition: background-color .12s;
}
.picker-tree__node:last-child {
    border-bottom: none;
}

/* Chevron come bottone circolare ben visibile (icona Bootstrap) */
.picker-tree__chevron {
    width: 2rem;
    flex: 0 0 2rem;
    height: 1.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    color: var(--brand-primary);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color .15s, color .15s;
    margin-right: .25rem;
}
.picker-tree__chevron:hover {
    background: color-mix(in srgb, var(--brand-primary) 12%, transparent);
}
.picker-tree__chevron--leaf {
    visibility: hidden;
    cursor: default;
}

/* Nome — area principale, cliccabile per la selezione */
.picker-tree__name {
    flex: 1 1 auto;
    cursor: pointer;
    padding: .15rem .35rem;
    border-radius: 4px;
    transition: background-color .12s;
}
.picker-tree__name:hover {
    background: color-mix(in srgb, var(--brand-primary) 10%, transparent);
}

/* Select hint a destra — appare in hover sul nodo, segnala "click = filtra" */
.picker-tree__select-hint {
    flex: 0 0 auto;
    width: 1.5rem;
    text-align: center;
    color: var(--brand-primary);
    opacity: 0;
    transition: opacity .15s;
    cursor: pointer;
    font-size: .9rem;
}
.picker-tree__node:hover .picker-tree__select-hint {
    opacity: .65;
}
.picker-tree__select-hint:hover {
    opacity: 1 !important;
}

/* Differenziazione padre / figlio */
.picker-tree__node--parent .picker-tree__name {
    font-weight: 600;
    text-transform: uppercase;
    font-size: .9rem;
    letter-spacing: .02em;
}
.picker-tree__node--child {
    padding-left: 2.4rem;
    background: color-mix(in srgb, var(--bs-secondary-bg) 50%, transparent);
}
.picker-tree__node--child .picker-tree__name {
    font-weight: 400;
    color: var(--bs-body-color);
    font-size: .9rem;
}

.picker-tree__children {
    display: none;
}
.picker-tree__children--expanded {
    display: block;
}
.picker-tree__node--hidden {
    display: none;
}