
/* =========================================================
   CONTEC ServiceDesk V34.0.1 – Professional Operations UI
   ========================================================= */

:root{
  --v34-bg:#f5f7f8;
  --v34-surface:#ffffff;
  --v34-ink:#122f3a;
  --v34-muted:#6c7f86;
  --v34-line:#dfe7e9;
  --v34-line-strong:#cad8dc;
  --v34-accent:#0b7187;
  --v34-accent-dark:#07596b;
  --v34-soft:#eef6f7;
  --v34-shadow:0 8px 24px rgba(20,52,62,.055);
}

body{background:var(--v34-bg)!important}
main{background:linear-gradient(180deg,#fafbfc 0%,#f5f7f8 100%)!important}

/* Sidebar: calm, compact, professional */
.sidebar{
  background:linear-gradient(180deg,#0b3541 0%,#0b4b59 100%)!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
}
.brand{
  padding:5px 8px 16px!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
}
.brand strong{font-weight:800!important;letter-spacing:-.02em}
.brand small{opacity:.68!important}
.sidebar-nav .nav-group-title{
  color:rgba(255,255,255,.48)!important;
  font-size:8px!important;
  letter-spacing:.12em!important;
  margin-top:14px!important;
}
.sidebar-nav .nav-btn{
  min-height:37px!important;
  border-radius:8px!important;
  font-size:11px!important;
  font-weight:650!important;
  color:rgba(255,255,255,.88)!important;
}
.sidebar-nav .nav-btn:hover{background:rgba(255,255,255,.08)!important}
.sidebar-nav .nav-btn.active{
  background:#fff!important;
  color:#0b5363!important;
  box-shadow:0 7px 20px rgba(0,0,0,.14)!important;
}

/* Header / search */
.workspace-quickbar{
  background:rgba(255,255,255,.96)!important;
  border:0!important;
  border-bottom:1px solid var(--v34-line)!important;
  box-shadow:none!important;
}
.topbar{background:#fff!important;border-bottom:1px solid var(--v34-line)!important}
.global-search-wrap input{
  background:#f8fafb!important;
  border:1px solid var(--v34-line-strong)!important;
  border-radius:9px!important;
  box-shadow:none!important;
}

/* IMPORTANT: old dashboard uses a 2-column parent grid.
   New V34 blocks must always span the complete workspace. */
.dashboard-v217>.pro-dashboard-head,
.dashboard-v217>.v34-command,
.dashboard-v217>.v34-workspaces,
.dashboard-v217>.v34-beosys-boundary,
.dashboard-v217>.pro-kpi-grid,
.dashboard-v217>.pro-dashboard-grid,
.dashboard-v217>.dashboard-greeting-v217,
.dashboard-v217>.dashboard-kpis-v217,
.dashboard-v217>.sd-work-kpis,
.dashboard-v217>.dashboard-main-v217,
.dashboard-v217>.dashboard-team-v217,
.dashboard-v217>.dashboard-quick-v217,
.dashboard-v217>.dashboard-mindmap-v217{
  grid-column:1/-1!important;
  width:100%!important;
  min-width:0!important;
}

/* Main dashboard container */
.dashboard-v217{
  max-width:1500px!important;
  padding:22px 26px 42px!important;
  gap:0!important;
}
.pro-dashboard-head{
  display:flex!important;
  justify-content:space-between!important;
  align-items:flex-end!important;
  gap:24px!important;
  padding:0 0 19px!important;
  margin:0 0 18px!important;
  border-bottom:1px solid var(--v34-line)!important;
}
.workspace-kicker{
  color:var(--v34-accent)!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.14em!important;
}
.pro-dashboard-head h1{
  margin:4px 0 5px!important;
  font-size:31px!important;
  line-height:1.05!important;
  letter-spacing:-.04em!important;
  color:var(--v34-ink)!important;
}
.pro-dashboard-head p{
  max-width:760px!important;
  font-size:12px!important;
  color:var(--v34-muted)!important;
}
.pro-dashboard-actions{gap:8px!important}
.pro-dashboard-actions button{
  min-height:38px!important;
  padding:8px 13px!important;
  border-radius:9px!important;
  font-weight:750!important;
}
.pro-dashboard-actions .primary{
  background:var(--v34-accent)!important;
  border-color:var(--v34-accent)!important;
  box-shadow:0 5px 14px rgba(11,113,135,.18)!important;
}

/* The separate 'search prompt' card was visually redundant.
   Keep the functionality but turn it into a slim command row. */
.v34-command{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  padding:11px 14px!important;
  margin:0 0 12px!important;
  background:#fff!important;
  border:1px solid var(--v34-line)!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
.v34-command>div{
  display:grid!important;
  grid-template-columns:auto auto 1fr!important;
  align-items:center!important;
  gap:10px!important;
}
.v34-command .v34-eyebrow{
  font-size:8px!important;
  color:var(--v34-accent)!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
}
.v34-command b{font-size:12px!important;color:var(--v34-ink)!important}
.v34-command small{font-size:10px!important;color:var(--v34-muted)!important}
.v34-command button{
  min-width:96px!important;
  min-height:34px!important;
  border:1px solid var(--v34-line-strong)!important;
  border-radius:8px!important;
  background:#fff!important;
  color:var(--v34-ink)!important;
  font-weight:750!important;
}

/* Six workspaces: one cohesive navigation layer */
.v34-workspaces{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0 0 12px!important;
}
.v34-workspaces button{
  position:relative!important;
  min-width:0!important;
  min-height:92px!important;
  padding:15px 15px 14px 50px!important;
  text-align:left!important;
  background:#fff!important;
  border:1px solid var(--v34-line)!important;
  border-radius:11px!important;
  box-shadow:none!important;
  transition:.15s ease!important;
}
.v34-workspaces button:hover{
  transform:translateY(-1px)!important;
  border-color:#aacbd2!important;
  box-shadow:var(--v34-shadow)!important;
}
.v34-workspaces button>span{
  position:absolute!important;
  left:14px!important;top:15px!important;
  width:25px!important;height:25px!important;
  display:grid!important;place-items:center!important;
  border-radius:7px!important;
  background:var(--v34-soft)!important;
  color:var(--v34-accent)!important;
  font-size:8px!important;font-weight:900!important;
}
.v34-workspaces button>b{
  display:block!important;
  margin-bottom:5px!important;
  color:var(--v34-ink)!important;
  font-size:13px!important;
  letter-spacing:-.01em!important;
}
.v34-workspaces button>small{
  display:block!important;
  color:var(--v34-muted)!important;
  font-size:10px!important;
  line-height:1.4!important;
}

/* BEOSYS boundary: slim, explicit, non-dominant */
.v34-beosys-boundary{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex-wrap:wrap!important;
  margin:0 0 17px!important;
  padding:8px 11px!important;
  border:1px solid #d4e5e8!important;
  border-radius:8px!important;
  background:#eef6f7!important;
  color:#426871!important;
  font-size:9px!important;
}
.v34-beosys-boundary b{color:#0b5969!important}
.v34-beosys-boundary span{margin-left:auto!important;color:#71858b!important}

/* KPI row */
.pro-kpi-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0 0 18px!important;
}
.pro-kpi{
  min-height:92px!important;
  padding:13px 14px!important;
  background:#fff!important;
  border:1px solid var(--v34-line)!important;
  border-radius:11px!important;
  box-shadow:none!important;
}
.pro-kpi:hover{border-color:#aecbd2!important;box-shadow:var(--v34-shadow)!important}
.pro-kpi span{font-size:10px!important;color:#587078!important}
.pro-kpi b{font-size:24px!important;color:var(--v34-ink)!important;margin:5px 0 2px!important}
.pro-kpi small{font-size:9px!important;color:#87979c!important}

/* Today + shortcuts: stable 2-column area, never squeezed */
.pro-dashboard-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.65fr) minmax(340px,.75fr)!important;
  gap:12px!important;
  margin:0 0 18px!important;
  align-items:stretch!important;
}
.pro-dashboard-grid>.panel{
  min-width:0!important;
  padding:15px!important;
  border:1px solid var(--v34-line)!important;
  border-radius:12px!important;
  box-shadow:none!important;
  background:#fff!important;
}
.pro-dashboard-grid .panel-head{margin-bottom:10px!important}
.pro-dashboard-grid .panel-head h2{
  margin:0!important;
  font-size:15px!important;
  color:var(--v34-ink)!important;
}
.pro-dashboard-grid .panel-head p{
  margin-top:3px!important;
  font-size:10px!important;
}
.pro-shortcuts{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:7px!important;
}
.pro-shortcuts button{
  min-height:65px!important;
  padding:10px!important;
  border-radius:8px!important;
  background:#f9fbfb!important;
  border:1px solid var(--v34-line)!important;
}
.pro-shortcuts button b{font-size:11px!important;color:var(--v34-ink)!important}
.pro-shortcuts button span{font-size:9px!important;line-height:1.3!important}

/* Remove the duplicate greeting + duplicate colourful KPI strip.
   Data/functions remain in DOM, but are no longer part of the visual hierarchy. */
.dashboard-greeting-v217,
.dashboard-kpis-v217{
  display:none!important;
}

/* Secondary operational panels */
.sd-work-kpis{margin:0 0 12px!important}
.dashboard-main-v217{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
  margin:0 0 12px!important;
}
.dashboard-main-v217>.dashboard-card-v217{
  grid-column:auto!important;
  grid-row:auto!important;
  height:auto!important;
  min-height:260px!important;
  padding:15px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid var(--v34-line)!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
.dashboard-card-v217 .panel-head h3{
  color:var(--v34-ink)!important;
  font-size:14px!important;
}
.dashboard-card-v217 .panel-head p{font-size:10px!important}
.dashboard-card-v217 .dash360-feed{max-height:260px!important}

/* Avoid bright consumer-app rainbow cards in a professional ERP cockpit */
.dashboard-kpi-v217 .kpi-icon,
.quick-icon.purple,.quick-icon.red,.quick-icon.blue,.quick-icon.green,.quick-icon.orange{
  background:var(--v34-accent)!important;
}

/* Standard panels */
.dashboard-v217 .panel{
  border-color:var(--v34-line)!important;
  box-shadow:none!important;
}
.dashboard-v217 .panel:hover{box-shadow:none!important}

/* Secondary strips visually quieter */
.dashboard-team-v217,
.dashboard-quick-v217,
.dashboard-mindmap-v217{
  margin-top:0!important;
  border-radius:12px!important;
  background:#fff!important;
}
.dashboard-team-v217{margin-bottom:12px!important}
.dashboard-quick-v217{margin-bottom:12px!important}

/* Responsive */
@media(max-width:1200px){
  .dashboard-v217{padding:18px!important}
  .v34-workspaces{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .pro-dashboard-grid{grid-template-columns:1fr!important}
  .dashboard-main-v217{grid-template-columns:1fr!important}
  .v34-beosys-boundary span{margin-left:0!important;width:100%!important}
}
@media(max-width:760px){
  .dashboard-v217{padding:12px!important}
  .pro-dashboard-head{align-items:flex-start!important;flex-direction:column!important}
  .pro-dashboard-actions{width:100%!important}
  .pro-dashboard-actions button{flex:1!important}
  .v34-command>div{display:block!important}
  .v34-command small{display:block!important;margin-top:4px!important}
  .v34-workspaces{grid-template-columns:1fr!important}
  .pro-kpi-grid{grid-template-columns:1fr 1fr!important}
}
