/*  ========================================================================================================  */
/*  Charte Operion — couleurs & typo                                                                          */
/*  --------------------------------------------------------------------------------------------------------  */
:root {
    --op-navy: #0D1B2A;
    --op-deep-blue: #3D4349;
    --op-deep-blue-a63: #3D4349a0;
    --op-blue: #5B6472;
    --op-blue-rgb: 91, 100, 114;
    --op-blue-80: rgba(var(--op-blue-rgb), 0.8);
    --op-blue-85: rgba(var(--op-blue-rgb), 0.85);
    --op-blue-48: rgba(var(--op-blue-rgb), 0.48);
    --op-blue-29: rgba(var(--op-blue-rgb), 0.29);
    --op-nav-hover: #6D7582;
    --op-row-commande: #eceff2;
    --op-row-commande-selected: #dde2e8;
    --op-orange: #FF8A00;
    --op-slate: #64748B;
    --op-surface: #F2F4F7;
    --op-white: #FFFFFF;
}
/*  ========================================================================================================  */
/*  HTML5 Default Markers                                                                                     */
/*  --------------------------------------------------------------------------------------------------------  */
html        {margin:0;padding:0;font-family:"Montserrat",system-ui,-apple-system,sans-serif;font-size:14px;line-height:16px;}
body        {margin:0;padding:0;background-color:var(--op-surface);color:#0f172a;min-width:1280px;overflow-x:hidden;overflow-y:scroll;}
div         {margin:0;padding:0;background-color:transparent;color:#0f172a;}
ul          {margin:0;padding:0;list-style:circle;}
li          {margin:0;padding:0;}
p           {margin:0;padding:0;}
a           {margin:0;padding:0;text-decoration:none;color:var(--op-blue);}
/*  --------------------------------------------------------------------------------------------------------  */
@media screen and (max-width: 1280px) {
    body {overflow-x:scroll;}
}
/*  --------------------------------------------------------------------------------------------------------  */


/*  ========================================================================================================  */
/*  HTML5 Custom Utilities                                                                                    */
/*  --------------------------------------------------------------------------------------------------------  */
.noSelect { -moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none; }
.noCursor { cursor:default !important; }
/*  --------------------------------------------------------------------------------------------------------  */
::-webkit-scrollbar { width:14px;height:14px; }
::-webkit-scrollbar-track { background:var(--op-deep-blue);border-left:1px solid #cbd5e1;border-right:1px solid #cbd5e1; }
::-webkit-scrollbar-thumb { background:#cbd5e1;border-left:1px solid #94a3b8;border-right:1px solid #94a3b8;box-shadow:inset 0 0 0 1px rgba(13,27,42,0.35); }
::-webkit-scrollbar-thumb:hover { background:#DADADA; }
/*  --------------------------------------------------------------------------------------------------------  */


/*  ========================================================================================================  */
/*  HTML5 Navbar Styles                                                                                       */
/*  --------------------------------------------------------------------------------------------------------  */
div.navbar { z-index:9999;width:100%;height:40px;position:fixed;top:0;left:0;display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;background-color:var(--op-navy);padding-left:20px;padding-right:24px;box-sizing:border-box;box-shadow:0 2px 8px rgba(13,27,42,0.35);overflow:visible; }
/*  --------------------------------------------------------------------------------------------------------  */
div.navbar > a.navbar-logo-link { margin-right:10px;display:flex;flex-shrink:0;align-items:center;align-self:stretch;line-height:0;text-decoration:none;overflow:visible; }
div.navbar > a.navbar-logo-link:focus { outline:2px solid var(--op-blue);outline-offset:2px; }
/* SVG prévu pour fond clair (#0d1b2a) : sur barre marine, éclaircir icône + texte pour le contraste */
div.navbar > a.navbar-logo-link > svg.navbar-logo-svg path.a { fill: #f1f5f9 !important; }
div.navbar > a.navbar-logo-link > svg.navbar-logo-svg path.c { fill: #cbd5e1 !important; }
div.navbar > a.navbar-logo-link > svg.navbar-logo-svg text { fill: #f1f5f9 !important; }
div.navbar > a.navbar-logo-link > svg.navbar-logo-svg text tspan { fill: var(--op-orange) !important; }
div.navbar > a.navbar-logo-link > svg.navbar-logo-svg { display:block;height:34px;width:auto;max-height:38px;max-width:min(280px,50vw);flex-shrink:0;box-sizing:content-box; }
div.navbar > a.navbar-logo-link > img.navbar-logo { display:block;height:34px;width:auto;max-width:min(280px, 50vw);max-height:38px;object-fit:contain;object-position:left center;vertical-align:middle;flex-shrink:0; }
div.navbar > div.navbar-brand-text { margin-right:14px;display:inline-flex;flex-direction:column;flex-shrink:0;justify-content:center;line-height:1.15;max-width:200px; }
div.navbar .navbar-brand-tagline { font-family:"Montserrat",system-ui,sans-serif;font-weight:500;font-size:9px;letter-spacing:0.03em;color:#94a3b8;text-transform:uppercase; }
div.navbar a { cursor:pointer; }
/*  --------------------------------------------------------------------------------------------------------  */
div.navbar > ul { position:relative;display:inline-flex;flex:1 1 auto;flex-direction:row;list-style:none;min-width:0;margin-right:260px; }
div.navbar > ul > li { height:40px;position:relative;display:inline-flex;flex-direction:column; }
div.navbar > ul > li > a { padding:0 8px;display:block;height:100%;font-size:16px;line-height:40px;text-align:center;text-shadow:0 0 1px #FFFFFF;color:#FFFFFF; }
div.navbar > ul > li > a:hover,
div.navbar > ul > li.active > a,
div.navbar > ul > li:hover > a { background-color:var(--op-nav-hover); }
/*  --------------------------------------------------------------------------------------------------------  */
div.navbar > ul > li > ul { position:absolute;top:40px;display:none;flex:1 1 auto;flex-direction:column;list-style:none; }
div.navbar > ul > li:hover > ul { display:inline-flex; }
div.navbar > ul > li > ul > li { margin:0;padding:0;height:28px;background-color:var(--op-deep-blue);min-width:190px; }
div.navbar > ul > li > ul > li.item-divide { display:block;margin:0;padding:0;width:100%;height:1px;background-color:#FFFFFF;opacity:1; }
div.navbar > ul > li > ul > li.item-divide:first-of-type { display:none; }
div.navbar > ul > li > ul > li.item-divide:last-of-type { display:none; }
div.navbar > ul > li > ul > li > a { padding:0 8px;display:block;height:100%;font-size:16px;line-height:28px;text-align:left;text-shadow:0 0 1px #FFFFFF;color:#FFFFFF;white-space:nowrap; }
div.navbar > ul > li > ul > li > a:hover,
div.navbar > ul > li > ul > li.active > a { background-color:var(--op-nav-hover); }
/*  --------------------------------------------------------------------------------------------------------  */
div.navbar > div.navbar-ctrl { position:fixed;top:0;right:24px;height:40px;z-index:10000;display:inline-flex;flex-direction:row;align-items:center;background-color:var(--op-navy); }
div.navbar > div.navbar-ctrl > a { padding:0 8px;position:relative;display:inline-flex;height:40px;font-size:16px;line-height:40px;text-align:center;text-shadow:0 0 1px #FFFFFF;color:#FFFFFF !important; }
div.navbar > div.navbar-ctrl > a > i { padding:0 4px 0 0;height:40px;font-size:18px;line-height:40px;background-color:transparent; }
div.navbar > div.navbar-ctrl > a:hover,
div.navbar > div.navbar-ctrl > a.active { background-color:var(--op-nav-hover); }
div.navbar > div.navbar-ctrl > .navbar-user-wrap { position:relative;display:inline-flex;align-items:center;flex-shrink:0; }
div.navbar > div.navbar-ctrl > .navbar-user-wrap > a.navbar-user-link { flex-shrink:0;white-space:nowrap;color:#FFFFFF !important; }
div.navbar > div.navbar-ctrl > .navbar-user-wrap > .nav-badge-retard { display:none;position:absolute;top:4px;right:0;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background-color:#c62828;color:#fff;font-size:11px;font-weight:700;line-height:18px;align-items:center;justify-content:center;text-align:center;box-sizing:border-box; }
/*  --------------------------------------------------------------------------------------------------------  */


/*  ========================================================================================================  */
/*  HTML5 Footer Styles                                                                                       */
/*  --------------------------------------------------------------------------------------------------------  */
div.footer { z-index:1016;width:100%;height:20px;position:fixed;left:0;bottom:0;display:inline-flex;background-color:var(--op-navy);align-items:center;justify-content:flex-start;border-style:solid;border-color:rgba(255,255,255,0.12);border-width:1px 0 0 0; }
div.footer > .copyright { padding-left:4px;height:20px;display:inline-flex;flex:1 0 auto;font-size:12px;line-height:20px;color:#EDEDED; }
div.footer > .version { padding-right:4px;height:20px;display:inline-flex;flex:0 0 auto;font-size:12px;line-height:20px;color:#EDEDED; }
/*  --------------------------------------------------------------------------------------------------------  */


/*  ========================================================================================================  */
/*  HTML5 Form Styles | Notification                                                                          */
/*  --------------------------------------------------------------------------------------------------------  */
div.notify { position:relative;top:0;left:0;margin:0;padding:4px 0;width:100%;display:inline-flex;flex:1 1 auto;flex-direction:column;flex-wrap:wrap;justify-content:center;align-items:stretch;align-content:center;background-color:transparent;border-top:2px solid var(--op-deep-blue);border-bottom:2px solid var(--op-deep-blue); }
div.notify > label { position:relative;left:0;top:0;margin:4px 0;padding:4px 0;width:320px;height:auto;display:inline-flex;flex:1 1 auto;flex-direction:column;flex-wrap:wrap;justify-content:center;align-items:stretch;align-content:center;line-height:18px;font-size:15px;font-weight:400;color:#0f172a;border-bottom:1px solid var(--op-blue);border-top:1px solid var(--op-blue);overflow-y:visible; }
div.notify > input[type=button] { display:block;height:32px;width:320px;line-height:26px;margin-top:4px;border:3px double var(--op-blue);background-color:var(--op-white);cursor:pointer;box-shadow:0 0 0 2px var(--op-blue) inset;font-weight:600;color:#0f172a;outline:0; }
div.notify > input[type=button]:focus { outline:none; }
/*  --------------------------------------------------------------------------------------------------------  */