:root{--bg:#edf2fa;--panel:#ffffff;--text:#0b1d3a;--muted:#5c6e8c;--line:#d8e2f0;--primary:#3b68b7;--sidebar:#152744;--danger:#ef4444;--shadow:0 10px 30px rgba(21,39,68,0.06)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent!important}body{margin:0;font:14px/1.5 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6,.brand,.page-head h1,.metric-card b,.stat b,.btn,.task-tab-btn{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important}.priority-pill,.status-chip,time,.date-text,.routine-badge{font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif!important}.app{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:235px;background:var(--sidebar);color:#9ca3af;padding:22px 14px;z-index:10;border-right:1px solid #1f3558}.brand{color:#fff;font-size:18px;font-weight:700;padding:0 10px 25px;display:flex;align-items:center}.brand i{color:#60a5fa;margin-right:10px}.brand-logo{width:28px;height:28px;margin-right:10px;vertical-align:middle}.sidebar nav{display:grid;gap:5px}.sidebar nav a{padding:11px 12px;border-radius:99px;color:#9ca3af;transition:all .2s ease;font-weight:600}.sidebar nav a i{width:24px;color:#6b7280;transition:all .2s ease}.sidebar nav a:hover{color:#ffffff;background:#1f3558}.sidebar nav a:hover i{color:#93c5fd}.sidebar nav a.active{color:#ffffff;background:#3b68b7;font-weight:700;box-shadow:0 4px 14px rgba(59,104,183,0.35)}.sidebar nav a.active i{color:#ffffff}.badge{float:right;background:#ef4444;color:#fff;border-radius:10px;padding:0 6px;font-size:11px}.main{margin-left:235px}.topbar{height:54px;background:rgb(205 224 253);box-shadow:1px -2px 5px #d3e3fd;border-bottom:1px solid #e2e6eb;backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:0 16px;position:sticky;top:0;z-index:5}.topbar-user{display:grid;margin-right:auto}.topbar-user small{text-transform:capitalize;color:var(--muted)}.topbar-actions{display:flex;align-items:center;gap:10px}.btn-sm{padding:6px 12px!important;font-size:12px!important;border-radius:8px!important;height:32px!important;min-height:32px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.menu-btn{display:none}.menu-btn,.link-btn,.icon-btn{border:0;background:none;cursor:pointer;color:var(--text)}.link-btn{background:#d3e3fd!important;color:#0b2d68!important;font-weight:700!important;font-size:12px!important;padding:6px 12px!important;border-radius:8px!important;height:32px!important;min-height:32px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.content{padding:12px 16px 20px;max-width:1450px;margin:auto}.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.page-head h1{margin:0;font-size:26px;color:#0b1d3a;font-weight:800}.page-head p{margin:4px 0 0;color:var(--muted)}.back{display:block;color:var(--primary);margin-bottom:8px;font-weight:600}.btn{border:1px solid var(--line);background:var(--panel);color:var(--text);padding:10px 16px;border-radius:10px;cursor:pointer;display:inline-flex;gap:7px;align-items:center;justify-content:center;font-weight:600;transition:all .2s ease}.btn:hover{background:#f0f4fd;border-color:#cbd5e1}.btn.primary{background:#3b68b7;border-color:#3b68b7;color:#fff;box-shadow:0 4px 14px rgba(59,104,183,0.25)}.btn.primary:hover{background:#2b579a;border-color:#2b579a}.btn.wide{width:100%}.danger-btn{color:var(--danger);border-color:#fecaca;background:#fef2f2}.stats{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;margin-bottom:22px}.stat,.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}.stat{padding:18px;display:flex;align-items:center;gap:13px}.stat>i{font-size:20px;color:#3b68b7;background:#d3e3fd;padding:10px;border-radius:10px}.stat b{font-size:22px;display:block;color:#0b1d3a}.stat span{color:var(--muted)}.stat.danger>i{color:var(--danger);background:#fef2f2}.panel{padding:20px}.panel h2{font-size:17px;margin:0 0 17px;color:#0b1d3a;font-weight:700}.panel-head{display:flex;justify-content:space-between}.panel-head a{color:var(--primary);font-weight:600}.grid-2{display:grid;grid-template-columns:1.35fr 1fr;gap:20px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid var(--line);white-space:nowrap;color:#1f2937}th{color:var(--muted);font-size:12px;text-transform:uppercase}.block{display:block;color:var(--muted)}.pill,.status{display:inline-block;padding:4px 10px;border-radius:99px;font-size:11px;font-weight:700;background:#edf2fa;color:#1f2937}.pill.low{background:#d3e3fd;color:#0b2d68}.pill.medium{background:#fef3c7;color:#b45309}.pill.high{background:#fee2e2;color:#b91c1c}.pill.critical{background:#fee2e2;color:#b91c1c}.activity>div{display:flex;gap:10px;margin:13px 0}.activity i{font-size:7px;color:var(--primary);margin-top:8px}.activity p{margin:0;color:#1f2937}.activity small{display:block;color:var(--muted)}.filters{display:flex;gap:10px;margin-bottom:16px}.filters input{min-width:220px}input,select,textarea{width:100%;border:1px solid #cbd5e1;background:#ffffff;color:var(--text);border-radius:10px;padding:10px 12px;outline:none;transition:all .2s ease}input:focus,select:focus,textarea:focus{border-color:#3b68b7;background:#ffffff;box-shadow:0 0 0 3px rgba(59,104,183,0.15)}label{display:grid;gap:6px;font-weight:700;color:#0b1d3a;font-size:13px}label small{color:var(--muted);font-weight:normal}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.full{grid-column:1/-1}.actions{display:flex;justify-content:flex-end;gap:10px}.modal{position:fixed;inset:0;background:#0b1d3a66;display:none;align-items:center;justify-content:center;padding:20px;z-index:30;overflow-y:auto}.modal.open{display:flex}.modal-card{background:var(--panel);width:min(580px,100%);max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;border-radius:16px;padding:16px 18px;position:relative;border:1px solid var(--line);box-shadow:0 20px 40px rgba(0,0,0,0.15);margin:auto}.modal-card h2{font-size:16px;margin:0 0 10px;color:#0b1d3a;font-weight:700}.modal-card form,.modal-card .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.modal-card label{display:grid;gap:3px;font-weight:700;color:#0b1d3a;font-size:12px}.modal-card input,.modal-card select{padding:6px 10px;min-height:36px;height:36px;border-radius:8px;font-size:13px}.modal-card textarea{padding:6px 10px;min-height:60px;border-radius:8px;font-size:13px}.modal-card .actions{margin-top:4px;gap:8px}.modal-close{position:absolute;right:15px;top:10px;border:0;background:none;font-size:26px;cursor:pointer;color:var(--text)}.modal-header-tabs{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:12px;border-bottom:2px solid var(--line)}.modal-header-tabs .modal-close{position:static;font-size:22px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;transition:all .2s ease;flex-shrink:0}.modal-header-tabs .modal-close:hover{background:#edf2fa}.modal-tabs{display:flex;gap:6px}.modal-tab{border:1px solid var(--line);background:var(--panel);color:var(--muted);padding:8px 16px;border-radius:10px;cursor:pointer;font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:6px;transition:all .2s ease}.modal-tab:hover{background:#edf2fa;color:var(--text)}.modal-tab.active{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 3px 10px rgba(59,104,183,0.25)}.modal-tab i{font-size:12px}.modal-tab-content{display:none}.modal-tab-content.active{display:block}.details{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.details div{background:#f8fafc;padding:12px;border-radius:10px;border:1px solid #e2e8f0}.details dt{font-size:12px;color:var(--muted)}.details dd{margin:3px 0 0;font-weight:700;color:#0b1d3a}.description{white-space:pre-wrap;color:#334155}.inline-form,.admin-actions,.upload,.row-actions{display:flex;gap:9px;align-items:center}.inline-form{margin-top:18px}.admin-actions{margin-top:12px}.files a,.notification-list a{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);color:#1f2937}.files small,.notification-list small{display:block;color:var(--muted)}.discussion{margin-top:20px}.comments article{display:flex;gap:12px;margin:18px 0}.avatar{width:34px;height:34px;flex:none;border-radius:50%;background:#d3e3fd;color:#0b2d68;display:grid;place-items:center;font-weight:bold}.comments header{display:flex;gap:12px}.comments time{color:var(--muted);font-size:12px}.comments p{margin:5px 0;color:#1f2937}.comment-form textarea{min-height:85px;margin-bottom:8px}.stack{display:grid;gap:14px}.report-list div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:12px 0;color:#1f2937}.alert{padding:11px;border-radius:10px;margin-bottom:15px;font-weight:600}.alert.error{background:#fee2e2;color:#991b1b}.alert.success{background:#d3e3fd;color:#0b2d68}.muted,.empty{color:var(--muted);text-align:center}.error-box{text-align:center;padding:80px 20px}.error-box i{font-size:45px;color:var(--danger)}.login-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:#edf2fa}.login-card{width:min(400px,100%);background:#ffffff;padding:36px 30px;border-radius:20px;box-shadow:0 15px 35px rgba(11,29,58,0.08);border:1px solid #d8e2f0}.login-card h1{text-align:center;margin-bottom:4px;color:#0b1d3a;font-size:24px;font-weight:800}.login-card>p{text-align:center;color:#5c6e8c;font-size:13px;margin-top:2px}.login-card form{display:grid;gap:16px;margin-top:10px}.login-icon{margin:auto;width:64px;height:64px;border-radius:16px;background:transparent;display:grid;place-items:center}.login-icon .brand-logo{width:64px;height:64px;margin:0}.textarea-toolbar{display:inline-flex;gap:4px;align-items:center}.btn-xs-tool{border:1px solid #d1d5db;background:#ffffff;color:#3b68b7;padding:3px 8px;border-radius:6px;font-size:11px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:4px;transition:all .2s ease;box-shadow:0 1px 3px rgba(0,0,0,0.05)}.btn-xs-tool:hover{background:#3b68b7;color:#ffffff;border-color:#3b68b7}.btn-xs-tool i{font-size:10px}.metric-card{cursor:pointer!important;transition:transform 0.18s ease,box-shadow 0.18s ease!important;user-select:none}.metric-card:hover{transform:translateY(-1.5px)!important;box-shadow:0 8px 20px rgba(0,0,0,0.12)!important}.metric-card:active{transform:translateY(0)!important}.logout-btn{background:#ffffff!important;color:#dc2626!important;border:1px solid #fca5a5!important;font-weight:700!important;font-size:12px!important;padding:6px 12px!important;border-radius:8px!important;height:32px!important;min-height:32px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;cursor:pointer!important;box-shadow:0 2px 4px rgba(220,38,38,0.08)!important;transition:all 0.2s ease!important}.logout-btn:hover{background:#dc2626!important;color:#ffffff!important;border-color:#dc2626!important;box-shadow:0 4px 10px rgba(220,38,38,0.25)!important}
@media(max-width:1050px){.stats{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main{margin-left:0}.menu-btn{display:block;margin-right:auto}.content{padding:18px}.grid-2{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.filters{flex-wrap:wrap}.filters>*{flex:1;min-width:140px!important}.form-grid{grid-template-columns:1fr}.full{grid-column:1/-1}.page-head{align-items:flex-start;gap:12px}.topbar{padding:0 16px}}@media(max-width:430px){.stats{grid-template-columns:1fr}.page-head{flex-direction:column}.panel{padding:14px}}

/* CKEditor Custom Minimal Toolbar Styling */
.ck-editor { width: 100% !important; margin-top: 4px; }
.ck-editor__editable_inline { min-height: 120px !important; max-height: 350px !important; font-size: 14px !important; line-height: 1.6 !important; color: #334155 !important; }
.ck-toolbar { background: #f8fafc !important; border-color: #cbd5e1 !important; border-radius: 8px 8px 0 0 !important; }
.ck.ck-editor__main>.ck-editor__editable:not(.ck-focused) { border-color: #cbd5e1 !important; }
.ck.ck-editor__main>.ck-editor__editable.ck-focused { border-color: #3b68b7 !important; box-shadow: 0 0 0 3px rgba(59, 104, 183, 0.15) !important; }
.ck-content ul, .ck-content ol { padding-left: 24px !important; margin: 6px 0 !important; }
.ck-content p { margin: 3px 0 !important; }

/* Multi-Assignee Selection Widget */
.multi-assignee-picker { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.assignees-chips-list { display: flex; flex-wrap: wrap; gap: 6px; min-height: 24px; padding: 2px 0; }
.assignee-chip { display: inline-flex; align-items: center; gap: 6px; background: #e0e7ff; color: #3730a3; border: 1px solid #c7d2fe; padding: 4px 10px; border-radius: 99px; font-size: 12px; font-weight: 700; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.assignee-chip.chip-manager { background: #fae8ff; color: #86198f; border-color: #f0abfc; }
.assignee-chip.chip-self { background: #dcfce7; color: #166534; border-color: #86efac; }
.assignee-chip .chip-remove-btn { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: rgba(0, 0, 0, 0.14) !important; color: inherit !important; font-size: 13px; font-weight: bold; line-height: 1; cursor: pointer; margin-left: 2px; transition: background 0.15s ease, color 0.15s ease; user-select: none; }

/* Custom In-App Confirmation Modal Styling */
.confirm-modal-card {
    max-width: 400px !important;
    padding: 24px 20px !important;
    text-align: center !important;
    border-radius: 20px !important;
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25) !important;
    border: 1px solid #e2e8f0 !important;
    margin: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.confirm-modal-icon {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    margin: 4px auto 16px auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 26px !important;
    flex-shrink: 0 !important;
}

.confirm-modal-icon.danger {
    background: #fee2e2 !important;
    color: #ef4444 !important;
    border: 2px solid #fca5a5 !important;
}

.confirm-modal-icon.warning {
    background: #fef3c7 !important;
    color: #d97706 !important;
    border: 2px solid #fcd34d !important;
}

.confirm-modal-title {
    font-size: 19px !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.3 !important;
    text-align: center !important;
}

.confirm-modal-message {
    font-size: 13.5px !important;
    color: #64748b !important;
    margin: 0 0 20px 0 !important;
    line-height: 1.5 !important;
    font-weight: 500 !important;
    text-align: center !important;
}

.confirm-modal-actions {
    display: flex !important;
    gap: 10px !important;
    justify-content: center !important;
    width: 100% !important;
}

.confirm-modal-actions .btn {
    flex: 1 !important;
    padding: 10px 16px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    justify-content: center !important;
    height: 42px !important;
    min-height: 42px !important;
    cursor: pointer !important;
}

.confirm-modal-actions .btn-cancel {
    background: #f1f5f9 !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
}

.confirm-modal-actions .btn-cancel:hover {
    background: #e2e8f0 !important;
    color: #1e293b !important;
}

.confirm-modal-actions .btn-confirm-danger {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3) !important;
}



/* ==========================================================================
   WINDOWS 11 LIGHT MICA / ACRYLIC GLASS THEME
   ========================================================================== */

body {
    background: radial-gradient(circle at 85% 15%, rgba(96, 165, 250, 0.15) 0%, transparent 50%),
                radial-gradient(circle at 15% 85%, rgba(147, 197, 253, 0.18) 0%, transparent 50%),
                radial-gradient(circle at 50% 50%, rgba(191, 219, 254, 0.25) 0%, transparent 60%),
                linear-gradient(135deg, #f0f6ff 0%, #f8fafc 40%, #eef4ff 70%, #f0f6ff 100%) !important;
    background-attachment: fixed !important;
    min-height: 100vh !important;
    color: #0f172a !important;
    position: relative !important;
}

/* Ultra Soft Ambient Glow Orbs behind the Glass (Seamless & Smooth) */
body::before {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    top: 5% !important;
    right: 5% !important;
    width: 550px !important;
    height: 550px !important;
    background: radial-gradient(ellipse at center, rgba(59, 130, 246, 0.10) 0%, rgba(147, 197, 253, 0) 70%) !important;
    filter: blur(90px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}

body::after {
    content: "" !important;
    display: block !important;
    position: fixed !important;
    bottom: 5% !important;
    left: 10% !important;
    width: 600px !important;
    height: 600px !important;
    background: radial-gradient(ellipse at center, rgba(96, 165, 250, 0.08) 0%, rgba(191, 219, 254, 0) 70%) !important;
    filter: blur(100px) !important;
    pointer-events: none !important;
    z-index: 0 !important;
}


/* Windows 11 Acrylic Glass Panels, Cards, Metric Cards, Modals */
.panel,
.stat,
.metric-card,
.ui-panel,
.entity-card,
.modal-card,
.task-detail-card,
.project-hero,
.compact-filter,
.overdue-alert {
    background: rgba(255, 255, 255, 0.58) !important;
    backdrop-filter: blur(35px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(35px) saturate(200%) !important;
    border: 1px solid rgba(255, 255, 255, 0.8) !important;
    box-shadow: 0 12px 36px 0 rgba(15, 23, 42, 0.06), inset 0 1px 0 0 rgba(255, 255, 255, 0.95) !important;
    border-radius: 12px !important;
}

/* Windows 11 Acrylic Topbar Header */
.topbar {
    background: rgba(255, 255, 255, 0.6) !important;
    backdrop-filter: blur(35px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(35px) saturate(200%) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.75) !important;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04) !important;
}

/* Windows 11 Acrylic Sidebar */
.sidebar {
    background: rgba(240, 246, 255, 0.65) !important;
    backdrop-filter: blur(35px) saturate(200%) !important;
    -webkit-backdrop-filter: blur(35px) saturate(200%) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.75) !important;
    box-shadow: 4px 0 24px rgba(15, 23, 42, 0.05) !important;
}

.brand {
    color: #0f172a !important;
    font-weight: 800 !important;
    padding: 10px 4px 14px 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.brand-logo {
    width: auto !important;
    max-width: 200px !important;
    height: 75px !important;
    max-height: 85px !important;
    object-fit: contain !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.sidebar nav a {
    color: #475569 !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}

.sidebar nav a i {
    color: #64748b !important;
}

.sidebar nav a:hover {
    color: #0f172a !important;
    background: rgba(255, 255, 255, 0.6) !important;
}

.sidebar nav a:hover i {
    color: #2563eb !important;
}

.sidebar nav a.active {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35) !important;
}

.sidebar nav a.active i {
    color: #ffffff !important;
}

/* Acrylic Glass Inputs */
html body input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not(.note-title-field),
html body select,
html body textarea {
    background: rgba(255, 255, 255, 0.65) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border: 1px solid rgba(255, 255, 255, 0.85) !important;
    border-radius: 8px !important;
    color: #0f172a !important;
    font-weight: 400 !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

html body input,
html body select,
html body textarea,
.login-card input,
form input {
    font-weight: 400 !important;
    font-size: 14px !important;
    color: #0f172a !important;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    font-weight: 400 !important;
    -webkit-text-fill-color: #0f172a !important;
}

/* Primary Windows 11 Accent Button */
.btn.primary {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 8px !important;
}