html { font-size: 0.9rem; } .main { cursor: pointer; } .cache { display: none; } .erreurMessage { color: var(--red); } .navbar-logo { width: 260px; margin-top: -4px; height: 35px; display: block; background-image: url(../image/logo.png); background-position: 50%; background-position-y: bottom; background-size: contain; background-repeat: no-repeat; } .navbar-appname { padding-left: 5px; font-weight: 700; letter-spacing: 4px; } .dl { color: #ccc; } .table-hover tbody td:hover { text-decoration: none !important; } .gap-2 { gap: 0.5rem; } .dl.dlReady { cursor: pointer; color: #28a745 !important; } .wait > i { color: #ccc; -webkit-animation: color-change 2s infinite; -moz-animation: color-change 2s infinite; -o-animation: color-change 2s infinite; -ms-animation: color-change 2s infinite; animation: color-change 2s infinite; } @-webkit-keyframes color-change { 0% { opacity: 0.8; } 50% { opacity: 0.1; } 100% { opacity: 0.8; } } @-moz-keyframes color-change { 0% { opacity: 0.8; } 50% { opacity: 0.1; } 100% { opacity: 0.8; } } @-ms-keyframes color-change { 0% { opacity: 0.8; } 50% { opacity: 0.1; } 100% { opacity: 0.8; } } @-o-keyframes color-change { 0% { opacity: 0.8; } 50% { opacity: 0.1; } 100% { opacity: 0.8; } } @keyframes color-change { 0% { opacity: 0.8; } 50% { opacity: 0.1; } 100% { opacity: 0.8; } } .datetimepicker { top: 242px !important } .form-card .form-control { padding-top: 0 !important; padding-bottom: 0 !important; } select.form-control-sm:focus, select.form-control:focus, input.form-control-sm:focus, input.form-control:focus { box-shadow: none; border-color: rgba(0, 123, 255, 0.5); } .btn-outline-primary.disabled, .btn-outline-primary:disabled, .btn-outline-primary:disabled:hover { border-color: var(--gray); color: var(--gray-dark); background-color: #00000003; } .btn-xs { padding: 0; font-size: 0.8rem; } .body:not(.login) { background-color: #f9fbfd; } .container.bread ol.breadcrumb { border: 1px solid #c2c2c9; border-radius: 0; background-color: #fff; } .contToast { position: fixed; display: inline-block; top: 0; right: 0; z-index: 9999; } .contToast > .toast:first-child { margin-top: 4rem; } .contToast > .toast { z-index: 9999; min-width: 300px; } @media only screen and (min-width: 800px) { .contToast { padding-right: 5rem; } } .login { background-repeat: no-repeat; background-size: 100% 100%; min-height: 600px; background-color: #f9fbfd; height: 100%; margin-top: -21px; } .login2 { -webkit-animation-name: changecolor; -webkit-animation-duration: 1s; animation-name: changecolor; animation-duration: 1s; } @-webkit-keyframes changecolor { from { background-color: white; } to { background-color: #cacaca; } } @keyframes changecolor { from { background-color: white; } to { background-color: #cacaca; } } ._authShow { display: none; } .bs-docs-section { margin-top: 0; } .account-container { margin: auto; max-width: 350px; } .containerAuth { display: flex; justify-content: center; align-items: center; height: 100vh; } .form-password-reset { display: flex !important; justify-content: space-between !important; } .account-wall { margin: auto; padding: 15px; border-radius: 10px; background-color: #fff; -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.169); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.169); } .account-wall .logo { margin: auto; display: flex; } * { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; } body { background-color: #f9fbfd; min-height: 100vh; } .account-wall h3 { color: #01972b; font-size: 1.5rem; font-weight: 600; } .account-wall h5 { color: #666; font-size: 1rem; font-weight: 500; } .account-wall h4 { color: #333; font-size: 1.1rem; font-weight: 600; } .form-control { border: 1px solid #ced4da; border-radius: 6px; padding: 0.6rem 0.9rem; font-size: 0.9rem; transition: all 0.2s ease; background-color: #fff; } .form-control:focus { border-color: #01972b; box-shadow: 0 0 0 0.15rem rgba(1, 151, 43, 0.15); background-color: #fff; outline: none; } .form-control::placeholder { color: #adb5bd; font-size: 0.875rem; } label { color: #495057; font-size: 0.9rem; font-weight: 500; margin-bottom: 0.4rem; } .form-group { margin-bottom: 1.25rem; } .alert { border-radius: 6px; font-size: 0.9rem; } .main:hover { color: #017a23; text-decoration: underline; } .form-password-reset label { margin-bottom: 0; } .country-icon { width: 22px; height: 22px; margin-right: 5px; vertical-align: middle; } .btn-primary, .btn-primary:hover, .btn-primary:active, .btn-primary:visited { background-color: #01972b !important; border-color: #01972b; } .btn-outline-primary, .btn-outline-primary:hover, .btn-outline-primary:active, .btn-outline-primary:visited { border-color: #01972b; color: #01972b; } .btn-outline-primary:hover { background-color: #01972b !important; border-color: #01972b; color: #fff; } @media (min-width: 1px) { .form-horizontal .control-label { text-align: right; } .navbar-custom { color: rgb(51, 51, 51); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } } .qt, .ht { text-align: right; } .globalContent .navbar { z-index: 998; } .globalMenu > table > tbody > tr { height: 24px; } .globalMenu > table > tbody > tr:first-child > td { padding-top: 8px; } .globalMenu > table > tbody > tr:last-child { height: 10px; } .globalMenu > table { font-weight: bold; font-size: 0.78em; color: #fff; } .userLib { font-size: 1.08em; } .bullet { display: inline-block; width: 12px; height: 12px; margin-right: 2px; } .globalMenu a:link, .globalMenu a:visited, .globalMenu a:hover, .globalMenu a:active { color: #fff; } .globalMenu a:hover { color: #ccc; } */ .table { font-size: 12px; background-color: #fff; } .table thead th { border-top: 1px solid #dee2e6; border-bottom: 1px solid #dee2e6; } .table .trie > .logoTrie { margin-left: 5px; } .table ._tri ._carret { margin-left: 3px; } .table thead > tr > th, .table tbody > tr > th, .table tfoot > tr > th, .table thead > tr > td, .table tbody > tr > td, .table tfoot > tr > td { padding: 2px 5px; font-size: 0.9rem; } .mfsmalltable th, td { font-size: 0.8rem !important; } .entete { padding-top: 1rem; } .navbar-search { border: solid 1px #ccc; border-radius: 5px; margin-bottom: 1rem; } .navbar-search-actions .btn { margin-left: 0.5em; } .container.bread { padding-right: 0; padding-left: 0; margin-top: 4.5rem; } .newGlobalMenu > .container { padding-right: 0; padding-left: 0; } @media (min-width: 1400px) { .container { max-width: 1440px; } } .mfbox { padding: 0.6rem; padding-top: 1rem; margin-top: 0.5rem; } .mfbox { background-color: #fff; border: 1px solid #c2c2c9; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); border-top: 2px solid #01972b; } .mfbox > h4:not(.notmfbox) { margin-top: 0; margin-bottom: 1rem; font-size: 1.2rem; } .mfbox h5:not(.notmfbox) { width: 90%; border-bottom: solid 1px #000; color: #000; font-size: 1em; padding-left: 0.4rem; padding-bottom: 0.4rem; font-weight: normal; text-transform: uppercase; } .mfbox > h4, .mfbox > h5 { color: #008425; } .mfbox .mfwidget { max-height: 150px; } .mfbox .tablevalidate td:not(:last-child) { padding: 0.5rem; } .mfbox .tablevalidate td:last-child .list-group-item { padding: 0.25rem; } .mfbox .tablesearch .navbar { border-radius: 0; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom: 0; margin-bottom: 0; } .mfbox .tablesearch .table-responsive { border: solid 1px #ccc; border-top: 0; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } .classifs .classif { padding: 2px 0; } .classifs .classif > span { padding: 5px 10px; color: #444; } .classifs .classif > span:hover { background-color: #f9f9f9; cursor: pointer; color: #000; } .tabSaisie .actionLigne .btn { font-size: 0.8rem; } .cadreimg { position: relative; vertical-align: center; text-align: center; } .vignettes .vignette { font-size: 0.9rem; } .vignette .des { font-weight: 500; } .body.modesaisie .globalContent { padding-top: 0; } .conteneur_action { margin: 0; height: 50px; display: block; position: fixed; left: 0; width: 100%; } .newGlobalMenu { background-color: #fff; background-color: rgba(255, 255, 255, 0.93); border-bottom: 1px solid #c2c2c9; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); z-index: 999; } .newGlobalMenu a, .newGlobalMenu a:hover, .newGlobalMenu .caret, .newGlobalMenu .caret:hover { color: #333; } .newGlobalMenu .caret, .newGlobalMenu .caret:hover, .newGlobalMenu a:hover .caret { border-top-color: #777; border-bottom-color: #333; } .newGlobalMenu .navbar-nav > .active > a, .newGlobalMenu .navbar-nav > .active > a:focus, .newGlobalMenu .navbar-nav > .active > a:hover { color: #555; cursor: default; } .newGlobalMenu .dropdown-menu > .active > a, .newGlobalMenu .dropdown-menu > .active > a:hover, .newGlobalMenu .dropdown-menu > .active > a:focus { color: #ed1e24; background-color: #fff; } .newGlobalMenu .disabled i, .newGlobalMenu .disabled span { color: #777; } .newGlobalMenu .dropdown-item i.fa, .newGlobalMenu .dropdown-item i.fal, .newGlobalMenu .dropdown-item i.far, .newGlobalMenu .dropdown-item i.fas { margin-right: 0.3rem; } .newGlobalMenu .open .dropdown-menu > li > a:hover, .newGlobalMenu .open .dropdown-menu > li > a:focus { color: #ed1e1d; background-color: transparent; } .newGlobalMenu .nav-link.active { color: #01972b; } .dropdown-item.active, .dropdown-item:active { background-color: #f8f9fa; color: #333; } a:hover { color: #f8f9fa; } .btn > i { padding-right: 5px; } .conteneur_action.conteneur_g { position: relative; } .conteneur_action.conteneur_g { background-color: #fff; border-bottom: 1px solid #c2c2c9; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); z-index: 999; } .conteneur_action.globalMenuSaisie { border-bottom: 1px solid #c2c2c9; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); z-index: 999; } .conteneur_action.globalTitreSaisie { background-color: rgba(255, 255, 255, 0.8); z-index: 999; } .conteneur_action.globalTitreSaisie > .contTitre > h4 { margin: 0; margin-top: 12px; } .conteneurActionSaisie .contText { display: inline-block; } .conteneur_action .contPrev, .conteneurActionSaisie .contPrev { display: inline-block; } .conteneur_action .contNext, .conteneur_action .contClose, .conteneurActionSaisie .contNext, .conteneurActionSaisie .contClose { display: inline-block; } .conteneur_action .contClose, .conteneurActionSaisie .contClose { margin-right: 5px; } .contNext > .btn > i, .contPrev > .btn > i { margin-right: 0; padding: 0; } .globalMenuSaisie .action, .globalTitreSaisie .contTitre { margin: auto; text-align: center; margin-top: 5px; } .globalMenuSaisie .action, .globalTitreSaisie .contTitre { width: 1000px; } .saisie .brand { display: block; width: 180px; height: 36px; margin: 0; float: left; background-image: url(logo_200.jpg); background-size: 180px 36px; } .saisie img.img-thumbnail { -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; cursor: pointer; } .saisie .img-visu { display: none; position: fixed; z-index: 999; background-color: #0003; width: 100%; height: 100%; position: fixed; top: 0; right: 0; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .saisie .img-visu .cadre { display: block; text-align: center; border: solid 0px; border-color: #ccc; border-radius: 5px; cursor: pointer; top: 10%; margin: auto; margin-top: 4rem; } .saisie .btn > i.fa-only, .saisie .fa-only { margin: 0; } .saisie .contTotal { padding-top: 0; } .saisie .actionLigne .btn-xs { height: 28px; vertical-align: middle; } .saisie .actionLigne .btn { outline: none; } .saisie .titre { font-size: 1.1em; font-weight: bold; } .saisie .contTotal .control-label { font-weight: normal; padding-right: 0; } .retailPrices > span { font-weight: bold; margin-top: 10px; } .retailPrices { margin-top: 5px; } .tabSaisie .cou > .libcou { text-transform: uppercase; } .tabSaisie .cou { min-width: 110px; padding: 0 5px; } .saisie { padding-top: 0; } .saisie > .row { align-items: flex-start; justify-content: space-between; } .saisie .box { background-color: #fff; border: 1px solid #c2c2c9; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); border-top: 2px solid #ed1e24; } .saisie .box + .box { margin-bottom: 10px; } .saisie .box.classifs { padding-bottom: 20px; } .saisie > .choix { width: 32%; padding-top: 15px; padding: 5px 0; } .choix .searchchx:focus { box-shadow: none; border-color: rgba(0, 123, 255, 0.5); } .saisie > .selection { float: right; width: 65%; } .saisie .search > *[class^="col-md"], .saisie .search > *[class^="col-xs"] { padding-right: 5px; padding-left: 5px; } .autocomplete { font-size: 0.9em; margin-top: 10px; } .autocomplete > .complete { margin: 0; list-style-type: none; padding-bottom: 3px; padding-left: 8px; padding-right: 8px; padding-top: 3px; border-bottom: solid #ccc 1px; border-left: solid #ccc 1px; border-right: solid #ccc 1px; cursor: pointer; } .autocomplete > .complete:first-child { border-top: solid #ccc 1px; } .autocomplete > .complete:hover { background-color: #ccc; color: #fff; } .autocomplete > .active { color: #ed1e24; text-decoration: none; } .saisie .lignes .table tr.active > td { background-color: #e4e4e4; } .saisie .lignes .table { border: solid 1px #ccc; } .saisie .lignes { padding: 0 15px; margin-bottom: 0; } .saisie .lignes .table th { padding: 5px; } .saisie .lignes .table th:nth-child(3), .saisie .lignes .table th:nth-child(4), .saisie .lignes .table th:nth-child(5), .saisie .lignes .table th:nth-child(6), .saisie .lignes .table th:nth-child(7) { text-align: right; } .saisie .lignes .table td:nth-child(8) { text-align: center; } .saisie .lignes .table th:nth-child(8) { text-align: center; } .saisie ._search .input-group input + .input-group-btn > button.btn { border-left: 0; } .saisie .deleteLigne { color: #333; } .saisie .qt, .saisie .ht, .table .qt, .table .ht { text-align: right; } .table .center { text-align: center; } .tabSaisie tbody td { border: solid 1px #797979; } .tabSaisie tbody td.actionLigne { border: 0; height: 33px; padding: 0 0 0 5px; vertical-align: middle; } .tabSaisie tbody td.labelcou { text-align: right; } .tabSaisie tbody td.totalligne { background-color: #eee; } span.pastille { width: 16px; height: 16px; display: inline-block; margin-right: 5px; vertical-align: middle; border-radius: 10px; box-shadow: 0px 1px 1px 0px #000; } .tabSaisie .cou > div.pastille { display: inline-block; position: absolute; } .tabSaisie:not(.maxsize) tbody td.cou { padding-right: 5px; padding-left: 5px; } .tabSaisie { border-collapse: collapse; border: solid black 0px; } .tabSaisie input[type="number"]::-webkit-outer-spin-button, .tabSaisie input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .tabSaisie .labelDispo { text-align: right; padding-right: 15px; } .tabSaisie th { font-size: 0.85em; text-align: center; } .tabSaisie tbody td { padding: 0; margin: 0; } .tabSaisie tbody td input { border: 0; margin: 0 1px; text-align: center; max-width: 35px; height: 30px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .tabSaisie.maxsize tbody td input { text-align: center; max-width: 28px; } .tabSaisie.maxsize { font-size: 0.9em; } .tabSaisie .labelcou { font-size: 0.85em; } .tabSaisie .brouillonLib { font-size: 0.85em; padding: 0 5px; } .tabSaisie tbody td input:focus { outline: none; } .tabSaisie .enstock { border-color: #66c83f; } .tabSaisie .enCommande { border-color: #003cff; } .tabSaisie .pasDispo { border-color: rgb(235, 235, 228); } .tabSaisie .stockBas { border-color: #ffa500; } .tabSaisie .erreurProduit { border-color: rgb(175, 0, 0); } .tabSaisie .thPrix, .tabSaisie .thTotal { padding: 0 5px; } .tabSaisie .thTotal { min-width: 30px; } .tabSaisie .thPrix { text-align: left; } .tabSaisie .oldPrix { padding: 0 10px; } .tabSaisie .txRemise { padding: 0 10px 0 0; font-size: 12px !important; font-style: italic; font-weight: bold; color: #565656; text-align: right; } .tabSaisie .prix { font-size: 12px !important; font-style: italic; font-weight: bold; color: #565656; text-align: right; } .tabSaisie .prix.soldes { background-color: yellow; } .tabSaisie .logoImg { min-width: 20px; } .tabSaisie .cou { text-align: left; padding: 0; } .tabSaisie .cou > div { vertical-align: middle; text-align: right; line-height: 1; margin: 2px; } .tabSaisie .prixTaille { display: block; min-height: 16px; margin-top: 2px; text-align: center; } .tabSaisie div.tailPasDisp { background-color: #ccc; background-image: -webkit-gradient( linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.9)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.75, rgba(255, 255, 255, 0.2)), color-stop(0.75, transparent), to(transparent) ); background-image: -webkit-linear-gradient( 45deg, rgba(255, 255, 255, 0.9) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 75%, transparent 75%, transparent ); background-image: -moz-linear-gradient( 45deg, rgba(255, 255, 255, 0.9) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 75%, transparent 75%, transparent ); background-image: -ms-linear-gradient( 45deg, rgba(255, 255, 255, 0.9) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 75%, transparent 75%, transparent ); background-image: -o-linear-gradient( 45deg, rgba(255, 255, 255, 0.9) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 75%, transparent 75%, transparent ); background-image: linear-gradient( 45deg, rgba(255, 255, 255, 0.9) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.9) 75%, transparent 75%, transparent ); background-size: 10px 10px; height: 32px; min-width: 30px; } .tabSaisie input.tailPasDisp { background-color: #ffc1073d; } .tabSaisie tr.sep > td { border: 0; } .tabSaisie tr.sep > td > h4 { margin: 0; padding: 5px; } .tabSaisie tr.sep .labelcou { margin-left: 1em; } .tabSaisie tr.sep .labelcou, .tabSaisie tr.sep .pastille { display: inline-block; } .totaux td:not(.cou):not(.sansBordure):not(.tlig) { border-top: solid 1px #ccc; } .tabSaisie tbody tr:not(.stock):not(.totaux) td:nth-last-child(3) { padding-right: 5px; } .totalligne { border-left: solid 1px #ccc; padding-left: 5px; } .tabSaisie .stock td:last-child { border-left: solid 1px #ccc; padding-left: 5px; } .totaux td:last-child { border-top: 0; } #modesaisie tfoot tr:first-child { height: 30px; } .tabSaisie .grise { display: none; } .tabSaisie .vide { background-color: #bbb; color: #bbb; text-align: center; } .tabSaisie tbody .tbo { cursor: pointer; text-align: center; vertical-align: middle; } .tabSaisie tbody .tbo a { display: block; width: 100%; text-align: center; } .tabSaisie tbody .tbo a:link { color: #555; text-decoration: none; } .tabSaisie tbody .tbo a:visited { color: #555; text-decoration: none; } .tabSaisie tbody .tbo a:hover { color: black; text-decoration: none; } .tabSaisie .tlig, .tabSaisie .totaux td { text-align: center; } .tabSaisie .tsel { width: 80px; height: 34px; text-align: center; border: solid black 1px; } .tabSaisie .cm { width: 60px; padding: 0; margin: 0; border: 0; text-align: left; padding-right: 3px; } .tabSaisie .ko { background-color: orange; } .tabSaisie .nostock { background-image: url(./motif.png); background-repeat: repeat; } #saisieenligne { border: solid black 1px; width: 100%; height: 100%; background-color: silver; opacity: 0.1; } .tabSaisie .stock { font-size: 10px; color: #4f81bd; text-align: center; height: 10px; font-style: italic; } .tabSaisie .stock .depot { text-align: right; padding-right: 25px; } .tabSaisie .stock td { border: 0; margin: 0; padding-bottom: 2px; } .tabSaisie tr.selected > td:not(:first-child):not(:nth-last-child(-n + 2)):not(.totalligne) > input[type="number"] { background-color: #e2e2e2; } .tabSaisie tr.selected > td:not(:first-child):not(:nth-last-child(-n + 2)):not(.totalligne) { background-color: #e2e2e2; } .tabSaisie tr.selected > td.totalligne { background-color: #e2e2e2; } .tabSaisie tr:not(.selected) > td:nth-last-child(2) > input[type="number"] { background-color: #adadad; } .tabSaisie tr:not(.selected) > td:nth-last-child(2) { background-color: #adadad; } .tabSaisie tr.selected > td:nth-last-child(2) > input[type="number"] { background-color: #ffbbbb; } .tabSaisie tr.selected > td:nth-last-child(2), .tabSaisie tr.selected > td:first-child { background-color: #ffbbbb; } .tabSaisie .btn.active { background-color: #ababab; } .tabSaisie .clicImg { cursor: pointer; } .tabSaisie .pack + td:not(.pack) { padding-left: 20px; } .tabSaisie .enCourReapro { border-color: #cd0a0a; } .tabSaisie .dernierePieces { border-color: #ff8100; } .tabSaisie .enStock { border-color: #85ba3e; } .tabSaisie .vignette { width: 50px; height: 68px; background-size: 50px 68px; background-repeat: no-repeat; } .tabSaisie .vignette.tronquePaysage { background-position: center; width: 60px; height: 25px; background-size: 60px; } .tabSaisie .enCourReaproLibel { z-index: 0; padding: 5px; position: fixed; display: block; background-color: #fff; color: #ff8100; margin-left: -60px; -moz-box-shadow: 0px 1px 1px 0px #656565; -webkit-box-shadow: 0px 1px 1px 0px #656565; -o-box-shadow: 0px 1px 1px 0px #656565; box-shadow: 0px 1px 1px 0px #656565; filter: progid: DXImageTransform.Microsoft.Shadow(color=#656565, Direction=180, Strength=1); border-radius: 2px; } .tabSaisie .select .fa-eye, .tabSaisie .select .labelsaisie { color: #2a8fbd; } .saisie .tabLegende input:disabled:not(.pasDispo) { background-color: #fff; } .saisie .tabLegende tbody td input { margin: 2px; text-align: center; width: 16px; height: 11px; font-size: 1em; } .saisie .tabLegende { font-size: 8pt; } .saisie .tabLegende { margin-top: 15px; } .saisie .totalHt { padding-top: 15px; } .saisie .totalHt td { border-top: 1px solid #777; } .saisie .totalHt td div { padding-top: 10px; float: right; } .saisie .trait { border-bottom: solid 1px #ccc; padding-bottom: 10px; } .saisie .contTotal { list-style: none; padding: 0; margin: 0; padding-top: 10px; } .saisie .contTotal .labelsaisie { display: inline-block; width: 120px; text-align: right; } .saisie .contTotal .ht, .contTotal .qt { display: inline-block; width: 60px; text-align: right; } .saisie .noresult { margin-top: 0; } .saisie .current img { background-color: #fff; border: 1px solid #ebebeb; border-radius: 6px; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; max-width: 205px; height: auto; cursor: pointer; padding: 5px; } .saisie .conteneurVignette ol { list-style: none; padding: 0 0 50px 0; margin: 0; } .saisie .conteneurVignette .vignette { border-radius: 5px; cursor: pointer; } @media (max-width: 540px) { .saisie .conteneurVignette { margin-right: 0 !important; margin-left: 0 !important; } .cadreimg { min-height: 157px; } } @media (min-width: 576px) { .saisie { margin-right: 0 !important; margin-left: 0 !important; } .cadreimg > img._img { max-height: 259px; } .cadreimg { min-height: 81px; } .saisie .conteneurVignette .vignette { width: 100%; } .saisie .conteneurVignette { margin-right: -0.25rem !important; margin-left: -0.25rem !important; } .saisie .conteneurVignette .vignette .vignette_des { position: absolute; z-index: 2; padding: 0; max-width: 100%; padding-left: 5px; padding-right: 18px; } .saisie .conteneurVignette .vignette .vignette_totaux { position: absolute; z-index: 2; padding: 0; bottom: 5px; padding-left: 5px; padding-right: 18px; } } @media (min-width: 768px) { .cadreimg > img._img { max-height: unset; } .cadreimg { min-height: 143px; } .saisie .conteneurVignette .vignette_cont { min-width: 190px; } .saisie .conteneurVignette .vignette { min-height: 300px; min-width: 180px; padding: 5px; display: inline-block; } } @media (min-width: 992px) { .saisie .gotop { bottom: 1rem !important; right: 1rem !important; } .tabSaisie.maxsize .labelcou { font-size: 0.7em; } } @media (min-width: 1400px) { .saisie .gotop { bottom: 1rem !important; right: 1rem !important; } .tabSaisie.maxsize .labelcou { font-size: 0.9em; } } @media (min-width: 1550px) { .saisie .gotop { bottom: 3rem !important; right: 10rem !important; } } .vignettes > div:hover > div { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } .conteneurVignette .activeVignette > div { border: 1px solid #ed1e24; } .memetheme { display: inline-flex; margin-left: 5px; margin-bottom: 5px; } .memetheme .vignette { width: 125px; max-height: 145px; padding: 5px; font-size: 0.8rem; cursor: pointer; } .memetheme .cadreimg > img._img { max-height: 100px; } .vignettes .vignette.active { border: 1px solid #ed1e24; } .vignettes .vignette.noclick { box-shadow: none; cursor: unset; } .vignettes { padding-right: 0; padding-left: 0; } .vignettes .vignette { background-color: #fff; border: solid 1px #c2c2c9; margin: 0; } .saisie .gotop { position: fixed; bottom: 1rem; right: 1rem; background-color: rgba(177, 177, 177, 0.1); -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; cursor: pointer; } .saisie .gotop:hover { background-color: rgba(169, 169, 169, 0.5); } .saisie .gotop > .fa { font-size: 1.2em; padding: 10px; } .saisie .vignette > .conteneur_qt { right: 0; bottom: 0; } .saisie .vignette > .desRef { left: 0; bottom: 0; margin: 5px; } .saisie .vignette > .conteneur_img { top: 65px; } .saisie .vignette > .conteneur_qt > div { font-weight: bold; display: inline-block; margin: 5px; bottom: 0; } .saisie .vignette > .contPastille { display: block; margin: 0; bottom: 20px; position: absolute; } .vignette .contPastille > .pastille { height: 15px; width: 15px; display: inline-block; background-color: #fff; border-radius: 20px; } .pastille.rouge { background-color: #dc4141; border: solid 1px #bce8f1; } .order .totaux > .row > .ligne { border-bottom: solid 1px #ccc; } .order .totaux { font-size: 0.9em; color: #444; } .order .totaux *[class^="col-md"], .order .totaux *[class^="col-xs"] { padding-right: 0; padding-left: 5px; } .order .action *[class^="col-md"], .order .action *[class^="col-xs"] { padding-top: 0.2rem; } .order .totaux .ligne { margin-bottom: 0.3rem; padding-bottom: 0.3rem; padding-left: 0.5em; } .order .totaux .ligne p { margin-bottom: 0; } .action .btn { text-transform: uppercase; font-size: 0.85em; } .action .btn + .btn { margin-left: 5px; } .body .datetimepicker table tr td.active, .body .datetimepicker table tr td.active:hover, .body .datetimepicker table tr td.active.disabled, .body .datetimepicker table tr td.active.disabled:hover { background-image: none; border-color: #fff; } .body .datetimepicker table tr td.active, .body .datetimepicker table tr td.active:hover, .body .datetimepicker table tr td.active.disabled, .body .datetimepicker table tr td.active.disabled:hover { background-color: #006dcc; } .table.table-encadre { border: solid 1px #ccc; } .secteurmenu { color: #333; } .secteurmenu.acltive { color: #ed1e24; } .lignenews { border-top: solid 1px #ccc; } .famnews { margin: 0; padding: 10px 10px 0 0; font-size: 1em; font-weight: normal; color: #333; } .famnews > ul { padding-top: 0; padding-left: 10px; margin-top: 0; } .famnews > ul > li { list-style: none; border-top: solid 1px #ccc; padding: 5px 0; } .famnews > ul > li.selected { text-decoration: underline; } .famnews > ul > li:first-child { border-top: 0; } .famnews > ul > li:hover { cursor: pointer; text-decoration: underline; } .contnews { margin: 0; padding: 0; font-size: 0.85em; } .contnews > ul { padding-top: 0; margin-top: 0; padding-left: 0; } .contnews > ul > li:first-child { border-top: 0; margin-top: 0; } .contnews > ul > li:first-child > h3 { margin-top: 0; padding-top: 10px; } .contnews > ul > li { list-style: none; border-bottom: solid 1px #ccc; } .formNews .groupeEtiquette li { margin-top: 2px; list-style: none; } .formNews h3.section > span { border-bottom: solid 1px #000; } .formNews h3.section { margin-top: 15px; } .formNews .pj > b { font-weight: normal; margin-top: 10px; display: block; font-size: 1.1em; } .formNews .news .etiquette { float: none; } .news { padding: 5px 10px; } .news .file { display: block; border-left: solid 4px #747474; padding: 0; } .news .file a { border: solid 1px #ccc; border-radius: 2px; padding: 5px; background-color: #ececec; margin: 2px 5px; display: inline-block; } .news .file a i { margin-right: 5px; } .news .file > a:hover > span, .news .file > a:hover { text-decoration: none; } .news h3 { font-size: 1.1em; color: #000; font-weight: bold; margin-top: 12px; margin-bottom: 15px; } .news .infos { font-size: 0.9em; font-weight: normal; color: #777; padding-left: 4px; } .news .corp { margin-bottom: 10px; } .news .etiquette { display: inline-block; z-index: 1001; padding: 2px 5px; font-weight: bold; letter-spacing: 1px; margin: 0 5px; margin-top: 0; font-size: 0.9em; } .news .etiquette.style1 { background-image: linear-gradient(to right, #f16e00, #f06400); color: #fff; } .news .etiquette.style2 { background-image: linear-gradient(to top right, red, #f06d06); color: #fff; } .news .etiquette.style3 { background-image: linear-gradient(to top right, #5ea9f4, #6ebbf6); color: #fff; } .news .etiquette.el { background-image: linear-gradient(to top right, #15a575, #27b384); color: #fff; } .news .etiquette.br { background-color: #4a4a4a; color: #fff; } @media only screen and (max-width: 767px) { .contTabSaisie, .contTabSaisie table, .contTabSaisie thead, .contTabSaisie tbody, .contTabSaisie th, .contTabSaisie td, .contTabSaisie tr { display: block; } .contTabSaisie tfoot { display: none; } .contTabSaisie tbody { text-align: center; } .contTabSaisie tr.tailles { display: none; } .contTabSaisie thead tr { position: absolute; top: -9999px; left: -9999px; } .contTabSaisie tr { border: 1px solid #ccc; margin-top: 5px; } .contTabSaisie tr.sep { display: block; border: 0; } .contTabSaisie tr.sep > td { text-align: left; } .contTabSaisie tbody tr:nth-child(2n) { margin-left: 3rem; } .contTabSaisie tr, .tabSaisie tbody tr { display: inline-block; width: 45%; margin-top: 2rem; } .contTabSaisie td, .tabSaisie tbody td { border: none; border-bottom: 1px solid #eee; position: relative; white-space: normal; text-align: right; padding: 0; margin: 0; } .tabSaisie .cou:before, .contTabSaisie tr.sep > td:before { border: 0; display: none; } .tabSaisie .brouillonLib:before { border: 0; display: none; } .tabSaisie .brouillonLib { vertical-align: middle; text-align: center; line-height: 2; padding: 2px; font-weight: bold; } .tabSaisie tr.selected > td.brouillonLib, .tabSaisie tr.selected > td.cou { background-color: unset; } .tabSaisie .cou > div, .tabSaisie .cou > .libcou { display: inline-block; vertical-align: middle; text-align: center; line-height: 2; margin: 2px; font-weight: bold; font-size: 1em; } .tabSaisie .cou > div.pastille { z-index: unset; display: inline-block; position: unset; vertical-align: unset; } .contTabSaisie tr:not(.sep) td:not(.brouillonLib):not(.actionLigne):not(.cou):before { position: absolute; display: inline-block; height: 25px; left: 0; width: 25%; padding: 0; padding-right: 10px; vertical-align: middle; white-space: nowrap; text-align: right; font-weight: bold; border-right: solid 1px #ccc; } .contTabSaisie tr:not(.sep) td:not(.totalligne):not(.brouillonLib):not(.actionLigne):not(.cou):before { padding-top: 5px; } .contTabSaisie tr:not(.sep) td.cou { padding-left: 25%; padding-top: 3px; padding-bottom: 3px; } .contTabSaisie td.actionLigne:before { border-right: 0; display: none; } .contTabSaisie td.actionLigne { text-align: center; border: 0; height: unset !important; padding: 5px !important; vertical-align: middle !important; } .contTabSaisie .totalligne { padding-top: 5px; height: 25px; text-align: center; } .tabSaisie tbody td input { text-align: right; border: 0; display: block; margin: 0 1px; min-width: 75%; padding-right: 20%; height: 25px; margin-left: 25%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fdfdfd; } .tabSaisie tbody tr:not(.stock):not(.totaux) td:nth-last-child(3) { padding-right: 0; } .contTabSaisie td:before { content: attr(data-title); } } .log { color: #444; background-color: #f8f9fac2; border-color: #cccccc; } .timeline2 { position: relative; top: 41px; left: -41px; border-radius: 100%; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; background-color: #fff; border: solid 2px #2ca94b87; line-height: 0; } .timeline2 { position: relative; top: 41px; left: -41px; border-radius: 100%; width: 35px; height: 35px; display: flex; justify-content: center; align-items: center; background-color: #fff; border: solid 2px #28a745; line-height: 0; } .hist { border-left: solid 3px #28a745; } .totaux label, .totaux h6 { font-size: 0.9rem !important; } .totaux h6 { font-weight: 600 !important; } .totaux .titre label { font-weight: 600 !important; } .clients { border: solid 1px #ccc; border-radius: 5px; } .clients thead > tr > th, .clients tbody > tr > th, .clients tfoot > tr > th, .clients thead > tr > td, .clients tbody > tr > td, .clients tfoot > tr > td { padding: 0.5em; } .activation.on { transition: 0.3s; color: #4caf50; } .activation.off { transition: 0.3s; color: #444444b3; } .activation.erreur { color: #ccc; } .activation:hover { color: #007bff; } .welcome-header { background: #fff; border-radius: 6px; padding: 0.75rem 1rem; margin-bottom: 1rem; border: 1px solid #e0e0e0; box-shadow: none; } .welcome-header h1 { font-size: 1.25rem; font-weight: 600; margin-bottom: 0.15rem; color: #333; } .welcome-header p { font-size: 0.8rem; color: #999; margin: 0; } .welcome-header i[class*="fa-"] { color: #01972b; } .table-card { border: 1px solid #e0e0e0; border-radius: 6px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); background: #fff; overflow: hidden; } .table-header { background: #fff; border-bottom: 1px solid #f0f0f0; } .table-header .form-group { position: relative; } .table-header .form-group::before { content: "\f002"; font-family: "Font Awesome 5 Pro"; font-weight: 400; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: #999; font-size: 0.9rem; pointer-events: none; z-index: 1; } .table-header .form-control { border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.6rem 1.2rem 0.6rem 2.5rem; font-size: 0.9rem; transition: all 0.3s ease; background: #fafafa; } .table-header .form-control:focus { border-color: #01972b; box-shadow: 0 0 0 3px rgba(1, 151, 43, 0.1); background: #fff; outline: none; } .table-header .form-control::placeholder { color: #999; font-style: italic; } .btn-clear-search { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); background: transparent; border: none; color: #999; padding: 0.25rem; cursor: pointer; transition: all 0.2s ease; z-index: 2; } .btn-clear-search:hover { color: #dc3545; } .table-modern, .table-card ._table table { width: 100% !important; background: #fff !important; border: none !important; margin-bottom: 0 !important; border-collapse: separate !important; border-spacing: 0 !important; } .table-modern thead, .table-card ._table table thead { background: #fafafa !important; } .table-modern thead th, .table-card ._table table thead th { padding: 0.75rem 1rem !important; font-weight: 600 !important; font-size: 0.75rem !important; color: #999 !important; text-transform: uppercase !important; letter-spacing: 1.2px !important; border: none !important; background: #fafafa !important; white-space: nowrap !important; } .table-modern tbody tr, .table-card ._table table tbody tr { border-bottom: 1px solid #f0f0f0 !important; } .table-modern tbody tr:hover, .table-card ._table table tbody tr:hover { background-color: #e8f5e9 !important; } .table-modern tbody tr:last-child, .table-card ._table table tbody tr:last-child { border-bottom: none !important; } .table-modern tbody td, .table-card ._table table tbody td { padding: 0.6rem 1rem !important; color: #495057 !important; font-size: 0.875rem !important; vertical-align: middle !important; border: none !important; } .table-modern tbody td:first-child, .table-card ._table table tbody td:first-child { font-weight: 600 !important; color: #2c3e50 !important; } .table-card ._table table tbody tr { cursor: pointer; } .table-card .pagination { display: flex; gap: 0.35rem; align-items: center; } .table-card .pagination .page-item .page-link { border: none; border-radius: 8px; padding: 0.5rem 0.85rem; font-size: 0.875rem; font-weight: 500; color: #495057; background-color: #f8f9fa; transition: all 0.2s ease; min-width: 38px; text-align: center; } .table-card .pagination .page-item .page-link:hover { background-color: #e9f5ec; color: #01972b; } .table-card .pagination .page-item.active .page-link { background-color: #01972b; color: white; box-shadow: 0 2px 8px rgba(1, 151, 43, 0.3); } .form-check-input:checked { background-color: #01972b; border-color: #01972b; } @media (max-width: 768px) { .welcome-header { padding: 0.6rem 0.8rem; } .welcome-header h1 { font-size: 1.1rem; } .table-card ._table table tbody td { padding: 0.5rem 0.75rem !important; font-size: 0.8rem !important; } } @keyframes skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .skeleton-cell { height: 0.85rem; width: 100%; background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%); background-size: 200% 100%; animation: skeleton-shimmer 1.5s ease-in-out infinite; border-radius: 3px; } ._skeleton-table thead th { border-top: none; } ._skeleton-table tbody td { padding: 0.65rem 0.75rem !important; } .nav-link.dropdown-toggle:hover { background-color: #f0f0f0 !important; transform: translateY(-1px); } .dropdown-item.rounded-item:hover { background-color: #01972b !important; color: white !important; padding-left: 1.2rem !important; } .dropdown-item.rounded-item:hover i { color: white !important; } .rounded { border-radius: 0.45rem !important; } .fa-color { color: #01972b; transition: color 0.2s ease; } .dropdown-item.text-danger.rounded-item:hover { background-color: #dc3545 !important; } .dropdown-toggle[aria-expanded="true"] .fa-chevron-down { transform: rotate(180deg); transition: transform 0.3s ease; } .dropdown-toggle .fa-chevron-down { transition: transform 0.3s ease; } .sidebar { border-right: 1px solid #e0e0e0; } .sidebar-link { color: #666; transition: all 0.2s ease; border: 1px solid transparent; font-size: 0.95rem; } .sidebar-link:hover { background-color: #f8f9fa !important; color: #01972b !important; padding-left: 1rem !important; border-left: 3px solid #01972b; } .sidebar-link.active { background-color: #e8f5e9 !important; color: #01972b !important; font-weight: 600; border-left: 3px solid #01972b; } .sidebar-link i { color: #999; transition: color 0.2s ease; } .sidebar-link:hover i, .sidebar-link.active i { color: #01972b !important; } .sidebar-link.text-danger:hover { background-color: #fff5f5 !important; border-left: 3px solid #dc3545 !important; text-decoration: none !important; } .sidebar-link.text-danger:hover i { color: #dc3545 !important; } .sidebar-dropdown-toggle { cursor: pointer; color: #666; font-weight: 500; } .sidebar-dropdown-toggle:hover { background-color: #f8f9fa !important; color: #01972b !important; text-decoration: none; } .sidebar-dropdown-toggle .fa-chevron-down { transition: transform 0.3s ease; } .sidebar-dropdown-toggle[aria-expanded="true"] .fa-chevron-down { transform: rotate(180deg); } .sidebar::-webkit-scrollbar { width: 6px; } .sidebar::-webkit-scrollbar-track { background: #f1f1f1; } .sidebar::-webkit-scrollbar-thumb { background: #c1c1c1; border-radius: 3px; } .sidebar::-webkit-scrollbar-thumb:hover { background: #999; } .sidebar.collapsed { transform: translateX(-260px); } .main-content.expanded { margin-left: 0 !important; width: 100% !important; } #sidebarToggle { border: none; background: transparent; transition: all 0.3s ease; } #sidebarToggle:hover { color: #01972b !important; transform: scale(1.1); } .top-bar { border-bottom: 1px solid #e0e0e0; } @media (max-width: 768px) { .sidebar { transform: translateX(-260px); } .sidebar.show { transform: translateX(0); } .main-content { margin-left: 0 !important; width: 100% !important; } } .dashboard-card { border: 1px solid #e0e0e0; border-radius: 8px; box-shadow: none; transition: all 0.2s ease; height: 100%; background: #fff; cursor: pointer; text-decoration: none; display: flex; flex-direction: column; color: inherit; overflow: hidden; } .dashboard-card:hover { background-color: #f8f9fa; border-left: 3px solid #01972b; border-color: #01972b; text-decoration: none; color: inherit; padding-left: 2px; } .dashboard-icon { width: 45px; height: 45px; border-radius: 6px; display: flex; align-items: center; justify-content: center; margin: 0 auto; font-size: 1.3rem; transition: all 0.2s ease; background: #f5f5f5; color: #999; } .dashboard-card:hover .dashboard-icon { background-color: #e8f5e9; color: #01972b; transform: translateY(-2px); } .dashboard-title { font-size: 0.95rem; font-weight: 600; color: #333; margin-bottom: 0.4rem; } .dashboard-description { font-size: 0.8rem; color: #999; line-height: 1.3; } .welcome-header { background: #fff; border-radius: 6px; padding: 0.75rem 1rem; margin-bottom: 1rem; border: 1px solid #e0e0e0; box-shadow: none; } .welcome-header h1 { font-size: 1.25rem; font-weight: 600; margin-bottom: 0.15rem; color: #333; } .welcome-header p { font-size: 0.8rem; color: #999; margin: 0; } .welcome-header .fa-shield-alt, .welcome-header .fa-store, .welcome-header .fa-truck, .welcome-header .fa-users, .welcome-header .fa-book, .welcome-header i[class*="fa-"] { color: #01972b; } .btn { border-radius: 6px; font-weight: 500; font-size: 0.9rem; padding: 0.5rem 1.2rem; transition: all 0.2s ease; border: none; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); } .btn:hover { box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); } .btn:active { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } .btn-primary { background: #01972b; color: white; border: none; } .btn-primary:hover { background: #005f19; color: white; box-shadow: 0 4px 12px rgba(1, 151, 43, 0.3); } .btn-primary:active, .btn-primary:focus { background: #016a1f; color: white; outline: none; box-shadow: 0 2px 8px rgba(1, 151, 43, 0.4); } .btn-secondary { background: #ffffff; color: #666; border: 1px solid #d0d0d0; } .btn-secondary:hover { background: #f8f9fa; color: #333; border-color: #b0b0b0; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); } .btn-icon { padding: 0.375rem 0.5rem; } .btn-sm { padding: 0.35rem 0.9rem; font-size: 0.85rem; } .btn-lg { padding: 0.65rem 1.5rem; font-size: 1rem; } .btn i { margin-right: 0.4rem; } .btn i:last-child { margin-right: 0; margin-left: 0.4rem; } .btn-outline-primary { background: transparent; color: #01972b; border: 2px solid #01972b; box-shadow: none; } .btn-outline-primary:hover { background: #01972b; color: white; border-color: #01972b; } .btn-outline-secondary { background: transparent; color: #666; border: 2px solid #e0e0e0; box-shadow: none; } .btn-outline-secondary:hover { background: #666; color: white; border-color: #666; } .btn-group .btn { border-radius: 0; } .btn-group .btn:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; } .btn-group .btn:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } .btn:disabled, .btn.disabled { opacity: 0.5; cursor: not-allowed; transform: none !important; } .btn:disabled:hover, .btn.disabled:hover { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); } .btn-action-link { background: #01972b; color: white; border: none; border-radius: 6px; padding: 0.5rem 1.2rem; font-size: 0.9rem; font-weight: 500; transition: all 0.2s ease; box-shadow: 0 2px 6px rgba(1, 151, 43, 0.25); } .btn-action-link:hover { background: #017a23; color: white !important; transform: translateY(-2px); box-shadow: 0 4px 12px rgba(1, 151, 43, 0.35); } .btn-action-link i { color: white; transition: all 0.2s ease; } .btn-action-link:hover i { color: white !important; } .btn-action-link-subtle { background: #01972b; color: white; border: none; border-radius: 6px; padding: 0.5rem 1rem; font-size: 0.85rem; font-weight: 500; transition: all 0.2s ease; box-shadow: none; } .btn-action-link-subtle:hover { background: #017a23; color: white; } .btn-action-link-subtle i { color: white; } .btn-action-link-subtle:hover i { color: white; } .btn-new-magasin { background: #01972b; color: white; border: none; border-radius: 6px; padding: 0.5rem 1rem; font-size: 0.85rem; font-weight: 500; cursor: pointer; transition: background 0.2s ease; display: inline-flex; align-items: center; gap: 0.4rem; } .btn-new-magasin:hover { background: #017a23; } .btn-new-magasin i { font-size: 0.8rem; } .btn-clear-search { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); background: transparent; border: none; color: #999; padding: 0.25rem; cursor: pointer; transition: all 0.2s ease; z-index: 2; } .btn-clear-search:hover { color: #dc3545; } .btn-clear-search i { font-size: 0.85rem; } .filter-buttons { display: flex; gap: 0.5rem; } .btn-filter { background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.6rem 0.9rem; color: #666; cursor: pointer; transition: all 0.2s ease; font-size: 0.9rem; } .btn-filter:hover { background: #e9ecef; color: #01972b; border-color: #01972b; transform: translateY(-1px); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08); } .btn-filter i { color: #999; transition: color 0.2s ease; } .btn-filter:hover i { color: #01972b; } .sort-icon { color: #ddd; font-size: 0.7rem; margin-left: 0.4rem; transition: all 0.2s ease; } .table-modern thead th:hover, ._table table thead th:hover { text-decoration: none !important; } .table-modern thead th:hover .sort-icon, ._table table thead th:hover .sort-icon { color: #01972b; } .table-modern thead th.sort-asc .sort-icon, .table-modern thead th.sort-desc .sort-icon, ._table table thead th.sort-asc .sort-icon, ._table table thead th.sort-desc .sort-icon { color: #01972b !important; } .table-card { border: 1px solid #e0e0e0; border-radius: 6px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); background: #fff; overflow: hidden; } .table-header { background: #fff; border-bottom: 1px solid #f0f0f0; } .table-header .form-group { position: relative; } .table-header .form-group::before { content: "\f002"; font-family: "Font Awesome 5 Pro"; font-weight: 400; position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: #999; font-size: 0.9rem; pointer-events: none; z-index: 1; } .table-header .form-control { border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.6rem 1.2rem 0.6rem 2.5rem; font-size: 0.9rem; transition: all 0.3s ease; background: #fafafa; } .table-header .form-control:focus { border-color: #01972b; box-shadow: 0 0 0 3px rgba(1, 151, 43, 0.1); background: #fff; outline: none; } .table-header .form-control:focus ~ .table-header .form-group::before, .table-header .form-control:focus + ::before { color: #01972b; } .table-header .form-control::placeholder { color: #999; font-style: italic; } .table-modern, ._table table { width: 100% !important; background: #fff !important; border: none !important; margin-bottom: 0 !important; border-collapse: separate !important; border-spacing: 0 !important; } .table-modern thead, ._table table thead { background: #fafafa !important; border-bottom: none !important; } .table-modern thead th, ._table table thead th { padding: 0.75rem 1rem !important; font-weight: 600 !important; font-size: 0.75rem !important; color: #999 !important; text-transform: uppercase !important; letter-spacing: 1.2px !important; border: none !important; cursor: default !important; transition: all 0.2s ease !important; white-space: nowrap !important; background: #fafafa !important; } .table-modern tbody tr, ._table table tbody tr { transition: background-color 0s !important; border-bottom: 1px solid #f0f0f0 !important; position: relative !important; } .table-modern tbody tr:hover, ._table table tbody tr:hover, .table-modern tbody tr.clickable:hover, ._table table tbody tr.clickable:hover, table tbody tr:hover { background-color: #e8f5e9 !important; } .table-modern tbody tr:last-child, ._table table tbody tr:last-child { border-bottom: none !important; } .table-modern tbody td, ._table table tbody td { color: #495057 !important; font-size: 0.875rem !important; font-weight: 400 !important; vertical-align: middle !important; border: none !important; } .table-modern tbody td:first-child, ._table table tbody td:first-child { font-weight: 600 !important; color: #2c3e50 !important; font-size: 0.875rem !important; } table tbody tr[data-href], table tbody tr.clickable { cursor: pointer; } table tbody tr[data-href]:hover, table tbody tr.clickable:hover { background-color: #f8f9fa !important; } table tbody td i.fa-check-circle { color: #01972b; font-size: 1.1rem; } table tbody td i.fa-times-circle { color: #dc3545; font-size: 1.1rem; } table.table-striped tbody tr:nth-child(odd) { background-color: #ffffff; } table.table-striped tbody tr:nth-child(even) { background-color: #f5f5f5; } table.table-striped tbody tr:hover { background-color: #e8f5e9 !important; } table.table-striped tbody td { font-size: 0.9rem !important; } table.table-striped thead th { font-size: 0.7rem !important; } table.table-bordered td, table.table-bordered th { border: 1px solid #e0e0e0; } table.table-sm thead th, table.table-sm tbody td { padding: 0.5rem 0.75rem; font-size: 0.85rem; } table tbody td.actions { text-align: right; white-space: nowrap; } table tbody td.actions .btn { margin-left: 0.3rem; } @media (max-width: 768px) { table { font-size: 0.85rem; } table thead th, table tbody td { padding: 0.6rem 0.75rem; } } .breadcrumb { background: transparent; padding: 0.75rem 0; margin-bottom: 1rem; border-radius: 0; font-size: 0.875rem; } .breadcrumb-item { color: #6c757d; } .breadcrumb-item a { color: #01972b; text-decoration: none; transition: all 0.2s ease; font-weight: 500; } .breadcrumb-item a:hover { color: #017a23; text-decoration: none; } .breadcrumb-item.active { color: #495057; font-weight: 600; } .breadcrumb-item + .breadcrumb-item::before { content: "›"; color: #adb5bd; font-size: 1.1rem; padding-right: 0.5rem; } .breadcrumb-item i { font-size: 0.85rem; } .welcome-header .breadcrumb { padding: 0; margin-bottom: 0.5rem; font-size: 0.8rem; } .welcome-header .breadcrumb-item, .welcome-header .breadcrumb-item a { font-size: 0.8rem; } .welcome-header .breadcrumb-item + .breadcrumb-item::before { font-size: 1rem; padding-right: 0.4rem; } .breadcrumb-navigation { gap: 0; margin-bottom: 1rem !important; } .breadcrumb-card { background: #fff; border: 1px solid #e0e0e0; border-radius: 6px; padding: 0.65rem 0.9rem; min-width: 200px; transition: all 0.2s ease; box-shadow: none; } .breadcrumb-card-link { text-decoration: none; cursor: pointer; } .breadcrumb-card-link:hover { border-color: #01972b; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); text-decoration: none; } .breadcrumb-card-link:hover .breadcrumb-icon { background: #e8f5e9; } .breadcrumb-card-link:hover .breadcrumb-icon i { color: #01972b; } .breadcrumb-card-active { background: #fff; border: 1.5px solid #01972b; box-shadow: 0 1px 3px rgba(1, 151, 43, 0.1); } .breadcrumb-icon { width: 36px; height: 36px; background: #f5f5f5; border-radius: 6px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.2s ease; } .breadcrumb-card-active .breadcrumb-icon { background: #e8f5e9; } .breadcrumb-icon i { font-size: 1.1rem; color: #666; transition: color 0.2s ease; } .breadcrumb-card-active .breadcrumb-icon i { color: #01972b; } .breadcrumb-title { font-weight: 600; font-size: 0.9rem; color: #2c3e50; line-height: 1.3; margin-bottom: 0.1rem; } .breadcrumb-subtitle { font-size: 0.7rem; color: #6c757d; line-height: 1.2; } .breadcrumb-arrow { color: #adb5bd; font-size: 1.1rem; flex-shrink: 0; } @media (max-width: 768px) { .breadcrumb-navigation { flex-direction: column; } .breadcrumb-card { width: 100%; min-width: 100%; } .breadcrumb-arrow { transform: rotate(90deg); margin: 0.75rem 0; } } .form-card { border: 1px solid #e9ecef; border-radius: 6px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); margin-bottom: 2rem; } .form-card .card-body { padding: 1.25rem 1.5rem; } .form-group.row { margin-bottom: 0.75rem; } .form-group.row.mb-4 { margin-bottom: 0.75rem !important; } .form-card .col-form-label { color: #495057; font-size: 0.9rem; font-weight: 500; padding-top: 0.4rem; padding-bottom: 0.4rem; } .form-card .col-form-label .text-danger { color: #dc3545; font-weight: 600; } .form-card .form-control { border: 1px solid #ced4da; border-radius: 6px; padding: 0.5rem 0.85rem; font-size: 0.9rem; transition: all 0.2s ease; background-color: #fff; } .form-card .form-control:focus { border-color: #01972b; box-shadow: 0 0 0 0.15rem rgba(1, 151, 43, 0.15); background-color: #fff; outline: none; } .form-card .form-control::placeholder { color: #adb5bd; font-style: italic; font-size: 0.875rem; } .form-card .custom-control-label { color: #495057; font-size: 0.9rem; font-weight: 400; } .form-card .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before { background-color: #01972b; border-color: #01972b; } .form-card .custom-checkbox .custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 0.15rem rgba(1, 151, 43, 0.15); } .form-card ._actions { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e9ecef; } .form-card ._actions .btn { min-width: 120px; font-weight: 500; } .form-group.row.align-items-center .col-form-label { padding-top: 0.5rem; } @media (max-width: 768px) { .form-card .card-body { padding: 1.5rem 1rem; } .form-card .col-form-label { text-align: left !important; margin-bottom: 0.5rem; } .form-card ._actions .btn { width: 100%; margin-bottom: 0.5rem; } } .pagination { display: flex; gap: 0.35rem; align-items: center; } .pagination .page-item .page-link { border: none; border-radius: 8px; padding: 0.5rem 0.85rem; font-size: 0.875rem; font-weight: 500; color: #495057; background-color: #f8f9fa; transition: all 0.2s ease; min-width: 38px; text-align: center; } .pagination .page-item .page-link:hover { background-color: #e9f5ec; color: #01972b; transform: translateY(-1px); box-shadow: 0 2px 4px rgba(1, 151, 43, 0.15); } .pagination .page-item.active .page-link { background-color: #01972b; color: white; box-shadow: 0 2px 8px rgba(1, 151, 43, 0.3); } .pagination .page-item.active .page-link:hover { background-color: #017a23; color: white; transform: translateY(-1px); } .pagination .page-item:first-child .page-link, .pagination .page-item:last-child .page-link { font-size: 1rem; padding: 0.45rem 0.75rem; } .pagination .page-item.disabled .page-link { background-color: #f1f3f5; color: #adb5bd; cursor: not-allowed; box-shadow: none; } .pagination .page-item.disabled .page-link:hover { transform: none; box-shadow: none; } body.layout-top .sidebar.sidebar-top-hidden { transform: translateY(-100%); transition: transform 0.3s ease; } body.layout-top .sidebar { width: 100% !important; height: auto !important; position: fixed !important; top: 0; left: 0; right: 0; bottom: auto !important; overflow: visible !important; border-right: none; border-bottom: 1px solid #e0e0e0; z-index: 1020; transition: transform 0.3s ease; } body.layout-top .sidebar-content { flex-direction: row !important; align-items: center !important; min-height: auto !important; padding: 0.4rem 1rem !important; gap: 0.5rem; } body.layout-top .sidebar-header { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; flex-shrink: 0; } body.layout-top .sidebar-header a { margin-bottom: 0 !important; } body.layout-top .sidebar-header a > div { display: none; } body.layout-top .sidebar-header > .d-flex:last-child { padding: 0.2rem 0.5rem !important; font-size: 0.75rem; margin-left: 0.5rem; flex-shrink: 0; } body.layout-top .sidebar-header > .d-flex:last-child i { font-size: 0.8rem !important; margin-right: 0.25rem !important; } body.layout-top .sidebar-header > .d-flex:last-child span { font-size: 0.75rem !important; } body.layout-top .sidebar-header { display: flex !important; flex-direction: row !important; align-items: center !important; } body.layout-top ._sidebarMenu { display: flex !important; flex-direction: row !important; align-items: center; justify-content: center; gap: 0.15rem; flex-grow: 1 !important; overflow: visible !important; flex-wrap: wrap; } body.layout-top ._sidebarMenu > .mb-1, body.layout-top ._sidebarMenu > .mb-2 { margin-bottom: 0 !important; position: relative; flex-shrink: 0; } body.layout-top ._sidebarMenu .sidebar-link { white-space: nowrap; padding: 0.35rem 0.75rem !important; font-size: 0.85rem; border: none !important; } body.layout-top ._sidebarMenu .sidebar-link:hover, body.layout-top ._sidebarMenu .sidebar-link.active { border-left: none !important; padding-left: 0.75rem !important; } body.layout-top ._sidebarMenu > .border-top { border-top: none !important; border-left: 1px solid #dee2e6 !important; margin-top: 0 !important; padding-top: 0 !important; padding-left: 0.5rem; margin-left: 0.25rem; } body.layout-top ._sidebarMenu .sidebar-dropdown-toggle .fa-chevron-down { display: inline-block !important; font-size: 0.65rem; margin-left: 0.3rem; transform: none !important; } body.layout-top ._sidebarMenu .collapse, body.layout-top ._sidebarMenu .collapsing { position: absolute !important; top: 100%; left: 0; background: #fff; border: 1px solid #e0e0e0; border-radius: 0.5rem; box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); z-index: 1050; min-width: 200px; height: auto !important; overflow: visible !important; transition: none !important; display: none !important; } body.layout-top ._sidebarMenu .collapse.show { display: block !important; } body.layout-top ._sidebarMenu .collapsing { display: block !important; height: auto !important; } body.layout-top ._sidebarMenu .collapse .nav, body.layout-top ._sidebarMenu .collapsing .nav { margin-left: 0 !important; padding: 0.25rem 0; } body.layout-top ._sidebarMenu .collapse .sidebar-link, body.layout-top ._sidebarMenu .collapsing .sidebar-link { white-space: nowrap; } body.layout-top .sidebar-footer { margin-top: 0 !important; margin-left: auto; border-top: none !important; padding-top: 0 !important; flex-shrink: 0; } body.layout-top .sidebar-footer > div { display: flex; align-items: center; } body.layout-top .sidebar-footer a { padding: 0.3rem 0.5rem !important; white-space: nowrap; } body.layout-top .sidebar-footer a > div > div:last-child { display: none; } body.layout-top .sidebar-footer a > div { display: none; } body.layout-top .sidebar-footer a > i { margin-right: 0 !important; } body.layout-top .main-content { margin-left: 0 !important; width: 100% !important; } body.layout-top .globalContent { margin: 0 auto !important; } @media (max-width: 1200px) { body.layout-top ._sidebarMenu .sidebar-link { padding: 0.3rem 0.5rem !important; font-size: 0.8rem; } body.layout-top .sidebar-header a img { height: 30px !important; } } @media (max-width: 1100px) { body.layout-top ._sidebarMenu .sidebar-link > i, body.layout-top ._sidebarMenu .sidebar-link > span > i { display: none; } } .layout-toggle-btn { background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 0.375rem; padding: 0.4rem 0.6rem; color: #555; cursor: pointer; font-size: 0.9rem; transition: all 0.2s ease; white-space: nowrap; flex-shrink: 0; } .layout-toggle-btn:hover { background: #e9ecef; color: #01972b; border-color: #01972b; } .bg-orange { background-color: #fed7aa; } .bg-red { background-color: #fecdd3; } .saisieRequete .touteslesref, .saisieRequete .tabTotaux { margin: 0; padding: 0; } .saisieRequete .sticky { padding: 10px; } .saisieRequete .sticky ol { margin-right: 0; margin-left: 0; } .saisieRequete .touteslesref li, .saisieRequete .tabTotaux li { border: 1px solid #e0e0e0; border-radius: 6px; list-style-type: none; margin: 0 0 6px 0; overflow: hidden; } .saisieRequete .touteslesref li h4, .saisieRequete .tabTotaux li h4 { margin: 0; font-size: 12px; font-weight: 600; color: #333; background-color: #f8f9fa; padding: 6px 10px; border-bottom: 1px solid #e0e0e0; } .saisieRequete .tabTotaux > li, .saisieRequete .tabTotaux .tabsaisie { background-color: #f8f9fa; padding: 0; } .saisieRequete .tabTotaux .tothtpa, .saisieRequete .tabTotaux .tothtpv { text-align: center; } .tabsaisie._footer { background: none; } .saisieRequete .tr-danger { font-weight: bold; color: #dc3545 !important; } .saisieRequete table { border-spacing: 0; width: 100%; } .saisieRequete table tr td, .saisieRequete table tr th { text-align: center; font-size: 12px !important; padding: 3px 2px; } .saisieRequete table thead th { background-color: #f8f9fa; color: #555; font-weight: 600; text-transform: uppercase; font-size: 10px !important; letter-spacing: 0.3px; padding: 6px 4px; border-bottom: 2px solid #e0e0e0; white-space: nowrap; } .saisieRequete table tbody tr { border-bottom: 1px solid #f0f0f0; } .saisieRequete table tbody tr:hover { background-color: #fafafa; } .saisieRequete table td { border: none; vertical-align: middle; } .saisieRequete table .collection { min-width: 30px; } .saisieRequete table .taille { width: 30px; } .saisieRequete table .couleur { width: 175px; min-width: 130px; text-align: left; } .saisieRequete table .reffou { width: 150px; min-width: 90px; } .saisieRequete table .col { width: 30px; } .saisieRequete ._totqt { text-align: center; font-weight: 600; } .saisieRequete .ht { text-align: right; } .saisieRequete .prix { text-align: right; color: #666; } .saisieRequete .totalQt { min-width: 30px; max-width: 30px; } .saisieRequete .pa, .saisieRequete .pv { width: 50px; } .saisieRequete .totalAchat, .saisieRequete .totalVente { width: 75px; min-width: 40px; } .saisieRequete .titreLigne { text-align: right; padding: 2px 10px 2px 0; font-weight: 700; border: 0; color: #333; } .saisieRequete .tabsaisie { margin: 0; padding: 2px 4px; } .saisieRequete .tabsaisie input { width: 45px; padding: 3px 2px; margin: 0; border: 1px solid #ccc; border-radius: 4px; text-align: center; font-size: 12px; transition: border-color 0.15s; } .saisieRequete .tabsaisie input:hover { border-color: #999; } .saisieRequete .tabsaisie input:focus { outline: none !important; border-color: #01972b; box-shadow: 0 0 0 2px rgba(1, 151, 43, 0.15); } .saisieRequete .tabsaisie .qtGeneral, .saisieRequete .tabsaisie .magtitle { padding: 2px; margin: 0; } .saisieRequete .inactif input { background-color: #f0f0f0; border-color: #e0e0e0; } .saisieRequete #saisie input { width: 40px; padding: 0; margin: 0; margin-bottom: 5px; } .saisieRequete table .focus { background-color: rgba(1, 151, 43, 0.08); } .saisieRequete table .inpfocus { background-color: #fef9c3; border-color: #f59e0b !important; } .saisieRequete table tfoot .qt { text-align: center; } .saisieRequete table tfoot .ht { text-align: center; } .saisieRequete .like-body { width: 100%; position: relative; } .saisieRequete .fixed-ct { bottom: 0; position: sticky; } .saisieRequete .contRefs { max-height: 75%; overflow-y: auto; margin-top: 95px; position: absolute; width: 100%; margin-bottom: 95px; } .saisieRequete select[name="depsource"] { min-width: 60px; padding: 2px 4px; border: 1px solid #ccc; border-radius: 4px; font-size: 11px; background-color: #fff; } .saisieRequete select[name="depsource"]:focus { border-color: #01972b; outline: none; } .fullscreen { position: absolute; top: 0; right: 0; z-index: 1000; width: 100%; } .fullscreen .saisieRequete table tr td, .fullscreen .saisieRequete table tr th { font-size: 13px !important; font-weight: 500; } .fullscreen .fixed-bottom { width: 100%; max-width: none; } .fullscreen .saisieRequete .tabsaisie input { width: 50px; } .fullscreen .saisieRequete .magtitle { min-width: 52px; } .fullscreen .saisieRequete .pa, .fullscreen .saisieRequete .pv { width: 50px; } .saisieRequete { width: max-content; min-width: 100%; } .reasaisie .tabsaisie { border-collapse: collapse; } .reasaisie td, .reasaisie th { padding: 0; } .reasaisie td.qt input { border-radius: 0; } .reasaisie .tabsaisie .qtGeneral, .reasaisie .tabsaisie .magtitle { padding: 0; } .reasaisie input:not(:placeholder-shown) { background-color: #d3e8ff; } span.effacer { color: #b7b7b7; } span.effacer:hover { color: #000; } .refSansQt { display: none; } input.dateLiv { width: 69px !important; padding: 2px; margin: 0; border: solid 1px #444; border-radius: 2px; } th.dateLiv { width: 69px !important; } input.dateLiv[disabled] { background-color: #d3d3d3; } input.dateLiv.erreur { border: solid 2px red; } .actionsSaisie { top: 0; position: sticky; z-index: 111; transition: box-shadow 0.2s; } .actionsSaisie.stuck { box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); border-color: transparent; } .card-totaux { border-top: 3px solid #01972b; box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1); } .card-totaux .card-header { background-color: #f0f7f2; color: #01972b; border-bottom: 1px solid #c8e6d0; } .depDestDesabled { background-color: #ccc !important; } .selectDesabled { min-width: 60px; color: #ccc; background-color: #ccc; } .legende-sample { display: inline-block; width: 14px; height: 14px; border: 1px solid #aaa; border-radius: 2px; margin-right: 3px; vertical-align: middle; } .legende-sans-stock { background-color: #fff; } .legende-prerempli { background-color: #d3e8ff; } .legende-avec-vente { background-color: #fed7aa; } .legende-sans-vente { background-color: #fecdd3; } .legende-stock-negatif { background: #ede9fe; } input.bg-negative { background: #ede9fe !important; } input._depasseStock { background-color: #fee2e2 !important; border-color: #ef4444 !important; outline: 1px solid #ef4444; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: transparent; } #wrapper { padding-left: 0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } #wrapper.toggled { padding-left: 220px; } #sidebar-wrapper { z-index: 1000; left: 220px; width: 0; height: 100%; margin-left: -220px; overflow-y: auto; overflow-x: hidden; background: #1a1a1a; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } #sidebar-wrapper::-webkit-scrollbar { display: none; } #wrapper.toggled #sidebar-wrapper { width: 220px; } #page-content-wrapper { width: 100%; } #wrapper.toggled #page-content-wrapper { position: absolute; margin-right: -220px; } .sidebar-nav { position: absolute; top: 0; width: 220px; margin: 0; padding: 0; list-style: none; } .sidebar-nav li { position: relative; line-height: 20px; display: inline-block; width: 100%; } .sidebar-nav li:before { content: ""; position: absolute; top: 0; left: 0; z-index: -1; height: 100%; width: 3px; background-color: #1c1c1c; -webkit-transition: width 0.2s ease-in; -moz-transition: width 0.2s ease-in; -ms-transition: width 0.2s ease-in; transition: width 0.2s ease-in; } .sidebar-nav li a { color: #fff; } .sidebar-nav li:hover:before, .sidebar-nav li.open:hover:before { width: 100%; -webkit-transition: width 0.2s ease-in; -moz-transition: width 0.2s ease-in; -ms-transition: width 0.2s ease-in; transition: width 0.2s ease-in; } .sidebar-nav li a { display: block; color: #ddd; text-decoration: none; padding: 10px 15px 10px 30px; } .sidebar-nav li a:hover, .sidebar-nav li a:active, .sidebar-nav li a:focus, .sidebar-nav li.open a:hover, .sidebar-nav li.open a:active, .sidebar-nav li.open a:focus { color: #fff; text-decoration: none; background-color: #ed1e24; } .sidebar-nav > .sidebar-brand { height: 65px; font-size: 20px; line-height: 44px; } .sidebar-nav .dropdown-menu { position: relative; width: 100%; padding: 0; margin: 0; border-radius: 0; border: none; background-color: #222; box-shadow: none; } .hamburger2 { margin-top: 20px; z-index: 9999; display: block; width: 30px; height: 20px; background: transparent; border: none; } .hamburger { position: relative; margin-top: 10px; z-index: 9999; display: block; width: 30px; height: 30px; background: transparent; border: none; display: block; } .hamburger:hover, .hamburger:focus, .hamburger:active { outline: none; } .hamburger.is-closed:before { content: ""; display: block; width: 100px; font-size: 14px; color: #fff; line-height: 32px; text-align: center; opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-closed:hover:before { opacity: 1; display: block; -webkit-transform: translate3d(-100px, 0, 0); transform: translate3d(-100px, 0, 0); -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom, .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom { position: absolute; left: 0; height: 4px; width: 100%; } .hamburger.is-closed .hamb-top, .hamburger.is-closed .hamb-middle, .hamburger.is-closed .hamb-bottom { background-color: #9e9e9e; } .hamburger.is-closed .hamb-top { top: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-closed .hamb-middle { top: 50%; margin-top: -2px; } .hamburger.is-closed .hamb-bottom { bottom: 5px; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-closed:hover .hamb-top { top: 0; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-closed:hover .hamb-bottom { bottom: 0; -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-middle, .hamburger.is-open .hamb-bottom { background-color: #9e9e9e; } .hamburger.is-open .hamb-top, .hamburger.is-open .hamb-bottom { top: 50%; margin-top: -2px; } .hamburger.is-open .hamb-top { -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); transition: transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); } .hamburger.is-open .hamb-middle { display: none; } .hamburger.is-open .hamb-bottom { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); transition: transform 0.2s cubic-bezier(0.73, 1, 0.28, 0.08); } .hamburger.is-open:before { content: ""; display: block; width: 100px; font-size: 14px; color: #fff; line-height: 32px; text-align: center; opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .hamburger.is-open:hover:before { opacity: 1; display: block; -webkit-transform: translate3d(-100px, 0, 0); transform: translate3d(-100px, 0, 0); -webkit-transition: all 0.35s ease-in-out; transition: all 0.35s ease-in-out; } .overlay { position: fixed; display: none; width: 100%; height: 100%; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(250, 250, 250, 0.8); z-index: 5; }