* { box-sizing:border-box; }
body { margin:0; color:#102b4e; background:#f6f8fb; font:.875rem/1.4 var(--lococo-font-sans); }
.workspace-shell { border:1px solid var(--lococo-focus); border-top:3px solid var(--lococo-ink); height:100dvh; display:flex; flex-direction:column; }
#workspaceNav { background:white; border-bottom:1px solid #dde4ed; display:grid; grid-template-columns:auto 1fr auto; align-items:center; padding:8px 20px 0; gap:6px 20px; flex-shrink:0; }
.workspace-brand { display:flex; gap:9px; align-items:center; text-decoration:none; color:inherit; font-size:1.125rem; font-weight:750; grid-row:1; }
.workspace-brand img { width:32px; height:32px; object-fit:contain; }
.workspace-brand small { display:block; color:#718096; font-size:0.75rem; font-weight:400; }
.workspace-account { grid-column:3; grid-row:1; display:flex; align-items:center; gap:10px; font-size:0.75rem; }
button, nav a { font:inherit; color:inherit; border:1px solid #dde4ed; border-radius:var(--lococo-radius-control); background:white; padding:9px 12px; cursor:pointer; }
nav a { text-decoration:none; white-space:nowrap; font-weight:600; font-size:0.8125rem; }
#workspaceQuickLinks { grid-column:2; grid-row:1; display:flex; justify-content:flex-end; gap:8px; }
#workspaceGroups { grid-column:1/-1; display:flex; gap:8px; overflow-x:auto; scrollbar-width:thin; }
#workspaceGroups button { border:0; border-radius:0; border-bottom:3px solid transparent; white-space:nowrap; color:#52647b; font-weight:600; }
#workspaceGroups button[aria-pressed=true] { color:#102b4e; border-bottom-color:#102b4e; }
#workspaceLinks { grid-column:1/-1; min-width:0; }
#workspaceQuickLinks a[data-key=admin] { font-size:0.75rem; }
#workspaceLinks section { display:flex; gap:6px; overflow-x:auto; padding:6px 0 9px; scrollbar-width:thin; }
#workspaceLinks section[hidden] { display:none; }
#workspaceLinks h2 { display:none; }
nav a:hover { background:#f1f5fa; }
nav a[aria-current=page] { background:var(--lococo-selected); color:var(--lococo-ink); border-color:var(--lococo-focus); }
main { flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; }
main > header { display:flex; align-items:center; gap:12px; padding:7px 20px; flex-shrink:0; background:#f6f8fb; }
header h1 { font-size:1rem; margin:0; line-height:1.25; }
header small { display:none; }
#workspaceStatus { margin-left:auto; color:#718096; font-size:0.75rem; }
#workspaceMenu { display:none; }
#workspaceScrim { display:none; }
#workspaceFrames { position:relative; flex:1; min-height:0; }
iframe { width:100%; height:100%; border:0; display:block; background:#f6f8fb; }
iframe[hidden], [hidden] { display:none !important; }
#workspaceError { padding:20px; }
a:focus-visible, button:focus-visible { outline:2px solid var(--lococo-focus); outline-offset:2px; }
#workspaceSync { font-size:0.75rem; max-width:240px; color:#52647b; }
#workspaceArea, .workspace-account-short { display:none; }
.workspace-account { position:relative; display:block; }
.workspace-account summary { cursor:pointer; list-style:none; padding:8px; border-radius:var(--lococo-radius-control); }
.workspace-account summary::-webkit-details-marker { display:none; }
.workspace-account[open] #workspaceLogout { display:block; position:absolute; right:0; top:100%; z-index:50; box-shadow:0 8px 24px #102b4e20; min-width:140px; min-height:44px; }
.workspace-account:not([open]) #workspaceLogout { display:none; }
#workspaceAdminMobile { display:none; }
#workspaceArea { font:inherit; border:1px solid var(--lococo-line); background:white; color:var(--lococo-ink); border-radius:var(--lococo-radius-control); }
@media(max-width:760px) {
 #workspaceNav { padding:2px 6px 0; gap:2px 6px; grid-template-columns:104px minmax(0,1fr) auto; }
 .workspace-brand { font-size:0.875rem; gap:5px; }
 .workspace-brand img { width:23px; height:23px; }
 .workspace-brand small { display:none; }
 .workspace-account { grid-column:3; grid-row:1; justify-self:end; }
 .workspace-account summary { min-height:44px; padding:12px 3px; font-size:0.75rem; }
 #workspaceActor { display:none; }
 .workspace-account-short { display:inline; }
 #workspaceQuickLinks { grid-column:2; grid-row:1; justify-content:flex-end; gap:4px; }
 #workspaceQuickLinks a { min-height:44px; display:flex; align-items:center; padding:8px 7px; font-size:0.75rem; }
 #workspaceQuickLinks a[data-key=cash] { font-size:0; }
 #workspaceQuickLinks a[data-key=cash]::after { content:"Caja"; font-size:0.75rem; }
 #workspaceGroups { display:none; }
 #workspaceArea { display:block; grid-column:1; grid-row:2; min-width:0; width:100%; min-height:44px; padding:5px; font-size:0.75rem; font-weight:600; }
 #workspaceLinks { grid-column:1/-1; grid-row:2; }
 #workspaceQuickLinks a[data-key=admin] { display:none; }
 .workspace-account[open] #workspaceAdminMobile { display:block; position:absolute; right:0; top:100%; z-index:50; background:white; padding:12px; min-width:140px; color:var(--lococo-ink); text-decoration:none; border:1px solid var(--lococo-line); }
 .workspace-account[open]:has(#workspaceAdminMobile:not([hidden])) #workspaceLogout { top:calc(100% + 44px); }
 #workspaceLinks section { padding:2px 0 4px; }
 #workspaceLinks a { min-height:44px; padding:12px 10px; font-size:0.75rem; }
 main > header { padding:3px 8px; min-height:28px; }
 main > header > div { min-width:0; }
 header h1 { font-size:0.8125rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
 #workspaceStatus { max-width:35%; font-size:0.75rem; }
 #workspaceSync { max-width:140px; padding:3px; font-size:0.75rem; }
}

/* One navigation row on short desktop windows, including Windows at 125–150%. */
@media(min-width:761px) and (max-height:760px) {
 #workspaceNav { grid-template-columns:auto minmax(0,1fr) auto auto; padding:5px 12px; gap:6px 12px; }
 .workspace-brand { grid-column:1; }
 .workspace-brand small { display:none; }
 #workspaceLinks { grid-column:2; grid-row:1; }
 #workspaceLinks section { padding:0; }
 #workspaceQuickLinks { grid-column:3; grid-row:1; }
 .workspace-account { grid-column:4; grid-row:1; }
 .workspace-account summary { max-width:170px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
 .workspace-shell:has(iframe[title="Cotizar"]:not([hidden])) main > header { display:none; }
}

/* One branded navigation surface; the active tab already names Cotizar. */
#workspaceNav { background:var(--lococo-ink); color:white; }
.workspace-brand small { color:#cfdeee; }
.workspace-brand img { background:white; border-radius:8px; padding:2px; }
#workspaceNav a, #workspaceNav button { color:white; border-color:#527090; background:transparent; }
#workspaceNav a:hover, #workspaceNav button:hover { background:#244566; }
#workspaceNav a[aria-current=page], #workspaceNav #workspaceNewQuote { background:white; color:var(--lococo-ink); border-color:white; }
#workspaceGroups button { color:#cfdeee; }
#workspaceGroups button[aria-pressed=true] { color:white; border-bottom-color:white; }
.workspace-account summary { display:flex; align-items:center; gap:8px; min-height:40px; border:1px solid #527090; }
#workspaceAvatar { display:grid; place-items:center; width:28px; height:28px; flex-shrink:0; border-radius:50%; background:#dbe8f6; color:var(--lococo-ink); font-weight:700; }
#workspaceNav #workspaceLogout { background:white; color:var(--lococo-ink); }
#workspaceNewQuote { white-space:nowrap; font-weight:600; }
/* The commercial views share one page (ventas.html) and the active tab already names them: no separate title row. */
.workspace-shell:is([data-view=sales],[data-view=quotes],[data-view=customers],[data-view=requests],[data-view=shipping]) main > header { display:none; }
@media (min-width:1100px) {
 #workspaceNav { grid-template-columns:auto minmax(0,1fr) auto auto; padding:6px 14px; gap:8px 12px; }
 .workspace-brand { grid-column:1; }
 .workspace-brand small { display:none; }
 #workspaceLinks { grid-column:2; grid-row:1; }
 #workspaceLinks section { padding:0; }
 #workspaceQuickLinks { grid-column:3; grid-row:1; }
 .workspace-account { grid-column:4; grid-row:1; }
}
@media (max-width:760px) {
 #workspaceNewQuote { width:36px; min-width:36px; min-height:40px; padding:4px; font-size:1.25rem; }
 #workspaceNewQuote span, .workspace-account-short { display:none; }
 .workspace-account summary { padding:4px; }
 #workspaceQuickLinks { gap:3px; }
 #workspaceQuickLinks a { padding:6px 4px; }
}
@media (max-width:760px) {
 #workspaceNav { grid-template-columns:88px minmax(0,1fr) auto; }
 #workspaceQuickLinks a[data-key=requests] { font-size:0; }
 #workspaceQuickLinks a[data-key=requests]::after { content:"Chat"; font-size:.75rem; }
}

/* Windows laptops (1280-1500 CSS px): keep every nav item visible. */
@media (min-width:761px) and (max-width:1500px) {
 #workspaceNav { gap:6px 8px; padding-inline:10px; }
 #workspaceLinks section { gap:3px; }
 #workspaceLinks a { padding-inline:8px; }
 #workspaceQuickLinks { gap:4px; }
 #workspaceQuickLinks a, #workspaceNewQuote { padding-inline:8px; }
 .workspace-account summary { max-width:132px; overflow:hidden; white-space:nowrap; }
 #workspaceActor { min-width:0; overflow:hidden; text-overflow:ellipsis; }
}
@media (min-width:761px) and (max-width:1366px) {
 #workspaceActor { display:none; }
 .workspace-account-short { display:inline; }
 .workspace-account summary { padding-inline:6px; }
}

/* Pedidos para preparar: one strip under the navigation on every page; it takes no space when nothing is pending. */
#workspacePending { flex-shrink:0; }
#workspacePending:empty { display:none; }
#workspacePending .workspace-pending { display:flex; flex-wrap:wrap; align-items:center; gap:2px 14px; width:100%; min-height:36px; padding:6px 20px; border:0; border-bottom:1px solid var(--lococo-line-strong); border-left:6px solid var(--lococo-warning); border-radius:0; background:color-mix(in srgb, var(--lococo-warning) 14%, white); color:var(--lococo-ink); font-size:0.875rem; line-height:1.3; text-align:left; }
#workspacePending .workspace-pending:hover { background:color-mix(in srgb, var(--lococo-warning) 24%, white); }
#workspacePending .workspace-pending[data-level=ship] { background:color-mix(in srgb, var(--lococo-warning) 30%, white); }
#workspacePending .workspace-pending[data-level=ship]:hover { background:color-mix(in srgb, var(--lococo-warning) 38%, white); }
#workspacePending .workspace-pending[data-level=urgent] { border-left-color:var(--lococo-ink); background:var(--lococo-danger); color:white; }
#workspacePending .workspace-pending[data-level=urgent]:hover { background:color-mix(in srgb, var(--lococo-danger) 88%, black); }
#workspacePending strong { font-weight:750; }
.workspace-pending-hint { font-weight:650; }
.workspace-pending-go { margin-left:auto; font-weight:650; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
#workspacePending .workspace-pending:focus-visible { outline:3px solid var(--lococo-ink); outline-offset:-3px; }
#workspacePending .workspace-pending[data-level=urgent]:focus-visible { outline-color:white; }
#workspaceNav .workspace-nav-count { display:inline-flex; align-items:center; justify-content:center; min-width:19px; height:19px; margin-left:7px; padding:0 5px; border-radius:99px; background:color-mix(in srgb, var(--lococo-warning) 14%, white); color:var(--lococo-ink); font-size:0.6875rem; font-weight:800; line-height:1; vertical-align:middle; }
#workspaceNav .workspace-nav-count[data-level=urgent] { background:var(--lococo-danger); color:white; }
@media (max-width:760px) {
 #workspacePending .workspace-pending { min-height:44px; padding:6px 10px; gap:0 10px; }
 .workspace-pending-go { margin-left:0; }
}
@media (min-width:761px) and (max-height:760px) {
 #workspacePending .workspace-pending { min-height:32px; padding-block:4px; }
}