/* Employee desktop presentation: the shared employee rules intentionally
   provide the compact mobile shell.  Browser desktop uses the existing
   sidebar/main shell and the same canonical routes/data; Android and
   mobile-web keep their existing bottom-nav presentation below this profile.
*/
html[data-ui-profile="desktop"] body.employee-shell .app-shell {
  grid-template-columns:240px minmax(0,1fr);
  min-height:100dvh;
}
html[data-ui-profile="desktop"] body.employee-shell .sidebar {
  display:flex !important;
  width:240px;
  min-height:100dvh;
  position:sticky;
  top:0;
}
html[data-ui-profile="desktop"] body.employee-shell #sidebarBackdrop,
html[data-ui-profile="desktop"] body.employee-shell #sidebarToggle,
html[data-ui-profile="desktop"] body.employee-shell #domainTabs {
  display:none !important;
}
html[data-ui-profile="desktop"] body.employee-shell .main {
  min-width:0;
  min-height:100dvh;
}
html[data-ui-profile="desktop"] body.employee-shell .topbar {
  height:80px;
  padding:0 32px;
}
html[data-ui-profile="desktop"] body.employee-shell .topbar h2 { font-size:24px; }
html[data-ui-profile="desktop"] body.employee-shell .topbar p { display:block; }
html[data-ui-profile="desktop"] body.employee-shell .content {
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding:32px;
  box-sizing:border-box;
}
html[data-ui-profile="desktop"] body.employee-shell .android-bottom-nav {
  display:none !important;
}
html[data-ui-profile="desktop"] body.employee-shell #nav > button { display:none !important; }
html[data-ui-profile="desktop"] body.employee-shell #nav > button[data-view="dashboard"],
html[data-ui-profile="desktop"] body.employee-shell #nav > button[data-view="attendance"],
html[data-ui-profile="desktop"] body.employee-shell #nav > button[data-view="mySchedule"],
html[data-ui-profile="desktop"] body.employee-shell #nav > button[data-view="profile"] {
  display:flex !important;
}
html[data-ui-profile="desktop"] body.employee-shell .emp-task-card,
html[data-ui-profile="desktop"] body.employee-shell .attendance-summary-card,
html[data-ui-profile="desktop"] body.employee-shell .profile-layout {
  width:100%;
  max-width:none;
}
html[data-ui-profile="desktop"] body.employee-shell .attendance-summary-card {
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}
html[data-ui-profile="desktop"] body.employee-shell .profile-layout {
  max-width:1200px;
  margin-left:auto;
  margin-right:auto;
}

/* Desktop Web action hierarchy. Android and mobile Web are separate profiles. */
html[data-ui-profile="desktop"] .btn { transition:background .15s ease, box-shadow .15s ease, transform .1s ease; }
html[data-ui-profile="desktop"] .btn.primary { background:var(--web-action-primary-bg); color:var(--web-action-primary-fg); box-shadow:0 3px 9px rgba(23,105,224,.18); }
html[data-ui-profile="desktop"] .btn.primary:hover { background:var(--action-hover); box-shadow:0 5px 14px rgba(23,105,224,.25); }
html[data-ui-profile="desktop"] .btn.secondary { background:var(--web-action-secondary-bg); color:var(--web-action-secondary-fg); border:1px solid var(--web-action-secondary-border); }
html[data-ui-profile="desktop"] .btn.secondary:hover, html[data-ui-profile="desktop"] .icon-btn:hover { background:var(--action-hover-surface); color:var(--text); }
html[data-ui-profile="desktop"] .btn.danger { background:var(--web-action-danger-bg); color:var(--web-action-danger-fg); }
html[data-ui-profile="desktop"] .icon-btn { border:1px solid var(--web-action-icon-border); background:var(--web-action-icon-bg); color:var(--web-action-icon-fg); min-width:36px; min-height:36px; transition:background .15s ease, color .15s ease, box-shadow .15s ease, transform .1s ease; }
html[data-ui-profile="desktop"] .icon-btn:active, html[data-ui-profile="desktop"] .btn:active { transform:translateY(1px); box-shadow:none; }
html[data-ui-profile="desktop"] .icon-btn:focus-visible, html[data-ui-profile="desktop"] .btn:focus-visible { outline:2px solid var(--web-focus-ring); outline-offset:2px; }


html[data-ui-profile="desktop"] .btn:disabled, html[data-ui-profile="desktop"] .icon-btn:disabled { opacity:.72; background:var(--web-action-disabled-bg); color:var(--web-action-disabled-fg); border-color:var(--web-action-disabled-border); cursor:not-allowed; box-shadow:none; }

html[data-ui-profile="desktop"] body.employee-shell .sidebar nav button { min-height:46px; padding:10px 14px; gap:12px; color:var(--muted); font-size:15px; }
html[data-ui-profile="desktop"] body.employee-shell .sidebar nav button .nav-icon { width:21px; height:21px; flex:0 0 21px; }
html[data-ui-profile="desktop"] body.employee-shell .sidebar nav button:hover { background:var(--web-action-icon-hover); color:var(--text); }
html[data-ui-profile="desktop"] body.employee-shell .sidebar nav button.active { background:var(--web-action-icon-hover); color:var(--accent-strong); box-shadow:inset 3px 0 0 var(--accent-strong); }
html[data-ui-profile="desktop"] body.employee-shell .sidebar nav button:focus-visible { outline:2px solid var(--web-focus-ring); outline-offset:-2px; }
html[data-ui-profile="desktop"] body.employee-shell .topbar-icon-btn { background:var(--web-action-icon-bg); color:var(--web-action-icon-fg); border:1px solid var(--web-action-icon-border); }

/* Final Web action normalization: one visual authority for desktop tools. */
html[data-ui-profile="desktop"] .btn,
html[data-ui-profile="desktop"] .icon-btn,
html[data-ui-profile="desktop"] .toolbar-button,
html[data-ui-profile="desktop"] .search-button { appearance:none; -webkit-appearance:none; border-radius:10px; box-shadow:none; }
html[data-ui-profile="desktop"] .btn.ghost { background:transparent; color:var(--web-action-icon-fg); border:1px solid transparent; }
html[data-ui-profile="desktop"] .btn.ghost:hover { background:var(--web-action-icon-hover); }
html[data-ui-profile="desktop"] .icon-btn.danger { background:var(--web-action-danger-bg); color:var(--web-action-danger-fg); border-color:var(--web-action-danger-fg); }
html[data-ui-profile="desktop"] .toolbar-button,
html[data-ui-profile="desktop"] .search-button { min-width:36px; min-height:36px; background:var(--web-action-icon-bg); color:var(--web-action-icon-fg); border:1px solid var(--web-action-icon-border); }
html[data-ui-profile="desktop"] .btn.attendance-history-search { background:var(--web-action-icon-bg); color:var(--web-action-icon-fg); border-color:var(--web-action-icon-border); }
html[data-ui-profile="desktop"] .toolbar-button:hover,
html[data-ui-profile="desktop"] .search-button:hover { background:var(--web-action-icon-hover); }
html[data-ui-profile="desktop"] button.btn:disabled,
html[data-ui-profile="desktop"] button.icon-btn:disabled,
html[data-ui-profile="desktop"] button[disabled].btn,
html[data-ui-profile="desktop"] button[disabled].icon-btn { background:var(--web-action-disabled-bg); color:var(--web-action-disabled-fg); border-color:var(--web-action-disabled-border); }