.prod-displayer {

    display: inline-block;
    width: 100%;
    background-color: black;
    height: 100vh;
    /* Police : Inter embarquée (font/Inter-Variable.ttf), imposée par calldisplayer.css (.prod-displayer *, !important,
       2026-09-07). Lisibilité de loin (retour Gusto, 2026-10-05) : textes plus épais ci-dessous. */

}

.box-sale-displayer {
    position: relative;
    vertical-align: top;
    border-radius: 8px;
    display: inline-block;
    padding: 22px 0px 25px 0px;
    color: #8a2576;
    margin: 2px 2px;
    text-align: center;
    width: 295px;
    background-color: white !important;
}

.box-sale-displayer-header {
    border-radius: 20px;
    display: inline-block;
    padding: 1px;
    color: #8a2576;
    font-weight: 800;
    font-size: 25px;
    margin: 2px 2px;
    text-align: center;
    width: 280px;
}

.box-sale-displayer-header-paid {
    color: green;
    position: absolute;
    top: 0px;
    right: 5px;
    font-size: 35px;
}

.box-sale-displayer-header-not-paid {
    color: red;
    position: absolute;
    top: 0px;
    right: 5px;
    font-size: 35px;
}

.box-sale-displayer-info {
    display: inline-block;
    padding: 1px;
    color: #eaeff9;
    font-weight: 800;
    font-size: 25px;
    margin: 2px 2px;
    text-align: center;
    width: 100%;
    background-color: #35244f;
}


.box-sale-displayer-deliver {
    display: inline-block;
    padding: 1px;
    color: #35244f;
    font-weight: 800;
    font-size: 25px;
    margin: 2px 2px;
    text-align: center;
    width: 100%;
    background-color: #dad8dd;
}

.box-sale-displayer-submitted {
    display: inline-block;
    padding: 1px;
    color: white;
    font-weight: 800;
    font-size: 25px;
    margin: 2px 2px;
    text-align: center;
    width: 100%;
    background-color: red;
}


.box-sale-displayer-tag-table {
    display: inline-block;
    padding: 1px;
    color: #35244f;
    font-weight: 800;
    font-size: 19px;
    margin: 2px 2px;
    text-align: center;
    width: 100%;
    background-color: #dad8dd;
}


.box-sale-displayer-message {
    display: inline-block;
    padding: 3px;
    color: #efedf2;
    font-weight: 300;
    font-size: 12px;
    margin: 2px 2px;
    text-align: left;
    width: 100%;
    background-color: #19426d;
    max-height: 250px;
}


.box-sale-displayer-slot {
    display: inline-block;
    padding: 1px;
    color: #35244f;
    font-weight: 400;
    font-size: 18px;
    margin: 2px 2px;
    text-align: center;
    width: 100%;
    background-color: #dad8dd;
}


.box-sale-displayer-item {
    display: inline-block;
    padding: 0 0 0 10px;
    color: #4c7edf;
    /* 400 → 700 (2026-10-05) : lisible de loin ; la taille et la couleur restent réglées par catégorie */
    font-weight: 700;
    margin: 2px 2px;
    text-align: left;
    width: 100%;
}

.box-sale-displayer-sub-item {
    display: inline-block;
    padding: 0 0 0 10px;
    color: #4c7edf;
    /* 300 → 600 (2026-10-05) */
    font-weight: 600;
    margin: 0;
    text-align: left;
    width: 100%;
}

/* Note libre de l'article (ex. "Sans X, Y" pour une étape retrait) — teal + italique pour
   se distinguer visuellement des sous-articles classiques (bleu), en cohérence avec le
   mode retrait sur l'écran de déclinaison (voir .item-spe-box-removable). */
.box-sale-displayer-options {
    color: #1E8A72;
    font-style: italic;
    font-weight: 600;
}


.box-sale-displayer-header-prepa {
    color: #40f;
    position: absolute;
    top: 0px;
    left: 5px;
    font-size: 15px;
    font-weight: 300;
}


.box-sale-displayer-header-device {
    color: red;
    position: absolute;
    bottom: 0px;
    right: 5px;
    font-size: 16px;
    font-weight: 300;
}


.box-sale-displayer-group-row {
    position: relative;
    padding: 10 0 0 0;
    margin: 0;
}


.box-sale-displayer-item-group {
    color: #4d83d9;
    position: relative;
    text-align: center;
    font-size: 12px;
    font-weight: 600; /* 300 → 600 (2026-10-05) */
}


.displayer-hour {
    color: white;
    padding: 0 0 0 60px;
    font-size: 20px;
    font-weight: 600;
}

.displayer-nav-bar {
    background-color: #071645;
    height: 35px;
}

.displayer-version {
    position: absolute;
    color: white;
    bottom: 1px;
    right: 5px;
    font-size: 12px;
}

.displayer-logo {
    position: absolute;
    top: 1px;
    left: 5px;

    opacity: 50%
}

.displayer-filter-brand {
    position: absolute;
    top: 5px;
    left: 50%;
}


.btn-floating.displayer-filter-btn {
    position: fixed;
    right: 20px;
    bottom: 20px;
    box-shadow: 0 2px 5px #acadcc, 0 2px 10px #734141;
}

.displayer-filter-menu-dialog {

    background-color: black;
}

.displayer-filter-menu {
    padding: 20px;
    height: 90%;
}

.displayer-sale-fullscreen {
    width: 70%;
    height: calc(100vh - 60px);
    margin: 10px;
}


.print-panel-dialog {
    background-color: black;
    border: 1px solid white;
}

.displayer-flex {

    display: inline-block;
    vertical-align: top;
    margin: 10px;
    width: 40%;

}
/* Rafraîchissement ciblé (2026-10-06, DisplayerPanel#apply) : apparition, mise à jour et sortie des commandes.
   Pas de transform au repos : la vue plein écran (MaterialOverlay) est dans la boîte, un transform persistant la
   confinerait. */
.box-sale-displayer.displayer-enter {
    animation: displayer-enter 450ms ease-out;
}

.box-sale-displayer.displayer-enter.displayer-new {
    animation: displayer-enter 450ms ease-out, displayer-new 3s ease-out;
}

.box-sale-displayer.displayer-updated {
    animation: displayer-updated 1.5s ease-out;
}

.box-sale-displayer.displayer-leave {
    transition: opacity 400ms ease-in, transform 400ms ease-in;
    opacity: 0;
    transform: scale(0.9);
    pointer-events: none;
}

@keyframes displayer-enter {
    from { opacity: 0; transform: scale(0.92); }
    to { opacity: 1; transform: none; }
}

@keyframes displayer-new {
    0%, 60% { box-shadow: 0 0 0 5px #ffca28; }
    100% { box-shadow: 0 0 0 0 rgba(255, 202, 40, 0); }
}

@keyframes displayer-updated {
    0% { box-shadow: 0 0 0 5px #4fc3f7; }
    100% { box-shadow: 0 0 0 0 rgba(79, 195, 247, 0); }
}