#monthly-sales-meeting-toggle { margin-right: 110px; }
#monthly-sales-meeting-toggle[hidden] { display: none !important; }
.monthly-sales-mode.meeting { background: #e7eafb; color: #343e83; }
.monthly-sales-unknown { padding: 10px 14px; background: #fff3df; color: #684a16; border-radius: 8px; }
#monthly-sales-error { padding: 12px 16px; color: #9a2d2d; background: #fff0f0; border-radius: 8px; }
.monthly-sales-kpi span { color: #706a62; font-size: 12px; }
.monthly-sales-kpi strong { font-size: clamp(18px, 2vw, 26px); color: #49331e; }
.monthly-sales-table-wrap h3 { margin: 0 0 14px; }
.monthly-sales-scroll td:nth-child(n+3) { white-space: nowrap; }
.monthly-sales-scroll a { color: #765819; font-weight: 600; }

#view-monthly-contract-sales { background: #fbf9f6; }
#view-monthly-contract-sales .monthly-sales-header { border-bottom: 1px solid #f1e5c9; }
.monthly-sales-header h2 i { color: #d5a83e; }
.monthly-sales-explainer { display: grid; gap: 9px; position: relative; margin: 0 0 14px; padding: 18px 20px; border: 1px solid #e9d5aa; border-radius: 16px; background: linear-gradient(105deg, #fff5df, #fffaf3 60%, #fff); }
.monthly-sales-explainer > div { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.monthly-sales-explainer strong { font-size: 18px; color: #3a3026; }
.monthly-sales-explainer strong i { color: #bc8c2c; margin-right: 6px; }
.monthly-sales-explainer span { padding: 4px 9px; border: 1px solid #a4d6b5; border-radius: 6px; color: #17663b; background: #e9f8ee; font-size: 12px; font-weight: 700; }
.monthly-sales-explainer p { margin: 0; font-size: 12px; line-height: 1.7; color: #67594a; }
.monthly-sales-explainer button { justify-self: start; }
.monthly-sales-controls { display: flex; gap: 12px; flex-wrap: wrap; align-items: end; margin-bottom: 14px; padding: 16px; border: 1px solid #e4e0d9; border-radius: 16px; background: white; }
.monthly-sales-controls label { display: grid; gap: 5px; flex: 1 1 180px; min-width: 160px; color: #4f473e; font-size: 12px; font-weight: 700; }
.monthly-sales-controls label[hidden], .monthly-sales-controls [hidden] { display: none !important; }
.monthly-sales-controls .form-input { min-height: 38px; border-radius: 9px; }
.monthly-sales-mode { margin: 12px 0; padding: 12px 16px; border-radius: 10px; background: #fff7e5; color: #62460c; font-weight: 600; }
.monthly-sales-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin: 14px 0; }
.monthly-sales-kpi { display: grid; gap: 8px; margin: 0; min-height: 130px; padding: 20px; border: 1px solid #e8e1d7; border-radius: 16px; box-shadow: 0 2px 9px #44330d0a; }
.monthly-sales-kpi small { color: #817a6f; font-size: 11px; }
.monthly-sales-split { display: flex; justify-content: space-between; gap: 5px; font-size: 12px; }
.monthly-sales-split b { text-align: right; }
.monthly-sales-bar { height: 5px; border-radius: 9px; background: #e7eee7; overflow: hidden; }
.monthly-sales-bar i { display: block; height: 100%; border-radius: inherit; background: #22a763; }
.monthly-sales-bar.ss i { background: #e87e9f; }
.monthly-sales-mom, .monthly-sales-leaderboard, .monthly-sales-table-wrap { margin: 15px 0; padding: 20px; border: 1px solid #e8e1d7; border-radius: 16px; }
.monthly-sales-mom h3, .monthly-sales-leaderboard h3 { margin: 0 0 12px; font-size: 16px; }
.monthly-sales-mom h3 i, .monthly-sales-leaderboard h3 i { color: #c69b35; margin-right: 5px; }
.monthly-sales-mom h4 { margin: 20px 0 10px; font-size: 13px; }
.monthly-sales-compare-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.monthly-sales-compare-grid article { display: grid; gap: 5px; padding: 14px; border: 1px solid #e9e2d7; border-radius: 12px; background: #fffdf9; }
.monthly-sales-compare-grid article span, .monthly-sales-compare-grid article small { color: #79736a; font-size: 11px; }
.monthly-sales-compare-grid article strong { font-size: 16px; color: #302b26; }
.monthly-sales-compare-grid article b { font-size: 12px; }
.monthly-sales-delta-positive { color: #158050; }
.monthly-sales-delta-negative { color: #b42318; }
.monthly-sales-delta-neutral { color: #706b61; }
.monthly-sales-leaderboard-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.monthly-sales-leaderboard-grid article { position: relative; display: grid; gap: 9px; padding: 15px; border: 1px solid #e8e0d3; border-radius: 13px; background: linear-gradient(150deg, #fff, #fffcf6); }
.monthly-sales-leaderboard-grid article div { display: grid; gap: 3px; padding-left: 28px; }
.monthly-sales-leaderboard-grid article small { font-size: 11px; color: #777269; }
.monthly-sales-leaderboard-grid article b { font-size: 16px; color: #2c5b42; }
.monthly-sales-rank { position: absolute; top: 15px; left: 15px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 7px; background: #fff2cb; color: #8a6519; font-weight: 800; }
.monthly-sales-tabs { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 11px; }
.monthly-sales-tabs button { padding: 8px 12px; border: 1px solid transparent; border-radius: 9px; background: #f1f0ec; color: #61594c; cursor: pointer; font-size: 12px; font-weight: 700; }
.monthly-sales-tabs button.active { background: #fff8e7; border-color: #ddb956; color: #72531c; }
.monthly-sales-tabs button[hidden] { display: none !important; }
.monthly-sales-tabs button span { margin-left: 5px; padding: 2px 6px; border-radius: 10px; background: #e3e9dd; }
#monthly-sales-table-total { margin-left: auto; color: #53745a; font-size: 12px; font-weight: 700; }
.monthly-sales-scroll { overflow-x: auto; }
.monthly-sales-scroll table { width: 100%; border-collapse: collapse; font-size: 12px; }
.monthly-sales-scroll th, .monthly-sales-scroll td { padding: 11px; border-bottom: 1px solid #efebe4; text-align: left; vertical-align: top; }
.monthly-sales-scroll th { white-space: nowrap; background: #f8f7f3; color: #5e5546; }
.monthly-sales-scroll td small { color: #837b6f; }
.monthly-sales-badge { display: inline-block; padding: 4px 7px; border-radius: 7px; background: #f0ede7; color: #6e6657; font-size: 11px; font-weight: 700; white-space: nowrap; }
.monthly-sales-badge.approved, .monthly-sales-badge.won { background: #e4f5e9; color: #176b3a; }
.monthly-sales-badge.pending { background: #fff1d4; color: #946014; }
.monthly-sales-drawer[hidden] { display: none !important; }
.monthly-sales-drawer { position: fixed; inset: 0; z-index: 12000; display: flex; justify-content: end; }
.monthly-sales-drawer-backdrop { position: absolute; inset: 0; background: #1e283d8c; }
.monthly-sales-drawer-panel { position: relative; width: min(480px, 100vw); height: 100%; padding: 24px; background: white; overflow-y: auto; box-shadow: -5px 0 30px #0002; }
.monthly-sales-drawer-panel > button { float: right; }
.monthly-sales-drawer-panel h2 { padding-top: 22px; }
.monthly-sales-detail { display: grid; gap: 8px; margin: 20px 0; }
.monthly-sales-detail div { display: flex; justify-content: space-between; gap: 15px; padding: 9px 0; border-bottom: 1px solid #eeeae1; font-size: 12px; }
.monthly-sales-detail span { color: #706b61; }
.monthly-sales-detail strong { text-align: right; }
.monthly-sales-document-actions { display: flex; flex-wrap: wrap; gap: 8px; }
body.monthly-sales-meeting .app-sidebar { display: none !important; }
body.monthly-sales-meeting .app-main { margin-left: 0; max-width: none; width: 100%; }
body.monthly-sales-meeting #monthly-sales-view-wrap, body.monthly-sales-meeting #monthly-sales-filter-person-wrap { display: none !important; }
@media (max-width: 700px) { #monthly-sales-meeting-toggle { margin-right: 0; } .monthly-sales-explainer { padding: 14px; } .monthly-sales-controls label { flex-basis: 100%; } .monthly-sales-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .monthly-sales-kpi { min-height: 115px; padding: 14px; } .monthly-sales-kpi strong { font-size: 18px; } .monthly-sales-table-wrap { padding: 13px; } #monthly-sales-table-total { margin-left: 0; width: 100%; } }
