/**
 * TECNOVALORE - OVERRIDE BOOTSTRAP 3
 * Ridefinisce tutte le classi contestuali "primary" e i colori
 * globali di Bootstrap usando le variabili di colors.css.
 *
 * NON modificare bootstrap.min.css direttamente.
 * Per cambiare i colori del tema modificare solo colors.css.
 *
 * Caricato DOPO bootstrap.min.css in index.html.
 */


/* =============================================
   LINK GLOBALI (Bootstrap default: #337ab7)
   ============================================= */

a {
    color: var(--color-link);
}

a:hover,
a:active,
a:focus {
    color: var(--color-link-hover);
    text-decoration: none;
}


/* =============================================
   TEXT HELPERS
   ============================================= */

.text-primary {
    color: var(--color-brand-primary);
}

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


/* =============================================
   BACKGROUND HELPERS
   ============================================= */

.bg-primary {
    color: var(--color-text-on-dark);
    background-color: var(--color-brand-primary);
}

a.bg-primary:focus,
a.bg-primary:hover {
    background-color: var(--color-brand-primary-hover);
}


/* =============================================
   PULSANTI — btn-primary
   ============================================= */

.btn-primary {
    color: var(--color-text-on-dark) !important;
    background-color: var(--color-brand-primary) !important;
    border-color: var(--color-brand-primary-hover) !important;
}

.btn-primary:hover {
    color: var(--color-text-on-dark) !important;
    background-color: var(--color-brand-primary-hover) !important;
    border-color: var(--color-brand-primary-dark) !important;
}

.btn-primary:focus,
.btn-primary.focus {
    color: var(--color-text-on-dark) !important;
    background-color: var(--color-brand-primary-hover) !important;
    border-color: var(--color-brand-primary-dark) !important;
}

.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
    color: var(--color-text-on-dark) !important;
    background-color: var(--color-brand-primary-hover) !important;
    border-color: var(--color-brand-primary-dark) !important;
}

.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary:active.focus,
.btn-primary.active:hover,
.btn-primary.active:focus,
.btn-primary.active.focus,
.open > .dropdown-toggle.btn-primary:hover,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary.focus {
    color: var(--color-text-on-dark) !important;
    background-color: var(--color-brand-primary-dark) !important;
    border-color: var(--color-brand-primary-dark) !important;
}

.btn-primary.disabled,
.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled:active,
.btn-primary[disabled],
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary:active {
    background-color: var(--color-brand-primary) !important;
    border-color: var(--color-brand-primary-hover) !important;
}

.btn-primary .badge {
    color: var(--color-brand-primary) !important;
    background-color: var(--color-text-on-dark) !important;
}

/* btn-link usa il colore primary per il testo */
.btn-link {
    color: var(--color-link);
}

.btn-link:hover,
.btn-link:focus {
    color: var(--color-link-hover);
}


/* =============================================
   LABEL — label-primary
   ============================================= */

.label-primary {
    background-color: var(--color-brand-primary);
}

.label-primary[href]:focus,
.label-primary[href]:hover {
    background-color: var(--color-brand-primary-hover);
}


/* =============================================
   BADGE — colore di default
   ============================================= */

/* I badge usano il grigio di default; li associamo al brand
   solo nei contesti list-group / nav-pills attivi */
.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
    color: var(--color-brand-primary);
    background-color: var(--color-text-on-dark);
}


/* =============================================
   PANEL — panel-primary
   ============================================= */

.panel-primary {
    border-color: var(--color-brand-primary);
}

.panel-primary > .panel-heading {
    color: var(--color-text-on-dark);
    background-color: var(--color-brand-primary);
    border-color: var(--color-brand-primary);
}

.panel-primary > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: var(--color-brand-primary);
}

.panel-primary > .panel-heading .badge {
    color: var(--color-brand-primary);
    background-color: var(--color-text-on-dark);
}

.panel-primary > .panel-footer + .panel-collapse > .panel-body {
    border-bottom-color: var(--color-brand-primary);
}


/* =============================================
   LIST GROUP — item active
   ============================================= */

.list-group-item.active,
.list-group-item.active:focus,
.list-group-item.active:hover {
    background-color: var(--color-brand-primary);
    border-color: var(--color-brand-primary);
}

.list-group-item.active .list-group-item-text,
.list-group-item.active:focus .list-group-item-text,
.list-group-item.active:hover .list-group-item-text {
    color: var(--color-brand-primary-light);
}


/* =============================================
   NAV PILLS — elemento attivo
   ============================================= */

.nav-pills > li.active > a,
.nav-pills > li.active > a:focus,
.nav-pills > li.active > a:hover {
    color: var(--color-text-on-dark);
    background-color: var(--color-brand-primary);
}


/* =============================================
   DROPDOWN — elemento attivo
   ============================================= */

.dropdown-menu > .active > a,
.dropdown-menu > .active > a:focus,
.dropdown-menu > .active > a:hover {
    color: var(--color-text-on-dark);
    background-color: var(--color-brand-primary);
}

/* Bordo nav open */
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    border-color: var(--color-brand-primary);
}


/* =============================================
   PAGINATION
   ============================================= */

.pagination > li > a,
.pagination > li > span {
    color: var(--color-brand-primary);
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover {
    color: var(--color-brand-primary-hover);
}

.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    color: var(--color-text-on-dark);
    background-color: var(--color-brand-primary);
    border-color: var(--color-brand-primary);
}


/* =============================================
   PROGRESS BAR — progress-bar (default primary)
   ============================================= */

.progress-bar {
    background-color: var(--color-brand-primary);
}


/* =============================================
   THUMBNAIL — bordo focus/hover
   ============================================= */

a.thumbnail.active,
a.thumbnail:focus,
a.thumbnail:hover {
    border-color: var(--color-brand-primary);
}


/* =============================================
   FORM CONTROL — focus ring
   ============================================= */

.form-control:focus {
    border-color: var(--color-brand-primary-light);
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(44, 102, 97, 0.4);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(44, 102, 97, 0.4);
}