/* Views: each person picks how Atlas looks (profile menu → View), remembered in this browser.
   Classic is the original look. Sleek, Light and Compact sit on top of it, and the left menu can
   collapse to icons in any of them. Loaded after theme.css, so these win over company colours
   only where a view deliberately changes them. */

/* ---- profile menu ---------------------------------------------------------------------- */
.profile-wrap{position:relative}
.profile-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;width:290px;background:#fff;border:1px solid #e2e8f0;border-radius:14px;box-shadow:0 16px 40px rgba(15,23,42,.14);padding:8px;display:flex;flex-direction:column;gap:4px}
.profile-menu .pm-head{padding:8px 10px 10px;border-bottom:1px solid #eef2f6}
.profile-menu .pm-head strong{display:block;font-size:13px;color:#0f172a}
.profile-menu .pm-head small{display:block;font-size:12px;color:#475569}
.profile-menu .pm-label{padding:8px 10px 2px;font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#475569}
.profile-menu .pm-view{width:100%;display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px;border:1px solid transparent;border-radius:10px;background:#fff;text-align:left;color:#0f172a}
.profile-menu .pm-view:hover{background:#f8fafc}
.profile-menu .pm-view[aria-checked="true"]{background:#eff6ff;border-color:#93c5fd}
.profile-menu .pm-swatch{display:flex;width:34px;height:24px;border-radius:5px;overflow:hidden;border:1px solid #cbd5e1;flex:none}
.profile-menu .pm-swatch i{display:block;width:11px}.profile-menu .pm-swatch b{display:block;flex:1}
.profile-menu .pm-view strong{display:block;font-size:13px}
.profile-menu .pm-view small{display:block;font-size:11.5px;color:#475569}
.profile-menu .pm-foot{border-top:1px solid #eef2f6;margin-top:4px;padding-top:4px;display:flex;flex-direction:column}
.profile-menu .pm-item{display:flex;align-items:center;min-height:40px;padding:0 10px;border:0;border-radius:8px;background:transparent;text-align:left;font-size:13px;color:#0f172a}
.profile-menu .pm-item:hover{background:#f1f5f9}

/* ---- collapsible left menu (desktop) --------------------------------------------------- */
.nav-collapse{display:flex;align-items:center;gap:12px;width:100%;margin-top:8px;padding:10px 13px;border:0;border-radius:9px;background:transparent;color:#9fb6cf;font-size:12px;font-weight:600;text-align:left}
.nav-collapse:hover{background:rgba(255,255,255,.07);color:#fff}
@media(min-width:701px){
  body.nav-collapsed .sidebar{width:72px;padding-left:10px;padding-right:10px}
  body.nav-collapsed .brand{justify-content:center;padding-left:0;padding-right:0}
  body.nav-collapsed .brand-copy,body.nav-collapsed .workspace-label,body.nav-collapsed .nav-item span:not(.nav-icon),
  body.nav-collapsed .governance-mini,body.nav-collapsed .local-chip,body.nav-collapsed .sidebar-version,body.nav-collapsed .nav-collapse span:not(.nav-icon){display:none}
  body.nav-collapsed .nav-item,body.nav-collapsed .nav-collapse{justify-content:center;padding:0;height:42px}
  body.nav-collapsed .main-shell{margin-left:72px;width:calc(100% - 72px)}
}
@media(max-width:700px){.nav-collapse{display:none}}

/* ---- Sleek: calm, flat, dark menu ------------------------------------------------------ */
body[data-ui="sleek"],body[data-ui="light"],body[data-ui="compact"]{font-family:Inter,'Segoe UI',system-ui,Arial,sans-serif;background:#f6f7f9}
body[data-ui="sleek"] .main-shell,body[data-ui="light"] .main-shell,body[data-ui="compact"] .main-shell{background:#f6f7f9}
body[data-ui="sleek"] .sidebar,body[data-ui="compact"] .sidebar{background:#0b1220}
body[data-ui="sleek"] .nav-item.active,body[data-ui="compact"] .nav-item.active{background:#16213a;box-shadow:none}
body[data-ui="sleek"] .nav-item,body[data-ui="compact"] .nav-item{color:#cbd5e1;font-weight:500}
body[data-ui="sleek"] .nav-icon,body[data-ui="compact"] .nav-icon{color:#94a3b8}
body[data-ui="sleek"] .panel,body[data-ui="light"] .panel,body[data-ui="compact"] .panel,
body[data-ui="sleek"] .stat-card,body[data-ui="light"] .stat-card,body[data-ui="compact"] .stat-card{border-radius:12px;border:1px solid #e2e8f0;box-shadow:none}
body[data-ui="sleek"] .dashboard-heading,body[data-ui="light"] .dashboard-heading,body[data-ui="compact"] .dashboard-heading{background:#fff;border:1px solid #e2e8f0;box-shadow:none;border-radius:12px;padding:22px 26px}
body[data-ui="sleek"] .dashboard-heading:after,body[data-ui="light"] .dashboard-heading:after,body[data-ui="compact"] .dashboard-heading:after{display:none}
body[data-ui="sleek"] .dashboard-heading h1,body[data-ui="light"] .dashboard-heading h1,body[data-ui="compact"] .dashboard-heading h1{font-size:24px;letter-spacing:-.02em}
body[data-ui="sleek"] .topbar,body[data-ui="light"] .topbar,body[data-ui="compact"] .topbar{background:rgba(255,255,255,.9);border-bottom:1px solid #e2e8f0;box-shadow:none}
body[data-ui="sleek"] .btn,body[data-ui="light"] .btn,body[data-ui="compact"] .btn{border-radius:9px}
body[data-ui="sleek"] .governance-mini,body[data-ui="light"] .governance-mini,body[data-ui="compact"] .governance-mini{display:none}

/* ---- Light: white menu ----------------------------------------------------------------- */
body[data-ui="light"] .sidebar{background:#fff;border-right:1px solid #e2e8f0;color:#334155}
body[data-ui="light"] .brand-copy strong{color:#0f172a}
body[data-ui="light"] .brand-copy small,body[data-ui="light"] .workspace-label,body[data-ui="light"] .sidebar-version{color:#475569}
body[data-ui="light"] .nav-item{color:#334155;font-weight:500}
body[data-ui="light"] .nav-item:hover{background:#f1f5f9;color:#0f172a}
body[data-ui="light"] .nav-item.active{background:#eff6ff;color:#1d4ed8;box-shadow:none}
body[data-ui="light"] .nav-icon{color:#64748b}
body[data-ui="light"] .nav-item.active .nav-icon{color:#1d4ed8}
body[data-ui="light"] .nav-count{background:#f1f5f9;color:#334155}
body[data-ui="light"] .local-chip{color:#475569;background:#f8fafc;border-color:#e2e8f0}
body[data-ui="light"] .nav-collapse{color:#475569}
body[data-ui="light"] .nav-collapse:hover{background:#f1f5f9;color:#0f172a}

/* ---- Compact: more on screen ----------------------------------------------------------- */
body[data-ui="compact"]{font-size:13px}
body[data-ui="compact"] .content-area{padding:16px 20px}
body[data-ui="compact"] .nav{gap:2px}
body[data-ui="compact"] .nav-item{padding:8px 12px}
body[data-ui="compact"] .panel-heading{padding-top:10px;padding-bottom:10px}
body[data-ui="compact"] td,body[data-ui="compact"] th{padding-top:6px !important;padding-bottom:6px !important}
body[data-ui="compact"] .stat-card{padding:12px 14px}
body[data-ui="compact"] .stat-value{font-size:22px}
body[data-ui="compact"] .dashboard-heading{padding:14px 18px}
body[data-ui="compact"] .dashboard-heading h1{font-size:20px}
body[data-ui="compact"] .topbar{height:56px}
.view-menu{width:250px}
#viewBtn{font-size:16px;color:#64748b}

/* ---- ticket actions (top of a ticket) ---------------------------------------------------- */
.ticket-actions{margin:0 0 16px;padding:12px 14px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc}
.ticket-actions-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ticket-state{margin-right:auto;font-size:12px;color:#475569}
.ticket-state strong{color:#0f172a}
.ticket-action-panel{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.ticket-action-panel p{margin:0;font-size:12px;color:#334155;line-height:1.5}
.ticket-action-panel select,.ticket-action-panel textarea{width:100%;border:1px solid #cbd5e1;border-radius:8px;padding:8px 10px;font-size:12.5px;background:#fff;color:#0f172a}
.ticket-action-buttons{display:flex;justify-content:flex-end;gap:8px}
