/* Totus Central visual system. Business renderers and personal appearance remain authoritative. */
:root {
  --nav: #101d32;
  --nav2: #1d304c;
  --bg: #f3f6fa;
  --panel: #fff;
  --ink: #182c43;
  --muted: #607187;
  --line: #dce5ee;
  --accent: #1463ce;
  --accent2: #104faa;
  --shadow: 0 4px 20px rgb(23 48 79 / 5%);
  --r: 16px;
}
@media screen {
  .sidebar { background: var(--nav); }
  .sidebar .brand { padding-bottom: 24px; }
  .sidebar .brand b { letter-spacing: -.025em; }
  .sidebar .nav-btn { text-decoration: none; position: relative; transition: background-color .15s; }
  .sidebar .nav-btn.active { background: var(--nav2); box-shadow: inset 3px 0 #42c7cf; }
  .sidebar .nav-btn:hover { background: var(--nav2); }
  .sidebar .nav-icon { display: grid; place-items: center; flex: 0 0 24px; }
  .sidebar .nav-group-label { padding: 15px 12px 5px; color: #9aaec6; }
  .drawer-entry { scroll-margin-top: 90px; }
  .topbar { gap: 12px; background: var(--panel); }
  .topbar h1 { letter-spacing: -.035em; }
  .card { min-width: 0; }
  .section-head { flex-wrap: wrap; align-items: center; }
  .section-head h2 { font-size: 19px; letter-spacing: -.025em; }
  .section-head p { line-height: 1.55; max-width: 85ch; }
  .kpi { position: relative; box-shadow: var(--shadow); border-radius: var(--r); }
  .kpi-value { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
  .kpi-value .field-help { margin-top: 6px; }
  .kpi::before { content: ''; position: absolute; top: 16px; left: 0; bottom: 16px; width: 3px; background: var(--accent); border-radius: 0 3px 3px 0; opacity: .6; }
  .kpi strong { font-variant-numeric: tabular-nums; line-height: 1.2; overflow-wrap: anywhere; }
  .kpi small { line-height: 1.45; color: var(--muted); }
  .filters { background: var(--panel); gap: 12px; padding-block: 18px; }
  .filters .field { flex: 1 1 150px; min-width: 0; }
  .field, .form-grid > label { min-width: 0; grid-template-columns: minmax(0,1fr); }
  .field :is(input,select,textarea), .form-grid :is(input,select,textarea) { min-width: 0; max-width: 100%; }
  .filters .search { flex-grow: 2; }
  .filters .inline-actions { align-self: end; }
  .table-wrap { scrollbar-width: thin; scrollbar-color: #8ca4bc transparent; }
  .data-table th { line-height: 1.5; }
  .data-table td { line-height: 1.5; }
  .data-table td.num, .money { white-space: nowrap; font-variant-numeric: tabular-nums; }
  .summary-row > strong { min-width: 0; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
  .data-table .inline-actions { align-items: center; }
  .btn { min-height: 36px; line-height: 1.3; transition: background-color .15s, box-shadow .15s; }
  .btn:disabled { cursor: not-allowed; opacity: .55; }
  :is(button,a,input,select,textarea,summary):focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
  .tabs { gap: 8px; overflow-x: auto; }
  .tab { white-space: nowrap; }
  .form-actions { gap: 10px; flex-wrap: wrap; padding-top: 20px; margin-top: 24px; }
  .note { line-height: 1.55; }
  .drawer-sales-entry { padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); }
  .drawer-sales-entry p { margin: 8px 0; line-height: 1.5; }
  .drawer-sales-entry input { font-size: 20px; font-weight: 750; font-variant-numeric: tabular-nums; }
  .appearance-section { scroll-margin-top: 110px; }
  .appearance-page { grid-template-columns: minmax(0,1fr); }
  .appearance-page > * { min-width: 0; }
  .appearance-section summary { line-height: 1.5; }
  .appearance-grid .field { line-height: 1.5; }
  .appearance-anchors { gap: 8px; }
  .appearance-anchors button { max-width: 100%; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  .appearance-section > summary { min-width: 0; overflow-wrap: anywhere; }
  .appearance-preview-card { min-width: 0; }
  .ai-test-panel > summary { font-size: 18px; font-weight: 750; cursor: pointer; }
  .ai-test-panel p { line-height: 1.5; }
  .ai-test-output { white-space: pre-wrap; overflow-wrap: anywhere; padding: 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg); color: var(--ink); }
  /* Module-specific surfaces share the same visual system without replacing their controls. */
  .tabs .tab.active { background: color-mix(in srgb,var(--accent) 9%,var(--panel)); border-radius: 8px 8px 0 0; }
  .home-zone-head { gap: 12px; }
  .dashboard-hero { border-top: 3px solid var(--accent); }
  .document-batch-toolbar { gap: 12px; padding: 14px 16px; flex-wrap: wrap; background: var(--bg); }
  .stock-upload-box, .stock-source, .stock-equivalence-summary { border-color: var(--line); border-radius: var(--r); background: var(--bg); }
  .stock-toolbar, .tasks-toolbar, .tasks-filters { gap: 12px; flex-wrap: wrap; }
  .tasks-calendar { border-color: var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
  .task-day.today { box-shadow: inset 0 3px var(--accent); }
  .team-chat { border-color: var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
  .chat-navigation-tools, .chat-channel-tools { gap: 8px; }
  .chat-dialog, .tasks-dialog { border-color: var(--line); border-radius: var(--r); }
  .gestor-period-picker > * { min-width: 0; }
  .gestor-period-picker :is(input,select) { min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: var(--panel); font: inherit; }
  .backup-control-actions { display: flex; flex-wrap: wrap; gap: 12px; padding-block: 12px; }
  .backup-control-actions .btn { min-height: 40px; }
  #login:not(.custom-login) { background: radial-gradient(at 15% 15%,#1d547a,transparent 55%),linear-gradient(140deg,#101d32,#1d304c); }
  #login:not(.custom-login) .login-card { box-shadow: 0 24px 70px rgb(0 0 0 / 22%); border-radius: 22px; }
  .closing-filter-bar, .mobile-row-toggle { display: none; }
  .mobile-nav-close, .mobile-nav-shade { display: none; }
  @media (max-width: 800px) {
    body { padding-bottom: 0; }
    body.menu-open { overflow: hidden; }
    .app .sidebar { position: fixed; inset: 0 auto 0 0; width: min(320px,90vw); height: 100dvh; display: flex; flex-direction: column; padding: 16px 12px; z-index: 80; }
    body:not(.menu-open) .app .sidebar { transform: translateX(-105%) !important; visibility: hidden; }
    body.menu-open .app .sidebar { transform: translateX(0) !important; visibility: visible; }
    .app .sidebar .brand { display: flex; padding-top: 16px; }
    .app .sidebar .sidebar-foot { display: block; }
    .app .sidebar nav { display: grid; flex: 1; align-content: start; overflow: auto; gap: 5px; scrollbar-width: thin; }
    .app .sidebar nav > .eyebrow { display: block; }
    .app .sidebar .nav-btn { flex-direction: row; justify-content: start; gap: 12px; min-height: 44px; height: auto; text-align: left; font-size: 14px; padding: 10px 12px; }
    .app .sidebar .nav-icon { width: 24px; }
    .topbar .mobile-only { display: block; }
    .mobile-nav-close { display: block; align-self: end; min-height: 44px; border: 1px solid #8194ad; border-radius: 8px; padding: 8px 12px; color: white; background: transparent; }
    .mobile-nav-shade:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 70; border: 0; background: rgb(6 18 36 / 55%); }
    .record-main .form-actions { bottom: 0; }
    .mobile-card-table::before { display: none; }
  }
  .account-menu { flex: 0 0 auto; }
  .account-trigger { display: flex; align-items: center; gap: 9px; border: 1px solid var(--line); background: var(--panel); color: var(--ink); border-radius: 12px; padding: 6px 9px; }
  .account-trigger-text { display: grid; gap: 2px; text-align: left; max-width: 145px; }
  .account-trigger-text b { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .account-trigger-text small { font-size: 10px; color: var(--muted); }
  .account-avatar { width: 34px; height: 34px; border-radius: 50%; display: inline-grid; place-items: center; background: #e3effb; color: #164a7c; flex: 0 0 auto; font-weight: 800; overflow: hidden; }
  .account-avatar img { width: 100%; height: 100%; object-fit: cover; }
  .account-avatar-large { width: 76px; height: 76px; font-size: 25px; }
  .account-identity { display: flex; align-items: center; gap: 12px; padding-bottom: 18px; }
  .account-identity small { display: block; color: var(--muted); overflow-wrap: anywhere; margin-top: 3px; }
  .account-panel .tabs { padding-inline: 0; }
  .account-section { padding-top: 20px; }
  .account-photo-field { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-bottom: 22px; }
  .account-photo-field label { position: relative; cursor: pointer; overflow: hidden; }
  .account-photo-field input[type=file] { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
  .account-shortcuts { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
  .account-footer { display: flex; justify-content: end; padding-top: 16px; border-top: 1px solid var(--line); }
  .account-document-list article { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding: 14px 0; }
  .account-document-list article > div:first-child { flex: 1 1 200px; overflow-wrap: anywhere; }
  .account-document-list small { display: block; color: var(--muted); margin-top: 5px; }
  @media (max-width: 1100px) { .account-trigger-text { display: none; } }
  @media (max-width: 700px) {
    .closing-filter-bar { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 12px 16px; border-block: 1px solid var(--line); }
    .closing-filter-bar > span { text-align: right; font-variant-numeric: tabular-nums; }
    .mobile-filter-content:not(.is-open) { display: none; }
    .closing-list-page .closing-kpis { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 8px; }
    .closing-list-page .closing-kpis .kpi { grid-column: span 2; }
    .closing-list-page .closing-kpis .kpi:nth-child(-n+2) { grid-column: span 3; }
    .closing-list-page .closing-kpis .kpi:nth-child(n+3) strong { font-size: 19px; }
    .closing-list-page .closing-kpis .kpi::before { display: none; }
    .closing-list-page .closing-kpis .kpi span { font-size: 11px; }
    .mobile-card-table { padding: 12px; border: 0; background: var(--bg); }
    .mobile-card-table .data-table { display: block; min-width: 0; background: transparent; }
    .mobile-card-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
    .mobile-card-table tbody { display: grid; gap: 14px; }
    .mobile-card-table tr { display: grid; grid-template-columns: 1fr; padding: 14px; border: 1px solid var(--line); border-radius: var(--r); background: var(--panel); box-shadow: var(--shadow); }
    .mobile-card-table td { display: block; min-width: 0; width: auto; padding: 10px 0; border-color: var(--line); background: transparent !important; overflow-wrap: anywhere; }
    .mobile-card-table td::before { content: attr(data-label); display: block; font-size: 11px; font-weight: 750; color: var(--muted); margin-bottom: 5px; }
    .mobile-card-table td:first-child { padding-top: 0; }
    .mobile-card-table td:last-child { padding-bottom: 0; }
    .mobile-card-table td[data-label=""]::before { display: none; }
    .mobile-card-table td.num::before { text-align: left; }
    .closing-list-page .mobile-card-table td[data-label="Total ventas"] { grid-row: 2; }
    .closing-list-page .mobile-card-table td[data-label="Total ventas"] .compact-detail > span:first-child { font-size: 22px; }
    .closing-list-page .mobile-card-table td[data-label="Estado"] { grid-row: 3; }
    .closing-list-page .mobile-card-table tr:not(.is-expanded) td:is([data-label="Ventas del día"],[data-label="Dinero de cada caja"]) { display: none; }
    .mobile-row-toggle { display: block; width: 100%; margin-bottom: 12px; min-height: 44px; }
    .mobile-card-table .inline-actions > .btn { min-height: 44px; flex: 1 1 100px; }
    .mobile-card-table .compact-detail { font-size: 13px; line-height: 1.6; }
    .mobile-card-table .compact-detail > span { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; }
    .topbar { gap: 6px; }
    .topbar .session-logout-mobile { display: none; }
    .account-trigger { padding: 3px; border: 0; }
    .account-trigger > span:last-child { display: none; }
    .account-avatar { width: 30px; height: 30px; }
    .account-avatar-large { width: 64px; height: 64px; }
    .account-panel .tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 4px; overflow: visible; }
    .account-panel .tab { min-height: 44px; padding: 8px; }
    .account-photo-field { display: grid; grid-template-columns: 64px minmax(0,1fr); align-items: center; }
    .account-photo-field .account-avatar { grid-row: span 2; }
    .account-photo-field [data-account-remove] { grid-column: 2; }
    .section-head { align-items: start; gap: 14px; }
    .section-head > .inline-actions { width: 100%; }
    .section-head > .inline-actions .btn { flex: 1 1 auto; }
    .filters .field { flex-basis: calc(50% - 12px); }
    .filters .search { flex-basis: 100%; }
    .kpi { padding: 14px; }
    .kpi strong { font-size: clamp(19px, 5vw, 25px); }
    .form-actions .btn { flex: 1 1 150px; }
  }
  @media (prefers-reduced-motion: reduce) {
    .sidebar .nav-btn, .btn { transition: none; }
  }
  @media (max-width: 360px) {
    .filters .field { flex-basis: 100%; }
    .closing-kpis .kpi:nth-child(-n+2) .kpi-caption { padding-right: 19px; min-height: 30px; }
    .closing-kpis .kpi:nth-child(-n+2) .field-help { position: absolute !important; right: 9px; top: 7px; }
    .closing-kpis .kpi:nth-child(-n+2) strong { font-size: 18px; white-space: nowrap; }
    .closing-filter-bar { flex-wrap: wrap; }
    .closing-filter-bar > span { flex: 1 1 100%; text-align: left; }
    .closing-filter-bar .btn { white-space: nowrap; }
  }
}

/* Personal workspace forms retain full-width, readable inputs on narrow screens. */
.account-task-filter {display:flex;gap:12px;align-items:end;margin-bottom:16px;}
.account-task-filter label {display:grid;gap:6px;max-width:240px;}
.account-panel [data-account-notes] {display:grid;gap:10px;}
.account-panel [data-account-notes] textarea {width:100%;min-height:200px;resize:vertical;}
.account-panel [data-notes-count] {font-size:11px;color:var(--muted);text-align:right;}
@media(max-width:600px){.account-panel textarea,.account-task-filter input {font-size:16px;}.account-shortcuts>.btn {flex:1 1 100%;}}

/* Totus navigation polish, retaining native groups, routes and personal theme. */
@media screen {
 .sidebar #nav{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,white 17%,transparent) transparent}
 .sidebar #nav .nav-personal-group{min-width:0;padding:2px 0 8px}
 .sidebar #nav .nav-personal-group>summary{
  list-style:none;display:flex;align-items:center;justify-content:space-between;
  min-height:34px;padding:8px 11px 7px;border-radius:8px;gap:8px;
  font-size:11px;font-weight:750;letter-spacing:.055em;text-transform:uppercase;
  color:color-mix(in srgb,var(--accent,#1463ce) 52%,#d4eaff);
  cursor:pointer;user-select:none
 }
 .sidebar #nav .nav-personal-group>summary::-webkit-details-marker{display:none}
 .sidebar #nav .nav-personal-group>summary::after{
  content:'⌄';font-size:15px;line-height:1;display:inline-block;opacity:.75;
  transform:rotate(-90deg);transition:transform .15s
 }
 .sidebar #nav .nav-personal-group[open]>summary::after{transform:rotate(0deg)}
 .sidebar #nav .nav-personal-group>summary:hover{background:rgb(255 255 255 / 6%);color:#fff}
 .sidebar #nav .nav-personal-group>summary:focus-visible{outline:2px solid #8fcaff;outline-offset:-2px}
 .sidebar #nav .nav-personal-group>a.nav-btn{
  min-width:0;min-height:38px;margin:2px 0 0;border-radius:9px;
  padding:8px 11px;gap:11px;color:#c4d3e5;
  font-weight:580;line-height:1.35;transition:background .14s ease,color .14s ease;
  text-decoration:none
 }
 .sidebar #nav .nav-personal-group>a.nav-btn .nav-icon{opacity:.8}
 .sidebar #nav .nav-personal-group>a.nav-btn:hover{
  background:rgb(255 255 255 / 8%);color:#fff
 }
 .sidebar #nav .nav-personal-group>a.nav-btn.active{
  background:color-mix(in srgb,var(--accent,#1463ce) 19%,var(--nav2,#1d304c));
  color:#fff;box-shadow:inset 3px 0 color-mix(in srgb,var(--accent,#1463ce) 48%,#7ee6ef)
 }
 .sidebar #nav .nav-personal-group>a.nav-btn.active .nav-icon{opacity:1}
}
@media (max-width:800px){
 .sidebar #nav .nav-personal-group>summary{min-height:38px}
 .sidebar #nav .nav-personal-group>a.nav-btn{min-height:44px;font-size:14px}
}
@media (prefers-reduced-motion:reduce){
 .sidebar #nav .nav-personal-group>summary::after,
 .sidebar #nav .nav-personal-group>a.nav-btn{transition:none}
}
.account-notes-toolbar{display:grid;grid-template-columns:minmax(0,1fr) 130px auto;align-items:end;gap:10px}.account-notes-toolbar label,.account-note-editor label{display:grid;gap:5px;font-size:.85rem;min-width:0}.account-notes-layout{display:grid;grid-template-columns:minmax(170px,1fr) minmax(0,2fr);gap:16px;margin-block:14px}.account-notes-list{display:flex;flex-direction:column;gap:6px;align-self:start}.account-notes-list button{padding:10px;text-align:left;border:1px solid var(--line);border-radius:var(--r);color:var(--text);background:var(--panel);font:inherit;overflow-wrap:anywhere}.account-notes-list button[aria-current=true]{border-color:var(--primary);background:var(--soft)}.account-notes-list small{display:block;font-size:.75rem;color:var(--muted);margin-top:4px}.account-note-editor{display:grid;gap:10px;min-width:0}.account-note-editor .inline-actions{gap:8px}.account-note-editor small{font-size:.75rem;color:var(--muted)}.account-notes-toolbar input,.account-notes-toolbar select,.account-note-editor input,.account-note-editor textarea{box-sizing:border-box;width:100%;min-width:0}.account-panel h3{font-size:1rem}.account-panel .form-actions{gap:10px}
@media(max-width:600px){.account-notes-layout{grid-template-columns:minmax(0,1fr)}.account-notes-toolbar{grid-template-columns:minmax(0,1fr) 105px}.account-notes-toolbar>button{grid-column:1/-1;justify-self:start}.account-notes-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.account-note-editor .inline-actions{display:flex;flex-wrap:wrap}}
.account-panel [data-account-notebook] input,.account-panel [data-account-notebook] select,.account-panel [data-account-notebook] textarea{border:1px solid var(--line,#ccd5df);border-radius:var(--r,8px);background:var(--input-bg,var(--panel,#fff));color:var(--text,#19283a);padding:8px 10px;font:inherit;min-height:36px}.account-panel [data-account-notebook] button{min-height:36px;font-size:.85rem}.account-panel [data-account-notes]>.form-actions{position:sticky;bottom:0;background:var(--panel,#fff);padding-block:12px;border-top:1px solid var(--line);z-index:1}

/* Compact rail keeps group names accessible without squeezing words into a column. */
@media screen and (min-width:801px){
 .navigation-compact .sidebar #nav{overflow-x:hidden}
 .navigation-compact .sidebar #nav .nav-personal-group>summary{font-size:0;letter-spacing:0;min-height:28px;padding:4px 0;justify-content:center;gap:0;border-top:1px solid #ffffff20}
 .navigation-compact .sidebar #nav .nav-personal-group>summary::after{font-size:14px}
 .navigation-compact .sidebar #nav .nav-personal-group>a.nav-btn{padding:10px 0;gap:0;min-width:0}
 .navigation-compact .sidebar .brand-logo{max-width:48px;max-height:52px;object-fit:contain}
}