@font-face {
  font-family: principale;
  src: url(/admin/assets/fonts/Roboto-VariableFont.ttf) format('truetype');
}
        
        :root {
            --bg-degrade-blanc : radial-gradient(circle at 10% 20%, rgb(139 92 246 / 64%) 0%, #ffffff17 40%), radial-gradient(circle at 90% 80%, rgb(236 72 153 / 36%) 0%, #ffffff2b 40%), radial-gradient(circle at 50% 50%, rgb(59 130 246 / 31%) 0%, #ffffff4a 60%);
            --bg-body: #1e1b2e;
            --primary: #8B5CF6;
            /*--primary-hover: #7c3aed;*/
            --primary-hover: #a95cf6;
            --text-main: #ffffff;
            --text-secondary: #a1a1aa;
            --success: #10b981;
            --warning: #f59e0b;
            --danger: #f16060;
            --info_bleu : rgb(92 111 246);
            --noir_transparent: rgb(0 0 0 / 15%);
            --blanc_transparent: rgb(255 255 255 / 8%);
            --texte_blanc_leger : #c8c6d1;
            --glass-clair-border : 1px solid #ffffff2e;

            --glass-bg: rgba(255, 255, 255, 0.05);
            --glass-bg-hover: rgba(255, 255, 255, 0.1);
            --glass-border: rgba(255, 255, 255, 0.1);
            --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
            --btn_clair : linear-gradient(150deg, #eba7e1 12%, #9c34a9 100%);
            --glass-blur: blur(12px);
            --sidebar-bg: rgba(30, 27, 46, 0.85);
            --radius-lg: 20px;
            --radius-md: 12px;
            --radius-sm: 8px;
            --spacing-xs: 0.5rem;
            --spacing-sm: 1rem;
            --spacing-md: 1.5rem;
            --spacing-lg: 2rem;
            --sidebar-width: 260px;
            --header-height: 70px;
            --icon-drag: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='22px' viewBox='0 -960 960 960' width='22px' fill='grey'><path d='M360-160q-33 0-56.5-23.5T280-240q0-33 23.5-56.5T360-320q33 0 56.5 23.5T440-240q0 33-23.5 56.5T360-160Zm240 0q-33 0-56.5-23.5T520-240q0-33 23.5-56.5T600-320q33 0 56.5 23.5T680-240q0 33-23.5 56.5T600-160ZM360-400q-33 0-56.5-23.5T280-480q0-33 23.5-56.5T360-560q33 0 56.5 23.5T440-480q0 33-23.5 56.5T360-400Zm240 0q-33 0-56.5-23.5T520-480q0-33 23.5-56.5T600-560q33 0 56.5 23.5T680-480q0 33-23.5 56.5T600-400ZM360-640q-33 0-56.5-23.5T280-720q0-33 23.5-56.5T360-800q33 0 56.5 23.5T440-720q0 33-23.5 56.5T360-640Zm240 0q-33 0-56.5-23.5T520-720q0-33 23.5-56.5T600-800q33 0 56.5 23.5T680-720q0 33-23.5 56.5T600-640Z'/></svg>");
            --icon-no-pict : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23CCCCCC'><path d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-560H200v560Zm40-80h480L570-480 450-320l-90-120-120 160Zm-40 80v-560 560Z'/></svg>");
            --icon-home : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='white'><path d='M240-200h120v-240h240v240h120v-360L480-740 240-560v360Zm-80 80v-480l320-240 320 240v480H520v-240h-80v240H160Zm320-350Z'/></svg>");
            --icon-liste-produit: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M360-200v-80h480v80H360Zm0-240v-80h480v80H360Zm0-240v-80h480v80H360ZM200-160q-33 0-56.5-23.5T120-240q0-33 23.5-56.5T200-320q33 0 56.5 23.5T280-240q0 33-23.5 56.5T200-160Zm0-240q-33 0-56.5-23.5T120-480q0-33 23.5-56.5T200-560q33 0 56.5 23.5T280-480q0 33-23.5 56.5T200-400Zm-56.5-263.5Q120-687 120-720t23.5-56.5Q167-800 200-800t56.5 23.5Q280-753 280-720t-23.5 56.5Q233-640 200-640t-56.5-23.5Z'/></svg>");
            --icon-ajouter : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M440-440H200v-80h240v-240h80v240h240v80H520v240h-80v-240Z'/></svg>");
            --icon-categories : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M120-120q-33 0-56.5-23.5T40-200v-520h80v520h680v80H120Zm160-160q-33 0-56.5-23.5T200-360v-440q0-33 23.5-56.5T280-880h200l80 80h280q33 0 56.5 23.5T920-720v360q0 33-23.5 56.5T840-280H280Zm0-80h560v-360H527l-80-80H280v440Zm0 0v-440 440Z'/></svg>");
            --icon-options : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M655-200 513-342l56-56 85 85 170-170 56 57-225 226Zm0-320L513-662l56-56 85 85 170-170 56 57-225 226ZM80-280v-80h360v80H80Zm0-320v-80h360v80H80Z'/></svg>");
            --icon-ajouter-photo : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23CCCCCC'><path d='M440-440ZM120-120q-33 0-56.5-23.5T40-200v-480q0-33 23.5-56.5T120-760h126l74-80h240v80H355l-73 80H120v480h640v-360h80v360q0 33-23.5 56.5T760-120H120Zm640-560v-80h-80v-80h80v-80h80v80h80v80h-80v80h-80ZM440-260q75 0 127.5-52.5T620-440q0-75-52.5-127.5T440-620q-75 0-127.5 52.5T260-440q0 75 52.5 127.5T440-260Zm0-80q-42 0-71-29t-29-71q0-42 29-71t71-29q42 0 71 29t29 71q0 42-29 71t-71 29Z'/></svg>");
            --icon-exchange: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='currentColor'><path d='M280-160 80-360l200-200 56 57-103 103h287v80H233l103 103-56 57Zm400-240-56-57 103-103H440v-80h287L624-743l56-57 200 200-200 200Z'/></svg>"); 
            --icon-save: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M840-680v480q0 33-23.5 56.5T760-120H200q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h480l160 160Zm-80 34L646-760H200v560h560v-446ZM565-275q35-35 35-85t-35-85q-35-35-85-35t-85 35q-35 35-35 85t35 85q35 35 85 35t85-35ZM240-560h360v-160H240v160Zm-40-86v446-560 114Z'/></svg>"); 
            --icon-poubelle : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='white'><path d='M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z'/></svg>");
            --icon-info-resto : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M440-280h80v-240h-80v240Zm68.5-331.5Q520-623 520-640t-11.5-28.5Q497-680 480-680t-28.5 11.5Q440-657 440-640t11.5 28.5Q463-600 480-600t28.5-11.5ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/></svg>");
            --icon-horaires  : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' width='24px' height='24px' viewBox='0 0 24 24'><path fill-rule='evenodd' clip-rule='evenodd' d='M4 12C4 7.58172 7.58172 4 12 4C12.5523 4 13 3.55228 13 3C13 2.44772 12.5523 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22C14.7611 22 17.2625 20.8796 19.0711 19.0711C19.4616 18.6805 19.4616 18.0474 19.0711 17.6569C18.6805 17.2663 18.0474 17.2663 17.6569 17.6569C16.208 19.1057 14.2094 20 12 20C7.58172 20 4 16.4183 4 12ZM13 6C13 5.44772 12.5523 5 12 5C11.4477 5 11 5.44772 11 6V12C11 12.2652 11.1054 12.5196 11.2929 12.7071L14.2929 15.7071C14.6834 16.0976 15.3166 16.0976 15.7071 15.7071C16.0976 15.3166 16.0976 14.6834 15.7071 14.2929L13 11.5858V6ZM21.7483 15.1674C21.535 15.824 20.8298 16.1833 20.1732 15.97C19.5167 15.7566 19.1574 15.0514 19.3707 14.3949C19.584 13.7383 20.2892 13.379 20.9458 13.5923C21.6023 13.8057 21.9617 14.5108 21.7483 15.1674ZM21.0847 11.8267C21.7666 11.7187 22.2318 11.0784 22.1238 10.3966C22.0158 9.71471 21.3755 9.2495 20.6937 9.3575C20.0118 9.46549 19.5466 10.1058 19.6546 10.7877C19.7626 11.4695 20.4029 11.9347 21.0847 11.8267ZM20.2924 5.97522C20.6982 6.53373 20.5744 7.31544 20.0159 7.72122C19.4574 8.127 18.6757 8.00319 18.2699 7.44468C17.8641 6.88617 17.9879 6.10446 18.5464 5.69868C19.1049 5.2929 19.8867 5.41671 20.2924 5.97522ZM17.1997 4.54844C17.5131 3.93333 17.2685 3.18061 16.6534 2.86719C16.0383 2.55378 15.2856 2.79835 14.9722 3.41346C14.6588 4.02858 14.9033 4.78129 15.5185 5.09471C16.1336 5.40812 16.8863 5.16355 17.1997 4.54844Z' /></svg>");
            --icon-fermetures  : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='m388-212-56-56 92-92-92-92 56-56 92 92 92-92 56 56-92 92 92 92-56 56-92-92-92 92ZM200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Z'/></svg>");
            --icon-equipe : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'><g><path d='M256,288v21.3c58.9,0,106.7-47.7,106.7-106.7C362.7,143.7,314.9,96,256,96c-58.9,0-106.7,47.7-106.7,106.7   c0,58.9,47.7,106.7,106.7,106.7V288v-21.3c-35.3-0.1-63.9-28.7-64-64c0.1-35.3,28.7-63.9,64-64c35.3,0.1,63.9,28.7,64,64   c-0.1,35.3-28.7,63.9-64,64V288z M149.3,480v-64c0-29.5,11.9-56.1,31.2-75.4c19.4-19.3,45.9-31.2,75.4-31.2   c29.5,0,56.1,11.9,75.4,31.2c19.3,19.4,31.2,45.9,31.2,75.4v64h42.7l0-64c0-82.5-66.9-149.3-149.3-149.3   c-82.5,0-149.3,66.9-149.3,149.3v64H149.3L149.3,480z M298.1,122.4c6-25.5,32-47.8,64.6-47.7c34.4-0.1,63.8,28.8,64,64.2l21.3-0.2   l-21.3-0.2c-0.2,35.4-29.6,64.3-64,64.2h-21.3v42.7h21.3c29.2,0,55.8,11.9,75.2,31.3c19.4,19.4,31.4,45.9,31.4,75.4v42.7H512V352   c-0.1-82.6-67.4-149.3-149.3-149.3h-21.3v42.7h21.3c58.3-0.1,106-47.6,106.7-106.5l0-0.2l0-0.2C468.7,79.6,421,32.1,362.7,32   c-52.1,0.1-94.9,34.7-106.1,80.3L298.1,122.4L298.1,122.4z M255.4,112.3c-11.2-45.6-54-80.2-106.1-80.3   C91,32.1,43.3,79.6,42.7,138.5l0,0.2l0,0.2c0.6,58.9,48.4,106.3,106.7,106.5l21.3,0v-42.7h-21.3C67.4,202.7,0.1,269.4,0,352v42.7   h42.7V352c0-29.5,12-56,31.4-75.4c19.5-19.4,46-31.3,75.2-31.3l21.3,0v-42.7h-21.3c-34.4,0.1-63.8-28.8-64-64.2L64,138.7l21.3,0.2   c0.2-35.4,29.6-64.3,64-64.2c32.6-0.1,58.6,22.2,64.6,47.7L255.4,112.3L255.4,112.3z'/></g></svg>");
            --icon-mafiche : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M560-680v-80h320v80H560Zm0 160v-80h320v80H560Zm0 160v-80h320v80H560Zm-325-75q-35-35-35-85t35-85q35-35 85-35t85 35q35 35 35 85t-35 85q-35 35-85 35t-85-35ZM80-160v-76q0-21 10-40t28-30q45-27 95.5-40.5T320-360q56 0 106.5 13.5T522-306q18 11 28 30t10 40v76H80Zm86-80h308q-35-20-74-30t-80-10q-41 0-80 10t-74 30Zm182.5-251.5Q360-503 360-520t-11.5-28.5Q337-560 320-560t-28.5 11.5Q280-537 280-520t11.5 28.5Q303-480 320-480t28.5-11.5ZM320-520Zm0 280Z'/></svg> ");
            --icon-ajout-collaborateur : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M720-400v-120H600v-80h120v-120h80v120h120v80H800v120h-80ZM247-527q-47-47-47-113t47-113q47-47 113-47t113 47q47 47 47 113t-47 113q-47 47-113 47t-113-47ZM40-160v-112q0-34 17.5-62.5T104-378q62-31 126-46.5T360-440q66 0 130 15.5T616-378q29 15 46.5 43.5T680-272v112H40Zm80-80h480v-32q0-11-5.5-20T580-306q-54-27-109-40.5T360-360q-56 0-111 13.5T140-306q-9 5-14.5 14t-5.5 20v32Zm296.5-343.5Q440-607 440-640t-23.5-56.5Q393-720 360-720t-56.5 23.5Q280-673 280-640t23.5 56.5Q327-560 360-560t56.5-23.5ZM360-640Zm0 400Z'/></svg>");
            --icon-cadenas : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M240-160h480v-400H240v400Zm296.5-143.5Q560-327 560-360t-23.5-56.5Q513-440 480-440t-56.5 23.5Q400-393 400-360t23.5 56.5Q447-280 480-280t56.5-23.5ZM240-160v-400 400Zm0 80q-33 0-56.5-23.5T160-160v-400q0-33 23.5-56.5T240-640h280v-80q0-83 58.5-141.5T720-920q83 0 141.5 58.5T920-720h-80q0-50-35-85t-85-35q-50 0-85 35t-35 85v80h120q33 0 56.5 23.5T800-560v400q0 33-23.5 56.5T720-80H240Z'/></svg>"); 
            --icon-scooter : url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M120-640v-200h280v200H120Zm80-80h120v-40H200v40Zm-5 485q-35-35-35-85H80v-120q0-66 47-113t113-47h160v200h140l140-174v-106H560v-80h120q33 0 56.5 23.5T760-680v134L580-320H400q0 50-35 85t-85 35q-50 0-85-35Zm113.5-56.5Q320-303 320-320h-80q0 17 11.5 28.5T280-280q17 0 28.5-11.5ZM675-235q-35-35-35-85t35-85q35-35 85-35t85 35q35 35 35 85t-35 85q-35 35-85 35t-85-35Zm113.5-56.5Q800-303 800-320t-11.5-28.5Q777-360 760-360t-28.5 11.5Q720-337 720-320t11.5 28.5Q743-280 760-280t28.5-11.5ZM160-400h160v-120h-80q-33 0-56.5 23.5T160-440v40Zm160-320v-40 40Zm0 320Z'/></svg>");
            --icon-euro: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M600-120q-118 0-210-67T260-360H120v-80h122q-2-11-2-20v-40q0-9 2-20H120v-80h140q38-106 130-173t210-67q69 0 130.5 24T840-748l-70 70q-35-29-78.5-45.5T600-740q-75 0-136.5 38.5T370-600h230v80H344q-2 11-3 20t-1 20q0 11 1 20t3 20h256v80H370q32 63 93.5 101.5T600-220q48 0 92.5-16.5T770-282l70 70q-48 44-109.5 68T600-120Z'/></svg>");
            
            --icon-ajouter-stock : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px'><path d='M640-640h120-120Zm-440 0h338-18 14-334Zm16-80h528l-34-40H250l-34 40Zm184 270 80-40 80 40v-190H400v190Zm182 330H200q-33 0-56.5-23.5T120-200v-499q0-14 4.5-27t13.5-24l50-61q11-14 27.5-21.5T250-840h460q18 0 34.5 7.5T772-811l50 61q9 11 13.5 24t4.5 27v196q-19-7-39-11t-41-4v-122H640v153q-35 20-61 49.5T538-371l-58-29-160 80v-320H200v440h334q8 23 20 43t28 37Zm138 0v-120H600v-80h120v-120h80v120h120v80H800v120h-80Z'/></svg>");
            --icon-gerer-stock : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M216-720h528l-34-40H250l-34 40Zm184 270 80-40 80 40v-190H400v190ZM200-120q-33 0-56.5-23.5T120-200v-499q0-14 4.5-27t13.5-24l50-61q11-14 27.5-21.5T250-840h460q18 0 34.5 7.5T772-811l50 61q9 11 13.5 24t4.5 27v139q-21 0-41.5 3T760-545v-95H640v205l-77 77-83-42-160 80v-320H200v440h280v80H200Zm440-520h120-120Zm-440 0h363-363Zm360 520v-123l221-220q9-9 20-13t22-4q12 0 23 4.5t20 13.5l37 37q8 9 12.5 20t4.5 22q0 11-4 22.5T903-340L683-120H560Zm300-263-37-37 37 37ZM620-180h38l121-122-18-19-19-18-122 121v38Zm141-141-19-18 37 37-18-19Z'/></svg>");
            --icon-notif: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M80-560q0-100 44.5-183.5T244-882l47 64q-60 44-95.5 111T160-560H80Zm720 0q0-80-35.5-147T669-818l47-64q75 55 119.5 138.5T880-560h-80ZM160-200v-80h80v-280q0-83 50-147.5T420-792v-28q0-25 17.5-42.5T480-880q25 0 42.5 17.5T540-820v28q80 20 130 84.5T720-560v280h80v80H160Zm320-300Zm0 420q-33 0-56.5-23.5T400-160h160q0 33-23.5 56.5T480-80ZM320-280h320v-280q0-66-47-113t-113-47q-66 0-113 47t-47 113v280Z'/></svg>"); 
       
            --icon-actualiser: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='30px' viewBox='0 -960 960 960' width='30px' fill='currentColor'><path d='M212-239q-43-48-67.5-110T120-480q0-150 105-255t255-105v-80l200 150-200 150v-80q-91 0-155.5 64.5T260-480q0 46 17.5 86t47.5 70l-113 85ZM480-40 280-190l200-150v80q91 0 155.5-64.5T700-480q0-46-17.5-86T635-636l113-85q43 48 67.5 110T840-480q0 150-105 255T480-120v80Z'/></svg>"); 
            
            --icon-caisse: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='black' d='M7.5,5C5.6,5,4,6.6,4,8.5S5.6,12,7.5,12S11,10.4,11,8.5S9.4,5,7.5,5z M16.5,5C14.6,5,13,6.6,13,8.5s1.6,3.5,3.5,3.5S20,10.4,20,8.5S18.4,5,16.5,5z M7.5,14C2.6,14,1,18,1,18v2h13v-2C14,18,12.4,14,7.5,14z M16.5,14c-1.5,0-2.7,0.4-3.6,0.9c1.4,1.2,2,2.6,2.1,2.7l0.1,0.2V20h8v-2C23,18,21.4,14,16.5,14z'/></svg>");
            --icon-phone: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24px' height='24px' viewBox='0 0 36 36' aria-hidden='true' role='img' class='iconify iconify--twemoji' preserveAspectRatio='xMidYMid meet'><path fill='black' d='M34.06 26.407l-3.496-3.496a4.942 4.942 0 0 0-8.34 2.528c-5.765-1.078-11.372-6.662-11.721-11.653a4.908 4.908 0 0 0 2.586-1.36a4.943 4.943 0 0 0 0-6.99L9.594 1.94a4.943 4.943 0 0 0-6.99 0C-7.882 12.426 23.574 43.882 34.06 33.396a4.944 4.944 0 0 0 0-6.989z'/></svg>");

            --icon-cb : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M880-720v480q0 33-23.5 56.5T800-160H160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720Zm-720 80h640v-80H160v80Zm0 160v240h640v-240H160Zm0 240v-480 480Z'/></svg>");
            --icon-especes : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' ><path d='M560-440q-50 0-85-35t-35-85q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35ZM280-320q-33 0-56.5-23.5T200-400v-320q0-33 23.5-56.5T280-800h560q33 0 56.5 23.5T920-720v320q0 33-23.5 56.5T840-320H280Zm80-80h400q0-33 23.5-56.5T840-480v-160q-33 0-56.5-23.5T760-720H360q0 33-23.5 56.5T280-640v160q33 0 56.5 23.5T360-400Zm440 240H120q-33 0-56.5-23.5T40-240v-440h80v440h680v80ZM280-400v-320 320Z'/></svg>");
            --icon-ticket-resto : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg'><path fill='black' d='M487.492,105.476h-341.04h-2.468h-24.516h-94.96H0v24.508v252.024v24.516h24.508h94.96h24.516h2.468h341.04   H512v-24.516V129.984v-24.508H487.492z M487.492,382.008h-341.04c0-7.452-6.041-13.476-13.5-13.476   c-7.436,0-13.484,6.024-13.484,13.476h-94.96V129.984h94.96c0,7.452,6.048,13.484,13.484,13.484c7.459,0,13.5-6.032,13.5-13.484   h341.04V382.008z'/><path d='M132.952,267.717c-7.436,0-13.484,6.033-13.484,13.485c0,7.451,6.048,13.484,13.484,13.484   c7.459,0,13.5-6.032,13.5-13.484C146.452,273.75,140.411,267.717,132.952,267.717z'/><path d='M132.952,166.896c-7.436,0-13.484,6.04-13.484,13.499c0,7.452,6.048,13.484,13.484,13.484   c7.459,0,13.5-6.032,13.5-13.484C146.452,172.936,140.411,166.896,132.952,166.896z'/><path d='M132.952,217.306c-7.436,0-13.484,6.049-13.484,13.484c0,7.46,6.048,13.492,13.484,13.492   c7.459,0,13.5-6.033,13.5-13.492C146.452,223.355,140.411,217.306,132.952,217.306z'/><path class='st0' d='M132.952,318.121c-7.436,0-13.484,6.032-13.484,13.491c0,7.444,6.048,13.485,13.484,13.485   c7.459,0,13.5-6.041,13.5-13.485C146.452,324.153,140.411,318.121,132.952,318.121z'/><rect x='250.806' y='180.653' class='st0' width='167.024' height='18.161'/><rect x='250.806' y='246.92' class='st0' width='167.024' height='18.153'/><rect x='332.5' y='313.186' class='st0' width='85.331' height='18.161'/></svg>");
            --icon-mixed : url("data:image/svg+xml, <svg  height='800px' width='800px' version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 511.999 511.999' xml:space='preserve'><g><g><path d='M493.714,66.178h-69.659H197.661h-69.661c-10.099,0-18.286,8.187-18.286,18.286v63.563h18.286h18.286h10.203h32.195c12.566-12.003,21.598-27.666,25.337-45.277h193.674c7.188,33.842,33.891,60.545,67.734,67.734v89.183c-33.843,7.186-60.547,33.891-67.734,67.734h-17.598v36.572h33.958h69.659c10.099,0,18.286-8.186,18.286-18.286v-69.66V154.121V84.464C512,74.364,503.813,66.178,493.714,66.178z'/></g></g><g><g><path d='M335.24,184.597H146.285h-36.572H18.286C8.187,184.597,0,192.784,0,202.882v54.857h353.526v-54.857C353.526,192.784,345.339,184.597,335.24,184.597z'/></g></g><g><g><path d='M0,294.311v133.224c0,10.099,8.187,18.286,18.286,18.286H335.24c10.099,0,18.286-8.186,18.286-18.286v-63.564V327.4 v-33.089H0z M152.383,367.454H91.429c-10.099,0-18.286-8.187-18.286-18.286c0-10.099,8.187-18.286,18.286-18.286h60.954 c10.099,0,18.286,8.187,18.286,18.286C170.668,359.267,162.481,367.454,152.383,367.454z'/></g></g></svg>"); 
            --icon-partenaire : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Layer_1' width='800px' height='800px' viewBox='0 0 210 256' enable-background='new 0 0 210 256' xml:space='preserve'><path d='M174.55,144.5L174.55,144.5c-1.4-4-5-6.5-9.2-6.5H159V23c0-11.708-9.292-21-21-21H25C12.57,2,2,12.57,2,25v183  c0,11.9,10.95,22,22.75,22l114.213,0c1.207,0,2.27,0.984,2.18,2.188c-0.095,1.266-1.153,1.812-2.393,1.812h-45.5L128,254h80  L174.55,144.5z M82.05,220.2c-3.199,0-5.599-2.399-5.6-5.598c-0.001-3.045,2.557-5.602,5.602-5.602  c3.199,0.001,5.598,2.401,5.598,5.6C87.55,217.8,85.25,220.2,82.05,220.2z M144,138h-19.65c-5.3,0-9.8,4.7-9.8,10l0,0  c0,5.3,4.5,10,9.8,10h19.8v42H18V31h126V138z M80.928,41.64c-27.107,0-48.856,22.036-48.856,49.144  c0,26.963,21.893,48.856,48.856,48.856s49-21.893,49-49C129.928,63.533,108.035,41.64,80.928,41.64z M99.359,83.492l-2.176,5.296  H62.722c-0.045,0.62-0.072,1.241-0.072,1.861c0,0.63,0.027,1.25,0.072,1.87h32.924l-2.176,5.296H63.828  c1.448,4.208,4.163,7.948,7.75,10.618c3.848,2.868,8.406,4.379,13.216,4.379c6.536-0.018,12.704-2.886,16.93-7.894l0.692-0.827v7.57  l-0.135,0.108c-4.9,4.046-11.104,6.294-17.469,6.294c-12.416,0-23.268-8.317-26.496-20.292h-7.858l2.185-5.296h4.783  c-0.045-0.62-0.072-1.241-0.072-1.861c0-0.629,0.027-1.25,0.072-1.87H50.53l2.266-5.295h5.493  c3.183-11.751,13.909-20.068,26.145-20.229h0.36c7.319,0,14.188,2.85,19.375,8.011l0.18,0.18l-2.248,5.43l-0.423-0.495  c-4.226-4.981-10.393-7.849-16.912-7.849h-0.396c-9.35,0.18-17.532,6.159-20.544,14.997H99.359z'/></svg>");


            --icon-sur-place : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Capa_1' width='800px' height='800px' viewBox='0 0 214.539 214.539' xml:space='preserve'><g><g><path d='M121.164,154.578h-6.625V89.14h38.937c4.014,0,7.269-3.254,7.269-7.269s-3.254-7.269-7.269-7.269h-92.41    c-4.014,0-7.269,3.254-7.269,7.269s3.254,7.269,7.269,7.269h38.936v65.438h-6.625c-4.014,0-7.269,3.254-7.269,7.27    c0,4.015,3.254,7.269,7.269,7.269h27.787c4.015,0,7.27-3.254,7.27-7.269C128.433,157.832,125.179,154.578,121.164,154.578z'/><path d='M73.783,120.777c0-4.014-3.254-7.269-7.269-7.269H54.833H34.219c-11.08,0-13.41-16.14-13.509-16.869l-6.239-45.122    c-0.55-3.977-4.217-6.748-8.196-6.205c-3.976,0.55-6.754,4.219-6.205,8.196l6.229,45.053c0.831,6.47,4.167,16.593,11.367,23.133    l-7.485,38.956c-0.758,3.942,1.824,7.752,5.766,8.509c3.946,0.761,7.752-1.825,8.509-5.766l6.792-35.349h17.579l6.792,35.349    c0.668,3.479,3.714,5.897,7.13,5.897c0.455,0,0.916-0.043,1.379-0.132c3.942-0.757,6.524-4.566,5.766-8.509l-6.265-32.605h2.883    C70.527,128.046,73.783,124.791,73.783,120.777z'/><path d='M208.267,45.313c-3.975-0.543-7.646,2.229-8.196,6.205l-6.244,45.165c-0.094,0.687-2.424,16.827-13.504,16.827h-20.614    h-11.681c-4.014,0-7.27,3.254-7.27,7.269s3.255,7.269,7.27,7.269h2.883l-6.265,32.605c-0.758,3.942,1.824,7.752,5.766,8.509    c3.946,0.761,7.752-1.825,8.509-5.766l6.792-35.349h17.579l6.792,35.349c0.668,3.479,3.714,5.897,7.13,5.897    c0.455,0,0.916-0.043,1.38-0.132c3.941-0.757,6.523-4.566,5.766-8.509l-7.485-38.953c7.198-6.534,10.532-16.64,11.357-23.065    l6.238-45.123C215.021,49.533,212.242,45.863,208.267,45.313z'/></g></g></svg>");
            --icon-emporter : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='48px' viewBox='0 -960 960 960' width='48px' ><path d='M220-80q-24 0-42-18t-18-42v-520q0-24 18-42t42-18h110v-10q0-63 43.5-106.5T480-880q63 0 106.5 43.5T630-730v10h110q24 0 42 18t18 42v520q0 24-18 42t-42 18H220Zm0-60h520v-520H630v90q0 12.75-8.68 21.37-8.67 8.63-21.5 8.63-12.82 0-21.32-8.63-8.5-8.62-8.5-21.37v-90H390v90q0 12.75-8.68 21.37-8.67 8.63-21.5 8.63-12.82 0-21.32-8.63-8.5-8.62-8.5-21.37v-90H220v520Zm170-580h180v-10q0-38-26-64t-64-26q-38 0-64 26t-26 64v10ZM220-140v-520 520Z'/></svg>");
            --icon-livraison : url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' height='48px' viewBox='0 -960 960 960' width='48px' ><path d='M120-653v-188h270v188H120Zm60-60h150v-68H180v68Zm12 478.5Q158-269 158-317H80v-120q0-65 45-110.5T235-593h155v216h161l147-185v-138H575v-60h123q24.75 0 42.38 17.62Q758-724.75 758-700v159L580-317H390q0 48-33.76 82.5-33.77 34.5-82 34.5Q226-200 192-234.5ZM313.5-277q16.5-17 16.5-40H218q0 23 16.5 40t39.5 17q23 0 39.5-17ZM682-233.76q-34-33.77-34-82Q648-364 681.76-398q33.77-34 82-34Q812-432 846-398.24q34 33.77 34 82Q880-268 846.24-234q-33.77 34-82 34Q716-200 682-233.76Zm121.5-42.74Q820-293 820-316t-16.5-39.5Q787-372 764-372t-39.5 16.5Q708-339 708-316t16.5 39.5Q741-260 764-260t39.5-16.5ZM140-377h190v-156h-95q-40 0-67.5 28.2T140-437v60Zm190-336v-68 68Zm0 336Z'/></svg>");
                    
        
        }
        * {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            -webkit-tap-highlight-color: transparent;
        }
body {
    font-family: principale;
    background-color: var(--bg-body);
    color: var(--text-main);
    min-height: max(884px, 100dvh);
    overflow-x: hidden;
    background-image: radial-gradient(circle at 10% 20%, rgba(139, 92, 246, 0.4) 0%, transparent 40%),
                radial-gradient(circle at 90% 80%, rgba(236, 72, 153, 0.3) 0%, transparent 40%),
                radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.2) 0%, transparent 60%);
    background-attachment: fixed;
    width: 100dvw;
    height: 100dvh;
    overflow: hidden;
}
    #logo_accueil{
    background-image: url(../img/logo_accueil.webp);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: 20%;
    background-size: contain;
    height: 80px;
    width: 90%;
    max-width: 400px;
    margin-top: -100px;
    }
main {
    height: 100dvh;
    width: 100dvw;
    display: flex;
    flex-direction: row;
    column-count: 2;
}
sidebar {
    background-color: var(--blanc_transparent);
    display: flex;
    width: 250px;
    max-width: 250px;
    background-image: radial-gradient(circle at 10% 20%, rgb(139 92 246 / 64%) 0%, #ffffff17 40%), radial-gradient(circle at 90% 80%, rgb(236 72 153 / 36%) 0%, #ffffff2b 40%), radial-gradient(circle at 50% 50%, rgb(59 130 246 / 31%) 0%, #ffffff4a 60%);
}
conteneur {
    display: flex;
    flex-direction: column;
    width: 80%;
    flex: 1;
    overflow: hidden;
}
entete {
    display: flex;
    gap: 25px;
    width: 100%;
    height: 65px;
    background-color: var(--noir_transparent);
    flex-shrink: 0;
    position: relative;
    justify-content: flex-end;
}
logo_wegrow_mobile {
    display: none;
    background-image: url(../img/logo.webp);
    height: 45px;
    width: 185px;
    position: absolute;
    top: 57%;
    transform: translateY(-50%);
    left: 0px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}
logo_wegrow_desktop {
    width: 100%;
    height: 65px;
    background-color: #461e51;
    background-image: url(../img/logo.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85%;
}

contenu {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    position: relative;
}

section {
    min-width: 700px;
    max-width: 700px;
    display: flex;
    margin-left: 25%;
    padding: 20px;

    flex-direction: column;
}

.tuile {
    background-color: var(--glass-bg);
    border-radius: var(--radius-lg);
    border-top: 1px solid var(--glass-border);
    border-left: 1px solid var(--glass-border);
    padding: 20px;
    margin: 20px 0px;
    position: relative;
}
small {
    display: inline;
    color: var(--text-secondary);
}

.erreur_login{
    color: #d95c5c;
    font-size: 0.8em;
    background: #ff000024;
    padding: 10px 5px;
    text-align: center;
    border-radius: 8px;
    margin-bottom: 20px;
}


.colonne_fixe_gauche {
    position: fixed;
    display: flex;
    width: 15%;
    top: 113px;
    bottom: unset;
    flex-direction: column;
    padding: 30px 0px 20px 0px;
    align-items: stretch;
    justify-content: space-evenly;
    left: 277px;
    background: none;
    gap: 0px;
    align-content: center;
    flex-wrap: wrap;
}
hr{
    margin: 30px 0;
    border: none;
    /* border-top: 1px solid #e0e0e0; */
    border-bottom: 1px solid #dddddd45;
}
.menu-toggle {
    position: absolute;
    display: none;
    right: 1.0rem;
    top: 50%;
    transform: translate(0, -50%);
    height: 34px;
    width: 30px;

  &, &:hover {
    color: #000;
  }
}

.menu-toggle-bar {
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    right: 0;
    width: 100%;
    height: 4px;
    border-radius: 4px;
    background-color: #c58fcf;
    transition: all 0.3s ease;


  &.menu-toggle-bar--top {
    transform: translate(0, -10px);
  }
  &.menu-toggle-bar--middle {
  }
  &.menu-toggle-bar--bottom {
    transform: translate(0, 10px);
  }

  .nav-open & {
    &.menu-toggle-bar--top {
      transform: translate(0, 0) rotate(45deg);
    }
    &.menu-toggle-bar--middle {
      opacity: 0;
    }
    &.menu-toggle-bar--bottom {
      transform: translate(0, 0) rotate(-45deg);
    }
  }
}

/* ===== TOAST SUCCES / ECHEC ===== */
.toast_succes{
    display: none;
}


/* ===== FIL D'ARIANE ===== */

fildariane {
    display: flex;
    color: #ccabe9;
    letter-spacing: 2px;
    margin: 0 0 20px 0;
    padding: 0;
    font-size: 11px;
    align-items: center;
    white-space: nowrap;
    overflow: hidden;
}
fildariane .icon-home {
    width: 20px;
    aspect-ratio: 1 / 1;
    background-color: currentColor;       /* ← couleur dynamique */
    -webkit-mask-image: var(--icon-home);
    mask-image: var(--icon-home);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    cursor: pointer;
    margin-right: 5px;
}
fildariane span {
    background-color: var(--blanc_transparent);
    /* border: 1px solid #7979797d; */
    border-radius: 5px;
    padding: 3px 7px;
    /* font-size: 11px; */
    letter-spacing: normal;
    text-transform: uppercase;
    margin-left: 5px;
    margin-right: 7px;
}







/* ===== BESOIN D'AIDE (BOUTON + CADRE) ===== */

#info_entete, .info_entete {
    width: auto;
    max-width: 700px;
    height: auto;
    font-size: 0.8em;
    color: rgb(43 51 105);
    padding: 31px 15px 31px 15px;
    position: fixed;
    left: 50%;
    background: white;
    background-image: var(--bg-degrade-blanc);
    z-index: 1900;
    bottom: 50%;
    opacity: 0;
    transform: translateY(100%)  translateX(-50%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.4s ease;
    pointer-events: none;
}
#info_entete #aide-contenu-slot, #info_entete #aide-contenu-slot li {
    list-style-type: disclosure-closed;
    margin: 0px;
    padding-inline-start: inherit;
    margin-bottom: 15px;
}
#info_entete.visible, .info_entete.visible {
    transform: translateY(50%) translateX(-50%);
    opacity: 1;
    pointer-events: auto;
}

#aide-contenu-slot h3 {
    text-align: center;
    margin-bottom: 20px;
    font-variant-caps: all-small-caps;
    color: var(--info_bleu);
}

/* Bouton "Besoin d'aide ?" */
.btn-aide {
    position: fixed;
    bottom: 68px;
    right: 60px;
    background: var(--noir_transparent);
    color: #ffffffbd;
    border: none;
    border-radius: var(--radius-lg);
    padding: 8px 7px;
    font-size: 1.1em;
    font-weight: 200;
    box-shadow: inset 0 0px 12px rgb(0 0 0 / 20%);
    cursor: pointer;
    z-index: 1500;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    text-indent: 3px;
    text-transform: unset;
    text-shadow: 2px 2px black;
}

.btn-aide:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(76, 63, 97, 0.4);
}

.btn-aide.hidden {
    display: none;
}

.fermer_info_entete {
    color: var(--bg-body);
    position: absolute;
    top: 0px;
    right: 7px;
    text-align: center;
    line-height: 38px;
    height: 60px;
    aspect-ratio: 1/1;
    font-size: 2.2em;
    text-align: right;
}
.fermer_info_entete::before{
    content: "\00d7";
    
}


/* ===== PAGE RESTAURANT ===== */   

.logo-vignette {
    max-width: 150px;
    max-height: 150px;
    object-fit: contain;
    background: white;
    padding: 7px;
    border-radius: 15px;
    border: 1px solid #eee;
}
.logos-wrapper {
    display: flex;
    gap: 10px;
    justify-content: space-around;
    margin-bottom: 8px;
    /* align-items: center; */
}
.logos-wrapper>* {
  flex: 50% 1 ;
}


.logo-label {
    font-size: 0.7rem;
    color: #777;
    /* font-weight: 600; */
    text-transform: uppercase;
    /* letter-spacing: 1px; */
    display: flex;
    border: oldlace;
    gap: 10px;
    justify-content: space-around;
    text-align: center;
    align-items: flex-start;
    width: 100%;
    flex-direction: row;
}
.logo-label span{
    width: 40%;
}







    /* Grille des horaires */
.schedule-grid {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 15px;
    align-items: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--blanc_transparent);
    justify-items: stretch;
}


.day-label {
    font-weight: bold;
    color: #b285df;
    margin-bottom: 5px;
    font-variant: all-small-caps;
    font-style: italic;
    font-size: x-large;
    text-align: left;
    text-indent: 10px;
}

.service-block {
    display: flex;
    flex-wrap: nowrap;
    gap: 13px;
    align-items: center;
    justify-content: center;
    flex-direction: row;
    margin-bottom: 10px;
}
.service-block input[type="time"] {
    width: 87px;
    text-align: center;
    margin-bottom: 0px;
    appearance: none;
    -webkit-appearance: none;
    padding-right: 0px;
    padding-left: 10px;
}

.time-group {
    display: flex;
    align-items: center;
    /* background: #ecf0f3; */
    padding: 5px;
    border-radius: 8px;
    /* box-shadow: inset 2px 2px 5px #cbced1, inset -2px -2px 5px white; */
    width: 30%;
    /* margin: 0 5px; */
    gap: 8px;
}

.time-select {
    /* border: none; */
    background: transparent;
    /* font-size: 0.9rem; */
    padding: 2px;
    cursor: pointer;
    text-align: center;
    box-shadow: none;
    border: none;
    border-bottom: 1px solid #a9a9a9;
    border-radius: 0px;
}
    
.separator {
    margin: 0 10px;
}
.service-label {
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-right: 5px;
}

    @media (max-width: 768px) {
        .schedule-grid {
            grid-template-columns: 1fr; /* Stack sur mobile */
            gap: 5px;
        }

.day-label {
text-align: center;
        text-indent: 0;
}
    }












/* ===== LISTE PRODUIT ===== */

.liste {
    display: grid;
    gap: 8px;
    width: 70%;
    margin-left: 25%;
    min-width: 700px;
    max-width: 700px;
}
button.ajout_categ{
    display: flex;
    background: none;
    border: 1px dashed #ffffff33;
    border-radius: 10px;
    height: 60px;
    align-items: center;
    justify-content: space-around;
    font-variant-caps: all-small-caps;
    font-size: large;
    color: grey;
    width: calc(100% - 145px);
}
.ligne_categorie {
    padding: 10px;
    border-radius: 10px;
    /* background: #cfc9d9; */
    text-align: center;
    color: var(--primary-hover);
    text-transform: uppercase;
    font-style: italic;
    font-weight: 900;
    font-size: large;
}
.ligne_categorie.avec_info-aide {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-left: 27px;
}
.ligne_produit , .cat-row {
    padding: 10px 10px 10px 30px;
    border-top: var(--glass-clair-border);
    border-left: var(--glass-clair-border);
    border-radius: var(--radius-sm);
    width: 100%;
    height: 60px;
    background: var(--blanc_transparent);
    cursor: grab;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    margin-bottom: 9px;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    background-image: var(--icon-drag);
    background-position: 5px center;
    background-repeat: no-repeat;
}
.cat-row {
    width: calc(100% - 145px);
    display: inline-flex;
}

button.upsell_trash {
    position: absolute;
    /* right: -53px; */
    /* top: -1px; */
    height: 60px;
    aspect-ratio: 1 / 1;
    background: none;
    background-repeat: no-repeat;
    background-position: left;
    /* border-radius: 0 8px 8px 0; */
    display: inline-flex;
    justify-content: center;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0;
    padding: 0;
}
button.upsell_trash::before {
    content: '';
    display: inline-block;
    width: 25px;
    height: 25px;
    color: var(--danger);
    background-color: currentColor;
    mask-image: var(--icon-poubelle);
    mask-size: contain;
    mask-repeat: no-repeat;
    vertical-align: top;
    margin-left: 0px;
}
.ligne_produit div.liste_illustration {
    aspect-ratio: 1 / 1;
    height: 100%;
    background-color: azure;
    display: block;
    border-radius: var(--radius-sm);
    background-image: var(--icon-no-pict);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70%;
}
.ligne_produit div.liste_info {

}
.ligne_produit div.liste_info span , .liste_prix_option {
    color: var(--text-secondary);
    font-size: 0.8em;
    font-weight: 300;
}
.ligne_produit div.liste_prix {
    text-align: end;
    position: absolute;
    right: 20px;
    display: flex;
    flex-direction: row;
    gap: 20px;
    color: var(--primary);
    font-weight: bold;
}
.liste_produits_triable {
    margin: 0;
    padding: 0;
    list-style: none;
    padding-inline-start : 0 !important}
.produit_inactif{
        opacity: 0.4;
}





a#bouton_ajouter_groupe_option {
    display: flex;
    background: none;
    border: 1px dashed #ffffff33;
    border-radius: 10px;
    height: 60px;
    align-items: center;
    justify-content: space-around;
    font-variant-caps: all-small-caps;
    font-size: large;
    color: grey;
    width: calc(100% - 145px);
    text-decoration: none;
}
.ligne_groupe_option {
    padding: 10px 10px 10px 12px;
    border-top: var(--glass-clair-border);
    border-left: var(--glass-clair-border);
    border-radius: var(--radius-sm);
    width: calc(100% - 145px);
    height: 60px;
    background: var(--blanc_transparent);
    -webkit-user-select: none;
    user-select: none;
    margin-bottom: 1px;
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0px;
    flex-direction: row;
    text-transform: uppercase;
}

.ligne_groupe_option strong {
    margin-right: 20px;
    font-size: 1.5em;
    font-weight: normal;
    color: var(--blanc_transparent);
    font-weight: bolder;
    font-style: italic;
}
.ligne_groupe_option div {
    flex: 1;
    text-align: end;
    color: var(--primary-hover);
}

/* ===== BOUTON NAV LISTE PRODUITS ===== */

.boutons_fixes {
    position: fixed;
    display: flex;
    width: 15%;
    top: 146px;
    bottom: unset;
    flex-direction: column;
    padding: 30px 0px 20px 0px;
    align-items: stretch;
    justify-content: space-evenly;
    left: 277px;
    background: none;
    gap: 25px;
    align-content: center;
    flex-wrap: wrap;
}
.boutons_fixes button {
    filter: grayscale(0.4) hue-rotate(
343deg);
    padding: 13px 18px 13px 52px;
    /* text-align: justify; */
    font-size: 0.75em;
    position: relative;
    max-width: 170px;
    min-height: 55px;
}
.boutons_fixes button span {
    background-color: currentColor;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    flex-shrink: 0;
    height: 50%;
    aspect-ratio: 1/1;
    display: block;
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

.boutons_fixes button span.liste-prod {-webkit-mask-image: var(--icon-liste-produit); mask-image: var(--icon-liste-produit);}
.boutons_fixes button span.ajouter {-webkit-mask-image: var(--icon-ajouter); mask-image: var(--icon-ajouter);}
.boutons_fixes button span.categories {-webkit-mask-image: var(--icon-categories); mask-image: var(--icon-categories);}
.boutons_fixes button span.options {-webkit-mask-image: var(--icon-options); mask-image: var(--icon-options);}
.boutons_fixes button span.info_resto {-webkit-mask-image: var(--icon-info-resto); mask-image: var(--icon-info-resto);}
.boutons_fixes button span.horaires {-webkit-mask-image: var(--icon-horaires); mask-image: var(--icon-horaires);}
.boutons_fixes button span.feremtures_ex {-webkit-mask-image: var(--icon-fermetures); mask-image: var(--icon-fermetures);}
.boutons_fixes button span.equipe {-webkit-mask-image: var(--icon-equipe); mask-image: var(--icon-equipe);}
.boutons_fixes button span.mafiche{-webkit-mask-image: var(--icon-mafiche); mask-image: var(--icon-mafiche);}
.boutons_fixes button span.ajout_collaborateur{-webkit-mask-image: var(--icon-ajout-collaborateur); mask-image: var(--icon-ajout-collaborateur);}
.boutons_fixes button span.scooter{-webkit-mask-image: var(--icon-scooter); mask-image: var(--icon-scooter);}
.boutons_fixes button span.map  {-webkit-mask: url('../img/location.svg') ; mask: url('../img/location.svg') no-repeat center / contain;}
.boutons_fixes button span.euros{-webkit-mask-image: var(--icon-euro); mask-image: var(--icon-euro);}

.boutons_fixes button span.ajout_stock{-webkit-mask-image: var(--icon-ajouter-stock); mask-image: var(--icon-ajouter-stock);}
.boutons_fixes button span.gerer_stock{-webkit-mask-image: var(--icon-gerer-stock); mask-image: var(--icon-gerer-stock);}
.boutons_fixes button span.notif{-webkit-mask-image: var(--icon-notif); mask-image: var(--icon-notif);}

.boutons_fixes button span.calendrier {-webkit-mask: url('../img/calendrier.svg') ; mask: url('../img/calendrier.svg') no-repeat center / contain;}
.boutons_fixes button span.today {-webkit-mask: url('../img/today.svg') ; mask: url('../img/today.svg') no-repeat center / contain;}
.boutons_fixes button span.retour {-webkit-mask: url('../img/retour.svg') ; mask: url('../img/retour.svg') no-repeat center / contain;}
.boutons_fixes button span.stats {-webkit-mask: url('../img/stats.svg') ; mask: url('../img/stats.svg') no-repeat center / contain;}

.boutons_fixes button span.scan {-webkit-mask: url('../img/scan.svg') ; mask: url('../img/scan.svg') no-repeat center / contain;}
.boutons_fixes button span.tableau {-webkit-mask: url('../img/table.svg') ; mask: url('../img/table.svg') no-repeat center / contain;}

.boutons_fixes button span.studio {-webkit-mask: url('../img/studio_ia.svg') ; mask: url('../img/studio_ia.svg') no-repeat center / contain;}
.boutons_fixes button span.config_studio {-webkit-mask: url('../img/template_studio.svg') ; mask: url('../img/template_studio.svg') no-repeat center / contain;}

.boutons_fixes button span.upsell {-webkit-mask: url('../img/upsell.svg') ; mask: url('../img/upsell.svg') no-repeat center / contain;}
.boutons_fixes button span.upsell_add {-webkit-mask: url('../img/upsell_add.svg') ; mask: url('../img/upsell_add.svg') no-repeat center / contain;}


.boutons_fixes button span.upsell {-webkit-mask: url('../img/upsell.svg') ; mask: url('../img/upsell.svg') no-repeat center / contain;}
.boutons_fixes button span.upsell_add {-webkit-mask: url('../img/upsell_add.svg') ; mask: url('../img/upsell_add.svg') no-repeat center / contain;}

.boutons_fixes button span.reseau_phone {-webkit-mask: url('../img/reseau_phone.svg') ; mask: url('../img/reseau_phone.svg') no-repeat center / contain;}
.boutons_fixes button span.comportement {-webkit-mask: url('../img/comportement.svg') ; mask: url('../img/comportement.svg') no-repeat center / contain;}
.boutons_fixes button span.historique {-webkit-mask: url('../img/historique.svg') ; mask: url('../img/historique.svg') no-repeat center / contain;}


.boutons_fixes button span.place_restaurant {-webkit-mask: url('../img/sur_place.svg') ; mask: url('../img/sur_place.svg') no-repeat center / contain;}
.boutons_fixes button span.place_reservation {-webkit-mask: url('../img/reservations.png') ; mask: url('../img/reservations.png') no-repeat center / contain;}
.boutons_fixes button span.place_qr {-webkit-mask: url('../img/qr.svg') ; mask: url('../img/qr.svg') no-repeat center / contain;}


.boutons_fixes button span.siteweb_souris{-webkit-mask: url('../img/souris.svg') ; mask: url('../img/souris.svg') no-repeat center / contain;}
.boutons_fixes button span.siteweb_eye {-webkit-mask: url('../img/eye.svg') ; mask: url('../img/eye.svg') no-repeat center / contain;}
.boutons_fixes button span.siteweb_design {-webkit-mask: url('../img/paint.svg') ; mask: url('../img/paint.svg') no-repeat center / contain;}


.btn_actions_collaborateur .imprimer_collaborateur {-webkit-mask: url('../img/print.svg') ; mask: url('../img/print.svg') no-repeat center / contain;}
.btn_actions_collaborateur .partager_collaborateur {-webkit-mask: url('../img/share.svg') ; mask: url('../img/share.svg') no-repeat center / contain;}


.boutons_fixes button span.promo_encours {-webkit-mask: url('../img/promo.svg') ; mask: url('../img/promo.svg') no-repeat center / contain;}
.boutons_fixes button span.promo_ajouter {-webkit-mask: url('../img/promo_ajouter.svg') ; mask: url('../img/promo_ajouter.svg') no-repeat center / contain;}
.boutons_fixes button span.promo_archive {-webkit-mask: url('../img/promo_archive.svg') ; mask: url('../img/promo_archive.svg') no-repeat center / contain;}




.boutons_fixes button.sur_la_page {
    box-shadow: 3px 2px 14px #e148fd3b, -2px -2px 20px 0px #f45cf666;
    filter: none;
}


/* ===== INPUT SELECT TOOGLE ETC ===== */
a {
    text-decoration: unset;
    color: unset;
}

input, select , textarea {
    width: 100%;
    padding: 14px;
    background: rgba(0, 0, 0, 0.2);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-md);
    color: var(--text-main);
    font-size: 1rem;
    outline: none;
    margin-bottom: 10px;
    transition: border-color 0.2s , background-color 99999s ease-in-out;
}

select {
    /* Supprime la flèche native */
    appearance: none;
    -webkit-appearance: none;

    /* Ajoute ta propre flèche via background */
    background-image: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24'><path fill='%23999999' d='M7 10l5 5 5-5z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 32px;

    /* Padding pour que le texte ne passe pas sous la flèche */
    padding-right: 30px;
}
option {
    background: #23163b;
    color: #ffffff;
}
select:focus {
    background-image: url("data:image/svg+xml, <svg xmlns='http://www.w3.org/2000/svg' width='32' height=32' viewBox='0 0 32 32'><path fill='%23ffffff' d='M7 10l5 5 5-5z'/></svg>");
}


input[type="time"]::-webkit-calendar-picker-indicator {
    display: none;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.2) inset !important;
    -webkit-text-fill-color: var(--text-main) !important;
}
        input:focus,select:focus, textarea:focus{
            border-color: var(--primary);
            background: rgba(0,0,0,0.3);
        }

 input[type="range"]{
    border:none;
 }


#native-month {
    font-family: inherit;
    color: inherit;
}
/* Les champs mois et année à l'intérieur */
#native-month::-webkit-datetime-edit-month-field,
#native-month::-webkit-datetime-edit-year-field {
    font-weight: normal;
    font-family: inherit;
    color: inherit;
    text-transform: capitalize;
}
/* Le wrapper global (règle le font-weight restant) */
#native-month::-webkit-datetime-edit-fields-wrapper {
    font-weight: normal;
    text-transform: capitalize;
}
/* L'icône calendrier à droite, si tu veux la personnaliser */
#native-month::-webkit-calendar-picker-indicator {
    cursor: pointer;
    opacity: 0.6;
}









        button {
            border-radius: var(--radius-sm);
            border: none;
            outline: none;
            padding: 5px;
            background:var(--btn_clair);
            color: white;
            text-transform: uppercase;
            font-size: 0.7em;
            font-weight: normal;
            cursor: pointer;
        }

button[type="submit"] {
    padding: 17px 25px;
    font-size: 0.9em;
    box-shadow: 0 0 12px #5cf6ac7d;
    background: linear-gradient(126deg, #dbed88, #36997d);
    display: flex;
    align-items: center;
    justify-self: anchor-center;
    margin: auto;
}

button[type="submit"]::before {
    content: '';
    display: inline-block;
    width: 25px;
    height: 25px;
    background-color: currentColor;
    -webkit-mask-image: var(--icon-save);
    mask-image: var(--icon-save);
    mask-size: contain;
    mask-repeat: no-repeat;
    vertical-align: middle;
    margin-right: 8px;
}
button[type="submit"].cadenas {

}
button[type="submit"].cadenas::before{
    -webkit-mask-image: var(--icon-cadenas);
    mask-image: var(--icon-cadenas);
}

.champ {
flex: 1;
}


.champ_inline {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
    width: 100%;
}
label {
    display: block;
    margin-bottom: 0.2rem;
    font-size: 0.85rem;
    font-weight: 400;
    text-indent: 11px;
    color: var(--text-secondary);
}

div#aperçu_image {
    position: relative;
    /* width: -webkit-fill-available; */
    background-color: var(--noir_transparent);
    aspect-ratio: 1 / 1;
    height: 95%;
    margin-top: 9px;
    display: flex;
    border-radius: var(--radius-md);
    border: 1px solid var(--glass-border);
    overflow: hidden;
    /* background-image: var(--icon-no-pict); */
    background-repeat: no-repeat;
    background-position: center;
    background-size: 35%;
    text-align: center;
    font-variant-caps: all-small-caps;
    color: #9797b3;
    /* font-weight: bold; */
    flex-direction: column;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}




.grille_dual {
    /* min-height: 100px; */
    display: flex;
    justify-content: space-between;
    gap: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    position: relative;
}
.icon_double_fleche {
    background-color: currentColor;       /* ← couleur dynamique */
    -webkit-mask-image: var(--icon-exchange);
    mask-image: var(--icon-exchange);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 35px;
    height: 35px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
div#liste_disponibles, div#liste_selection {
    flex: 1;
    padding: 13px;
    background-color: var(--noir_transparent);
    border-radius: var(--radius-lg);
    border: 1px solid var(--glass-border);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 13px;
    align-items: flex-start;
    position: relative;
    margin-top: 25px;
    min-height: 100px;
}
div#liste_disponibles button, div#liste_selection button{
    padding: 9px 5px;
}
div#liste_disponibles span, div#liste_selection span {
    position: absolute;
    width: 100%;
    text-align: center;
    top: -25px;
}
div#liste_disponibles button {
    background: #4329739c;
    /* border: 1px solid #8f5cf6; */
    color: #a985e1;
}
div#liste_disponibles button small{
    color: var(--text-secondary);
    font-size: inherit;
}
div#liste_selection button small {
    color: var(--bg-body);
    font-size: inherit;
}
button.btn_opt span {
    color: var(--bg-body);
    display: inline;
    position: unset !important;
}




/* //////////////////////checkbox ///////////////////////*/

.checkbox-wrapper-22 {
    display: inline-flex;
    align-items: center;
    flex-direction: row;
    font-size: 0.85rem;
    font-weight: 400;
    color: var(--text-main);
    position: relative;
    gap: 8px;
    justify-content: space-evenly;
}
.checkbox-wrapper-22 .switch {
    display: inline-block;
    height: 28px;
    position: relative;
    width: 50px;
}

  .checkbox-wrapper-22 .switch input {
    display:none;
  }

  .checkbox-wrapper-22 .slider {
    background-color: transparent;
    bottom: 0;
    cursor: pointer;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: .4s;
  }

.checkbox-wrapper-22 .slider:before {
    border-radius: 50%;
    background-color: var(--primary-hover);
    bottom: 3px;
    content: "";
    height: 21px;
    left: 2px;
    position: absolute;
    transition: .4s;
    width: 21px;
}

.checkbox-wrapper-22 input:checked + .slider {
    background-color: #23af1847;
    box-shadow: inset 6px 6px 6px #00000078, inset -6px -6px 6px #ffffff1a;
}

.checkbox-wrapper-22 input:checked + .slider:before {
    transform: translateX(26px);
    background-color: var(--success);
    box-shadow: 0px 0px 11px 0px var(--success);
    filter: none;
}

.checkbox-wrapper-22 .slider.round {
    border-radius: 34px;
    box-shadow: inset 6px 6px 6px #00000078, inset -6px -6px 6px #ffffff1a;
}

.checkbox-wrapper-22 .slider.round:before {
    background-color: var(--primary-hover);
    filter: grayscale(0.5);
}

.checkbox-wrapper-22 span.btn-aide-section.material-symbols-rounded {
    position: absolute;
    top: -18px;
    right: -45px;
}

.warning_siteweb {
    display: block;
    /* position: absolute; */
    color: var(--warning);
    /* margin-top: -26px; */
    right: 0;
    /* transform: translateX(50%); */
    width: 100%;
}
/* //////////////////////checkbox ///////////////////////*/













/* ===== MOBILE MENU ===== */
#mobile-menu-overlay {
    position: fixed;
    display: none;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    z-index: 998;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

#mobile-menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

#mobile-menu {
    position: fixed;
    display: none;
    top: 60px;
    bottom: 0;
    right: 0;
    width: 75vw;
    /* height: calc(100vh - 30vw); */
    background-color: white;
    background-image: radial-gradient(circle at 10% 20%, rgb(139 92 246 / 64%) 0%, #ffffff17 40%), radial-gradient(circle at 90% 80%, rgb(236 72 153 / 36%) 0%, #ffffff2b 40%), radial-gradient(circle at 50% 50%, rgb(59 130 246 / 31%) 0%, #ffffff4a 60%);
    z-index: 1501;
    transform: translateX(100%);
    transition: transform 0.3s ease;
    overflow-y: auto;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(8px);
}

#mobile-menu.active {
    transform: translateX(0);

}

.mobile-menu-content {
    padding: 20px;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60vw);
    justify-content: space-between;
        overflow: auto;
}

#mobile-menu-links {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.mobile-menu-link {
    display: block;
    padding: 7px 20px;
    margin-bottom: 6px;
    color: #333;
    text-decoration: none;
    border-radius: 10px;
    /* background: #ecf0f3; */
    /* box-shadow: 2px 2px 5px #cbced1, -2px -2px 5px white; */
    transition: all 0.2s;
    font-size: 0.95rem;
    background-repeat: no-repeat;
    background-size: auto 72%;
    background-position: 20px center;
    text-indent: 45px;
}

.mobile-menu-link:active {
    box-shadow: inset 2px 2px 5px #cbced1, inset -2px -2px 5px white;
    transform: scale(0.98);
}

.mobile-menu-link.disabled {
    opacity: 0.5;
    pointer-events: none;
}

.mobile-menu-content h4 , #desktop-menu h4{
    opacity: 0.6;
    font-variant-caps: all-small-caps;
    text-indent: 19px;
    margin-bottom: 3px;
    margin-top: -1px;
    font-weight: 400;
    font-size: 0.9em;
    text-align: left;
}
.mobile-menu-content h4 {color: #574f83;}
#desktop-menu h4 {
    color: #efb3ff7a;
    text-indent: 18px;
    opacity: unset;}

.mobile-menu-footer {
    margin-top: 0px;
    padding: 13px 13px 13px 13px;
    padding-bottom: 20px;
    border-top: 1px solid #c4a5ff4f;
    bottom: 0px;
    position: inherit;
    width: 100%;
    color: var(--sidebar-bg);
}

.footer_info {
    display: flex;
    position: absolute;
    top: -30px;
    right: 0;
    justify-content: flex-end;
    padding: 8px 16px;
}

#btn-deconnexion {
    background: var(--danger);
    /* line-height: 30px; */
    color: white;
    /* font-weight: bold; */
    /* box-shadow: none; */
    /* display: block; */
    text-align: right;
    /* width: fit-content; */
    float: right;
    padding: 3px 17px;
    margin-top: 19px;
    border-radius: 8px;
    font-size: 0.9em;
}

.mobile-menu-link.logout:active {
    box-shadow: inset 2px 2px 5px rgba(0,0,0,0.2), inset -2px -2px 5px rgba(255,255,255,0.1);
}

/* Animation croix burger */
.menu-toggle.active .menu-toggle-bar--top {
    transform: translateY(0px) rotate(45deg);
}

.menu-toggle.active .menu-toggle-bar--middle {
    opacity: 0;
}

.menu-toggle.active .menu-toggle-bar--bottom {
    transform: translateY(0px) rotate(-45deg);
}






/* ===== DESKTOP MENU ===== */
#desktop-menu{
        flex: 1;
    display: flex;
    flex-direction: column;
    gap: 5px;

}
#desktop-menu a {
    display: block;
    padding: 7px 20px;
    margin-bottom: -2px;
    color: #333;
    text-decoration: none;
    border-radius: 10px;
    transition: all 0.2s;
    font-size: 0.95rem;
    background-repeat: no-repeat;
    background-size: auto 72%;
    background-position: 20px center;
    text-indent: 45px;
}









/* ===== SECTION COLLABORATEURS ===== */
.team_change-me {
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}
.team_change-me button {
    padding: 20px;
}



.pastille-collaborateur {
    padding: 10px 10px 10px 30px;
    border-top: var(--glass-clair-border);
    border-left: var(--glass-clair-border);
    border-radius: var(--radius-sm);
    width: 100%;
    height: 80px;
    background: var(--blanc_transparent);
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    margin-bottom: 9px;
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    /* background-image: var(--icon-drag); */
    background-position: 5px center;
    background-repeat: no-repeat;
    font-size: 1.1em;
}






/* ===== SECTION LIVRAISON ===== */
.toggle-zone { text-align: center; margin-bottom: 10px; }
.toggle-zone small { display: block; margin-top: 8px; color: #888; }

.bloc-conditionnel { display: none; }
.bloc-conditionnel.visible { display: block; }

/* Faux radio toggles */
.gestion-options { display: flex; flex-direction: column; gap: 12px;}
.gestion-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid transparent;
    border-radius: var(--radius-lg);
    cursor: pointer;
    transition: all 0.2s;
    flex-direction: column;
}
.gestion-option.active {
    border-color: #ccc1df42;
    background: var(--blanc_transparent);
    border-style: solid none none solid;
}
.gestion-option .checkbox-wrapper-22 { flex-shrink: 0; }
.gestion-option-entete {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.gestion-option-titre {
    font-weight: 700;
    color: white;
    
    font-size: 0.95rem;
    text-align: left;
}
.gestion-option.active .gestion-option-titre {
    color: var(--success);

}
.gestion-option-desc {  
    display: block;
    color: #888;
    font-size: 0.82rem;
    line-height: 1.4;
    text-align: center;
}

.liste-tarifs { width: 100%; border-collapse: collapse; font-size: 0.9rem; margin-bottom: 15px; }
.liste-tarifs th { 
        text-align: left;
    padding: 8px 4px;
    border-bottom: 1px solid var(--text-secondary);
    color: #4a5f71;
    font-size: 0.8rem;
}
.liste-tarifs td {    
    padding: 10px 4px;
    border-bottom: 1px solid var(--glass-bg-hover);
}
.liste-tarifs .btn-suppr { background: #ef4444; color: white; border: none; border-radius: 8px; padding: 5px 10px; cursor: pointer; font-weight: bold; }

.btn-ajouter {
    width: 100%;
    padding: 23px;
    background: transparent;
    color: var(--info_bleu);
    cursor: pointer;
}
.btn-ajouter:hover { border-color: #4c3f61; color: #4c3f61; }

/* Modal */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 999; justify-content: center; align-items: center; }
.modal-overlay.active { display: flex; }
.modal-contenu { background: #fff; border-radius: 16px; padding: 24px; width: 90%; max-width: 400px; }
.modal-contenu h3 { margin: 0 0 20px; color: #4c3f61; }
.modal-contenu .champ { margin-bottom: 14px; }
.modal-contenu label { display: block; margin-bottom: 6px; font-weight: 600; font-size: 0.9rem; }
.modal-contenu input { width: 100%; padding: 10px; border: 1px solid #e5e7eb; border-radius: 10px; font-size: 1rem; }
.modal-contenu .erreur-modal { background: #fee2e2; border: 1px solid #fecaca; color: #991b1b; padding: 8px; border-radius: 8px; margin-bottom: 12px; font-size: 0.85rem; display: none; }
.modal-actions { display: flex; gap: 10px; margin-top: 20px; }
.modal-actions button { flex: 1; padding: 12px; border: none; border-radius: 10px; font-weight: 700; cursor: pointer; }
.btn-modal-valider { background: #4c3f61; color: #fff; }
.btn-modal-annuler { background: #e5e7eb; color: #555; }

.vide-tarif { text-align: center; color: #999; font-style: italic; padding: 20px 0; }

/* Masquage dynamique colonne livreur */
.masquer-livreur .col-livreur { display: none; }
.masquer-livreur .champ-livreur { display: none; }

.conteneur_regle_tarifaire {
    display: flex;
    justify-content: space-between;
    gap: 46px;
}





/* =====  HISTORIQUE DE COMMANDE ===== */


/* Loader de synchronisation */
#loader-sync {
    display: none;
    position: fixed;
    top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,0.7);
    z-index: 9999;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
#loader-sync.active { display: flex; }

.loader-content {
    background: white;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}
.loader-spinner {
    width: 50px; height: 50px;
    border: 5px solid #ecf0f3;
    border-top: 5px solid #4c3f61;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 20px;
}
@keyframes spin {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.btn-sync {
    /* position: absolute; */
    margin-bottom: 30px;
    margin-top: -20px;
    align-self: center;
    background: #ffffff;
    cursor: pointer;
    transition: all 0.3s;
    font-size: 0.6em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    width: 30px;
    height: 30px;
    background-position: center;
    background-repeat: no-repeat;
    gap: 5px;
    right: 0;
    color: white;
    -webkit-mask-image: var(--icon-actualiser);
    mask-image: var(--icon-actualiser);
}
.btn-sync img { width: 16px; color: white;}
.btn-sync:hover {
    transform: translateY(-2px);
}
.btn-sync:active { transform: translateY(0); }

/* tuiles grid */

.histo_grille_stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 5px;
    grid-auto-flow: dense;
    margin-bottom: 30px;
    color: var(--texte_blanc_leger);
    grid-auto-rows: 60px;
}
.tuile_histo {
    background-color: var(--glass-bg);
    border-radius: var(--radius-lg);
    border-top: 1px solid var(--glass-border);
    border-left: 1px solid var(--glass-border);
    padding: 16px 15px 7px 15px;
    margin: 20px 0px;
    height: auto;
    margin: 0;
    position: relative;
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    justify-content: center;
    grid-row: span 2; 
    container-type: inline-size;
}
.tuile_histo-large {
    grid-column: span 2;
}
.tuile_histo-haute {
    grid-row: span 3; 
}
.tuile_histo-demi {
        grid-row: span 1;
        grid-column:  span 2;
}
.tuile_histo h3 {
    font-size: 0.9rem;
    color: rgb(255 255 255 / 20%);
    position: absolute;
    top: 1px;
    left:0;
    font-weight: 300;
    width: 100%;
    text-align: center;
    font-variant-caps: all-small-caps;
}
.tuile_histo ul {
    list-style: none;
    padding: 0;
    margin-top: 5px;
    font-size: 0.9rem;
    width:100%;
    align-self: center;
    display: flex;
    flex-direction: column;
    /* gap: 3px; */
}
.tuile_histo ul.histo_ul_2colonnes {
    display: grid;
    grid-template-rows: repeat(4, auto);
    grid-auto-flow: column;
    grid-auto-columns: minmax(176px, 1fr);
    column-gap: 37px;
}
.tuile_histo ul li {
    display: flex;
    justify-content: space-between;
    width: 100%;
    line-height: 25px;
}



/* tableau des sessions */

.session-table {
    border-collapse: collapse;
    width: 100%;
}
tr.session-row {
    cursor: pointer;
}
.session-table td, .session-table th {
    border-bottom: 1px solid var(--blanc_transparent);
    padding: 11px 0px;
    text-align: center;
}

.session-table th {
    border-bottom: 1px solid white;

}
.num_et_heure {
    line-height: 13px;
}
.num_et_heure span.liste_no_ticket {
    font-size: 1.5em;
    font-weight: 900;
}
.icon_canal_paye {
    background-color: currentColor;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    height: 26px;
    aspect-ratio: 1/1;
    display: inline-block;
}

.icon_canal_paye.caisse {-webkit-mask: url('../img/caisse.svg') ; mask: url('../img/caisse.svg') no-repeat center / contain;}
.icon_canal_paye.caisse_mobile {-webkit-mask: url('../img/caisse_mobile.svg') ; mask: url('../img/caisse_mobile.svg') no-repeat center / contain;}
.icon_canal_paye.telephone {-webkit-mask: url('../img/phone.svg') ; mask: url('../img/phone.svg') no-repeat center / contain;}
.icon_canal_paye.borne {-webkit-mask: url('../img/borne.svg') ; mask: url('../img/borne.svg') no-repeat center / contain;}
.icon_canal_paye.uber-eats {-webkit-mask: url('../img/uber.svg') ; mask: url('../img/uber.svg') no-repeat center / contain;}
.icon_canal_paye.deliveroo {-webkit-mask: url('../img/deliveroo.svg') ; mask: url('../img/deliveroo.svg') no-repeat center / contain;}

.icon_canal_paye.sur_place {-webkit-mask: url('../img/sur_place.svg') ; mask: url('../img/sur_place.svg') no-repeat center / contain;}
.icon_canal_paye.emporte {-webkit-mask: url('../img/emporte.svg') ; mask: url('../img/emporte.svg') no-repeat center / contain;}
.icon_canal_paye.livraison {-webkit-mask: url('../img/livraison.svg') ; mask: url('../img/livraison.svg') no-repeat center / contain;}

.icon_canal_paye.carte {-webkit-mask: url('../img/cb.svg') ; mask: url('../img/cb.svg') no-repeat center / contain;}
.icon_canal_paye.especes {-webkit-mask: url('../img/especes.svg') ; mask: url('../img/especes.svg') no-repeat center / contain;}
.icon_canal_paye.ticket_resto {-webkit-mask: url('../img/ticket.svg') ; mask: url('../img/ticket.svg') no-repeat center / contain;}
.icon_canal_paye.mixte {-webkit-mask: url('../img/mixte.svg') ; mask: url('../img/mixte.svg') no-repeat center / contain;}
.icon_canal_paye.partenaire {-webkit-mask-image: var(--icon-partenaire); mask-image: var(--icon-partenaire);}



/* =====  MODAL DETAIL DE LA COMMANDE ===== */


.avatar-collab {
    aspect-ratio: 1 /1;
    width: 40px;
    background: linear-gradient(
318deg, #940aaf, #c754dd);
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-weight: normal;
    color: #dca4e7;
    font-size: 20px;
}





.btn_upload_studio {
    display: flex;
    gap: 15px;
    align-items: center;
    flex-direction: row;
    width: 100%;
    padding: 14px 10px;
}



@media (max-width: 1024px) {
            sidebar {
                display: none;
            }
            conteneur{
            width: 100%; 
            }
            contenu {

    padding: 15px 15px 120px 15px;

}
            entete {
            height: 65px;
            }
            logo_wegrow_mobile {display: block;}
            .menu-toggle {
            display: block;
            }
            #mobile-menu-overlay , #mobile-menu {
                display: block;
            }

.liste {
    width: 100%;
    margin: 0;
    margin-bottom: 15vh;
    min-width: unset;
    max-width: unset;
}
.ligne_groupe_option {
    width: 100%;
}
a#bouton_ajouter_groupe_option{
    width: 100%;
}
            button.ajout_categ{
                  width: calc(100% - 45px);
              
            }

            .cat-row {
                width: calc(100% - 45px);
            }
section {
    margin-left: 0;
    min-width: unset;
    max-width: unset;
    padding: 0px;
}

            /* ===== BOUTON NAV LISTE PRODUITS ===== */
.colonne_fixe_gauche {
    position: unset;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    gap: 20px;
    padding: 0;
}


.boutons_fixes {
    position: fixed;
    display: flex;
    bottom: 0px ! important;
    top: unset !important;
    flex-direction: row;
    width: 100dvw;
    padding: 30px 10px 20px 10px;
    left: 0px;
    background: linear-gradient(0deg, var(--sidebar-bg), transparent);
    gap: 11px;
    margin: 0px;
    flex-wrap: nowrap;
    z-index: 10;
    justify-content: space-evenly;
}
.boutons_fixes button {
    filter: grayscale(0.6);
    padding: 5px 18px;
    padding: 9px 5px;
    text-align: center;
    flex: 1;
    font-size: 0.7em;
    min-height: unset;
}
.boutons_fixes button span {
    /*height: 56%;
    left: 8px;*/
    display: none;
}
.boutons_fixes button.sur_la_page {
    box-shadow: 0 0 14px var(--primary-hover);
    filter: none;
}

.grille_dual{
        flex-direction: column;
        gap: 5px;
}
.conteneur_regle_tarifaire {
    display: flex;
    justify-content: space-between;
    gap: 46px;
    flex-direction: column;
}
div#liste_disponibles {
    margin-top: 0;
    margin-bottom: 25px;

}
div#liste_disponibles span {
    top: unset;
    bottom: -25px;
    left: 0;

}
div#liste_selection span {
    left: 0;

}
.icon_double_fleche {
    position: unset;
    /* width: 100%; */
    background-size: cover;
    align-self: anchor-center;
    transform: rotate(90deg);
    margin: -34px;
}
/* ===== BESOIN D'AIDE (BOUTON + CADRE) ===== */
/* Bouton "Besoin d'aide ?" */
.btn-aide {
    right: 10px;
    font-size: 0.85em;
}
#info_entete, .info_entete {
    left: 0%;
    width: 100%;
    max-width: 700px;
    bottom: 0;
    transform: translateY(100%) translateX(0%);
    box-shadow: 0px -13px 34px 7px #ebacff47;
}
#info_entete.visible, .info_entete.visible {
    transform: translateY(0%) translateX(0%);
}
    




/* ===== TUILE STATISTIQUE SIMPLIFIE ===== */

.tuile_histo-demi {
        grid-column:  span 1;
}


/* ===== TUILE HISTORIQUE DE COMMANDE ===== */


.histo_grille_stats{
    grid-template-columns : none;
        grid-auto-rows: 45px;
}
.tuile_histo-large {
    grid-column: 2;
    grid-row: span 4;
}
.tuile_histo ul{
    font-size: clamp(0.65em, 8cqw, 0.8em);
}
    
.tuile_histo ul.histo_ul_2colonnes {
    display: grid;
    grid-template-rows: repeat(3, auto);
    grid-auto-flow: unset; 
    grid-auto-columns: unset; 
    column-gap: 37px;
}
.tuile_histo-haute {
    grid-row: span 3; 
}
.tuile_histo ul li{
    line-height: 20px;
}




/* tableau des sessions */

.session-table {
    font-size: 0.85em;
}




}
/* Promotions */
.autocomplete-wrap { position: relative; }
.autocomplete-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--bg-body);
    border: 1px solid var(--glass-border, #e5e7eb);
    border-radius: var(--radius-sm, 8px);
    max-height: 200px;
    overflow-y: auto;
    z-index: 200;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
    display: none;
}
.autocomplete-item {
    padding: 9px 14px;
    cursor: pointer;
    font-size: 0.88em;
    border-bottom: 1px solid var(--glass-border, #f0f0f0);
}
.autocomplete-item:last-child { border-bottom: none; }
.autocomplete-item:hover { background: rgba(0,0,0,0.04); }
.zone-selection {
    display: none;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 10px;
    background: rgba(0,0,0,0.03);
    border-radius: var(--radius-sm, 8px);
    margin-top: 8px;
}



.zone-selection .produit-nom { font-size: 0.88em; font-weight: 600; flex: 1; min-width: 120px; }
.zone-selection input[type=number], .zone-selection input[type=time], .zone-selection select {
    padding: 6px 8px;
    border: 1px solid var(--glass-border, #e5e7eb);
    border-radius: 6px;
    font-size: 0.85em;
    width: 90px;
}
.zone-selection select { width: 130px; }
.btn-ajouter-produit {
    padding: 6px 14px;
    background: var(--primary, #f59e0b);
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85em;
    display: block;
    margin: auto;
    margin-top: 10px;
}
#zone_offre{
    grid-template-columns: repeat(2, 1fr);
    display: none;
    justify-items: start;
    align-items: center;
}
#zone_plage{

}
#liste_panier , #liste_offre {
    display: flex;
    gap: 5px 7px;
    flex-direction: row;
    flex-wrap: wrap;
}
.produit-tag {
    display: flex;
    gap: 8px;
    padding: 7px 8px;
    background: var(--sidebar-bg);
    border-radius: 8px;
    font-size: 0.85em;
    border-bottom: 1px solid var(--blanc_transparent);
    flex-direction: row;
    align-items: center;
    line-height: 1.4em;
}
.produit-tag .tag-nom { flex: 1; }
.produit-tag .tag-info { color: var(--text-secondary); font-size: 0.9em; }
.produit-tag .tag-retirer {
    margin-left: auto;
    cursor: pointer;
    color: var(--danger, #dc2626);
    font-weight: bold;
    font-size: 1.3em;
    line-height: 1;
    padding: 0 4px;
}
.checkboxes-ligne {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 0px;
    justify-content: center;
    text-align: center;
}
.checkboxes-ligne label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9em;
    cursor: pointer;
}
.checkboxes-ligne input[type=checkbox] { width: 16px; height: 16px; accent-color: var(--primary, #f59e0b); cursor: pointer; }
h4.titre_section_promo{
    display: block;
    text-align: center;
    font-variant-caps: all-small-caps;
    margin: 20px;
}

input#plage_debut, input#plage_fin {
    width: 60px;
    margin-bottom: 0;
}
span#plage_jour_nom {
    min-width: unset;
}
.label_avec_aide{
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 0;
}