@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@100..900&display=swap');
:root {
    --bg: #f6f7fb;
    --surface: #ffffff;
    --surface-soft: #f8f9fc;
    --column: #f6f6f8;
    --text: #171329;
    --muted: #7d7a8b;
    --soft-text: #a19daf;
    --line: #ececf2;
    --line-strong: #dedee9;
    --primary: #6c47ff;
    --primary-soft: #f0ebff;
    --success: #4daf65;
    --success-soft: #eef9f1;
    --warning: #f59e0b;
    --warning-soft: #fff7e8;
    --danger: #ef6461;
    --danger-soft: #fff0ef;
    --info: #5798ef;
    --info-soft: #edf5ff;
    --shadow: 0 18px 40px rgba(27, 28, 52, .05);
    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;
    --sidebar-width: 248px;
}

* { box-sizing: border-box; }
html, body, input, button, select, textarea, table, th, td, a, span, small, strong, p, div { font-family: var(--font-main) !important; }
html { scroll-behavior: smooth; }
:root { --font-main: "Vazirmatn", "Vazir", Tahoma, Arial, sans-serif; }
body {
    margin: 0;
    min-height: 100vh;
    overflow-x: hidden;
    font-family: var(--font-main);
    background: var(--bg);
    color: var(--text);
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; }
.sidebar {
    position: fixed;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: var(--sidebar-width);
    background: var(--surface);
    border-inline-end: 1px solid var(--line);
    padding: 22px 16px;
    display: flex;
    flex-direction: column;
    z-index: 50;
}
.sidebar-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 2px 24px;
}
.brand-symbol {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 20px;
    line-height: 1;
}
.sidebar-head strong { display: block; font-size: 16px; letter-spacing: -.01em; }
.sidebar-head span { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }
.collapse-hint {
    margin-inline-start: auto;
    border: 0;
    background: transparent;
    color: var(--soft-text);
    font-size: 20px;
}
.nav-list {
    display: grid;
    gap: 6px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--line);
    max-height: 50vh;
    overflow: auto;
}
.nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    border-radius: 14px;
    padding: 0 10px;
    color: #6f6b80;
    font-weight: 600;
    transition: .18s ease;
}
.nav-item:hover { background: var(--surface-soft); color: var(--text); }
.nav-item.active { background: var(--primary-soft); color: var(--primary); }
.nav-icon {
    width: 27px;
    height: 27px;
    display: inline-grid;
    place-items: center;
    color: currentColor;
    font-size: 15px;
}
.nav-item em {
    margin-inline-start: auto;
    font-style: normal;
    min-width: 22px;
    height: 22px;
    padding: 0 7px;
    border-radius: 999px;
    display: inline-grid;
    place-items: center;
    background: #f1f1f5;
    color: var(--muted);
    font-size: 11px;
}
.my-projects-box {
    padding-top: 24px;
    display: grid;
    gap: 8px;
}
.box-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--soft-text);
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 4px;
}
.box-title span {
    width: 20px;
    height: 20px;
    border: 1px solid var(--line-strong);
    border-radius: 7px;
    display: inline-grid;
    place-items: center;
}
.mini-project-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    border-radius: 12px;
    padding: 0 10px;
    color: #6f6b80;
    transition: .18s ease;
}
.mini-project-link:hover, .mini-project-link:first-of-type { background: var(--primary-soft); color: var(--text); }
.mini-project-link i {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary);
}
.mini-project-link.critical i { background: var(--danger); }
.mini-project-link.warning i { background: var(--warning); }
.mini-project-link.active i { background: var(--info); }
.mini-project-link.near i { background: var(--success); }
.mini-project-link em { margin-inline-start: auto; color: var(--soft-text); font-style: normal; }
.sidebar-footer {
    margin-top: auto;
    padding: 16px;
    border-radius: 22px;
    background: #fbfaf6;
    color: var(--muted);
    line-height: 1.9;
    font-size: 12px;
}
.phase-badge {
    display: inline-flex;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 800;
    margin-bottom: 6px;
}

.content-shell {
    width: 100%;
    min-height: 100vh;
    padding-inline-start: var(--sidebar-width);
}
.topbar {
    height: 74px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 38px;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    z-index: 40;
}
.search-box {
    position: relative;
    width: min(420px, 38vw);
    flex: 0 1 420px;
}
.search-box > span {
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--muted);
}
.search-box input {
    width: 100%;
    height: 44px;
    border: 0;
    outline: none;
    background: #f6f6f8;
    border-radius: 12px;
    padding: 0 42px 0 14px;
    color: var(--text);
}
.search-box input:focus {
    box-shadow: 0 0 0 3px rgba(108,71,255,.12);
}
.search-results {
    position: absolute;
    inset-inline: 0;
    top: calc(100% + 10px);
    display: none;
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    border-radius: 18px;
    padding: 8px;
    z-index: 80;
}
.search-results.open { display: block; }
.search-result-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 12px;
    border-radius: 12px;
}
.search-result-item:hover { background: var(--surface-soft); }
.search-result-item strong { display: block; font-size: 13px; }
.search-result-item small { color: var(--muted); font-size: 12px; }
.search-result-item em { font-style: normal; font-size: 11px; color: var(--primary); font-weight: 800; }
.topbar-actions {
    margin-inline-start: auto;
    display: flex;
    align-items: center;
    gap: 8px;
}
.icon-button, .profile-button {
    border: 0;
    background: var(--surface);
    min-width: 38px;
    height: 38px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6f6b80;
    transition: .18s ease;
}
.icon-button:hover, .profile-button:hover { background: #f6f6f8; color: var(--text); }
.has-dot { position: relative; }
.has-dot::after {
    content: '';
    position: absolute;
    top: 8px;
    inset-inline-end: 8px;
    width: 8px;
    height: 8px;
    background: var(--danger);
    border: 2px solid #fff;
    border-radius: 50%;
}
.role-switcher select {
    height: 38px;
    min-width: 158px;
    border: 0;
    outline: none;
    background: #f6f6f8;
    color: #403b50;
    border-radius: 12px;
    padding: 0 10px;
}
.profile-button {
    height: 46px;
    gap: 10px;
    padding: 0 8px;
}
.profile-text { display: grid; text-align: right; line-height: 1.2; }
.profile-text strong { font-size: 13px; color: var(--text); }
.profile-text small { color: var(--muted); font-size: 11px; }
.avatar {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.avatar.big { width: 56px; height: 56px; font-size: 18px; }
.dropdown { position: relative; }
.dropdown-panel {
    position: absolute;
    top: calc(100% + 10px);
    inset-inline-start: 0;
    display: none;
    width: 320px;
    max-width: calc(100vw - 28px);
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    border-radius: 20px;
    padding: 12px;
    z-index: 90;
}
.dropdown.open .dropdown-panel { display: block; }
.dropdown-title { font-size: 13px; font-weight: 900; margin-bottom: 10px; }
.quick-tools-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
.quick-tool {
    display: grid;
    gap: 5px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
    border-radius: 14px;
    padding: 12px;
}
.quick-tool strong { font-size: 12px; }
.quick-tool small { color: var(--muted); font-size: 11px; line-height: 1.7; }
.notification-item {
    border: 1px solid var(--line);
    background: var(--surface-soft);
    border-radius: 14px;
    padding: 11px 12px;
    margin-bottom: 8px;
}
.notification-item strong { display: block; font-size: 13px; }
.notification-item p { margin: 6px 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.notification-item small { color: var(--soft-text); font-size: 11px; }
.profile-card-mini { display: grid; place-items: center; gap: 8px; text-align: center; border-bottom: 1px solid var(--line); padding-bottom: 12px; margin-bottom: 8px; }
.profile-card-mini p { margin: 0; color: var(--muted); line-height: 1.8; font-size: 12px; }
.dropdown-link {
    display: block;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: right;
    padding: 10px 8px;
    border-radius: 10px;
    color: var(--text);
}
.dropdown-link:hover { background: var(--surface-soft); }
.dropdown-link.danger { color: var(--danger); }
.mobile-only { display: none; }

.main-content {
    padding: 34px 38px 28px;
}
.pm-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 24px;
}
.eyebrow {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
}
.pm-title-row {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}
.pm-title-row h1 {
    margin: 0;
    font-size: clamp(32px, 4vw, 44px);
    letter-spacing: -.04em;
    line-height: 1.15;
}
.square-action {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 9px;
    background: var(--primary-soft);
    color: var(--primary);
    display: inline-grid;
    place-items: center;
}
.pm-hero p:not(.eyebrow) {
    margin: 12px 0 0;
    color: var(--muted);
    line-height: 1.9;
}
.pm-team-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 10px;
}
.invite-link { color: var(--primary); font-weight: 800; font-size: 13px; }
.avatar-stack, .mini-avatar-stack {
    display: flex;
    align-items: center;
    direction: ltr;
}
.avatar-stack span, .avatar-stack em,
.mini-avatar-stack span {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background: #eee7ff;
    color: var(--primary);
    border: 2px solid #fff;
    margin-inline-start: -8px;
    font-weight: 800;
    font-size: 12px;
    font-style: normal;
}
.avatar-stack em { background: #ffe1e1; color: var(--danger); }
.pm-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 24px;
}
.toolbar-filters, .toolbar-view { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.toolbar-filters button, .toolbar-view button {
    height: 40px;
    border: 1px solid var(--line-strong);
    background: var(--surface);
    border-radius: 10px;
    padding: 0 14px;
    color: #6f6b80;
    font-weight: 700;
}
.toolbar-view button { width: 40px; padding: 0; }
.toolbar-view button.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.pm-stats-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 22px;
}
.pm-stats-row article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 16px 18px;
    box-shadow: 0 12px 28px rgba(27,28,52,.035);
}
.pm-stats-row small { display: block; color: var(--muted); font-weight: 700; font-size: 12px; }
.pm-stats-row strong { display: block; font-size: 26px; margin: 7px 0 3px; }
.pm-stats-row span { color: var(--soft-text); font-size: 12px; line-height: 1.7; }
.pm-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 22px;
    align-items: start;
}
.kanban-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(240px, 1fr));
    gap: 14px;
    min-width: 0;
}
.kanban-column {
    background: var(--column);
    border-radius: 20px;
    padding: 16px;
    min-width: 0;
}
.kanban-column > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 3px solid var(--line-strong);
    padding-bottom: 12px;
    margin-bottom: 16px;
}
.kanban-column.todo > header { border-color: var(--primary); }
.kanban-column.progress > header { border-color: var(--warning); }
.kanban-column.done > header { border-color: #9ccca3; }
.kanban-column header > div {
    display: flex;
    align-items: center;
    gap: 8px;
}
.kanban-column header strong { font-size: 15px; }
.kanban-column header em {
    font-style: normal;
    width: 22px;
    height: 22px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: #e9e9ef;
    color: var(--muted);
    font-size: 11px;
}
.kanban-column header button {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 7px;
    background: #eee7ff;
    color: var(--primary);
}
.column-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.column-dot.purple { background: var(--primary); }
.column-dot.orange { background: var(--warning); }
.column-dot.green { background: var(--success); }
.kanban-card-list { display: grid; gap: 14px; }
.project-task-card {
    background: var(--surface);
    border: 1px solid rgba(255,255,255,.95);
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 16px 26px rgba(27,28,52,.035);
    transition: .18s ease;
}
.project-task-card:hover { transform: translateY(-2px); box-shadow: 0 20px 34px rgba(27,28,52,.07); }
.task-card-top, .project-task-card footer, .card-progress-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.task-card-top button {
    border: 0;
    background: transparent;
    color: var(--muted);
    letter-spacing: 1px;
}
.priority-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 800;
}
.priority-badge.critical { background: var(--danger-soft); color: var(--danger); }
.priority-badge.warning { background: var(--warning-soft); color: var(--warning); }
.priority-badge.active { background: var(--info-soft); color: var(--info); }
.priority-badge.near { background: var(--success-soft); color: var(--success); }
.priority-badge.draft { background: #f1f1f5; color: var(--muted); }
.project-task-card h3 { margin: 14px 0 7px; font-size: 18px; line-height: 1.5; }
.project-task-card p { margin: 0 0 14px; color: var(--muted); font-size: 12px; line-height: 1.9; }
.card-progress-row span { font-size: 12px; color: var(--muted); font-weight: 800; }
.card-progress {
    flex: 1;
    height: 7px;
    border-radius: 999px;
    background: #f0f0f5;
    overflow: hidden;
}
.card-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--primary);
}
.project-task-card.critical .card-progress i { background: var(--danger); }
.project-task-card.warning .card-progress i { background: var(--warning); }
.project-task-card.active .card-progress i { background: var(--info); }
.project-task-card.near .card-progress i { background: var(--success); }
.task-products {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 14px 0;
}
.task-products span {
    padding: 5px 8px;
    border-radius: 8px;
    background: #f6f6f8;
    color: #6f6b80;
    font-size: 11px;
    font-weight: 700;
}
.mini-avatar-stack span {
    width: 28px;
    height: 28px;
    font-size: 11px;
}
.task-meta-icons {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 11px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.empty-column {
    background: rgba(255,255,255,.7);
    border: 1px dashed var(--line-strong);
    border-radius: 16px;
    padding: 18px;
    display: grid;
    gap: 6px;
    color: var(--muted);
    text-align: center;
}
.pm-agenda-panel {
    position: sticky;
    top: 94px;
}
.agenda-card {
    background: #fbf5ef;
    border-radius: 28px;
    padding: 24px 20px;
    min-height: 620px;
}
.agenda-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 28px;
}
.agenda-card h2 { margin: 0; font-size: 22px; }
.agenda-card header small { color: var(--muted); }
.agenda-card header button {
    width: 36px;
    height: 36px;
    border: 0;
    background: #fff;
    border-radius: 12px;
    color: var(--text);
}
.agenda-section { display: grid; gap: 12px; margin-bottom: 28px; }
.agenda-section > strong { color: #7a6070; font-size: 13px; }
.agenda-item {
    display: grid;
    grid-template-columns: 50px 1fr;
    gap: 12px;
    align-items: start;
}
.agenda-item time { font-weight: 900; color: var(--text); font-size: 13px; padding-top: 2px; }
.agenda-item div {
    border-inline-start: 3px solid currentColor;
    padding-inline-start: 12px;
}
.agenda-item span { display: block; color: #9a7e93; font-size: 11px; margin-bottom: 4px; }
.agenda-item p { margin: 0; font-weight: 800; line-height: 1.7; }
.agenda-item.danger { color: var(--danger); }
.agenda-item.warning { color: var(--warning); }
.agenda-item.info { color: #8fd0d6; }
.agenda-item.success { color: var(--success); }
.agenda-item.danger p, .agenda-item.warning p, .agenda-item.info p, .agenda-item.success p { color: var(--text); }
.decision-mini, .finance-mini {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 16px;
    padding: 12px;
}
.decision-mini { justify-content: flex-start; }
.decision-mini > span {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: currentColor;
    margin-top: 7px;
    flex: 0 0 auto;
}
.decision-mini p, .finance-mini p { margin: 0; font-size: 12px; line-height: 1.8; font-weight: 800; color: var(--text); }
.decision-mini small, .finance-mini small { color: var(--muted); font-size: 11px; line-height: 1.7; }
.decision-mini.danger { color: var(--danger); }
.decision-mini.warning { color: var(--warning); }
.decision-mini.info { color: var(--info); }
.decision-mini.success { color: var(--success); }
.finance-mini span {
    background: #fff;
    color: var(--primary);
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

/* Login and settings pages */
.auth-page {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background: var(--bg);
}
.auth-shell { width: min(1080px, 100%); }
.glass-card, .auth-card, .panel-card, .role-card, .info-card, .page-hero {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 24px;
    box-shadow: var(--shadow);
}
.auth-card { padding: clamp(24px, 4vw, 42px); }
.brand-mark {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    background: var(--primary);
    color: #fff;
    font-weight: 900;
}
.auth-card h1, .page-hero h1 { margin: 10px 0; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.04em; }
.auth-intro, .page-hero p { color: var(--muted); line-height: 2; }
.role-form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 12px;
    align-items: end;
    background: var(--surface-soft);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 18px;
}
.role-form label { grid-column: 1 / -1; color: var(--muted); font-size: 13px; font-weight: 800; }
.form-control {
    width: 100%;
    height: 44px;
    border: 1px solid var(--line-strong);
    background: #fff;
    border-radius: 12px;
    padding: 0 12px;
    outline: none;
}
.form-control:focus { box-shadow: 0 0 0 3px rgba(108,71,255,.12); border-color: rgba(108,71,255,.35); }
.btn { height: 44px; border: 0; border-radius: 12px; padding: 0 18px; font-weight: 900; }
.btn-primary { background: var(--primary); color: #fff; }
.role-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 12px;
    margin-top: 18px;
}
.role-chip {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 16px;
    padding: 14px;
    text-align: right;
    display: grid;
    gap: 8px;
}
.role-chip span {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.role-chip strong { font-size: 14px; }
.role-chip small { color: var(--muted); line-height: 1.8; }
.page-hero {
    padding: 22px;
    margin-bottom: 18px;
    display: flex;
    justify-content: space-between;
    gap: 16px;
}
.hero-actions, .settings-tabs, .permission-chip-grid { display: flex; gap: 8px; flex-wrap: wrap; }
.status-pill, .permission-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 11px;
    border-radius: 999px;
    background: #f2f2f6;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.status-pill.info, .permission-chip.strong { background: var(--info-soft); color: var(--info); }
.status-pill.neutral { background: #f2f2f6; color: var(--muted); }
.settings-tabs { margin-bottom: 18px; }
.settings-tab, .settings-tabs a {
    display: grid;
    gap: 4px;
    min-width: 180px;
    padding: 11px 14px;
    border-radius: 14px;
    background: var(--surface);
    border: 1px solid var(--line);
    font-size: 13px;
}
.settings-tab.active, .settings-tabs a.active { background: var(--primary-soft); color: var(--primary); border-color: rgba(108,71,255,.22); }
.settings-tab small { color: var(--muted); font-size: 11px; line-height: 1.7; }
.role-management-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 16px; }
.role-card, .info-card { padding: 20px; }
.role-card-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.role-card p { color: var(--muted); line-height: 1.9; }
.role-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; margin: 12px 0; }
.role-meta-grid span { background: var(--surface-soft); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; font-size: 12px; }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.section-head h2 { margin: 0; font-size: 18px; }
.section-head p { margin: 6px 0 0; color: var(--muted); line-height: 1.8; }
.table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 16px; }
.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th, .data-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: right; }
.data-table thead th { background: var(--surface-soft); color: var(--muted); font-weight: 900; }

@media (max-width: 1360px) {
    .pm-workspace { grid-template-columns: 1fr; }
    .pm-agenda-panel { position: static; }
    .agenda-card { min-height: unset; }
}
@media (max-width: 1180px) {
    .kanban-board { grid-template-columns: 1fr; }
    .pm-stats-row { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .role-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .mobile-only { display: inline-flex; }
    .sidebar {
        transform: translateX(calc(100% + 24px));
        transition: transform .22s ease;
        box-shadow: var(--shadow);
    }
    .sidebar.open { transform: translateX(0); }
    .content-shell { padding-inline-start: 0; }
    .topbar { padding: 0 16px; }
    .search-box { width: 100%; }
    .topbar { flex-wrap: wrap; height: auto; padding-block: 12px; }
    .topbar-actions { width: 100%; margin-inline-start: 0; flex-wrap: wrap; }
    .role-switcher, .role-switcher select { width: 100%; }
    .main-content { padding: 24px 16px; }
    .pm-hero, .pm-toolbar, .page-hero { flex-direction: column; align-items: stretch; }
    .pm-team-box { padding-top: 0; }
    .role-management-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .pm-stats-row, .role-grid, .role-meta-grid { grid-template-columns: 1fr; }
    .role-form { grid-template-columns: 1fr; }
    .pm-title-row h1 { font-size: 30px; }
    .project-task-card footer { flex-direction: column; align-items: flex-start; }
    .task-meta-icons { justify-content: flex-start; }
}

/* Phase 1.3 UX refinement for Mahyapardaz project-control dashboard */
.sidebar {
    padding: 18px 14px;
    overflow: hidden;
}
.sidebar-head {
    padding-bottom: 14px;
    margin-bottom: 6px;
}
.sidebar-head strong { font-size: 15px; }
.sidebar-head span { font-size: 11px; }
.nav-list {
    max-height: none;
    overflow: visible;
    padding-bottom: 10px;
    border-bottom: 0;
    gap: 3px;
}
.nav-item {
    min-height: 36px;
    border-radius: 12px;
    padding: 0 9px;
    gap: 9px;
    font-size: 13px;
}
.nav-icon {
    width: 24px;
    height: 24px;
    font-size: 13px;
}
.nav-item em {
    min-width: 20px;
    height: 20px;
    font-size: 10px;
}
.compact-footer {
    padding: 12px;
    border-radius: 18px;
    line-height: 1.7;
}
.compact-footer p { margin: 4px 0 0; }
.main-content {
    padding: 22px 38px 28px;
}
.control-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.control-title {
    min-width: 0;
}
.page-kicker {
    display: block;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
    margin-bottom: 4px;
}
.control-header h1 {
    margin: 0;
    font-size: clamp(24px, 2.4vw, 32px);
    letter-spacing: -.03em;
    line-height: 1.25;
}
.control-header p {
    margin: 5px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.7;
}
.control-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.control-chip {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
}
.control-chip.muted {
    color: var(--muted);
    background: var(--surface);
    border: 1px solid var(--line);
}
.executive-strip {
    display: grid;
    grid-template-columns: minmax(260px, .65fr) minmax(0, 1.35fr);
    gap: 12px;
    margin-bottom: 14px;
}
.priority-summary,
.compact-metrics article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 10px 26px rgba(27,28,52,.03);
}
.priority-summary {
    padding: 16px 18px;
    border-inline-start: 4px solid var(--danger);
}
.priority-summary span,
.compact-metrics small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.priority-summary strong {
    display: block;
    margin-top: 6px;
    font-size: 18px;
}
.priority-summary p {
    margin: 7px 0 0;
    color: var(--muted);
    line-height: 1.8;
    font-size: 12px;
}
.compact-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 12px;
}
.compact-metrics article {
    padding: 14px 16px;
}
.compact-metrics strong {
    display: block;
    margin: 5px 0 2px;
    font-size: 24px;
    line-height: 1.1;
}
.compact-metrics span {
    color: var(--soft-text);
    font-size: 11px;
    line-height: 1.6;
}
.operations-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.operations-toolbar > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.toolbar-button {
    min-height: 36px;
    border: 1px solid var(--line-strong);
    border-radius: 11px;
    background: var(--surface);
    padding: 0 12px;
    color: #6f6b80;
    font-size: 12px;
    font-weight: 800;
}
.toolbar-button.active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.project-ops-layout {
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 18px;
}
.project-control-board {
    gap: 12px;
}
.kanban-column {
    padding: 14px;
    border: 1px solid var(--line);
}
.kanban-column.blocked > header { border-color: var(--primary); }
.kanban-column.running > header { border-color: var(--warning); }
.kanban-column.delivery > header { border-color: var(--success); }
.kanban-column > header {
    margin-bottom: 12px;
    padding-bottom: 10px;
}
.kanban-column header button { display: none; }
.kanban-card-list { gap: 12px; }
.project-task-card {
    padding: 14px;
}
.project-task-card h3 {
    margin: 10px 0 5px;
    font-size: 16px;
}
.project-task-card p {
    margin-bottom: 12px;
    min-height: 42px;
}
.delay-text {
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}
.project-facts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 12px;
}
.project-facts div {
    background: #f6f6f8;
    border-radius: 12px;
    padding: 9px 10px;
}
.project-facts small {
    display: block;
    color: var(--soft-text);
    font-size: 10px;
    margin-bottom: 4px;
}
.project-facts strong {
    display: block;
    color: #403b50;
    font-size: 11px;
    line-height: 1.7;
}
.compact-agenda {
    top: 88px;
}
.compact-agenda .agenda-card {
    min-height: unset;
    padding: 18px 16px;
    border-radius: 22px;
    background: #fbf8f4;
}
.compact-agenda .agenda-card > header {
    margin-bottom: 16px;
}
.compact-agenda .agenda-card h2 {
    font-size: 17px;
}
.agenda-count {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border-radius: 11px;
    background: #fff;
    color: var(--primary);
    font-weight: 900;
}
.compact-agenda .agenda-section {
    gap: 9px;
    margin-bottom: 18px;
}
.compact-agenda .last-section { margin-bottom: 0; }
.compact-agenda .agenda-item {
    grid-template-columns: 42px 1fr;
    gap: 10px;
}
.compact-agenda .agenda-item p {
    font-size: 12px;
}
.project-dock {
    position: fixed;
    inset-inline-end: calc(var(--sidebar-width) + 24px);
    bottom: 22px;
    z-index: 95;
}
.project-dock-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    background: var(--primary);
    color: #fff;
    box-shadow: 0 16px 34px rgba(108,71,255,.24);
    font-size: 13px;
    font-weight: 900;
    cursor: pointer;
}
.project-dock-panel {
    position: absolute;
    bottom: calc(100% + 12px);
    inset-inline-end: 0;
    width: min(430px, calc(100vw - var(--sidebar-width) - 60px));
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 24px 60px rgba(27,28,52,.12);
    border-radius: 22px;
    padding: 14px;
    display: none;
}
.project-dock input:checked ~ .project-dock-panel { display: block; }
.project-dock-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.project-dock-head strong { font-size: 15px; }
.project-dock-head label {
    width: 30px;
    height: 30px;
    border-radius: 10px;
    background: #f6f6f8;
    display: inline-grid;
    place-items: center;
    cursor: pointer;
}
.project-dock-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 8px;
}
.dock-project {
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
    border-radius: 14px;
    padding: 10px;
}
.dock-project > span {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    flex: 0 0 auto;
}
.dock-project strong {
    display: block;
    font-size: 12px;
    line-height: 1.5;
}
.dock-project small {
    color: var(--muted);
    font-size: 11px;
}
.dock-project em {
    margin-inline-start: auto;
    font-style: normal;
    color: var(--muted);
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}
.dock-project.critical > span { background: var(--danger-soft); color: var(--danger); }
.dock-project.warning > span { background: var(--warning-soft); color: var(--warning); }
.dock-project.active > span { background: var(--info-soft); color: var(--info); }
.dock-project.near > span { background: var(--success-soft); color: var(--success); }

@media (max-width: 1360px) {
    .project-ops-layout { grid-template-columns: 1fr; }
    .compact-agenda { position: static; }
}
@media (max-width: 1180px) {
    .executive-strip { grid-template-columns: 1fr; }
    .compact-metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .sidebar { overflow: auto; }
    .control-header,
    .operations-toolbar { flex-direction: column; align-items: stretch; }
    .control-actions { justify-content: flex-start; }
    .project-dock { inset-inline-end: 16px; bottom: 16px; }
    .project-dock-panel { width: calc(100vw - 32px); }
}
@media (max-width: 640px) {
    .compact-metrics,
    .project-facts,
    .project-dock-list { grid-template-columns: 1fr; }
}

/* Phase 1.3 dashboard UX fix: separate today workbench + multi view project status */
.ops-command-strip {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(270px, 360px);
    gap: 12px;
    align-items: stretch;
    margin-bottom: 12px;
}
.ops-command-title,
.ops-command-alert,
.today-ops-panel,
.project-status-module,
.insight-card,
.ops-metric-row article {
    background: var(--surface);
    border: 1px solid var(--line);
    box-shadow: 0 10px 26px rgba(27,28,52,.03);
}
.ops-command-title,
.ops-command-alert {
    border-radius: 18px;
    padding: 14px 18px;
}
.ops-command-title span,
.ops-command-alert span {
    display: block;
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    margin-bottom: 4px;
}
.ops-command-title strong {
    display: block;
    font-size: 22px;
    line-height: 1.35;
    letter-spacing: -.02em;
}
.ops-command-title small,
.ops-command-alert small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    line-height: 1.7;
}
.ops-command-alert {
    border-inline-start: 4px solid var(--danger);
}
.ops-command-alert strong {
    display: block;
    font-size: 17px;
    line-height: 1.5;
}
.ops-metric-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.ops-metric-row article {
    border-radius: 16px;
    padding: 13px 14px;
}
.ops-metric-row span {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}
.ops-metric-row strong {
    display: block;
    margin: 4px 0 2px;
    font-size: 24px;
    line-height: 1.1;
}
.ops-metric-row small {
    display: block;
    color: var(--soft-text);
    font-size: 11px;
    line-height: 1.6;
}
.today-ops-panel {
    position: relative;
    z-index: 1;
    border-radius: 18px;
    padding: 14px;
    margin-bottom: 12px;
    background: #fffdfa;
}
.today-ops-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.today-ops-head strong {
    display: block;
    font-size: 16px;
}
.today-ops-head small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.7;
}
.today-ops-head > span {
    min-width: 34px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    font-size: 12px;
}
.today-ops-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 9px;
}
.today-action {
    display: grid;
    grid-template-columns: 52px minmax(0,1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 11px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    color: var(--primary);
    min-height: 74px;
}
.today-action time {
    font-size: 12px;
    font-weight: 900;
    color: currentColor;
    text-align: center;
}
.today-action div {
    border-inline-start: 3px solid currentColor;
    padding-inline-start: 10px;
    min-width: 0;
}
.today-action span {
    display: block;
    color: var(--muted);
    font-size: 10px;
    font-weight: 800;
    margin-bottom: 3px;
}
.today-action strong {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--text);
    font-size: 12px;
    line-height: 1.75;
}
.today-action.danger { color: var(--danger); }
.today-action.warning { color: var(--warning); }
.today-action.success { color: var(--success); }
.today-action.info { color: var(--info); }
.project-status-module {
    border-radius: 20px;
    padding: 16px;
    margin-bottom: 12px;
    overflow: hidden;
}
.project-status-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}
.project-status-head strong {
    display: block;
    font-size: 17px;
}
.project-status-head small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    line-height: 1.7;
}
.project-view-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px;
    background: #f4f3f8;
    border: 1px solid var(--line);
    border-radius: 13px;
    flex: 0 0 auto;
}
.project-view-controls button {
    width: 36px;
    height: 34px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: #6f6b80;
    font-weight: 900;
}
.project-view-controls button.active {
    background: var(--primary);
    color: #fff;
    box-shadow: 0 10px 22px rgba(108,71,255,.18);
}
.project-filter-row {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.project-view-pane { display: none; }
.project-view-pane.active { display: block; }
.project-status-module .project-control-board {
    display: grid;
    grid-template-columns: repeat(3, minmax(230px, 1fr));
    gap: 12px;
}
.project-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
}
.project-summary-card {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-soft);
    padding: 14px;
}
.project-summary-head {
    display: flex;
    align-items: center;
    gap: 10px;
}
.project-summary-head > span,
.project-list-main > span {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    flex: 0 0 auto;
}
.project-summary-head strong,
.project-list-main strong {
    display: block;
    font-size: 14px;
    line-height: 1.5;
}
.project-summary-head small,
.project-list-main small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}
.project-summary-head em {
    margin-inline-start: auto;
    font-style: normal;
    font-size: 11px;
    font-weight: 900;
    color: var(--muted);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 4px 8px;
    white-space: nowrap;
}
.project-summary-card p {
    margin: 12px 0;
    color: #514b61;
    font-size: 12px;
    line-height: 1.9;
    min-height: 44px;
}
.project-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    color: var(--muted);
    font-size: 11px;
}
.project-card-foot strong {
    color: #403b50;
    font-size: 11px;
    line-height: 1.6;
}
.project-list-view {
    display: grid;
    gap: 8px;
}
.project-list-row {
    display: grid;
    grid-template-columns: minmax(240px, 1.2fr) minmax(130px, .55fr) minmax(190px, .9fr) minmax(170px, .75fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface-soft);
}
.project-list-main {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.project-list-progress strong {
    display: block;
    font-size: 13px;
    margin-bottom: 5px;
}
.project-list-info small {
    display: block;
    color: var(--soft-text);
    font-size: 10px;
    margin-bottom: 3px;
}
.project-list-info strong {
    display: block;
    font-size: 12px;
    color: #403b50;
    line-height: 1.7;
}
.project-list-row > em {
    font-style: normal;
    white-space: nowrap;
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    padding: 5px 9px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
}
.project-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 16px;
}
.project-status-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 920px;
    background: #fff;
    font-size: 12px;
}
.project-status-table th,
.project-status-table td {
    padding: 12px 13px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    vertical-align: middle;
}
.project-status-table th {
    background: #f7f7fa;
    color: var(--muted);
    font-weight: 900;
}
.project-status-table td strong {
    display: block;
    font-size: 13px;
    line-height: 1.7;
}
.project-status-table td small {
    display: block;
    color: var(--muted);
    line-height: 1.6;
}
.table-progress-text {
    display: block;
    font-weight: 900;
    margin-bottom: 5px;
}
.bottom-insight-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
    margin-bottom: 68px;
}
.insight-card {
    border-radius: 18px;
    padding: 14px;
}
.insight-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
}
.insight-card header strong { font-size: 15px; }
.insight-card header span {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border-radius: 10px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
/* neutralize old sticky agenda layout on this dashboard */
.project-ops-layout,
.pm-agenda-panel,
.compact-agenda {
    position: static !important;
    display: block;
    top: auto;
}
@media (max-width: 1380px) {
    .today-ops-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .project-card-grid,
    .project-status-module .project-control-board { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .project-list-row { grid-template-columns: minmax(220px,1fr) minmax(120px,.5fr) minmax(180px,.8fr) auto; }
    .project-list-row .project-list-info:nth-of-type(4) { display: none; }
}
@media (max-width: 1180px) {
    .ops-command-strip { grid-template-columns: 1fr; }
    .ops-metric-row { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .today-ops-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .project-status-head,
    .today-ops-head { flex-direction: column; align-items: stretch; }
    .project-view-controls { align-self: flex-start; }
    .ops-metric-row,
    .today-ops-grid,
    .project-card-grid,
    .project-status-module .project-control-board,
    .bottom-insight-grid { grid-template-columns: 1fr; }
    .project-list-row { grid-template-columns: 1fr; }
}

/* Phase 1.4 refinements */
.ops-metric-row-first { margin-top: 4px; }
.dashboard-section-flat { position: relative; z-index: 1; }
.today-ops-panel { margin-bottom: 16px; }
.today-ops-grid { align-items: stretch; }
.project-dock { display: none !important; }
.ops-command-strip { display: none !important; }

.project-card-actions,
.project-list-actions,
.table-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.project-list-actions { margin-top: 0; justify-content: flex-end; }
.checklist-open-btn,
.project-card-actions a,
.project-list-actions a,
.table-actions a {
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--text);
    border-radius: 12px;
    padding: 8px 12px;
    font-size: 12px;
    font-weight: 800;
    box-shadow: var(--shadow-sm);
}
.checklist-open-btn:hover,
.checklist-open-btn.active,
.project-card-actions a:hover,
.project-list-actions a:hover,
.table-actions a:hover {
    border-color: rgba(79,70,229,.22);
    background: var(--primary-soft);
    color: var(--primary);
}
.checklist-open-btn.small { padding: 7px 9px; }
.project-checklist-panel {
    display: none;
    margin-top: 12px;
    padding: 12px;
    border-radius: 16px;
    border: 1px dashed var(--line-strong);
    background: #fff;
    gap: 10px;
}
.project-checklist-panel.open { display: grid; }
.project-list-row .project-checklist-panel {
    grid-column: 1 / -1;
    width: 100%;
}
.table-checklist-row td { padding-top: 0 !important; border-bottom: 0 !important; }
.table-checklist-row .project-checklist-panel { margin: 0; }
.checklist-group-card {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 12px;
    display: grid;
    gap: 8px;
}
.checklist-group-card.compact { padding: 10px; }
.checklist-group-card.detail { background: #fff; padding: 16px; }
.checklist-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.checklist-group-head strong { font-size: 13px; }
.checklist-group-head span {
    font-size: 12px;
    color: var(--primary);
    font-weight: 900;
    background: var(--primary-soft);
    border-radius: 999px;
    padding: 4px 9px;
}
.checklist-item-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 8px 0;
    border-top: 1px solid var(--line);
}
.checklist-item-row span {
    width: 10px;
    height: 10px;
    border-radius: 99px;
    background: var(--muted);
}
.checklist-item-row strong { font-size: 12px; color: var(--text); }
.checklist-item-row small { font-size: 11px; color: var(--muted); text-align: left; }
.checklist-item-row.done span { background: var(--success); }
.checklist-item-row.ready span { background: var(--info); }
.checklist-item-row.pending span { background: var(--warning); }
.checklist-item-row.blocked span,
.checklist-item-row.locked span { background: var(--danger); }

.projects-page-shell,
.project-detail-shell { display: grid; gap: 16px; }
.projects-toolbar {
    padding: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.projects-toolbar strong { display: block; font-size: 20px; }
.projects-toolbar small { display: block; color: var(--muted); margin-top: 6px; }
.projects-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.projects-toolbar-actions input,
.projects-toolbar-actions select {
    height: 42px;
    border-radius: 13px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 12px;
    outline: none;
}
.projects-summary-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}
.projects-summary-row article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px 16px;
    box-shadow: var(--shadow-sm);
}
.projects-summary-row span { display: block; color: var(--muted); font-size: 12px; }
.projects-summary-row strong { display: block; font-size: 24px; margin-top: 6px; }
.projects-master-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.project-master-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 16px;
    box-shadow: var(--shadow-sm);
}
.project-master-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.project-master-head > span,
.project-detail-title > span {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.project-master-head div { flex: 1; }
.project-master-head strong { display: block; font-size: 16px; }
.project-master-head small { color: var(--muted); }
.project-master-head em {
    font-style: normal;
    font-size: 12px;
    font-weight: 800;
    background: var(--surface-3);
    border-radius: 999px;
    padding: 5px 10px;
}
.project-master-body {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.project-master-body div {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 10px;
}
.project-master-body small { display: block; color: var(--muted); font-size: 11px; }
.project-master-body strong { font-size: 12px; line-height: 1.8; }
.project-detail-hero {
    padding: 18px;
    display: grid;
    grid-template-columns: minmax(260px, .7fr) 1fr;
    gap: 16px;
    align-items: center;
}
.project-detail-title {
    display: flex;
    align-items: center;
    gap: 12px;
}
.project-detail-title strong { display: block; font-size: 22px; }
.project-detail-title small { color: var(--muted); }
.project-detail-meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
}
.project-detail-meta div,
.detail-info-grid div,
.finance-state-box {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
    background: var(--surface-2);
}
.project-detail-meta span,
.detail-info-grid span { display: block; color: var(--muted); font-size: 11px; margin-bottom: 5px; }
.project-detail-meta strong,
.detail-info-grid strong { font-size: 13px; line-height: 1.8; }
.project-tabs {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px;
    position: sticky;
    top: 70px;
    z-index: 8;
}
.project-tabs a {
    padding: 9px 13px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 800;
}
.project-tabs a.active,
.project-tabs a:hover { background: var(--primary-soft); color: var(--primary); }
.project-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px;
}
.project-detail-card { padding: 18px; }
.project-detail-card.full { grid-column: 1 / -1; }
.project-detail-card header { margin-bottom: 14px; }
.project-detail-card header strong { display: block; font-size: 17px; }
.project-detail-card header small { display: block; color: var(--muted); margin-top: 5px; }
.detail-info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
}
.detail-info-grid.two { grid-template-columns: repeat(2, minmax(0,1fr)); }
.card-progress-row.big { margin-top: 14px; }
.task-products.wide { margin-top: 12px; }
.project-checklist-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 12px;
}
.simple-list,
.alert-chip-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.simple-list span,
.alert-chip-list span {
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--surface-3);
    font-size: 12px;
    font-weight: 800;
}
.alert-chip-list span { background: var(--warning-soft); color: var(--warning); }
.finance-state-box { display: grid; gap: 6px; }
.finance-state-box span { color: var(--primary); font-weight: 900; }
.finance-state-box strong { font-size: 20px; }
.finance-state-box small { color: var(--muted); }

@media (max-width: 1200px) {
    .projects-summary-row { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .project-detail-hero,
    .project-detail-grid { grid-template-columns: 1fr; }
    .project-detail-meta,
    .detail-info-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
    .projects-toolbar { flex-direction: column; align-items: stretch; }
    .projects-toolbar-actions input,
    .projects-toolbar-actions select { width: 100%; }
    .projects-summary-row,
    .projects-master-grid,
    .project-master-body,
    .project-checklist-detail-grid,
    .project-detail-meta,
    .detail-info-grid,
    .detail-info-grid.two { grid-template-columns: 1fr; }
}

/* Phase 1.5 refinements */
.project-filter-row {
    justify-content: center !important;
    align-items: center;
    text-align: center;
}
.project-filter-row .toolbar-button.active {
    margin-inline: 0;
}
.project-card-actions a,
.table-actions a,
.project-list-actions a {
    white-space: nowrap;
}
.project-detail-action-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 10px 0 0;
}
.wizard-page-shell {
    display: grid;
    gap: 16px;
}
.wizard-topbar {
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.wizard-project-title {
    display: flex;
    align-items: center;
    gap: 12px;
}
.wizard-project-title > span {
    width: 46px;
    height: 46px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.wizard-project-title strong { display: block; font-size: 17px; }
.wizard-project-title small { color: var(--muted); font-size: 12px; }
.wizard-top-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.wizard-metric-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.wizard-metric-row article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 14px 16px;
    min-height: 96px;
    box-shadow: var(--shadow-sm);
}
.wizard-metric-row span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 7px;
}
.wizard-metric-row strong {
    display: block;
    font-size: 22px;
    line-height: 1.4;
}
.wizard-metric-row small { color: var(--muted); font-size: 12px; }
.wizard-progress-card,
.wizard-finance-card,
.wizard-checklist-snapshot {
    padding: 18px;
}
.wizard-state-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.wizard-state-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.wizard-state-legend span::before {
    content: '';
    width: 8px;
    height: 8px;
    border-radius: 99px;
    background: currentColor;
}
.wizard-state-legend .done { color: #159447; background: #edfdf3; }
.wizard-state-legend .current { color: #d97706; background: #fff7ed; }
.wizard-state-legend .future { color: #667085; background: #f2f4f7; }
.wizard-state-legend .delayed { color: #dc2626; background: #fef2f2; }
.wizard-state-legend .waiting-client { color: #b7791f; background: #fffbeb; }
.wizard-state-legend .decision { color: #7c3aed; background: #f5f3ff; }
.wizard-state-legend .near { color: #2563eb; background: #eff6ff; }
.project-wizard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.wizard-step-card {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    padding: 14px;
    min-height: 154px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-2);
}
.wizard-step-number {
    width: 32px;
    height: 32px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--muted);
    font-weight: 900;
    font-size: 12px;
}
.wizard-step-body { min-width: 0; display: grid; align-content: start; gap: 8px; }
.wizard-step-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 8px;
}
.wizard-step-head strong { font-size: 14px; line-height: 1.7; }
.wizard-step-head span {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: 999px;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.wizard-step-card p {
    margin: 0;
    color: #475467;
    line-height: 1.85;
    font-size: 12px;
}
.wizard-step-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: auto;
}
.wizard-step-meta small { color: var(--muted); font-size: 11px; }
.wizard-step-meta em {
    font-style: normal;
    color: var(--primary);
    background: var(--primary-soft);
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 11px;
    font-weight: 800;
}
.wizard-step-card.done { border-color: rgba(21,148,71,.22); background: #fbfffd; }
.wizard-step-card.done .wizard-step-number { background: #edfdf3; color: #159447; }
.wizard-step-card.current { border-color: rgba(217,119,6,.25); background: #fffbf6; }
.wizard-step-card.current .wizard-step-number { background: #fff7ed; color: #d97706; }
.wizard-step-card.future { opacity: .74; }
.wizard-step-card.delayed { border-color: rgba(220,38,38,.28); background: #fffafa; }
.wizard-step-card.delayed .wizard-step-number { background: #fef2f2; color: #dc2626; }
.wizard-step-card.waiting-client { border-color: rgba(183,121,31,.28); background: #fffdf6; }
.wizard-step-card.waiting-client .wizard-step-number { background: #fffbeb; color: #b7791f; }
.wizard-step-card.decision { border-color: rgba(124,58,237,.26); background: #fcfbff; }
.wizard-step-card.decision .wizard-step-number { background: #f5f3ff; color: #7c3aed; }
.wizard-step-card.near { border-color: rgba(37,99,235,.24); background: #fbfdff; }
.wizard-step-card.near .wizard-step-number { background: #eff6ff; color: #2563eb; }
.wizard-bottom-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .85fr);
    gap: 16px;
}
.wizard-finance-list,
.wizard-checklist-list {
    display: grid;
    gap: 10px;
}
.wizard-finance-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px;
    background: var(--surface-2);
}
.finance-percent {
    width: 48px;
    height: 48px;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    border: 1px solid var(--line);
    font-weight: 900;
}
.wizard-finance-item strong { display: block; font-size: 14px; }
.wizard-finance-item small { color: var(--muted); font-size: 12px; }
.wizard-finance-item p { margin: 5px 0 0; color: #475467; font-size: 12px; line-height: 1.7; }
.wizard-finance-item > span {
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--surface);
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.wizard-finance-item.locked { color: #667085; }
.wizard-finance-item.near { color: #2563eb; }
.wizard-finance-item.ready { color: #159447; }
.wizard-finance-item.sent { color: #7c3aed; }
.wizard-finance-item.approved { color: #0f766e; }
.wizard-finance-item.received { color: #159447; }
.wizard-checklist-group {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 12px;
}
.wizard-checklist-group > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}
.wizard-checklist-group > div:first-child strong { font-size: 14px; }
.wizard-checklist-group > div:first-child span { color: var(--muted); font-size: 12px; font-weight: 800; }
@media (max-width: 1320px) {
    .project-wizard-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .wizard-metric-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
    .wizard-topbar, .wizard-step-head { flex-direction: column; align-items: stretch; }
    .project-wizard-grid, .wizard-bottom-grid, .wizard-metric-row { grid-template-columns: 1fr; }
    .wizard-finance-item { grid-template-columns: 1fr; }
}


/* Phase 1.6 refinements */
.toolbar-button,
.checklist-open-btn,
.project-card-actions a,
.project-card-actions button,
.table-actions a,
.table-actions button,
.project-list-actions a,
.project-list-actions button,
.wizard-top-actions a,
.workbench-task-actions button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    vertical-align: middle;
}
.toolbar-button {
    min-height: 40px;
    height: 40px;
    padding-block: 0 !important;
}
.project-filter-row .toolbar-button {
    min-width: 108px;
}
.today-ops-panel {
    position: relative !important;
    z-index: 0 !important;
    overflow: hidden;
    clear: both;
}
.today-ops-grid {
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
}
.project-status-module {
    position: relative;
    z-index: 1;
}
.project-status-head {
    align-items: center;
}
.project-view-controls button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.sidebar {
    overflow: hidden;
}
.nav-list {
    overflow: visible !important;
}
.compact-wizard-topbar {
    padding: 12px 14px !important;
}
.wizard-view-head {
    align-items: center;
}
.wizard-step-list {
    display: grid;
    gap: 10px;
}
.wizard-list-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) minmax(130px, auto) minmax(110px, auto) minmax(120px, auto);
    gap: 10px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 11px 12px;
}
.wizard-list-row strong {
    display: block;
    font-size: 14px;
}
.wizard-list-row small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
}
.wizard-list-row em,
.wizard-list-row b,
.wizard-list-row i {
    font-style: normal;
    font-size: 12px;
    font-weight: 800;
    color: var(--muted);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 6px 10px;
    text-align: center;
}
.wizard-list-row.done b,
.wizard-table-state.done,
.wizard-owner-step.done span { color: #159447; background: #edfdf3; }
.wizard-list-row.current b,
.wizard-table-state.current,
.wizard-owner-step.current span { color: #d97706; background: #fff7ed; }
.wizard-list-row.delayed b,
.wizard-table-state.delayed,
.wizard-owner-step.delayed span { color: #dc2626; background: #fef2f2; }
.wizard-list-row.waiting-client b,
.wizard-table-state.waiting-client,
.wizard-owner-step.waiting-client span { color: #b7791f; background: #fffbeb; }
.wizard-list-row.decision b,
.wizard-table-state.decision,
.wizard-owner-step.decision span { color: #7c3aed; background: #f5f3ff; }
.wizard-list-row.near b,
.wizard-table-state.near,
.wizard-owner-step.near span { color: #2563eb; background: #eff6ff; }
.wizard-table-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 800;
    background: var(--surface-3);
    color: var(--muted);
}
.wizard-owner-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.wizard-owner-card {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface-2);
    padding: 14px;
}
.wizard-owner-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.wizard-owner-card header strong { font-size: 14px; }
.wizard-owner-card header span {
    font-size: 11px;
    font-weight: 900;
    color: var(--primary);
    background: var(--primary-soft);
    border-radius: 999px;
    padding: 4px 8px;
}
.wizard-owner-step {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    padding: 9px 0;
    border-top: 1px solid var(--line);
}
.wizard-owner-step:first-of-type { border-top: 0; }
.wizard-owner-step > span {
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface);
    color: var(--muted);
    font-weight: 900;
    font-size: 11px;
}
.wizard-owner-step strong { display: block; font-size: 13px; }
.wizard-owner-step small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }

/* Workbench page */
.workbench-page-shell {
    display: grid;
    gap: 14px;
}
.workbench-top {
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.workbench-top span {
    display: block;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
    margin-bottom: 5px;
}
.workbench-top strong {
    display: block;
    font-size: 22px;
    line-height: 1.3;
}
.workbench-top small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    line-height: 1.7;
}
.workbench-user-box {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 220px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 10px;
}
.workbench-user-box strong { font-size: 14px; }
.workbench-user-box small { margin: 0; font-size: 12px; }
.workbench-summary-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.workbench-summary-row article {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface);
    padding: 13px 14px;
    box-shadow: 0 10px 26px rgba(27,28,52,.03);
}
.workbench-summary-row span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}
.workbench-summary-row strong {
    display: block;
    font-size: 24px;
    margin-top: 5px;
}
.workbench-summary-row .danger strong { color: var(--danger); }
.workbench-summary-row .warning strong { color: var(--warning); }
.workbench-summary-row .success strong { color: var(--success); }
.workbench-summary-row .purple strong { color: var(--primary); }
.workbench-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 14px;
    align-items: start;
}
.workbench-main {
    display: grid;
    gap: 14px;
}
.workbench-group {
    padding: 16px;
}
.workbench-group > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.workbench-group > header strong { display: block; font-size: 17px; }
.workbench-group > header small { display: block; color: var(--muted); line-height: 1.7; margin-top: 4px; }
.workbench-group > header > span {
    min-width: 34px;
    height: 32px;
    border-radius: 11px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.workbench-items {
    display: grid;
    gap: 9px;
}
.workbench-task {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 12px;
}
.task-status-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
}
.workbench-task.danger .task-status-dot { background: var(--danger); }
.workbench-task.warning .task-status-dot { background: var(--warning); }
.workbench-task.success .task-status-dot { background: var(--success); }
.workbench-task.purple .task-status-dot { background: var(--primary); }
.workbench-task-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 7px;
}
.workbench-task-title strong { font-size: 14px; }
.workbench-task-title em {
    font-style: normal;
    font-size: 11px;
    font-weight: 900;
    color: var(--danger);
    background: var(--danger-soft);
    border-radius: 999px;
    padding: 4px 8px;
}
.workbench-task-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.workbench-task-meta span {
    font-size: 11px;
    color: var(--muted);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 5px 8px;
}
.workbench-task-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}
.workbench-side {
    display: grid;
    gap: 14px;
}
.workbench-guide,
.workbench-projects-mini {
    padding: 16px;
}
.workbench-guide > strong,
.workbench-projects-mini > strong {
    display: block;
    font-size: 16px;
    margin-bottom: 10px;
}
.workbench-guide p {
    margin: 0 0 12px;
    color: var(--muted);
    line-height: 1.9;
}
.workbench-guide div {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.workbench-guide span {
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    border-radius: 999px;
    padding: 5px 8px;
}
.workbench-projects-mini {
    display: grid;
    gap: 8px;
}
.workbench-projects-mini a {
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 10px;
}
.workbench-projects-mini a > span {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
}
.workbench-projects-mini b {
    display: block;
    font-size: 13px;
}
.workbench-projects-mini small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    margin-top: 2px;
}
@media (max-width: 1200px) {
    .workbench-layout,
    .wizard-bottom-grid {
        grid-template-columns: 1fr;
    }
    .workbench-summary-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .wizard-owner-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .wizard-list-row {
        grid-template-columns: auto minmax(0, 1fr);
    }
    .wizard-list-row em,
    .wizard-list-row b,
    .wizard-list-row i {
        justify-self: start;
    }
}
@media (max-width: 760px) {
    .workbench-top,
    .workbench-task,
    .project-status-head,
    .wizard-view-head {
        flex-direction: column;
        align-items: stretch;
    }
    .workbench-task {
        display: grid;
        grid-template-columns: 1fr;
    }
    .workbench-summary-row,
    .wizard-owner-grid {
        grid-template-columns: 1fr;
    }
    .workbench-user-box {
        min-width: unset;
    }
}

.today-ops-head-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.today-ops-head-actions > span {
    min-width: 34px;
    height: 30px;
    display: inline-flex;
    place-items: center;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    font-size: 12px;
}

/* Phase 1.7 - Contracts, commitments and generated checklists - UX compact redesign */
.contract-shell-v2 {
    display: grid;
    gap: 14px;
}
.contract-compact-toolbar {
    padding: 14px 16px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
}
.contract-toolbar-title strong,
.compact-card-head strong {
    display: block;
    font-size: 16px;
    font-weight: 900;
}
.contract-toolbar-title small,
.compact-card-head small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.contract-toolbar-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.contract-local-search,
.compact-inline-search,
.contract-select-form select {
    height: 40px;
    border: 1px solid var(--line-strong);
    background: var(--surface);
    border-radius: 12px;
    padding: 0 12px;
    outline: none;
    color: var(--text);
    font-size: 12px;
    font-weight: 700;
}
.contract-local-search { min-width: 280px; }
.compact-inline-search { min-width: 210px; }
.contract-select-form select { min-width: 230px; }
.contract-local-search:focus,
.compact-inline-search:focus,
.contract-select-form select:focus {
    border-color: rgba(111, 79, 255, .34);
    box-shadow: 0 0 0 4px rgba(111, 79, 255, .08);
}
.contract-kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.contract-kpi-strip article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 17px;
    padding: 12px 14px;
    min-height: 86px;
    display: grid;
    align-content: center;
    gap: 4px;
    box-shadow: 0 12px 26px rgba(27, 28, 52, .025);
}
.contract-kpi-strip span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}
.contract-kpi-strip strong {
    font-size: 24px;
    line-height: 1.1;
}
.contract-kpi-strip small {
    color: var(--muted);
    font-size: 11px;
}
.contract-kpi-strip article.warning strong { color: var(--warning); }
.contract-layout-v2 {
    display: grid;
    grid-template-columns: minmax(380px, .92fr) minmax(0, 1.08fr);
    gap: 14px;
    align-items: start;
}
.contract-list-panel,
.contract-inspector-panel,
.compact-contract-card,
.contract-data-section,
.contract-collapsible-section {
    padding: 16px;
}
.compact-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.compact-card-head.with-action {
    align-items: center;
}
.contract-list-table-wrap,
.responsive-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fff;
}
.contract-list-table,
.dense-data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.contract-list-table th,
.contract-list-table td,
.dense-data-table th,
.dense-data-table td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    vertical-align: middle;
}
.contract-list-table thead th,
.dense-data-table thead th {
    background: var(--surface-2);
    color: var(--muted);
    font-weight: 900;
    white-space: nowrap;
}
.contract-list-table tbody tr:hover,
.dense-data-table tbody tr:hover {
    background: rgba(111, 79, 255, .035);
}
.contract-list-table tr.selected {
    background: var(--primary-soft);
}
.contract-list-table td strong,
.dense-data-table td strong {
    display: block;
    font-size: 13px;
    line-height: 1.6;
}
.contract-list-table td small,
.dense-data-table td small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}
.mini-action-link {
    height: 32px;
    min-width: 70px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #fff;
    border: 1px solid var(--line-strong);
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
}
.contract-inspector-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.contract-inspector-head h2 {
    margin: 8px 0 3px;
    font-size: 22px;
    letter-spacing: -.02em;
}
.contract-inspector-head p {
    margin: 0;
    color: var(--muted);
    line-height: 1.8;
}
.contract-inspector-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.contract-info-compact-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 12px;
}
.contract-info-compact-grid div {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 13px;
    padding: 10px 11px;
    min-height: 68px;
    display: grid;
    align-content: center;
    gap: 3px;
}
.contract-info-compact-grid span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}
.contract-info-compact-grid strong {
    font-size: 13px;
    line-height: 1.6;
}
.contract-products-compact,
.mini-token-list,
.mini-missing-list {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
}
.contract-products-compact span,
.mini-token-list span,
.mini-missing-list span {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 999px;
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
}
.contract-products-compact span,
.mini-token-list span {
    background: var(--primary-soft);
    color: var(--primary);
    border-color: rgba(111, 79, 255, .16);
}
.mini-missing-list span {
    background: var(--warning-soft);
    color: var(--warning);
    border-color: rgba(245, 158, 11, .18);
}
.mini-token-list em {
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}
.contract-summary-grid-v2 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.compact-contract-card {
    min-height: 148px;
}
.mini-checklist-list {
    display: grid;
    gap: 7px;
}
.mini-checklist-list div {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 34px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 12px;
    padding: 6px 9px;
}
.mini-checklist-list i {
    width: 22px;
    height: 22px;
    border-radius: 8px;
    background: var(--success-soft);
    color: var(--success);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-style: normal;
    font-weight: 900;
}
.mini-checklist-list span {
    font-size: 12px;
    font-weight: 800;
}
.dense-data-table.wide { min-width: 1120px; }
.dense-data-table td {
    color: #475467;
    line-height: 1.8;
}
.compact-empty {
    padding: 18px;
    margin: 0;
}
.financial-compact-timeline {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.financial-compact-timeline article {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 15px;
    padding: 12px;
    min-height: 132px;
    position: relative;
}
.financial-compact-timeline article::before {
    content: '';
    position: absolute;
    inset-inline-start: 12px;
    top: 12px;
    bottom: 12px;
    width: 3px;
    border-radius: 99px;
    background: var(--primary);
    opacity: .22;
}
.financial-compact-timeline strong {
    display: block;
    font-size: 13px;
    margin-bottom: 8px;
}
.financial-compact-timeline span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    padding: 0 9px;
    font-size: 12px;
    font-weight: 900;
}
.financial-compact-timeline small {
    display: inline-flex;
    align-items: center;
    margin-inline-start: 4px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.financial-compact-timeline p {
    color: #475467;
    font-size: 12px;
    line-height: 1.8;
    margin: 9px 0 0;
}
.contract-collapsible-section {
    border: 1px solid var(--line);
}
.contract-collapsible-section summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 48px;
}
.contract-collapsible-section summary::-webkit-details-marker { display: none; }
.contract-collapsible-section summary::after {
    content: '+';
    width: 28px;
    height: 28px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    flex: 0 0 auto;
}
.contract-collapsible-section[open] summary::after { content: '−'; }
.contract-collapsible-section summary span {
    font-weight: 900;
    font-size: 16px;
}
.contract-collapsible-section summary small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.collapsible-body {
    border-top: 1px solid var(--line);
    margin-top: 12px;
    padding-top: 12px;
    display: grid;
    gap: 12px;
}
.detail-actions { margin-top: 12px; }
.status-pill.neutral { background: var(--surface-3); color: var(--muted); }

@media (max-width: 1280px) {
    .contract-layout-v2 { grid-template-columns: 1fr; }
    .contract-summary-grid-v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .financial-compact-timeline { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
    .contract-compact-toolbar { grid-template-columns: 1fr; }
    .contract-toolbar-actions { justify-content: stretch; }
    .contract-local-search,
    .compact-inline-search,
    .contract-select-form,
    .contract-select-form select,
    .contract-toolbar-actions .toolbar-button { width: 100%; min-width: 0; }
    .contract-kpi-strip,
    .contract-info-compact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .financial-compact-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .contract-kpi-strip,
    .contract-summary-grid-v2,
    .contract-info-compact-grid,
    .financial-compact-timeline { grid-template-columns: 1fr; }
    .contract-inspector-head,
    .compact-card-head.with-action,
    .contract-collapsible-section summary { flex-direction: column; align-items: stretch; }
    .contract-inspector-actions { justify-content: flex-start; }
}


/* Phase 1.7 UX revision: wide contract list + contract detail page */
.toolbar-button,
.mini-action-link,
.project-card-actions a,
.table-actions a,
.project-list-actions a,
.view-mode-btn,
.icon-button,
.profile-button,
.status-pill,
.table-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.contracts-master-shell {
    display: grid;
    gap: 14px;
}
.contracts-master-toolbar {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.contracts-master-toolbar strong {
    display: block;
    font-size: 18px;
    font-weight: 900;
}
.contracts-master-toolbar small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.contracts-master-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.contract-kpi-strip.compact article {
    min-height: 76px;
}
.contracts-master-list-card {
    padding: 16px;
    width: 100%;
}
.contracts-wide-table-wrap {
    width: 100%;
}
.contracts-wide-table {
    min-width: 1180px;
}
.contracts-wide-table td,
.contracts-wide-table th {
    vertical-align: middle;
}
.table-token-list {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    min-width: 190px;
}
.table-token-list span,
.table-token-list em {
    min-height: 24px;
    border-radius: 999px;
    padding: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    font-style: normal;
    white-space: nowrap;
}
.table-token-list em {
    background: var(--surface-3);
    color: var(--muted);
}
.table-count-badge {
    width: 30px;
    height: 30px;
    border-radius: 11px;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 12px;
    font-weight: 900;
}
.table-count-badge.info {
    background: var(--info-soft);
    color: var(--info);
}
.table-count-badge.warning {
    background: var(--warning-soft);
    color: var(--warning);
}
.table-action-row {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
}
.mini-action-link.primary {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.contract-detail-shell {
    display: grid;
    gap: 16px;
}
.contract-detail-hero {
    grid-template-columns: minmax(260px, .65fr) auto minmax(520px, 1fr);
}
.contract-detail-actions-top {
    margin: 0;
    justify-content: center;
}
.contract-detail-grid {
    align-items: start;
}
.detail-products {
    margin-top: 12px;
}
.stacked-list {
    display: grid;
    gap: 8px;
}
.stacked-list span {
    border-radius: 13px;
    width: 100%;
    justify-content: flex-start;
    min-height: 38px;
}
.detail-checklist-list {
    gap: 8px;
}
.detail-checklist-list div {
    min-height: 42px;
}
.detail-missing-list {
    display: grid;
    gap: 8px;
}
.detail-missing-list span,
.detail-missing-list em {
    min-height: 38px;
    border-radius: 13px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: var(--warning-soft);
    color: var(--warning);
    border: 1px solid rgba(245, 158, 11, .16);
    font-style: normal;
    font-size: 12px;
    font-weight: 900;
}
.detail-financial-timeline article {
    min-height: 118px;
}
.contract-collapsible-section.project-detail-card {
    padding: 16px;
}

@media (max-width: 1400px) {
    .contract-detail-hero { grid-template-columns: 1fr; }
    .contract-detail-actions-top { justify-content: flex-start; }
}
@media (max-width: 980px) {
    .contracts-master-toolbar { flex-direction: column; align-items: stretch; }
    .contracts-master-actions,
    .contracts-master-actions .contract-local-search,
    .contracts-master-actions .toolbar-button { width: 100%; min-width: 0; }
    .table-action-row { flex-wrap: wrap; }
}

/* Phase 1.7 contract list compact table fix */
.toolbar-button.primary {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.contracts-wide-table {
    min-width: 0;
    width: 100%;
    table-layout: fixed;
}
.contracts-wide-table th:nth-child(1) { width: 23%; }
.contracts-wide-table th:nth-child(2) { width: 12%; }
.contracts-wide-table th:nth-child(3) { width: 13%; }
.contracts-wide-table th:nth-child(4) { width: 12%; }
.contracts-wide-table th:nth-child(5),
.contracts-wide-table th:nth-child(6),
.contracts-wide-table th:nth-child(7) { width: 7%; text-align: center; }
.contracts-wide-table th:nth-child(8) { width: 12%; }
.contracts-wide-table th:nth-child(9) { width: 8%; text-align: center; }
.contracts-wide-table td,
.contracts-wide-table th {
    padding: 9px 10px;
    overflow: hidden;
}
.contracts-wide-table td:nth-child(5),
.contracts-wide-table td:nth-child(6),
.contracts-wide-table td:nth-child(7),
.contracts-wide-table td:nth-child(9) {
    text-align: center;
}
.contract-client-cell strong,
.contracts-wide-table td:nth-child(2),
.contracts-wide-table td:nth-child(4) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.contract-client-cell small {
    direction: ltr;
    text-align: right;
    font-weight: 800;
    color: var(--muted);
}
.products-mini-cell {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    min-width: 0;
}
.products-mini-cell span {
    display: inline-block;
    max-width: 92px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-height: 24px;
    line-height: 24px;
    border-radius: 999px;
    padding: 0 8px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
}
.products-mini-cell em {
    flex: 0 0 auto;
    min-width: 26px;
    min-height: 24px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
    font-style: normal;
}
.contracts-master-actions .toolbar-button.primary {
    min-width: 132px;
}
@media (max-width: 1180px) {
    .contracts-wide-table {
        min-width: 920px;
    }
}

/* Phase 1.7 contract list refinement: deadline in table, no contract type column */
.contracts-wide-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}
.contracts-wide-table th:nth-child(1) { width: 18%; }
.contracts-wide-table th:nth-child(2) { width: 14%; }
.contracts-wide-table th:nth-child(3) { width: 10%; }
.contracts-wide-table th:nth-child(4) { width: 15%; }
.contracts-wide-table th:nth-child(5),
.contracts-wide-table th:nth-child(6),
.contracts-wide-table th:nth-child(7) { width: 6%; text-align: center; }
.contracts-wide-table th:nth-child(8) { width: 15%; }
.contracts-wide-table th:nth-child(9) { width: 10%; text-align: center; }
.contracts-wide-table td,
.contracts-wide-table th {
    padding: 8px 9px;
    vertical-align: middle;
}
.contracts-wide-table td:nth-child(5),
.contracts-wide-table td:nth-child(6),
.contracts-wide-table td:nth-child(7),
.contracts-wide-table td:nth-child(9) {
    text-align: center;
}
.contract-client-cell.compact-client strong {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 13px;
}
.contract-client-cell.compact-client small {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    direction: ltr;
    text-align: right;
    font-weight: 900;
    color: var(--muted);
}
.contract-deadline-cell {
    display: grid;
    gap: 5px;
    align-items: center;
    min-width: 0;
}
.contract-deadline-cell strong {
    font-size: 12px;
    font-weight: 900;
    direction: ltr;
    text-align: right;
    white-space: nowrap;
}
.contract-deadline-cell .status-pill {
    width: fit-content;
    max-width: 100%;
    min-height: 24px;
    padding: 3px 8px;
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.products-mini-cell span {
    max-width: 70px;
    padding: 0 7px;
}
.products-mini-cell em {
    min-width: 24px;
}
.contracts-wide-table td:nth-child(4) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 12px;
}
.contracts-wide-table td:nth-child(8) .status-pill {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.table-count-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
@media (max-width: 1180px) {
    .contracts-wide-table { min-width: 860px; }
}

/* Phase 1.8 - Installation and infrastructure */
.installation-shell { display: grid; gap: 16px; }
.installation-toolbar { align-items: center; }
.installation-kpis article.info { color: var(--info); }
.installation-kpis article.success { color: var(--success); }
.installation-kpis article.warning { color: var(--warning); }
.installation-kpis article.danger { color: var(--danger); }
.installation-main-card { padding: 18px; }
.compact-actions { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.view-mode-actions button {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    color: var(--muted);
}
.view-mode-actions button.active { background: var(--primary-soft); color: var(--primary); border-color: rgba(79,70,229,.20); }
.installation-view-pane { display: none; }
.installation-view-pane.active { display: block; }
.installation-table th:first-child { width: 190px; }
.installation-table td { vertical-align: middle; }
.install-project-cell strong, .installation-table td strong { display: block; font-size: 13px; line-height: 1.7; }
.install-project-cell small, .installation-table td small { display: block; color: var(--muted); font-size: 11px; line-height: 1.7; margin-top: 2px; }
.install-progress-cell { min-width: 120px; display: grid; gap: 5px; }
.card-progress.mini { height: 7px; margin: 0; }
.installation-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.installation-card { border: 1px solid var(--line); border-radius: 18px; background: var(--surface-2); padding: 15px; display: grid; gap: 12px; }
.installation-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.installation-card-head strong { display: block; }
.installation-card-head small { color: var(--muted); font-size: 12px; }
.install-card-meta { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 8px; }
.install-card-meta span { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 9px 10px; color: #344054; font-size: 12px; line-height: 1.8; }
.installation-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.9; }
.toolbar-button.small { min-height: 36px; padding: 0 12px; font-size: 12px; }
.full-button { width: 100%; justify-content: center; }
.install-stage-board { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.install-stage-column { border: 1px solid var(--line); background: var(--surface-2); border-radius: 18px; padding: 12px; min-height: 160px; }
.install-stage-column header { font-size: 13px; font-weight: 900; margin-bottom: 10px; color: #344054; }
.install-stage-item { display: block; border: 1px solid var(--line); background: var(--surface); border-radius: 14px; padding: 12px; margin-bottom: 8px; }
.install-stage-item strong { display: block; font-size: 13px; }
.install-stage-item small { display: block; color: var(--muted); font-size: 12px; line-height: 1.8; }
.installation-bottom-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 16px; }
.install-path-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.install-path-card { border: 1px solid var(--line); border-radius: 15px; padding: 13px; background: var(--surface-2); display: grid; gap: 6px; }
.install-path-card strong { font-size: 13px; }
.install-path-card small { color: var(--muted); line-height: 1.8; }
.install-path-card.info { border-color: rgba(37,99,235,.18); background: var(--info-soft); }
.install-path-card.success { border-color: rgba(22,163,74,.18); background: var(--success-soft); }
.install-path-card.warning { border-color: rgba(217,119,6,.18); background: var(--warning-soft); }
.install-path-card.purple { border-color: rgba(124,58,237,.18); background: var(--purple-soft); }
.return-reason-cloud { display: flex; flex-wrap: wrap; gap: 8px; }
.return-reason-cloud span { display: inline-flex; min-height: 32px; align-items: center; justify-content: center; padding: 6px 10px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-2); color: #344054; font-size: 12px; font-weight: 700; }
.return-reason-cloud.selected span { background: var(--warning-soft); color: var(--warning); border-color: rgba(217,119,6,.20); }
.installation-detail-hero .project-detail-meta { grid-template-columns: repeat(4, minmax(0,1fr)); }
.install-next-action { margin-top: 14px; }
.server-access-grid, .handover-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
.handover-form-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.server-access-item, .handover-form-grid div { border: 1px solid var(--line); border-radius: 14px; padding: 12px; background: var(--surface-2); display: grid; gap: 5px; }
.server-access-item span, .handover-form-grid span { color: var(--muted); font-size: 12px; }
.server-access-item strong, .handover-form-grid strong { font-size: 13px; line-height: 1.7; }
.server-access-item.success { background: var(--success-soft); border-color: rgba(22,163,74,.16); }
.server-access-item.warning { background: var(--warning-soft); border-color: rgba(217,119,6,.16); }
.server-access-item.danger { background: var(--danger-soft); border-color: rgba(220,38,38,.16); }
.installation-checklist-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.install-timeline-list { display: grid; gap: 10px; }
.install-timeline-item { display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--line); border-radius: 14px; padding: 11px; background: var(--surface-2); }
.install-timeline-item > span { width: 12px; height: 12px; border-radius: 50%; background: var(--muted); flex: 0 0 auto; margin-top: 6px; }
.install-timeline-item.done > span { background: var(--success); }
.install-timeline-item.warning > span { background: var(--warning); }
.install-timeline-item.danger > span { background: var(--danger); }
.install-timeline-item.success > span { background: var(--success); }
.install-timeline-item.locked > span { background: #98a2b3; }
.install-timeline-item strong { display: block; font-size: 13px; }
.install-timeline-item small { display: block; color: var(--muted); font-size: 12px; line-height: 1.8; }
.deployment-actions-preview { display: flex; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.toolbar-button.danger { background: var(--danger-soft); color: var(--danger); border-color: rgba(220,38,38,.16); }
.checklist-item-row.blocked span { background: var(--danger); }
.checklist-item-row.locked span { background: #98a2b3; }
@media (max-width: 1180px) {
    .installation-bottom-grid, .installation-card-grid, .install-stage-board, .installation-checklist-grid { grid-template-columns: 1fr; }
    .handover-form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 720px) {
    .install-card-meta, .install-path-grid, .server-access-grid, .handover-form-grid, .installation-detail-hero .project-detail-meta { grid-template-columns: 1fr; }
}

/* Phase 1.8 UX revision: IT installation flow */
.installation-v2-shell .clean-toolbar {
    align-items: center;
    gap: 14px;
}
.installation-v2-shell .clean-toolbar small {
    max-width: 760px;
    line-height: 1.8;
}
.muted-button,
.toolbar-button:disabled {
    background: #f3f4f6 !important;
    color: #667085 !important;
    border-color: #e5e7eb !important;
    box-shadow: none !important;
    cursor: default;
}
.installation-fit-table-wrap {
    overflow-x: auto;
}
.installation-fit-table {
    min-width: 980px;
    table-layout: fixed;
}
.installation-fit-table th:nth-child(1),
.installation-fit-table td:nth-child(1) { width: 18%; }
.installation-fit-table th:nth-child(2),
.installation-fit-table td:nth-child(2) { width: 14%; }
.installation-fit-table th:nth-child(3),
.installation-fit-table td:nth-child(3) { width: 13%; }
.installation-fit-table th:nth-child(4),
.installation-fit-table td:nth-child(4) { width: 15%; }
.installation-fit-table th:nth-child(5),
.installation-fit-table td:nth-child(5) { width: 12%; }
.installation-fit-table th:nth-child(6),
.installation-fit-table td:nth-child(6) { width: 13%; }
.installation-fit-table th:nth-child(7),
.installation-fit-table td:nth-child(7) { width: 10%; }
.installation-fit-table th:nth-child(8),
.installation-fit-table td:nth-child(8) { width: 95px; }
.compact-project-cell strong,
.contact-mini-cell strong {
    display: block;
    max-width: 210px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.compact-project-cell small,
.contact-mini-cell small,
.installation-fit-table td small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
    margin-top: 4px;
}
.install-readiness-cell {
    display: grid;
    gap: 4px;
    min-width: 80px;
}
.install-readiness-cell span {
    font-weight: 800;
    font-size: 12px;
}
.installation-note-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, .6fr);
    gap: 14px;
    margin-top: 14px;
}
.install-process-mini {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.install-process-mini span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid var(--line);
    font-size: 12px;
    font-weight: 800;
    color: #344054;
}
.install-process-mini i {
    width: 16px;
    height: 1px;
    background: var(--line-strong);
}
.clean-cloud span {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
}
.compact-install-hero {
    padding-bottom: 14px;
}
.compact-meta-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.client-contact-list {
    display: grid;
    gap: 10px;
}
.client-contact-card {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 16px;
    padding: 12px;
    display: grid;
    gap: 5px;
}
.client-contact-card span {
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
}
.client-contact-card strong {
    font-size: 14px;
}
.client-contact-card small,
.client-contact-card em {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
    font-style: normal;
}
.access-compact-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.minimal-checklist-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.minimal-checklist-card {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 18px;
    padding: 14px;
}
.minimal-checklist-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.minimal-checklist-head strong {
    font-size: 14px;
}
.minimal-checklist-head span {
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
}
.minimal-checklist-items {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.mini-check-row,
.test-check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 14px;
    padding: 10px 11px;
}
.mini-check-row .check-mark,
.test-check-row > span {
    width: 18px;
    height: 18px;
    border-radius: 6px;
    border: 2px solid var(--line-strong);
    background: #fff;
    flex: 0 0 auto;
    position: relative;
}
.mini-check-row.done .check-mark,
.test-check-row.done > span {
    border-color: var(--success);
    background: var(--success);
}
.mini-check-row.done .check-mark::after,
.test-check-row.done > span::after {
    content: '✓';
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}
.mini-check-row.pending .check-mark,
.test-check-row.pending > span {
    border-color: var(--warning);
    background: var(--warning-soft);
}
.mini-check-row.blocked .check-mark,
.test-check-row.blocked > span {
    border-color: var(--danger);
    background: var(--danger-soft);
}
.mini-check-row.locked,
.test-check-row.locked {
    opacity: .65;
}
.mini-check-row.locked .check-mark,
.test-check-row.locked > span {
    background: #f3f4f6;
}
.mini-check-row strong,
.test-check-row strong {
    display: block;
    font-size: 13px;
}
.mini-check-row small,
.test-check-row small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.7;
}
.test-check-list {
    display: grid;
    gap: 9px;
}
.test-check-row {
    justify-content: flex-start;
}
.test-check-row small {
    margin-inline-start: auto;
}
.handover-state-box {
    margin-top: 12px;
    border-radius: 14px;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.9;
}
.handover-state-box.ready {
    background: var(--success-soft);
    color: var(--success);
}
.handover-state-box.not-ready {
    background: var(--warning-soft);
    color: var(--warning);
}
.clean-actions {
    margin-top: 12px;
}
.horizontal-timeline-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.horizontal-timeline-list .install-timeline-item {
    min-height: 72px;
}

@media (max-width: 1180px) {
    .installation-note-grid,
    .minimal-checklist-grid {
        grid-template-columns: 1fr;
    }
    .access-compact-grid,
    .horizontal-timeline-list,
    .compact-meta-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 760px) {
    .access-compact-grid,
    .horizontal-timeline-list,
    .compact-meta-row {
        grid-template-columns: 1fr;
    }
    .installation-fit-table {
        min-width: 900px;
    }
}

/* Phase 1.8 revised installation UX */
.compact-topbar-card { padding-block: 14px !important; }
.tiny-kpis article { min-height: unset !important; padding: 12px 14px !important; }
.tiny-kpis strong { font-size: 22px !important; }
.full-width-install-card { width: 100%; }
.no-overflow-table { overflow-x: auto; }
.installation-v3-table { min-width: 980px; table-layout: fixed; }
.installation-v3-table th,
.installation-v3-table td { vertical-align: middle; }
.installation-v3-table th:nth-child(1) { width: 190px; }
.installation-v3-table th:nth-child(2) { width: 145px; }
.installation-v3-table th:nth-child(3) { width: 150px; }
.installation-v3-table th:nth-child(4) { width: 130px; }
.installation-v3-table th:nth-child(5) { width: 150px; }
.installation-v3-table th:nth-child(6) { width: 105px; }
.installation-v3-table th:nth-child(7) { width: 140px; }
.installation-v3-table th:nth-child(8) { width: 90px; }
.install-client-product-cell strong,
.install-date-cell strong,
.install-update-cell strong,
.install-deadline-cell strong { display: block; font-size: 13px; line-height: 1.65; white-space: normal; }
.install-client-product-cell small,
.install-date-cell small,
.install-update-cell small,
.install-deadline-cell small,
.installation-v3-table td small { display: block; color: var(--muted); font-size: 11px; line-height: 1.75; margin-top: 2px; }
.install-client-product-cell small { color: var(--primary); font-weight: 800; }
.install-type-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
}
.install-type-pill.local { background: var(--purple-soft); color: var(--purple); }
.install-type-pill.client { background: var(--info-soft); color: var(--info); }
.checklist-open-button {
    width: 100%;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 12px;
    min-height: 40px;
    display: grid;
    grid-template-columns: 18px 1fr;
    grid-template-areas: "icon count" "icon percent";
    align-items: center;
    column-gap: 6px;
    padding: 5px 8px;
    color: var(--text);
}
.checklist-open-button span { grid-area: icon; color: var(--primary); }
.checklist-open-button strong { grid-area: count; font-size: 12px; line-height: 1.1; }
.checklist-open-button small { grid-area: percent; margin: 0; font-size: 10px; color: var(--muted); }
.install-filter-actions .toolbar-button { min-height: 34px; }
.danger-soft { background: var(--danger-soft) !important; color: var(--danger) !important; }
.modal-open { overflow: hidden; }
.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .36);
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 22px;
}
.modal-card {
    width: min(1120px, 100%);
    max-height: calc(100vh - 44px);
    overflow: hidden;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 22px;
    box-shadow: 0 26px 80px rgba(15, 23, 42, .18);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
}
.modal-head,
.modal-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
}
.modal-actions { border-top: 1px solid var(--line); border-bottom: 0; justify-content: flex-end; }
.modal-head strong { display: block; font-size: 16px; }
.modal-head small { display: block; color: var(--muted); font-size: 12px; margin-top: 4px; }
.modal-close {
    width: 36px;
    height: 36px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-2);
    font-size: 22px;
    line-height: 1;
}
.checklist-progress-line {
    height: 6px;
    background: var(--surface-3);
    overflow: hidden;
}
.checklist-progress-line i { display: block; height: 100%; background: linear-gradient(90deg, var(--primary), var(--success)); }
.notebook-table-wrap { overflow: auto; padding: 12px 16px; }
.notebook-checklist-table,
.credential-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
}
.notebook-checklist-table th,
.notebook-checklist-table td,
.credential-table th,
.credential-table td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    vertical-align: middle;
}
.notebook-checklist-table th,
.credential-table th { color: var(--muted); font-size: 12px; font-weight: 850; background: var(--surface-2); }
.checklist-section-row td {
    background: #f8fafc;
    color: var(--text);
    font-weight: 900;
    border-top: 1px solid var(--line);
}
.notebook-row.done { background: rgba(22,163,74,.035); }
.notebook-row.blocked { background: rgba(220,38,38,.035); }
.notebook-row.locked { opacity: .72; }
.notebook-row strong { display: block; font-size: 13px; line-height: 1.65; }
.notebook-row small { display: block; color: var(--muted); font-size: 11px; line-height: 1.65; }
.notebook-row input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--primary); }
.check-time { white-space: nowrap; color: var(--muted); font-size: 12px; }
.note-cell { min-width: 160px; }
.note-cell span { color: var(--muted); margin-inline-end: 6px; }
.note-cell small { display: inline; color: #98a2b3; font-size: 11px; }
.install-detail-compact-header { padding: 14px 16px; margin-bottom: 12px; }
.install-detail-title-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}
.compact-title-only strong { font-size: 17px !important; }
.compact-title-only small { font-size: 12px; color: var(--muted); }
.install-summary-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}
.install-summary-strip > div {
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 10px 12px;
    min-height: 62px;
}
.install-summary-strip span { display: block; color: var(--muted); font-size: 11px; margin-bottom: 5px; }
.install-summary-strip strong { display: block; font-size: 12px; line-height: 1.7; }
.install-detail-tabs {
    display: flex !important;
    gap: 8px;
    padding: 8px !important;
    margin-bottom: 12px;
    overflow-x: auto;
}
.install-detail-tabs button {
    border: 0;
    background: transparent;
    min-height: 36px;
    padding: 8px 13px;
    border-radius: 12px;
    color: var(--muted);
    font-weight: 800;
    white-space: nowrap;
}
.install-detail-tabs button.active { background: var(--primary-soft); color: var(--primary); }
.install-tab-panels { display: block; }
.install-tab-panel { padding: 16px; }
.install-tab-panel[hidden] { display: none !important; }
.install-mini-dashboard {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.install-mini-dashboard > div {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 12px;
}
.install-mini-dashboard span { color: var(--muted); font-size: 11px; }
.install-mini-dashboard strong { display: block; font-size: 13px; line-height: 1.8; margin-top: 4px; }
.install-mini-dashboard small { display: block; color: var(--muted); font-size: 11px; line-height: 1.6; }
.credential-table-wrap,
.contacts-table-wrap,
.history-table-wrap,
.detail-notebook-wrap { overflow-x: auto; }
.credential-table code {
    direction: ltr;
    unicode-bidi: plaintext;
    background: var(--surface-3);
    border: 1px solid var(--line);
    border-radius: 8px;
    padding: 4px 7px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
}
.history-table td,
.contacts-table td { vertical-align: middle; }
@media (max-width: 1100px) {
    .install-summary-strip,
    .install-mini-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .install-detail-title-line { align-items: stretch; flex-direction: column; }
}
@media (max-width: 720px) {
    .install-summary-strip,
    .install-mini-dashboard { grid-template-columns: 1fr; }
    .modal-backdrop { padding: 10px; }
    .modal-card { max-height: calc(100vh - 20px); border-radius: 18px; }
}

/* Patch 1.8.1 - modal visibility fix */
[hidden] { display: none !important; }
.modal-backdrop[hidden] { display: none !important; }

/* Patch 1.8.1 - IT manager dashboard installation widget */
.it-install-dashboard-widget {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 16px;
    box-shadow: var(--shadow-sm);
}
.it-install-mini-table-wrap {
    width: 100%;
    overflow-x: auto;
}
.it-install-mini-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    min-width: 860px;
}
.it-install-mini-table th,
.it-install-mini-table td {
    border-bottom: 1px solid var(--line);
    padding: 10px 12px;
    text-align: right;
    vertical-align: middle;
    font-size: 12px;
}
.it-install-mini-table th {
    color: var(--muted);
    font-weight: 850;
    background: var(--surface-2);
}
.it-install-mini-table td strong {
    display: block;
    font-size: 13px;
    line-height: 1.7;
}
.it-install-mini-table td small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.7;
}
.mini-install-progress {
    display: grid;
    grid-template-columns: auto minmax(70px, 1fr) auto;
    align-items: center;
    gap: 6px;
}
.mini-install-progress span {
    height: 6px;
    border-radius: 999px;
    background: var(--surface-3);
    overflow: hidden;
}
.mini-install-progress span i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--primary);
}

/* Phase 1.8.2 - installation table and dependency checklist refinements */
.installation-v4-table {
    min-width: 820px;
    table-layout: fixed;
}
.installation-v4-table th,
.installation-v4-table td { vertical-align: middle; }
.installation-v4-table th:nth-child(1) { width: 245px; }
.installation-v4-table th:nth-child(2) { width: 118px; }
.installation-v4-table th:nth-child(3) { width: 145px; }
.installation-v4-table th:nth-child(4) { width: 110px; }
.installation-v4-table th:nth-child(5) { width: 145px; }
.installation-v4-table th:nth-child(6) { width: 82px; }
.install-main-cell strong,
.install-date-cell strong,
.it-install-mini-table td strong {
    display: block;
    font-size: 13px;
    line-height: 1.65;
    white-space: normal;
}
.product-title-line {
    display: block;
    color: var(--primary) !important;
    font-weight: 850;
    font-size: 11px !important;
    line-height: 1.7;
}
.last-update-line,
.it-install-title-cell em {
    display: block;
    margin-top: 2px;
    color: #98a2b3;
    font-size: 10.5px;
    font-style: normal;
    line-height: 1.7;
}
.install-date-cell small,
.it-install-mini-table td small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    margin-top: 2px;
}
.dependency-checklist-table .checklist-section-row td {
    padding-block: 8px;
}
.dependency-checklist-table .checklist-section-row strong {
    display: inline-block;
    margin-inline-end: 8px;
}
.dependency-checklist-table .checklist-section-row small {
    display: inline-block;
    color: var(--muted);
    font-weight: 500;
    font-size: 11px;
}
.inline-checklist-select {
    min-width: 160px;
    height: 30px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    color: var(--text);
    padding: 0 8px;
    margin-top: 5px;
    font-size: 11px;
    outline: none;
}
.inline-checklist-select:focus {
    border-color: rgba(124, 58, 237, .35);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, .08);
}
.notebook-row.locked input[type="checkbox"],
.notebook-row.blocked input[type="checkbox"] {
    cursor: not-allowed;
    opacity: .45;
}
.notebook-row.locked strong,
.notebook-row.blocked strong { color: #667085; }
.notebook-row.blocked { background: rgba(217,119,6,.04); }
.notebook-row.locked { background: rgba(148,163,184,.06); opacity: 1; }
.compact-summary-strip { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.compact-summary-strip small { display: block; color: var(--muted); font-size: 11px; margin-top: 2px; }
.compact-install-mini-dashboard { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.it-install-title-cell strong { display: block; }
.it-install-title-cell small { display: block; color: var(--primary); font-weight: 800; }
.it-install-mini-table th:nth-child(1) { width: 230px; }
.it-install-mini-table th:nth-child(2) { width: 115px; }
.it-install-mini-table th:nth-child(3) { width: 130px; }
.it-install-mini-table th:nth-child(4) { width: 110px; }
.it-install-mini-table th:nth-child(5) { width: 130px; }
.it-install-mini-table th:nth-child(6) { width: 70px; }
@media (max-width: 760px) {
    .installation-v4-table { min-width: 760px; }
    .compact-summary-strip,
    .compact-install-mini-dashboard { grid-template-columns: 1fr; }
}

/* Phase 1.9 - Documents, letters and meeting minutes */
.documents-shell,
.document-detail-shell {
    display: grid;
    gap: 16px;
}
.documents-toolbar,
.document-detail-header {
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.documents-title-block strong,
.document-detail-header h1 {
    display: block;
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 900;
}
.document-detail-header h1 { font-size: 22px; }
.documents-title-block small,
.document-detail-header p {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
    margin: 0;
}
.documents-toolbar-actions,
.detail-header-actions,
.document-filter-buttons {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.document-local-search {
    width: min(360px, 38vw);
    min-width: 230px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    padding: 0 12px;
    outline: none;
}
.document-kpi-strip,
.document-summary-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}
.document-summary-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.doc-kpi,
.document-summary-strip article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px 14px;
    display: grid;
    gap: 4px;
    box-shadow: var(--shadow-sm);
}
.doc-kpi span,
.document-summary-strip span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}
.doc-kpi strong,
.document-summary-strip strong {
    font-size: 22px;
    line-height: 1.2;
}
.doc-kpi small { color: var(--muted); font-size: 11px; }
.doc-kpi.info strong { color: var(--info); }
.doc-kpi.warning strong,
.document-summary-strip .warning strong { color: var(--warning); }
.doc-kpi.danger strong { color: var(--danger); }
.doc-kpi.success strong { color: var(--success); }
.documents-list-card,
.document-tab-card { padding: 16px; }
.documents-table-wrap { max-width: 100%; overflow-x: auto; }
.documents-table { min-width: 980px; }
.documents-table th:first-child { width: 170px; }
.documents-table th:nth-child(2) { width: 310px; }
.document-contract-cell strong,
.document-subject-cell strong {
    display: block;
    font-size: 13px;
    line-height: 1.8;
}
.document-contract-cell small,
.document-subject-cell small,
.two-line-cell small {
    color: var(--muted);
    font-size: 11px;
}
.doc-type-line {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.doc-type-line em {
    font-style: normal;
    color: var(--muted);
    font-size: 11px;
}
.document-file-state {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.document-detail-header { align-items: flex-start; }
.document-tab-card .detail-tabs.compact-tabs {
    margin-bottom: 14px;
    overflow-x: auto;
    flex-wrap: nowrap;
}
.document-tab-card .detail-tabs.compact-tabs button {
    white-space: nowrap;
}
.document-panels-grid,
.document-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.mini-doc-table-wrap { overflow-x: auto; }
.mini-doc-table { min-width: 720px; }
.empty-table-cell {
    text-align: center !important;
    color: var(--muted);
    padding: 22px !important;
}
.document-file-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.document-file-group {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 16px;
    padding: 12px;
}
.document-file-group > strong {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
}
.document-file-row,
.template-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-top: 1px solid var(--line);
    padding: 9px 0;
}
.document-file-row:first-of-type,
.template-row:first-child { border-top: 0; }
.document-file-row span,
.template-row strong { font-size: 13px; }
.template-list { display: grid; gap: 8px; }
.template-row {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 12px;
}
.template-row small,
.empty-inline {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.chip-cloud.compact-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.chip-cloud.compact-cloud span {
    background: var(--surface-3);
    border: 1px solid var(--line);
    color: #445;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 1180px) {
    .document-kpi-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .document-panels-grid,
    .document-settings-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .documents-toolbar,
    .document-detail-header { flex-direction: column; align-items: stretch; }
    .document-local-search { width: 100%; }
    .document-kpi-strip,
    .document-summary-strip,
    .document-file-grid { grid-template-columns: 1fr; }
}

/* Phase 1.9 UX V2 - Office automation redesign */
.office-documents-shell,
.office-archive-shell {
    display: grid;
    gap: 14px;
}
.office-page-head,
.office-archive-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.office-page-head h1,
.archive-title-block h1 {
    margin: 4px 0 6px;
    font-size: 22px;
    line-height: 1.4;
}
.office-page-head p,
.archive-title-block p,
.archive-meta-line {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}
.office-page-actions,
.archive-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.office-template-strip {
    padding: 14px;
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}
.office-strip-head strong {
    display: block;
    font-size: 15px;
    margin-bottom: 4px;
}
.office-strip-head small,
.office-template-chip small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.7;
}
.office-template-list {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 2px;
}
.office-template-chip {
    min-width: 160px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 10px 12px;
    display: grid;
    gap: 4px;
}
.office-template-chip span {
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
}
.office-template-chip strong {
    font-size: 13px;
    line-height: 1.7;
}
.office-kpi-strip,
.office-archive-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.office-kpi,
.office-archive-summary article {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px 14px;
    box-shadow: var(--shadow-sm);
}
.office-kpi span,
.office-archive-summary span {
    color: var(--muted);
    font-size: 12px;
}
.office-kpi strong,
.office-archive-summary strong {
    display: block;
    margin: 5px 0;
    font-size: 23px;
    line-height: 1.1;
}
.office-kpi small { color: var(--muted); font-size: 11px; }
.office-kpi.info strong { color: var(--info); }
.office-kpi.warning strong,
.office-archive-summary .warning strong { color: var(--warning); }
.office-kpi.danger strong { color: var(--danger); }
.office-kpi.success strong { color: var(--success); }
.office-latest-grid,
.office-archive-grid,
.office-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.office-latest-card,
.office-filter-card,
.office-archive-card {
    padding: 16px;
}
.office-letter-feed {
    display: grid;
    gap: 8px;
}
.office-letter-feed-row {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 10px 12px;
    background: var(--surface-2);
}
.office-letter-feed-row strong {
    display: block;
    font-size: 13px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.office-letter-feed-row small {
    color: var(--muted);
    font-size: 11px;
}
.direction-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    display: inline-block;
}
.direction-dot.out { background: var(--info); }
.direction-dot.in { background: var(--success); }
.office-filter-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.office-filter-grid label {
    display: grid;
    gap: 6px;
}
.office-filter-grid label span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.office-filter-grid input,
.office-filter-grid select {
    min-width: 0;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    padding: 0 10px;
    outline: none;
}
.office-filter-grid input:focus,
.office-filter-grid select:focus {
    border-color: rgba(79,70,229,.35);
    box-shadow: 0 0 0 4px rgba(79,70,229,.08);
}
.office-filter-grid .wide-filter {
    grid-column: span 2;
}
.office-table-wrap,
.office-mini-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: 16px;
}
.office-document-table,
.office-mini-doc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    table-layout: fixed;
}
.office-document-table th,
.office-document-table td,
.office-mini-doc-table th,
.office-mini-doc-table td {
    padding: 11px 10px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    vertical-align: middle;
}
.office-document-table thead th,
.office-mini-doc-table thead th {
    background: var(--surface-2);
    color: var(--muted);
    font-size: 11px;
    font-weight: 900;
}
.office-document-table th:nth-child(1) { width: 70px; }
.office-document-table th:nth-child(2) { width: 150px; }
.office-document-table th:nth-child(3) { width: 300px; }
.office-document-table th:nth-child(4) { width: 130px; }
.office-document-table th:nth-child(5) { width: 185px; }
.office-document-table th:nth-child(6) { width: 145px; }
.office-document-table th:nth-child(7) { width: 150px; }
.office-client-cell strong,
.office-subject-cell strong,
.office-number-cell strong,
.office-follow-cell strong,
.office-mini-doc-table td strong {
    display: block;
    color: var(--text);
    font-size: 12px;
    line-height: 1.7;
}
.office-client-cell small,
.office-subject-cell small,
.office-number-cell small,
.office-follow-cell small,
.office-file-cell small,
.office-mini-doc-table td small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
}
.office-subject-cell strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 290px;
}
.direction-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
}
.direction-badge.out { background: var(--info-soft); color: var(--info); }
.direction-badge.in { background: var(--success-soft); color: var(--success); }
.direction-badge.neutral { background: var(--surface-3); color: var(--muted); }
.office-row-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.office-row-actions .mini-action-link,
.office-row-actions button.mini-action-link {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 10px;
    padding: 6px 8px;
    line-height: 1;
    font-size: 11px;
    font-weight: 800;
    color: var(--muted);
}
.office-row-actions .mini-action-link.primary {
    color: var(--primary);
    background: var(--primary-soft);
    border-color: rgba(79,70,229,.16);
}
.office-archive-header {
    padding: 16px;
}
.archive-meta-line {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.archive-meta-line span {
    padding: 5px 9px;
    border-radius: 999px;
    background: var(--surface-3);
    font-size: 11px;
}
.office-tabbar {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 10px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--line);
}
.office-tabbar button {
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: #344054;
    border-radius: 12px;
    min-height: 40px;
    padding: 8px 13px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.office-tabbar button.active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}
.office-file-table-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.office-file-panel {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 12px;
}
.office-file-panel-head,
.office-file-line,
.office-template-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-bottom: 1px solid var(--line);
    padding: 10px 0;
}
.office-file-panel-head { padding-top: 0; }
.office-file-line:last-child,
.office-template-row:last-child { border-bottom: 0; }
.office-file-line strong,
.office-template-row strong {
    display: block;
    font-size: 13px;
}
.office-file-line small,
.office-template-row small,
.office-file-panel-head small {
    color: var(--muted);
    font-size: 11px;
}
.office-template-table {
    display: grid;
    gap: 4px;
}
.office-preview-modal {
    width: min(760px, calc(100vw - 32px));
}
.office-preview-body {
    display: grid;
    gap: 14px;
}
.preview-meta-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}
.preview-meta-grid span {
    background: var(--surface-2);
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 9px 10px;
    font-size: 12px;
    color: var(--muted);
}
.office-preview-body h3 {
    margin: 0;
    font-size: 18px;
}
.office-preview-body p {
    margin: 0;
    color: var(--muted);
    line-height: 2;
}
.attachment-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.attachment-list a {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface-2);
    padding: 9px 12px;
    font-size: 12px;
    font-weight: 800;
}
@media (max-width: 1200px) {
    .office-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .office-filter-grid .wide-filter { grid-column: span 3; }
    .office-kpi-strip,
    .office-archive-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .office-template-strip,
    .office-latest-grid,
    .office-archive-grid,
    .office-settings-grid,
    .office-file-table-grid { grid-template-columns: 1fr; }
    .office-page-head,
    .office-archive-header { flex-direction: column; align-items: stretch; }
    .preview-meta-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .office-filter-grid,
    .office-kpi-strip,
    .office-archive-summary { grid-template-columns: 1fr; }
    .office-filter-grid .wide-filter { grid-column: auto; }
}

/* Phase 1.9 refinement + Phase 1.10 quick tools */
.wide-modal-card {
    width: min(1080px, calc(100vw - 40px));
}
.office-templates-modal .modal-card {
    max-height: calc(100vh - 44px);
}
.template-tabs {
    display: flex;
    gap: 8px;
    padding: 12px 16px 0;
    overflow-x: auto;
    border-bottom: 1px solid var(--line);
}
.template-tabs button {
    min-height: 40px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    color: var(--text);
    border-radius: 12px 12px 0 0;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 800;
    white-space: nowrap;
}
.template-tabs button span {
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}
.template-tabs button.active {
    background: var(--primary-soft);
    color: var(--primary);
    border-color: rgba(79,70,229,.22);
}
.template-tab-panels {
    padding: 14px 16px;
    overflow: auto;
}
.template-panel[hidden] { display: none !important; }
.compact-template-table .office-document-table th,
.compact-template-table .office-document-table td {
    padding-block: 10px;
}
.tools-page-shell {
    display: grid;
    gap: 16px;
}
.compact-tools-head {
    padding-bottom: 6px;
}
.tools-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.tool-card {
    padding: 14px;
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 82px;
}
.tool-card > span {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: var(--primary-soft);
    color: var(--primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}
.tool-card strong { display: block; font-size: 14px; }
.tool-card small { color: var(--muted); font-size: 12px; line-height: 1.8; }
.tools-filter-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) 1.2fr;
}
.tools-contact-table-wrap {
    max-height: 560px;
}
.tools-contact-table td strong {
    display: block;
    font-size: 13px;
}
.tools-contact-table td small {
    display: block;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.8;
}
.muted-note {
    color: var(--muted);
    line-height: 1.9;
}
@media (max-width: 1280px) {
    .tools-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tools-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .tools-grid { grid-template-columns: 1fr; }
    .tools-filter-grid { grid-template-columns: 1fr; }
    .tool-card { grid-template-columns: auto minmax(0,1fr); }
    .tool-card .mini-action-link { grid-column: 1 / -1; justify-self: start; }
}

/* Phase 1.11 - Challenges, delays and alerts */
.challenge-shell {
    display: grid;
    gap: 14px;
}
.compact-module-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 62px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    padding: 12px 16px;
    box-shadow: var(--shadow-sm);
}
.compact-module-head strong {
    display: block;
    font-size: 17px;
    line-height: 1.8;
}
.compact-module-head small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.module-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    padding: 0 9px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    margin-bottom: 2px;
}
.module-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}
.challenge-kpi-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.challenge-kpi {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px 14px;
    min-height: 86px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 4px;
    color: var(--info);
}
.challenge-kpi span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.challenge-kpi strong {
    font-size: 26px;
    line-height: 1.1;
    color: currentColor;
}
.challenge-kpi small {
    color: var(--muted);
    font-size: 12px;
}
.challenge-kpi.danger { color: var(--danger); }
.challenge-kpi.warning { color: var(--warning); }
.challenge-kpi.success { color: var(--success); }
.challenge-kpi.purple { color: var(--purple); }
.challenge-kpi.info { color: var(--info); }
.challenge-filter-card {
    padding: 16px;
}
.challenge-filter-grid {
    display: grid;
    grid-template-columns: 1.1fr 1fr .8fr 1fr 1fr 1.8fr;
    gap: 10px;
    margin-bottom: 14px;
}
.challenge-filter-grid label,
.challenge-reason-form label {
    display: grid;
    gap: 6px;
}
.challenge-filter-grid label span,
.challenge-reason-form label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.challenge-filter-grid select,
.challenge-filter-grid input,
.challenge-reason-form select,
.challenge-reason-form input,
.challenge-reason-form textarea {
    width: 100%;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    border-radius: 12px;
    min-height: 40px;
    padding: 8px 11px;
    outline: none;
}
.challenge-reason-form textarea {
    resize: vertical;
}
.challenge-table-wrap {
    max-height: none;
}
.challenge-table th:nth-child(1),
.challenge-table td:nth-child(1) { width: 190px; }
.challenge-table th:nth-child(3),
.challenge-table td:nth-child(3) { width: 110px; }
.challenge-table th:nth-child(4),
.challenge-table td:nth-child(4) { width: 130px; }
.challenge-table th:nth-child(7),
.challenge-table td:nth-child(7) { width: 112px; }
.challenge-title-cell strong,
.challenge-title-cell small,
.challenge-title-cell em {
    display: block;
}
.challenge-title-cell em {
    font-style: normal;
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
    margin-top: 3px;
}
.stacked-pills {
    display: grid;
    gap: 5px;
    justify-items: start;
}
.stacked-pills small {
    color: var(--muted);
    font-size: 11px;
}
.compact-actions {
    gap: 5px;
    flex-wrap: wrap;
}
.challenge-bottom-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr);
    gap: 14px;
}
.challenge-rule-card {
    padding: 16px;
}
.automation-rule-list,
.referral-rule-list {
    display: grid;
    gap: 8px;
}
.automation-rule-line {
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 10px 12px;
    color: var(--info);
}
.automation-rule-line > span {
    width: 9px;
    height: 9px;
    border-radius: 999px;
    background: currentColor;
}
.automation-rule-line strong,
.referral-rule-line strong {
    display: block;
    color: var(--text);
    font-size: 13px;
}
.automation-rule-line small,
.referral-rule-line small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.automation-rule-line em {
    font-style: normal;
    font-size: 12px;
    color: var(--muted);
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 5px 9px;
    white-space: nowrap;
}
.automation-rule-line.danger { color: var(--danger); }
.automation-rule-line.warning { color: var(--warning); }
.automation-rule-line.success { color: var(--success); }
.automation-rule-line.purple { color: var(--purple); }
.referral-rule-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px 10px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 10px 12px;
}
.referral-rule-line small {
    grid-column: 1 / -1;
}
.referral-rule-line span {
    color: var(--primary);
    background: var(--primary-soft);
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}
.reason-catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.reason-group-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 12px;
}
.reason-group-card strong {
    display: block;
    font-size: 14px;
    margin-bottom: 8px;
}
.reason-group-card ul {
    margin: 0;
    padding: 0 18px 0 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 2;
}
.challenge-reason-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.challenge-reason-form .wide-filter,
.modal-actions-row {
    grid-column: 1 / -1;
}
.modal-actions-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid var(--line);
    padding-top: 12px;
    margin-top: 4px;
}
@media (max-width: 1280px) {
    .challenge-kpi-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .challenge-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .challenge-filter-grid .wide-filter { grid-column: 1 / -1; }
    .challenge-bottom-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .compact-module-head { flex-direction: column; align-items: stretch; }
    .module-actions { justify-content: flex-start; }
    .challenge-kpi-strip,
    .challenge-filter-grid,
    .reason-catalog-grid,
    .challenge-reason-form { grid-template-columns: 1fr; }
    .challenge-reason-form .wide-filter,
    .modal-actions-row { grid-column: auto; }
}
.compact-modal-card {
    width: min(900px, 100%);
    max-height: calc(100vh - 44px);
}
.compact-modal-card .reason-catalog-grid,
.compact-modal-card .challenge-reason-form {
    padding: 14px 16px;
    overflow: auto;
}

/* Phase 1.12 - Dynamic settings */
.settings-dynamic-shell { display: grid; gap: 14px; }
.settings-compact-head { margin-bottom: 0; }
.settings-tabs-scroll {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 2px 2px 8px;
    scrollbar-width: thin;
}
.settings-tabs-scroll .settings-tab {
    min-width: 136px;
    max-width: 180px;
    flex: 0 0 auto;
    display: grid;
    gap: 3px;
    align-content: center;
    min-height: 54px;
    padding: 9px 12px;
}
.settings-tabs-scroll .settings-tab strong,
.settings-tabs-scroll .settings-tab small { line-height: 1.4; }
.settings-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.settings-summary-card { padding: 13px 14px; display: grid; gap: 5px; }
.settings-summary-card span { color: var(--muted); font-size: 12px; }
.settings-summary-card strong { font-size: 14px; line-height: 1.6; }
.settings-group-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.settings-group-card {
    padding: 14px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}
.settings-group-card strong { display: block; font-size: 14px; }
.settings-group-card small { color: var(--muted); line-height: 1.7; display: block; margin-top: 4px; }
.settings-group-card span {
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}
.settings-table-card { padding: 16px; }
.settings-search-input {
    width: min(280px, 100%);
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 0 12px;
    outline: none;
    background: #fff;
}
.settings-table-wrap { max-width: 100%; }
.settings-dynamic-table th,
.settings-dynamic-table td { vertical-align: middle; }
.settings-main-cell strong { font-size: 13px; }
.settings-note-panel { padding: 14px 16px; }
.settings-note-panel strong { display: block; margin-bottom: 6px; }
.settings-note-panel p { margin: 0; color: var(--muted); line-height: 1.9; font-size: 13px; }
.form-help-text { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.7; }
@media (max-width: 1180px) {
    .settings-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-group-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .settings-summary-grid,
    .settings-group-grid { grid-template-columns: 1fr; }
    .settings-search-input { width: 100%; }
}

/* Phase 1.12 redesign */
.settings-redesign-shell { display: grid; gap: 14px; }
.settings-page-head {
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.settings-kicker {
    display: inline-block;
    margin-bottom: 6px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
}
.settings-page-head h1 {
    margin: 0 0 6px;
    font-size: 22px;
}
.settings-page-head p {
    margin: 0;
    color: var(--muted);
    line-height: 1.9;
    font-size: 13px;
}
.settings-head-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.settings-nav-shell {
    padding: 14px;
    display: grid;
    gap: 12px;
}
.settings-category-tabs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.settings-category-tab {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 12px 14px;
    display: grid;
    gap: 5px;
    transition: .18s ease;
}
.settings-category-tab strong { font-size: 14px; }
.settings-category-tab small { color: var(--muted); line-height: 1.7; font-size: 12px; }
.settings-category-tab:hover { border-color: rgba(79,70,229,.16); background: #fff; }
.settings-category-tab.active { background: var(--primary-soft); border-color: rgba(79,70,229,.22); }
.settings-subnav-strip {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    padding-top: 2px;
    border-top: 1px solid var(--line);
}
.settings-subnav-link {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}
.settings-subnav-link.active { background: var(--primary-soft); color: var(--primary); border-color: rgba(79,70,229,.20); }
.settings-category-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.settings-category-card {
    padding: 16px;
    display: grid;
    gap: 8px;
}
.settings-category-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.settings-category-top strong { font-size: 15px; }
.settings-category-top span {
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.settings-category-card p,
.settings-category-card small,
.settings-mini-stat-card small,
.settings-catalog-main small,
.settings-side-block p,
.settings-related-link small {
    color: var(--muted);
    line-height: 1.8;
}
.settings-catalog-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
    gap: 14px;
}
.settings-list-card,
.settings-mini-stat-card,
.settings-sidebar-panel,
.settings-table-card,
.settings-note-panel { padding: 16px; }
.settings-catalog-rows {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}
.settings-catalog-row {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .9fr);
    gap: 12px;
    align-items: center;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: var(--surface-2);
}
.settings-catalog-main strong,
.settings-related-link strong,
.settings-side-block strong,
.settings-mini-stat-card strong { display: block; }
.settings-catalog-main strong { font-size: 14px; margin-bottom: 4px; }
.settings-catalog-meta {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    align-items: center;
}
.settings-catalog-meta span,
.settings-catalog-meta em {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 10px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--line);
    font-style: normal;
    font-size: 12px;
    color: #49536a;
}
.settings-right-rail,
.settings-main-column { display: grid; gap: 14px; align-content: start; }
.settings-mini-stat-card span,
.settings-side-label {
    color: var(--muted);
    font-size: 12px;
    margin-bottom: 6px;
}
.settings-mini-stat-card strong { font-size: 20px; margin-bottom: 4px; }
.settings-workspace-grid {
    display: grid;
    grid-template-columns: minmax(260px, .5fr) minmax(0, 1.5fr);
    gap: 14px;
}
.settings-sidebar-panel { display: grid; gap: 14px; align-content: start; }
.settings-side-block.compact-list { gap: 10px; display: grid; }
.settings-related-link {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    background: var(--surface-2);
}
.settings-related-link em {
    font-style: normal;
    font-size: 11px;
    color: var(--primary);
    font-weight: 800;
    white-space: nowrap;
}
.settings-summary-grid.refined {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.settings-dynamic-table.refined th,
.settings-dynamic-table.refined td { padding-top: 12px; padding-bottom: 12px; }
.fit-column { width: 1%; white-space: nowrap; }
.settings-note-panel.refined p { font-size: 13px; }

@media (max-width: 1280px) {
    .settings-category-tabs,
    .settings-category-grid,
    .settings-summary-grid.refined { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-catalog-grid,
    .settings-workspace-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    .settings-page-head { flex-direction: column; align-items: stretch; }
    .settings-category-tabs,
    .settings-category-grid,
    .settings-summary-grid.refined,
    .settings-catalog-meta,
    .settings-catalog-row { grid-template-columns: 1fr; }
    .settings-catalog-row { align-items: stretch; }
}
@media (max-width: 640px) {
    .settings-subnav-strip { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
    .settings-subnav-link { flex: 0 0 auto; }
}

/* Phase 1.12 professional settings redesign */
.settings-pro-shell { display: grid; gap: 14px; }
.settings-pro-head {
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.settings-pro-title span {
    display: inline-flex;
    margin-bottom: 4px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
}
.settings-pro-title h1 {
    margin: 0 0 4px;
    font-size: 20px;
    line-height: 1.5;
}
.settings-pro-title p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.8;
}
.settings-pro-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.settings-pro-nav {
    padding: 12px;
    display: grid;
    gap: 10px;
}
.settings-pro-nav-groups {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
}
.settings-pro-nav-group {
    min-height: 62px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface-2);
    display: grid;
    align-content: center;
    gap: 3px;
}
.settings-pro-nav-group strong { font-size: 13px; line-height: 1.5; }
.settings-pro-nav-group small {
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.settings-pro-nav-group.active {
    background: var(--primary-soft);
    border-color: rgba(79,70,229,.22);
    color: var(--primary);
}
.settings-pro-nav-subtabs {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    padding-top: 10px;
    border-top: 1px solid var(--line);
}
.settings-pro-subtab {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 11px;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.settings-pro-subtab.active {
    background: var(--primary-soft);
    color: var(--primary);
    border-color: rgba(79,70,229,.22);
}
.settings-pro-catalog-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr);
    gap: 14px;
}
.settings-pro-finder,
.settings-pro-help-card,
.settings-pro-side-nav,
.settings-pro-table-card,
.settings-pro-bottom-note { padding: 16px; }
.settings-pro-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.settings-pro-card-head strong { display: block; font-size: 16px; }
.settings-pro-card-head small { color: var(--muted); font-size: 12px; line-height: 1.7; }
.settings-pro-category-board {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.settings-pro-category-card {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-2);
    padding: 13px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
}
.settings-pro-category-card strong { display: block; font-size: 14px; margin-bottom: 4px; }
.settings-pro-category-card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.7;
    font-size: 12px;
}
.settings-pro-category-card span {
    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
}
.settings-pro-list {
    display: grid;
    gap: 8px;
}
.settings-pro-list-row {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(230px, .65fr);
    gap: 12px;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 12px 13px;
}
.settings-pro-list-row strong { display: block; font-size: 13px; margin-bottom: 4px; }
.settings-pro-list-row small,
.settings-pro-help-card p,
.settings-pro-side-note p,
.settings-pro-bottom-note p {
    color: var(--muted);
    line-height: 1.8;
    font-size: 12px;
}
.settings-pro-row-meta {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}
.settings-pro-row-meta span,
.settings-pro-row-meta em {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    padding: 0 9px;
    border-radius: 10px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    color: #4b5565;
    font-size: 11px;
    font-style: normal;
    font-weight: 750;
}
.settings-pro-help-rail {
    display: grid;
    gap: 14px;
    align-content: start;
}
.settings-pro-help-card span,
.settings-pro-metric-card span,
.settings-pro-side-head span {
    display: block;
    margin-bottom: 6px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}
.settings-pro-help-card strong,
.settings-pro-metric-card strong,
.settings-pro-side-head strong {
    display: block;
    line-height: 1.7;
}
.settings-pro-workspace {
    display: grid;
    grid-template-columns: minmax(248px, .42fr) minmax(0, 1.58fr);
    gap: 14px;
    align-items: start;
}
.settings-pro-side-nav {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 14px;
}
.settings-pro-side-head {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.settings-pro-side-links {
    display: grid;
    gap: 8px;
}
.settings-pro-side-link {
    min-height: 54px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--surface-2);
    padding: 10px 11px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.settings-pro-side-link strong { display: block; font-size: 13px; margin-bottom: 3px; }
.settings-pro-side-link small { color: var(--muted); font-size: 11px; }
.settings-pro-side-link span {
    color: var(--muted);
    font-weight: 900;
}
.settings-pro-side-link.active {
    background: var(--primary-soft);
    border-color: rgba(79,70,229,.22);
}
.settings-pro-side-link.active span,
.settings-pro-side-link.active strong { color: var(--primary); }
.settings-pro-side-note {
    padding: 12px;
    border-radius: 14px;
    background: var(--surface-2);
    border: 1px dashed var(--line-strong);
}
.settings-pro-side-note strong,
.settings-pro-bottom-note strong { display: block; margin-bottom: 5px; }
.settings-pro-main {
    display: grid;
    gap: 14px;
    min-width: 0;
}
.settings-pro-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.settings-pro-metric-card {
    padding: 13px 14px;
    min-width: 0;
}
.settings-pro-metric-card strong {
    font-size: 14px;
    overflow-wrap: anywhere;
}
.settings-pro-metric-card.technical strong {
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
    direction: ltr;
    text-align: right;
}
.settings-pro-table-wrap { max-width: 100%; }
.settings-pro-table th,
.settings-pro-table td {
    vertical-align: middle;
    padding-top: 12px;
    padding-bottom: 12px;
}
.settings-pro-primary-cell strong {
    display: block;
    font-size: 13px;
    line-height: 1.7;
}
.settings-fit-col {
    width: 1%;
    white-space: nowrap;
}
.settings-pro-bottom-note { padding-top: 13px; padding-bottom: 13px; }

@media (max-width: 1280px) {
    .settings-pro-nav-groups,
    .settings-pro-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .settings-pro-catalog-layout,
    .settings-pro-workspace { grid-template-columns: 1fr; }
    .settings-pro-side-nav { position: static; }
}
@media (max-width: 820px) {
    .settings-pro-head,
    .settings-pro-card-head { flex-direction: column; align-items: stretch; }
    .settings-pro-nav-groups,
    .settings-pro-category-board,
    .settings-pro-metrics,
    .settings-pro-list-row { grid-template-columns: 1fr; }
    .settings-pro-nav-subtabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 3px; }
    .settings-pro-subtab { flex: 0 0 auto; }
    .settings-pro-row-meta { justify-content: flex-start; }
}

/* Phase 1.12 - compact settings table fix */
.settings-pro-table-wrap,
.settings-table-wrap {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}
.settings-pro-table,
.settings-dynamic-table.refined {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}
.settings-pro-table th,
.settings-pro-table td,
.settings-dynamic-table.refined th,
.settings-dynamic-table.refined td {
    padding: 8px 9px;
    font-size: 12px;
    line-height: 1.65;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}
.settings-pro-table th,
.settings-dynamic-table.refined th {
    font-size: 11px;
    font-weight: 850;
    color: var(--muted);
}
.settings-pro-table td span,
.settings-dynamic-table.refined td span {
    display: inline;
    color: #475467;
}
.settings-pro-primary-cell strong,
.settings-main-cell strong {
    font-size: 12.5px;
    line-height: 1.65;
    max-width: 100%;
    overflow-wrap: anywhere;
}
.settings-pro-table th:nth-child(1),
.settings-pro-table td:nth-child(1),
.settings-dynamic-table.refined th:nth-child(1),
.settings-dynamic-table.refined td:nth-child(1) {
    width: 28%;
}
.settings-pro-table th:nth-child(2),
.settings-pro-table td:nth-child(2),
.settings-dynamic-table.refined th:nth-child(2),
.settings-dynamic-table.refined td:nth-child(2) {
    width: 20%;
}
.settings-pro-table th:nth-child(3),
.settings-pro-table td:nth-child(3),
.settings-dynamic-table.refined th:nth-child(3),
.settings-dynamic-table.refined td:nth-child(3) {
    width: 22%;
}
.settings-pro-table th:nth-child(4),
.settings-pro-table td:nth-child(4),
.settings-dynamic-table.refined th:nth-child(4),
.settings-dynamic-table.refined td:nth-child(4) {
    width: 18%;
}
.settings-pro-table th.settings-fit-col,
.settings-pro-table td.settings-fit-col,
.settings-dynamic-table.refined th.fit-column,
.settings-dynamic-table.refined td.fit-column {
    width: 72px;
    min-width: 72px;
    max-width: 72px;
    text-align: center;
    white-space: nowrap;
}
.settings-pro-table .mini-action-link,
.settings-dynamic-table.refined .mini-action-link {
    min-height: 30px;
    padding: 0 9px;
    border-radius: 9px;
    font-size: 11px;
}
.settings-pro-table-card,
.settings-table-card {
    overflow: hidden;
}
.settings-pro-card-head.with-action,
.compact-card-head.with-action {
    align-items: center;
}
.settings-pro-card-head .settings-search-input,
.compact-card-head .settings-search-input {
    height: 34px;
    width: min(230px, 100%);
}
@media (max-width: 980px) {
    .settings-pro-table-wrap,
    .settings-table-wrap {
        overflow-x: auto;
    }
    .settings-pro-table,
    .settings-dynamic-table.refined {
        min-width: 720px;
    }
}

/* Phase 1.12 - technical id cleanup and checklist settings polish */
.settings-pro-metric-card.technical { display: none !important; }
.settings-pro-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.settings-pro-table th:nth-child(1),
.settings-pro-table td:nth-child(1) { width: 24%; }
.settings-pro-table th:nth-child(2),
.settings-pro-table td:nth-child(2) { width: 18%; }
.settings-pro-table th:nth-child(3),
.settings-pro-table td:nth-child(3) { width: 30%; }
.settings-pro-table th:nth-child(4),
.settings-pro-table td:nth-child(4) { width: 22%; }
.settings-pro-table td span,
.settings-pro-table td strong {
    overflow-wrap: anywhere;
    word-break: normal;
}
@media (max-width: 900px) {
    .settings-pro-metrics { grid-template-columns: 1fr !important; }
}

/* Contract/finance document patch - based on finance and contract team notes */
.contracts-office-shell .contracts-master-toolbar { align-items: center; }
.office-contract-kpis article { min-height: 78px; }
.compact-contract-table-wrap { overflow: hidden; }
.office-contract-table { table-layout: fixed; width: 100%; }
.office-contract-table th,
.office-contract-table td { padding: 10px 9px; font-size: 12px; vertical-align: middle; }
.office-contract-table th { white-space: nowrap; }
.contract-col-client { width: 23%; }
.contract-col-deadline { width: 13%; }
.contract-col-progress { width: 12%; }
.contract-col-products { width: 18%; }
.contract-col-finance { width: 10%; }
.contract-col-status { width: 14%; }
.contract-col-action { width: 10%; }
.contract-client-cell strong { font-size: 13px; line-height: 1.5; }
.contract-client-cell small,
.contract-service-hint,
.contract-progress-mini span,
.contract-finance-mini small,
.contract-deadline-cell small { color: var(--muted); font-size: 11px; line-height: 1.6; }
.small-deadline { display: grid; gap: 4px; }
.contract-progress-mini { display: grid; gap: 5px; }
.contract-progress-mini span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    border-radius: 999px;
    background: var(--surface-3);
    padding: 0 8px;
    width: fit-content;
}
.compact-product-cell { max-width: 100%; justify-content: flex-start; }
.contract-service-hint { display: block; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.contract-finance-mini { display: grid; gap: 2px; justify-items: start; }
.contract-finance-mini strong { font-size: 18px; color: var(--primary); }

.compact-contract-hero { gap: 14px; }
.contract-office-meta { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.contract-tabs-sticky { position: sticky; top: 64px; z-index: 12; }
.compact-detail-grid div { min-height: 72px; }
.subtle-list span { background: var(--surface-2); border-color: var(--line); color: var(--text); }
.contract-inner-table-wrap { max-width: 100%; overflow: hidden; }
.compact-office-table { table-layout: fixed; width: 100%; }
.compact-office-table th,
.compact-office-table td { padding: 9px 8px; font-size: 12px; vertical-align: middle; }
.compact-office-table td strong { display: block; font-size: 12px; line-height: 1.6; }
.compact-office-table td small { display: block; color: var(--muted); font-size: 11px; line-height: 1.6; }
.contract-service-table th:nth-child(1), .contract-service-table td:nth-child(1) { width: 12%; }
.contract-service-table th:nth-child(2), .contract-service-table td:nth-child(2) { width: 11%; }
.contract-service-table th:nth-child(3), .contract-service-table td:nth-child(3) { width: 20%; }
.contract-service-table th:nth-child(4), .contract-service-table td:nth-child(4) { width: 18%; }
.contract-service-table th:nth-child(5), .contract-service-table td:nth-child(5),
.contract-service-table th:nth-child(6), .contract-service-table td:nth-child(6) { width: 11%; white-space: nowrap; }
.contract-service-table th:nth-child(7), .contract-service-table td:nth-child(7) { width: 17%; }
.contract-finance-table th:nth-child(1), .contract-finance-table td:nth-child(1) { width: 13%; }
.contract-finance-table th:nth-child(2), .contract-finance-table td:nth-child(2) { width: 17%; }
.contract-finance-table th:nth-child(3), .contract-finance-table td:nth-child(3) { width: 13%; }
.contract-finance-table th:nth-child(4), .contract-finance-table td:nth-child(4) { width: 18%; }
.contract-finance-table th:nth-child(5), .contract-finance-table td:nth-child(5) { width: 16%; }
.contract-finance-table th:nth-child(6), .contract-finance-table td:nth-child(6) { width: 12%; }
.contract-finance-table th:nth-child(7), .contract-finance-table td:nth-child(7) { width: 11%; }
.contract-letter-table th:nth-child(1), .contract-letter-table td:nth-child(1) { width: 13%; }
.contract-letter-table th:nth-child(2), .contract-letter-table td:nth-child(2),
.contract-letter-table th:nth-child(3), .contract-letter-table td:nth-child(3) { width: 12%; }
.contract-letter-table th:nth-child(4), .contract-letter-table td:nth-child(4) { width: 35%; }
.contract-letter-table th:nth-child(5), .contract-letter-table td:nth-child(5) { width: 16%; }
.contract-letter-table th:nth-child(6), .contract-letter-table td:nth-child(6) { width: 12%; }
.letter-file-chip {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    min-height: 26px;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1280px) {
    .compact-contract-table-wrap,
    .contract-inner-table-wrap { overflow-x: auto; }
    .office-contract-table { min-width: 980px; }
    .compact-office-table { min-width: 920px; }
    .contract-office-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .contract-office-meta { grid-template-columns: 1fr; }
    .contract-tabs-sticky { position: static; }
}

/* Phase 2.0 - Organizational access core */
.access-core-shell { display: grid; gap: 14px; }
.access-core-head {
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.access-core-head h1 { margin: 6px 0 6px; font-size: 22px; }
.access-core-head p { margin: 0; color: var(--muted); line-height: 1.9; font-size: 13px; }
.access-source-badge {
    min-width: 180px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 16px;
    padding: 12px 14px;
    display: grid;
    gap: 5px;
}
.access-source-badge small { color: var(--muted); font-size: 12px; }
.access-source-badge strong { font-size: 14px; }
.access-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.access-summary-card { padding: 14px 16px; display: grid; gap: 6px; }
.access-summary-card span { color: var(--muted); font-size: 12px; }
.access-summary-card strong { font-size: 24px; line-height: 1; }
.access-summary-card.danger strong { color: var(--danger); }
.access-two-column-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
    gap: 14px;
}
.access-two-column-grid.bottom-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.access-table-card,
.access-list-card { padding: 16px; }
.access-side-stack { display: grid; gap: 14px; align-content: start; }
.access-table-wrap { max-width: 100%; }
.access-compact-table,
.access-matrix-table { table-layout: fixed; min-width: 0; }
.access-compact-table th,
.access-compact-table td,
.access-matrix-table th,
.access-matrix-table td {
    padding: 10px 9px;
    font-size: 12px;
    vertical-align: middle;
}
.access-main-cell strong { display: block; font-size: 13px; line-height: 1.6; }
.access-main-cell small { display: block; color: var(--muted); font-size: 11px; line-height: 1.6; }
.access-main-cell.narrow { width: 190px; }
.access-line-list { display: grid; gap: 8px; }
.access-line-list.compact { gap: 7px; }
.access-line-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 11px 12px;
}
.access-line-item strong { display: block; font-size: 13px; }
.access-line-item small { display: block; color: var(--muted); font-size: 11px; line-height: 1.7; }
.access-line-item span {
    flex: 0 0 auto;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--line);
    padding: 4px 8px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.access-matrix-table th:not(:first-child),
.access-matrix-table td:not(:first-child) { text-align: center; width: 76px; }
.access-check-cell { text-align: center; }
.access-check {
    width: 26px;
    height: 26px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 900;
}
.access-check.yes { background: var(--success-soft); color: var(--success); }
.access-check.no { background: var(--surface-3); color: var(--muted); }
.access-sensitive-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.access-sensitive-item {
    border: 1px solid rgba(220,38,38,.14);
    background: var(--danger-soft);
    border-radius: 14px;
    padding: 12px;
}
.access-sensitive-item strong { display: block; font-size: 13px; line-height: 1.7; }
.access-sensitive-item small { color: var(--muted); font-size: 11px; direction: ltr; display: block; text-align: left; margin-top: 4px; }
.access-workflow-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.access-workflow-item {
    border: 1px solid var(--line);
    background: var(--surface-2);
    border-radius: 14px;
    padding: 12px;
}
.access-workflow-item span { display: block; color: var(--primary); font-size: 12px; font-weight: 800; margin-bottom: 7px; }
.access-workflow-item strong { display: block; font-size: 13px; line-height: 1.8; font-weight: 600; }

@media (max-width: 1280px) {
    .access-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .access-two-column-grid,
    .access-two-column-grid.bottom-grid { grid-template-columns: 1fr; }
    .access-workflow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .access-core-head { flex-direction: column; align-items: stretch; }
    .access-summary-grid,
    .access-sensitive-grid,
    .access-workflow-grid { grid-template-columns: 1fr; }
    .access-table-wrap { overflow-x: auto; }
    .access-matrix-table { min-width: 920px; }
}

/* Phase 2.0 corrections - real user management */
.compact-access-head { padding: 14px 16px; }
.compact-summary-grid .access-summary-card { padding: 11px 13px; }
.full-width-card { width: 100%; }
.users-action-table { table-layout: fixed; width: 100%; }
.users-action-table th:nth-child(1),
.users-action-table td:nth-child(1) { width: 22%; }
.users-action-table th:nth-child(2),
.users-action-table td:nth-child(2) { width: 11%; }
.users-action-table th:nth-child(3),
.users-action-table td:nth-child(3) { width: 13%; }
.users-action-table th:nth-child(4),
.users-action-table td:nth-child(4) { width: 13%; }
.users-action-table th:nth-child(5),
.users-action-table td:nth-child(5) { width: 12%; }
.users-action-table th:nth-child(6),
.users-action-table td:nth-child(6) { width: 9%; }
.users-action-table th:nth-child(7),
.users-action-table td:nth-child(7) { width: 20%; }
.user-name-cell small { direction: ltr; text-align: right; }
.user-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.inline-delete-form { display: inline; margin: 0; }
.mini-action-link.danger { color: var(--danger); background: var(--danger-soft); border-color: rgba(220,38,38,.18); }
.access-message {
    padding: 10px 14px;
    border-radius: 14px;
    border: 1px solid var(--line);
    font-size: 13px;
    font-weight: 700;
}
.access-message.success { background: var(--success-soft); color: var(--success); border-color: rgba(22,163,74,.18); }
.access-message.danger { background: var(--danger-soft); color: var(--danger); border-color: rgba(220,38,38,.18); }
.access-scope-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 9px;
    border-radius: 999px;
    background: var(--surface-3);
    color: #475467;
    font-size: 11px;
    font-weight: 800;
}
.access-inline-panel { position: relative; display: inline-block; }
.access-inline-panel > summary { list-style: none; }
.access-inline-panel > summary::-webkit-details-marker { display: none; }
.access-inline-panel.create-panel { display: block; }
.access-inline-panel.create-panel > summary { display: inline-flex; }
.access-user-form {
    position: absolute;
    z-index: 50;
    inset-inline-end: 0;
    top: calc(100% + 8px);
    width: min(780px, calc(100vw - 48px));
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: var(--shadow-md);
    padding: 14px;
    text-align: right;
}
.create-panel .access-user-form { width: min(960px, calc(100vw - 48px)); }
.row-panel .access-user-form { width: min(760px, calc(100vw - 48px)); }
.access-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.access-form-grid.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.access-form-grid label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
}
.access-form-grid input,
.access-form-grid select {
    width: 100%;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 0 10px;
    background: #fff;
    outline: none;
    color: var(--text);
}
.access-form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
}
.access-form-actions small,
.access-sensitive-preview small { color: var(--muted); font-size: 11px; line-height: 1.7; }
.access-sensitive-preview {
    margin: 10px 0;
    padding: 10px 12px;
    border-radius: 14px;
    background: var(--surface-2);
    border: 1px solid var(--line);
    display: grid;
    gap: 4px;
}
.access-sensitive-preview strong { font-size: 12px; }
.compact-workflow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1180px) {
    .users-action-table { min-width: 980px; }
    .access-form-grid,
    .access-form-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .access-user-form { inset-inline: 0 auto; width: calc(100vw - 28px); }
    .access-form-grid,
    .access-form-grid.compact { grid-template-columns: 1fr; }
    .access-form-actions { align-items: stretch; flex-direction: column; }
}

/* Access core UX V4 - Google-like users table and standard modal */
.access-core-ux-v4 { gap: 14px; }
.access-core-ux-v4 .access-users-card { padding: 0; overflow: visible; }
.access-card-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
}
.access-card-toolbar strong { display: block; font-size: 17px; color: var(--text); }
.access-card-toolbar small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.access-toolbar-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.access-data-source {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 0 11px;
    border-radius: 999px;
    background: var(--surface-3);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}
.access-users-table-wrap { width: 100%; overflow-x: auto; }
.google-users-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 13px;
    min-width: 760px;
}
.google-users-table th {
    height: 46px;
    padding: 0 16px;
    text-align: right;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    background: #fbfcfe;
    border-bottom: 1px solid var(--line);
    white-space: nowrap;
}
.google-users-table td {
    height: 66px;
    padding: 10px 16px;
    border-bottom: 1px solid #eef0f4;
    color: #263244;
    vertical-align: middle;
}
.google-users-table tbody tr { transition: background .16s ease, box-shadow .16s ease; }
.google-users-table tbody tr:hover { background: #f8fbff; }
.google-user-cell { display: flex; align-items: center; gap: 12px; min-width: 0; }
.google-user-cell strong { display: block; font-size: 14px; color: var(--text); line-height: 1.5; }
.google-user-cell small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
    max-width: 250px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.google-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #edf2ff;
    color: #3b5bdb;
    font-weight: 900;
    flex: 0 0 auto;
}
.role-chip-soft {
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    background: #f5f7fb;
    color: #344054;
    border: 1px solid #e8ebf2;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.google-users-table .action-col { width: 72px; text-align: center; }
.row-kebab-menu { position: relative; display: inline-block; }
.row-kebab-menu summary {
    list-style: none;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    background: transparent;
    color: #667085;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.row-kebab-menu summary::-webkit-details-marker { display: none; }
.row-kebab-menu[open] summary,
.row-kebab-menu summary:hover { background: #f2f4f7; border-color: #e4e7ec; color: #344054; }
.row-kebab-panel {
    position: absolute;
    top: calc(100% + 6px);
    inset-inline-end: 0;
    width: 176px;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
    z-index: 50;
    display: grid;
    gap: 2px;
}
.row-kebab-panel button {
    width: 100%;
    height: 36px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    text-align: right;
    padding: 0 10px;
    color: #344054;
    font-size: 13px;
    font-weight: 700;
}
.row-kebab-panel button:hover { background: #f5f7fb; }
.row-kebab-panel button.danger { color: var(--danger); }
.standard-modal[hidden] { display: none !important; }
.standard-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    padding: 20px;
}
.standard-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(16, 24, 40, .22);
    backdrop-filter: blur(4px);
}
.standard-modal-card {
    position: relative;
    width: min(820px, 100%);
    max-height: calc(100vh - 42px);
    overflow: hidden;
    background: #fff;
    border: 1px solid rgba(228, 231, 236, .96);
    border-radius: 24px;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .24);
    animation: modal-pop .16s ease-out;
}
.small-modal-card { width: min(480px, 100%); }
@keyframes modal-pop { from { transform: translateY(8px) scale(.98); opacity: .72; } to { transform: translateY(0) scale(1); opacity: 1; } }
.standard-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 17px 20px;
    border-bottom: 1px solid var(--line);
}
.standard-modal-head strong { display: block; font-size: 17px; color: var(--text); }
.standard-modal-head small { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; }
.modal-x {
    width: 38px;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 50%;
    background: #fff;
    color: #667085;
    font-size: 24px;
    line-height: 1;
}
.modal-x:hover { background: #f5f7fb; color: var(--text); }
.standard-modal-body { padding: 18px 20px; overflow: auto; max-height: calc(100vh - 190px); }
.modal-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.modal-form-grid label { display: grid; gap: 7px; color: #344054; font-size: 12px; font-weight: 800; }
.modal-form-grid input,
.modal-form-grid select {
    width: 100%;
    height: 42px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    padding: 0 12px;
    outline: none;
    color: var(--text);
}
.modal-form-grid input:focus,
.modal-form-grid select:focus {
    border-color: rgba(79,70,229,.35);
    box-shadow: 0 0 0 4px rgba(79,70,229,.08);
}
.standard-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px 18px;
    border-top: 1px solid var(--line);
    background: #fbfcfe;
}
.modal-btn {
    min-width: 96px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    color: #344054;
    font-weight: 800;
}
.modal-btn.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.modal-btn.danger { background: var(--danger); border-color: var(--danger); color: #fff; }
.access-detail-grid {
    padding: 18px 20px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.access-detail-grid div {
    min-height: 62px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcfe;
    display: grid;
    gap: 4px;
}
.access-detail-grid span { color: var(--muted); font-size: 12px; }
.access-detail-grid strong { font-size: 13px; color: var(--text); overflow-wrap: anywhere; }
.access-modal-note,
.modal-warning-text {
    margin: 14px 0 0;
    padding: 12px 14px;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    line-height: 1.9;
}
.modal-warning-text { background: var(--danger-soft); color: #7f1d1d; border-color: rgba(220,38,38,.12); }
@media (max-width: 760px) {
    .access-card-toolbar { flex-direction: column; align-items: stretch; }
    .access-toolbar-actions { justify-content: space-between; }
    .modal-form-grid,
    .access-detail-grid { grid-template-columns: 1fr; }
    .standard-modal { padding: 12px; }
}

/* Phase 2.0 v6 - access core micro UX fixes */
.access-core-ux-v4 .access-toolbar-actions { justify-content: flex-end; }
.standard-modal-actions { padding: 12px 18px 14px; gap: 7px; }
.standard-modal .modal-btn {
    min-width: 78px;
    height: 34px;
    border-radius: 10px;
    padding: 0 13px;
    font-size: 12px;
    line-height: 1;
}
.standard-modal .modal-btn.primary,
.standard-modal .modal-btn.danger { box-shadow: none; }
.standard-modal-head { padding: 14px 18px; }
.standard-modal-body { padding: 15px 18px; }
.modal-x { width: 34px; height: 34px; font-size: 22px; }
.row-kebab-panel { z-index: 2100; }
.google-users-table .action-col { width: 58px; }
.google-users-table th,
.google-users-table td { padding-inline: 14px; }


/* Phase 2.0 v7 - minimal Material-style icons and cleaner user forms */
.material-inline-icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: middle;
    fill: currentColor;
    flex: 0 0 auto;
}
.icon-btn,
.row-kebab-panel button,
.standard-modal-head strong,
.access-card-toolbar strong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}
.access-card-toolbar strong,
.standard-modal-head strong { justify-content: flex-start; }
.access-card-toolbar strong .material-inline-icon,
.standard-modal-head strong .material-inline-icon { color: var(--primary); }
.toolbar-button.icon-btn { min-height: 38px; padding-inline: 14px; }
.toolbar-button.icon-btn .material-inline-icon { width: 17px; height: 17px; }
.modal-btn.icon-btn .material-inline-icon { width: 16px; height: 16px; }
.modal-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
}
.modal-x .material-inline-icon { width: 18px; height: 18px; }
.row-kebab-menu summary {
    font-size: 0;
}
.row-kebab-menu summary .material-inline-icon { width: 21px; height: 21px; }
.row-kebab-panel { width: 190px; }
.row-kebab-panel button {
    justify-content: flex-start;
    gap: 9px;
    direction: rtl;
}
.row-kebab-panel button .material-inline-icon {
    width: 17px;
    height: 17px;
    color: #667085;
}
.row-kebab-panel button.danger .material-inline-icon { color: var(--danger); }
.modal-form-grid input::placeholder { color: transparent; }

/* Phase 2.0 v8 - user table pagination and cleaner modal actions */
.access-users-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--line);
    background: #fff;
}
.pagination-summary {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}
.pagination-controls {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.pagination-controls label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}
.pagination-controls select {
    height: 34px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    padding: 0 10px;
    color: var(--text);
    outline: none;
}
.pagination-controls button[disabled] {
    opacity: .45;
    cursor: not-allowed;
}
.standard-modal .modal-btn,
.standard-modal-actions .modal-btn {
    min-width: auto;
    height: 36px;
    padding: 0 14px;
    border-radius: 10px;
    font-size: 12px;
}
.google-users-table tbody tr[style*="display: none"] {
    display: none !important;
}
@media (max-width: 700px) {
    .access-users-pagination {
        align-items: stretch;
        flex-direction: column;
    }
    .pagination-controls {
        justify-content: space-between;
    }
}

/* Phase 2.0 v10 - robust select arrow and RTL form controls */
.access-core-shell select,
.access-modal-card select,
.access-user-form select,
.modal-card select,
select.form-control {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20' viewBox='0 -960 960 960' width='20' fill='%23667085'%3E%3Cpath d='M480-344 240-584l56-56 184 184 184-184 56 56-240 240Z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 12px center;
    background-size: 18px 18px;
    padding-left: 40px !important;
    padding-right: 12px !important;
    min-height: 38px;
    line-height: 1.7;
}
.access-core-shell select:focus,
.access-modal-card select:focus,
.access-user-form select:focus,
.modal-card select:focus {
    border-color: rgba(66, 133, 244, .45);
    box-shadow: 0 0 0 3px rgba(66, 133, 244, .10);
    outline: none;
}
.access-core-shell select::-ms-expand { display: none; }

/* Phase 2.0 v11 - final RTL select alignment */
.access-core-shell select,
.standard-modal-card select,
.access-modal-card select,
.access-user-form select,
.modal-form-grid select {
    box-sizing: border-box;
    background-position: left 14px center !important;
    background-size: 18px 18px !important;
    padding-inline-start: 44px !important;
    padding-inline-end: 12px !important;
    text-align: right;
    text-align-last: right;
}

/* Phase 2.0 V12 - users table role/username refinement */
.google-users-table .google-user-cell small.user-role-subtitle {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #f6f7fb;
    color: #6b7280;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.7;
}
.google-users-table .username-cell {
    direction: ltr;
    unicode-bidi: plaintext;
    display: inline-flex;
    align-items: center;
    max-width: 180px;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 999px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    color: #475467;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.google-users-table th:nth-child(2),
.google-users-table td:nth-child(2) {
    width: 180px;
    max-width: 180px;
}
.google-users-table th:nth-child(3),
.google-users-table td:nth-child(3) {
    width: 170px;
    max-width: 170px;
}
.google-users-table th:nth-child(4),
.google-users-table td:nth-child(4) {
    width: 110px;
    max-width: 110px;
}
@media (max-width: 900px) {
    .google-users-table th:nth-child(2),
    .google-users-table td:nth-child(2),
    .google-users-table th:nth-child(3),
    .google-users-table td:nth-child(3),
    .google-users-table th:nth-child(4),
    .google-users-table td:nth-child(4) {
        width: auto;
        max-width: none;
    }
}


/* Phase 2.0 V13 - soft user status colors */
.google-users-table .user-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 74px;
    min-height: 28px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.7;
    border: 1px solid transparent;
}
.google-users-table .user-status-pill::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: currentColor;
    opacity: .82;
}
.google-users-table .user-status-pill.active {
    background: #ecfdf3;
    color: #067647;
    border-color: #abefc6;
}
.google-users-table .user-status-pill.inactive {
    background: #f8fafc;
    color: #667085;
    border-color: #e4e7ec;
}
.google-users-table tr:has(.user-status-pill.inactive) {
    background: linear-gradient(90deg, rgba(248,250,252,.72), rgba(255,255,255,1));
}
.google-users-table tr:has(.user-status-pill.inactive) .google-user-cell strong {
    color: #667085;
}

/* Phase 2.0 V14 - row kebab menu must float above table scroll */
.access-users-table-wrap {
    overflow-x: auto;
    overflow-y: visible;
}
.row-kebab-menu .row-kebab-panel {
    position: fixed !important;
    top: var(--row-menu-top, 0);
    left: var(--row-menu-left, 0);
    right: auto !important;
    bottom: auto !important;
    z-index: 6000;
    transform: none !important;
    max-width: calc(100vw - 16px);
}
.row-kebab-menu:not([open]) .row-kebab-panel {
    display: none !important;
}
.row-kebab-menu[open] .row-kebab-panel {
    display: grid !important;
}
.row-kebab-panel::before {
    content: '';
    position: absolute;
    top: -6px;
    inset-inline-end: 14px;
    width: 10px;
    height: 10px;
    background: #fff;
    border-top: 1px solid var(--line);
    border-right: 1px solid var(--line);
    transform: rotate(-45deg);
}
.row-kebab-panel.open-up::before {
    top: auto;
    bottom: -6px;
    transform: rotate(135deg);
}

/* Phase 2.0 V15 - proportional users table, cleaner text cells, precise action menu */
.google-users-table {
    table-layout: fixed;
    min-width: 680px;
}
.google-users-table th,
.google-users-table td {
    overflow: hidden;
}
.google-users-table th:nth-child(1),
.google-users-table td:nth-child(1) {
    width: 34%;
    max-width: 34%;
}
.google-users-table th:nth-child(2),
.google-users-table td:nth-child(2) {
    width: 20%;
    max-width: 20%;
}
.google-users-table th:nth-child(3),
.google-users-table td:nth-child(3) {
    width: 20%;
    max-width: 20%;
}
.google-users-table th:nth-child(4),
.google-users-table td:nth-child(4) {
    width: 14%;
    max-width: 14%;
}
.google-users-table th:nth-child(5),
.google-users-table td:nth-child(5),
.google-users-table .action-col {
    width: 66px;
    max-width: 66px;
    min-width: 66px;
    text-align: center;
}
.google-users-table .google-user-cell {
    gap: 10px;
}
.google-users-table .google-user-cell > div {
    min-width: 0;
}
.google-users-table .google-user-cell strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.google-users-table .google-user-cell small.user-role-subtitle {
    display: block;
    width: auto;
    max-width: 100%;
    margin-top: 2px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #8a93a3;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.google-users-table .username-cell {
    direction: ltr;
    unicode-bidi: plaintext;
    display: inline-block;
    max-width: 100%;
    min-height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    border: 0;
    color: #475467;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.google-users-table td:nth-child(3) {
    color: #475467;
    font-size: 13px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.row-kebab-menu .row-kebab-panel {
    width: 180px;
}
.row-kebab-panel::before {
    inset-inline-start: 12px;
    inset-inline-end: auto;
}
.row-kebab-panel.open-up::before {
    inset-inline-start: 12px;
    inset-inline-end: auto;
}
@media (max-width: 900px) {
    .google-users-table {
        min-width: 640px;
    }
    .google-users-table th:nth-child(1),
    .google-users-table td:nth-child(1) { width: 36%; max-width: 36%; }
    .google-users-table th:nth-child(2),
    .google-users-table td:nth-child(2) { width: 20%; max-width: 20%; }
    .google-users-table th:nth-child(3),
    .google-users-table td:nth-child(3) { width: 18%; max-width: 18%; }
    .google-users-table th:nth-child(4),
    .google-users-table td:nth-child(4) { width: 14%; max-width: 14%; }
}

/* Phase 2.0 V16 - users table alignment refinement */
.google-users-table th,
.google-users-table td {
    text-align: center;
}
.google-users-table th:first-child,
.google-users-table td:first-child {
    text-align: right;
}
.google-users-table td:not(:first-child) .username-cell {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin-inline: auto;
    text-align: center;
}
.google-users-table td:not(:first-child) .user-status-pill {
    margin-inline: auto;
}
.google-users-table td:nth-child(3) {
    text-align: center;
}
.google-users-table .action-col {
    text-align: center;
}

/* Phase 2.0 V17 - fix physical arrow position for floating row action menu */
.row-kebab-panel::before,
.row-kebab-panel.open-up::before {
    left: 14px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
}

/* Phase 2.0 V18 - remove row action menu arrow completely */
.row-kebab-panel::before,
.row-kebab-panel.open-up::before {
    content: none !important;
    display: none !important;
    border: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* Phase 2.2 - Real Auth UI */
.real-auth-page {
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}
.real-auth-shell {
    width: min(560px, 100%);
}
.real-auth-card {
    background: #fff;
    border: 1px solid rgba(226, 232, 240, .9);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .10);
}
.auth-brand-row {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px;
}
.auth-brand-row h1 {
    margin: 4px 0 0;
    font-size: 22px;
}
.real-auth-intro {
    margin-bottom: 18px;
}
.real-login-form {
    display: grid;
    gap: 10px;
}
.real-login-form label {
    color: #475569;
    font-size: 13px;
    font-weight: 700;
    margin-top: 4px;
}
.auth-submit-button {
    margin-top: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.auth-error-box {
    background: #fef2f2;
    color: #b42318;
    border: 1px solid #fecaca;
    border-radius: 14px;
    padding: 11px 13px;
    font-size: 13px;
    line-height: 1.8;
    margin-bottom: 14px;
}
.auth-note-box {
    display: grid;
    gap: 4px;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px dashed #cbd5e1;
    border-radius: 14px;
    background: #f8fafc;
}
.auth-note-box strong {
    font-size: 13px;
    color: #334155;
}
.auth-note-box span {
    color: #64748b;
    font-size: 12px;
    line-height: 1.8;
}
.auth-role-chip {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
    color: #475569;
    padding: 0 12px;
    font-size: 12px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .04);
}
.auth-role-chip strong {
    font-weight: 700;
}
@media (max-width: 760px) {
    .auth-role-chip { display: none; }
}

/* Phase 2.2 - Professional Mahyapardaz Login */
.mp-login-page {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    padding: 28px;
    background:
        radial-gradient(circle at 12% 18%, rgba(37, 99, 235, .10), transparent 32%),
        radial-gradient(circle at 86% 76%, rgba(99, 102, 241, .12), transparent 34%),
        linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}
.mp-login-shell {
    width: min(1120px, 100%);
}
.mp-login-card {
    min-height: 620px;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(390px, .95fr);
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(226, 232, 240, .9);
    border-radius: 34px;
    overflow: hidden;
    box-shadow: 0 28px 90px rgba(15, 23, 42, .12);
    backdrop-filter: blur(18px);
}
.mp-login-brand-panel {
    position: relative;
    padding: 44px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
    background:
        linear-gradient(135deg, rgba(37, 99, 235, .08), rgba(255, 255, 255, .75)),
        #f9fbff;
}
.mp-login-brand-panel::after {
    content: '';
    position: absolute;
    width: 360px;
    height: 360px;
    left: -160px;
    bottom: -120px;
    border-radius: 50%;
    background: rgba(37, 99, 235, .08);
}
.mp-logo-frame {
    width: 96px;
    height: 96px;
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    border-radius: 28px;
    background: #fff;
    border: 1px solid rgba(226, 232, 240, .95);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .08);
    overflow: hidden;
}
.mp-logo-frame img {
    width: 78px;
    height: 78px;
    object-fit: contain;
}
.mp-brand-copy,
.mp-login-feature-list {
    position: relative;
    z-index: 1;
}
.mp-secure-badge {
    width: fit-content;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    border-radius: 999px;
    color: #1d4ed8;
    background: rgba(37, 99, 235, .09);
    font-size: 12px;
    font-weight: 800;
}
.mp-secure-badge svg,
.mp-login-feature-list svg,
.mp-form-icon svg,
.mp-login-error svg,
.mp-input-wrap svg,
.mp-login-submit svg,
.mp-login-footnote svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
    flex: 0 0 auto;
}
.mp-brand-copy h1 {
    margin: 18px 0 12px;
    font-size: clamp(32px, 4.4vw, 52px);
    line-height: 1.35;
    letter-spacing: -.04em;
    color: #0f172a;
}
.mp-brand-copy p {
    margin: 0;
    max-width: 560px;
    color: #64748b;
    line-height: 2.05;
    font-size: 14px;
}
.mp-login-feature-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.mp-login-feature-list div {
    display: grid;
    gap: 10px;
    align-content: start;
    padding: 14px;
    border-radius: 18px;
    background: rgba(255, 255, 255, .72);
    border: 1px solid rgba(226, 232, 240, .85);
}
.mp-login-feature-list svg {
    color: #2563eb;
}
.mp-login-feature-list span {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.75;
}
.mp-login-form-panel {
    padding: 52px 46px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #fff;
}
.mp-login-form-head {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 22px;
}
.mp-form-icon {
    width: 52px;
    height: 52px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    color: #2563eb;
    background: rgba(37, 99, 235, .09);
}
.mp-login-form-head h2 {
    margin: 0 0 5px;
    font-size: 24px;
    color: #0f172a;
}
.mp-login-form-head p {
    margin: 0;
    color: #64748b;
    font-size: 13px;
}
.mp-login-form {
    display: grid;
    gap: 10px;
}
.mp-login-form label {
    color: #475569;
    font-size: 13px;
    font-weight: 800;
    margin-top: 6px;
}
.mp-input-wrap {
    position: relative;
    color: #94a3b8;
}
.mp-input-wrap svg {
    position: absolute;
    inset-inline-start: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}
.mp-input-wrap input {
    width: 100%;
    height: 50px;
    border: 1px solid #dbe3ef;
    border-radius: 16px;
    outline: none;
    background: #f8fafc;
    padding: 0 46px 0 14px;
    color: #0f172a;
    transition: .18s ease;
}
.mp-input-wrap input:focus {
    background: #fff;
    border-color: rgba(37, 99, 235, .46);
    box-shadow: 0 0 0 4px rgba(37, 99, 235, .10);
}
.mp-login-submit {
    width: 100%;
    height: 50px;
    margin-top: 12px;
    border: 0;
    border-radius: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #4f46e5);
    font-weight: 900;
    box-shadow: 0 18px 32px rgba(37, 99, 235, .22);
}
.mp-login-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 22px 38px rgba(37, 99, 235, .26);
}
.mp-login-error {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    background: #fef2f2;
    color: #b42318;
    border: 1px solid #fecaca;
    border-radius: 16px;
    padding: 12px 13px;
    font-size: 13px;
    line-height: 1.9;
    margin-bottom: 16px;
}
.mp-login-footnote {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 18px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.9;
}
.mp-login-footnote svg {
    color: #2563eb;
    margin-top: 2px;
}
@media (max-width: 980px) {
    .mp-login-card { grid-template-columns: 1fr; }
    .mp-login-brand-panel { padding: 34px; }
    .mp-login-feature-list { grid-template-columns: 1fr; }
    .mp-login-form-panel { padding: 34px; }
}
@media (max-width: 560px) {
    .mp-login-page { padding: 14px; }
    .mp-login-card { border-radius: 24px; }
    .mp-login-brand-panel,
    .mp-login-form-panel { padding: 24px; }
    .mp-logo-frame { width: 76px; height: 76px; border-radius: 22px; }
    .mp-logo-frame img { width: 62px; height: 62px; }
    .mp-brand-copy h1 { font-size: 28px; }
}

/* Project context switcher - phase 1.13 */
.project-context-switcher {
    height: 44px;
    min-width: 250px;
    max-width: 330px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfbfd;
    color: var(--text);
    transition: .18s ease;
}
.project-context-switcher:focus-within {
    border-color: rgba(108,71,255,.32);
    box-shadow: 0 0 0 3px rgba(108,71,255,.10);
}
.project-context-switcher > span {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    border-radius: 9px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    flex: 0 0 auto;
}
.project-context-switcher select {
    width: 100%;
    min-width: 0;
    height: 40px;
    border: 0;
    outline: none;
    background: transparent;
    color: #403b50;
    font-weight: 800;
    cursor: pointer;
}
.project-scope-strip {
    margin: 18px 38px 0;
    padding: 13px 16px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: rgba(255,255,255,.74);
    box-shadow: 0 12px 28px rgba(27,28,52,.03);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.project-scope-strip div {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.project-scope-strip small {
    color: var(--soft-text);
    font-weight: 900;
}
.project-scope-strip strong {
    color: var(--text);
    font-size: 14px;
}
.project-scope-strip span {
    color: var(--muted);
    font-size: 12px;
}
.project-scope-strip em {
    font-style: normal;
    min-width: max-content;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-weight: 900;
    font-size: 12px;
}
.sidebar-context-card {
    margin-top: auto;
    margin-bottom: 10px;
    padding: 13px 14px;
    border-radius: 18px;
    border: 1px solid var(--line);
    background: linear-gradient(180deg, #ffffff, #faf9ff);
    display: grid;
    gap: 4px;
}
.sidebar-context-card small {
    color: var(--soft-text);
    font-weight: 900;
}
.sidebar-context-card strong {
    color: var(--text);
    font-size: 13px;
    line-height: 1.8;
}
.sidebar-context-card span {
    color: var(--muted);
    font-size: 11px;
}
.project-focused-summary {
    margin: 0 0 18px;
}
.project-focused-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}
.project-focused-title small {
    display: block;
    color: var(--primary);
    font-weight: 900;
    margin-bottom: 4px;
}
.project-focused-title strong {
    display: block;
    font-size: 20px;
}
.project-focused-title span {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 12px;
}
.project-focused-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.project-focused-grid article {
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 14px;
    background: var(--surface-soft);
}
.project-focused-grid span,
.project-focused-grid small {
    display: block;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.8;
}
.project-focused-grid strong {
    display: block;
    margin: 4px 0;
    font-size: 17px;
    line-height: 1.7;
}
@media (max-width: 1100px) {
    .project-context-switcher { min-width: 210px; max-width: none; }
    .project-focused-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .project-context-switcher { width: 100%; order: 1; }
    .search-box { width: 100%; flex: 1 1 100%; order: 2; }
    .topbar-actions { order: 3; margin-inline-start: 0; }
    .project-scope-strip { margin: 12px 16px 0; align-items: stretch; flex-direction: column; }
    .project-scope-strip div { display: grid; gap: 4px; }
}
@media (max-width: 640px) {
    .project-focused-title { align-items: stretch; flex-direction: column; }
    .project-focused-grid { grid-template-columns: 1fr; }
}
.sidebar-context-card + .sidebar-footer { margin-top: 0; }

/* Global Persian font enforcement */
:root { --font-main: "Vazirmatn", "Vazir", Tahoma, Arial, sans-serif; }
html, body, .panel-body, .app-shell, .content-shell, .main-content,
button, input, select, textarea, table, th, td, label, a, p, span, strong, small, h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-main);
}

/* v1.15 real workflow and Vazirmatn enforcement */
html, body, input, button, select, textarea, table, .panel-shell, .panel-card, .toolbar-button, .status-pill {
    font-family: var(--font-main, "Vazirmatn", "Vazir", Tahoma, Arial, sans-serif) !important;
}
.workflow-action-stack,
.project-workflow-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.workflow-action-stack {
    justify-content: flex-start;
}
.inline-workflow-form {
    display: inline-flex;
    margin: 0;
}
.inline-workflow-form button,
.project-workflow-actions button {
    cursor: pointer;
}
.mini-action-link.success,
.toolbar-button.success-soft {
    border-color: rgba(34, 197, 94, .22);
    background: rgba(220, 252, 231, .72);
    color: #166534;
}
.project-workflow-actions {
    margin: 12px 0 4px;
}
.empty-project-state {
    min-height: 160px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    grid-column: 1 / -1;
}
.empty-project-state strong {
    font-size: 18px;
}
.empty-project-state small {
    color: var(--muted, #64748b);
}

/* v1.16: no menu counters/badges */
.nav-item em { display: none !important; }

.sidebar-footer.compact-footer { background: transparent; border: 1px solid var(--line); padding: 12px 14px; border-radius: 16px; }
.sidebar-footer.compact-footer span { color: var(--muted); font-size: 12px; font-weight: 700; }

/* Phase 1.18 - clean header selector, real contract form and contract files */
:root { --font-main: "Vazirmatn", "Vazir", Tahoma, Arial, sans-serif; }
html, body, button, input, select, textarea, table, th, td, a, span, small, strong, p, div, label, summary {
    font-family: var(--font-main) !important;
}

.project-context-switcher {
    height: 40px !important;
    min-width: 210px !important;
    max-width: 250px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #f6f6f8 !important;
    box-shadow: none !important;
    overflow: hidden;
    flex: 0 0 230px;
}
.project-context-switcher > span { display: none !important; }
.project-context-switcher select {
    height: 40px !important;
    width: 100%;
    padding: 0 14px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #2f2a3f !important;
    background: transparent !important;
    border: 0 !important;
    outline: 0 !important;
}
.project-context-switcher:focus-within { box-shadow: 0 0 0 3px rgba(108,71,255,.10) !important; }
.search-box { flex: 0 1 420px; }

.real-contract-create-card {
    padding: 0 !important;
    overflow: hidden;
}
.real-contract-create-card > summary {
    list-style: none;
    cursor: pointer;
    padding: 16px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--line);
}
.real-contract-create-card > summary::-webkit-details-marker { display: none; }
.real-contract-create-card > summary strong { font-size: 16px; font-weight: 900; }
.real-contract-create-card > summary small { color: var(--muted); font-size: 12px; line-height: 1.8; }
.real-contract-form {
    display: grid;
    gap: 16px;
    padding: 18px;
}
.real-contract-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: start;
}
.real-contract-form label,
.contract-file-upload-form label {
    display: grid;
    gap: 7px;
    color: #403b50;
    font-size: 12px;
    font-weight: 850;
    min-width: 0;
}
.real-contract-form label.span-2 { grid-column: span 2; }
.real-contract-form input,
.real-contract-form select,
.contract-file-upload-form input,
.contract-file-upload-form select {
    width: 100%;
    min-width: 0;
    height: 42px;
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    background: #fbfbfd;
    color: var(--text);
    padding: 0 12px;
    outline: none;
    font-size: 13px;
}
.real-contract-form input:focus,
.real-contract-form select:focus,
.contract-file-upload-form input:focus,
.contract-file-upload-form select:focus {
    border-color: rgba(108,71,255,.36);
    box-shadow: 0 0 0 3px rgba(108,71,255,.09);
}
.real-contract-form input[type="file"],
.contract-file-upload-form input[type="file"] {
    height: auto;
    min-height: 42px;
    padding: 9px 10px;
    background: #fff;
}
.file-field small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.8;
}
.required-file input { border-color: rgba(108,71,255,.28); background: #fdfcff; }
.real-contract-form-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 2px;
}
.real-contract-form-note {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.9;
}
.contract-kpi-strip.compact {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.contracts-master-toolbar .contract-local-search {
    width: 280px;
    max-width: 100%;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfbfd;
    padding: 0 12px;
    outline: none;
}
.contract-file-upload-form {
    display: grid;
    grid-template-columns: 170px minmax(220px, 1fr) minmax(260px, 1fr) auto;
    gap: 10px;
    align-items: end;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--surface-soft);
    margin-bottom: 14px;
}
.contract-files-list {
    display: grid;
    gap: 8px;
}
.contract-file-row {
    min-height: 54px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.contract-file-row strong { display: block; font-size: 13px; color: var(--text); }
.contract-file-row small { display: block; margin-top: 3px; color: var(--muted); font-size: 11px; line-height: 1.7; }

@media (max-width: 1180px) {
    .real-contract-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contract-file-upload-form { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
    .topbar { flex-wrap: wrap; height: auto; min-height: 74px; padding: 12px 16px; }
    .project-context-switcher, .search-box { flex: 1 1 100%; max-width: none !important; width: 100%; }
    .real-contract-form-grid { grid-template-columns: 1fr; }
    .real-contract-form label.span-2 { grid-column: auto; }
    .real-contract-form-footer { align-items: stretch; flex-direction: column; }
    .contract-kpi-strip.compact { grid-template-columns: 1fr; }
    .contract-file-upload-form { grid-template-columns: 1fr; }
    .contract-file-row { align-items: stretch; flex-direction: column; }
}

/* v1.19 - real contract UX cleanup */
html, body, button, input, select, textarea, table, th, td, a, span, small, strong, p, div, label, summary, option {
    font-family: "Vazirmatn", Tahoma, Arial, sans-serif !important;
}
.project-scope-strip,
.sidebar-context-card { display: none !important; }
.project-context-switcher {
    height: 36px !important;
    min-width: 170px !important;
    max-width: 210px !important;
    flex: 0 0 190px !important;
    background: #f7f7f9 !important;
    border: 1px solid #ececf2 !important;
    border-radius: 11px !important;
    padding: 0 !important;
}
.project-context-switcher select {
    height: 34px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #2f2a3f !important;
}
.clean-contract-toolbar { min-height: 62px; }
.clean-contract-toolbar .contracts-master-actions { flex-wrap: nowrap; }
.clean-contract-toolbar .contract-local-search { height: 38px; font-size: 12px; }
.contract-kpi-strip.compact article small,
.contracts-master-toolbar small,
.compact-card-head small,
.settings-pro-title p,
.settings-pro-card-head small,
.settings-pro-side-note,
.settings-pro-bottom-note,
.settings-pro-help-rail,
.settings-pro-row-meta em,
.settings-pro-side-link small { display: none !important; }
.contract-create-modal .modal-card {
    width: min(980px, 100%);
    grid-template-rows: auto minmax(0, 1fr);
}
.contract-create-modal .modal-head { padding: 13px 16px; }
.contract-create-card .real-contract-form {
    overflow: auto;
    max-height: calc(100vh - 120px);
    padding: 16px;
}
.contract-modal-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.contract-form-section {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fff;
    padding: 12px;
    display: grid;
    gap: 10px;
}
.contract-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.contract-section-title strong { font-size: 13px; }
.contract-repeat-list { display: grid; gap: 8px; }
.contract-repeat-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
}
.contract-repeat-row input,
.contract-file-card input,
.contract-file-card select,
.customer-form-grid input {
    width: 100%;
    min-width: 0;
    height: 40px;
    border: 1px solid var(--line-strong);
    border-radius: 12px;
    background: #fbfbfd;
    color: var(--text);
    padding: 0 12px;
    outline: none;
    font-size: 12px;
}
.contract-repeat-row input:focus,
.contract-file-card input:focus,
.contract-file-card select:focus,
.customer-form-grid input:focus {
    border-color: rgba(108,71,255,.35);
    box-shadow: 0 0 0 3px rgba(108,71,255,.08);
}
.contract-file-card {
    display: grid;
    grid-template-columns: minmax(180px, 1.2fr) 160px minmax(220px, 1fr) auto;
    gap: 8px;
    align-items: end;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: #fafbff;
}
.contract-file-card label,
.customer-form-grid label { display: grid; gap: 6px; font-size: 12px; font-weight: 800; color: #403b50; }
.contract-file-card input[type="file"] { padding-top: 8px; background: #fff; }
.real-contract-form .modal-actions { margin: 0 -16px -16px; position: sticky; bottom: -16px; background: #fff; }
.settings-customer-grid {
    display: grid;
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
    gap: 14px;
}
.customer-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.customer-form-grid .span-2 { grid-column: span 2; }
.form-actions-row { display: flex; justify-content: flex-end; }
.clean-settings-head { padding: 16px; }
.clean-settings-head .settings-pro-title span { font-weight: 900; color: var(--primary); font-size: 12px; }
.clean-settings-head .settings-pro-title h1 { margin: 4px 0 0; }
.settings-pro-nav-group small { display: none !important; }
@media (max-width: 1100px) {
    .contract-modal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .contract-file-card { grid-template-columns: 1fr 1fr; }
    .settings-customer-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .project-context-switcher { flex: 1 1 100% !important; max-width: none !important; }
    .clean-contract-toolbar,
    .clean-contract-toolbar .contracts-master-actions { flex-direction: column; align-items: stretch; }
    .contract-modal-grid,
    .customer-form-grid { grid-template-columns: 1fr; }
    .customer-form-grid .span-2,
    .real-contract-form label.span-2 { grid-column: auto; }
    .contract-repeat-row,
    .contract-file-card { grid-template-columns: 1fr; }
}

/* v1.20 - professional contract form, Jalali inputs and file upload */
.mp-native-select,
.real-contract-form select,
.contract-file-upload-form select,
.customer-form-grid select {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: linear-gradient(45deg, transparent 50%, #6f6b7a 50%), linear-gradient(135deg, #6f6b7a 50%, transparent 50%) !important;
    background-position: left 15px center, left 9px center !important;
    background-size: 6px 6px, 6px 6px !important;
    background-repeat: no-repeat !important;
    padding-inline-start: 34px !important;
}
.contract-create-modal .modal-card.contract-create-card-pro {
    width: min(1040px, calc(100vw - 24px));
    max-height: calc(100vh - 28px);
    border-radius: 24px;
    overflow: hidden;
}
.contract-create-card-pro .modal-head {
    min-height: 58px;
    background: #fff;
    border-bottom: 1px solid var(--line);
}
.contract-create-card-pro .real-contract-form {
    background: #f7f8fb;
    gap: 14px;
}
.contract-main-grid-pro {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 20px;
    padding: 14px;
}
.contract-main-grid-pro label,
.contract-products-section-pro label,
.contract-file-card-pro label {
    font-size: 12px;
    font-weight: 850;
    color: #353244;
}
.contract-main-grid-pro input,
.contract-main-grid-pro select,
.contract-product-row-pro select,
.contract-file-card-pro input,
.contract-file-card-pro select,
.contract-file-upload-form input,
.contract-file-upload-form select,
.customer-form-grid select {
    height: 44px !important;
    border-radius: 14px !important;
    border: 1px solid #e4e5ec !important;
    background-color: #fbfcfe !important;
    font-size: 13px !important;
    color: #211f2d !important;
}
.contract-main-grid-pro input:focus,
.contract-main-grid-pro select:focus,
.contract-product-row-pro select:focus,
.contract-file-card-pro input:focus,
.contract-file-card-pro select:focus,
.contract-file-upload-form input:focus,
.contract-file-upload-form select:focus {
    border-color: rgba(103, 84, 226, .46) !important;
    background-color: #fff !important;
    box-shadow: 0 0 0 4px rgba(103, 84, 226, .08) !important;
}
.contract-form-section.contract-products-section-pro,
.contract-form-section.contract-files-section-pro {
    background: #fff;
    border: 1px solid #e8e9ef;
    border-radius: 20px;
    padding: 14px;
    box-shadow: 0 10px 26px rgba(24, 25, 38, .03);
}
.contract-product-row-pro {
    grid-template-columns: minmax(0, 1fr) 72px;
    background: #f9fafc;
    border: 1px dashed #e1e3eb;
    border-radius: 16px;
    padding: 10px;
}
.contract-files-grid-pro {
    gap: 12px;
}
.contract-file-card-pro {
    grid-template-columns: minmax(190px, 1fr) 170px minmax(240px, 1.2fr) 72px !important;
    border: 1px solid #e4e6ef !important;
    background: linear-gradient(180deg, #ffffff, #fbfcff) !important;
    border-radius: 18px !important;
    padding: 12px !important;
    box-shadow: 0 8px 22px rgba(25, 27, 45, .035);
}
.contract-file-card-pro.contract-file-required {
    border-color: rgba(103, 84, 226, .20) !important;
    background: linear-gradient(180deg, #ffffff, #f8f6ff) !important;
}
.pretty-file-field {
    position: relative;
}
.pretty-file-field input[type="file"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}
.pretty-file-ui {
    height: 44px;
    border: 1px dashed #cfd2dd;
    border-radius: 14px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 12px;
    font-size: 12px;
    color: #5e5b6c;
    min-width: 0;
}
.pretty-file-ui b {
    color: #5f4be8;
    font-weight: 900;
    white-space: nowrap;
}
.pretty-file-ui em {
    color: var(--muted);
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    direction: ltr;
    text-align: left;
}
.contract-modal-actions-pro {
    border-top: 1px solid #ececf2;
    box-shadow: 0 -12px 22px rgba(24, 25, 38, .035);
}
.required-chip {
    margin-inline-start: 8px;
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
}
.detail-file-field .pretty-file-ui { min-width: 220px; }
@media (max-width: 1100px) {
    .contract-file-card-pro { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 760px) {
    .contract-create-modal .modal-card.contract-create-card-pro { width: calc(100vw - 12px); }
    .contract-file-card-pro,
    .contract-product-row-pro { grid-template-columns: 1fr !important; }
}

/* v1.21 - clean placeholders, Material-style selects and Jalali picker */
html, body, input, select, textarea, button, table, .panel-body, .modal-card {
    font-family: 'Vazirmatn', Tahoma, Arial, sans-serif !important;
}
.real-contract-form input::placeholder,
.contract-file-card-pro input::placeholder,
.contract-main-grid-pro input::placeholder {
    color: #a6a8b3 !important;
    font-weight: 500 !important;
}
.mp-native-select,
.real-contract-form select,
.contract-file-upload-form select,
.customer-form-grid select,
.contract-product-row-pro select,
.contract-file-card-pro select {
    -webkit-appearance: none !important;
    appearance: none !important;
    height: 44px !important;
    border: 1px solid #dfe2eb !important;
    border-radius: 14px !important;
    background-color: #fff !important;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.75 7.75L10 12.25L14.25 7.75' stroke='%235f6368' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 20px 20px !important;
    background-position: left 12px center !important;
    padding: 0 14px 0 44px !important;
    color: #202124 !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 44px !important;
    box-shadow: 0 1px 2px rgba(60, 64, 67, .05) !important;
    cursor: pointer !important;
}
.mp-native-select:hover,
.real-contract-form select:hover,
.contract-file-upload-form select:hover,
.customer-form-grid select:hover {
    border-color: #c9ccd6 !important;
    background-color: #fff !important;
}
.mp-native-select:focus,
.real-contract-form select:focus,
.contract-file-upload-form select:focus,
.customer-form-grid select:focus,
.contract-product-row-pro select:focus,
.contract-file-card-pro select:focus {
    border-color: #6750e2 !important;
    box-shadow: 0 0 0 4px rgba(103, 80, 226, .10) !important;
    outline: none !important;
}
.contract-file-card-pro {
    align-items: stretch !important;
    gap: 12px !important;
}
.contract-file-card-pro label {
    gap: 7px !important;
}
.pretty-file-ui {
    border-style: solid !important;
    border-color: #dfe2eb !important;
    background: linear-gradient(180deg, #fff, #f8fafd) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.7), 0 1px 2px rgba(60,64,67,.04) !important;
}
.pretty-file-ui::before {
    content: '📎';
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #f1f3f4;
    font-size: 12px;
    flex: 0 0 auto;
}
.pretty-file-ui b {
    color: #3f37c9 !important;
}
.jalali-date-input {
    cursor: pointer !important;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.5 2.5V5M13.5 2.5V5M3.75 7.25H16.25M5 4H15C15.69 4 16.25 4.56 16.25 5.25V15C16.25 15.69 15.69 16.25 15 16.25H5C4.31 16.25 3.75 15.69 3.75 15V5.25C3.75 4.56 4.31 4 5 4Z' stroke='%235f6368' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 20px 20px !important;
    background-position: left 12px center !important;
    padding-left: 44px !important;
}
.mp-jalali-popover {
    position: fixed;
    z-index: 99999;
    width: 292px;
    max-width: calc(100vw - 24px);
    border: 1px solid #e0e3eb;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(31, 35, 54, .18);
    padding: 12px;
    direction: rtl;
    font-family: 'Vazirmatn', Tahoma, Arial, sans-serif;
}
.mp-jalali-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}
.mp-jalali-head select {
    flex: 1;
    height: 38px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
}
.mp-jalali-nav {
    width: 38px;
    height: 38px;
    border: 1px solid #e0e3eb;
    background: #fff;
    border-radius: 12px;
    cursor: pointer;
    color: #3c4043;
    font-size: 17px;
    line-height: 1;
}
.mp-jalali-nav:hover { background: #f6f7fb; }
.mp-jalali-week,
.mp-jalali-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
}
.mp-jalali-week span {
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7b7f8c;
    font-size: 11px;
    font-weight: 800;
}
.mp-jalali-day {
    height: 34px;
    border: 0;
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
    color: #202124;
    font-weight: 750;
    font-size: 12px;
}
.mp-jalali-day:hover { background: #f1f3f4; }
.mp-jalali-day.is-selected {
    background: #6750e2;
    color: #fff;
}
.mp-jalali-day.is-today:not(.is-selected) {
    background: #f0edff;
    color: #4d38d6;
}
.mp-jalali-empty { height: 34px; }
.mp-jalali-footer {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    padding-top: 10px;
    margin-top: 8px;
    border-top: 1px solid #eef0f5;
}
.mp-jalali-footer button {
    height: 34px;
    padding: 0 12px;
    border: 1px solid #e0e3eb;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    font-size: 12px;
    font-weight: 800;
}
.mp-jalali-footer .primary {
    border-color: transparent;
    background: #f0edff;
    color: #4d38d6;
}

/* v1.22 - real settings section */
.settings-home-shell { gap: 14px; }
.settings-home-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.settings-home-card {
    padding: 16px;
    display: grid;
    gap: 12px;
}
.settings-home-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 10px;
}
.settings-home-card-head strong {
    font-size: 15px;
    line-height: 1.6;
}
.settings-home-links {
    display: grid;
    gap: 8px;
}
.settings-home-link {
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface-2);
    color: var(--text);
    font-size: 13px;
    font-weight: 800;
}
.settings-home-link:hover {
    background: var(--primary-soft);
    border-color: rgba(79,70,229,.22);
    color: var(--primary);
}
.settings-home-link em {
    font-style: normal;
    color: var(--muted);
    font-size: 20px;
    line-height: 1;
}
.settings-pro-nav { padding: 10px; }
.settings-pro-nav-groups {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.settings-pro-nav-group {
    min-height: 38px;
    padding: 0 12px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    width: auto;
}
.settings-pro-nav-group strong { font-size: 12.5px; }
.settings-pro-nav-subtabs {
    padding-top: 9px;
    gap: 6px;
}
.settings-pro-subtab {
    min-height: 34px;
    border-radius: 10px;
    font-size: 12px;
}
.clean-settings-head { padding: 14px 16px; }
.clean-settings-head .settings-pro-title span,
.settings-pro-nav-group small,
.settings-pro-side-note,
.settings-pro-metrics,
.settings-pro-card-head small { display: none !important; }
@media (max-width: 900px) {
    .settings-home-grid { grid-template-columns: 1fr; }
}

/* Phase 1.23 - scalable settings experience */
.settings-studio-shell {
    display: grid;
    gap: 14px;
}
.settings-studio-hero,
.settings-page-hero {
    padding: 18px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-radius: 24px;
    background: linear-gradient(135deg, #fff 0%, #fbfbff 100%);
}
.settings-studio-hero-main,
.settings-page-hero > div {
    min-width: 0;
}
.settings-eyebrow,
.settings-section-kicker {
    display: inline-flex;
    color: var(--primary);
    font-size: 12px;
    line-height: 1.7;
    font-weight: 850;
    margin-bottom: 4px;
}
.settings-studio-hero h1,
.settings-page-hero h1 {
    margin: 0;
    font-size: 21px;
    line-height: 1.55;
    letter-spacing: -.02em;
}
.settings-studio-search {
    width: min(360px, 100%);
    position: relative;
    flex: 0 0 auto;
}
.settings-studio-search::before,
.settings-card-toolbar::before {
    content: '';
}
.settings-studio-search input,
.settings-mobile-search,
.settings-search-input.modern {
    width: 100%;
    height: 42px;
    border: 1px solid var(--line-strong);
    border-radius: 14px;
    background: #fff;
    color: var(--text);
    padding: 0 14px;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.settings-studio-search input:focus,
.settings-mobile-search:focus,
.settings-search-input.modern:focus,
.modern-field input:focus,
.modern-field select:focus {
    border-color: rgba(108, 71, 255, .42);
    box-shadow: 0 0 0 4px rgba(108, 71, 255, .08);
    background: #fff;
}
.settings-mobile-search { display: none; }
.settings-studio-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.settings-studio-category {
    padding: 16px;
    border-radius: 22px;
    min-height: 188px;
    display: grid;
    align-content: start;
    gap: 14px;
}
.settings-category-top {
    display: flex;
    align-items: center;
    gap: 12px;
}
.settings-category-icon,
.settings-rail-icon,
.settings-link-icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: inline-grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 17px;
    font-weight: 900;
    flex: 0 0 auto;
}
.settings-category-top h2 {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
}
.settings-category-top small {
    display: block;
    color: var(--muted);
    font-size: 12px;
}
.settings-studio-links {
    display: grid;
    gap: 8px;
}
.settings-studio-link {
    min-height: 48px;
    border: 1px solid var(--line);
    background: var(--surface-soft);
    border-radius: 15px;
    padding: 7px 9px 7px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}
.settings-studio-link:hover {
    background: #fff;
    border-color: rgba(108, 71, 255, .24);
    transform: translateY(-1px);
}
.settings-studio-link .settings-link-icon {
    width: 30px;
    height: 30px;
    border-radius: 11px;
    font-size: 13px;
    background: #fff;
    border: 1px solid var(--line);
}
.settings-studio-link span:nth-child(2) {
    font-size: 13px;
    font-weight: 800;
}
.settings-studio-link em {
    margin-inline-start: auto;
    font-style: normal;
    color: var(--muted);
    font-size: 20px;
    line-height: 1;
}
.settings-page-hero { min-height: 82px; }
.settings-back-link {
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid var(--line);
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}
.settings-studio-alert { margin: 0; }
.settings-workspace-modern {
    display: grid;
    grid-template-columns: minmax(238px, .34fr) minmax(0, 1.66fr);
    gap: 14px;
    align-items: start;
}
.settings-studio-rail {
    position: sticky;
    top: 82px;
    padding: 14px;
    border-radius: 22px;
    display: grid;
    gap: 14px;
}
.settings-rail-head {
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
}
.settings-rail-head span {
    display: block;
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    margin-bottom: 4px;
}
.settings-rail-head strong {
    display: block;
    font-size: 15px;
    line-height: 1.7;
}
.settings-rail-groups,
.settings-rail-tabs,
.settings-workspace-main {
    display: grid;
    gap: 10px;
}
.settings-rail-group,
.settings-rail-tab {
    min-height: 46px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface-soft);
    padding: 7px 9px;
    display: flex;
    align-items: center;
    gap: 9px;
}
.settings-rail-group strong,
.settings-rail-tab strong {
    font-size: 12.5px;
    line-height: 1.6;
}
.settings-rail-group.active,
.settings-rail-tab.active {
    background: var(--primary-soft);
    border-color: rgba(108, 71, 255, .24);
    color: var(--primary);
}
.settings-rail-group .settings-rail-icon {
    width: 30px;
    height: 30px;
    border-radius: 11px;
    font-size: 13px;
    background: #fff;
    border: 1px solid var(--line);
}
.settings-rail-tab span {
    width: 24px;
    height: 24px;
    border-radius: 9px;
    display: inline-grid;
    place-items: center;
    background: #fff;
    border: 1px solid var(--line);
    color: currentColor;
    font-size: 11px;
    font-weight: 900;
}
.settings-editor-card,
.settings-list-card {
    padding: 16px;
    border-radius: 22px;
}
.settings-card-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.settings-card-toolbar strong {
    display: block;
    font-size: 15px;
    line-height: 1.6;
}
.settings-card-toolbar .settings-search-input.modern {
    width: min(260px, 100%);
    height: 38px;
    flex: 0 0 auto;
}
.settings-modern-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.settings-modern-form.compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.modern-field {
    display: grid;
    gap: 6px;
    min-width: 0;
}
.modern-field.span-2,
.settings-modern-form .span-2 { grid-column: span 2; }
.modern-field span {
    color: #4b5565;
    font-size: 12px;
    font-weight: 800;
}
.modern-field input,
.modern-field select {
    width: 100%;
    height: 42px;
    border: 1px solid var(--line-strong);
    border-radius: 13px;
    background-color: #fff;
    color: var(--text);
    padding: 0 12px;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.modern-field input::placeholder,
.settings-studio-search input::placeholder,
.settings-search-input.modern::placeholder { color: #a7adbb; }
.modern-field select,
.mp-native-select {
    appearance: none;
    -webkit-appearance: none;
    padding-inline-end: 38px !important;
    background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10l5 5 5-5' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: left 12px center;
    background-size: 18px;
}
.settings-form-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 2px;
}
.settings-responsive-table {
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 17px;
}
.settings-modern-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
}
.settings-modern-table th,
.settings-modern-table td {
    padding: 12px 11px;
    border-bottom: 1px solid var(--line);
    text-align: right;
    vertical-align: middle;
    font-size: 12.5px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}
.settings-modern-table th {
    background: #fafbff;
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 850;
}
.settings-modern-table tbody tr:last-child td { border-bottom: 0; }
.settings-modern-table tbody tr:hover td { background: #fcfcff; }
.settings-modern-table td strong {
    display: inline-block;
    font-size: 13px;
    color: var(--text);
}
.settings-action-cell {
    width: 92px;
    white-space: nowrap;
}
.settings-status-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 26px;
    padding: 0 9px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 850;
    background: var(--surface-soft);
    color: var(--muted);
    border: 1px solid var(--line);
    margin-inline-start: 5px;
}
.settings-status-chip.ok {
    background: var(--success-soft);
    color: var(--success);
    border-color: rgba(77, 175, 101, .18);
}
.settings-status-chip.neutral {
    background: var(--surface-soft);
    color: var(--muted);
}
.settings-list-card .empty-table-cell,
.settings-modern-table .empty-table-cell {
    padding: 26px 12px;
    color: var(--muted);
    text-align: center;
}
@media (max-width: 1180px) {
    .settings-workspace-modern { grid-template-columns: 1fr; }
    .settings-studio-rail { position: static; }
    .settings-rail-groups,
    .settings-rail-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .settings-studio-hero,
    .settings-page-hero,
    .settings-card-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .settings-studio-search { display: none; }
    .settings-mobile-search { display: block; }
    .settings-studio-grid,
    .settings-modern-form,
    .settings-modern-form.compact,
    .settings-rail-groups,
    .settings-rail-tabs { grid-template-columns: 1fr; }
    .modern-field.span-2,
    .settings-modern-form .span-2 { grid-column: span 1; }
    .settings-card-toolbar .settings-search-input.modern { width: 100%; }
    .settings-responsive-table { overflow-x: auto; }
    .settings-modern-table { min-width: 680px; }
}

/* Phase 1.24 - settings heading cleanup */
.settings-card-title {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    color: var(--text);
}
.settings-card-title strong {
    display: inline-flex !important;
    align-items: center;
    margin: 0;
    font-size: 15px;
    line-height: 1.8;
    font-weight: 900;
    white-space: nowrap;
}
.settings-card-title-icon {
    width: 28px;
    height: 28px;
    border-radius: 11px;
    display: inline-grid;
    place-items: center;
    background: var(--primary-soft);
    color: var(--primary);
    border: 1px solid rgba(108, 71, 255, .16);
    font-size: 14px;
    font-weight: 950;
    flex: 0 0 auto;
}
.settings-card-toolbar {
    align-items: center !important;
}
.settings-card-toolbar > div:first-child:not(.settings-card-title) {
    min-width: 0;
}
@media (max-width: 700px) {
    .settings-card-title strong { white-space: normal; }
}


/* v1.25 - settings UX cleanup and form standardization */
.settings-page-hero { padding: 14px 18px; min-height: 62px; }
.settings-page-hero h1 { font-size: 19px; }
.settings-eyebrow,
.settings-section-kicker,
.settings-category-icon,
.settings-rail-icon,
.settings-link-icon,
.settings-card-title-icon,
.settings-rail-tab span,
.settings-rail-groups { display: none !important; }
.settings-studio-rail { padding: 12px; }
.settings-rail-head { padding-bottom: 10px; }
.settings-rail-tabs { gap: 6px; }
.settings-rail-tab {
    min-height: 42px;
    border-radius: 12px;
    padding: 8px 11px;
    background: transparent;
    justify-content: flex-start;
}
.settings-rail-tab strong { font-size: 13px; }
.settings-rail-tab.active { background: var(--primary-soft); }
.settings-form-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 14px;
    text-align: right;
}
.settings-form-head.compact { margin-bottom: 0; }
.settings-form-head h2 {
    margin: 0;
    color: var(--text);
    font-size: 16px;
    font-weight: 850;
    line-height: 1.7;
}
.settings-card-title { display: none !important; }
.settings-modern-form { gap: 13px 14px; }
.modern-field span { font-size: 11.5px; color: #495366; }
.modern-field input,
.modern-field select,
.settings-search-input.modern {
    font-size: 12.5px;
}
.modern-field input::placeholder,
.settings-studio-search input::placeholder,
.settings-search-input.modern::placeholder {
    color: #aeb5c3;
    font-size: 11.5px;
}
.modern-select-wrap {
    position: relative;
    display: block;
    width: 100%;
}
.modern-select-wrap::after {
    content: '';
    position: absolute;
    left: 14px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-left: 2px solid #687082;
    border-bottom: 2px solid #687082;
    transform: translateY(-65%) rotate(-45deg);
    pointer-events: none;
}
.modern-select-wrap select {
    appearance: none;
    -webkit-appearance: none;
    background-image: none !important;
    padding-inline-start: 38px !important;
    padding-inline-end: 12px !important;
}
.settings-simple-index { padding: 16px; }
.settings-simple-index > .settings-search-input { margin-bottom: 12px; max-width: 320px; }
.settings-simple-list { display: grid; gap: 8px; }
.settings-simple-row {
    min-height: 48px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 0 13px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.settings-simple-row span { font-size: 13px; font-weight: 800; }
.settings-simple-row em { font-size: 11.5px; font-style: normal; color: var(--muted); }
.settings-modern-table th,
.settings-modern-table td { font-size: 12px; }
.settings-modern-table th { font-size: 11.5px; }
@media (max-width: 900px) {
    .settings-page-hero { align-items: flex-start; }
}

/* v1.27 - settings edit and Google-like active switches */
.settings-entity-table .settings-status-cell {
    width: 76px;
    text-align: center;
}
.settings-entity-table .settings-action-cell {
    width: 92px;
    text-align: center;
}
.settings-switch-form {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}
.google-switch {
    position: relative;
    display: inline-flex;
    width: 44px;
    height: 24px;
    cursor: pointer;
    vertical-align: middle;
}
.google-switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
}
.google-switch span {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: #d8dde8;
    border: 1px solid #c7cedb;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.google-switch span::before {
    content: '';
    position: absolute;
    top: 3px;
    right: 3px;
    width: 16px;
    height: 16px;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .18);
    transition: transform .18s ease, box-shadow .18s ease;
}
.google-switch input:checked + span {
    background: #1a73e8;
    border-color: #1a73e8;
    box-shadow: 0 2px 8px rgba(26, 115, 232, .18);
}
.google-switch input:checked + span::before {
    transform: translateX(-20px);
}
.google-switch input:focus-visible + span {
    box-shadow: 0 0 0 4px rgba(26, 115, 232, .14);
}
.settings-row-muted td {
    color: #98a2b3;
    background: #fbfcfe;
}
.settings-row-muted td strong {
    color: #667085;
}
.settings-edit-modal-card {
    width: min(720px, 100%);
    grid-template-rows: auto minmax(0, 1fr);
}
.small-settings-modal-card {
    width: min(560px, 100%);
}
.settings-modal-form {
    padding: 16px;
    overflow: auto;
    max-height: calc(100vh - 140px);
}
.settings-modal-actions {
    margin: 2px -16px -16px;
    padding: 13px 16px;
    background: #fff;
    position: sticky;
    bottom: -16px;
}
.settings-entity-table .mini-action-link {
    min-height: 30px;
    padding: 0 11px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--primary);
    font-weight: 850;
}
.settings-entity-table .mini-action-link:hover {
    background: var(--primary-soft);
    border-color: rgba(108, 71, 255, .18);
}
@media (max-width: 900px) {
    .settings-entity-table .settings-status-cell,
    .settings-entity-table .settings-action-cell { width: auto; }
}

/* v1.30 - contract approval flow and cleaner contract table */
.office-contract-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.contract-col-client { width: 28%; }
.contract-col-deadline { width: 14%; }
.contract-col-progress { width: 12%; }
.contract-col-products { width: 20%; }
.contract-col-status { width: 14%; }
.contract-col-action { width: 12%; }
.contract-col-finance,
.contract-finance-mini { display: none !important; }
.contract-confirm-card {
    width: min(460px, calc(100vw - 24px));
    border-radius: 24px;
    overflow: hidden;
}
.contract-confirm-body {
    padding: 18px 18px 6px;
    display: grid;
    gap: 8px;
}
.contract-confirm-body strong {
    font-size: 15px;
    font-weight: 900;
    color: #202124;
}
.contract-confirm-body p {
    margin: 0;
    color: #5f6368;
    font-size: 13px;
    line-height: 1.9;
}
.contract-confirm-body small {
    min-height: 20px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 800;
}
.contract-confirm-actions {
    padding: 14px 18px 18px;
    border-top: 0;
}
.contract-edit-modal .contract-products-section-pro {
    margin-top: 0;
}
@media (max-width: 760px) {
    .office-contract-kpis { grid-template-columns: 1fr; }
}

/* v1.31 - contract renewal/delete actions and wider status/action columns */
.contract-col-client { width: 24% !important; }
.contract-col-deadline { width: 12% !important; }
.contract-col-progress { width: 9% !important; }
.contract-col-products { width: 19% !important; }
.contract-col-status { width: 16% !important; }
.contract-col-action { width: 20% !important; }
.office-contract-table .status-pill {
    white-space: normal;
    line-height: 1.8;
    text-align: center;
    justify-content: center;
    min-width: 96px;
}
.office-contract-table .workflow-action-stack {
    gap: 6px;
    align-items: stretch;
}
.office-contract-table .workflow-action-stack .mini-action-link {
    min-width: 58px;
    justify-content: center;
    text-align: center;
}
.contract-extension-grid {
    grid-template-columns: 1fr;
    padding: 18px;
}
.contract-extension-note textarea {
    min-height: 94px;
    resize: vertical;
}
.contract-delete-card .contract-confirm-body p {
    color: var(--muted);
    margin: 6px 0 0;
}
@media (max-width: 1100px) {
    .office-contract-table { min-width: 1100px; }
}


/* v1.32 - contract table status/stage separation and kebab actions */
.office-contract-table { table-layout: fixed; width: 100%; }
.office-contract-table .contract-col-client { width: 24%; }
.office-contract-table .contract-col-deadline { width: 12%; }
.office-contract-table .contract-col-progress { width: 9%; }
.office-contract-table .contract-col-products { width: 14%; }
.office-contract-table .contract-col-status { width: 13%; }
.office-contract-table .contract-col-stage { width: 18%; }
.office-contract-table .contract-col-action { width: 10%; text-align: center; }
.office-contract-table td.contract-actions-cell { overflow: visible; text-align: center; }
.contract-title-link {
    display: block;
    margin-top: 4px;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.contract-title-link:hover { text-decoration: underline; }
.contract-row-menu summary {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    background: #fff;
}
.contract-row-menu .vertical-dots {
    font-size: 23px;
    line-height: 1;
    font-weight: 900;
    transform: translateY(-1px);
}
.row-kebab-panel a,
.row-kebab-panel button {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 38px;
    border: 0;
    background: transparent;
    color: var(--text);
    text-align: right;
    border-radius: 10px;
    padding: 8px 10px;
    font-family: inherit;
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}
.row-kebab-panel a:hover,
.row-kebab-panel button:hover { background: #f5f7fb; }
.row-kebab-panel .success { color: var(--success); }
.row-kebab-panel .danger { color: var(--danger); }
@media (max-width: 1180px) {
    .office-contract-table { min-width: 1040px; }
}

/* v1.35 - unified Google-like tables and infrastructure table refinement */
.dense-data-table,
.office-contract-table,
.installation-v4-table,
.settings-modern-table,
.settings-entity-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
    font-family: var(--font-main, "Vazirmatn", Tahoma, Arial, sans-serif) !important;
}
.responsive-table-wrap,
.contract-list-table-wrap,
.installation-fit-table-wrap {
    overflow-x: visible !important;
    max-width: 100%;
}
.dense-data-table th,
.dense-data-table td,
.office-contract-table th,
.office-contract-table td,
.installation-v4-table th,
.installation-v4-table td,
.settings-modern-table th,
.settings-modern-table td,
.settings-entity-table th,
.settings-entity-table td {
    font-family: var(--font-main, "Vazirmatn", Tahoma, Arial, sans-serif) !important;
    font-size: 11.5px;
    line-height: 1.65;
    padding: 10px 10px;
    vertical-align: middle;
}
.dense-data-table thead th,
.office-contract-table thead th,
.installation-v4-table thead th,
.settings-modern-table thead th,
.settings-entity-table thead th {
    height: 42px;
    background: #fbfcff;
    color: #667085;
    font-size: 11px;
    font-weight: 900;
    border-bottom: 1px solid #eaecf0;
    white-space: nowrap;
}
.dense-data-table tbody td,
.office-contract-table tbody td,
.installation-v4-table tbody td,
.settings-modern-table tbody td,
.settings-entity-table tbody td {
    border-bottom: 1px solid #eef1f6;
}
.standard-title-cell,
.install-main-cell,
.contract-client-cell {
    min-width: 0;
}
.standard-title-link,
.contract-title-link {
    display: block;
    color: var(--primary);
    font-size: 12px;
    font-weight: 900;
    line-height: 1.65;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-decoration: none;
}
.standard-title-link:hover,
.contract-title-link:hover { text-decoration: underline; }
.install-main-cell strong,
.install-main-cell .standard-title-link,
.contract-client-cell strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.product-title-line {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.last-update-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.standard-status-cell .status-pill,
.office-contract-table .status-pill,
.installation-v4-table .status-pill {
    white-space: nowrap !important;
    line-height: 1.6 !important;
    min-width: 0 !important;
    max-width: 100%;
    padding: 5px 9px;
    font-size: 11px;
    justify-content: center;
}
.standard-status-cell small,
.compact-meta-cell small,
.install-date-cell small {
    font-size: 10.5px;
    line-height: 1.6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.standard-action-cell,
.contract-actions-cell,
.install-actions-cell {
    overflow: visible !important;
    text-align: center !important;
    padding-inline: 6px !important;
}
.row-kebab-menu summary {
    width: 34px !important;
    height: 34px !important;
    border-radius: 999px !important;
    border: 1px solid transparent;
    background: transparent;
}
.row-kebab-menu .vertical-dots {
    display: inline-block;
    font-size: 23px;
    line-height: 1;
    font-weight: 900;
    transform: translateY(-1px);
}
.row-kebab-panel {
    width: 178px;
    text-align: right;
}
.row-kebab-panel a,
.row-kebab-panel button {
    font-family: var(--font-main, "Vazirmatn", Tahoma, Arial, sans-serif) !important;
    font-size: 12px;
    font-weight: 850;
    text-decoration: none;
    color: #344054;
}
.row-kebab-panel form {
    display: block;
    margin: 0;
    width: 100%;
}
.row-kebab-panel .success { color: var(--success); }
.row-kebab-panel .danger { color: var(--danger); }

.installation-fit-table,
.installation-v4-table {
    min-width: 0 !important;
    width: 100% !important;
    table-layout: fixed !important;
}
.installation-v4-table th:nth-child(1),
.installation-v4-table td:nth-child(1) { width: 31%; }
.installation-v4-table th:nth-child(2),
.installation-v4-table td:nth-child(2) { width: 14%; }
.installation-v4-table th:nth-child(3),
.installation-v4-table td:nth-child(3) { width: 18%; }
.installation-v4-table th:nth-child(4),
.installation-v4-table td:nth-child(4) { width: 13%; }
.installation-v4-table th:nth-child(5),
.installation-v4-table td:nth-child(5) { width: 16%; }
.installation-v4-table th:nth-child(6),
.installation-v4-table td:nth-child(6) { width: 8%; }
.installation-v4-table .checklist-open-button {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 0 8px;
    border-radius: 999px;
    gap: 4px;
    justify-content: center;
}
.installation-v4-table .checklist-open-button span { display: none; }
.installation-v4-table .checklist-open-button strong,
.installation-v4-table .checklist-open-button small {
    font-size: 11px;
    line-height: 1;
    margin: 0;
}
.install-type-pill {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.install-filter-actions .toolbar-button.small {
    min-height: 32px;
    padding-inline: 10px;
    font-size: 11px;
}
.installation-list-card .compact-card-head {
    gap: 10px;
    flex-wrap: wrap;
}
.installation-toolbar.clean-toolbar small,
.installation-list-card .compact-card-head small {
    display: none !important;
}
@media (max-width: 900px) {
    .responsive-table-wrap,
    .installation-fit-table-wrap { overflow-x: auto !important; }
    .installation-v4-table { min-width: 720px !important; }
}

/* v1.35 - contract table compact without separate products column */
.office-contract-table { min-width: 0 !important; }
.office-contract-table .contract-col-client { width: 34% !important; }
.office-contract-table .contract-col-deadline { width: 15% !important; }
.office-contract-table .contract-col-progress { width: 10% !important; }
.office-contract-table .contract-col-status { width: 14% !important; }
.office-contract-table .contract-col-stage { width: 18% !important; }
.office-contract-table .contract-col-action { width: 9% !important; }
.contract-products-inline {
    display: block;
    margin-top: 3px;
    max-width: 100%;
    color: #6941c6;
    font-size: 10.8px;
    font-weight: 850;
    line-height: 1.7;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.compact-contract-table-wrap { overflow-x: visible !important; }
@media (max-width: 900px) {
    .compact-contract-table-wrap { overflow-x: auto !important; }
    .office-contract-table { min-width: 720px !important; }
}

/* v1.36 - infrastructure table/chip UX cleanup */
.install-filter-segment {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    border-radius: 14px;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.75);
    max-width: 100%;
    overflow: visible;
}
.install-filter-segment button {
    appearance: none;
    border: 0;
    background: transparent;
    color: #667085;
    min-height: 30px;
    padding: 0 10px;
    border-radius: 10px;
    font-family: Vazirmatn, Tahoma, Arial, sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
}
.install-filter-segment button:hover { background: #eef2f7; color: #344054; }
.install-filter-segment button.active {
    color: #175cd3;
    background: #fff;
    box-shadow: 0 1px 2px rgba(16,24,40,.08), 0 0 0 1px #d0d5dd;
}
.installation-list-card .compact-card-head.with-action {
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.installation-v4-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 0 !important;
}
.installation-v4-table th,
.installation-v4-table td {
    padding: 10px 8px !important;
    font-size: 11.5px !important;
    line-height: 1.75;
}
.installation-v4-table th:nth-child(1),
.installation-v4-table td:nth-child(1) { width: 30% !important; }
.installation-v4-table th:nth-child(2),
.installation-v4-table td:nth-child(2) { width: 13% !important; }
.installation-v4-table th:nth-child(3),
.installation-v4-table td:nth-child(3) { width: 17% !important; }
.installation-v4-table th:nth-child(4),
.installation-v4-table td:nth-child(4) { width: 12% !important; }
.installation-v4-table th:nth-child(5),
.installation-v4-table td:nth-child(5) { width: 18% !important; }
.installation-v4-table th:nth-child(6),
.installation-v4-table td:nth-child(6) { width: 10% !important; }
.installation-v4-table .standard-title-link {
    font-size: 12.4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
}
.installation-v4-table .product-title-line,
.installation-v4-table .last-update-line,
.installation-v4-table .compact-meta-cell small,
.installation-v4-table .standard-status-cell small,
.installation-v4-table .install-date-cell small {
    font-size: 10.5px !important;
    color: #667085;
}
.installation-v4-table .product-title-line,
.installation-v4-table .last-update-line {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: block;
}
.installation-v4-table .status-pill,
.installation-v4-table .install-type-pill {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 10.8px !important;
    padding: 4px 8px !important;
}
.installation-v4-table .checklist-open-button {
    width: 100%;
    min-width: 0;
    padding: 6px 7px !important;
    border-radius: 11px;
}
.installation-v4-table .row-kebab-menu summary {
    width: 30px;
    height: 30px;
    min-width: 30px;
}
.install-finish-confirm-card .contract-confirm-body strong {
    display: block;
    margin-top: 8px;
    color: #101828;
    font-size: 13px;
}
@media (max-width: 980px) {
    .install-filter-segment { width: 100%; overflow-x: auto; justify-content: flex-start; }
    .installation-v4-table { min-width: 720px !important; }
}

/* v1.37 - real installation checklist save */
.checklist-save-form { display: flex; flex-direction: column; min-height: 0; }
.checklist-save-actions { position: sticky; bottom: 0; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border-top: 1px solid #eef0f6; padding-top: 14px; }
.inline-checklist-select { min-width: 190px; max-width: 260px; height: 34px; margin-top: 8px; border: 1px solid #dfe3ee; border-radius: 10px; padding: 0 12px; font-family: Vazirmatn, Tahoma, sans-serif; font-size: 12px; background-color: #fff; }
.checklist-modal-card .toolbar-button.primary { white-space: nowrap; }

/* v1.38 - precise infrastructure data and minimal checklist icon */
.installation-v4-table .checklist-open-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    min-height: 32px !important;
    height: 32px !important;
    padding: 0 8px !important;
    background: #f8f7ff !important;
    border-color: #ebe7ff !important;
    color: #5337d6 !important;
    box-shadow: none !important;
}
.installation-v4-table .checklist-open-button .checklist-mini-icon {
    display: inline-flex !important;
    width: 16px !important;
    height: 16px !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 16px !important;
    color: #6d4df5 !important;
}
.installation-v4-table .checklist-open-button .checklist-mini-icon svg {
    width: 16px;
    height: 16px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.installation-v4-table .checklist-open-button strong {
    font-size: 11.5px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}
.installation-v4-table .checklist-open-button small {
    display: none !important;
}
.installation-detail-shell .empty-table-cell,
.credential-table .empty-table-cell,
.contacts-table .empty-table-cell,
.history-table .empty-table-cell {
    text-align: center !important;
    color: #98a2b3 !important;
    font-size: 12px !important;
    padding: 22px 12px !important;
    background: #fbfcff !important;
}
.installation-detail-shell .compact-card-head small {
    font-size: 11px !important;
    color: #98a2b3 !important;
}
.installation-detail-shell .install-mini-dashboard div strong,
.installation-detail-shell .credential-table td,
.installation-detail-shell .credential-table th {
    font-size: 12px !important;
}

/* Sales CRM and contract guarantee additions - v1.39 */
.sales-crm-shell { display: grid; gap: 14px; }
.sales-toolbar { align-items: center; }
.sales-toolbar > div:first-child small,
.compact-card-head small { display: block; color: var(--muted, #6b7280); font-size: 12px; margin-top: 4px; font-weight: 500; }
.sales-toolbar-actions { flex-wrap: wrap; }
.sales-kpis article small { display: block; font-size: 11px; color: var(--muted, #6b7280); margin-top: 3px; }
.sales-filter-card { padding: 12px; }
.sales-filter-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto auto; gap: 10px; align-items: end; }
.sales-filter-form label { display: grid; gap: 6px; color: var(--muted, #6b7280); font-size: 12px; }
.sales-check-filter { display: flex !important; align-items: center; gap: 8px !important; padding: 10px 12px; border: 1px solid var(--border, #e5e7eb); border-radius: 12px; color: var(--text, #111827) !important; }
.sales-opportunity-list { display: grid; gap: 12px; }
.panel-card-light,
.sales-opportunity-row { border: 1px solid rgba(148, 163, 184, .22); background: rgba(255, 255, 255, .82); border-radius: 18px; padding: 14px; box-shadow: 0 10px 30px rgba(15, 23, 42, .04); }
.sales-opportunity-row { display: grid; grid-template-columns: minmax(230px, 1.2fr) minmax(360px, 1.8fr) auto; gap: 14px; align-items: start; }
.sales-row-main { display: flex; gap: 12px; align-items: flex-start; min-width: 0; }
.sales-customer-avatar { width: 42px; height: 42px; border-radius: 15px; display: grid; place-items: center; background: linear-gradient(135deg, #eef6ff, #f8fafc); color: #2563eb; font-weight: 800; flex: 0 0 auto; }
.sales-row-title { display: grid; gap: 4px; min-width: 0; }
.sales-row-title strong { font-size: 14px; color: #111827; }
.sales-row-title span { color: #334155; font-weight: 700; }
.sales-row-title small,
.contract-muted-line { display: block; color: #64748b; font-size: 11px; margin-top: 3px; }
.sales-tag-line { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 3px; }
.sales-row-meta { display: grid; grid-template-columns: repeat(5, minmax(95px, 1fr)); gap: 8px; align-items: stretch; }
.sales-row-meta > div { border: 1px solid rgba(226, 232, 240, .9); border-radius: 14px; padding: 8px; display: grid; gap: 3px; background: #fbfdff; }
.sales-row-meta small { color: #64748b; font-size: 11px; }
.sales-row-meta strong { color: #0f172a; font-size: 12px; }
.sales-row-meta em { width: max-content; font-style: normal; }
.sales-row-actions { display: flex; flex-direction: column; gap: 6px; align-items: stretch; }
.sales-row-actions form { margin: 0; }
.sales-row-actions .mini-action-link { width: 100%; justify-content: center; }
.sales-row-detail { grid-column: 1 / -1; border-top: 1px dashed rgba(148, 163, 184, .32); padding-top: 8px; }
.sales-row-detail summary { cursor: pointer; color: #2563eb; font-size: 12px; font-weight: 800; }
.sales-detail-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 12px; margin-top: 10px; }
.sales-detail-grid section { border: 1px solid rgba(226, 232, 240, .9); border-radius: 16px; padding: 12px; background: #ffffff; }
.sales-detail-grid section > strong { display: block; margin-bottom: 8px; }
.sales-detail-grid p { margin: 0; color: #475569; line-height: 1.9; font-size: 12px; }
.sales-inline-info { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.sales-inline-info span { border-radius: 999px; background: #f8fafc; padding: 5px 9px; font-size: 11px; color: #475569; }
.sales-mini-list { display: grid; gap: 8px; }
.sales-mini-list div { border-bottom: 1px solid #f1f5f9; padding-bottom: 7px; }
.sales-mini-list div:last-child { border-bottom: 0; }
.sales-mini-list span { font-weight: 800; font-size: 12px; }
.sales-mini-list small,
.sales-mini-list em { display: block; color: #64748b; font-size: 11px; margin-top: 3px; font-style: normal; }
.sales-file-mini { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: center; }
.sales-file-mini small { grid-column: 1 / 2; }
.sales-file-mini a { grid-column: 2 / 3; grid-row: 1 / 3; font-size: 11px; color: #2563eb; font-weight: 800; }
.sales-create-card { width: min(980px, calc(100vw - 24px)); max-height: calc(100vh - 38px); overflow: auto; }
.sales-modal-card { width: min(760px, calc(100vw - 24px)); }
.sales-create-form { display: grid; gap: 14px; }
.sales-form-section { border: 1px solid rgba(226, 232, 240, .95); border-radius: 18px; padding: 12px; background: #fff; }
.sales-form-section > strong { display: block; margin-bottom: 10px; }
.sales-form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.sales-form-grid label { display: grid; gap: 6px; color: #64748b; font-size: 12px; }
.sales-form-grid label.full { grid-column: 1 / -1; }
.sales-form-grid input,
.sales-form-grid textarea,
.sales-create-form input,
.sales-create-form textarea { width: 100%; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 12px; background: #fff; font-family: inherit; }
.sales-create-form textarea { resize: vertical; }
.contract-date-stack { display: grid; gap: 4px; color: #475569; font-size: 12px; }
.contract-progress-mini small { color: #64748b; font-size: 11px; }
.contract-note-field { grid-column: span 2; }
.contract-note-field textarea { width: 100%; min-height: 42px; border: 1px solid #e2e8f0; border-radius: 12px; padding: 9px 10px; font-family: inherit; }
.guarantee-info-grid .status-pill { font-style: normal; width: max-content; }
.contract-note-box { margin: 12px 0 0; border-radius: 14px; padding: 10px 12px; background: #f8fafc; color: #475569; line-height: 1.9; }
.contract-approvals-card header small { display: block; color: #64748b; font-size: 12px; margin-top: 4px; }
.contract-approval-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; padding: 12px; border: 1px solid rgba(226, 232, 240, .95); border-radius: 16px; background: #fbfdff; }
.contract-approval-form label { display: grid; gap: 6px; color: #64748b; font-size: 12px; }
.contract-approval-form input,
.contract-approval-form textarea { width: 100%; border: 1px solid #e2e8f0; border-radius: 12px; padding: 10px 12px; font-family: inherit; }
.approval-note-field { grid-column: span 2; }
.contract-approval-form button { align-self: end; }
@media (max-width: 1100px) {
    .sales-opportunity-row { grid-template-columns: 1fr; }
    .sales-row-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-row-actions { flex-direction: row; flex-wrap: wrap; }
    .sales-detail-grid { grid-template-columns: 1fr; }
    .contract-approval-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .sales-filter-form,
    .sales-form-grid,
    .contract-approval-form { grid-template-columns: 1fr; }
    .sales-row-meta { grid-template-columns: 1fr; }
    .contract-note-field,
    .approval-note-field { grid-column: 1 / -1; }
}

/* Sales CRM visual redesign - v1.40 */
.status-pill.warning { background: #fff7ed; color: #c2410c; }
.status-pill.success { background: #ecfdf5; color: #047857; }
.status-pill.danger { background: #fef2f2; color: #dc2626; }
.status-pill.purple { background: #f5f3ff; color: #6d28d9; }
.sales-crm-v2 { gap: 14px; }
.sales-hero-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid rgba(226, 232, 240, .9);
    background:
        radial-gradient(circle at 8% 20%, rgba(108, 71, 255, .10), transparent 28%),
        linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,250,252,.92));
    box-shadow: 0 18px 48px rgba(15, 23, 42, .055);
}
.sales-eyebrow {
    display: inline-flex;
    width: max-content;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(108, 71, 255, .10);
    color: var(--primary);
    font-size: 11px;
    font-weight: 900;
    margin-bottom: 8px;
}
.sales-hero-copy h1 { margin: 0; font-size: 22px; letter-spacing: -.02em; color: #111827; }
.sales-hero-copy p { margin: 7px 0 0; color: #64748b; line-height: 1.9; font-size: 12px; }
.sales-hero-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.sales-hero-search {
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(430px, 42vw);
    min-width: 280px;
    padding: 6px;
    border: 1px solid #e8ebf2;
    border-radius: 16px;
    background: rgba(255,255,255,.88);
}
.sales-hero-search input {
    flex: 1;
    height: 38px;
    border: 0;
    outline: none;
    background: transparent;
    padding: 0 12px;
    color: #111827;
}
.sales-hero-search button,
.sales-primary-cta {
    min-height: 38px;
    border: 0;
    border-radius: 13px;
    padding: 0 16px;
    font-weight: 900;
    font-size: 12px;
}
.sales-hero-search button { background: #f1f5f9; color: #475569; }
.sales-primary-cta { background: var(--primary); color: #fff; box-shadow: 0 12px 28px rgba(108,71,255,.22); }
.sales-soft-alert { border-radius: 16px; padding: 12px 14px; }
.sales-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sales-kpi-card {
    min-height: 88px;
    border: 1px solid rgba(226, 232, 240, .9);
    background: rgba(255,255,255,.92);
    border-radius: 20px;
    padding: 14px 16px;
    display: grid;
    align-content: center;
    gap: 4px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .04);
}
.sales-kpi-card::after { content: ''; position: absolute; inset-inline-start: 14px; top: 16px; width: 34px; height: 34px; border-radius: 13px; opacity: .9; }
.sales-kpi-card.info::after { background: #edf5ff; }
.sales-kpi-card.danger::after { background: #fff0ef; }
.sales-kpi-card.success::after { background: #eef9f1; }
.sales-kpi-card.purple::after { background: #f0ebff; }
.sales-kpi-card span { color: #64748b; font-size: 12px; font-weight: 800; }
.sales-kpi-card strong { font-size: 21px; color: #0f172a; letter-spacing: -.02em; }
.sales-kpi-card small { color: #94a3b8; font-size: 11px; }
.sales-stage-card { padding: 14px; }
.sales-stage-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.sales-stage-head strong { font-size: 14px; }
.sales-stage-head small { display: block; color: #64748b; font-size: 11px; margin-top: 4px; }
.sales-reset-link { color: #6c47ff; font-size: 12px; font-weight: 900; }
.sales-stage-tabs { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.sales-stage-tab {
    min-height: 52px;
    border: 1px solid rgba(226, 232, 240, .95);
    border-radius: 16px;
    padding: 9px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: #fff;
    color: #334155;
    font-size: 12px;
    font-weight: 900;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.sales-stage-tab:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(15,23,42,.06); }
.sales-stage-tab b { min-width: 25px; height: 25px; border-radius: 999px; display: grid; place-items: center; background: #f8fafc; color: #64748b; font-size: 11px; }
.sales-stage-tab.active { border-color: rgba(108,71,255,.28); box-shadow: inset 0 0 0 1px rgba(108,71,255,.10), 0 12px 28px rgba(108,71,255,.08); }
.sales-stage-tab.warning { background: #fffbf4; }
.sales-stage-tab.info { background: #f5faff; }
.sales-stage-tab.purple { background: #faf7ff; }
.sales-stage-tab.success { background: #f7fdf9; }
.sales-stage-tab.danger { background: #fff8f8; }
.sales-stage-tab.neutral { background: #f8fafc; }
.sales-filter-card-v2 { padding: 12px; }
.sales-filter-form-v2 { grid-template-columns: 1.4fr .95fr .95fr .95fr auto auto; gap: 10px; align-items: end; }
.sales-filter-form-v2 input:not([type="checkbox"]) {
    width: 100%;
    height: 42px;
    border: 1px solid #e5e7eb;
    border-radius: 13px;
    background: #fff;
    padding: 0 12px;
    outline: none;
}
.sales-filter-form-v2 .mp-native-select { min-height: 42px; border-radius: 13px; }
.sales-filter-actions { display: flex; gap: 7px; align-items: center; }
.sales-filter-actions .toolbar-button { min-width: 72px; }
.sales-list-card-v2 { padding: 0; overflow: hidden; }
.sales-list-head { padding: 14px 16px; border-bottom: 1px solid #eef2f7; margin: 0; }
.sales-opportunity-list-v2 { gap: 0; }
.sales-empty-state { margin: 16px; }
.sales-opportunity-row-v2 {
    position: relative;
    display: grid;
    grid-template-columns: minmax(250px, 1.05fr) minmax(520px, 2fr) auto;
    gap: 14px;
    align-items: center;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid #eef2f7;
    background: #fff;
    box-shadow: none;
    padding: 15px 18px 15px 16px;
}
.sales-opportunity-row-v2:last-child { border-bottom: 0; }
.sales-opportunity-row-v2:hover { background: #fcfdff; }
.sales-row-accent { position: absolute; inset-inline-start: 0; top: 16px; bottom: 16px; width: 4px; border-radius: 0 999px 999px 0; background: #cbd5e1; }
.sales-opportunity-row-v2.stage-warning .sales-row-accent { background: #f59e0b; }
.sales-opportunity-row-v2.stage-info .sales-row-accent { background: #5798ef; }
.sales-opportunity-row-v2.stage-purple .sales-row-accent { background: #8b5cf6; }
.sales-opportunity-row-v2.stage-success .sales-row-accent { background: #22c55e; }
.sales-opportunity-row-v2.stage-danger .sales-row-accent { background: #ef4444; }
.sales-row-main-v2 { min-width: 0; }
.sales-row-main-v2 .sales-customer-avatar { width: 44px; height: 44px; border-radius: 999px; background: #f8fafc; border: 1px solid #e2e8f0; color: #4f46e5; }
.sales-row-title strong { font-size: 14px; }
.sales-row-title span { font-size: 12px; }
.sales-tag-line .status-pill { padding: 4px 8px; font-size: 10px; }
.sales-row-meta-v2 {
    display: grid;
    grid-template-columns: 1.05fr 1.1fr 1fr 1fr 1fr 1.05fr;
    gap: 8px;
    align-items: stretch;
}
.sales-row-meta-v2 > div {
    min-height: 58px;
    border: 1px solid #edf1f7;
    border-radius: 14px;
    padding: 8px 9px;
    background: #fbfdff;
    display: grid;
    align-content: center;
    gap: 4px;
}
.sales-row-meta-v2 small { color: #94a3b8; font-size: 10px; font-weight: 700; }
.sales-row-meta-v2 strong { color: #0f172a; font-size: 12px; font-weight: 900; }
.sales-meta-stage .status-pill { width: max-content; padding: 5px 9px; font-size: 10px; }
.sales-progress-track { display: block; width: 100%; height: 5px; background: #eef2f7; border-radius: 999px; overflow: hidden; }
.sales-progress-track i { display: block; height: 100%; background: #6c47ff; border-radius: inherit; }
.sales-progress-track.soft i { background: #94a3b8; }
.sales-next-follow em { width: max-content; max-width: 100%; border-radius: 999px; padding: 3px 7px; font-style: normal; font-size: 10px; font-weight: 900; background: #f1f5f9; color: #64748b; }
.sales-next-follow.warning em { background: #fff7ed; color: #c2410c; }
.sales-next-follow.danger em { background: #fef2f2; color: #dc2626; }
.sales-next-follow.success em { background: #ecfdf5; color: #047857; }
.sales-row-actions-v2 { display: flex; flex-direction: column; gap: 6px; align-items: stretch; min-width: 74px; }
.sales-row-actions-v2 form { margin: 0; }
.sales-row-actions-v2 .mini-action-link {
    min-height: 30px;
    width: 100%;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #fff;
    color: #475569;
    font-size: 11px;
    font-weight: 900;
    padding: 0 10px;
}
.sales-row-actions-v2 .mini-action-link.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.sales-row-actions-v2 .mini-action-link.danger-soft { background: #fff7f7; border-color: #fee2e2; color: #dc2626; }
.sales-row-detail-v2 {
    grid-column: 1 / -1;
    border-top: 1px dashed #e2e8f0;
    padding-top: 8px;
}
.sales-row-detail-v2 summary {
    width: max-content;
    list-style: none;
    cursor: pointer;
    color: #4f46e5;
    font-size: 12px;
    font-weight: 900;
    border-radius: 999px;
    padding: 6px 10px;
    background: #f5f3ff;
}
.sales-row-detail-v2 summary::-webkit-details-marker { display: none; }
.sales-detail-grid-v2 { grid-template-columns: 1.2fr 1fr 1fr; }
.sales-detail-grid-v2 section { background: #fbfdff; border-color: #edf1f7; }
.sales-mini-list p { margin: 4px 0 0; color: #475569; line-height: 1.7; font-size: 11px; }
.sales-create-card {
    width: min(1040px, calc(100vw - 28px));
    border-radius: 22px;
}
.sales-modal-stage-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 2px;
}
.sales-modal-stage-strip span {
    min-height: 28px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: #f8fafc;
    color: #64748b;
    font-size: 10px;
    font-weight: 900;
}
.sales-modal-stage-strip span.warning { background: #fff7ed; color: #c2410c; }
.sales-modal-stage-strip span.info { background: #edf5ff; color: #2563eb; }
.sales-modal-stage-strip span.purple { background: #f5f3ff; color: #6d28d9; }
.sales-modal-stage-strip span.success { background: #ecfdf5; color: #047857; }
.sales-modal-stage-strip span.danger { background: #fef2f2; color: #dc2626; }
.sales-modal-stage-strip span.active { box-shadow: inset 0 0 0 2px currentColor; }
.sales-line-form .sales-form-section {
    border: 0;
    border-radius: 0;
    padding: 8px 2px 14px;
    background: transparent;
    border-bottom: 1px solid #edf1f7;
}
.sales-line-form .sales-form-section > strong { margin: 0; font-size: 14px; color: #0f172a; }
.sales-line-form .sales-form-section > small { display: block; color: #94a3b8; font-size: 11px; margin: 4px 0 12px; }
.sales-line-form .sales-form-grid { gap: 8px 14px; }
.sales-line-form .sales-form-grid label { gap: 5px; color: #64748b; font-size: 11px; font-weight: 800; }
.sales-line-form .sales-form-grid input:not([type="file"]),
.sales-line-form .sales-form-grid textarea,
.sales-line-form .sales-create-form input,
.sales-line-form .sales-create-form textarea,
.sales-line-form .mp-native-select {
    border: 0 !important;
    border-bottom: 1px solid #e5e7eb !important;
    border-radius: 0 !important;
    background: #fff !important;
    padding: 9px 2px !important;
    outline: none;
    min-height: 38px;
}
.sales-line-form textarea { min-height: 76px; }
.sales-line-form input:focus,
.sales-line-form textarea:focus,
.sales-line-form select:focus { border-bottom-color: var(--primary) !important; }
.sales-action-modal { border-radius: 22px; }
@media (max-width: 1280px) {
    .sales-opportunity-row-v2 { grid-template-columns: 1fr; }
    .sales-row-actions-v2 { flex-direction: row; flex-wrap: wrap; }
    .sales-row-actions-v2 .mini-action-link { width: auto; }
    .sales-row-meta-v2 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
    .sales-hero-card { flex-direction: column; align-items: stretch; }
    .sales-hero-actions { justify-content: stretch; }
    .sales-hero-search { width: 100%; min-width: 0; }
    .sales-primary-cta { width: 100%; }
    .sales-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-stage-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-filter-form-v2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-filter-actions { grid-column: 1 / -1; }
    .sales-detail-grid-v2 { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .sales-kpi-grid,
    .sales-stage-tabs,
    .sales-filter-form-v2,
    .sales-row-meta-v2,
    .sales-modal-stage-strip { grid-template-columns: 1fr; }
    .sales-hero-search { flex-direction: column; align-items: stretch; }
    .sales-hero-search button { width: 100%; }
    .sales-opportunity-row-v2 { padding: 14px; }
}

/* v1.41 Professional fixed layout: narrow RTL rail, floating submenu, table system, filter drawer */
:root {
    --bg: #f4f5f7;
    --surface: #ffffff;
    --surface-soft: #fafbfc;
    --line: #e6e8ee;
    --line-strong: #d9dde6;
    --text: #1f2937;
    --muted: #7b8494;
    --soft-text: #a2aab8;
    --primary: #6d45f5;
    --primary-soft: #f1ecff;
    --rail: #2f343a;
    --rail-deep: #262a30;
    --rail-soft: #3c4249;
    --success: #22a06b;
    --success-soft: #daf8e9;
    --warning: #e99119;
    --warning-soft: #fff0d7;
    --danger: #df4b4b;
    --danger-soft: #ffe2e2;
    --info: #2676d9;
    --info-soft: #e5f0ff;
    --shadow: 0 16px 42px rgba(25, 33, 61, .07);
    --sidebar-width: 74px;
    --topbar-height: 66px;
    --radius-xl: 22px;
    --radius-lg: 18px;
    --radius-md: 12px;
}
body.panel-body { background: var(--bg); color: var(--text); }
.app-shell { min-height: 100vh; background: var(--bg); }
.sidebar.rail-sidebar {
    position: fixed;
    inset-inline-start: 0;
    top: 0;
    bottom: 0;
    width: var(--sidebar-width);
    padding: 10px 8px;
    background: var(--rail-deep);
    border: 0;
    box-shadow: -10px 0 28px rgba(14, 18, 24, .08);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    z-index: 90;
    overflow: visible;
}
.rail-brand {
    min-height: 64px;
    display: grid;
    place-items: center;
    gap: 3px;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.06);
    margin-bottom: 8px;
}
.rail-brand .brand-symbol {
    width: 33px;
    height: 33px;
    border-radius: 13px;
    background: rgba(255,255,255,.1);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 17px;
    font-weight: 900;
}
.rail-brand small { font-size: 10px; font-weight: 800; color: rgba(255,255,255,.68); }
.rail-nav {
    display: grid;
    gap: 5px;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px 0 8px;
    scrollbar-width: thin;
}
.rail-nav-item {
    min-height: 56px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    gap: 3px;
    padding: 6px 2px;
    color: rgba(255,255,255,.68);
    text-align: center;
    transition: background .18s ease, color .18s ease, transform .18s ease;
    position: relative;
}
.rail-nav-item:hover { background: var(--rail-soft); color: #fff; transform: translateX(-1px); }
.rail-nav-item.active { background: rgba(255,255,255,.13); color: #fff; }
.rail-nav-item.active::before {
    content: '';
    position: absolute;
    inset-inline-start: -8px;
    width: 3px;
    top: 13px;
    bottom: 13px;
    border-radius: 999px;
    background: #fff;
}
.rail-icon { width: 22px; height: 22px; display: grid; place-items: center; font-size: 17px; line-height: 1; }
.rail-label { font-size: 10.5px; line-height: 1.25; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; }
.rail-collapse {
    margin-top: auto;
    height: 36px;
    border: 0;
    border-radius: 13px;
    background: rgba(255,255,255,.08);
    color: rgba(255,255,255,.66);
    font-size: 18px;
}
.rail-submenu-panel {
    position: fixed;
    inset-inline-start: var(--sidebar-width);
    top: 88px;
    width: 224px;
    min-height: 320px;
    max-height: calc(100vh - 116px);
    background: rgba(47,52,58,.98);
    color: #fff;
    border-radius: 0 0 22px 22px;
    box-shadow: 0 22px 56px rgba(18, 21, 28, .23);
    padding: 18px 16px;
    opacity: 0;
    pointer-events: none;
    transform: translateX(14px);
    transition: opacity .2s ease, transform .2s ease;
    z-index: 88;
    overflow-y: auto;
}
.rail-submenu-panel.open { opacity: 1; pointer-events: auto; transform: translateX(0); }
.rail-submenu-close {
    position: absolute;
    top: 12px;
    inset-inline-start: 12px;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 11px;
    background: rgba(255,255,255,.08);
    color: #fff;
    font-size: 20px;
}
.rail-submenu-content[hidden] { display: none; }
.rail-submenu-head { display: grid; place-items: center; gap: 12px; text-align: center; padding: 26px 4px 16px; border-bottom: 1px solid rgba(255,255,255,.10); }
.rail-submenu-head > span { width: 42px; height: 42px; border-radius: 18px; display: grid; place-items: center; background: rgba(255,255,255,.08); color: #fff; font-size: 20px; }
.rail-submenu-head strong { display: block; font-size: 15px; }
.rail-submenu-head small { display: block; color: rgba(255,255,255,.54); font-size: 11px; line-height: 1.8; margin-top: 4px; }
.rail-submenu-links { display: grid; gap: 3px; padding-top: 14px; }
.rail-submenu-links a { display: block; padding: 11px 10px; border-radius: 12px; color: rgba(255,255,255,.82); font-size: 13px; font-weight: 700; }
.rail-submenu-links a:hover { background: rgba(255,255,255,.08); color: #fff; }
.rail-scrim { position: fixed; inset: 0; background: transparent; pointer-events: none; z-index: 80; display: none; }
.rail-scrim.open { display: block; pointer-events: auto; }
.content-shell {
    min-height: 100vh;
    padding-inline-start: var(--sidebar-width);
    background: var(--bg);
}
.topbar.app-topbar {
    height: var(--topbar-height);
    position: sticky;
    top: 0;
    z-index: 70;
    display: grid;
    grid-template-columns: 220px minmax(360px, 1fr) auto;
    align-items: center;
    gap: 16px;
    padding: 0 24px;
    background: rgba(255,255,255,.92);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 8px 24px rgba(20, 26, 46, .035);
    backdrop-filter: blur(16px);
}
.topbar-right-cluster, .topbar-center-cluster, .topbar-actions { display: flex; align-items: center; gap: 12px; }
.topbar-center-cluster { justify-content: center; }
.topbar-product-title strong { display: block; font-size: 14px; font-weight: 900; }
.topbar-product-title small { color: var(--muted); font-size: 11px; }
.topbar-search.search-box { width: min(420px, 44vw); height: 40px; border: 1px solid transparent; background: #f4f5f8; border-radius: 13px; }
.topbar-search.search-box input { font-size: 13px; }
.compact-context-switcher select, .project-context-switcher select {
    min-width: 172px;
    height: 40px;
    border-radius: 13px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 14px;
    color: var(--text);
    font-weight: 800;
    font-size: 12px;
}
.topbar-date { color: var(--muted); font-size: 12px; font-weight: 800; white-space: nowrap; }
.topbar-icon-dot { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 13px; background: #fff; color: var(--muted); }
.compact-profile.profile-button { min-height: 42px; padding: 3px 6px 3px 12px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }
.compact-profile .profile-text small { font-size: 10px; }
.main-content { padding: 28px 30px 42px; max-width: 100%; }
.panel-page-header, .sales-hero-card, .contracts-master-toolbar, .access-card-toolbar:first-child {
    border-radius: 20px;
    background: transparent;
    box-shadow: none;
    border: 0;
}
.panel-card, .dashboard-section-flat, .contracts-master-list-card, .sales-list-card, .sales-stage-card, .sales-filter-card, .access-users-card, .google-table-card {
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: none;
}
.panel-card:hover { box-shadow: none; }
.toolbar-button, .sales-primary-cta, .mini-action-link, .icon-btn {
    min-height: 38px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    font-weight: 800;
    padding: 0 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
}
.toolbar-button.primary, .sales-primary-cta, .toolbar-button.active { background: var(--primary); color: #fff; border-color: transparent; }
.toolbar-button.small, .mini-action-link { min-height: 31px; border-radius: 10px; font-size: 12px; padding: 0 10px; }
.status-pill, .user-status-pill, .priority-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: 11.5px;
    font-weight: 900;
    border: 0;
    background: #eef0f3;
    color: #646d7a;
    white-space: nowrap;
}
.status-pill.success, .user-status-pill.is-active, .priority-badge.success { background: var(--success-soft); color: #16784e; }
.status-pill.warning, .priority-badge.warning { background: var(--warning-soft); color: #a6630d; }
.status-pill.danger, .user-status-pill.is-inactive, .priority-badge.danger { background: var(--danger-soft); color: #ad3434; }
.status-pill.info, .priority-badge.info { background: var(--info-soft); color: #1f64b0; }
.status-pill.neutral, .priority-badge.neutral { background: #eef0f3; color: #687180; }
.responsive-table-wrap, .contracts-wide-table-wrap, .access-users-table-wrap, .it-install-mini-table-wrap {
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: auto;
    background: #fff;
}
table, .dense-data-table, .office-contract-table, .google-users-table, .it-install-mini-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}
table thead th, .dense-data-table thead th, .office-contract-table thead th, .google-users-table thead th, .it-install-mini-table thead th {
    height: 52px;
    padding: 0 18px;
    background: #fff;
    border-bottom: 1px solid var(--line);
    color: #5f6673;
    font-size: 12px;
    font-weight: 900;
    text-align: right;
    white-space: nowrap;
}
table tbody td, .dense-data-table tbody td, .office-contract-table tbody td, .google-users-table tbody td, .it-install-mini-table tbody td {
    min-height: 64px;
    padding: 14px 18px;
    border-bottom: 1px solid #f0f1f4;
    color: var(--text);
    font-size: 13px;
    vertical-align: middle;
}
table tbody tr:nth-child(even) td { background: #fcfcfd; }
table tbody tr:hover td { background: #f8f9fb; }
table tbody tr:last-child td { border-bottom: 0; }
.row-kebab-menu summary, .contract-row-menu summary {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--muted);
    list-style: none;
    cursor: pointer;
}
.row-kebab-menu summary::-webkit-details-marker { display: none; }
.row-kebab-panel {
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 18px 40px rgba(20, 26, 46, .12);
    overflow: hidden;
}
.row-kebab-panel a, .row-kebab-panel button { font-size: 12px; }
.mp-page-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}
.mp-page-title-row h1 { margin: 0; font-size: 24px; letter-spacing: -.04em; }
.mp-page-title-row p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.mp-table-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--line);
}
.mp-table-search, .contract-local-search, .sales-hero-search input {
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    padding: 0 14px;
    min-width: 250px;
    font-weight: 700;
    color: var(--text);
}
.mp-filter-drawer {
    position: fixed;
    inset-inline-end: auto;
    inset-inline-start: 0;
    top: var(--topbar-height);
    bottom: 0;
    width: 318px;
    background: #fff;
    border-inline-end: 1px solid var(--line);
    box-shadow: 18px 0 45px rgba(20, 26, 46, .10);
    z-index: 82;
    padding: 18px 20px;
    overflow-y: auto;
    transform: translateX(-104%);
    transition: transform .23s ease;
}
.mp-filter-drawer.open { transform: translateX(0); }
.mp-filter-drawer[hidden] { display: block !important; }
.mp-filter-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-bottom: 16px; border-bottom: 1px solid var(--line); margin-bottom: 16px; }
.mp-filter-head strong { font-size: 16px; }
.mp-filter-close { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.mp-filter-drawer label { display: grid; gap: 7px; color: #374151; font-size: 12px; font-weight: 900; margin-bottom: 14px; }
.mp-filter-drawer input, .mp-filter-drawer select { height: 40px; border: 1px solid var(--line); border-radius: 12px; padding: 0 12px; background: #fff; color: var(--text); }
.mp-filter-actions { display: flex; gap: 8px; margin-top: 14px; }
.mp-drawer-backdrop { position: fixed; inset: 0; background: rgba(20, 26, 46, .16); z-index: 81; opacity: 0; pointer-events: none; transition: opacity .2s ease; }
.mp-drawer-backdrop.open { opacity: 1; pointer-events: auto; }
.sales-hero-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 2px 0 14px; }
.sales-hero-copy h1 { font-size: 24px; margin: 3px 0; }
.sales-hero-copy p { color: var(--muted); }
.sales-hero-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sales-kpi-grid, .contract-kpi-strip { gap: 12px; }
.sales-kpi-card, .contract-kpi-strip article, .ops-metric-row article {
    border: 1px solid var(--line);
    background: #fff;
    border-radius: 18px;
    box-shadow: none;
}
.sales-stage-tabs { gap: 6px; }
.sales-stage-tab {
    min-height: 36px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 5px 10px;
}
.sales-stage-tab.active { background: var(--rail); color: #fff; border-color: transparent; }
.sales-filter-card-v2 { display: none; }
.sales-opportunity-row-v2 {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    box-shadow: none;
    overflow: hidden;
}
.sales-opportunity-row-v2 + .sales-opportunity-row-v2 { margin-top: 10px; }
.sales-row-actions-v2 { border-top: 1px solid var(--line); background: #fbfcfd; }
.contracts-master-toolbar.clean-contract-toolbar { padding: 0 0 16px; display: flex; align-items: center; justify-content: space-between; }
.contracts-master-toolbar.clean-contract-toolbar strong { font-size: 24px; }
.contracts-master-list-card { overflow: hidden; }
.compact-card-head { padding: 16px 18px; border-bottom: 1px solid var(--line); }
.access-core-shell { max-width: none; }
.access-tab-bar { background: transparent; border: 0; box-shadow: none; margin-bottom: 14px; }
.access-tab-bar button { border: 1px solid var(--line); background: #fff; border-radius: 14px; }
.access-tab-bar button.active { background: var(--rail); color: #fff; }
.google-user-avatar, .sales-customer-avatar { background: #f3f4f7; color: #657083; }
.empty-table-cell, .empty-state { color: var(--muted); }
.panel-alert, .mp-toast {
    border: 1px solid transparent;
    border-radius: 14px;
    box-shadow: none;
    animation: mpSoftToastIn .35s ease both;
}
@keyframes mpSoftToastIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 980px) {
    :root { --sidebar-width: 0px; }
    .sidebar.rail-sidebar { transform: translateX(110%); transition: transform .22s ease; width: 74px; }
    .sidebar.rail-sidebar.open { transform: translateX(0); }
    .rail-submenu-panel { inset-inline-start: 74px; top: 74px; }
    .topbar.app-topbar { grid-template-columns: 1fr; height: auto; min-height: 66px; padding: 10px 14px; }
    .topbar-center-cluster { order: 3; justify-content: stretch; flex-wrap: wrap; }
    .topbar-search.search-box { width: 100%; }
    .main-content { padding: 18px 14px 34px; }
    .sales-hero-card, .contracts-master-toolbar.clean-contract-toolbar, .mp-page-title-row { flex-direction: column; align-items: stretch; }
    .mp-filter-drawer { width: min(86vw, 330px); }
}
.access-toolbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.access-card-toolbar { align-items: center; gap: 14px; }
.sales-filter-drawer .sales-filter-form-v2 { display: block; }
.sales-filter-drawer .sales-filter-form-v2 label { width: 100%; }
.sales-filter-drawer .sales-filter-actions { display: flex; gap: 8px; }
.sales-check-filter { display: flex !important; grid-template-columns: auto 1fr; align-items: center; }
.sales-check-filter input { height: auto !important; }


/* v1.41.2 Layout polish: hidden rail scrollbars, direct dashboard, simple submenu, left filter rail */
html, body.panel-body {
    scrollbar-width: none;
}
body.panel-body::-webkit-scrollbar,
.sidebar.rail-sidebar::-webkit-scrollbar,
.rail-nav::-webkit-scrollbar,
.rail-submenu-panel::-webkit-scrollbar,
.mp-filter-drawer::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.sidebar.rail-sidebar {
    overflow: hidden !important;
    background: #2f3338 !important;
}
.rail-nav {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    padding-bottom: 6px !important;
}
.rail-collapse {
    display: grid !important;
    place-items: center !important;
    height: 38px !important;
    background: rgba(255,255,255,.07) !important;
    border-radius: 14px !important;
    padding: 0 !important;
}
.rail-collapse svg {
    display: block;
    width: 24px;
    height: 26px;
}
.rail-submenu-panel {
    top: 0 !important;
    bottom: 0 !important;
    min-height: auto !important;
    max-height: none !important;
    width: 170px !important;
    padding: 18px 14px 22px !important;
    border-radius: 0 !important;
    background: #484b4c !important;
    box-shadow: none !important;
    overflow-y: auto !important;
    scrollbar-width: none !important;
    transform: translateX(10px) !important;
}
.rail-submenu-panel.open {
    transform: translateX(0) !important;
}
.rail-scrim,
.rail-scrim.open {
    display: none !important;
    pointer-events: none !important;
}
.rail-submenu-close {
    top: 14px !important;
    inset-inline-start: 12px !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.88) !important;
    border-radius: 999px !important;
    font-size: 19px !important;
}
.rail-submenu-head {
    padding: 64px 0 17px !important;
    border-bottom: 1px solid rgba(255,255,255,.16) !important;
    gap: 8px !important;
}
.rail-submenu-head > span {
    width: 34px !important;
    height: 34px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 23px !important;
}
.rail-submenu-head strong {
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #fff !important;
}
.rail-submenu-head small {
    display: none !important;
}
.rail-submenu-links {
    display: grid !important;
    gap: 0 !important;
    padding-top: 16px !important;
}
.rail-submenu-links a {
    min-height: 34px !important;
    display: grid !important;
    place-items: center !important;
    padding: 7px 6px !important;
    border-radius: 0 !important;
    color: rgba(255,255,255,.88) !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.65 !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.06) !important;
    color: #fff !important;
}
.mp-left-tools-rail {
    position: fixed;
    left: 0;
    top: var(--topbar-height);
    bottom: 0;
    width: 54px;
    background: #fff;
    border-right: 1px solid var(--line);
    z-index: 79;
    display: grid;
    grid-auto-rows: min-content;
    align-content: start;
    box-shadow: 8px 0 24px rgba(20,26,46,.035);
}
.mp-left-tools-rail[hidden] { display: none !important; }
.mp-left-tool {
    width: 54px;
    min-height: 64px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: #fff;
    color: #5d6470;
    display: grid;
    place-items: center;
    gap: 4px;
    padding: 8px 2px;
    font-size: 10.5px;
    font-weight: 800;
    cursor: pointer;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    background: #f8f9fb;
    color: #2f343a;
}
.mp-left-tool-icon {
    font-size: 20px;
    line-height: 1;
    color: currentColor;
}
.mp-filter-drawer {
    left: 54px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    top: var(--topbar-height) !important;
    bottom: 0 !important;
    width: 322px !important;
    border-inline-end: 1px solid var(--line) !important;
    border-inline-start: 0 !important;
    box-shadow: 14px 0 34px rgba(20, 26, 46, .08) !important;
    transform: translateX(calc(-100% - 58px)) !important;
    z-index: 82 !important;
}
.mp-filter-drawer.open {
    transform: translateX(0) !important;
}
.mp-filter-head {
    min-height: 48px;
    align-items: center !important;
}
.mp-filter-close {
    border-radius: 999px !important;
}
@media (max-width: 980px) {
    .mp-left-tools-rail { display: none !important; }
    .mp-filter-drawer {
        left: 0 !important;
        width: min(86vw, 330px) !important;
        transform: translateX(-104%) !important;
    }
    .mp-filter-drawer.open { transform: translateX(0) !important; }
}
.mp-drawer-backdrop,
.mp-drawer-backdrop.open {
    opacity: 0 !important;
    pointer-events: none !important;
}

/* v1.41.3 Core layout correction: real left filter rail, controlled content width, compact row actions */
:root {
    --mp-left-rail-width: 54px;
    --mp-content-max: 1188px;
}
body.panel-body {
    overflow-x: hidden !important;
}
.panel-body.has-left-tools .main-content {
    padding-left: calc(30px + var(--mp-left-rail-width)) !important;
}
.main-content > .sales-crm-shell,
.main-content > .contracts-master-shell,
.main-content > .access-core-shell,
.main-content > .dashboard-shell,
.main-content > .installation-shell,
.main-content > .documents-shell,
.main-content > .challenges-shell,
.main-content > .tools-shell,
.main-content > .workbench-shell,
.main-content > .settings-shell,
.main-content > .project-show-shell,
.main-content > .projects-shell,
.main-content > section:not(.mp-filter-drawer):not(.standard-modal):not(.modal-backdrop) {
    width: min(100%, var(--mp-content-max));
    margin-inline: auto;
}
/* Keep the filter panel physically attached to the left side; avoid RTL logical inset conflicts. */
body.panel-body .mp-filter-drawer {
    position: fixed !important;
    inset: var(--topbar-height) auto 0 var(--mp-left-rail-width) !important;
    width: 322px !important;
    max-width: calc(100vw - var(--mp-left-rail-width)) !important;
    border-radius: 0 !important;
    border-left: 0 !important;
    border-right: 1px solid var(--line) !important;
    box-shadow: 14px 0 34px rgba(20, 26, 46, .08) !important;
    transform: translateX(calc(-100% - var(--mp-left-rail-width))) !important;
    z-index: 82 !important;
}
body.panel-body .mp-filter-drawer.open {
    transform: translateX(0) !important;
}
/* Filter is controlled by the left rail; page-level duplicate filter buttons must not appear. */
[data-filter-drawer-open] {
    display: none !important;
}
.mp-left-tools-rail {
    z-index: 83 !important;
}
.mp-left-tool.active,
.mp-left-tool:hover {
    background: #f4f5f7 !important;
}
/* Remove old overlay behavior; drawer should feel like a fixed panel, not a modal. */
.mp-drawer-backdrop,
.mp-drawer-backdrop.open {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}
/* Tables and list cards should not grow endlessly on wide screens. */
.google-table-card,
.access-users-card,
.contracts-master-list-card,
.sales-list-card,
.sales-stage-card,
.panel-card {
    max-width: 100%;
}
.responsive-table-wrap,
.contracts-wide-table-wrap,
.access-users-table-wrap,
.it-install-mini-table-wrap {
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible !important;
}
.access-users-table,
.google-users-table,
.office-contract-table,
.dense-data-table {
    table-layout: auto !important;
}
.contract-col-action,
.action-col,
.contract-actions-cell,
.sales-row-actions-v2 {
    width: 54px !important;
    min-width: 54px !important;
    max-width: 54px !important;
    text-align: center !important;
}
/* Sales page: compact, row-like opportunities with a single kebab action. */
.sales-hero-card {
    padding: 0 0 14px !important;
}
.sales-hero-actions {
    gap: 8px !important;
}
.sales-hero-search {
    width: min(440px, 100%) !important;
}
.sales-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.sales-stage-card,
.sales-list-card-v2 {
    overflow: visible !important;
}
.sales-opportunity-list-v2 {
    overflow: visible !important;
}
.sales-opportunity-row-v2 {
    grid-template-columns: minmax(230px, .95fr) minmax(420px, 1.55fr) 54px !important;
    gap: 12px !important;
    min-height: 96px !important;
    padding: 12px 18px 12px 14px !important;
    overflow: visible !important;
}
.sales-row-meta-v2 {
    grid-template-columns: 1.05fr 1.15fr .9fr .9fr .9fr 1fr !important;
    gap: 6px !important;
}
.sales-row-meta-v2 > div {
    min-height: 52px !important;
    padding: 7px 8px !important;
    border-radius: 12px !important;
}
.sales-row-actions-v2,
.sales-row-kebab-action {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-top: 0 !important;
    background: transparent !important;
    padding: 0 !important;
    min-width: 54px !important;
}
.sales-actions-menu {
    position: relative !important;
}
.sales-actions-menu .row-kebab-panel {
    width: 176px !important;
}
.row-kebab-menu summary,
.contract-row-menu summary {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50% !important;
    color: #697386 !important;
    background: #fff !important;
}
.row-kebab-menu[open] summary,
.row-kebab-menu summary:hover {
    background: #f4f5f7 !important;
    color: #202631 !important;
}
.row-kebab-panel {
    min-width: 168px !important;
    background: #fff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 13px !important;
    box-shadow: 0 18px 45px rgba(20, 26, 46, .16) !important;
    padding: 6px !important;
    overflow: hidden !important;
    z-index: 2600 !important;
}
.row-kebab-panel a,
.row-kebab-panel button {
    width: 100% !important;
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 9px !important;
    background: transparent !important;
    color: #374151 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    text-align: right !important;
    white-space: nowrap !important;
}
.row-kebab-panel form {
    margin: 0 !important;
}
.row-kebab-panel a:hover,
.row-kebab-panel button:hover {
    background: #f5f7fb !important;
}
.row-kebab-panel .success,
.row-kebab-panel button.success {
    color: #16784e !important;
}
.row-kebab-panel .danger,
.row-kebab-panel button.danger {
    color: #c2414b !important;
}
.vertical-dots {
    font-size: 20px !important;
    line-height: 1 !important;
    display: block !important;
    transform: translateY(-1px) !important;
}
/* Keep row details below the row grid; details should not force the action column wider. */
.sales-row-detail-v2 {
    grid-column: 1 / -1 !important;
}
/* Submenu remains narrow, simple and scroll-free visually. */
.rail-submenu-panel {
    width: 166px !important;
    overflow-y: auto !important;
}
.rail-submenu-links a {
    font-size: 11.8px !important;
}
@media (max-width: 1280px) {
    :root { --mp-content-max: 1060px; }
    .sales-opportunity-row-v2 {
        grid-template-columns: 1fr 54px !important;
    }
    .sales-row-meta-v2,
    .sales-row-detail-v2 {
        grid-column: 1 / -1 !important;
    }
    .sales-row-actions-v2 {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }
}
@media (max-width: 980px) {
    .panel-body.has-left-tools .main-content {
        padding-left: 14px !important;
    }
    body.panel-body .mp-filter-drawer {
        inset: var(--topbar-height) auto 0 0 !important;
        width: min(86vw, 330px) !important;
        max-width: 86vw !important;
        transform: translateX(-104%) !important;
    }
    body.panel-body .mp-filter-drawer.open {
        transform: translateX(0) !important;
    }
    .sales-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sales-stage-tabs {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 720px) {
    .sales-opportunity-row-v2 {
        grid-template-columns: 1fr !important;
    }
    .sales-row-actions-v2 {
        grid-column: auto !important;
        grid-row: auto !important;
        justify-content: flex-start !important;
    }
    .sales-row-meta-v2 {
        grid-template-columns: 1fr !important;
    }
    .sales-kpi-grid {
        grid-template-columns: 1fr !important;
    }
}

/* v1.41.4 Sales CRM UX refinement: operational list, compact KPIs, header CTA, page search in list */
:root {
    --mp-content-max: 1168px;
}
.sales-crm-v3 {
    gap: 12px !important;
}
.sales-page-header-v3 {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    width: 100%;
    margin: 0 0 8px;
    padding: 4px 0 2px;
}
.sales-page-title-v3 {
    min-width: 0;
}
.sales-page-title-v3 .sales-eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 11px;
    border-radius: 999px;
    background: #f1ecff;
    color: #6f43e8;
    font-size: 11px;
    font-weight: 900;
    margin-bottom: 8px;
}
.sales-page-title-v3 h1 {
    margin: 0;
    color: #111827;
    font-size: 24px;
    line-height: 1.45;
    letter-spacing: -.04em;
}
.sales-page-title-v3 p {
    margin: 5px 0 0;
    color: #758195;
    font-size: 12.5px;
    line-height: 1.9;
}
.sales-header-cta-v3 {
    min-width: max-content;
    height: 40px;
    padding: 0 18px !important;
    align-self: center;
    box-shadow: 0 10px 22px rgba(108, 71, 255, .16);
}
.sales-kpi-grid-v3 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
}
.sales-kpi-grid-v3 .sales-kpi-card,
.sales-kpi-card {
    min-height: 88px !important;
    padding: 14px 16px !important;
    border-radius: 16px !important;
}
.sales-kpi-grid-v3 .sales-kpi-card::after {
    width: 30px !important;
    height: 30px !important;
    border-radius: 12px !important;
    inset-inline-start: 13px !important;
    top: 13px !important;
}
.sales-kpi-grid-v3 .sales-kpi-card span { font-size: 11.5px !important; }
.sales-kpi-grid-v3 .sales-kpi-card strong { font-size: 19px !important; line-height: 1.5; }
.sales-kpi-grid-v3 .sales-kpi-card small { font-size: 10.5px !important; }
.sales-stage-card-v3 {
    padding: 12px 14px !important;
    border-radius: 16px !important;
}
.sales-stage-head-v3 {
    margin-bottom: 9px !important;
}
.sales-stage-head-v3 strong { font-size: 13px !important; }
.sales-stage-head-v3 small { font-size: 10.8px !important; color: #7a8496 !important; }
.sales-stage-head-v3 .sales-reset-link {
    font-size: 11px;
    font-weight: 900;
    color: #7047ff;
}
.sales-stage-tabs-v3 {
    display: flex !important;
    align-items: stretch;
    gap: 6px !important;
    overflow-x: auto;
    padding-bottom: 1px;
    scrollbar-width: none;
}
.sales-stage-tabs-v3::-webkit-scrollbar { display: none; }
.sales-stage-tabs-v3 .sales-stage-tab {
    flex: 0 0 auto;
    min-width: 126px;
    min-height: 42px !important;
    border-radius: 13px !important;
    padding: 8px 10px !important;
    box-shadow: none !important;
    transform: none !important;
}
.sales-stage-tabs-v3 .sales-stage-tab span { font-size: 11.5px !important; font-weight: 900; }
.sales-stage-tabs-v3 .sales-stage-tab b {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    font-size: 10px !important;
}
.sales-stage-tabs-v3 .sales-stage-tab.active {
    background: #2f343a !important;
    color: #fff !important;
    border-color: transparent !important;
}
.sales-stage-tabs-v3 .sales-stage-tab.active b {
    background: rgba(255,255,255,.16) !important;
    color: #fff !important;
}
.sales-list-card-v2 {
    border-radius: 17px !important;
    overflow: visible !important;
}
.sales-list-head-v3 {
    padding: 14px 16px !important;
    border-bottom: 1px solid #eef0f4;
    display: grid !important;
    grid-template-columns: minmax(190px, 1fr) minmax(290px, 430px) auto;
    align-items: center;
    gap: 12px;
}
.sales-list-title-v3 strong { font-size: 14px; color: #111827; }
.sales-list-title-v3 small { display: block; margin-top: 4px; font-size: 11.3px; color: #7a8496; }
.sales-list-search-v3 {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
}
.sales-list-search-v3 input {
    width: 100%;
    height: 38px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: #fff;
    color: var(--text);
    padding: 0 13px;
    font-size: 12px;
    font-weight: 800;
}
.sales-list-search-v3 input::placeholder { color: #9aa3b2; }
.sales-list-search-v3 button {
    width: 74px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    background: #f2f4f7;
    color: #445061;
    font-size: 12px;
    font-weight: 900;
}
.sales-count-pill-v3 {
    min-width: 58px;
}
.sales-opportunity-list-v2 {
    gap: 0 !important;
}
.sales-opportunity-row-v3 {
    position: relative;
    grid-template-columns: minmax(260px, 1.05fr) minmax(560px, 2.15fr) 42px !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 82px !important;
    padding: 11px 16px 11px 12px !important;
    border: 0 !important;
    border-bottom: 1px solid #eef0f4 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}
.sales-opportunity-row-v3:last-child { border-bottom: 0 !important; }
.sales-opportunity-row-v3:hover { background: #fbfcff !important; }
.sales-opportunity-row-v3 .sales-row-accent {
    position: absolute;
    inset-inline-end: 0;
    top: 14px;
    bottom: 14px;
    width: 3px;
    border-radius: 999px 0 0 999px;
}
.sales-opportunity-row-v3 .sales-row-main-v2 {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
}
.sales-opportunity-row-v3 .sales-customer-avatar {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
}
.sales-opportunity-row-v3 .sales-row-title strong {
    display: block;
    font-size: 13.5px !important;
    color: #111827;
    margin-bottom: 2px;
}
.sales-opportunity-row-v3 .sales-row-title span {
    display: block;
    font-size: 12px !important;
    color: #485366;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sales-opportunity-row-v3 .sales-row-title small {
    display: block;
    margin-top: 3px;
    font-size: 10.8px !important;
    color: #8a94a6;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sales-opportunity-row-v3 .sales-tag-line { margin-top: 5px !important; gap: 4px !important; }
.sales-opportunity-row-v3 .sales-tag-line .status-pill { min-height: 20px; padding: 2px 8px; font-size: 10px; }
.sales-row-meta-v2 {
    align-items: center !important;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 {
    display: grid !important;
    grid-template-columns: .95fr 1.1fr .75fr .8fr .8fr .9fr !important;
    gap: 6px !important;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 > div {
    min-height: 44px !important;
    padding: 0 7px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    display: grid;
    align-content: center;
    gap: 1px;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 small {
    font-size: 10.2px !important;
    color: #98a2b3 !important;
    font-weight: 800 !important;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 strong {
    font-size: 11.7px !important;
    color: #1f2937 !important;
    font-weight: 900 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sales-opportunity-row-v3 .sales-meta-stage .status-pill {
    width: max-content;
    min-height: 22px;
    padding: 2px 9px;
    font-size: 10.5px;
}
.sales-opportunity-row-v3 .sales-progress-track {
    height: 4px !important;
    margin-top: 4px !important;
    background: #edf0f5 !important;
}
.sales-opportunity-row-v3 .sales-progress-track i { height: 4px !important; }
.sales-opportunity-row-v3 .sales-next-follow em {
    font-style: normal;
    width: max-content;
    max-width: 100%;
    min-height: 20px;
    padding: 2px 7px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #667085;
    font-size: 10px;
    font-weight: 900;
    white-space: nowrap;
}
.sales-opportunity-row-v3 .sales-next-follow.warning em,
.sales-opportunity-row-v3 .sales-next-follow.danger em { background: #fff4e6; color: #a6630d; }
.sales-row-actions-v2.sales-row-kebab-action {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    justify-self: center;
}
.sales-row-actions-v2 .row-kebab-menu summary {
    width: 32px !important;
    height: 32px !important;
    border-color: transparent !important;
    background: transparent !important;
}
.sales-row-actions-v2 .row-kebab-menu summary:hover,
.sales-row-actions-v2 .row-kebab-menu[open] summary {
    border-color: #e5e7eb !important;
    background: #f5f7fb !important;
}
.sales-row-detail-v3 {
    grid-column: 1 / -1 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.sales-detail-hidden-summary {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
}
.sales-row-detail-v3[open] {
    margin-top: 8px !important;
    border-top: 1px dashed #e5e7eb;
    padding-top: 10px !important;
}
.sales-row-detail-v3[open] .sales-detail-grid-v2 {
    background: #fbfcff;
    border: 1px solid #eef0f4;
    border-radius: 14px;
    padding: 12px;
}
.sales-actions-menu .row-kebab-panel {
    inset-inline-end: auto !important;
    left: 0 !important;
    width: 168px !important;
}
.js-open-sales-detail {
    color: #344054 !important;
}
.mp-left-tools-rail {
    width: 48px !important;
    box-shadow: 6px 0 18px rgba(20,26,46,.025) !important;
}
.mp-left-tool {
    width: 48px !important;
    min-height: 58px !important;
    color: #7b8492 !important;
    font-size: 9.8px !important;
    gap: 2px !important;
}
.mp-left-tool-icon { font-size: 18px !important; opacity: .85; }
.mp-left-tool:hover,
.mp-left-tool.active { background: #f6f7f9 !important; color: #343a43 !important; }
body.panel-body .mp-filter-drawer {
    left: 48px !important;
    width: 316px !important;
    transform: translateX(calc(-100% - 48px)) !important;
}
body.panel-body .mp-filter-drawer.open { transform: translateX(0) !important; }
.panel-body.has-left-tools .main-content {
    padding-left: calc(26px + 48px) !important;
}
@media (max-width: 1280px) {
    .sales-opportunity-row-v3 {
        grid-template-columns: minmax(250px, 1fr) 42px !important;
    }
    .sales-opportunity-row-v3 .sales-row-meta-v2 {
        grid-column: 1 / -1 !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        border-top: 1px dashed #eef0f4;
        padding-top: 8px;
    }
    .sales-row-actions-v2.sales-row-kebab-action {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }
}
@media (max-width: 980px) {
    .sales-page-header-v3,
    .sales-list-head-v3 {
        grid-template-columns: 1fr !important;
        flex-direction: column;
        align-items: stretch;
    }
    .sales-header-cta-v3 { align-self: stretch; }
    .sales-list-search-v3 { order: 3; }
    .sales-count-pill-v3 { justify-self: flex-start; }
    .sales-kpi-grid-v3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    body.panel-body .mp-filter-drawer { left: 0 !important; transform: translateX(-104%) !important; }
    body.panel-body .mp-filter-drawer.open { transform: translateX(0) !important; }
}
@media (max-width: 720px) {
    .sales-opportunity-row-v3 {
        grid-template-columns: 1fr !important;
        padding: 12px !important;
    }
    .sales-opportunity-row-v3 .sales-row-meta-v2 { grid-template-columns: 1fr 1fr !important; }
    .sales-row-actions-v2.sales-row-kebab-action { grid-column: auto !important; grid-row: auto !important; justify-self: flex-start; }
    .sales-kpi-grid-v3 { grid-template-columns: 1fr !important; }
}

/* v1.41.5 Sales page precision fix: visible header, true row actions, table-like density */
.sales-crm-v3 {
    gap: 10px !important;
}
.sales-page-header-v3 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 0 10px !important;
    padding: 12px 14px !important;
    background: #fff !important;
    border: 1px solid #eef0f4 !important;
    border-radius: 18px !important;
    box-shadow: none !important;
}
.sales-page-title-v3 .sales-eyebrow {
    min-height: 21px !important;
    padding: 2px 9px !important;
    margin-bottom: 5px !important;
    font-size: 10.5px !important;
}
.sales-page-title-v3 h1 {
    display: block !important;
    margin: 0 !important;
    font-size: 22px !important;
    line-height: 1.45 !important;
    color: #111827 !important;
    font-weight: 950 !important;
}
.sales-page-title-v3 p {
    margin: 3px 0 0 !important;
    max-width: 780px !important;
    font-size: 12px !important;
    line-height: 1.8 !important;
    color: #7a8496 !important;
    white-space: normal !important;
}
.sales-header-cta-v3,
.sales-primary-cta.sales-header-cta-v3 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 38px !important;
    min-width: 172px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    visibility: visible !important;
    opacity: 1 !important;
}
.sales-kpi-grid-v3 {
    gap: 8px !important;
}
.sales-kpi-grid-v3 .sales-kpi-card,
.sales-kpi-card {
    min-height: 72px !important;
    padding: 10px 13px !important;
    border-radius: 15px !important;
}
.sales-kpi-grid-v3 .sales-kpi-card::after {
    width: 24px !important;
    height: 24px !important;
    border-radius: 10px !important;
    top: 11px !important;
    inset-inline-start: 11px !important;
    opacity: .55 !important;
}
.sales-kpi-grid-v3 .sales-kpi-card span { font-size: 11px !important; }
.sales-kpi-grid-v3 .sales-kpi-card strong { font-size: 18px !important; line-height: 1.25 !important; }
.sales-kpi-grid-v3 .sales-kpi-card small { font-size: 10px !important; margin-top: 1px !important; }
.sales-stage-card-v3 {
    padding: 10px 12px !important;
    border-radius: 16px !important;
}
.sales-stage-head-v3 {
    margin-bottom: 7px !important;
}
.sales-stage-head-v3 strong { font-size: 12.5px !important; }
.sales-stage-head-v3 small { font-size: 10.5px !important; }
.sales-stage-tabs-v3 .sales-stage-tab {
    min-width: 118px !important;
    min-height: 38px !important;
    padding: 6px 9px !important;
    border-radius: 12px !important;
}
.sales-stage-tabs-v3 .sales-stage-tab span { font-size: 11px !important; }
.sales-stage-tabs-v3 .sales-stage-tab b {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
}
.sales-list-card-v2 {
    border-radius: 16px !important;
}
.sales-list-head-v3 {
    padding: 11px 14px !important;
    grid-template-columns: minmax(170px, 1fr) minmax(280px, 390px) auto !important;
    gap: 10px !important;
}
.sales-list-title-v3 strong { font-size: 13.5px !important; }
.sales-list-title-v3 small { font-size: 10.8px !important; margin-top: 2px !important; }
.sales-list-search-v3 input,
.sales-list-search-v3 button {
    height: 35px !important;
    border-radius: 11px !important;
}
.sales-list-search-v3 button { width: 68px !important; }
.sales-opportunity-row-v3 {
    grid-template-columns: minmax(246px, .95fr) minmax(600px, 2.35fr) 38px !important;
    min-height: 68px !important;
    padding: 9px 14px 9px 10px !important;
    gap: 8px !important;
}
.sales-opportunity-row-v3 .sales-row-accent {
    top: 10px !important;
    bottom: 10px !important;
    width: 3px !important;
}
.sales-opportunity-row-v3 .sales-row-main-v2 {
    grid-template-columns: 34px minmax(0, 1fr) !important;
    gap: 9px !important;
}
.sales-opportunity-row-v3 .sales-customer-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
}
.sales-opportunity-row-v3 .sales-row-title strong { font-size: 13px !important; }
.sales-opportunity-row-v3 .sales-row-title span { font-size: 11.5px !important; }
.sales-opportunity-row-v3 .sales-row-title small { font-size: 10.3px !important; margin-top: 1px !important; }
.sales-opportunity-row-v3 .sales-row-meta-v2 {
    grid-template-columns: .9fr 1.05fr .7fr .75fr .8fr .86fr !important;
    gap: 4px !important;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 > div {
    min-height: 36px !important;
    padding: 0 5px !important;
}
.sales-opportunity-row-v3 .sales-row-meta-v2 small { font-size: 9.8px !important; }
.sales-opportunity-row-v3 .sales-row-meta-v2 strong { font-size: 11.2px !important; }
.sales-opportunity-row-v3 .sales-meta-stage .status-pill {
    min-height: 20px !important;
    padding: 2px 8px !important;
    font-size: 10px !important;
}
.sales-opportunity-row-v3 .sales-next-follow em {
    min-height: 18px !important;
    padding: 1px 7px !important;
    font-size: 9.6px !important;
}
.sales-row-actions-v2.sales-row-kebab-action {
    grid-column: 3 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: center !important;
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
}
.sales-row-actions-v2 .row-kebab-menu summary {
    width: 30px !important;
    height: 30px !important;
    border-radius: 999px !important;
}
.sales-row-actions-v2 .vertical-dots {
    font-size: 19px !important;
}
.sales-row-detail-v3 {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
}
/* Restore fixed-position JS variables for row menus. Previous sales-specific left:0 forced menus to page edge. */
.row-kebab-menu .row-kebab-panel,
.sales-actions-menu .row-kebab-panel {
    position: fixed !important;
    top: var(--row-menu-top, 0) !important;
    left: var(--row-menu-left, 0) !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    width: 170px !important;
    z-index: 7000 !important;
}
.sales-actions-menu .row-kebab-panel {
    visibility: hidden;
}
.sales-actions-menu[open] .row-kebab-panel {
    visibility: visible;
}
.row-kebab-panel::before,
.row-kebab-panel.open-up::before {
    display: none !important;
    content: none !important;
}
.mp-left-tools-rail {
    background: rgba(255,255,255,.96) !important;
}
.mp-left-tool {
    min-height: 52px !important;
    opacity: .82 !important;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    opacity: 1 !important;
}
@media (max-width: 1280px) {
    .sales-opportunity-row-v3 {
        grid-template-columns: minmax(240px, 1fr) 38px !important;
    }
    .sales-opportunity-row-v3 .sales-row-meta-v2 {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        padding-top: 7px !important;
    }
    .sales-row-actions-v2.sales-row-kebab-action {
        grid-column: 2 !important;
        grid-row: 1 !important;
    }
    .sales-row-detail-v3 {
        grid-row: 3 !important;
    }
}
@media (max-width: 980px) {
    .sales-page-header-v3,
    .sales-list-head-v3 {
        grid-template-columns: 1fr !important;
    }
    .sales-header-cta-v3,
    .sales-primary-cta.sales-header-cta-v3 {
        width: 100% !important;
    }
}

/* v1.41.6 - Sales KPI actionable cards + calmer left rail + smart sidebar scroll control */
.sales-kpi-grid-v4 {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 10px !important;
    align-items: stretch !important;
}
.sales-kpi-grid-v4 .sales-kpi-card,
.sales-kpi-action-card {
    position: relative !important;
    min-height: 74px !important;
    height: 74px !important;
    padding: 11px 14px 10px 46px !important;
    border-radius: 17px !important;
    border: 1px solid #e7eaf0 !important;
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 9px 22px rgba(15,23,42,.035) !important;
    display: grid !important;
    grid-template-rows: 17px 25px 16px !important;
    align-content: center !important;
    gap: 0 !important;
    color: #111827 !important;
    overflow: hidden !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}
.sales-kpi-action-card::before {
    content: '' !important;
    position: absolute !important;
    inset-block: 13px !important;
    inset-inline-start: 0 !important;
    width: 3px !important;
    border-radius: 999px 0 0 999px !important;
    background: #94a3b8 !important;
    opacity: .95 !important;
}
.sales-kpi-action-card.info::before { background: #60a5fa !important; }
.sales-kpi-action-card.success::before { background: #34d399 !important; }
.sales-kpi-action-card.warning::before { background: #fbbf24 !important; }
.sales-kpi-action-card.danger::before { background: #fb7185 !important; }
.sales-kpi-action-card.purple::before { background: #8b5cf6 !important; }
.sales-kpi-action-card:hover,
.sales-kpi-action-card.active {
    transform: translateY(-1px) !important;
    border-color: rgba(108,71,255,.22) !important;
    box-shadow: 0 14px 34px rgba(15,23,42,.07) !important;
    background: #fff !important;
}
.sales-kpi-action-card.active { box-shadow: inset 0 0 0 1px rgba(108,71,255,.10), 0 13px 32px rgba(108,71,255,.08) !important; }
.sales-kpi-action-card .sales-kpi-mark {
    position: absolute !important;
    inset-inline-end: 13px !important;
    top: 12px !important;
    width: 27px !important;
    height: 27px !important;
    border-radius: 11px !important;
    display: grid !important;
    place-items: center !important;
    font-style: normal !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    color: #64748b !important;
    background: #f5f7fb !important;
}
.sales-kpi-action-card.info .sales-kpi-mark { color: #2563eb !important; background: #eff6ff !important; }
.sales-kpi-action-card.success .sales-kpi-mark { color: #059669 !important; background: #ecfdf5 !important; }
.sales-kpi-action-card.warning .sales-kpi-mark { color: #b45309 !important; background: #fffbeb !important; }
.sales-kpi-action-card.danger .sales-kpi-mark { color: #be123c !important; background: #fff1f2 !important; }
.sales-kpi-action-card.purple .sales-kpi-mark { color: #6d28d9 !important; background: #f5f3ff !important; }
.sales-kpi-action-card::after { display: none !important; content: none !important; }
.sales-kpi-action-card .sales-kpi-label,
.sales-kpi-grid-v4 .sales-kpi-card span {
    color: #475569 !important;
    font-size: 11.3px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
    padding: 0 !important;
}
.sales-kpi-grid-v4 .sales-kpi-card strong {
    color: #0f172a !important;
    font-size: clamp(18px, 1.55vw, 24px) !important;
    line-height: 1.25 !important;
    letter-spacing: -.03em !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.sales-kpi-grid-v4 .sales-kpi-card small {
    color: #8b96a8 !important;
    font-size: 10.4px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.sales-kpi-action-card.success small { color: #059669 !important; }
.sales-kpi-action-card.danger small { color: #b42318 !important; }

.mp-left-tools-rail {
    width: 46px !important;
    background: rgba(255,255,255,.90) !important;
    box-shadow: 5px 0 18px rgba(20,26,46,.018) !important;
}
.mp-left-tool {
    width: 46px !important;
    min-height: 46px !important;
    gap: 2px !important;
    padding: 6px 2px !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    color: #8a93a2 !important;
    opacity: .68 !important;
    background: transparent !important;
    transition: opacity .14s ease, background .14s ease, color .14s ease !important;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    opacity: 1 !important;
    color: #424a57 !important;
    background: #f8fafc !important;
}
.mp-left-tool-icon {
    font-size: 14px !important;
    width: 18px !important;
    height: 18px !important;
    display: grid !important;
    place-items: center !important;
    opacity: .76 !important;
}
.mp-filter-glyph,
.mp-sort-glyph {
    gap: 3px !important;
}
.mp-filter-glyph i,
.mp-sort-glyph i {
    display: block !important;
    height: 1.5px !important;
    border-radius: 999px !important;
    background: currentColor !important;
    opacity: .92 !important;
}
.mp-filter-glyph i:nth-child(1) { width: 16px !important; }
.mp-filter-glyph i:nth-child(2) { width: 11px !important; }
.mp-filter-glyph i:nth-child(3) { width: 6px !important; }
.mp-sort-glyph i:nth-child(1) { width: 6px !important; }
.mp-sort-glyph i:nth-child(2) { width: 12px !important; }
.mp-sort-glyph i:nth-child(3) { width: 16px !important; }
body.panel-body .mp-filter-drawer { left: 46px !important; transform: translateX(calc(-100% - 46px)) !important; }
body.panel-body .mp-filter-drawer.open { transform: translateX(0) !important; }
.panel-body.has-left-tools .main-content { padding-left: calc(24px + 46px) !important; }

.rail-collapse {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(6px) !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
}
.rail-collapse.is-visible {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
}
.rail-collapse:focus-visible {
    outline: 2px solid rgba(255,255,255,.28) !important;
    outline-offset: 2px !important;
}

@media (max-width: 980px) {
    .sales-kpi-grid-v4 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .panel-body.has-left-tools .main-content { padding-left: 14px !important; }
    body.panel-body .mp-filter-drawer { left: 0 !important; transform: translateX(-104%) !important; }
    body.panel-body .mp-filter-drawer.open { transform: translateX(0) !important; }
}
@media (max-width: 640px) {
    .sales-kpi-grid-v4 { grid-template-columns: 1fr !important; }
    .sales-kpi-grid-v4 .sales-kpi-card { height: 70px !important; min-height: 70px !important; }
}

/* v1.41.7 - Topbar/profile/menu icon polish */
.topbar.app-topbar {
    grid-template-columns: minmax(210px, 1fr) minmax(360px, 560px) auto !important;
    height: 66px !important;
    padding: 0 24px !important;
    z-index: 240 !important;
    overflow: visible !important;
}
.content-shell,
.app-shell { overflow: visible !important; }
.topbar-right-cluster { min-width: 0; }
.topbar-page-title { display: grid; gap: 2px; line-height: 1.15; }
.topbar-page-title strong { font-size: 14px; font-weight: 950; color: #1f2937; letter-spacing: -.02em; }
.topbar-page-title small { font-size: 10.5px; font-weight: 700; color: #8b96a8; }
.topbar-product-title { display: none !important; }
.topbar-actions {
    position: relative !important;
    z-index: 260 !important;
    margin-inline-start: 0 !important;
    justify-content: flex-end !important;
    gap: 9px !important;
    overflow: visible !important;
}
.topbar-logo {
    width: auto;
    height: 30px;
    max-width: 105px;
    object-fit: contain;
    display: block;
    opacity: .95;
    margin-inline-start: 2px;
}
.topbar-date {
    height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 0 11px;
    border: 1px solid transparent;
    color: #657084 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    direction: ltr;
}
.topbar-icon-button,
.topbar-notification-button {
    width: 36px;
    height: 36px;
    border: 1px solid #e7e9ee;
    border-radius: 12px;
    background: #fff;
    color: #697386;
    display: inline-grid;
    place-items: center;
    padding: 0;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}
.topbar-icon-button:hover,
.topbar-notification-button:hover {
    background: #f8fafc;
    border-color: #dfe3ea;
    color: #303641;
    transform: translateY(-1px);
}
.profile-dropdown { position: relative !important; overflow: visible !important; }
.compact-profile.profile-button {
    min-height: 38px !important;
    height: 38px !important;
    padding: 3px 5px 3px 10px !important;
    border-radius: 13px !important;
    gap: 8px !important;
    box-shadow: none !important;
    background: #fff !important;
    border: 1px solid #e7e9ee !important;
}
.compact-profile.profile-button:hover { background: #f8fafc !important; }
.compact-profile .profile-text strong {
    font-size: 12px !important;
    font-weight: 900 !important;
    color: #273142 !important;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.compact-profile .profile-text small {
    font-size: 9.5px !important;
    color: #8d96a8 !important;
    max-width: 110px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.profile-avatar.avatar {
    width: 30px !important;
    height: 30px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
}
.profile-panel.dropdown-panel {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 176px !important;
    min-width: 176px !important;
    max-width: 176px !important;
    padding: 6px !important;
    border-radius: 14px !important;
    border: 1px solid #e5e8ef !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 18px 40px rgba(15,23,42,.12) !important;
    z-index: 9999 !important;
}
.profile-dropdown.dropdown.open .profile-panel.dropdown-panel { display: grid !important; gap: 3px !important; }
.profile-menu-item.dropdown-link {
    min-height: 34px;
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 7px 8px !important;
    border-radius: 10px !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #273142 !important;
    line-height: 1.4;
    white-space: nowrap;
}
.profile-menu-item.dropdown-link:hover { background: #f4f6f9 !important; }
.profile-menu-item.dropdown-link.danger { color: #d14343 !important; }
.dropdown-link-icon {
    width: 19px;
    height: 19px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 19px;
    color: currentColor;
}
.dropdown-link-icon svg { width: 19px; height: 19px; display: block; }
.profile-panel form { margin: 0 !important; }

.rail-icon svg,
.rail-icon .rail-svg,
.rail-submenu-head svg,
.rail-submenu-head .rail-svg {
    width: 22px !important;
    height: 22px !important;
    display: block !important;
    color: currentColor !important;
}
.rail-icon svg path,
.rail-submenu-head svg path { fill: currentColor !important; }
.rail-submenu-head .rail-svg {
    width: 30px !important;
    height: 30px !important;
}
.rail-nav-item .rail-icon {
    font-size: 18px !important;
    color: currentColor !important;
}
.mp-left-tool-icon svg {
    width: 18px !important;
    height: 18px !important;
    display: block !important;
    color: currentColor !important;
}
.mp-left-tool-icon svg path { fill: currentColor !important; }
.mp-left-tool {
    font-weight: 500 !important;
    opacity: .58 !important;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    opacity: .95 !important;
}
.mp-filter-glyph,
.mp-sort-glyph,
.mp-filter-glyph i,
.mp-sort-glyph i { display: none !important; }

@media (max-width: 980px) {
    .topbar.app-topbar { grid-template-columns: 1fr !important; height: auto !important; min-height: 66px !important; }
    .topbar-actions { justify-content: space-between !important; width: 100% !important; }
    .topbar-logo { display: none; }
    .profile-panel.dropdown-panel { left: 0 !important; right: auto !important; }
}

/* v1.41.8 - rail curvature refinement and global table UI standardization */
:root {
    --mp-table-border: #e7eaf0;
    --mp-table-divider: #edf0f4;
    --mp-table-head: #6f7787;
    --mp-table-text: #1f2937;
    --mp-table-hover: #fafbfc;
}

/* floating right rail like the approved reference */
.sidebar.rail-sidebar {
    inset-inline-start: 10px !important;
    top: 10px !important;
    bottom: 10px !important;
    width: 66px !important;
    padding: 10px 7px 10px !important;
    border-radius: 22px 0 0 22px !important;
    background: #2f3338 !important;
    box-shadow: -12px 0 34px rgba(15, 23, 42, .08) !important;
    overflow: hidden !important;
}
.content-shell {
    padding-inline-start: calc(var(--sidebar-width) + 22px) !important;
}
.rail-brand {
    min-height: 58px !important;
    margin-bottom: 10px !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}
.rail-nav {
    gap: 4px !important;
    padding: 2px 0 6px !important;
}
.rail-nav-item {
    min-height: 54px !important;
    border-radius: 14px !important;
    padding: 6px 2px !important;
}
.rail-nav-item.active::before {
    inset-inline-start: auto !important;
    inset-inline-end: -7px !important;
    width: 3px !important;
}
.rail-collapse {
    width: 36px !important;
    height: 36px !important;
    margin: auto auto 0 !important;
    border-radius: 14px !important;
}
.rail-submenu-panel {
    inset-inline-start: 76px !important;
    top: 10px !important;
    bottom: 10px !important;
    width: 182px !important;
    border-radius: 20px 0 0 20px !important;
    background: #4a4d4f !important;
    box-shadow: -14px 0 34px rgba(15, 23, 42, .08) !important;
}
.rail-submenu-head {
    padding-top: 58px !important;
}

/* global table shell */
.table-wrap,
.project-table-wrap,
.contract-list-table-wrap,
.responsive-table-wrap,
.documents-table-wrap,
.contacts-table-wrap,
.history-table-wrap,
.credential-table-wrap,
.notebook-table-wrap,
.installation-fit-table-wrap,
.it-install-mini-table-wrap,
.no-overflow-table,
.permission-table-wrap,
.contracts-wide-table-wrap {
    border: 1px solid var(--mp-table-border) !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

.data-table,
.dense-data-table,
.project-status-table,
.contract-list-table,
.contracts-wide-table,
.installation-fit-table,
.installation-v3-table,
.installation-v4-table,
.it-install-mini-table,
.notebook-checklist-table,
.credential-table,
.contacts-table,
.history-table,
.office-document-table,
.permission-admin-table,
.documents-index-table {
    width: 100% !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: #fff !important;
    font-size: 13px !important;
}

.data-table thead th,
.dense-data-table thead th,
.project-status-table thead th,
.contract-list-table thead th,
.contracts-wide-table thead th,
.installation-fit-table thead th,
.installation-v3-table thead th,
.installation-v4-table thead th,
.it-install-mini-table thead th,
.notebook-checklist-table thead th,
.credential-table thead th,
.contacts-table thead th,
.history-table thead th,
.office-document-table thead th,
.permission-admin-table thead th,
.documents-index-table thead th,
.data-table th,
.dense-data-table th,
.project-status-table th,
.contract-list-table th,
.contracts-wide-table th,
.installation-fit-table th,
.installation-v3-table th,
.installation-v4-table th,
.it-install-mini-table th,
.notebook-checklist-table th,
.credential-table th,
.contacts-table th,
.history-table th,
.office-document-table th,
.permission-admin-table th,
.documents-index-table th {
    background: #fff !important;
    color: var(--mp-table-head) !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.7 !important;
    text-align: right !important;
    white-space: nowrap !important;
    padding: 16px 18px !important;
    border-bottom: 1px solid var(--mp-table-divider) !important;
    vertical-align: middle !important;
}

.data-table td,
.dense-data-table td,
.project-status-table td,
.contract-list-table td,
.contracts-wide-table td,
.installation-fit-table td,
.installation-v3-table td,
.installation-v4-table td,
.it-install-mini-table td,
.notebook-checklist-table td,
.credential-table td,
.contacts-table td,
.history-table td,
.office-document-table td,
.permission-admin-table td,
.documents-index-table td {
    color: var(--mp-table-text) !important;
    font-size: 13px !important;
    line-height: 1.85 !important;
    padding: 16px 18px !important;
    border-bottom: 1px solid var(--mp-table-divider) !important;
    vertical-align: middle !important;
    background: #fff !important;
}

.data-table tbody tr:hover td,
.dense-data-table tbody tr:hover td,
.project-status-table tbody tr:hover td,
.contract-list-table tbody tr:hover td,
.contracts-wide-table tbody tr:hover td,
.installation-fit-table tbody tr:hover td,
.installation-v3-table tbody tr:hover td,
.installation-v4-table tbody tr:hover td,
.it-install-mini-table tbody tr:hover td,
.notebook-checklist-table tbody tr:hover td,
.credential-table tbody tr:hover td,
.contacts-table tbody tr:hover td,
.history-table tbody tr:hover td,
.office-document-table tbody tr:hover td,
.permission-admin-table tbody tr:hover td,
.documents-index-table tbody tr:hover td {
    background: var(--mp-table-hover) !important;
}

.data-table tbody tr:last-child td,
.dense-data-table tbody tr:last-child td,
.project-status-table tbody tr:last-child td,
.contract-list-table tbody tr:last-child td,
.contracts-wide-table tbody tr:last-child td,
.installation-fit-table tbody tr:last-child td,
.installation-v3-table tbody tr:last-child td,
.installation-v4-table tbody tr:last-child td,
.it-install-mini-table tbody tr:last-child td,
.notebook-checklist-table tbody tr:last-child td,
.credential-table tbody tr:last-child td,
.contacts-table tbody tr:last-child td,
.history-table tbody tr:last-child td,
.office-document-table tbody tr:last-child td,
.permission-admin-table tbody tr:last-child td,
.documents-index-table tbody tr:last-child td {
    border-bottom: 0 !important;
}

.data-table td strong,
.dense-data-table td strong,
.project-status-table td strong,
.contract-list-table td strong,
.contracts-wide-table td strong,
.installation-fit-table td strong,
.installation-v3-table td strong,
.installation-v4-table td strong,
.it-install-mini-table td strong,
.notebook-checklist-table td strong,
.credential-table td strong,
.contacts-table td strong,
.history-table td strong,
.office-document-table td strong,
.permission-admin-table td strong,
.documents-index-table td strong {
    display: block !important;
    margin: 0 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    color: var(--mp-table-text) !important;
    line-height: 1.7 !important;
}

.data-table td small,
.dense-data-table td small,
.project-status-table td small,
.contract-list-table td small,
.contracts-wide-table td small,
.installation-fit-table td small,
.installation-v3-table td small,
.installation-v4-table td small,
.it-install-mini-table td small,
.notebook-checklist-table td small,
.credential-table td small,
.contacts-table td small,
.history-table td small,
.office-document-table td small,
.permission-admin-table td small,
.documents-index-table td small {
    display: block !important;
    margin-top: 3px !important;
    color: #8a91a2 !important;
    font-size: 11px !important;
    line-height: 1.75 !important;
}

/* quieter action controls inside tables */
.table-actions,
.table-action-row,
.inline-row-actions,
.office-row-actions,
.workflow-action-stack {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}
.mini-action-link,
.table-actions a,
.table-actions button,
.inline-row-actions .mini-action-link,
.office-row-actions .mini-action-link,
.workflow-action-stack .mini-action-link {
    min-height: 32px !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
    border: 1px solid #e5e8ef !important;
    background: #fff !important;
    color: #495365 !important;
    box-shadow: none !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}
.mini-action-link.primary,
.table-actions a.primary,
.table-actions button.primary {
    background: #f6f7fb !important;
    border-color: #dde3eb !important;
    color: #1f2937 !important;
}
.row-kebab-menu summary,
.contract-row-menu summary {
    width: 34px !important;
    height: 34px !important;
    border-radius: 11px !important;
    border: 1px solid #e5e8ef !important;
    background: #fff !important;
    color: #667085 !important;
    display: inline-grid !important;
    place-items: center !important;
}
.row-kebab-menu[open] summary,
.row-kebab-menu summary:hover,
.contract-row-menu[open] summary,
.contract-row-menu summary:hover {
    background: #f8fafc !important;
    border-color: #d8dee8 !important;
    color: #344054 !important;
}
.row-kebab-panel {
    border-radius: 14px !important;
    border: 1px solid #e5e8ef !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: 0 16px 40px rgba(15,23,42,.10) !important;
}
.row-kebab-panel a,
.row-kebab-panel button {
    min-height: 36px !important;
    padding: 0 12px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

@media (max-width: 991px) {
    .sidebar.rail-sidebar {
        inset-inline-start: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        border-radius: 0 !important;
    }
    .content-shell {
        padding-inline-start: 0 !important;
    }
}

/* v1.41.9 - fix broken sidebar URLs and make topbar closer to the approved compact reference */
.topbar.app-topbar.mp-topbar-reference {
    direction: ltr !important;
    height: 58px !important;
    min-height: 58px !important;
    display: grid !important;
    grid-template-columns: 330px minmax(360px, 1fr) 240px !important;
    grid-template-areas: "brand middle page" !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 0 22px !important;
    background: rgba(255,255,255,.96) !important;
    border-bottom: 1px solid #edf0f4 !important;
    box-shadow: 0 4px 18px rgba(15,23,42,.035) !important;
    backdrop-filter: blur(14px) !important;
}
.mp-topbar-reference > * { direction: rtl !important; }
.mp-topbar-brand-area {
    grid-area: brand;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    min-width: 0;
}
.mp-topbar-logo-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    height: 40px;
}
.mp-topbar-logo {
    display: block !important;
    width: auto !important;
    max-width: 112px !important;
    height: 34px !important;
    object-fit: contain !important;
    margin: 0 !important;
}
.mp-topbar-icon,
.mp-topbar-reference .topbar-icon-button {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid #e6e9ef !important;
    border-radius: 12px !important;
    background: #fff !important;
    color: #667085 !important;
    box-shadow: none !important;
}
.mp-topbar-icon:hover,
.mp-topbar-reference .topbar-icon-button:hover {
    background: #f8fafc !important;
    color: #344054 !important;
}
.mp-topbar-support {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 13px;
    border: 1px solid #e5e8ef;
    border-radius: 10px;
    background: #fff;
    color: #475467;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.mp-topbar-support::before {
    content: '☷';
    color: #98a2b3;
    font-size: 15px;
    line-height: 1;
}
.mp-topbar-middle-area {
    grid-area: middle;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 0;
}
.mp-topbar-search {
    width: min(360px, 45vw) !important;
    height: 40px !important;
    min-height: 40px !important;
    border: 1px solid #edf0f4 !important;
    border-radius: 13px !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}
.mp-topbar-search input {
    height: 38px !important;
    font-size: 12px !important;
}
.mp-topbar-project select {
    height: 40px !important;
    min-width: 170px !important;
    border: 1px solid #e7eaf0 !important;
    border-radius: 12px !important;
    background-color: #fff !important;
    color: #344054 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}
.mp-topbar-date {
    height: 38px !important;
    min-width: 92px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: transparent !important;
    color: #667085 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    white-space: nowrap !important;
}
.mp-topbar-profile { position: relative !important; }
.mp-profile-button {
    height: 40px !important;
    min-width: 150px !important;
    padding: 4px 7px 4px 11px !important;
    gap: 8px !important;
    border: 1px solid #e7eaf0 !important;
    border-radius: 13px !important;
    background: #fff !important;
    box-shadow: none !important;
}
.mp-profile-button .profile-avatar {
    width: 30px !important;
    height: 30px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
}
.mp-profile-button .profile-text strong {
    font-size: 12px !important;
    line-height: 1.4 !important;
    color: #344054 !important;
}
.mp-profile-button .profile-text small {
    font-size: 10px !important;
    line-height: 1.35 !important;
    color: #98a2b3 !important;
}
.mp-profile-panel.profile-panel {
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    width: 184px !important;
    min-width: 184px !important;
    max-width: 184px !important;
    z-index: 99999 !important;
}
.mp-topbar-page-area {
    grid-area: page;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
}
.mp-topbar-title {
    display: grid;
    gap: 2px;
    text-align: right;
}
.mp-topbar-title strong {
    font-size: 14px !important;
    line-height: 1.35 !important;
    color: #111827 !important;
    font-weight: 900 !important;
}
.mp-topbar-title small {
    font-size: 10px !important;
    color: #98a2b3 !important;
    font-weight: 700 !important;
}

@media (max-width: 1100px) {
    .topbar.app-topbar.mp-topbar-reference {
        grid-template-columns: 230px minmax(260px, 1fr) 170px !important;
        gap: 10px !important;
        padding-inline: 14px !important;
    }
    .mp-topbar-support { display: none !important; }
    .mp-topbar-date { display: none !important; }
    .mp-profile-button { min-width: 44px !important; }
    .mp-profile-button .profile-text { display: none !important; }
    .mp-topbar-search { width: min(300px, 42vw) !important; }
}
@media (max-width: 760px) {
    .topbar.app-topbar.mp-topbar-reference {
        height: auto !important;
        grid-template-columns: 1fr !important;
        grid-template-areas: "page" "middle" "brand" !important;
        padding-block: 10px !important;
    }
    .mp-topbar-brand-area,
    .mp-topbar-middle-area,
    .mp-topbar-page-area {
        justify-content: stretch !important;
        width: 100% !important;
    }
    .mp-topbar-search,
    .mp-topbar-project,
    .mp-topbar-project select { width: 100% !important; }
}


/* v1.42 - Fixed application frame: right rail + compact topbar + quiet left tool rail */
:root {
    --sidebar-width: 68px !important;
    --topbar-height: 56px !important;
    --layout-line: #e8ebf0;
    --layout-bg: #f5f6f8;
    --layout-sidebar: #343638;
    --layout-sidebar-soft: rgba(255,255,255,.095);
    --layout-sidebar-text: rgba(255,255,255,.70);
}

/* Right sidebar becomes the fixed column of the app, not a floating layer */
.sidebar.rail-sidebar {
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: var(--sidebar-width) !important;
    padding: 8px 7px !important;
    border-radius: 18px 0 0 18px !important;
    background: var(--layout-sidebar) !important;
    box-shadow: none !important;
    z-index: 120 !important;
    overflow: hidden !important;
}

.rail-brand {
    min-height: 56px !important;
    margin-bottom: 6px !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
}
.rail-brand .brand-symbol {
    width: 32px !important;
    height: 32px !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.09) !important;
    color: #fff !important;
}
.rail-brand small {
    font-size: 9.5px !important;
    color: rgba(255,255,255,.62) !important;
    font-weight: 700 !important;
}
.rail-nav {
    gap: 3px !important;
    padding: 2px 0 6px !important;
}
.rail-nav-item {
    min-height: 53px !important;
    border-radius: 13px !important;
    padding: 6px 2px !important;
    color: var(--layout-sidebar-text) !important;
    transition: background .16s ease, color .16s ease !important;
}
.rail-nav-item:hover {
    background: rgba(255,255,255,.07) !important;
    color: #fff !important;
    transform: none !important;
}
.rail-nav-item.active {
    background: var(--layout-sidebar-soft) !important;
    color: #fff !important;
}
.rail-nav-item.active::before {
    inset-inline-end: -7px !important;
    inset-inline-start: auto !important;
    width: 3px !important;
    top: 13px !important;
    bottom: 13px !important;
    background: rgba(255,255,255,.86) !important;
}
.rail-icon,
.rail-icon svg,
.rail-icon .rail-svg {
    width: 21px !important;
    height: 21px !important;
}
.rail-label {
    font-size: 10px !important;
    font-weight: 750 !important;
    color: currentColor !important;
}
.rail-collapse {
    width: 36px !important;
    height: 36px !important;
    margin: auto auto 0 !important;
    border-radius: 13px !important;
    background: rgba(255,255,255,.075) !important;
    color: rgba(255,255,255,.68) !important;
}

/* Submenu attached to the right sidebar */
.rail-submenu-panel {
    inset-inline-start: var(--sidebar-width) !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 174px !important;
    border-radius: 18px 0 0 18px !important;
    background: #484b4d !important;
    box-shadow: none !important;
    z-index: 112 !important;
    padding: 14px 13px 18px !important;
    transform: translateX(10px) !important;
}
.rail-submenu-panel.open { transform: translateX(0) !important; }
.rail-submenu-close {
    top: 14px !important;
    inset-inline-start: 12px !important;
    background: rgba(255,255,255,.08) !important;
}
.rail-submenu-head {
    padding: 56px 0 15px !important;
    gap: 7px !important;
    border-bottom: 1px solid rgba(255,255,255,.15) !important;
}
.rail-submenu-head > span {
    width: 32px !important;
    height: 32px !important;
    color: rgba(255,255,255,.82) !important;
}
.rail-submenu-head strong {
    font-size: 13px !important;
    font-weight: 850 !important;
}
.rail-submenu-links {
    padding-top: 14px !important;
}
.rail-submenu-links a {
    min-height: 33px !important;
    padding: 6px 6px !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    color: rgba(255,255,255,.84) !important;
}

/* The content and topbar start exactly after the right sidebar */
.content-shell {
    padding-inline-start: var(--sidebar-width) !important;
    padding-inline-end: 0 !important;
    background: var(--layout-bg) !important;
}

/* Compact topbar like the reference: one white strip, no heavy shadow */
.topbar.app-topbar.mp-topbar-reference,
.topbar.app-topbar {
    height: var(--topbar-height) !important;
    min-height: var(--topbar-height) !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    direction: ltr !important;
    display: grid !important;
    grid-template-columns: 330px minmax(420px, 1fr) 235px !important;
    grid-template-areas: "brand middle page" !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 0 20px !important;
    background: #fff !important;
    border-bottom: 1px solid var(--layout-line) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}
.mp-topbar-reference > *,
.topbar.app-topbar > * {
    direction: rtl !important;
}

/* left identity/actions group: logo must be the first visual item */
.mp-topbar-brand-area {
    grid-area: brand !important;
    direction: ltr !important;
    justify-content: flex-start !important;
    gap: 11px !important;
}
.mp-topbar-logo-link {
    order: 1 !important;
    min-width: 104px !important;
    height: 38px !important;
}
.mp-topbar-logo {
    height: 32px !important;
    max-width: 116px !important;
}
.mp-topbar-icon {
    order: 2 !important;
}
.mp-topbar-support {
    order: 3 !important;
    direction: rtl !important;
    min-height: 36px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}

/* center group: search, project, date, profile in one rhythm */
.mp-topbar-middle-area {
    grid-area: middle !important;
    justify-content: center !important;
    gap: 9px !important;
    min-width: 0 !important;
}
.mp-topbar-search {
    width: min(340px, 38vw) !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    border-color: #edf0f4 !important;
}
.mp-topbar-search input {
    height: 36px !important;
    font-size: 12px !important;
}
.mp-topbar-project select {
    height: 38px !important;
    min-width: 162px !important;
    border-radius: 9px !important;
    font-size: 12px !important;
}
.mp-topbar-date {
    height: auto !important;
    min-width: auto !important;
    padding: 0 6px !important;
    border: 0 !important;
    background: transparent !important;
    color: #667085 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}
.mp-profile-button {
    height: 38px !important;
    min-width: 146px !important;
    padding: 0 8px !important;
    border-radius: 10px !important;
    border: 1px solid #edf0f4 !important;
    background: #fff !important;
}
.mp-profile-button .profile-avatar {
    width: 30px !important;
    height: 30px !important;
    border-radius: 10px !important;
}
.mp-profile-button .profile-text strong {
    font-size: 12px !important;
    font-weight: 850 !important;
}
.mp-profile-button .profile-text small {
    font-size: 10px !important;
}
.mp-profile-panel.profile-panel {
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    z-index: 99999 !important;
}

/* right page title area beside sidebar */
.mp-topbar-page-area {
    grid-area: page !important;
    justify-content: flex-end !important;
    gap: 10px !important;
}
.mp-topbar-title strong {
    font-size: 14px !important;
    font-weight: 900 !important;
}
.mp-topbar-title small {
    font-size: 10px !important;
    color: #98a2b3 !important;
}

/* Left tool rail: quieter, begins under topbar, not a second menu */
.mp-left-tools-rail {
    top: var(--topbar-height) !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 48px !important;
    background: #fff !important;
    border-right: 1px solid var(--layout-line) !important;
    box-shadow: none !important;
    z-index: 85 !important;
}
.mp-left-tool {
    width: 48px !important;
    min-height: 58px !important;
    padding: 7px 2px !important;
    gap: 3px !important;
    color: #6b7280 !important;
    font-size: 9.5px !important;
    font-weight: 650 !important;
    border-bottom: 1px solid #f0f2f5 !important;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    background: #f8fafc !important;
    color: #30343b !important;
}
.mp-left-tool-icon svg {
    width: 18px !important;
    height: 18px !important;
}
.mp-filter-drawer {
    left: 48px !important;
}

/* Main content should not hide under left rail when the rail exists */
body:has(.mp-left-tools-rail:not([hidden])) .main-content {
    padding-left: 58px !important;
}

/* Responsive: restore simple mobile behavior */
@media (max-width: 1100px) {
    .topbar.app-topbar.mp-topbar-reference,
    .topbar.app-topbar {
        grid-template-columns: 150px minmax(220px, 1fr) 165px !important;
        gap: 8px !important;
        padding-inline: 12px !important;
    }
    .mp-topbar-support,
    .mp-topbar-date {
        display: none !important;
    }
    .mp-profile-button {
        min-width: 42px !important;
    }
    .mp-profile-button .profile-text {
        display: none !important;
    }
}
@media (max-width: 760px) {
    .content-shell { padding-inline-start: 0 !important; }
    .sidebar.rail-sidebar {
        inset-inline-start: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        border-radius: 0 !important;
        transform: translateX(110%) !important;
    }
    .sidebar.rail-sidebar.open { transform: translateX(0) !important; }
    .topbar.app-topbar.mp-topbar-reference,
    .topbar.app-topbar {
        grid-template-columns: 1fr auto !important;
        grid-template-areas: "middle page" !important;
    }
    .mp-topbar-brand-area { display: none !important; }
}


/* v1.42.1 - Header order, right sidebar/submenu behavior per approved reference */
:root {
    --sidebar-width: 68px !important;
    --topbar-height: 56px !important;
    --layout-sidebar: #343638;
    --layout-submenu: #484b4d;
    --layout-line: #e8ebf0;
}

/* Right sidebar: fixed on the right edge, dark, with approved left curvature */
.sidebar.rail-sidebar {
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: var(--sidebar-width) !important;
    padding: 8px 7px !important;
    border-radius: 18px 0 0 18px !important;
    background: var(--layout-sidebar) !important;
    box-shadow: none !important;
    overflow: hidden !important;
    z-index: 130 !important;
}
.rail-brand-logo-only {
    min-height: 58px !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    color: #fff !important;
}
.rail-brand-logo-only img {
    width: 40px !important;
    height: 34px !important;
    object-fit: contain !important;
    filter: brightness(0) invert(1) grayscale(1) contrast(1.2) !important;
    opacity: .96 !important;
}
.rail-brand-logo-only small,
.rail-brand-logo-only .brand-symbol {
    display: none !important;
}
.rail-nav {
    gap: 3px !important;
    padding: 0 0 6px !important;
}
.rail-nav-item {
    min-height: 53px !important;
    border-radius: 13px !important;
    padding: 6px 2px !important;
    color: rgba(255,255,255,.70) !important;
    transform: none !important;
}
.rail-nav-item:hover {
    background: rgba(255,255,255,.07) !important;
    color: #fff !important;
    transform: none !important;
}
.rail-nav-item.active {
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
}
.rail-nav-item.active::before {
    inset-inline-end: -7px !important;
    inset-inline-start: auto !important;
    width: 3px !important;
    top: 13px !important;
    bottom: 13px !important;
    background: rgba(255,255,255,.88) !important;
}
.rail-label {
    font-size: 10px !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
}
.rail-icon,
.rail-icon svg,
.rail-icon .rail-svg {
    width: 21px !important;
    height: 21px !important;
}
.rail-collapse {
    width: 36px !important;
    height: 36px !important;
    margin: auto auto 0 !important;
    border-radius: 13px !important;
    background: rgba(255,255,255,.075) !important;
    color: rgba(255,255,255,.70) !important;
}

/* Submenu: open exactly like the reference, as a simple attached dark strip */
.rail-submenu-panel {
    position: fixed !important;
    inset-inline-start: var(--sidebar-width) !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 150px !important;
    min-height: auto !important;
    max-height: none !important;
    padding: 14px 12px 18px !important;
    border-radius: 0 !important;
    background: var(--layout-submenu) !important;
    box-shadow: none !important;
    z-index: 122 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(8px) !important;
    transition: opacity .18s ease, transform .18s ease !important;
    overflow-y: auto !important;
}
.rail-submenu-panel.open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}
.rail-submenu-close {
    top: 12px !important;
    inset-inline-start: 10px !important;
    width: 28px !important;
    height: 28px !important;
    background: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.88) !important;
}
.rail-submenu-head {
    padding: 58px 0 15px !important;
    gap: 7px !important;
    border-bottom: 1px solid rgba(255,255,255,.16) !important;
}
.rail-submenu-head > span {
    width: 32px !important;
    height: 32px !important;
    background: transparent !important;
    color: rgba(255,255,255,.82) !important;
}
.rail-submenu-head strong {
    font-size: 13px !important;
    font-weight: 850 !important;
}
.rail-submenu-head small {
    display: none !important;
}
.rail-submenu-links {
    gap: 0 !important;
    padding-top: 14px !important;
}
.rail-submenu-links a {
    min-height: 33px !important;
    padding: 6px 5px !important;
    border-radius: 0 !important;
    color: rgba(255,255,255,.86) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    text-align: center !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.06) !important;
    color: #fff !important;
}

/* Header: full white strip goes behind the sidebar; sidebar stays above it */
.content-shell {
    padding-inline-start: var(--sidebar-width) !important;
    background: #f5f6f8 !important;
}
.topbar.app-topbar.mp-topbar-clean {
    height: var(--topbar-height) !important;
    min-height: var(--topbar-height) !important;
    margin-inline-start: calc(-1 * var(--sidebar-width)) !important;
    padding-inline-start: calc(var(--sidebar-width) + 20px) !important;
    padding-inline-end: 20px !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    direction: rtl !important;
    display: grid !important;
    grid-template-columns: 230px minmax(320px, 1fr) 330px !important;
    grid-template-areas: "right center left" !important;
    align-items: center !important;
    gap: 16px !important;
    background: #fff !important;
    border-bottom: 1px solid var(--layout-line) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}
.mp-clean-right {
    grid-area: right !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    min-width: 0 !important;
}
.mp-clean-center {
    grid-area: center !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    min-width: 0 !important;
}
.mp-clean-left {
    grid-area: left !important;
    direction: ltr !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}
.mp-clean-left > * {
    direction: rtl !important;
}
.mp-clean-project select {
    height: 38px !important;
    min-width: 180px !important;
    border-radius: 10px !important;
    border: 1px solid #e7eaf0 !important;
    background-color: #fff !important;
    color: #344054 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}
.mp-clean-search {
    width: min(420px, 42vw) !important;
    height: 38px !important;
    min-height: 38px !important;
    border-radius: 10px !important;
    border: 1px solid #edf0f4 !important;
    background: #f8fafc !important;
    box-shadow: none !important;
}
.mp-clean-search input {
    height: 36px !important;
    font-size: 12px !important;
}
.mp-clean-profile-button {
    height: 38px !important;
    min-width: 146px !important;
    padding: 0 8px !important;
    border-radius: 10px !important;
    border: 1px solid #edf0f4 !important;
    background: #fff !important;
    color: #344054 !important;
}
.mp-clean-profile-button .profile-text strong {
    font-size: 12px !important;
    font-weight: 850 !important;
}
.mp-clean-profile-button .profile-text small {
    font-size: 10px !important;
    color: #98a2b3 !important;
}
.mp-clean-profile-button .profile-avatar {
    width: 30px !important;
    height: 30px !important;
    border-radius: 10px !important;
}
.mp-clean-notification {
    width: 38px !important;
    height: 38px !important;
    border: 1px solid #e7eaf0 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #667085 !important;
    box-shadow: none !important;
}
.mp-clean-date {
    height: auto !important;
    min-width: auto !important;
    padding: 0 2px !important;
    border: 0 !important;
    background: transparent !important;
    color: #667085 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
}
.mp-profile-panel.profile-panel {
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: auto !important;
    width: 174px !important;
    min-width: 174px !important;
    max-width: 174px !important;
    z-index: 99999 !important;
}

/* Left tool rail remains quiet and starts below the topbar */
.mp-left-tools-rail {
    top: var(--topbar-height) !important;
    width: 48px !important;
    box-shadow: none !important;
    z-index: 85 !important;
}
.mp-left-tool {
    width: 48px !important;
    min-height: 58px !important;
    font-size: 9.5px !important;
    font-weight: 650 !important;
    color: #6b7280 !important;
}
.mp-filter-drawer {
    left: 48px !important;
}

/* Keep previous header elements removed if cached CSS tries to display them */
.mp-topbar-brand-area,
.mp-topbar-page-area,
.mp-topbar-logo-link,
.mp-topbar-support {
    display: none !important;
}

@media (max-width: 1100px) {
    .topbar.app-topbar.mp-topbar-clean {
        grid-template-columns: 180px minmax(240px, 1fr) 190px !important;
        gap: 10px !important;
    }
    .mp-clean-date { display: none !important; }
    .mp-clean-profile-button { min-width: 42px !important; }
    .mp-clean-profile-button .profile-text { display: none !important; }
}
@media (max-width: 760px) {
    .content-shell { padding-inline-start: 0 !important; }
    .topbar.app-topbar.mp-topbar-clean {
        margin-inline-start: 0 !important;
        padding-inline-start: 12px !important;
        grid-template-columns: minmax(180px, 1fr) auto !important;
        grid-template-areas: "center left" !important;
    }
    .mp-clean-right { display: none !important; }
    .sidebar.rail-sidebar {
        inset-inline-start: 0 !important;
        border-radius: 0 !important;
        transform: translateX(110%) !important;
    }
    .sidebar.rail-sidebar.open { transform: translateX(0) !important; }
}


/* v1.42.2 - Header user/date/bell order and quieter left tool rail */
.mp-clean-left {
    direction: ltr !important;
    justify-content: flex-start !important;
    gap: 10px !important;
}

.mp-clean-left > * {
    direction: rtl !important;
}

/* Visual order from left to right: user, bell, date.
   Therefore from right to left it reads: date, bell, user. */
.mp-clean-profile {
    order: 1 !important;
}
.mp-clean-notification {
    order: 2 !important;
}
.mp-clean-date {
    order: 3 !important;
}

/* Avatar must be on the right side of the user name */
.mp-clean-profile-button {
    direction: rtl !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    gap: 8px !important;
}
.mp-clean-profile-button .profile-avatar {
    order: 1 !important;
    margin: 0 !important;
}
.mp-clean-profile-button .profile-text {
    order: 2 !important;
    text-align: right !important;
}

/* Left filter/sort rail: a bit wider, black text/icon, not bold */
.mp-left-tools-rail {
    width: 56px !important;
}
.mp-left-tool {
    width: 56px !important;
    min-height: 60px !important;
    color: #111827 !important;
    font-weight: 500 !important;
    font-size: 10px !important;
    letter-spacing: 0 !important;
}
.mp-left-tool-icon {
    color: #111827 !important;
}
.mp-left-tool-icon svg {
    width: 19px !important;
    height: 19px !important;
}
.mp-left-tool:hover,
.mp-left-tool.active {
    background: #f8fafc !important;
    color: #111827 !important;
}
.mp-filter-drawer {
    left: 56px !important;
}

/* Content safe spacing when the left tool rail is shown */
body:has(.mp-left-tools-rail:not([hidden])) .main-content {
    padding-left: 66px !important;
}

@media (max-width: 760px) {
    .mp-left-tools-rail {
        width: 50px !important;
    }
    .mp-left-tool {
        width: 50px !important;
    }
    .mp-filter-drawer {
        left: 50px !important;
    }
}


/* v1.42.3 - Force left header order: user, notifications, date */
.topbar.app-topbar.mp-topbar-clean .mp-clean-left {
    direction: ltr !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 10px !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-left > * {
    direction: rtl !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-profile {
    order: 1 !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-notification {
    order: 2 !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-date {
    order: 3 !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-profile-button {
    direction: rtl !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-profile-button .profile-avatar {
    order: 1 !important;
}
.topbar.app-topbar.mp-topbar-clean .mp-clean-profile-button .profile-text {
    order: 2 !important;
}


/* v1.42.4 - Right sidebar opened submenu exactly like approved reference */
:root {
    --sidebar-width: 68px !important;
    --rail-open-width: 150px !important;
    --rail-color: #343638;
    --rail-sub-color: #474a4c;
}

/* keep the main right rail above the submenu */
.sidebar.rail-sidebar {
    width: var(--sidebar-width) !important;
    background: var(--rail-color) !important;
    border-radius: 18px 0 0 18px !important;
    z-index: 140 !important;
    overflow: hidden !important;
}

/* opened menu must start under the sidebar layer, with no white corner on top */
.rail-submenu-panel {
    position: fixed !important;
    inset-inline-start: var(--sidebar-width) !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: var(--rail-open-width) !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    padding: 16px 14px 22px !important;
    background: var(--rail-sub-color) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    z-index: 125 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(0) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
}
.rail-submenu-panel::-webkit-scrollbar {
    display: none !important;
}
.rail-submenu-panel.open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}

/* Close arrow in exact minimal style */
.rail-submenu-close {
    position: absolute !important;
    top: 13px !important;
    inset-inline-start: 12px !important;
    width: 28px !important;
    height: 28px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.86) !important;
    font-size: 20px !important;
    line-height: 1 !important;
}

/* Head alignment, typography and color */
.rail-submenu-head {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    gap: 9px !important;
    padding: 62px 0 17px !important;
    margin: 0 0 15px !important;
    border-bottom: 1px solid rgba(255,255,255,.16) !important;
}
.rail-submenu-head > span {
    width: 34px !important;
    height: 34px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.88) !important;
    display: grid !important;
    place-items: center !important;
}
.rail-submenu-head svg,
.rail-submenu-head .rail-svg {
    width: 25px !important;
    height: 25px !important;
    color: currentColor !important;
}
.rail-submenu-head svg path {
    fill: currentColor !important;
}
.rail-submenu-head strong {
    display: block !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.8 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-head small {
    display: none !important;
}

/* Links: centered, white, same font feel, no heavy pill backgrounds */
.rail-submenu-links {
    display: grid !important;
    gap: 0 !important;
    padding: 0 !important;
}
.rail-submenu-links a {
    min-height: 34px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding: 6px 4px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.86) !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.75 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.055) !important;
    color: #fff !important;
}

/* The active item on the main rail remains visible above the opened menu */
.rail-nav-item.active {
    background: rgba(255,255,255,.11) !important;
    color: #fff !important;
}
.rail-nav-item.active::before {
    background: rgba(255,255,255,.85) !important;
}

/* avoid any overlay/scrim that may create visual gaps */
.rail-scrim,
.rail-scrim.open {
    display: none !important;
    pointer-events: none !important;
}


/* v1.42.5 - IRANSans font + submenu underlay fix for rounded right rail */
@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSansWeb.woff2') format('woff2'),
         url('../fonts/IRANSansWeb.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSansWeb_Medium.woff2') format('woff2'),
         url('../fonts/IRANSansWeb_Medium.woff') format('woff');
    font-weight: 500 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'IRANSans';
    src: url('../fonts/IRANSansWeb_Bold.woff2') format('woff2'),
         url('../fonts/IRANSansWeb_Bold.woff') format('woff');
    font-weight: 850 950;
    font-style: normal;
    font-display: swap;
}

:root {
    --font-main: 'IRANSans', 'Vazirmatn', Tahoma, Arial, sans-serif !important;
    --rail-width-fixed: 68px;
    --rail-open-width-fixed: 154px;
    --rail-dark-main: #343638;
    --rail-dark-open: #474a4c;
}
html, body, input, button, select, textarea, table, th, td, a, span, small, strong, p, div,
label, option, summary {
    font-family: var(--font-main) !important;
}

/* right rail remains above everything */
.sidebar.rail-sidebar {
    width: var(--rail-width-fixed) !important;
    inset-inline-start: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    background: var(--rail-dark-main) !important;
    border-radius: 18px 0 0 18px !important;
    z-index: 160 !important;
    overflow: hidden !important;
}

/*
  The opened submenu is wider than the visible submenu and starts from the page edge.
  It sits UNDER the main rail, so the rounded corners of the rail never reveal white.
*/
.rail-submenu-panel {
    position: fixed !important;
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: calc(var(--rail-width-fixed) + var(--rail-open-width-fixed)) !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    box-sizing: border-box !important;
    padding-block: 16px 22px !important;
    padding-inline-start: calc(var(--rail-width-fixed) + 13px) !important;
    padding-inline-end: 12px !important;
    background: var(--rail-dark-open) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    z-index: 145 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(0) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
}
.rail-submenu-panel::-webkit-scrollbar { display: none !important; }
.rail-submenu-panel.open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
}

/* close arrow must be in the visible opened area, not under the main rail */
.rail-submenu-close {
    position: absolute !important;
    top: 14px !important;
    left: 12px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 28px !important;
    height: 28px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.08) !important;
    color: rgba(255,255,255,.88) !important;
    display: grid !important;
    place-items: center !important;
    font-size: 19px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* visible submenu content: centered, same alignment and typography as reference */
.rail-submenu-content {
    width: 100% !important;
}
.rail-submenu-head {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    padding: 62px 0 16px !important;
    margin: 0 0 14px !important;
    border-bottom: 1px solid rgba(255,255,255,.16) !important;
}
.rail-submenu-head > span {
    width: 34px !important;
    height: 34px !important;
    display: grid !important;
    place-items: center !important;
    background: transparent !important;
    color: rgba(255,255,255,.88) !important;
    border-radius: 0 !important;
}
.rail-submenu-head svg,
.rail-submenu-head .rail-svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    color: currentColor !important;
}
.rail-submenu-head svg path,
.rail-submenu-head .rail-svg path {
    fill: currentColor !important;
}
.rail-submenu-head strong {
    display: block !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.85 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-head small { display: none !important; }

.rail-submenu-links {
    display: grid !important;
    gap: 0 !important;
    padding: 0 !important;
}
.rail-submenu-links a {
    min-height: 34px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding: 6px 4px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.84) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.75 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.055) !important;
    color: #fff !important;
}

/* main rail typography closer to reference */
.rail-label {
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
}
.rail-nav-item {
    color: rgba(255,255,255,.70) !important;
}
.rail-nav-item.active {
    background: rgba(255,255,255,.105) !important;
    color: #fff !important;
}

/* prevent any transparent/scrim layer from showing white seams */
.rail-scrim,
.rail-scrim.open {
    display: none !important;
    pointer-events: none !important;
}


/* v1.42.6 - Exact right rail + opened submenu visual alignment */
:root {
    --mp-rail-w: 68px;
    --mp-submenu-w: 116px;
    --mp-rail-bg: #343638;
    --mp-submenu-bg: #474a4c;
}

/* Main right sidebar must always stay ABOVE the opened submenu */
.sidebar.rail-sidebar {
    position: fixed !important;
    inset-inline-start: 0 !important; /* RTL: right edge */
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: var(--mp-rail-w) !important;
    padding: 8px 7px !important;
    background: var(--mp-rail-bg) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    z-index: 10010 !important;
    overflow: hidden !important;
}

/* The submenu is a background layer under the main rail.
   Its total width includes the rail width, so rounded rail corners never reveal white. */
.rail-submenu-panel {
    position: fixed !important;
    inset-inline-start: 0 !important; /* RTL: from right page edge */
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    min-width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    max-width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    box-sizing: border-box !important;
    padding-top: 14px !important;
    padding-bottom: 22px !important;
    padding-inline-start: calc(var(--mp-rail-w) + 10px) !important; /* RTL: padding-right; content starts after right rail */
    padding-inline-end: 10px !important;
    background: var(--mp-submenu-bg) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: none !important;
    transition: opacity .16s ease !important;
    z-index: 10000 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
}
.rail-submenu-panel::-webkit-scrollbar { display: none !important; }
.rail-submenu-panel.open {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
}

/* The close arrow position must match the reference: top-left of the opened submenu area */
.rail-submenu-panel > .rail-submenu-close {
    position: absolute !important;
    top: 13px !important;
    left: 8px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 28px !important;
    height: 28px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.075) !important;
    color: rgba(255,255,255,.88) !important;
    display: grid !important;
    place-items: center !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

/* Visible submenu column: compact, centered and close to the provided reference */
.rail-submenu-content {
    width: 100% !important;
    max-width: var(--mp-submenu-w) !important;
    margin: 0 !important;
}
.rail-submenu-content[hidden] { display: none !important; }

.rail-submenu-head {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    padding: 48px 0 13px !important;
    margin: 0 0 12px !important;
    border-bottom: 1px solid rgba(255,255,255,.18) !important;
}
.rail-submenu-head > span {
    width: 33px !important;
    height: 33px !important;
    display: grid !important;
    place-items: center !important;
    background: transparent !important;
    color: rgba(255,255,255,.90) !important;
    border-radius: 0 !important;
}
.rail-submenu-head svg,
.rail-submenu-head .rail-svg {
    width: 24px !important;
    height: 24px !important;
    color: currentColor !important;
}
.rail-submenu-head svg path,
.rail-submenu-head .rail-svg path {
    fill: currentColor !important;
}
.rail-submenu-head strong {
    display: block !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.8 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-head small {
    display: none !important;
}

.rail-submenu-links {
    display: grid !important;
    gap: 0 !important;
    padding: 0 !important;
}
.rail-submenu-links a {
    min-height: 34px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding: 6px 2px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.84) !important;
    font-size: 12px !important;
    font-weight: 450 !important;
    line-height: 1.75 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.055) !important;
    color: #fff !important;
}

/* Main rail labels and active item must look like the reference, not heavy/bold */
.rail-nav-item {
    color: rgba(255,255,255,.70) !important;
    background: transparent !important;
}
.rail-nav-item:hover {
    background: rgba(255,255,255,.06) !important;
}
.rail-nav-item.active {
    background: rgba(255,255,255,.105) !important;
    color: #fff !important;
}
.rail-nav-item.active::before {
    background: rgba(255,255,255,.86) !important;
}
.rail-label {
    font-size: 10px !important;
    font-weight: 550 !important;
    line-height: 1.35 !important;
}
.rail-icon,
.rail-icon svg,
.rail-icon .rail-svg {
    width: 21px !important;
    height: 21px !important;
}
.rail-brand-logo-only img {
    filter: brightness(0) invert(1) grayscale(1) contrast(1.15) !important;
    opacity: .95 !important;
}

/* No scrim and no white seam */
.rail-scrim,
.rail-scrim.open {
    display: none !important;
    pointer-events: none !important;
}


/* v1.42.7 - Make opened right submenu visually match the reference more closely */
:root {
    --mp-rail-w: 68px;
    --mp-submenu-w: 118px;
    --mp-rail-bg: #343638;
    --mp-submenu-bg: #474a4c;
}

/* Reference has no separate logo block above the first nav item. */
.rail-brand,
.rail-brand-logo-only {
    display: none !important;
}

/* Main right rail */
.sidebar.rail-sidebar {
    width: var(--mp-rail-w) !important;
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    padding: 8px 7px !important;
    background: var(--mp-rail-bg) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    overflow: hidden !important;
    z-index: 10020 !important;
}
.rail-nav {
    padding-top: 0 !important;
    gap: 3px !important;
}
.rail-nav-item {
    min-height: 53px !important;
    border-radius: 13px !important;
    padding: 6px 2px !important;
    color: rgba(255,255,255,.70) !important;
    background: transparent !important;
}
.rail-nav-item:hover {
    background: rgba(255,255,255,.065) !important;
    color: #fff !important;
    transform: none !important;
}
.rail-nav-item.active {
    background: rgba(255,255,255,.105) !important;
    color: #fff !important;
}
.rail-nav-item.active::before {
    display: none !important;
}
.rail-icon,
.rail-icon svg,
.rail-icon .rail-svg {
    width: 21px !important;
    height: 21px !important;
}
.rail-label {
    font-size: 10px !important;
    font-weight: 550 !important;
    line-height: 1.35 !important;
    color: currentColor !important;
}

/* Open submenu: begins from the page edge and sits below the main rail to remove all white seams. */
.rail-submenu-panel {
    position: fixed !important;
    inset-inline-start: 0 !important;
    inset-inline-end: auto !important;
    top: 0 !important;
    bottom: 0 !important;
    width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    min-width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    max-width: calc(var(--mp-rail-w) + var(--mp-submenu-w)) !important;
    min-height: 100vh !important;
    max-height: 100vh !important;
    box-sizing: border-box !important;
    background: var(--mp-submenu-bg) !important;
    border-radius: 18px 0 0 18px !important;
    box-shadow: none !important;
    z-index: 10010 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: none !important;
    transition: opacity .14s ease !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: none !important;
    padding-top: 10px !important;
    padding-bottom: 22px !important;
    padding-inline-start: calc(var(--mp-rail-w) + 10px) !important;
    padding-inline-end: 8px !important;
}
.rail-submenu-panel.open {
    opacity: 1 !important;
    pointer-events: auto !important;
}
.rail-submenu-panel::-webkit-scrollbar { display: none !important; }

.rail-submenu-close {
    position: absolute !important;
    top: 12px !important;
    left: 8px !important;
    right: auto !important;
    inset-inline-start: auto !important;
    inset-inline-end: auto !important;
    width: 28px !important;
    height: 28px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(255,255,255,.075) !important;
    color: rgba(255,255,255,.86) !important;
    display: grid !important;
    place-items: center !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
}

.rail-submenu-content {
    width: 100% !important;
    max-width: var(--mp-submenu-w) !important;
}
.rail-submenu-content[hidden] { display: none !important; }

.rail-submenu-head {
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    padding: 40px 0 12px !important;
    margin: 0 0 12px !important;
    border-bottom: 1px solid rgba(255,255,255,.18) !important;
}
.rail-submenu-head > span {
    width: 34px !important;
    height: 34px !important;
    display: grid !important;
    place-items: center !important;
    background: transparent !important;
    color: rgba(255,255,255,.88) !important;
    border-radius: 0 !important;
}
.rail-submenu-head svg,
.rail-submenu-head .rail-svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    color: currentColor !important;
}
.rail-submenu-head svg path,
.rail-submenu-head .rail-svg path {
    fill: currentColor !important;
}
.rail-submenu-head strong {
    display: block !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.8 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-head small { display: none !important; }

.rail-submenu-links {
    display: grid !important;
    gap: 0 !important;
    padding: 0 !important;
}
.rail-submenu-links a {
    min-height: 34px !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
    padding: 6px 2px !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(255,255,255,.84) !important;
    font-size: 12px !important;
    font-weight: 450 !important;
    line-height: 1.75 !important;
    letter-spacing: 0 !important;
}
.rail-submenu-links a:hover {
    background: rgba(255,255,255,.055) !important;
    color: #fff !important;
}

.rail-scrim,
.rail-scrim.open {
    display: none !important;
    pointer-events: none !important;
}


/* v1.42.8 - Restore top logo in right sidebar; keep submenu fixes */
.rail-brand,
.rail-brand-logo-only {
    min-height: 58px !important;
    height: 58px !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.07) !important;
    background: transparent !important;
    color: #fff !important;
}
.rail-brand-logo-only img,
.rail-brand img {
    width: 40px !important;
    max-width: 40px !important;
    height: 34px !important;
    object-fit: contain !important;
    display: block !important;
    filter: brightness(0) invert(1) grayscale(1) contrast(1.15) !important;
    opacity: .96 !important;
}
.rail-brand-logo-only small,
.rail-brand-logo-only .brand-symbol,
.rail-brand small,
.rail-brand .brand-symbol {
    display: none !important;
}

/* keep nav directly after restored logo */
.rail-nav {
    padding-top: 0 !important;
}

/* submenu remains under the main rail so rounded corners do not show white */
.rail-submenu-panel {
    z-index: 10010 !important;
}
.sidebar.rail-sidebar {
    z-index: 10020 !important;
}


/* v1.45 - Sales opportunity row: cleaner CRM list, no phone/email in row, important actions visible */
.sales-opportunity-list-v2 {
    gap: 0 !important;
}

.sales-opportunity-row-v3 {
    min-height: 84px !important;
    grid-template-columns: minmax(250px, 1.35fr) minmax(520px, 2fr) auto !important;
    align-items: center !important;
    padding: 14px 18px !important;
    border-bottom: 1px solid #edf0f4 !important;
    background: #fff !important;
}

.sales-opportunity-row-v3:last-child {
    border-bottom: 0 !important;
}

.sales-opportunity-row-v3 .sales-row-accent {
    width: 3px !important;
    opacity: .72 !important;
}

.sales-row-main-v2 {
    min-width: 0 !important;
    gap: 10px !important;
}

.sales-row-main-v2 .sales-customer-avatar {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
    flex: 0 0 auto !important;
}

.sales-row-title {
    gap: 2px !important;
    min-width: 0 !important;
}

.sales-row-title strong {
    font-size: 14px !important;
    font-weight: 850 !important;
    color: #111827 !important;
    line-height: 1.55 !important;
}

.sales-row-title > span.sales-row-subtitle,
.sales-row-title > small.sales-row-subtitle {
    display: block !important;
    margin-top: 1px !important;
    color: #7b8494 !important;
    font-size: 11px !important;
    font-weight: 650 !important;
    line-height: 1.6 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-tag-line {
    margin-top: 5px !important;
}

.sales-row-meta-v2 {
    display: grid !important;
    grid-template-columns: 112px 150px 105px 105px 120px 110px !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}

.sales-row-meta-v2 > div {
    min-width: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.sales-row-meta-v2 small {
    display: block !important;
    margin-bottom: 2px !important;
    color: #98a2b3 !important;
    font-size: 10px !important;
    font-weight: 650 !important;
    line-height: 1.4 !important;
}

.sales-row-meta-v2 strong {
    display: block !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.55 !important;
    white-space: nowrap !important;
}

.sales-row-meta-v2 .status-pill {
    min-height: 24px !important;
    padding: 2px 9px !important;
    font-size: 11px !important;
    font-weight: 750 !important;
}

.sales-progress-track {
    margin-top: 5px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: #edf0f4 !important;
}

.sales-progress-track i {
    height: 4px !important;
}

.sales-next-follow em {
    display: inline-flex !important;
    margin-top: 4px !important;
    min-height: 20px !important;
    padding: 1px 8px !important;
    border-radius: 999px !important;
    font-size: 10px !important;
    font-weight: 750 !important;
}

.sales-row-actions-v4 {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    min-width: 230px !important;
}

.sales-row-primary-action {
    height: 32px !important;
    min-width: 66px !important;
    padding: 0 12px !important;
    border: 1px solid #e5e8ef !important;
    border-radius: 11px !important;
    background: #fff !important;
    color: #475467 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.sales-row-primary-action:hover {
    background: #f8fafc !important;
    color: #111827 !important;
}

.sales-row-primary-action-accent {
    border-color: rgba(108,71,255,.22) !important;
    background: rgba(108,71,255,.075) !important;
    color: #5b3bea !important;
}

.sales-row-primary-action-accent:hover {
    background: rgba(108,71,255,.11) !important;
    color: #4b2fd6 !important;
}

.sales-row-kebab-action .row-kebab-menu summary {
    width: 32px !important;
    height: 32px !important;
    border-radius: 11px !important;
}

.sales-actions-menu .row-kebab-panel button,
.sales-actions-menu .row-kebab-panel form button {
    text-align: right !important;
}

/* Header of opportunities card: counter feels related to title, not a loose chip */
.sales-count-pill-v3 {
    margin-inline-start: 6px !important;
    font-size: 11px !important;
    min-height: 24px !important;
    padding: 2px 10px !important;
}

/* Keep layout usable on smaller desktop widths */
@media (max-width: 1250px) {
    .sales-opportunity-row-v3 {
        grid-template-columns: minmax(220px, 1fr) minmax(430px, 1.6fr) auto !important;
    }
    .sales-row-meta-v2 {
        grid-template-columns: 105px 135px 90px 90px 110px 100px !important;
        gap: 8px !important;
    }
    .sales-row-actions-v4 {
        min-width: 190px !important;
    }
}

@media (max-width: 980px) {
    .sales-opportunity-row-v3 {
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }
    .sales-row-meta-v2 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sales-row-actions-v4 {
        justify-content: flex-start !important;
        min-width: 0 !important;
    }
}


/* v1.46 - Sales opportunities: true operational CRM row */
.sales-list-head-v5 {
    display: grid !important;
    grid-template-columns: minmax(220px, 1fr) minmax(280px, 380px) !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid #edf0f4 !important;
}

.sales-list-title-v5 {
    display: grid !important;
    gap: 3px !important;
    justify-items: start !important;
    text-align: right !important;
}

.sales-list-title-line {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
}

.sales-list-title-v5 strong {
    font-size: 15px !important;
    font-weight: 900 !important;
    color: #111827 !important;
    line-height: 1.5 !important;
}

.sales-list-title-v5 small {
    font-size: 11px !important;
    color: #8a93a3 !important;
    font-weight: 600 !important;
}

.sales-count-pill-v5 {
    margin: 0 !important;
    min-height: 24px !important;
    padding: 2px 10px !important;
    font-size: 11px !important;
    font-weight: 750 !important;
}

.sales-list-search-v5 {
    justify-self: end !important;
    width: min(100%, 380px) !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 8px !important;
}

.sales-list-search-v5 input {
    height: 36px !important;
    border-radius: 11px !important;
    border: 1px solid #e3e7ef !important;
    background: #fff !important;
    font-size: 12px !important;
}

.sales-list-search-v5 button {
    height: 36px !important;
    border-radius: 11px !important;
    padding: 0 13px !important;
    background: #f3f5f8 !important;
    color: #344054 !important;
    border: 1px solid #e5e8ef !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.sales-opportunity-list-v2 {
    display: grid !important;
    gap: 0 !important;
}

.sales-opportunity-row-v5 {
    min-height: 78px !important;
    display: grid !important;
    grid-template-columns: minmax(230px, 1.08fr) minmax(500px, 1.72fr) 218px !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 12px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid #eef1f5 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    position: relative !important;
}

.sales-opportunity-row-v5:last-child {
    border-bottom: 0 !important;
}

.sales-opportunity-row-v5 .sales-row-accent {
    position: absolute !important;
    inset-block: 10px !important;
    inset-inline-start: auto !important;
    inset-inline-end: 0 !important;
    width: 2px !important;
    border-radius: 999px !important;
    opacity: .55 !important;
}

.sales-row-main-v5 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    min-width: 0 !important;
}

.sales-row-main-v5 .sales-customer-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    flex: 0 0 auto !important;
}

.sales-opportunity-row-v5 .sales-row-title {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
}

.sales-opportunity-row-v5 .sales-row-title strong {
    font-size: 14px !important;
    font-weight: 900 !important;
    color: #111827 !important;
    line-height: 1.55 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-opportunity-row-v5 .sales-row-subtitle {
    font-size: 11px !important;
    color: #7b8494 !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-opportunity-row-v5 .sales-tag-line {
    margin-top: 3px !important;
    gap: 5px !important;
}

.sales-row-meta-v5 {
    display: grid !important;
    grid-template-columns: 105px minmax(128px, 1.2fr) 92px 92px 105px 108px !important;
    align-items: center !important;
    gap: 9px !important;
    min-width: 0 !important;
}

.sales-row-meta-v5 > div {
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.sales-row-meta-v5 small {
    display: block !important;
    margin: 0 0 2px !important;
    color: #98a2b3 !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

.sales-row-meta-v5 strong {
    display: block !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-row-meta-v5 .status-pill {
    min-height: 23px !important;
    padding: 2px 9px !important;
    border-radius: 999px !important;
    font-size: 10.8px !important;
    font-weight: 750 !important;
}

.sales-row-meta-v5 .sales-progress-track {
    margin-top: 5px !important;
    height: 4px !important;
    border-radius: 999px !important;
    background: #edf0f4 !important;
}

.sales-row-meta-v5 .sales-progress-track i {
    height: 4px !important;
    border-radius: 999px !important;
}

.sales-row-meta-v5 .sales-next-follow em {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 19px !important;
    margin-top: 3px !important;
    padding: 1px 7px !important;
    border-radius: 999px !important;
    font-size: 9.8px !important;
    font-weight: 750 !important;
}

.sales-row-actions-v4 {
    min-width: 0 !important;
    width: 218px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 7px !important;
    align-self: center !important;
}

.sales-row-primary-action {
    height: 31px !important;
    min-width: 64px !important;
    padding: 0 11px !important;
    border-radius: 10px !important;
    border: 1px solid #e5e8ef !important;
    background: #fff !important;
    color: #475467 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

.sales-row-primary-action:hover {
    background: #f8fafc !important;
    color: #111827 !important;
}

.sales-row-primary-action-accent {
    border-color: rgba(108,71,255,.22) !important;
    background: rgba(108,71,255,.075) !important;
    color: #5b3bea !important;
}

.sales-row-primary-action-accent:hover {
    background: rgba(108,71,255,.12) !important;
    color: #4b2fd6 !important;
}

.sales-row-kebab-action .row-kebab-menu {
    flex: 0 0 auto !important;
}

.sales-row-kebab-action .row-kebab-menu summary {
    width: 31px !important;
    height: 31px !important;
    border-radius: 10px !important;
    border: 1px solid #e5e8ef !important;
    background: #fff !important;
    color: #667085 !important;
}

.sales-row-kebab-action .row-kebab-menu summary:hover {
    background: #f8fafc !important;
    color: #344054 !important;
}

.sales-actions-menu .row-kebab-panel {
    min-width: 150px !important;
}

.sales-actions-menu .row-kebab-panel button,
.sales-actions-menu .row-kebab-panel form button {
    text-align: right !important;
    font-size: 12px !important;
}

/* The details block remains hidden behind the explicit پرونده action */
.sales-row-detail-v3 {
    margin-top: 0 !important;
}

/* Responsive fallback */
@media (max-width: 1250px) {
    .sales-opportunity-row-v5 {
        grid-template-columns: minmax(210px, 1fr) minmax(420px, 1.5fr) 198px !important;
        gap: 12px !important;
    }
    .sales-row-meta-v5 {
        grid-template-columns: 98px minmax(120px, 1fr) 82px 82px 98px 98px !important;
        gap: 7px !important;
    }
    .sales-row-actions-v4 {
        width: 198px !important;
    }
}

@media (max-width: 980px) {
    .sales-list-head-v5 {
        grid-template-columns: 1fr !important;
    }
    .sales-list-search-v5 {
        justify-self: stretch !important;
        width: 100% !important;
    }
    .sales-opportunity-row-v5 {
        grid-template-columns: 1fr !important;
        min-height: auto !important;
        gap: 12px !important;
    }
    .sales-row-meta-v5 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sales-row-actions-v4 {
        width: auto !important;
        justify-content: flex-start !important;
    }
}


/* v1.47 - Sales opportunities as a clean table-like list with header row */
.sales-opportunity-table-v6 {
    display: grid !important;
    gap: 0 !important;
    border-top: 1px solid #edf0f4 !important;
}

.sales-opportunity-table-head {
    display: grid !important;
    grid-template-columns: minmax(190px, 1.05fr) 140px 96px 110px 110px 112px 250px !important;
    align-items: center !important;
    gap: 10px !important;
    min-height: 50px !important;
    padding: 0 16px !important;
    background: #fff !important;
    border-bottom: 1px solid #e7eaf0 !important;
    color: #6f7787 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.7 !important;
    white-space: nowrap !important;
}

.sales-opportunity-row-v5 {
    display: grid !important;
    grid-template-columns: minmax(190px, 1.05fr) minmax(578px, 2.35fr) 250px !important;
    gap: 10px !important;
    min-height: 70px !important;
    padding: 10px 16px !important;
    align-items: center !important;
    border-bottom: 1px solid #e7eaf0 !important;
    background: #fff !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sales-opportunity-row-v5:nth-of-type(odd) {
    background: #f7f7f8 !important;
}

.sales-opportunity-row-v5:nth-of-type(even) {
    background: #fff !important;
}

.sales-opportunity-row-v5 .sales-row-accent {
    display: none !important;
}

/* First column: narrower and clearer */
.sales-row-main-v5 {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-width: 0 !important;
}

.sales-row-main-v5 .sales-customer-avatar {
    width: 32px !important;
    height: 32px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
}

.sales-opportunity-row-v5 .sales-row-title strong {
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.55 !important;
    color: #111827 !important;
}

.sales-opportunity-row-v5 .sales-row-subtitle {
    font-size: 10.5px !important;
    font-weight: 600 !important;
    color: #7b8494 !important;
    line-height: 1.55 !important;
}

/* Meta columns now match the table header; stage/status column is removed */
.sales-row-meta-v5 {
    display: grid !important;
    grid-template-columns: 140px 96px 110px 110px 112px !important;
    gap: 10px !important;
    align-items: center !important;
    min-width: 0 !important;
}

.sales-row-meta-v5 > div {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
}

.sales-row-meta-v5 small {
    display: none !important;
}

.sales-row-meta-v5 strong {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    line-height: 1.6 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-row-meta-v5 .sales-progress-track {
    margin-top: 5px !important;
    height: 4px !important;
    background: #e8edf3 !important;
    border-radius: 999px !important;
}

.sales-row-meta-v5 .sales-progress-track i {
    height: 4px !important;
    border-radius: 999px !important;
}

.sales-row-meta-v5 .sales-next-follow em {
    margin-top: 3px !important;
    min-height: 19px !important;
    padding: 1px 7px !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
}

/* Actions: wider and always one line */
.sales-row-actions-v4 {
    width: 250px !important;
    min-width: 250px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
}

.sales-row-primary-action {
    height: 31px !important;
    min-width: 74px !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
    flex: 0 0 auto !important;
}

.sales-row-primary-action-accent {
    min-width: 88px !important;
}

.sales-row-kebab-action .row-kebab-menu {
    flex: 0 0 31px !important;
}

.sales-row-kebab-action .row-kebab-menu summary {
    width: 31px !important;
    height: 31px !important;
}

/* Hide any status/stage badge in the row list to avoid duplication with the pipeline tabs */
.sales-opportunity-row-v5 .sales-meta-stage {
    display: none !important;
}

@media (max-width: 1250px) {
    .sales-opportunity-table-head {
        grid-template-columns: minmax(170px, 1fr) 125px 82px 96px 100px 100px 220px !important;
        gap: 8px !important;
    }
    .sales-opportunity-row-v5 {
        grid-template-columns: minmax(170px, 1fr) minmax(503px, 2fr) 220px !important;
        gap: 8px !important;
    }
    .sales-row-meta-v5 {
        grid-template-columns: 125px 82px 96px 100px 100px !important;
        gap: 8px !important;
    }
    .sales-row-actions-v4 {
        width: 220px !important;
        min-width: 220px !important;
    }
    .sales-row-primary-action {
        min-width: 66px !important;
        padding: 0 9px !important;
    }
    .sales-row-primary-action-accent {
        min-width: 82px !important;
    }
}

@media (max-width: 980px) {
    .sales-opportunity-table-head {
        display: none !important;
    }
    .sales-opportunity-row-v5 {
        grid-template-columns: 1fr !important;
        min-height: auto !important;
        gap: 12px !important;
    }
    .sales-opportunity-row-v5:nth-of-type(odd),
    .sales-opportunity-row-v5:nth-of-type(even) {
        background: #fff !important;
    }
    .sales-row-meta-v5 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .sales-row-meta-v5 small {
        display: block !important;
    }
    .sales-row-actions-v4 {
        width: auto !important;
        min-width: 0 !important;
        justify-content: flex-start !important;
    }
}


/* v1.48 - Final table widths and one-line actions for sales opportunities */
:root {
    --sales-col-customer: 240px;
    --sales-col-amount: 150px;
    --sales-col-progress: 100px;
    --sales-col-probability: 118px;
    --sales-col-owner: 115px;
    --sales-col-follow: 125px;
    --sales-col-actions: 212px;
    --sales-table-gap: 10px;
    --sales-meta-width: calc(
        var(--sales-col-amount) +
        var(--sales-col-progress) +
        var(--sales-col-probability) +
        var(--sales-col-owner) +
        var(--sales-col-follow) +
        (var(--sales-table-gap) * 4)
    );
}

.sales-opportunity-table-v6 {
    overflow-x: auto !important;
    background: #fff !important;
}

/* Header columns exactly match row columns */
.sales-opportunity-table-head {
    min-width: calc(
        var(--sales-col-customer) +
        var(--sales-col-amount) +
        var(--sales-col-progress) +
        var(--sales-col-probability) +
        var(--sales-col-owner) +
        var(--sales-col-follow) +
        var(--sales-col-actions) +
        (var(--sales-table-gap) * 6)
    ) !important;
    grid-template-columns:
        var(--sales-col-customer)
        var(--sales-col-amount)
        var(--sales-col-progress)
        var(--sales-col-probability)
        var(--sales-col-owner)
        var(--sales-col-follow)
        var(--sales-col-actions) !important;
    gap: var(--sales-table-gap) !important;
    min-height: 48px !important;
    padding: 0 16px !important;
    background: #fff !important;
    border-bottom: 1px solid #e5e8ef !important;
}

.sales-opportunity-table-head span {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    color: #667085 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    white-space: nowrap !important;
}

.sales-opportunity-table-head span:last-child {
    justify-content: center !important;
}

/* Data row columns exactly match header */
.sales-opportunity-row-v5 {
    min-width: calc(
        var(--sales-col-customer) +
        var(--sales-meta-width) +
        var(--sales-col-actions) +
        (var(--sales-table-gap) * 2)
    ) !important;
    display: grid !important;
    grid-template-columns: var(--sales-col-customer) var(--sales-meta-width) var(--sales-col-actions) !important;
    gap: var(--sales-table-gap) !important;
    min-height: 68px !important;
    padding: 9px 16px !important;
    align-items: center !important;
    border-bottom: 1px solid #e5e8ef !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Alternating rows like the reference table */
.sales-opportunity-table-v6 .sales-opportunity-row-v5:nth-child(even) {
    background: #f7f7f8 !important;
}
.sales-opportunity-table-v6 .sales-opportunity-row-v5:nth-child(odd) {
    background: #fff !important;
}

/* First column: compact, no duplicate status/tag under the customer */
.sales-row-main-v5 {
    min-width: 0 !important;
    width: var(--sales-col-customer) !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
}

.sales-row-main-v5 .sales-customer-avatar {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
}

.sales-opportunity-row-v5 .sales-row-title {
    min-width: 0 !important;
    overflow: hidden !important;
}

.sales-opportunity-row-v5 .sales-row-title strong {
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.5 !important;
    color: #111827 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-opportunity-row-v5 .sales-row-subtitle {
    margin-top: 2px !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    color: #7b8494 !important;
    line-height: 1.45 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* remove duplicated stage/status/tag from row; pipeline tabs already show it */
.sales-opportunity-row-v5 .sales-tag-line,
.sales-opportunity-row-v5 .sales-meta-stage {
    display: none !important;
}

/* Meta group: exact standard widths */
.sales-row-meta-v5 {
    width: var(--sales-meta-width) !important;
    display: grid !important;
    grid-template-columns:
        var(--sales-col-amount)
        var(--sales-col-progress)
        var(--sales-col-probability)
        var(--sales-col-owner)
        var(--sales-col-follow) !important;
    gap: var(--sales-table-gap) !important;
    align-items: center !important;
    min-width: 0 !important;
}

.sales-row-meta-v5 > div {
    min-width: 0 !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
}

.sales-row-meta-v5 small {
    display: none !important;
}

.sales-row-meta-v5 strong {
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #111827 !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* Better numeric column alignment */
.sales-row-meta-v5 > div:nth-child(1) strong,
.sales-row-meta-v5 > div:nth-child(2) strong,
.sales-row-meta-v5 > div:nth-child(3) strong {
    direction: ltr !important;
    text-align: right !important;
}

.sales-row-meta-v5 .sales-progress-track {
    width: 78px !important;
    height: 4px !important;
    margin-top: 5px !important;
    background: #e8edf3 !important;
    border-radius: 999px !important;
}

.sales-row-meta-v5 .sales-progress-track i {
    height: 4px !important;
    border-radius: 999px !important;
}

.sales-row-meta-v5 .sales-next-follow em {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    min-height: 18px !important;
    margin-top: 3px !important;
    padding: 1px 7px !important;
    border-radius: 999px !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
}

/* Actions column: always one row */
.sales-row-actions-v4 {
    width: var(--sales-col-actions) !important;
    min-width: var(--sales-col-actions) !important;
    max-width: var(--sales-col-actions) !important;
    height: 36px !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.sales-row-actions-v4 > button,
.sales-row-actions-v4 > details {
    flex: 0 0 auto !important;
}

.sales-row-primary-action {
    height: 31px !important;
    min-width: 66px !important;
    max-width: 76px !important;
    padding: 0 10px !important;
    border-radius: 10px !important;
    font-size: 11px !important;
    line-height: 31px !important;
    white-space: nowrap !important;
}

.sales-row-primary-action-accent {
    min-width: 86px !important;
    max-width: 96px !important;
}

.sales-row-kebab-action .row-kebab-menu {
    width: 31px !important;
    min-width: 31px !important;
    flex: 0 0 31px !important;
}

.sales-row-kebab-action .row-kebab-menu summary {
    width: 31px !important;
    height: 31px !important;
    min-width: 31px !important;
    border-radius: 10px !important;
}

/* Softer row color */
.sales-opportunity-table-v6 .sales-opportunity-row-v5:nth-child(even) {
    background: #f8f9fb !important;
}

/* no orange side line in this table mode */
.sales-opportunity-row-v5 .sales-row-accent {
    display: none !important;
}

@media (max-width: 1180px) {
    :root {
        --sales-col-customer: 220px;
        --sales-col-amount: 135px;
        --sales-col-progress: 92px;
        --sales-col-probability: 104px;
        --sales-col-owner: 102px;
        --sales-col-follow: 112px;
        --sales-col-actions: 204px;
        --sales-table-gap: 8px;
    }

    .sales-row-primary-action {
        min-width: 62px !important;
        padding: 0 8px !important;
    }

    .sales-row-primary-action-accent {
        min-width: 82px !important;
    }
}

@media (max-width: 980px) {
    .sales-opportunity-table-head {
        display: none !important;
    }

    .sales-opportunity-row-v5 {
        min-width: 0 !important;
        grid-template-columns: 1fr !important;
        min-height: auto !important;
        gap: 12px !important;
    }

    .sales-row-main-v5,
    .sales-row-meta-v5,
    .sales-row-actions-v4 {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .sales-row-meta-v5 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .sales-row-meta-v5 small {
        display: block !important;
    }

    .sales-row-actions-v4 {
        justify-content: flex-start !important;
    }
}


/* v1.50 - Fix metric alignment and clean inline edit popover */

/* Header and data values in metric columns must be centered */
.sales-opportunity-table-head span:nth-child(2),
.sales-opportunity-table-head span:nth-child(3),
.sales-opportunity-table-head span:nth-child(4),
.sales-opportunity-table-head span:nth-child(5),
.sales-opportunity-table-head span:nth-child(6) {
    justify-content: center !important;
    text-align: center !important;
}

.sales-row-meta-v5 {
    justify-items: center !important;
}

.sales-row-meta-v5 > div {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.sales-row-meta-v5 > div strong,
.sales-row-meta-v5 .sales-next-follow em {
    width: 100% !important;
    text-align: center !important;
    margin-inline: auto !important;
}

.sales-row-meta-v5 > div:nth-child(1) strong,
.sales-row-meta-v5 > div:nth-child(2) strong,
.sales-row-meta-v5 > div:nth-child(3) strong {
    direction: rtl !important;
    text-align: center !important;
}

.sales-row-meta-v5 .sales-progress-track {
    width: 76px !important;
    margin: 5px auto 0 !important;
}

/* Clickable metric trigger, no native details arrows */
details.sales-metric-popover {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

details.sales-metric-popover > summary.sales-metric-trigger {
    list-style: none !important;
    list-style-type: none !important;
    display: grid !important;
    justify-items: center !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    border-radius: 10px !important;
    outline: none !important;
    user-select: none !important;
}

details.sales-metric-popover > summary.sales-metric-trigger::-webkit-details-marker {
    display: none !important;
}

details.sales-metric-popover > summary.sales-metric-trigger::marker {
    content: '' !important;
    font-size: 0 !important;
}

details.sales-metric-popover > summary.sales-metric-trigger::before,
details.sales-metric-popover > summary.sales-metric-trigger::after {
    display: none !important;
    content: none !important;
}

details.sales-metric-popover > summary.sales-metric-trigger:hover {
    background: rgba(108,71,255,.045) !important;
}

details.sales-metric-popover > summary.sales-metric-trigger:hover strong {
    color: #4b2fd6 !important;
}

/* Clean popup, not raw browser form */
.sales-metric-form {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 50% !important;
    left: auto !important;
    transform: translateX(50%) !important;
    z-index: 9999 !important;
    width: 176px !important;
    box-sizing: border-box !important;
    display: none !important;
    grid-template-columns: 1fr auto !important;
    grid-template-areas:
        "label label"
        "input button" !important;
    gap: 8px !important;
    padding: 11px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.16) !important;
    direction: rtl !important;
}

details.sales-metric-popover[open] .sales-metric-form {
    display: grid !important;
}

.sales-metric-form::before {
    content: '' !important;
    position: absolute !important;
    top: -6px !important;
    right: 50% !important;
    width: 10px !important;
    height: 10px !important;
    transform: translateX(50%) rotate(45deg) !important;
    background: #fff !important;
    border-top: 1px solid #e4e7ec !important;
    border-left: 1px solid #e4e7ec !important;
}

.sales-metric-form label {
    grid-area: label !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #344054 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.6 !important;
    text-align: right !important;
}

.sales-metric-form input[type="number"] {
    grid-area: input !important;
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 8px !important;
    border: 1px solid #d9dee8 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #111827 !important;
    text-align: center !important;
    direction: ltr !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    outline: none !important;
}

.sales-metric-form input[type="number"]:focus {
    border-color: #7c5cff !important;
    box-shadow: 0 0 0 3px rgba(108,71,255,.12) !important;
}

.sales-metric-form button {
    grid-area: button !important;
    width: 54px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: #6c47ff !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    cursor: pointer !important;
}

/* Color thresholds for progress / probability */
.sales-inline-metric.tone-low .sales-progress-track i {
    background: #f59e0b !important;
}
.sales-inline-metric.tone-mid .sales-progress-track i {
    background: #3b82f6 !important;
}
.sales-inline-metric.tone-good .sales-progress-track i {
    background: #22c55e !important;
}
.sales-inline-metric.tone-done .sales-progress-track {
    background: #dcfce7 !important;
}
.sales-inline-metric.tone-done .sales-progress-track i {
    background: linear-gradient(90deg, #16a34a, #22c55e) !important;
}

.sales-inline-metric.tone-low strong { color: #92400e !important; }
.sales-inline-metric.tone-mid strong { color: #1d4ed8 !important; }
.sales-inline-metric.tone-good strong { color: #15803d !important; }
.sales-inline-metric.tone-done strong { color: #166534 !important; }

.sales-inline-metric.tone-done .sales-metric-trigger strong::after {
    content: ' ✓' !important;
    color: #16a34a !important;
    font-weight: 900 !important;
}

/* Allow popover to be visible over table rows */
.sales-opportunity-table-v6,
.sales-opportunity-row-v5,
.sales-row-meta-v5,
.sales-inline-metric {
    overflow: visible !important;
}


/* v1.51 - Final row alignment, remove پرونده button, clean kebab, and fix metric popover */

/* Customer cell is now the پرونده trigger */
.sales-customer-open {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: 0 !important;
    background: transparent !important;
    cursor: pointer !important;
    text-align: right !important;
    font-family: inherit !important;
}

.sales-customer-open:hover .sales-row-title strong {
    color: #5b3bea !important;
}

.sales-customer-open:focus-visible {
    outline: 2px solid rgba(108,71,255,.25) !important;
    outline-offset: 3px !important;
    border-radius: 12px !important;
}

/* real center alignment per column */
.sales-opportunity-table-v6 .sales-opportunity-table-head span:nth-child(2),
.sales-opportunity-table-v6 .sales-opportunity-table-head span:nth-child(3),
.sales-opportunity-table-v6 .sales-opportunity-table-head span:nth-child(4),
.sales-opportunity-table-v6 .sales-opportunity-table-head span:nth-child(5),
.sales-opportunity-table-v6 .sales-opportunity-table-head span:nth-child(6) {
    justify-content: center !important;
    text-align: center !important;
}

.sales-opportunity-table-v6 .sales-row-meta-v5 {
    justify-items: stretch !important;
    align-items: center !important;
}

.sales-opportunity-table-v6 .sales-row-meta-v5 > div {
    width: 100% !important;
    min-width: 0 !important;
    justify-self: stretch !important;
    align-self: center !important;
    display: grid !important;
    place-items: center !important;
    text-align: center !important;
}

.sales-opportunity-table-v6 .sales-row-meta-v5 > div > strong,
.sales-opportunity-table-v6 .sales-row-meta-v5 > div > details,
.sales-opportunity-table-v6 .sales-row-meta-v5 > div.sales-next-follow > strong,
.sales-opportunity-table-v6 .sales-row-meta-v5 > div.sales-next-follow > em {
    justify-self: center !important;
    align-self: center !important;
    text-align: center !important;
    margin-inline: auto !important;
}

.sales-opportunity-table-v6 .sales-row-meta-v5 > div:nth-child(1) strong,
.sales-opportunity-table-v6 .sales-row-meta-v5 > div:nth-child(2) strong,
.sales-opportunity-table-v6 .sales-row-meta-v5 > div:nth-child(3) strong {
    direction: rtl !important;
    text-align: center !important;
}

.sales-opportunity-table-v6 .sales-progress-track {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* actions: no پرونده button, one line, lighter kebab */
.sales-row-actions-v4 {
    justify-content: center !important;
    gap: 8px !important;
}

.sales-row-actions-v4 .sales-row-primary-action-accent {
    min-width: 92px !important;
}

.sales-row-kebab-action .row-kebab-menu summary {
    border: 1px solid #e6eaf1 !important;
    background: #fff !important;
    color: #7b8494 !important;
    box-shadow: none !important;
    font-weight: 400 !important;
}

.sales-row-kebab-action .vertical-dots {
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    color: #7b8494 !important;
}

.sales-row-kebab-action .row-kebab-menu summary:hover {
    background: #f8fafc !important;
    color: #344054 !important;
}

/* details area opens below the row when clicking customer/city */
.sales-row-detail-v3 {
    grid-column: 1 / -1 !important;
    margin: 8px 0 2px !important;
    border: 1px solid #e8ebf0 !important;
    border-radius: 14px !important;
    background: #fff !important;
    padding: 12px !important;
}

.sales-row-detail-v3:not([open]) {
    display: none !important;
}

.sales-row-detail-v3[open] {
    display: block !important;
}

/* make the details card more compact and important */
.sales-detail-grid-v2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 12px !important;
}

.sales-detail-grid-v2 section {
    padding: 10px !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    border: 1px solid #edf0f4 !important;
}

.sales-detail-grid-v2 section > strong {
    display: block !important;
    margin-bottom: 6px !important;
    color: #111827 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
}

/* Hard reset for the metric popover so it never appears as a raw form */
.sales-opportunity-table-v6 details.sales-metric-popover {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    align-items: center !important;
    width: 100% !important;
    overflow: visible !important;
}

.sales-opportunity-table-v6 details.sales-metric-popover > summary.sales-metric-trigger {
    list-style: none !important;
    display: grid !important;
    justify-items: center !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 34px !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    border-radius: 10px !important;
    outline: none !important;
}

.sales-opportunity-table-v6 details.sales-metric-popover > summary.sales-metric-trigger::-webkit-details-marker {
    display: none !important;
}

.sales-opportunity-table-v6 details.sales-metric-popover > summary.sales-metric-trigger::marker,
.sales-opportunity-table-v6 details.sales-metric-popover > summary.sales-metric-trigger::before,
.sales-opportunity-table-v6 details.sales-metric-popover > summary.sales-metric-trigger::after {
    content: '' !important;
    display: none !important;
}

.sales-opportunity-table-v6 form.sales-metric-form {
    all: unset !important;
    position: absolute !important;
    z-index: 99999 !important;
    top: calc(100% + 8px) !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    width: 176px !important;
    box-sizing: border-box !important;
    display: none !important;
    grid-template-columns: 1fr 54px !important;
    grid-template-areas:
        "label label"
        "input button" !important;
    gap: 8px !important;
    padding: 11px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.16) !important;
    direction: rtl !important;
    font-family: var(--font-main, inherit) !important;
}

.sales-opportunity-table-v6 details.sales-metric-popover[open] > form.sales-metric-form {
    display: grid !important;
}

.sales-opportunity-table-v6 form.sales-metric-form::before {
    content: '' !important;
    position: absolute !important;
    top: -6px !important;
    right: 50% !important;
    width: 10px !important;
    height: 10px !important;
    transform: translateX(50%) rotate(45deg) !important;
    background: #fff !important;
    border-top: 1px solid #e4e7ec !important;
    border-left: 1px solid #e4e7ec !important;
}

.sales-opportunity-table-v6 form.sales-metric-form label {
    all: unset !important;
    grid-area: label !important;
    display: block !important;
    color: #344054 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.6 !important;
    text-align: right !important;
    font-family: var(--font-main, inherit) !important;
}

.sales-opportunity-table-v6 form.sales-metric-form input[type="number"] {
    all: unset !important;
    grid-area: input !important;
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    box-sizing: border-box !important;
    border: 1px solid #d9dee8 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #111827 !important;
    text-align: center !important;
    direction: ltr !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    font-family: var(--font-main, inherit) !important;
}

.sales-opportunity-table-v6 form.sales-metric-form input[type="number"]:focus {
    border-color: #7c5cff !important;
    box-shadow: 0 0 0 3px rgba(108,71,255,.12) !important;
}

.sales-opportunity-table-v6 form.sales-metric-form button {
    all: unset !important;
    grid-area: button !important;
    width: 54px !important;
    height: 34px !important;
    min-height: 34px !important;
    box-sizing: border-box !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 10px !important;
    background: #6c47ff !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    cursor: pointer !important;
    font-family: var(--font-main, inherit) !important;
}

.sales-opportunity-table-v6,
.sales-opportunity-row-v5,
.sales-row-meta-v5,
.sales-inline-metric {
    overflow: visible !important;
}

@media (max-width: 980px) {
    .sales-detail-grid-v2 {
        grid-template-columns: 1fr !important;
    }
}


/* v1.52 - Bootstrap real table implementation for Sales opportunities */
.sales-opportunities-bs-table {
    min-width: 1240px !important;
    table-layout: fixed !important;
}

.sales-opportunities-bs-table th,
.sales-opportunities-bs-table td {
    vertical-align: middle !important;
}

.sales-opportunities-bs-table thead th {
    background: #fff !important;
    color: #667085 !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    height: 48px !important;
    white-space: nowrap !important;
}

.sales-opportunities-bs-table tbody tr.sales-opportunity-bs-row td {
    height: 68px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.sales-opportunities-bs-table .sales-bs-customer-cell {
    overflow: hidden !important;
}

.sales-customer-open {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 100% !important;
    border: 0 !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    padding: 0 !important;
    cursor: pointer !important;
    text-align: right !important;
    font-family: inherit !important;
}

.sales-customer-open:hover strong {
    color: #5b3bea !important;
}

.sales-bs-customer-text {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
}

.sales-bs-customer-text strong {
    color: #111827 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-bs-customer-text small {
    color: #7b8494 !important;
    font-size: 10.5px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-customer-avatar {
    display: inline-grid !important;
    place-items: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 11px !important;
    background: #f3f6ff !important;
    color: #5b3bea !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}

.sales-bs-amount strong,
.sales-bs-owner strong,
.sales-bs-followup strong {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    color: #111827 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.sales-bs-followup em {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 4px !important;
    min-height: 19px !important;
    padding: 1px 8px !important;
    border-radius: 999px !important;
    background: #f3f5f8 !important;
    color: #667085 !important;
    font-size: 9.5px !important;
    font-weight: 750 !important;
    font-style: normal !important;
}

.sales-bs-actions .btn,
.sales-bs-actions button {
    white-space: nowrap !important;
}

.sales-bs-actions .sales-row-primary-action-accent {
    height: 31px !important;
    min-width: 92px !important;
    padding: 0 12px !important;
    border-radius: 10px !important;
    background: rgba(108,71,255,.10) !important;
    color: #5b3bea !important;
    font-size: 11px !important;
    font-weight: 850 !important;
}

.sales-bs-kebab {
    position: relative !important;
}

.sales-bs-kebab summary {
    list-style: none !important;
    width: 31px !important;
    height: 31px !important;
    display: inline-grid !important;
    place-items: center !important;
    border: 1px solid #e6eaf1 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #7b8494 !important;
    cursor: pointer !important;
}

.sales-bs-kebab summary::-webkit-details-marker {
    display: none !important;
}

.sales-bs-kebab .vertical-dots {
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    color: #7b8494 !important;
}

.sales-bs-detail-row > td {
    padding: 0 14px 14px !important;
    background: #fff !important;
}

.sales-bs-detail-card {
    margin: 0 !important;
    padding: 12px !important;
    border: 1px solid #e8ebf0 !important;
    border-radius: 14px !important;
    background: #fff !important;
}

.sales-detail-grid-v2 {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.sales-detail-grid-v2 section {
    padding: 10px !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    border: 1px solid #edf0f4 !important;
}

/* Bootstrap-friendly metric popovers */
.sales-inline-metric {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    width: 100% !important;
    overflow: visible !important;
}

.sales-metric-popover {
    position: relative !important;
    display: grid !important;
    justify-items: center !important;
    width: 100% !important;
}

.sales-metric-trigger {
    list-style: none !important;
    display: grid !important;
    justify-items: center !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 10px !important;
    cursor: pointer !important;
}

.sales-metric-trigger::-webkit-details-marker {
    display: none !important;
}

.sales-metric-trigger::marker {
    content: '' !important;
    font-size: 0 !important;
}

.sales-metric-trigger:hover {
    background: rgba(108,71,255,.045) !important;
}

.sales-metric-trigger strong {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 850 !important;
}

.sales-progress-track {
    display: block !important;
    width: 76px !important;
    height: 4px !important;
    margin: 5px auto 0 !important;
    border-radius: 999px !important;
    background: #e8edf3 !important;
    overflow: hidden !important;
}

.sales-progress-track i {
    display: block !important;
    height: 4px !important;
    border-radius: 999px !important;
}

.sales-metric-form {
    position: absolute !important;
    z-index: 99999 !important;
    top: calc(100% + 8px) !important;
    right: 50% !important;
    transform: translateX(50%) !important;
    width: 176px !important;
    box-sizing: border-box !important;
    display: none !important;
    grid-template-columns: 1fr 54px !important;
    grid-template-areas: "label label" "input button" !important;
    gap: 8px !important;
    padding: 11px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 50px rgba(15,23,42,.16) !important;
    direction: rtl !important;
}

.sales-metric-popover[open] .sales-metric-form {
    display: grid !important;
}

.sales-metric-form label {
    grid-area: label !important;
    color: #344054 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.6 !important;
}

.sales-metric-form input {
    grid-area: input !important;
    width: 100% !important;
    height: 34px !important;
    box-sizing: border-box !important;
    border: 1px solid #d9dee8 !important;
    border-radius: 10px !important;
    text-align: center !important;
    direction: ltr !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.sales-metric-form button {
    grid-area: button !important;
    width: 54px !important;
    height: 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: #6c47ff !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    cursor: pointer !important;
}

.sales-inline-metric.tone-low .sales-progress-track i { background: #f59e0b !important; }
.sales-inline-metric.tone-mid .sales-progress-track i { background: #3b82f6 !important; }
.sales-inline-metric.tone-good .sales-progress-track i { background: #22c55e !important; }
.sales-inline-metric.tone-done .sales-progress-track { background: #dcfce7 !important; }
.sales-inline-metric.tone-done .sales-progress-track i { background: linear-gradient(90deg, #16a34a, #22c55e) !important; }
.sales-inline-metric.tone-low strong { color: #92400e !important; }
.sales-inline-metric.tone-mid strong { color: #1d4ed8 !important; }
.sales-inline-metric.tone-good strong { color: #15803d !important; }
.sales-inline-metric.tone-done strong { color: #166534 !important; }
.sales-inline-metric.tone-done .sales-metric-trigger strong::after {
    content: ' ✓' !important;
    color: #16a34a !important;
}

@media (max-width: 980px) {
    .mp-bs-table {
        min-width: 1100px;
    }
    .sales-detail-grid-v2 {
        grid-template-columns: 1fr !important;
    }
}