
/* =========================================================
   РАБОТНИЧКИ v10 — PRODUCT POLISH
   Финальный визуальный слой поверх стабильной бизнес-логики.
   ========================================================= */

:root{
  --p-radius:18px;
  --p-radius-sm:12px;
  --p-border:color-mix(in srgb,var(--text) 10%,var(--surface));
  --p-border-soft:color-mix(in srgb,var(--text) 6%,var(--surface));
  --p-muted:color-mix(in srgb,var(--text) 58%,var(--surface));
  --p-shadow:0 8px 30px color-mix(in srgb,var(--pine) 7%,transparent);
  --p-shadow-hover:0 12px 34px color-mix(in srgb,var(--pine) 11%,transparent);
}
html{scrollbar-gutter:stable}
body{min-height:100vh}
.content{
  width:100%;
  max-width:1640px;
  margin:0 auto;
  padding-bottom:72px!important;
}

/* hierarchy */
.hero,.v7-page-head{
  padding:0 0 2px;
  margin-bottom:22px!important;
}
.hero h1,.v7-page-head h1{
  margin:0 0 7px!important;
  max-width:900px;
}
.hero .muted,.v7-page-head p,.v7-page-head .muted{
  max-width:820px;
  color:var(--p-muted)!important;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 9px;
  border-radius:999px;
  margin-bottom:8px;
  background:color-mix(in srgb,var(--secondary) 15%,var(--surface));
  color:var(--text);
  font-size:10px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}
h2{font-size:20px!important}
h3{font-size:16px}
.subtle,.muted{line-height:1.45}

/* cards */
.card,.v9-section,.v8-create-panel,.v8-campaign-card,.v7-profile-hero{
  border:1px solid var(--p-border)!important;
  box-shadow:var(--p-shadow)!important;
}
.card.hover,a.card,.v7-kpi,.v8-campaign-card,.v7-person-card,.mini-item,.v7-request-row,.v7-attention{
  transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background .14s ease;
}
.card.hover:hover,a.card:hover,.v7-kpi:hover,.v8-campaign-card:hover,.v7-person-card:hover,.mini-item:hover,.v7-request-row:hover,.v7-attention:hover{
  transform:translateY(-1px);
  box-shadow:var(--p-shadow-hover)!important;
  border-color:color-mix(in srgb,var(--pine) 25%,var(--surface))!important;
}
.v7-kpi{position:relative}
a.v7-kpi:after,.v9-metric-link:after{
  content:'→';
  position:absolute;
  right:14px;
  top:14px;
  color:color-mix(in srgb,var(--pine) 72%,var(--surface));
  font-weight:900;
  opacity:.7;
}
.v9-metric-link{position:relative;padding-right:42px!important}

/* navigation / back */
.v9-back{
  display:inline-flex!important;
  align-items:center;
  gap:6px;
  min-height:34px;
  padding:0 10px;
  margin:0 0 10px;
  border:1px solid var(--p-border);
  border-radius:10px;
  background:var(--surface);
  color:var(--text)!important;
  font-size:12px;
  font-weight:800;
}
.v9-back:hover{background:color-mix(in srgb,var(--pine) 5%,var(--surface))}
.side a{transition:background .12s,color .12s}
.side .badge-count{margin-left:auto}
.nav-section>summary{user-select:none}
.text-link{
  color:var(--pine)!important;
  font-weight:800;
  font-size:12px;
}
.text-link:hover{text-decoration:underline}

/* top bar */
.global-search input{transition:background .15s,border-color .15s}
.global-search input:focus{
  background:rgba(255,255,255,.14)!important;
  border-color:rgba(255,255,255,.32)!important;
}
.top-quick:hover{filter:brightness(.98)}
.top-icon{border-radius:9px}
.top-icon:hover{background:rgba(255,255,255,.08)}

/* buttons/forms */
.btn{
  font-weight:850!important;
  letter-spacing:-.01em;
  transition:transform .12s,filter .12s,background .12s,border-color .12s;
}
.btn:hover{transform:translateY(-1px);filter:brightness(.985)}
.btn:active{transform:translateY(0)}
.btn.red{background:#b94f48!important;color:#fff!important;border-color:#b94f48!important}
.form-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
label{display:block;font-weight:800;margin:0 0 6px}
input,select,textarea{
  width:100%;
  outline:none;
}
input[type=checkbox],input[type=radio]{
  width:17px!important;height:17px!important;min-height:17px!important;
  accent-color:var(--pine);
}
form>label:has(input[type=checkbox]),form>label:has(input[type=radio]){
  display:flex;
  align-items:center;
  gap:8px;
  font-weight:700;
}
input::placeholder,textarea::placeholder{
  color:color-mix(in srgb,var(--text) 40%,var(--surface));
}
hr{border-color:var(--p-border)!important}

/* tables */
.table-wrap{overflow:auto}
table{min-width:680px}
th{position:relative;white-space:nowrap}
tbody tr{transition:background .1s}
tbody tr:hover{background:color-mix(in srgb,var(--pine) 2.5%,var(--surface))}
td .btn.small{min-height:34px!important}
.table-wrap:after{
  content:'';
  position:sticky;
  right:0;
}

/* empty states */
.v7-empty-ok,.v8-empty{
  display:grid;
  place-items:center;
  min-height:112px;
  padding:24px;
  text-align:center;
  border:1px dashed color-mix(in srgb,var(--text) 18%,var(--surface))!important;
  border-radius:14px;
  background:color-mix(in srgb,var(--text) 1.5%,var(--surface))!important;
  color:var(--p-muted);
}
.v7-empty-ok{color:#49705f}

/* dashboard */
.v7-dashboard-layout{align-items:start}
.v7-status-row a{
  min-height:64px;
  border:1px solid var(--p-border-soft);
  border-radius:12px;
  background:color-mix(in srgb,var(--text) 1.5%,var(--surface));
}
.v7-status-row a:hover{background:color-mix(in srgb,var(--pine) 4%,var(--surface))}
.v7-attention-list{gap:8px!important}
.v7-attention{min-height:54px}
.v7-request-row{min-height:58px}
.v7-quick-grid a{
  border:1px solid var(--p-border)!important;
  background:color-mix(in srgb,var(--secondary) 8%,var(--surface))!important;
}
.v7-quick-grid a:nth-child(2){background:color-mix(in srgb,#72b6ed 12%,var(--surface))!important}
.v7-quick-grid a:nth-child(3){background:color-mix(in srgb,#9c76e8 11%,var(--surface))!important}
.v7-quick-grid a:nth-child(4){background:color-mix(in srgb,#f0b64d 14%,var(--surface))!important}

/* employee/team */
.v7-team-list{padding:8px!important}
.v7-team-person{
  padding:13px 14px!important;
  border-bottom:1px solid var(--p-border-soft)!important;
}
.v7-team-person:last-child{border-bottom:0!important}
.v7-profile-hero{padding:22px!important}
.v7-profile-main h1{margin-bottom:4px!important}
.v7-tabs{margin:15px 0 18px!important}

/* request detail */
.page-request .split,.page-event .split,.page-campaign .split,.page-hr_support .split{
  grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr)!important;
}
.page-request .timeline{box-shadow:none!important}
.timeline-item{padding:11px 0;border-bottom:1px solid var(--p-border-soft)}
.timeline-item:last-child{border-bottom:0}

/* new request */
.page-new .content>.card{max-width:960px!important;margin:0 auto}
.page-new .card h2{margin-bottom:16px}
.quick-options{gap:8px!important}
.quick-options button,.quick-options label{border-radius:11px!important}

/* calendar */
.page-calendar .calendar-grid,.page-statistics .calendar-grid{
  background:var(--surface);
  border:1px solid var(--p-border);
  border-radius:16px;
  padding:8px;
  box-shadow:var(--p-shadow);
}
.cal-head{font-size:11px;color:var(--p-muted);font-weight:800;padding:7px}
.cal-day{background:var(--surface)!important}
.cal-day.weekend{background:color-mix(in srgb,var(--text) 2%,var(--surface))!important}
.cal-day .event{border-radius:7px!important}

/* production calendar — the previous broken screen */
.page-production .split{
  grid-template-columns:minmax(0,1.35fr) minmax(360px,.65fr)!important;
  align-items:start!important;
  gap:16px!important;
}
.page-production .split>.card{height:auto!important;min-height:0!important}
.page-production .card form{
  display:block!important;
}
.page-production .card form>label{
  margin-top:14px!important;
}
.page-production .card form>label:first-of-type{margin-top:0!important}
.page-production .card form input:not([type=checkbox]),
.page-production .card form select{
  width:100%!important;
  min-width:0!important;
}
.page-production .card form .subtle{margin:7px 0 0!important}
.page-production .card form>.btn{margin-top:14px!important;width:auto!important}
.page-production .alert{max-width:none!important}

/* campaigns */
.page-campaigns .v7-kpis{margin-bottom:16px}
.v8-campaign-card{
  display:flex!important;
  flex-direction:column;
  justify-content:space-between;
  gap:14px;
}
.v8-campaign-card .v8-campaign-progress{margin-top:auto}
.v8-create-panel>summary{
  min-height:62px;
  align-items:center;
}
.v8-create-panel[open]>summary{border-bottom:1px solid var(--p-border)}
.page-campaign .table-wrap{margin-top:12px}

/* events */
.page-events .grid.cards{grid-template-columns:repeat(auto-fit,minmax(275px,1fr))!important}
.page-events .grid.cards>.card{min-height:170px}
.page-events #newEvent{max-width:1180px;margin-left:auto;margin-right:auto}
.page-events #newEvent .row{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.rsvp-cols{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}

/* moods */
.page-moods .mood-filter{
  display:grid;
  grid-template-columns:minmax(160px,.7fr) minmax(190px,1fr) minmax(190px,1fr) auto;
  gap:12px;
  align-items:end;
  margin-bottom:16px;
}
.page-moods .control-grid{margin-bottom:18px!important}
.page-moods .bar-row{padding:8px 0}

/* stats/analytics/control */
.control-grid{gap:12px!important}
.control-grid>.card{min-height:125px}
.page-statistics .stat-calendar{min-width:940px}
.page-analytics .bar-row{grid-template-columns:minmax(180px,.7fr) minmax(200px,1fr) auto!important}
.page-control .split{margin-top:16px!important}

/* employee lists/edit/import */
.page-employees .hero,.page-children .hero,.page-departments .hero{align-items:flex-end}
.page-employees td:first-child{min-width:250px}
.page-employee_edit .content>.card{max-width:1100px!important;margin:0 auto}
.page-employee_edit .row,.page-employee_edit .row3{
  gap:14px!important;
}
.page-employee_import .split{
  grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr)!important;
  align-items:start;
}
.import-drop{min-height:180px;display:grid;place-items:center;text-align:center}
.import-summary{gap:10px!important}

/* departments */
.page-departments .split{
  grid-template-columns:minmax(0,1.4fr) minmax(340px,.6fr)!important;
  align-items:start;
}
.page-departments .sticky-card{position:sticky;top:84px}

/* workflow rules */
.page-rules .card[style*="padding:0"]{
  padding:10px!important;
  background:color-mix(in srgb,var(--text) 1.4%,var(--surface))!important;
}
.rule-card{
  display:grid!important;
  grid-template-columns:minmax(180px,1.2fr) minmax(180px,1fr) minmax(120px,.65fr) minmax(160px,.8fr) minmax(150px,.8fr) auto!important;
  gap:10px!important;
  align-items:end!important;
  padding:14px!important;
  margin:0 0 8px!important;
}
.rule-card>div{min-width:0}
.rule-card label{font-size:10px!important;margin-bottom:4px}
.rule-card input,.rule-card select{min-height:38px!important;padding:8px 9px!important}
.rule-card .btn{min-height:38px!important;white-space:nowrap}

/* notification center */
.page-notification_settings .table-wrap{margin-bottom:16px}
.page-notification_settings .grid.cards{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
.page-notification_settings .grid.cards>.card{min-height:220px}
.page-notification_settings .grid.cards>.card:last-child{min-height:0}
.page-notification_settings .kv{grid-template-columns:minmax(140px,190px) 1fr!important}

/* integrations/automation */
.page-integrations .grid.cards,.page-automation .grid.cards{
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr))!important;
}
.page-integrations .grid.cards>.card,.page-automation .grid.cards>.card{min-height:190px}

/* theme builder */
.page-theme .theme-layout{
  grid-template-columns:minmax(0,1.2fr) minmax(390px,.8fr)!important;
  align-items:start;
  gap:18px!important;
}
.page-theme .theme-preview{
  position:sticky;
  top:84px;
  max-height:calc(100vh - 100px);
  overflow:auto;
}
.page-theme .card{overflow:hidden}
.page-theme input[type=color]{padding:4px!important;min-height:44px}

/* audit */
.page-audit .table-wrap{margin-top:12px}
.page-audit td:last-child{max-width:520px}

/* settings/profile */
.page-settings .content>.card{max-width:920px!important;margin:0 auto}
.page-profile .profile-shell{align-items:start}

/* finish all "testing" looking raw layouts */
.page-automation .content>.card,
.page-integrations .content>.card,
.page-notification_settings .content>form,
.page-rules .content>.card,
.page-production .content>.split,
.page-departments .content>.split{
  margin-top:4px;
}
.alert{
  border:1px solid color-mix(in srgb,var(--text) 10%,var(--surface))!important;
  box-shadow:none!important;
}
.secret-box{border-radius:14px!important}

/* app/mobile */
.bottom-nav{
  box-shadow:0 -8px 28px color-mix(in srgb,var(--pine) 7%,transparent)!important;
  border-top-color:var(--p-border)!important;
}
.bottom-nav a,.bottom-nav button{transition:background .12s,color .12s}
.bottom-nav a.active{background:color-mix(in srgb,var(--secondary) 13%,var(--surface))}
body.app-mode .content{max-width:100%}

/* responsive */
@media(max-width:1320px){
  .rule-card{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .rule-card>div:last-child{grid-column:auto}
  .page-theme .theme-layout{grid-template-columns:1fr!important}
  .page-theme .theme-preview{position:static!important;max-height:none!important}
}
@media(max-width:1120px){
  .page-production .split,
  .page-request .split,.page-event .split,.page-campaign .split,.page-hr_support .split,
  .page-employee_import .split,.page-departments .split{
    grid-template-columns:1fr!important;
  }
  .page-departments .sticky-card{position:static}
  .page-events #newEvent .row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .rsvp-cols{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .page-moods .mood-filter{grid-template-columns:1fr 1fr!important}
}
@media(max-width:900px){
  .content{padding-top:18px!important}
  .rule-card{grid-template-columns:1fr 1fr!important}
  .page-notification_settings .grid.cards{grid-template-columns:1fr!important}
  .page-events #newEvent .row{grid-template-columns:1fr!important}
  .rsvp-cols{grid-template-columns:1fr!important}
  .page-moods .mood-filter{grid-template-columns:1fr!important}
  .page-analytics .bar-row{grid-template-columns:1fr auto!important}
  .page-analytics .bar-row .capacity{grid-column:1/-1}
}
@media(max-width:600px){
  .rule-card{grid-template-columns:1fr!important}
  .v7-status-row{grid-template-columns:1fr 1fr!important}
  .v7-quick-grid{grid-template-columns:1fr 1fr!important}
  .page-production .toolbar,.page-statistics .toolbar{width:100%;justify-content:space-between}
  .page-production .toolbar b,.page-statistics .toolbar b{flex:1;text-align:center}
  .card{border-radius:14px!important}
}
