/* INORDINE_GRAY_RED_V1. Only presentation. No sizes of product, recipe or status colors are changed. */
html[data-inordine-visual-theme="gray-red"]{color-scheme:light;--background:#f5f6f7!important;--foreground:#292e34!important;--card:#fff!important;--card-foreground:#292e34!important;--popover:#fff!important;--popover-foreground:#292e34!important;--primary:#d9dde1!important;--primary-foreground:#292e34!important;--secondary:#eef0f2!important;--secondary-foreground:#292e34!important;--muted:#eef0f2!important;--muted-foreground:#58616c!important;--accent:#fff0f2!important;--accent-foreground:#a42036!important;--border:#c9cfd5!important;--input:#b7bec6!important;--ring:#b5263c!important;--navy:#292e34!important;--orange:#b5263c!important}
html[data-inordine-visual-theme] :is(.text-primary,.text-secondary-foreground){color:#292e34!important}
html[data-inordine-visual-theme] :is(.bg-primary,.bg-primary.text-white){background-color:#d9dde1!important;color:#292e34!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar){background:#d9dde1!important;background-image:none!important;color:#292e34!important;border-right:1px solid #b8c0c8!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) :is(p,strong,small,label,[class*="text-white"],[class*="text-slate-200"],[class*="text-slate-300"]){color:#343b44!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav{--menu-ink:#292e34;--menu-accent:#b5263c;--menu-selected:#fff}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a){color:#292e34!important;background-color:transparent!important;border-color:transparent!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a):hover{color:#292e34!important;background:#eef0f2!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a)[aria-current="page"]{background:#fff!important;color:#a42036!important;border-color:#c3cad1!important;box-shadow:inset 3px 0 #b5263c!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a)>span,html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a)>svg{color:inherit!important}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav :is(button,a):focus-visible{outline:3px solid #a42036!important;outline-offset:2px}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav [aria-label^="Sottomenu"]{border-left-color:#a8b2bc!important}
html[data-inordine-visual-theme] .inordine-sidebar-alerts{background:#e7eaed!important;border-color:#b8c0c8!important;color:#292e34!important}
html[data-inordine-visual-theme] .desktop-content>header{background:#f0f2f4!important;color:#292e34!important;border-bottom:1px solid #d2d7dc!important}
html[data-inordine-visual-theme] nav[aria-label="Navigazione mobile"]{background:#d9dde1!important;color:#292e34!important;border-color:#bbc3cb!important}
html[data-inordine-visual-theme] .portal-mobile-item{color:#292e34!important}
html[data-inordine-visual-theme] .portal-mobile-item[aria-current="page"]{background:#fff!important;color:#a42036!important}
html[data-inordine-visual-theme] .header{background:#eef0f2!important;color:#292e34!important}
html[data-inordine-visual-theme] .header a{color:#292e34!important}
html[data-inordine-visual-theme] :is(.discover-cta,.feature-demo,.meter-feature .feature-demo){background:#d9dde1!important;color:#292e34!important}
html[data-inordine-visual-theme] :is(.discover-cta,.feature-demo,.meter-feature .feature-demo) :is(p,small,.mini,.feature-tag,.meter-caption,.example-tags span){color:#46505c!important}
html[data-inordine-visual-theme] :is(.header .button,.button.submit){background:#b5263c!important;color:#fff!important}
/* Apply the new mark without deleting/replacing any previous image asset. */
html[data-inordine-logo="new"] :is(.brand-film,.app-brand-film){display:none!important}
html[data-inordine-logo="new"] .app-brand-host>img[alt="InOrdine.pro"]{opacity:1!important;position:relative!important;z-index:2!important}
html[data-inordine-logo="new"] img[data-inordine-logo-current]{object-fit:contain!important;object-position:center!important;max-width:100%!important;filter:none!important;opacity:1!important}
html[data-inordine-logo="new"] .header .brand>.io-brand-replacement{display:block;width:210px;height:110px;object-fit:contain}
html[data-inordine-logo="new"] .header:has(.io-brand-replacement){height:auto;min-height:106px}
html[data-inordine-logo="new"] .io-page-brand{display:flex;align-items:center;gap:14px;padding:9px 18px;background:#e8ebee;color:#292e34;border-bottom:1px solid #c9cfd5}
html[data-inordine-logo="new"] .io-page-brand a{display:inline-flex}
html[data-inordine-logo="new"] .io-page-brand img{width:130px;height:88px;object-fit:contain}
html[data-inordine-logo="new"] .io-page-brand small{font:12px system-ui;color:#46505c}
html[data-inordine-logo="new"] .desktop-sidebar.is-collapsed img[data-inordine-logo-current]{min-width:0!important;max-width:100%!important}
@media(max-width:650px){html[data-inordine-logo="new"] .header .brand>.io-brand-replacement{width:145px;height:98px}html[data-inordine-logo="new"] .io-page-brand img{width:102px;height:69px}}

html[data-inordine-visual-theme] body>header{background:#d9dde1!important;color:#292e34!important}
html[data-inordine-visual-theme] :is(button.primary,.btn-primary){background:#d9dde1!important;color:#292e34!important;border-color:#b8c0c8!important}
/* First-frame branding: CSS applies to original markup, before React/observers. */
html[data-inordine-logo="new"] img[alt="InOrdine.pro"]{content:url(/assets/inordine-gray-red-v1/logo-gray-red.svg);object-fit:contain!important;object-position:center!important;transform:none!important;opacity:1!important;filter:none!important}
html[data-inordine-logo="new"] :is(.brand-film,.app-brand-film){display:none!important;animation:none!important}
html[data-inordine-logo="new"] .header .brand{width:220px;height:90px;background:url(/assets/inordine-gray-red-v1/logo-gray-red.svg) center/contain no-repeat}
html[data-inordine-logo="new"] .header .brand>img{width:100%!important;height:100%!important}
html[data-inordine-logo="new"] .header .brand>.io-brand-replacement{display:none!important}
html[data-inordine-logo="new"] .desktop-sidebar div:has(>img[alt="InOrdine.pro"]){min-height:100px}
/* One platform mark in the shell. Embedded pages keep their module titles. */
#inordine-home-cascata .io-brand,.desktop-content .io-home .io-brand{display:none!important}
html[data-inordine-embedded="1"] .io-page-brand{display:none!important}
html[data-inordine-embedded="1"] img[alt="InOrdine.pro"]{display:none!important}
@media(max-width:650px){html[data-inordine-logo="new"] .header .brand{width:145px;height:68px}}

/* IO_DYNAMIC_METALLIC_V1: original multicolour identity, subtle relief. */
html[data-inordine-logo="previous"] :is(.app-brand-host,.header .brand){position:relative!important;box-sizing:border-box;padding-bottom:20px!important;isolation:isolate}
html[data-inordine-logo="previous"] .app-brand-host>.app-brand-film{height:calc(100% - 20px)!important;bottom:20px!important;filter:drop-shadow(0 -1px 0 #ffffffb8) drop-shadow(1px 2px 1px #25364b40)!important;transform:perspective(800px) rotateY(-3deg) rotateX(2deg)!important}
html[data-inordine-logo="previous"] :is(.app-brand-host,.header .brand)::after{content:"SOLUZIONI DI GESTIONE AVANZATE";position:absolute;left:4px;right:4px;bottom:4px;display:block;text-align:center;color:#46505c;font:650 clamp(7px,.62vw,10px)/1.2 system-ui,sans-serif;letter-spacing:.025em;white-space:nowrap;pointer-events:none}
html[data-inordine-logo="previous"] .header .brand{height:88px}
html[data-inordine-logo="previous"] .header .brand>.brand-film{height:68px!important;filter:drop-shadow(0 -1px 0 #ffffffa0) drop-shadow(1px 2px 1px #25364b35)}
html[data-inordine-logo="previous"] .brand-glint{mix-blend-mode:screen}
html[data-inordine-embedded="1"] :is(.app-brand-film,.brand-film,.io-page-brand),html[data-inordine-embedded="1"] .app-brand-host::after{display:none!important}
@media(prefers-reduced-motion:reduce){html[data-inordine-logo="previous"] .app-brand-host>.app-brand-film{transform:none!important;filter:drop-shadow(0 1px 1px #25364b28)!important}}
@media(max-width:639px){html[data-inordine-logo="previous"] :is(.app-brand-host,.header .brand)::after{font-size:7px;letter-spacing:0}}

.io-drawn-logo{display:block;width:100%;height:100%;overflow:visible}
.io-drawn-logo .io-logo-silhouette{filter:drop-shadow(1px 3px 2px rgba(32,42,53,.23))}
.io-drawn-logo :is(.io-up,.io-dot,.io-arc,.io-loop){stroke-dasharray:100;stroke-dashoffset:100;animation-duration:12.5s;animation-iteration-count:infinite;animation-fill-mode:both}
.io-drawn-logo .io-dot{animation-name:io-dot-draw}
.io-drawn-logo .io-up{animation-name:io-up-draw}
.io-drawn-logo .io-arc{animation-name:io-arc-draw}
.io-drawn-logo .io-loop{animation-name:io-loop-draw}
.io-drawn-logo .io-tip{animation:io-tip-draw 12.5s infinite both}
.io-drawn-logo .io-word{animation:io-word-draw 12.5s infinite both}
@keyframes io-dot-draw{0%{stroke-dashoffset:100;opacity:0}3%{opacity:1}8%,94%{stroke-dashoffset:0;opacity:1}99%,100%{stroke-dashoffset:100;opacity:0}}
@keyframes io-up-draw{0%,5%{stroke-dashoffset:100;opacity:0}6%{opacity:1}29%,94%{stroke-dashoffset:0;opacity:1}99%,100%{stroke-dashoffset:100;opacity:0}}
@keyframes io-arc-draw{0%,13%{stroke-dashoffset:100;opacity:0}14%{opacity:1}29%,94%{stroke-dashoffset:0;opacity:1}99%,100%{stroke-dashoffset:100;opacity:0}}
@keyframes io-loop-draw{0%,25%{stroke-dashoffset:100;opacity:0}26%{opacity:1}43%,94%{stroke-dashoffset:0;opacity:1}99%,100%{stroke-dashoffset:100;opacity:0}}
@keyframes io-tip-draw{0%,25%{opacity:0}31%,94%{opacity:1}99%,100%{opacity:0}}
@keyframes io-word-draw{0%,41%{opacity:0}48%,94%{opacity:1}99%,100%{opacity:0}}
.io-drawn-logo.is-paused *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.io-drawn-logo :is(.io-up,.io-dot,.io-arc,.io-loop){stroke-dashoffset:0!important;opacity:1!important;animation:none!important}.io-drawn-logo :is(.io-tip,.io-word){opacity:1!important;animation:none!important}}

.io-drawn-logo .io-final{animation:io-full-draw 12.5s infinite both}
@keyframes io-full-draw{0%,43%{opacity:0}48%,94%{opacity:1}99%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.io-drawn-logo .io-final{animation:none!important;opacity:1!important}}

html [data-io-drawn-host]{position:relative!important;display:grid!important;grid-template-rows:minmax(0,1fr) 18px!important;align-items:center!important;justify-items:center!important;padding:5px 8px!important;background:transparent!important;box-shadow:none!important;border:0!important;overflow:visible!important;min-height:100px!important;isolation:isolate}
html [data-io-drawn-host]>:not(.io-drawn-logo):not(.io-draw-slogan){display:none!important}
html [data-io-drawn-host]::after{content:none!important;display:none!important}
html [data-io-drawn-host]>.io-drawn-logo{width:100%!important;height:100%!important;max-height:110px!important;max-width:250px!important;position:relative!important;display:block!important;transform:none!important}
html [data-io-drawn-host]>.io-draw-slogan{display:block!important;position:relative!important;white-space:nowrap;color:#46505c;font:650 8px/1.4 system-ui,sans-serif;letter-spacing:.025em;text-align:center}
html .header [data-io-drawn-host]{width:230px!important;height:95px!important;min-height:95px!important}
@media(max-width:639px){html [data-io-drawn-host]{min-height:80px!important}html .header [data-io-drawn-host]{width:155px!important}html [data-io-drawn-host]>.io-draw-slogan{font-size:6.8px!important;letter-spacing:0}}

/* IO_AUDIT_UNIFORMITY_V1: readable submenus and keyboard focus, preserve semantic swatches/status colours. */
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav summary{color:#292e34!important;min-height:44px;box-sizing:border-box;cursor:pointer}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav summary:hover{background:#eef0f2!important;border-radius:8px}
html[data-inordine-visual-theme] :is(.desktop-sidebar,.inordine-sidebar) nav summary:focus-visible{outline:3px solid #a42036!important;outline-offset:2px;border-radius:8px}
html[data-inordine-visual-theme] :is(input,select,textarea,button,a,summary):focus-visible{outline:3px solid #a42036;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.io-drawn-logo *{animation:none!important;transition:none!important}.io-drawn-logo .io-final,.io-drawn-logo .io-word{opacity:1!important}}

/* IO_AUDIT_MOBILE_ACTIONS_V2 */
html[data-inordine-visual-theme] .desktop-content button[title="Cerca nel catalogo per codice, descrizione o marca."]{background:#a42036!important;color:#fff!important;min-height:44px!important;min-width:70px!important;border:1px solid #861b2c!important}
html[data-inordine-visual-theme] .desktop-content button[title="Cerca nel catalogo per codice, descrizione o marca."]:disabled{opacity:.6!important}
html[data-inordine-visual-theme] .inordine-admin-areas.is-mobile{color:#292e34!important}
html[data-inordine-visual-theme] .inordine-admin-areas.is-mobile :is(button,a,summary){color:#292e34!important;min-height:44px;box-sizing:border-box}
html[data-inordine-visual-theme] .inordine-admin-areas.is-mobile summary{cursor:pointer}
html[data-inordine-visual-theme] .inordine-admin-areas.is-mobile :is(button,a,summary):focus-visible{outline:3px solid #a42036!important;outline-offset:2px}

/* IO_AUDIT_PRIMARY_ACTIONS_V3: common platform actions; semantic statuses and colour samples stay separate. */
html[data-inordine-visual-theme] :is(.desktop-content,[role="dialog"]) button[class~="bg-[#ff6b35]"],
html[data-inordine-visual-theme] .cromia-products-compact>button,
html[data-inordine-visual-theme] :is(button.primary,.btn-primary){background:#a42036!important;color:#fff!important;border-color:#861b2c!important}
html[data-inordine-visual-theme] :is(.desktop-content,[role="dialog"]) button[class~="bg-[#ff6b35]"]:hover,
html[data-inordine-visual-theme] .cromia-products-compact>button:hover,
html[data-inordine-visual-theme] :is(button.primary,.btn-primary):hover{background:#861b2c!important}
/* IO_MOBILE_V1 · portale ordinato sul telefono (24/10/2026) */
[data-inordine-admin-page="mg-backup"]{display:none!important}
html[data-inordine-visual-theme="gray-red"] .bg-\[\#102d32\] :is(.text-white,[class*="text-white/"]):not([class*="bg-"]){color:#292e34!important}
html[data-inordine-visual-theme="gray-red"] .bg-\[\#102d32\] [class*="text-white/"]:not([class*="bg-"]):not(:is(h1,h2,h3,strong,b)){color:#5b6470!important}
@media(max-width:639px){
html header.sticky:has(>[data-io-drawn-host]){position:relative!important;display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px 12px!important;min-height:0!important;padding:8px 12px!important}
html header.sticky>[data-io-drawn-host]{grid-column:1;grid-row:1;width:112px!important;height:52px!important;min-height:52px!important;margin:0!important}
html header.sticky>[data-io-drawn-host] .io-draw-slogan{display:none!important}
html header.sticky>.inordine-heading-top{grid-column:2;grid-row:1;min-width:0;width:auto!important;margin:0!important;padding:0!important;display:flex!important;flex-direction:column-reverse!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important}
html header.sticky>.inordine-heading-top h1{font-size:19px!important;line-height:1.15!important;margin:0!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html header.sticky>.inordine-heading-top>p{margin:0!important;font-size:12px!important}
html header.sticky>.inordine-heading-top>p.mt-2{display:none!important}
html header.sticky>.ml-auto{grid-column:1/-1;grid-row:2;width:100%;max-width:none!important;margin:0!important;flex-wrap:nowrap!important;justify-content:space-between!important;gap:6px!important}
html header.sticky img[src*="commesso-inordine"]{display:none!important}
html header.sticky [data-inordine-language-picker]>span{display:none!important}
html header.sticky [data-inordine-language-picker]{width:72px!important;flex:0 0 72px!important}html header.sticky [data-inordine-language-picker] select{width:72px!important;max-width:72px!important}
html:root header.sticky>[data-io-drawn-host][data-io-drawn-host]{width:112px!important;max-width:none!important}
html:root header.sticky>[data-io-drawn-host]>canvas.io-drawn-logo{width:112px!important;height:52px!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
html header.sticky>.inordine-heading-top>*{text-align:left!important;align-self:flex-start!important}
html .inordine-order-status-filters{flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none;margin-right:-16px;padding-right:16px}
html .inordine-order-status-filters>*{flex:0 0 auto!important}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"]){gap:5px 6px!important}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>[data-slot="badge"]{order:1}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>span:not([data-slot]){order:2;margin-left:auto;font-size:15px!important}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])::after{content:"";order:3;flex-basis:100%;height:0}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>button{order:4;height:36px!important}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>button[data-size="icon-sm"]{width:36px!important}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>button[data-size="sm"]:not(.border-amber-300,.border-rose-300){flex:1 1 auto}
html article>.flex-col>.flex-wrap:has(>button.border-amber-300,>button.border-rose-300)::before{content:"";order:5;flex-basis:100%;height:0}
html article>.flex-col>.flex-wrap:has(>[data-slot="badge"])>button:is(.border-amber-300,.border-rose-300){order:6;flex:1 1 0}
html nav[aria-label="Navigazione mobile"]>button[aria-haspopup="dialog"]::before{content:"•••";display:block;font-size:13px;line-height:18px;letter-spacing:1px;margin-bottom:2px}
}
/* IO_LOGO_UNICO_V1: al computer il logo resta solo nella colonna di sinistra, non anche al centro della testata. */
@media(min-width:640px){html header.sticky>[data-io-drawn-host]{display:none!important}}