/* ----------------------------------------------------------------- */
.backoffice-display {
    display: flex;
    flex-flow: column;
    height: 100%;
    width: 100%;
    background-color: #f4f5fb;
}
.backoffice-display .header {
    flex: 0 1 auto;
    background-color: white;
}
.backoffice-display .content {
    flex: 1 1 auto;
}
.backoffice-display .footer {
    flex: 0 1 auto;
}
/* ----------------------------------------------------------------- */

.draggable {
    cursor: grab;
}
.draggable--hover {
    border: 1px dashed #424d5c;
}

.draggable:active {
    cursor: grabbing;
    border: 1px solid #424d5c;
}


.dragging {
    cursor: grabbing;
    
}

@media print {
    .pdf-container {
        display: none;
    }
}
/* ---------------- Company --------------------------------------*/
.company-combo {
    border-radius:  16px;
    text-transform: uppercase;
    font-size: 1.2em;
    font-weight: bold;
}

.company-novalyo {
    color : white;
    //background-color : #299fae;
    background-color : #008bb5;
}
.company-novalyosud {
    color : white;
    //background-color : #d1458c;
    background-color : #942193;
}
/* --------------------------- fields -----------------------------*/
.field-align-right input{
    text-align: right;
}
/* --------------------------- tablets ----------------------------*/
.tablet-header {
    /*font-style: italic;
    font-size: large; */
    font-weight: bold;
    font-size: x-large;
    /*color: darkblue;*/
}
/* --------------------------- family tags ----------------------------*/
.family-tags {
    height:96px;
    transition: transform .2s; /* Animation */
    /*overflow: hidden; ko */
    clip-path: inset(10px 20px 30px 40px);
}
.family-tags:hover {
    transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

/* Colors for tag chips */
/* 001 telephonie */
.family1-1 {
    color: #24d700;
    background-color: rgba(84, 213, 250, 0.2);
}

/* 002 Réseaux */
.family1-2 {
    color: #d35401;
    background-color: rgba(248, 248, 76, 0.2);
}

/* 003 Mobilité */
.family1-3 {
    color: #0041d9;
    background-color: rgba(102, 135, 248, 0.2);
}

/* 004 Appel malade */
.family1-4 {
    color: #6d00e3;
    background-color: rgba(252, 74, 207, 0.2);
}
/* 005,Contrôle d'accés */
.family1-5 {
    color: #c40066;
    background-color: rgba(248, 85, 209, 0.2);
}
/* 000 bad tag */
.family1-0 {
    color: rgba(248, 253, 251, 0.48);
    background-color: rgba(84, 213, 250, 0.2);
}
/*

6,Cabling
7,Audiovisuel
8,Energie
9,Divers
10,Prestations
11,Contrat
12,Matériel technicien
13,Réparation
14,Affichage dynamique
15,Sonorisation
16,Vidéosurveillance
17,Sécurité incendie
*/
.family-level1 {
    font-size: 0.9rem;
    font-weight: bold;
}
.family-level2 {
    font-size: 0.675rem;
}

/* --------------------------- product list ----------------------------*/

.productlist {
    font-style: italic;
    font-size: large;
}
.mud-paper .product-search .criterias  {
    background-color: #d9eef4 !important;
    /*box-shadow: 0 6px 7px -4px rgba(0,0,0,.0), 0 11px 15px 1px rgba(0,0,0,0), 0 4px 20px 3px rgba(0,32,64,.08);
*/
}

.product-search-background  {
    background-color: #d9eef4 !important;
}
.mud-paper .product-search .results  {
    background-color: white;
/*    box-shadow: 0 6px 7px -4px rgba(0,0,0,.0), 0 11px 15px 1px rgba(0,0,0,0), 0 4px 20px 3px rgba(0,32,64,.08);
*/
}

.product-list-title {
    font-size: x-large;
    color: darkblue;
}
.product-list-small-title {
    font-weight: bold;
    color: darkblue;
}
.product-search .title {
    font-size: x-large;
    color: darkblue;
}
.product-search .mud-input  {
    background-color: white;
}
.product-search  .mud-checkbox-input  {
    background-color: white !important;
}
.product-search .criterias .mud-divider  {
    background-color: white !important;
}
.product-card .title {
    font-size: x-large;
    color: darkblue;
}
.product-family {
    color: dodgerblue;
}
.product {
    font-stretch: expanded;
}

.product-price {
    font-size: large;
    color: darkblue;
}
.product-price-bold {
    font-size: large;
    color: darkblue;
}
.product-price-light {
}

.productlist-item {
    font-style: italic;
    font-size: xxx-large;
    color: yellowgreen;
}

/* --------------------------- customer list ----------------------------*/

.mud-paper .customer-search .criterias  {
    background-color: #d9eef4 !important;
    /*box-shadow: 0 6px 7px -4px rgba(0,0,0,.0), 0 11px 15px 1px rgba(0,0,0,0), 0 4px 20px 3px rgba(0,32,64,.08);
*/
}

.customer-search-background  {
    background-color: #d9eef4 !important;
}
/* 
*/
.align-right input{
    text-align: right;
}

.clickable-field {
    /* debug: uncomment this to see the place of the field on the screen */
    /* border: 1px solid lightgray; */
    z-index: auto;
}
.clickable-field-editable {
    z-index: 15;
}
.display-over-top {
    z-index: 15;
}
@media (max-width: 1920px) {
    .nova-container:has(> quotes-editor) {
        max-width: 1900px;
    }

    .quotes-editor {
        max-width: 1900px;
    }
}