/* ============================================
   SMILECONTROLE - CABINET TASKS
   ============================================ */
.tasks-page { --task-blue:#2874ea; --task-ink:#152238; --task-muted:#728097; --task-line:#e6eaf0; --task-bg:#f5f7fb; max-width:1500px; margin:0 auto; }
.tasks-hero { position:relative; overflow:hidden; display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px 34px; margin-bottom:20px; border:1px solid #dfe7f2; border-radius:24px; background:linear-gradient(115deg,#fff 0%,#f3f7ff 70%,#e8f1ff 100%); box-shadow:0 14px 38px rgba(31,60,98,.08); }
.tasks-hero::after { content:""; position:absolute; width:240px; height:240px; right:-75px; top:-100px; border-radius:50%; background:radial-gradient(circle,rgba(40,116,234,.18),transparent 70%); }
.tasks-hero > * { position:relative; z-index:1; }
.tasks-eyebrow { display:block; margin-bottom:6px; color:#2167d7; font-size:12px; font-weight:800; letter-spacing:.13em; }
.tasks-hero h1 { margin:0; color:var(--task-ink); font-size:30px; line-height:1.2; }
.tasks-hero p { margin:8px 0 0; color:var(--task-muted); font-size:15px; }
.tasks-primary-button,.task-secondary-button { min-height:44px; border-radius:13px; padding:0 18px; border:1px solid transparent; font-weight:750; font-size:14px; cursor:pointer; transition:.18s ease; }
.tasks-primary-button { background:linear-gradient(135deg,#347ff0,#2468d5); color:#fff; box-shadow:0 9px 22px rgba(40,116,234,.22); }
.tasks-primary-button:hover { transform:translateY(-1px); box-shadow:0 12px 28px rgba(40,116,234,.28); }
.tasks-primary-button:disabled { opacity:.6; cursor:wait; transform:none; }
.task-secondary-button { color:#4a5870; background:#fff; border-color:#dce2eb; }
.tasks-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:20px; }
.tasks-kpi { display:flex; align-items:center; gap:13px; min-height:96px; padding:18px; text-align:left; border:1px solid var(--task-line); border-radius:18px; background:#fff; box-shadow:0 8px 24px rgba(31,45,68,.055); cursor:pointer; transition:.18s ease; }
.tasks-kpi:hover { transform:translateY(-2px); border-color:#cbd7e8; }
.tasks-kpi-icon { width:44px; height:44px; display:grid; place-items:center; flex:0 0 44px; border-radius:14px; font-size:20px; font-weight:900; }
.tasks-kpi span:last-child { display:flex; flex-direction:column; }
.tasks-kpi strong { color:var(--task-ink); font-size:25px; line-height:1; }
.tasks-kpi em { margin-top:7px; color:var(--task-muted); font-size:13px; font-style:normal; font-weight:650; }
.tasks-kpi-blue .tasks-kpi-icon { color:#2468d5; background:#eaf2ff; }.tasks-kpi-red .tasks-kpi-icon { color:#d33e4e; background:#fff0f1; }.tasks-kpi-gold .tasks-kpi-icon { color:#b77510; background:#fff7df; }.tasks-kpi-green .tasks-kpi-icon { color:#17815e; background:#e9f8f1; }
.tasks-workspace { border:1px solid var(--task-line); border-radius:22px; background:#fff; box-shadow:0 12px 36px rgba(31,45,68,.06); overflow:hidden; }
.tasks-toolbar { padding:18px 20px; border-bottom:1px solid var(--task-line); background:#fbfcfe; }
.tasks-scope-tabs { display:flex; gap:6px; overflow-x:auto; padding-bottom:12px; }
.tasks-scope-tabs button { white-space:nowrap; border:0; background:transparent; color:#66758d; padding:9px 12px; border-radius:10px; font-weight:700; cursor:pointer; }
.tasks-scope-tabs button.active { color:#1f66d4; background:#eaf2ff; }
.tasks-filters { display:grid; grid-template-columns:minmax(220px,1fr) 240px 200px; gap:10px; }
.tasks-filters input,.tasks-filters select,.task-field input,.task-field select,.task-field textarea { width:100%; border:1px solid #dce2eb; border-radius:12px; background:#fff; color:#26344b; font:inherit; outline:none; transition:.15s ease; }
.tasks-filters input,.tasks-filters select { height:42px; padding:0 13px; }
.tasks-filters input:focus,.tasks-filters select:focus,.task-field input:focus,.task-field select:focus,.task-field textarea:focus { border-color:#5c94ec; box-shadow:0 0 0 3px rgba(40,116,234,.1); }
.tasks-list { padding:10px 18px 18px; }
.task-card { position:relative; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:10px; padding:17px 16px; border:1px solid #e6eaf0; border-radius:16px; background:#fff; cursor:pointer; transition:.18s ease; }
.task-card:hover { border-color:#c7d7ee; box-shadow:0 8px 23px rgba(38,62,96,.08); transform:translateY(-1px); }
.task-card.is-overdue { border-left:4px solid #df4a58; background:linear-gradient(90deg,#fff8f8 0,#fff 22%); }
.task-card-main { display:flex; align-items:flex-start; gap:14px; min-width:0; flex:1; }
.task-check { width:30px; height:30px; flex:0 0 30px; border-radius:10px; border:2px solid #cfd7e3; color:transparent; background:#fff; cursor:pointer; font-weight:900; }
.task-check:hover { border-color:#4b86e5; color:#4b86e5; }.task-check.checked { color:#fff; border-color:#1e9a6d; background:#1e9a6d; }.task-check:disabled { opacity:.4; cursor:not-allowed; border-color:#d9dfe8; color:#aab3c1; background:#f4f6f9; }
.task-card-content { min-width:0; flex:1; }.task-card-title-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.task-card h3 { margin:0; color:#202d42; font-size:15.5px; }.task-card-content > p { margin:7px 0 0; color:#6d798c; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:850px; }
.task-priority,.task-status,.task-category,.task-recurrence,.task-comments-count { display:inline-flex; align-items:center; min-height:25px; padding:3px 8px; border-radius:999px; font-size:11.5px; font-weight:750; }
.task-tone-blue { color:#2369d5; background:#eaf2ff; }.task-tone-green { color:#167956; background:#e8f8f0; }.task-tone-orange { color:#a96605; background:#fff4d8; }.task-tone-red { color:#c93949; background:#ffedef; }.task-tone-muted,.task-tone-neutral { color:#637087; background:#eff2f6; }
.task-card-meta { display:flex; align-items:center; flex-wrap:wrap; gap:8px 15px; margin-top:11px; color:#7a8799; font-size:12px; }
.task-assignee { display:flex; align-items:center; gap:7px; color:#59677c; font-weight:650; }.task-assignee b { width:24px; height:24px; display:grid; place-items:center; border-radius:8px; background:#edf3ff; color:#286bd7; font-size:10px; }.task-category { color:#66758b; background:#f3f5f8; }.task-due.danger { color:#cf3b4b; font-weight:800; }.task-due.today { color:#a86809; font-weight:800; }.task-recurrence,.task-comments-count { padding:0; background:transparent; color:#677a96; }
.task-card-open { border:0; background:#f2f5f9; color:#7b899c; width:34px; height:34px; border-radius:10px; font-size:24px; cursor:pointer; }
.tasks-empty { text-align:center; padding:70px 20px; color:#758298; }.tasks-empty > span { display:grid; place-items:center; width:58px; height:58px; margin:0 auto 15px; border-radius:18px; background:#eaf8f1; color:#16815d; font-size:26px; }.tasks-empty h3 { margin:0; color:#334158; }.tasks-empty p { margin:7px 0 0; }
.task-modal-shell { position:fixed; inset:0; z-index:8500; display:flex; align-items:center; justify-content:center; padding:24px; }.task-modal-backdrop { position:absolute; inset:0; background:rgba(14,24,39,.58); backdrop-filter:blur(5px); }.task-modal { position:relative; z-index:1; width:min(760px,100%); max-height:calc(100vh - 42px); overflow:auto; border:1px solid rgba(255,255,255,.8); border-radius:24px; background:#fff; box-shadow:0 28px 90px rgba(11,24,44,.3); }
.task-modal-header { position:sticky; top:0; z-index:3; display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:24px 26px 18px; border-bottom:1px solid #e9edf3; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }.task-modal-header h2 { margin:0; color:#1d2b41; font-size:23px; }.task-modal-close { width:38px; height:38px; border:0; border-radius:12px; background:#f2f4f7; color:#667388; font-size:25px; cursor:pointer; }.task-form-body { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; padding:24px 26px; }.task-field { display:flex; flex-direction:column; gap:7px; }.task-field-full { grid-column:1/-1; }.task-field > span { color:#4d5a6d; font-size:12.5px; font-weight:750; }.task-field input,.task-field select { height:46px; padding:0 13px; }.task-field textarea { min-height:100px; resize:vertical; padding:12px 13px; }.task-modal-footer { display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:17px 26px 22px; border-top:1px solid #e9edf3; }.task-save-note { margin-right:auto; color:#8792a3; font-size:11.5px; }
.task-detail-modal { width:min(1120px,100%); }.task-detail-header { position:relative; }.task-detail-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,.8fr); }.task-detail-main { padding:25px 28px; min-width:0; }.task-detail-badges { display:flex; flex-wrap:wrap; gap:8px; }.task-description { margin:18px 0; padding:16px; border-radius:14px; background:#f7f9fc; color:#435167; line-height:1.6; font-size:14px; }.task-description.muted { color:#8b96a6; }.task-detail-facts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.task-detail-facts > div { padding:14px; border:1px solid #e8ecf2; border-radius:13px; }.task-detail-facts span { display:block; color:#8994a4; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }.task-detail-facts strong { display:block; margin-top:5px; color:#344258; font-size:13.5px; }.task-detail-facts strong.danger { color:#cb3547; }.task-status-actions { display:flex; flex-wrap:wrap; gap:9px; margin:20px 0 25px; }.task-status-actions button { min-height:38px; padding:0 13px; border:1px solid #dce3ed; border-radius:10px; background:#fff; color:#4e5d73; font-weight:700; cursor:pointer; }.task-status-actions button.success { color:#137554; border-color:#bfe6d5; background:#ecfaf4; }
.task-comments-section { border-top:1px solid #e7ebf1; padding-top:23px; }.task-section-title { display:flex; align-items:center; justify-content:space-between; }.task-section-title h3 { margin:0; color:#27354b; }.task-section-title p { margin:4px 0 0; color:#8792a3; font-size:12px; }.task-section-title > span { display:grid; place-items:center; min-width:30px; height:30px; border-radius:10px; background:#eef3fb; color:#4d6f9e; font-weight:800; }.task-comments-list { display:flex; flex-direction:column; gap:12px; margin:17px 0; }.task-comment { display:flex; gap:10px; }.task-comment-avatar { display:grid; place-items:center; width:34px; height:34px; flex:0 0 34px; border-radius:11px; background:#edf3ff; color:#2469d5; font-size:12px; font-weight:850; }.task-comment > div:last-child { flex:1; padding:11px 13px; border-radius:4px 14px 14px 14px; background:#f4f6f9; }.task-comment.mine > div:last-child { background:#eaf3ff; }.task-comment header { display:flex; justify-content:space-between; gap:10px; }.task-comment header strong { color:#354359; font-size:12px; }.task-comment header span { color:#929cab; font-size:10.5px; }.task-comment p { margin:7px 0 0; color:#4d5b70; font-size:13px; line-height:1.5; }.task-comment-form { padding:15px; border:1px solid #dfe5ed; border-radius:15px; background:#fbfcfe; }.task-comment-form textarea { width:100%; border:0; outline:none; resize:vertical; background:transparent; font:inherit; color:#3c4a5f; }.task-comment-form > div { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; }.task-comment-form small { color:#929baa; }.task-comment-form .tasks-primary-button { min-height:37px; }.task-inline-empty,.task-archived-note { padding:18px; border-radius:12px; background:#f5f7fa; color:#7b8799; font-size:12.5px; text-align:center; }
.task-history-panel { padding:24px 20px; border-left:1px solid #e7ebf1; background:#f8fafc; }.task-history-heading { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }.task-history-heading h3 { margin:0; color:#2e3b50; }.task-history-heading span { color:#8a95a5; font-size:11px; }.task-timeline { display:flex; flex-direction:column; gap:0; }.task-timeline-item { position:relative; display:flex; gap:12px; padding-bottom:18px; }.task-timeline-item::before { content:""; position:absolute; left:5px; top:13px; bottom:-2px; width:1px; background:#d9e0e9; }.task-timeline-item:last-child::before { display:none; }.task-timeline-item > span { position:relative; z-index:1; width:11px; height:11px; flex:0 0 11px; margin-top:3px; border:3px solid #cfe0fa; border-radius:50%; background:#3479e3; }.task-timeline-item strong { display:block; color:#49576b; font-size:12.5px; line-height:1.35; }.task-timeline-item p { margin:4px 0 0; color:#939dac; font-size:10.5px; }.task-detail-footer > span { flex:1; }.task-danger-link,.task-muted-link { border:0; background:transparent; font-weight:700; cursor:pointer; }.task-danger-link { color:#c33b4b; }.task-muted-link { color:#748197; }
.task-brief-shell { z-index:10000; }.task-brief-modal { width:min(860px,100%); overflow:hidden; }.task-brief-topline { height:6px; background:linear-gradient(90deg,#2c75e7,#28a77a,#f2b43f); }.task-brief-header { display:flex; align-items:center; gap:17px; padding:25px 28px 20px; }.task-brief-icon { display:grid; place-items:center; width:54px; height:54px; flex:0 0 54px; border-radius:18px; background:#eaf3ff; color:#2670e0; font-size:25px; font-weight:900; }.task-brief-header h2 { margin:0; color:#1e2b40; font-size:25px; }.task-brief-header p { margin:5px 0 0; color:#748197; }.task-brief-date { margin-left:auto; color:#65738a; font-size:12px; text-transform:capitalize; }.task-brief-counters { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:0 28px 20px; }.task-brief-counters > div { display:flex; align-items:center; gap:10px; padding:13px 15px; border-radius:14px; }.task-brief-counters strong { font-size:24px; }.task-brief-counters span { font-size:12px; font-weight:700; }.task-brief-counters .danger { color:#bd3445; background:#fff0f1; }.task-brief-counters .gold { color:#9d650b; background:#fff6df; }.task-brief-counters .blue { color:#2469d4; background:#ebf3ff; }.task-brief-list { max-height:330px; overflow:auto; margin:0 28px; border:1px solid #e4e9f0; border-radius:15px; }.task-brief-list > div { display:grid; grid-template-columns:12px minmax(0,1fr) 150px 190px; align-items:center; gap:10px; min-height:52px; padding:8px 14px; border-bottom:1px solid #edf0f4; }.task-brief-list > div:last-child { border-bottom:0; }.task-brief-list strong { color:#344258; font-size:13px; }.task-brief-list em,.task-brief-list time { color:#7a8798; font-size:11.5px; font-style:normal; }.task-brief-list time { text-align:right; }.task-priority-dot { width:8px; height:8px; border-radius:50%; background:#5f8fde; }.priority-urgent { background:#df4052; }.priority-high { background:#e49a24; }.priority-low { background:#9ba7b8; }.task-brief-more { padding:11px 14px; margin:0; background:#f8fafc; color:#728098; font-size:12px; text-align:center; }.task-brief-footer { display:flex; align-items:center; gap:20px; padding:21px 28px 26px; }.task-brief-footer p { flex:1; margin:0; color:#818da0; font-size:12px; }
.tasks-statistics { display:flex; flex-direction:column; gap:22px; }.task-stat-danger { color:#c93446!important; font-weight:800; }.task-category-ranking { display:flex; flex-direction:column; gap:15px; }.task-category-ranking > div { position:relative; display:grid; grid-template-columns:1fr auto; gap:10px; padding-bottom:8px; overflow:hidden; }.task-category-ranking span { color:#4b596e; font-size:13px; }.task-category-ranking strong { color:#2c3b52; }.task-category-ranking i { position:absolute; left:0; bottom:0; height:4px; border-radius:99px; background:linear-gradient(90deg,#337be8,#6ba2ef); }
@media (max-width:1000px) { .tasks-kpis { grid-template-columns:repeat(2,1fr); }.task-detail-layout { grid-template-columns:1fr; }.task-history-panel { border-left:0; border-top:1px solid #e7ebf1; }.tasks-filters { grid-template-columns:1fr 1fr; }.tasks-filters input { grid-column:1/-1; } }
@media (max-width:650px) { .tasks-page { padding:0!important; }.tasks-hero { align-items:flex-start; flex-direction:column; padding:23px 20px; border-radius:18px; }.tasks-hero h1 { font-size:25px; }.tasks-primary-button { width:100%; }.tasks-kpis { grid-template-columns:1fr 1fr; gap:9px; }.tasks-kpi { min-height:82px; padding:13px; }.tasks-kpi-icon { width:36px; height:36px; flex-basis:36px; }.tasks-kpi strong { font-size:20px; }.tasks-toolbar { padding:14px; }.tasks-filters { grid-template-columns:1fr; }.tasks-filters input { grid-column:auto; }.tasks-list { padding:6px 10px 12px; }.task-card { padding:14px 12px; }.task-card-content > p { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }.task-modal-shell { padding:8px; align-items:flex-end; }.task-modal { max-height:94vh; border-radius:22px 22px 12px 12px; }.task-form-body { grid-template-columns:1fr; padding:20px; }.task-field-full { grid-column:auto; }.task-save-note { display:none; }.task-modal-footer { padding:14px 20px 18px; }.task-detail-main { padding:20px; }.task-detail-facts { grid-template-columns:1fr; }.task-detail-footer { flex-wrap:wrap; }.task-detail-footer > span { display:none; }.task-brief-header { align-items:flex-start; padding:20px; }.task-brief-date { display:none; }.task-brief-counters { padding:0 20px 16px; gap:6px; }.task-brief-counters > div { flex-direction:column; align-items:flex-start; gap:2px; padding:10px; }.task-brief-list { margin:0 20px; }.task-brief-list > div { grid-template-columns:10px 1fr; gap:6px 8px; padding:11px; }.task-brief-list em,.task-brief-list time { grid-column:2; text-align:left; }.task-brief-footer { flex-direction:column; align-items:stretch; padding:18px 20px 22px; }.task-brief-footer .tasks-primary-button { width:100%; }.tasks-stats-columns { grid-template-columns:1fr!important; } }
body:not(.light-theme) .tasks-hero,body:not(.light-theme) .tasks-workspace,body:not(.light-theme) .tasks-kpi,body:not(.light-theme) .task-card,body:not(.light-theme) .task-modal { background:#171c2d; border-color:#2d354b; } body:not(.light-theme) .tasks-hero h1,body:not(.light-theme) .tasks-kpi strong,body:not(.light-theme) .task-card h3,body:not(.light-theme) .task-modal h2 { color:#f1f4fa; } body:not(.light-theme) .tasks-toolbar,body:not(.light-theme) .task-history-panel,body:not(.light-theme) .task-description { background:#1d2336; border-color:#323a50; } body:not(.light-theme) .task-modal-header { background:rgba(23,28,45,.96); border-color:#323a50; }