:root{--primary-purple: #5b3eeb;--light-purple: #8e7af5;--very-light-purple: #dcd3fc;--dark-blue: #232840;--background-gray: #f4f6f9;--card-white: #ffffff;--dark-text: #2c2f33;--medium-text: #5f6368;--light-border: #e0e0e0}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--background-gray);color:var(--dark-text)}.page-container{display:flex;min-height:100vh}.main-content{flex-grow:1;padding:30px}.page-title{font-size:2.5em;font-weight:700;color:var(--dark-text);margin-bottom:20px}.widget{background-color:var(--card-white);border-radius:10px;box-shadow:0 4px 6px #0000001a;padding:20px}.status-pending{background-color:var(--primary-purple);color:var(--card-white);border:none;border-radius:20px;padding:5px 15px;font-weight:700}:root{--bg-major: #F1F7ED;--bg-minor: #FFFFFF;--accent: #243E36;--accent-2: #7CA982;--muted: #64756b}body{font-family:Vollkorn,serif;background:var(--bg-major);margin:0}.container{max-width:1100px;margin:0 auto;padding:36px}.centered{text-align:center}.nav{position:sticky;top:0;z-index:40;padding:14px 0;background:var(--bg-minor)}.nav-inner{display:flex;align-items:center;justify-content:space-between}.brand{font-family:Scope One,serif;font-size:20px;color:var(--accent);padding-left:25px}.nav-links a{margin-right:18px;text-decoration:none;color:var(--accent)}.btn{display:inline-block;padding:10px 16px;border-radius:10px;font-weight:600;text-decoration:none}.btn.primary{background:var(--accent);color:var(--bg-minor)}.btn.secondary{border:1px solid rgba(36,62,54,.08);color:var(--accent)}.link-login{border:1px solid var(--accent);color:var(--accent)}.hero{padding:60px 0}.hero-inner{display:grid;grid-template-columns:1fr 480px;gap:40px;align-items:center}.display{font-family:Scope One,serif;font-size:36px;margin:0;color:var(--accent)}.lead{margin-top:12px;color:var(--muted);max-width:45ch}.hero-ctas{margin-top:18px}.hero-image{width:100%;max-width:420px;background:var(--accent-2);border-radius:16px;padding:18px}.trust{margin-top:12px;color:var(--muted);font-size:13px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:18px}.grid-item{background:var(--bg-minor);border-radius:12px;padding:18px;box-shadow:0 6px 18px #1020180f;transition:transform .22s ease}.grid-item-inner{display:flex;flex-direction:column}.grid-thumb{width:64px;height:64px;border-radius:12px;background:#7ca98224;display:flex;align-items:center;justify-content:center;margin-bottom:12px}.grid-title{margin:0;font-size:16px;color:var(--accent)}.grid-short{margin:6px 0 0;color:var(--muted);font-size:14px}.grid-detail{margin-top:10px;color:var(--muted);font-size:13px;opacity:0;transition:all .22s}.grid-item:hover{transform:translateY(-6px) scale(1.03)}.grid-item:hover .grid-detail{opacity:1}.section{padding:46px 0}.bg-light{background:var(--bg-minor)}.section-title{font-family:Scope One,serif;font-size:22px;margin-bottom:8px;color:var(--accent)}.plans{display:flex;gap:16px;flex-wrap:wrap;margin-top:18px}.plan-card{background:var(--bg-minor);border-radius:10px;padding:18px;flex:1;min-width:200px;box-shadow:0 8px 20px #1020180a}.plan-card .price{font-weight:700;margin-top:8px}.extras{margin-top:22px}.extras-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:8px 0}.extras-list li{background:#243e360f;padding:8px 12px;border-radius:999px;font-size:13px}.about-text{max-width:70ch;margin:0 auto;color:var(--muted)}.footer{padding:18px 0;margin-top:24px}@media (max-width:880px){.hero-inner{grid-template-columns:1fr}.hero-image{max-width:320px}.nav-links{display:none}}.login-container{display:flex;height:100vh;width:100vw;font-family:Arial,sans-serif}.left-section{flex:1;background-color:#18243b;color:#fff;display:flex;align-items:center;justify-content:center}.left-section h1{font-size:3rem;font-weight:700}.right-section{flex:1;background:#fff;display:flex;align-items:center;justify-content:center}.login-form{width:300px;display:flex;flex-direction:column}.login-form h2{margin-bottom:10px}.welcome{color:#444}.welcome-text{margin-bottom:20px;color:#444}.login-form input{margin-bottom:15px;padding:12px;border:none;background:#e0e0e0;border-radius:6px;font-size:1rem;color:#000;outline:none;transition:all .2s ease-in-out}.login-form input::placeholder{color:#555}.login-form input:focus{border:2px solid #2c3546;background:#f5f5f5}.remember-me{display:flex;align-items:center;gap:6px;margin-bottom:15px;font-size:.9rem;color:#000}.remember-me input{margin:0;width:16px;height:16px;cursor:pointer}.login-form button{background:#2c3546;color:#fff;padding:12px;border:none;border-radius:6px;font-size:1rem;cursor:pointer;transition:background .2s ease-in-out}.login-form button:hover{background:#1e2633}.forgot-link{margin-top:10px;font-size:.9rem;color:#2c3546;text-decoration:none;text-align:center;transition:color .2s ease-in-out}.forgot-link:hover{text-decoration:underline;color:#000}.clickable-logo{transition:all .3s ease}.clickable-logo:hover{color:#1e40af;transform:scale(1.02)}:root{--primary-color: #3798f7;--koala-green: #7ca982;--error-red: #b34a4a;--white: #fff;--card-bg: #ffffff;--border-color: #e0e0e0;--light-gray-bg: #f4f5f9;--text-dark: #333333;--text-light: #666666}.dashboard-container{display:flex;min-height:100vh}.main-content{flex-grow:1;padding:20px;max-width:1200px;margin:0 auto}.page-title{margin-bottom:20px;color:var(--text-dark);font-size:1.5em}.profile-widget{background:var(--card-bg);border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:20px;margin-bottom:20px;border:1px solid var(--border-color)}.profile-main{display:flex;align-items:center;gap:15px}.profile-avatar{width:50px;height:50px;border-radius:50%;background:var(--primary-color);display:flex;align-items:center;justify-content:center;color:var(--white);font-size:1.2em;font-weight:700;flex-shrink:0}.profile-info{flex:1}.profile-info h2{margin:0 0 4px;color:var(--text-dark);font-size:1.3em}.profile-role{margin:0 0 2px;font-size:.95em;color:var(--primary-color);font-weight:600}.profile-department{margin:0;color:var(--text-light);font-size:.85em}.profile-stats{display:flex;gap:20px;align-items:center}.stat-item{text-align:center}.stat-value{font-size:1.4em;font-weight:700;color:var(--primary-color);line-height:1}.stat-label{font-size:.8em;color:var(--text-light);margin-top:2px}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}.announcements-widget,.calendar-widget{background:var(--card-bg);border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:20px;border:1px solid var(--border-color);height:fit-content}.widget-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.widget-header h3{margin:0;font-size:1.1em;color:var(--text-dark)}.announcements-list{display:flex;flex-direction:column;gap:12px}.announcement-item{padding:12px;border-radius:8px;border:1px solid var(--border-color);background:var(--light-gray-bg);transition:all .2s}.announcement-item:hover{border-color:var(--primary-color)}.announcement-title{font-weight:600;color:var(--text-dark);font-size:.9em;margin-bottom:4px}.announcement-message{font-size:.85em;color:var(--text-light);margin-bottom:4px;line-height:1.3}.announcement-date{font-size:.75em;color:var(--text-light);text-align:right}.calendar-navigation{display:flex;align-items:center;gap:10px}.nav-btn{background:var(--light-gray-bg);border:none;border-radius:4px;padding:5px 10px;cursor:pointer;font-size:1em;transition:background .2s}.nav-btn:hover{background:var(--border-color)}.current-month{font-weight:600;color:var(--text-dark);min-width:150px;text-align:center;font-size:.95em}.attendance-stats{display:flex;gap:15px;margin-bottom:15px;padding:10px;background:var(--light-gray-bg);border-radius:6px;font-size:.8em}.attendance-stat{display:flex;align-items:center;gap:6px}.stat-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.stat-dot.present{background-color:var(--koala-green)}.stat-dot.absent{background-color:var(--error-red)}.custom-calendar{width:100%}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;margin-bottom:8px}.weekday-header{text-align:center;font-size:.75em;font-weight:600;color:var(--text-light);padding:8px 0;text-transform:uppercase}.calendar-body{display:flex;flex-direction:column;gap:2px}.calendar-week{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}.calendar-day{aspect-ratio:1;border:1px solid var(--border-color);border-radius:6px;padding:4px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;font-size:.8em;position:relative;background:var(--white);transition:all .2s}.calendar-day:hover{border-color:var(--primary-color);transform:scale(1.02)}.calendar-day.empty{background:transparent;border:none}.calendar-day.today{border:2px solid var(--primary-color);background:#e8f4ff}.calendar-day.present{background:#f0f9f0;border-color:var(--koala-green)}.calendar-day.absent{background:#fff5f5;border-color:var(--error-red)}.day-number{font-weight:600;color:var(--text-dark);font-size:.85em}.status-dot{width:6px;height:6px;border-radius:50%}.status-dot.present{background-color:var(--koala-green)}.status-dot.absent{background-color:var(--error-red)}@media (max-width: 768px){.main-content{padding:15px}.dashboard-grid{grid-template-columns:1fr;gap:15px}.profile-main{flex-direction:column;text-align:center;gap:10px}.profile-stats{justify-content:center}.attendance-stats{flex-direction:column;gap:8px}.widget-header{flex-direction:column;gap:10px;align-items:flex-start}.calendar-navigation{align-self:stretch;justify-content:space-between}}@media (max-width: 480px){.page-title{font-size:1.3em}.profile-widget,.announcements-widget,.calendar-widget{padding:15px}.calendar-day{padding:2px;font-size:.7em}.weekday-header{font-size:.7em;padding:6px 0}}:root{--primary-color: #3798f7;--koala-green: #7ca982;--warning-orange: #f39c12;--error-red: #b34a4a;--white: #fff;--card-bg: #ffffff;--border-color: #e0e0e0;--light-gray-bg: #f4f5f9;--text-dark: #333333;--text-light: #666666}.main-content.tasks-grid{display:flex;flex-direction:column;gap:20px}.stats-widgets{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:10px}.stat-card{background:var(--card-bg);border-radius:12px;padding:20px;display:flex;align-items:center;gap:15px;box-shadow:0 4px 12px #0000000d;border:1px solid var(--border-color)}.stat-icon{font-size:2em}.stat-info{display:flex;flex-direction:column}.stat-number{font-size:2em;font-weight:700;line-height:1}.stat-label{font-size:.9em;color:var(--text-light);margin-top:5px}.total-tasks{border-left:4px solid var(--primary-color)}.completed-tasks{border-left:4px solid var(--koala-green)}.pending-tasks{border-left:4px solid var(--warning-orange)}.overdue-tasks{border-left:4px solid var(--error-red)}.tasks-content{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}.card{background:var(--card-bg);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:20px;border:1px solid var(--border-color)}.tasks-table-card{grid-column:1}.table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid var(--light-gray-bg)}.table-header h3{margin:0;font-size:1.3em;color:var(--text-dark)}.tasks-count{font-size:.9em;color:var(--text-light);font-weight:500}.loading-state{text-align:center;padding:40px;color:var(--text-light);font-style:italic}.task-list{overflow-x:auto}.task-list table{width:100%;border-collapse:collapse;text-align:left}.task-list th,.task-list td{padding:15px 12px;border-bottom:1px solid var(--border-color);vertical-align:top}.task-list th{font-weight:600;color:var(--text-light);font-size:.85em;text-transform:uppercase;background-color:var(--light-gray-bg)}.task-list tr:last-child td{border-bottom:none}.task-row:hover{background-color:var(--light-gray-bg)}.task-title-cell{max-width:250px}.task-title{font-weight:600;color:var(--text-dark);margin-bottom:4px}.task-description{font-size:.85em;color:var(--text-light);margin-bottom:4px;line-height:1.3}.task-assigned-by{font-size:.8em;color:var(--primary-color);font-style:italic}.deadline-cell{display:flex;align-items:center;gap:5px}.overdue-indicator{background:var(--error-red);color:var(--white);border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:.7em;font-weight:700}.status-badge{padding:4px 8px;border-radius:12px;font-size:.75em;font-weight:600;text-transform:capitalize}.status-in-progress{background-color:#e3f2fd;color:var(--primary-color)}.status-pending{background-color:#fff3e0;color:var(--warning-orange)}.status-overdue{background-color:#ffebee;color:var(--error-red)}.priority-badge{padding:4px 8px;border-radius:12px;font-size:.75em;font-weight:600;text-transform:capitalize}.priority-high{background-color:#ffebee;color:var(--error-red)}.priority-medium{background-color:#fff3e0;color:var(--warning-orange)}.priority-low{background-color:#e8f5e8;color:var(--koala-green)}.action-btn{padding:6px 12px;border:none;border-radius:4px;cursor:pointer;font-size:.8em;font-weight:500;transition:all .2s}.complete-btn{background:var(--koala-green);color:var(--white)}.complete-btn:hover{background:#6b9574}.extension-btn{background:transparent;color:var(--primary-color);border:1px solid var(--primary-color)}.extension-btn:hover{background:var(--primary-color);color:var(--white)}.no-tasks{text-align:center;padding:40px!important;color:var(--text-light);font-style:italic;font-size:1.1em}.history-sidebar{grid-column:2;max-height:600px;overflow-y:auto}.history-sidebar h3{margin:0 0 15px;font-size:1.1em;color:var(--text-dark);padding-bottom:10px;border-bottom:1px solid var(--border-color)}.empty-history{text-align:center;padding:30px 20px;color:var(--text-light);font-style:italic;background:var(--light-gray-bg);border-radius:8px}.history-item{padding:12px;border:1px solid var(--border-color);border-radius:8px;background:var(--light-gray-bg);transition:all .2s}.history-item:hover{border-color:var(--primary-color);transform:translateY(-1px)}.history-task-title{font-weight:500;margin-bottom:6px;font-size:.9em;color:var(--text-dark)}.history-task-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;font-size:.8em}.history-task-meta span:first-child{color:var(--text-light)}.history-priority{padding:2px 6px;border-radius:8px;font-size:.7em;font-weight:600}.history-assigned-by{font-size:.8em;color:var(--primary-color);font-style:italic}@media (max-width: 1200px){.stats-widgets{grid-template-columns:repeat(2,1fr)}.tasks-content{grid-template-columns:1fr;gap:15px}.history-sidebar{grid-column:1;max-height:300px}}@media (max-width: 768px){.page-container{padding:10px}.stats-widgets{grid-template-columns:1fr}.stat-card{padding:15px}.actions-cell{flex-direction:column;gap:5px}.task-list th,.task-list td{padding:10px 8px;font-size:.85em}.table-header{flex-direction:column;gap:10px;align-items:flex-start}}.widget{background-color:#f1f7ed;border-radius:10px;padding:20px;box-shadow:0 4px 6px #0000001a;margin-bottom:20px;border:1px solid #243E36;overflow:hidden}.widget button{margin-top:10px;margin-right:0}.client-header{display:flex;justify-content:space-between;align-items:center}.client-header h3{font-size:1.5em;margin:0}.nav-arrows button{background:var(--primary-color, #243E36);color:#fff;border:none;padding:6px 12px;border-radius:5px;margin-left:5px;cursor:pointer}.nav-arrows button:hover{background:#1d332c}.tab-buttons{display:flex;gap:10px;margin-bottom:15px}.tab-button{flex:1;padding:10px;border:1px solid #ccc;background:#e9ecef;cursor:pointer;font-weight:500;transition:all .2s;border-radius:0}.tab-button.active{background:var(--primary-color, #243E36);color:#fff;border-color:var(--primary-color, #243E36)}.notes-section{display:flex;justify-content:space-between;gap:20px}.notes-editor{flex:3;display:flex;flex-direction:column}.notes-textarea{border:1px solid #ccc;border-radius:6px;width:100%;box-sizing:border-box;min-height:100px}.save-button{align-self:flex-end;background-color:var(--primary-color, #243E36);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;transition:background .2s}.save-button:hover{background-color:#1d332c}.last-note{flex:2;background:#fff;border:1px solid #ddd;border-radius:6px;padding:12px;font-size:.9rem;color:#333}.last-note h4{margin:0 0 5px;font-size:1rem}.documents-list{display:flex;flex-direction:column;gap:8px}.document-link{color:var(--primary-color, #243E36);text-decoration:none;font-weight:500}.document-link:hover{text-decoration:underline}.booking-list table{width:100%;border-collapse:collapse;margin-top:15px}.booking-list th,.booking-list td{text-align:left;padding:10px;border-bottom:1px solid #ccc}.reports-grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:20px;grid-template-areas:"timesheet task-report" "timesheet weekly-summary"}.timesheet-widget{grid-area:timesheet}.task-report-widget{grid-area:task-report}.weekly-summary-widget{grid-area:weekly-summary}.timesheet-widget table{width:100%;border-collapse:collapse}.timesheet-widget th,.timesheet-widget td{padding:10px 0;border-bottom:1px solid var(--light-border);text-align:left}.timesheet-widget th{font-weight:700;color:var(--medium-text)}.task-chart{display:flex;align-items:center;justify-content:center;gap:30px;margin-top:20px}.circle-chart{width:100px;height:100px;border-radius:50%;background-color:var(--very-light-purple);display:flex;align-items:center;justify-content:center;position:relative}.circle-chart:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;background:conic-gradient(var(--primary-purple) 65%,transparent 65%)}.circle-chart p{font-size:1.5em;font-weight:700;color:var(--dark-text);z-index:1}.chart-legend{font-size:.9em;color:var(--medium-text)}.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}.completed-dot{background-color:var(--primary-purple)}.in-progress-dot{background-color:var(--light-purple)}.pending-dot{background-color:var(--very-light-purple)}.weekly-summary-widget p{font-size:1.2em;font-weight:700}:root{--primary-color: #3798f7;--koala-green: #7ca982;--error-red: #b34a4a;--warning-orange: #f39c12;--white: #fff;--card-bg: #ffffff;--border-color: #e0e0e0;--light-gray-bg: #f4f5f9;--text-dark: #333333;--text-light: #666666}.main-content.settings-grid{display:flex;flex-direction:column;gap:20px}.page-title{margin-bottom:0;color:var(--text-dark);font-size:1.8em}.status-message{padding:12px 16px;border-radius:8px;font-weight:500;margin-bottom:10px}.status-message.success{background:#f0f9f0;color:var(--koala-green);border:1px solid var(--koala-green)}.status-message.error{background:#fff5f5;color:var(--error-red);border:1px solid var(--error-red)}.settings-content{display:flex;flex-direction:column;gap:30px}.settings-section{background:var(--card-bg);border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:25px;border:1px solid var(--border-color)}.section-header{margin-bottom:25px;padding-bottom:15px;border-bottom:2px solid var(--light-gray-bg)}.section-header h2{margin:0 0 8px;color:var(--text-dark);font-size:1.3em}.section-header p{margin:0;color:var(--text-light);font-size:.9em}.settings-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:500;color:var(--text-dark);font-size:.9em}.form-group input{padding:12px;border:1px solid var(--border-color);border-radius:6px;font-size:.95em;transition:border-color .2s}.form-group input:focus{outline:none;border-color:var(--primary-color)}.form-group small{color:var(--text-light);font-size:.8em;margin-top:4px}.save-btn{background:var(--primary-color);color:var(--white);border:none;padding:12px 24px;border-radius:6px;font-weight:600;font-size:.95em;cursor:pointer;transition:background .2s;align-self:flex-start;min-width:140px}.save-btn:hover:not(:disabled){background:#2881dc}.save-btn:disabled{background:#ccc;cursor:not-allowed}.security-actions{display:flex;flex-direction:column;gap:0}.security-item{display:flex;justify-content:space-between;align-items:center;padding:20px 0;border-bottom:1px solid var(--border-color)}.security-item:last-child{border-bottom:none}.security-info h4{margin:0 0 6px;color:var(--text-dark);font-size:1em}.security-info p{margin:0;color:var(--text-light);font-size:.85em;line-height:1.4}.logout-all-btn{background:var(--error-red);color:var(--white);border:none;padding:10px 20px;border-radius:6px;font-weight:500;font-size:.9em;cursor:pointer;transition:background .2s;white-space:nowrap;margin-left:20px}.logout-all-btn:hover:not(:disabled){background:#a03535}.logout-all-btn:disabled{background:#ccc;cursor:not-allowed}@media (max-width: 768px){.page-container{padding:15px}.settings-section{padding:20px}.security-item{flex-direction:column;gap:15px;align-items:flex-start}.logout-all-btn{margin-left:0;align-self:flex-end}.save-btn{align-self:stretch;text-align:center}}@media (max-width: 480px){.page-title{font-size:1.5em}.settings-section{padding:15px}.section-header h2{font-size:1.2em}.security-info h4{font-size:.95em}.security-info p{font-size:.8em}.logout-all-btn{padding:8px 16px;font-size:.85em}}.sidebar{width:250px;background-color:var(--dark-blue);color:var(--card-white);padding:20px 0;display:flex;flex-direction:column}.sidebar-header{padding:0 20px;margin-bottom:30px}.sidebar-header h2{font-size:1.5em;font-weight:700;color:#fff;margin:0}.sidebar-nav ul{list-style:none;padding:0}.sidebar-nav li{margin-bottom:10px}.sidebar-nav li a{display:block;padding:15px 20px;text-decoration:none;color:#a0a4b8;font-weight:500;transition:background-color .3s,color .3s;border-left:5px solid transparent}.sidebar-nav li a:hover,.sidebar-nav li.active a{background-color:#ffffff1a;color:#fff;border-left-color:var(--primary-purple)}.staff-layout{display:flex;height:100vh}.staff-main-content{flex:1;padding:20px;overflow-y:auto;background-color:#f5f5f5}:root{--blue: #3798f7;--koala-green: #7ca982;--red: #b34a4a;--white: #fff;--light-gray: #f4f5f9;--current-day-color: #f7a237}.dashboard-content{flex-grow:1;padding:32px}.dashboard-content h1{margin:0 0 24px;font-size:2.2em;font-weight:600}.dashboard-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto auto;gap:20px;grid-template-areas:"card1 card2 card3" "overview notification calendar" "trends notification calendar"}.card h3{margin:0 0 12px;font-size:1.1em;font-weight:600}.card-stat{display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--blue);text-align:center}.stat-value{font-weight:700;font-size:2.8em;margin-top:8px}.card-blue{background:var(--blue);grid-area:card1}.card-green{background:var(--koala-green);grid-area:card2}.card-red{background:var(--red);grid-area:card3}.overview{grid-area:overview}.trends{grid-area:trends}.notification{grid-area:notification}.calendar{grid-area:calendar}.notification-list{padding:0;list-style:none}.notification-list li{margin-bottom:12px;display:flex;align-items:center;cursor:pointer}.notification-list li.read span{text-decoration:line-through;color:#888}.notification-list input[type=checkbox]{margin-right:10px}.calendar table{width:100%;border-collapse:separate;border-spacing:6px;font-size:.9em}.calendar th{color:#222d3e;font-weight:600}.calendar td{text-align:center;width:28px;height:28px;border-radius:50%;cursor:pointer;padding:0}.calendar td.today{background:var(--current-day-color);color:var(--white);font-weight:700}.calendar .deadline{background:var(--red);color:var(--white)}.calendar .meeting{background:var(--blue);color:var(--white)}.calendar-legend{margin-top:16px;font-size:.9em;display:flex;align-items:center}.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}.legend-dot.today-legend{background:var(--current-day-color)}.legend-dot.deadline{background:var(--red)}.legend-dot.meeting{background:var(--blue)}.legend-separator{margin:0 12px}.event-popup{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center}.event-content{background:var(--white);padding:20px;border-radius:8px;min-width:250px;text-align:center}.event-content button{margin-top:12px;padding:6px 12px;border:none;background:var(--blue);color:var(--white);border-radius:4px;cursor:pointer}@media (max-width: 1100px){.dashboard-grid{grid-template-columns:1fr;grid-template-areas:"card1" "card2" "card3" "overview" "notification" "trends" "calendar"}}.main-content.user-management-grid{display:grid;grid-template-columns:1fr 280px;grid-template-rows:auto 1fr;gap:20px 30px;grid-template-areas:"title ." "main sidebar"}.user-management-title{grid-area:title}.main-area{grid-area:main;display:flex;flex-direction:column;gap:20px}.sidebar-area{grid-area:sidebar;display:flex;flex-direction:column;gap:20px}.card{background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px;border:1px solid #3798f7}.user-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.search-bar{display:flex;align-items:center;background-color:#f4f5f9;border-radius:8px;padding:8px 15px;flex-grow:1;max-width:300px;border:1px solid #e0e0e0}.search-bar i{color:#888;margin-right:10px}.search-bar input{border:none;outline:none;background:transparent;font-size:1em;flex-grow:1}.add-user-btn{background:#2f4058;color:#fff;border:none;border-radius:8px;padding:10px 20px;cursor:pointer;font-weight:600;transition:background-color .2s}.add-user-btn:hover{background:#374e69}.save-btn{background:#3798f7;color:#fff;border:none;border-radius:8px;padding:12px 20px;font-weight:600;cursor:pointer;transition:background-color .2s}.save-btn:hover{background:#2881dc}.cancel-btn{background:#ccc;color:#000;border:none;border-radius:8px;padding:10px 20px;cursor:pointer}.cancel-btn:hover{background:#b3b3b3}.data-table th,.data-table td{padding:12px 0;border-bottom:1px solid #eee}.data-table th{color:#888;font-weight:500;font-size:.9em;text-transform:uppercase}.edit-link,.delete-link{cursor:pointer;font-weight:500;text-decoration:underline}.edit-link{color:#3798f7}.edit-link:hover{color:#2881dc}.delete-link{color:#f75555}.delete-link:hover{color:#d43838}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000059;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-card{background:#fff;border:1px solid #3798f7;border-radius:12px;padding:24px;width:420px;max-height:85vh;overflow-y:auto;box-shadow:0 6px 20px #00000026}.larger-modal{width:500px;max-height:90vh}.modal-card h2{margin-top:0;margin-bottom:20px;color:#2f4058}.modal-row{display:flex;gap:12px;margin-bottom:15px}.modal-row input{flex:1;padding:10px 12px;border:1px solid #ccc;border-radius:8px}.permission-list{list-style:none;padding:0;margin:0 0 15px}.permission-list li{margin-bottom:8px}.permission-list label{display:flex;align-items:center;cursor:pointer}.permission-list input[type=checkbox]{margin-right:10px;transform:scale(1.2);accent-color:#7ca982}.modal-actions{display:flex;justify-content:flex-end;gap:12px}.summary-card p{margin:5px 0}.pagination-controls{margin-bottom:12px;display:flex;gap:8px;flex-wrap:wrap}.page-btn{padding:6px 12px;border-radius:6px;border:1px solid #3798f7;background:#fff;color:#3798f7;cursor:pointer;font-weight:500}.page-btn:hover,.active-page{background:#3798f7;color:#fff}@media (max-width: 900px){.main-content.user-management-grid{grid-template-columns:1fr;grid-template-areas:"title" "sidebar" "main"}.user-controls{flex-direction:column;align-items:stretch;gap:15px}.search-bar{max-width:100%}.modal-row{flex-direction:column}}*{box-sizing:border-box}:root{--bg: #f6f8fb;--card: #ffffff;--muted: #6b7280;--accent: #2563eb;--green: #10b981;--red: #ef4444;--shadow: 0 6px 18px rgba(15, 23, 42, .06);--radius: 12px;--gap: 20px;--right-col-w: 360px;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}.page-container{display:flex;gap:var(--gap);padding:20px;background:var(--bg);min-height:calc(100vh - 20px);align-items:flex-start}.main-content.client-management-grid{flex:1;display:flex;flex-direction:column;gap:18px;position:relative}.client-management-title{margin:0;font-size:1.25rem;font-weight:700}.top-bar-icon{position:absolute;right:40px;top:28px;color:#333}.grid-wrapper{display:grid;grid-template-columns:1fr var(--right-col-w);gap:18px;align-items:start;width:100%}.left-column{display:grid;grid-auto-rows:minmax(180px,auto);gap:18px;padding:4px}.right-column{display:grid;grid-auto-rows:minmax(120px,auto);gap:18px;padding:4px}.card{background:var(--card);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow);overflow:visible}.card-header{display:flex;justify-content:space-between;align-items:center}.card-header h3{margin:0;font-size:1rem;font-weight:700}.subtext{color:var(--muted);font-size:.9rem}.header-actions{display:flex;gap:10px;align-items:center}.header-actions input{padding:8px 10px;border-radius:10px;border:1px solid #e6e9f2;font-size:.9rem;width:220px}.data-table table{width:100%;border-collapse:collapse;margin-top:12px}.data-table th,.data-table td{padding:10px 8px;border-bottom:1px solid #f1f5f9;font-size:.95rem;vertical-align:middle}.data-table th{color:var(--muted);font-weight:600;font-size:.78rem;text-transform:uppercase}.btn-ghost-small{background:transparent;border:1px solid rgba(15,23,42,.06);padding:6px 8px;border-radius:8px;font-size:.85rem;margin-right:6px}.card-footer{margin-top:12px;display:flex;justify-content:space-between;align-items:center}.pagination{display:flex;gap:8px;align-items:center}.pagination button{padding:6px 10px;border-radius:8px;border:none;background:var(--accent);color:#fff}.reservation-row{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:10px;align-items:center;margin:12px 0}.reservation-row select,.reservation-row input,.reservation-row .rdt{padding:8px;border-radius:8px;border:1px solid #e6e9f2}.reservation-row .rdt input{padding:8px;border-radius:8px}.reservation-list .table-scroll{overflow-x:auto;border-radius:8px;padding-bottom:6px}.reservation-list table{width:100%;border-collapse:collapse;min-width:640px}.reservation-list th,.reservation-list td{padding:10px 12px;white-space:nowrap}.add-event-row{display:flex;gap:8px;margin-top:12px;align-items:center;flex-wrap:wrap}.add-event-row input{padding:8px;border-radius:8px;border:1px solid #e6e9f2;min-width:160px}.react-calendar{border:none;width:100%;background:transparent;font-family:inherit;border-radius:8px}.react-calendar .react-calendar__tile{background:#fff;border-radius:8px;padding:8px 6px;margin:2px;box-shadow:none}.react-calendar .react-calendar__tile--now{border:1px solid rgba(37,99,235,.12)}.react-calendar .react-calendar__tile--active{background:#2563eb0f;border-radius:8px}.calendar-has-event{position:relative;background:#fff}.calendar-has-event:after{content:"";width:8px;height:8px;border-radius:50%;background:var(--green);position:absolute;right:8px;bottom:8px;box-shadow:0 2px 6px #10b98126}.events-list .event-row{margin-top:8px;padding:8px 0;border-bottom:1px dashed #f1f5f9}.profile-contract-card .profile-top{display:flex;justify-content:space-between;gap:12px;align-items:center}.profile-contract-card h4{margin:0;font-size:1.05rem;font-weight:700}.profile-right{display:flex;flex-direction:column;gap:12px;align-items:flex-end}.status-pill{padding:6px 10px;border-radius:999px;font-weight:700;font-size:.85rem}.status-pill.active{background:#10b9811f;color:var(--green)}.status-pill.inactive{background:#ef444414;color:var(--red)}.contract-box{display:flex;gap:8px;align-items:center}.contract-filename{font-size:.9rem;color:var(--muted)}.download-btn{padding:6px 10px;border-radius:8px;border:none;background:var(--accent);color:#fff}.history-list{margin-top:10px;display:flex;flex-direction:column;gap:10px}.history-entry .muted{font-size:.82rem;margin-bottom:4px}.task-add-row{display:flex;gap:8px;align-items:center}.task-add-row input{flex:1;padding:8px;border-radius:8px;border:1px solid #e6e9f2}.task-list{margin-top:10px;display:flex;flex-direction:column;gap:8px}.task-item{display:flex;gap:10px;align-items:center}.event-list{max-height:280px;overflow:auto;padding-right:8px}.event-item{padding:8px;border-radius:8px;background:#fbfcfe;margin-bottom:8px}.modal-overlay{position:fixed;inset:0;background:#02061773;display:flex;align-items:center;justify-content:center;z-index:1200;padding:16px}.modal-content{background:var(--card);width:560px;max-width:100%;border-radius:12px;padding:18px;box-shadow:var(--shadow);outline:none;max-height:calc(100vh - 80px);overflow:auto}.modal-header{display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;font-size:1.1rem}.modal-close{background:transparent;border:none;font-size:1.1rem;cursor:pointer}.modal-body{margin-top:12px;display:flex;flex-direction:column;gap:8px}.modal-row{display:flex;gap:8px}.modal-body label{font-size:.85rem;color:var(--muted)}.modal-body input[type=text],.modal-body input[type=email],.modal-body input[type=file]{padding:10px;border-radius:8px;border:1px solid #e6e9f2;width:100%}.modal-actions{margin-top:14px;display:flex;gap:8px;justify-content:flex-end}.btn-primary{background:var(--accent);color:#fff;border:none;padding:8px 12px;border-radius:8px;cursor:pointer}.btn-ghost{background:transparent;border:1px solid rgba(2,6,23,.06);padding:8px 12px;border-radius:8px;cursor:pointer}.btn-ghost-small{background:transparent;border:1px solid rgba(2,6,23,.06);padding:6px 8px;border-radius:8px;cursor:pointer}.muted{color:var(--muted)}.small{font-size:.85rem}.row-actions{display:flex;gap:8px}.form-group label:after{content:" *";color:var(--red)}@media (max-width: 1100px){.grid-wrapper{grid-template-columns:1fr}.right-column{order:2}.left-column{order:1}}.btn-danger-small{background-color:#ff4d4f;color:#fff;border:none;padding:4px 10px;border-radius:6px;cursor:pointer;font-size:.85rem;transition:background-color .2s ease-in-out}.btn-danger-small:hover{background-color:#d9363e}.section-separator{height:1px;background-color:#d0d0d0;margin:1rem 0}.scrollable-table{max-height:250px;overflow-y:auto}.scrollable-list{max-height:200px;overflow-y:auto;padding-left:1em}.scrollable-table::-webkit-scrollbar,.scrollable-list::-webkit-scrollbar{width:8px}.scrollable-table::-webkit-scrollbar-thumb,.scrollable-list::-webkit-scrollbar-thumb{background-color:#0000004d;border-radius:4px}/*!
 * https://github.com/arqex/react-datetime
 */.rdt{position:relative}.rdtPicker{display:none;position:absolute;min-width:250px;padding:4px;margin-top:1px;z-index:99999!important;background:#fff;box-shadow:0 1px 3px #0000001a;border:1px solid #f9f9f9}.rdtOpen .rdtPicker{display:block}.rdtStatic .rdtPicker{box-shadow:none;position:static}.rdtPicker .rdtTimeToggle{text-align:center}.rdtPicker table{width:100%;margin:0}.rdtPicker td,.rdtPicker th{text-align:center;height:28px}.rdtPicker td{cursor:pointer}.rdtPicker td.rdtDay:hover,.rdtPicker td.rdtHour:hover,.rdtPicker td.rdtMinute:hover,.rdtPicker td.rdtSecond:hover,.rdtPicker .rdtTimeToggle:hover{background:#eee;cursor:pointer}.rdtPicker td.rdtOld,.rdtPicker td.rdtNew{color:#999}.rdtPicker td.rdtToday{position:relative}.rdtPicker td.rdtToday:before{content:"";display:inline-block;border-left:7px solid transparent;border-bottom:7px solid #428bca;border-top-color:#0003;position:absolute;bottom:4px;right:4px}.rdtPicker td.rdtActive,.rdtPicker td.rdtActive:hover{background-color:#428bca;color:#fff;text-shadow:0 -1px 0 rgba(0,0,0,.25)}.rdtPicker td.rdtActive.rdtToday:before{border-bottom-color:#fff}.rdtPicker td.rdtDisabled,.rdtPicker td.rdtDisabled:hover{background:none;color:#999;cursor:not-allowed}.rdtPicker td span.rdtOld{color:#999}.rdtPicker td span.rdtDisabled,.rdtPicker td span.rdtDisabled:hover{background:none;color:#999;cursor:not-allowed}.rdtPicker th{border-bottom:1px solid #f9f9f9}.rdtPicker .dow{width:14.2857%;border-bottom:none;cursor:default}.rdtPicker th.rdtSwitch{width:100px}.rdtPicker th.rdtNext,.rdtPicker th.rdtPrev{font-size:21px;vertical-align:top}.rdtPrev span,.rdtNext span{display:block;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.rdtPicker th.rdtDisabled,.rdtPicker th.rdtDisabled:hover{background:none;color:#999;cursor:not-allowed}.rdtPicker thead tr:first-of-type th{cursor:pointer}.rdtPicker thead tr:first-of-type th:hover{background:#eee}.rdtPicker tfoot{border-top:1px solid #f9f9f9}.rdtPicker button{border:none;background:none;cursor:pointer}.rdtPicker button:hover{background-color:#eee}.rdtPicker thead button{width:100%;height:100%}td.rdtMonth,td.rdtYear{height:50px;width:25%;cursor:pointer}td.rdtMonth:hover,td.rdtYear:hover{background:#eee}.rdtCounters{display:inline-block}.rdtCounters>div{float:left}.rdtCounter{height:100px}.rdtCounter{width:40px}.rdtCounterSeparator{line-height:100px}.rdtCounter .rdtBtn{height:40%;line-height:40px;cursor:pointer;display:block;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.rdtCounter .rdtBtn:hover{background:#eee}.rdtCounter .rdtCount{height:20%;font-size:1.2em}.rdtMilli{vertical-align:middle;padding-left:8px;width:48px}.rdtMilli input{width:100%;font-size:1.2em;margin-top:37px}.rdtTime td{cursor:default}.react-calendar{width:350px;max-width:100%;background:#fff;border:1px solid #a0a096;font-family:Arial,Helvetica,sans-serif;line-height:1.125em}.react-calendar--doubleView{width:700px}.react-calendar--doubleView .react-calendar__viewContainer{display:flex;margin:-.5em}.react-calendar--doubleView .react-calendar__viewContainer>*{width:50%;margin:.5em}.react-calendar,.react-calendar *,.react-calendar *:before,.react-calendar *:after{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.react-calendar button{margin:0;border:0;outline:none}.react-calendar button:enabled:hover{cursor:pointer}.react-calendar__navigation{display:flex;height:44px;margin-bottom:1em}.react-calendar__navigation button{min-width:44px;background:none}.react-calendar__navigation button:disabled{background-color:#f0f0f0}.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus{background-color:#e6e6e6}.react-calendar__month-view__weekdays{text-align:center;text-transform:uppercase;font:inherit;font-size:.75em;font-weight:700}.react-calendar__month-view__weekdays__weekday{padding:.5em}.react-calendar__month-view__weekNumbers .react-calendar__tile{display:flex;align-items:center;justify-content:center;font:inherit;font-size:.75em;font-weight:700}.react-calendar__month-view__days__day--weekend{color:#d10000}.react-calendar__month-view__days__day--neighboringMonth,.react-calendar__decade-view__years__year--neighboringDecade,.react-calendar__century-view__decades__decade--neighboringCentury{color:#757575}.react-calendar__year-view .react-calendar__tile,.react-calendar__decade-view .react-calendar__tile,.react-calendar__century-view .react-calendar__tile{padding:2em .5em}.react-calendar__tile{max-width:100%;padding:10px 6.6667px;background:none;text-align:center;font:inherit;font-size:.833em}.react-calendar__tile:disabled{background-color:#f0f0f0;color:#ababab}.react-calendar__month-view__days__day--neighboringMonth:disabled,.react-calendar__decade-view__years__year--neighboringDecade:disabled,.react-calendar__century-view__decades__decade--neighboringCentury:disabled{color:#cdcdcd}.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus{background-color:#e6e6e6}.react-calendar__tile--now{background:#ffff76}.react-calendar__tile--now:enabled:hover,.react-calendar__tile--now:enabled:focus{background:#ffffa9}.react-calendar__tile--hasActive{background:#76baff}.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus{background:#a9d4ff}.react-calendar__tile--active{background:#006edc;color:#fff}.react-calendar__tile--active:enabled:hover,.react-calendar__tile--active:enabled:focus{background:#1087ff}.react-calendar--selectRange .react-calendar__tile--hover{background-color:#e6e6e6}:root{--blue: #3798f7;--light-gray-bg: #f4f5f9;--white: #fff;--text-dark: #333;--red: #f44336}.main-content.tasks-workflow-grid{display:flex;flex-direction:column;gap:20px}.header-bar{display:flex;justify-content:space-between;align-items:center}.header-bar h1{margin:0}.create-task-btn{background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:10px 15px;cursor:pointer;font-weight:600;transition:background-color .2s}.create-task-btn i{margin-right:5px}.create-task-btn:hover{background:#2881dc}.filter-bar{display:flex;gap:15px;align-items:center}.search-input{display:flex;align-items:center;background-color:var(--white);border-radius:8px;padding:8px 15px;flex-grow:1;max-width:420px;box-shadow:0 1px 3px #0000000d}.search-input i{color:#888;margin-right:10px}.search-input input{border:none;outline:none;background:transparent;font-size:1em;padding:0;flex-grow:1}.filter-dropdown{padding:10px 12px;border:1px solid #ccc;border-radius:8px;background-color:var(--white);font-size:.95em;cursor:pointer;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="%23333" d="M7 10l5 5 5-5z"/></svg>');background-repeat:no-repeat;background-position:right 10px top 50%;background-size:16px;min-width:130px}.filter-dropdown.date-picker{background-image:none;min-width:150px}.status-overview{display:flex;gap:15px;padding-bottom:5px;border-bottom:1px solid #ddd}.status-chip{padding:8px 15px;border-radius:8px;background-color:var(--light-gray-bg);color:var(--text-dark);font-weight:500;cursor:pointer;transition:background-color .2s}.status-chip.active{background-color:var(--blue);color:var(--white)}.task-board-and-automation{display:grid;grid-template-columns:3fr 1fr;gap:20px}.task-board{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;width:100%}.kanban-column{background:var(--light-gray-bg);border-radius:12px;padding:15px;min-height:400px;display:flex;flex-direction:column;gap:15px}.kanban-column h2{font-size:1.1em;font-weight:600;margin:0 0 15px;border-bottom:2px solid #ddd;padding-bottom:10px}.task-card{background:var(--white);border-radius:8px;padding:15px;margin-bottom:15px;box-shadow:0 2px 4px #0000000d;cursor:grab;width:100%;box-sizing:border-box}.task-card strong{display:block;margin-bottom:5px;font-size:.95em;font-weight:600}.task-detail{margin:0;font-size:.85em;color:#666}.task-detail.due{color:var(--red)}.task-detail.status{color:var(--blue)}.task-automations-sidebar{background:var(--white);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px;display:flex;flex-direction:column}.task-automations-sidebar h3{font-weight:700;font-size:1.2em;margin:0 0 20px;border-bottom:1px solid #eee;padding-bottom:10px}.automation-section{margin-bottom:20px}.automation-section h4{font-size:1em;font-weight:600;color:#555;margin:0 0 10px}.automation-chip-group{display:flex;flex-wrap:wrap;gap:8px}.automation-chip{padding:8px 12px;background:var(--light-gray-bg);border-radius:6px;font-size:.85em;font-weight:500;border:1px solid #e0e0e0}@media (max-width: 1200px){.task-board-and-automation{grid-template-columns:2fr 1fr}}@media (max-width: 900px){.task-board-and-automation,.task-board{grid-template-columns:1fr}.filter-bar{flex-wrap:wrap}.filter-dropdown{flex-grow:1}}.modal-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:999}.modal{background:var(--white);padding:24px;border-radius:12px;box-shadow:0 4px 15px #0003;width:400px;max-width:95%;display:flex;flex-direction:column;gap:12px}.modal h2{margin:0 0 10px;font-size:1.3em}.modal input,.modal select{padding:10px 12px;border:1px solid #ccc;border-radius:8px;font-size:1em}.modal input[type=date]{padding:8px 10px}.task-card .create-btn{background:#2e8bff;color:#fff;border:none;border-radius:6px;padding:6px 8px;cursor:pointer;font-size:.85em}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}.cancel-btn{background:#eee;padding:8px 14px;border:none;border-radius:8px;cursor:pointer}.create-btn{background:var(--blue);color:var(--white);padding:8px 14px;border:none;border-radius:8px;cursor:pointer}.main-content.finance-grid{display:flex;flex-direction:column;gap:20px}.finance-grid h1{margin-bottom:0;color:#333}.stats-cards-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:10px}.stat-card{display:flex;justify-content:space-between;align-items:center;padding:20px;border:1px solid var(--border-color);border-radius:12px}.stat-label{font-weight:500;color:#666;font-size:1em}.stat-count{font-size:2em;font-weight:700}.overdue-stat .stat-count{color:var(--red)}.completed-stat .stat-count{color:var(--koala-green)}.finance-content-area{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:start}.invoices-table-card{background:var(--white);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px}.search-box input{padding:8px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:.9em;width:200px}.data-table th,.data-table td{padding:12px 15px;border-bottom:1px solid #eee;font-size:.9em}.status-badge{padding:4px 8px;border-radius:12px;font-size:.8em;font-weight:600;text-transform:uppercase}.status-overdue{background-color:#ffebee;color:var(--red)}.status-completed{background-color:#e8f5e8;color:var(--koala-green)}.download-btn{background:var(--blue);color:var(--white);border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.8em;transition:background .2s}.generate-invoice-section{display:flex;flex-direction:column}.generate-invoice-btn{background:var(--blue);color:var(--white);border:none;padding:15px 25px;border-radius:8px;cursor:pointer;font-weight:600;font-size:1em;transition:background .2s;white-space:nowrap}.generate-invoice-btn:hover{background:#2881dc}.form-group input:disabled,.form-group select:disabled{background-color:#f5f5f5;color:#999;cursor:not-allowed}.checkbox-group label{display:flex;align-items:center;gap:8px;cursor:pointer}.checkbox-group input[type=checkbox]{width:auto}@media (max-width: 1000px){.stats-cards-row{grid-template-columns:1fr}.finance-content-area{grid-template-columns:1fr;gap:20px}.table-header{flex-direction:column;gap:15px;align-items:stretch}.search-box input{width:100%}.modal-content{width:95%;margin:20px;padding:20px}.form-actions{flex-direction:column}.submit-btn,.cancel-btn{width:100%}}@media (max-width: 768px){.data-table{font-size:.8em}.data-table th,.data-table td{padding:8px 10px}}.main-content.reports-analytics-grid{display:grid;grid-template-columns:1fr;grid-template-rows:auto auto 1fr auto;gap:20px}.reports-analytics-grid h1{margin-bottom:0}.top-control-bar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.report-chips{display:flex;gap:10px}.report-chip{padding:10px 18px;border:1px solid #ccc;border-radius:8px;background-color:var(--white);font-weight:500;cursor:pointer;transition:all .2s}.report-chip:hover{border-color:var(--blue)}.report-chip.active{background-color:var(--blue);color:var(--white);border-color:var(--blue)}.export-options{display:flex;gap:10px}.export-btn{padding:8px 15px;border:1px solid #ccc;border-radius:8px;background:var(--white);cursor:pointer;font-size:.9em}.export-btn:hover{background:var(--light-gray-bg)}.report-chart-card{min-height:450px;display:flex;flex-direction:column}.chart-container{flex-grow:1;padding-top:20px}.chart-container h3{margin-top:0;font-weight:600}.bar-chart{width:100%;height:auto;max-height:350px;margin-top:20px}.placeholder-chart{flex-grow:1;display:flex;justify-content:center;align-items:center;color:#999;font-size:1.2em;border:1px dashed #ccc;border-radius:8px;margin-top:20px}.export-data-panel{align-self:flex-end;display:flex;flex-direction:column;align-items:flex-end;gap:10px;padding:15px 0}.export-data-panel p{font-size:.9em;color:#666;margin:0}.download-btn{background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:10px 20px;cursor:pointer;font-weight:600;transition:background-color .2s}.download-btn:hover{background:#2881dc}@media (max-width: 768px){.top-control-bar{flex-direction:column;align-items:flex-start}.export-data-panel{align-self:stretch;align-items:stretch}}:root{--blue: #3798f7;--white: #fff;--light-gray-bg: #f4f5f9;--text-dark: #333}.settings-grid{display:flex;flex-direction:column;gap:20px}.settings-grid h1{margin-bottom:0}.settings-container{display:grid;grid-template-columns:250px 1fr;gap:20px;flex-grow:1;min-height:70vh}.card{background:var(--white);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px}.settings-sidebar{padding:15px 0}.settings-sidebar h3{padding:0 24px 10px;font-size:1.1em;font-weight:600;margin:0 0 15px;border-bottom:1px solid #eee}.settings-nav-list{list-style:none;padding:0;margin:0}.settings-link{width:100%;text-align:left;background:none;border:none;padding:10px 24px;text-decoration:none;color:var(--text-dark);font-weight:500;cursor:pointer;border-left:3px solid transparent;transition:background-color .2s}.settings-link:hover{background-color:var(--light-gray-bg)}.settings-link.active{background-color:var(--light-gray-bg);border-left-color:var(--blue);font-weight:600}.settings-content-area h2{font-size:1.8em;margin:0 0 30px;padding-bottom:10px;border-bottom:1px solid #eee}.setting-item{margin-bottom:25px;display:flex;flex-direction:column;max-width:400px}.setting-item label{font-weight:600;margin-bottom:8px;color:#555}.setting-item input[type=text],.setting-item input[type=email],.setting-item input[type=password],.setting-item input[type=file],.setting-item select{padding:10px 12px;border:1px solid #ccc;border-radius:8px;font-size:1em;background-color:var(--white)}.save-settings-btn{background:var(--blue);color:var(--white);border:none;border-radius:8px;padding:10px 20px;cursor:pointer;font-weight:600;transition:background-color .2s;margin-top:20px;width:auto;align-self:flex-start}.save-settings-btn:hover{background:#2881dc}.logout-btn{background:#ff4d4d;color:#fff;border:none;border-radius:8px;padding:10px 20px;margin-top:15px;cursor:pointer;font-weight:600}.logout-btn:hover{background:#e63939}.subscription-card{background:#f9f9f9;padding:20px;border-radius:12px;border:1px solid #eee;max-width:400px}.subscription-card h3{margin-bottom:10px}.subscription-card ul{margin:10px 0 0;padding-left:20px}.subscription-card li{margin-bottom:6px}.integration-item{display:flex;justify-content:space-between;align-items:center;padding:12px;border:1px solid #eee;border-radius:8px;margin-bottom:12px;background:#fafafa}.connect-btn{background:var(--blue);color:#fff;border:none;border-radius:6px;padding:6px 14px;cursor:pointer}.connect-btn:hover{background:#2881dc}.toggle-item{display:flex;justify-content:space-between;align-items:center;max-width:400px}.session-list{margin-top:20px}.session-list ul{list-style:none;padding:0}.session-list li{display:flex;justify-content:space-between;margin-bottom:10px}.session-list button{background:#ff4d4d;color:#fff;border:none;border-radius:6px;padding:4px 10px;cursor:pointer}.session-list button:hover{background:#e63939}@media (max-width: 900px){.settings-container{grid-template-columns:1fr;grid-template-rows:auto 1fr}.settings-sidebar{order:1}.settings-content-area{order:2}}.sidebar{width:240px;background:var(--sidebar-bg, #243e36);color:#fff;padding:30px 0;min-height:100vh;display:flex;flex-direction:column;align-items:center;margin-right:32px}.sidebar-title{font-weight:700;font-size:1.6em;margin-bottom:36px}.sidebar nav{width:100%}.sidebar a{display:flex;align-items:center;padding:12px 32px;color:#fff;text-decoration:none;font-weight:500;border-radius:6px;margin-bottom:6px;background:none;transition:background .2s}.sidebar a.active-link,.sidebar a[aria-current=page]{background:var(--sidebar-active, #7ca982)}.sidebar a:hover{background:#7ca98226}.sidebar .sidebar-icon{margin-right:14px;font-size:1.2em}.manager-layout{display:flex;height:100vh}.manager-main-content{flex:1;padding:20px;overflow-y:auto;background-color:#f5f5f5}:root{--blue: #3798f7;--koala-green: #7ca982;--red: #b34a4a;--orange: #f39c12;--white: #fff;--light-gray-bg: #f4f5f9;--border-color: #e0e0e0}.main-content.inventory-grid{display:flex;flex-direction:column;gap:20px}.inventory-grid h1{margin-bottom:0;color:#333}.inventory-controls{display:flex;gap:20px;align-items:center;margin-bottom:10px}.search-box input{padding:10px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:.95em;width:300px}.search-box input:focus{outline:none;border-color:var(--blue)}.filter-dropdown select{padding:10px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:.95em;background:var(--white);cursor:pointer}.filter-dropdown select:focus{outline:none;border-color:var(--blue)}.alert-indicator{background:#fff3cd;border:1px solid #ffeaa7;color:#856404;padding:12px 16px;border-radius:6px;font-weight:500;margin-bottom:10px}.inventory-table-card{background:var(--white);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:24px}.table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.table-header h3{margin:0;font-size:1.3em;font-weight:600;color:#333}.data-table{overflow-x:auto}.data-table table{width:100%;border-collapse:collapse;text-align:left}.data-table th,.data-table td{padding:15px;border-bottom:1px solid #eee;font-size:.9em}.data-table th{color:#666;font-weight:600;text-transform:uppercase;font-size:.8em;background-color:#f8f9fa}.data-table tr:last-child td{border-bottom:none}.data-table tr.needs-restock{background-color:#fff5f5}.data-table tr.needs-restock:hover{background-color:#ffeaea}.item-name{font-weight:500;position:relative;display:flex;align-items:center;gap:8px}.alert-badge{background:var(--red);color:var(--white);border-radius:50%;width:18px;height:18px;display:flex;align-items:center;justify-content:center;font-size:.7em;font-weight:700}.quantity-cell{min-width:150px}.quantity-display{display:flex;align-items:center;gap:10px}.edit-quantity-btn{background:transparent;color:var(--blue);border:1px solid var(--blue);padding:4px 8px;border-radius:4px;cursor:pointer;font-size:.8em;transition:all .2s}.edit-quantity-btn:hover{background:var(--blue);color:var(--white)}.quantity-edit{display:flex;align-items:center;gap:8px}.quantity-edit input{width:80px;padding:6px 8px;border:1px solid var(--blue);border-radius:4px;font-size:.9em}.quantity-edit input:focus{outline:none}.unit{color:#666;font-size:.9em}.stock-indicator{display:flex;align-items:center;gap:8px;font-weight:600}.stock-indicator.adequate{color:var(--koala-green)}.stock-indicator.restock{color:var(--red)}.status-text{font-size:.9em}.actions-cell{display:flex;gap:8px;min-width:150px}.restock-btn{background:var(--blue);color:var(--white);border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.8em;transition:background .2s}.restock-btn:hover{background:#2881dc}.delete-btn{background:var(--red);color:var(--white);border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:.8em;transition:background .2s}.delete-btn:hover{background:#a03535}.add-inventory-section{display:flex;justify-content:flex-end}.add-inventory-btn{background:var(--koala-green);color:var(--white);border:none;padding:12px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:1em;transition:background .2s}.add-inventory-btn:hover{background:#6b9574}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:var(--white);border-radius:12px;padding:30px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 30px #0003}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding-bottom:15px;border-bottom:1px solid var(--border-color)}.modal-header h2{margin:0;color:#333;font-size:1.4em}.close-btn{background:none;border:none;font-size:1.5em;cursor:pointer;color:#666;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center}.close-btn:hover{color:#333;background:#f0f0f0;border-radius:50%}.form-group{margin-bottom:20px;position:relative}.form-group label{display:block;margin-bottom:5px;font-weight:500;color:#333}.form-group input,.form-group select{width:100%;padding:10px 12px;border:1px solid var(--border-color);border-radius:6px;font-size:.95em;box-sizing:border-box}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--blue)}.form-group input:disabled{background-color:#f5f5f5;color:#999;cursor:not-allowed}.disabled-input{background-color:#f5f5f5!important;color:#666!important}.unit-hint{position:absolute;right:12px;top:35px;color:#666;font-size:.9em}.form-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:25px;padding-top:20px;border-top:1px solid var(--border-color)}.submit-btn{background:var(--blue);color:var(--white);border:none;padding:12px 25px;border-radius:6px;cursor:pointer;font-weight:600;transition:background .2s}.submit-btn:hover{background:#2881dc}.cancel-btn{background:#f5f5f5;color:#666;border:1px solid var(--border-color);padding:12px 25px;border-radius:6px;cursor:pointer;font-weight:600;transition:all .2s}.cancel-btn:hover{background:#e0e0e0}@media (max-width: 768px){.inventory-controls{flex-direction:column;align-items:stretch;gap:10px}.search-box input{width:100%}.data-table{font-size:.8em}.data-table th,.data-table td{padding:10px 8px}.actions-cell{flex-direction:column;gap:5px}.quantity-display{flex-direction:column;align-items:flex-start;gap:5px}.modal-content{width:95%;margin:20px;padding:20px}.form-actions{flex-direction:column}.submit-btn,.cancel-btn{width:100%}.add-inventory-section{justify-content:stretch}.add-inventory-btn{width:100%}}@media (max-width: 480px){.stock-indicator{flex-direction:column;gap:2px;align-items:flex-start}.status-text{font-size:.8em}}:root{--blue: #3798f7;--koala-green: #7ca982;--red: #b34a4a;--white: #fff;--light-gray-bg: #f4f5f9;--border-color: #e0e0e0}.page-container{padding:20px}.main-content.announcement-grid{display:flex;flex-direction:column;gap:20px}.announcement-grid h1{margin-bottom:0;color:#333}.announcement-content{display:grid;grid-template-columns:300px 1fr 350px;gap:20px;min-height:70vh}.card{background:var(--white);border-radius:12px;box-shadow:0 4px 12px #0000000d;padding:20px;display:flex;flex-direction:column}.card h3{margin:0 0 20px;font-size:1.1em;font-weight:600;color:#333;border-bottom:2px solid var(--light-gray-bg);padding-bottom:10px}.groups-panel{overflow-y:auto}.groups-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.group-item{display:flex;align-items:center;gap:12px;padding:12px;border:2px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s}.group-item:hover{border-color:var(--blue);background:var(--light-gray-bg)}.group-item.selected{border-color:var(--blue);background:#e8f4ff}.group-radio{display:flex;align-items:center;justify-content:center}.radio-dot{width:16px;height:16px;border:2px solid #ccc;border-radius:50%;transition:all .2s}.radio-dot.active{border-color:var(--blue);background:var(--blue)}.group-info{flex:1}.group-label{font-weight:500;margin-bottom:2px}.group-count{font-size:.8em;color:#666}.selection-summary{margin-top:20px;padding:15px;background:var(--light-gray-bg);border-radius:8px;font-size:.9em;line-height:1.4}.templates-section{margin-top:20px;padding-top:20px;border-top:1px solid var(--border-color)}.templates-section h4{margin:0 0 10px;font-size:.9em;color:#666;font-weight:600}.template-btn{width:100%;padding:8px 12px;margin-bottom:8px;border:1px solid var(--border-color);border-radius:6px;background:var(--white);cursor:pointer;font-size:.85em;text-align:left;transition:all .2s}.template-btn:hover{background:var(--light-gray-bg);border-color:var(--blue)}.compose-panel{display:flex;flex-direction:column}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;font-weight:500;color:#333;font-size:.9em}.subject-input{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:6px;font-size:1em;font-weight:500}.subject-input:focus{outline:none;border-color:var(--blue)}.message-textarea{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:6px;font-size:.95em;resize:vertical;min-height:200px;font-family:inherit;line-height:1.5}.message-textarea:focus{outline:none;border-color:var(--blue)}.send-section{margin-top:auto;padding-top:20px;border-top:1px solid var(--border-color)}.send-btn{width:100%;background:var(--blue);color:var(--white);border:none;padding:15px 20px;border-radius:8px;cursor:pointer;font-weight:600;font-size:1em;transition:background .2s;display:flex;align-items:center;justify-content:center;gap:8px}.send-btn:hover:not(:disabled){background:#2881dc}.send-btn:disabled{background:#ccc;cursor:not-allowed}.loading-spinner{width:16px;height:16px;border:2px solid transparent;border-top:2px solid var(--white);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.send-info{margin-top:10px;font-size:.8em;color:#666;text-align:center}.recently-sent{margin-top:20px;padding-top:20px;border-top:1px solid var(--border-color)}.recently-sent h4{margin:0 0 10px;font-size:.9em;color:#666;font-weight:600}.recent-item{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid #f0f0f0;font-size:.85em}.recent-item:last-child{border-bottom:none}.recent-item strong{color:#333;flex:1}.recent-item span{color:#666;font-size:.8em}.history-panel{overflow-y:auto}.history-list{display:flex;flex-direction:column;gap:12px}.history-item{padding:15px;border:1px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s}.history-item:hover{background:var(--light-gray-bg);border-color:var(--blue);transform:translateY(-1px)}.history-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.history-title{font-weight:500;font-size:.9em;flex:1;margin-right:10px}.history-badge{background:var(--koala-green);color:var(--white);padding:2px 6px;border-radius:4px;font-size:.7em;text-transform:capitalize}.history-date{font-size:.8em;color:#666;margin-bottom:4px}.history-recipients{font-size:.8em;color:var(--blue);font-weight:500;margin-bottom:6px}.history-preview{font-size:.8em;color:#666;line-height:1.3}@media (max-width: 1200px){.announcement-content{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:15px}.groups-panel,.history-panel{max-height:300px}}@media (max-width: 768px){.page-container{padding:10px}.history-header{flex-direction:column;gap:5px}.history-badge{align-self:flex-start}}.customer-dashboard{max-width:1200px;margin:0 auto}.customer-welcome{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 10px #0000001a;margin-bottom:30px}.customer-welcome h1{color:#1e40af;margin-bottom:10px}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.dashboard-card{background:#fff;padding:25px;border-radius:12px;box-shadow:0 2px 10px #0000001a;text-align:center}.dashboard-card h3{color:#6b7280;font-size:.9rem;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.card-value{font-size:2.5rem;font-weight:700;color:#1e40af;margin:0}.recent-activity{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 10px #0000001a}.recent-activity h3{color:#1e40af;margin-bottom:15px}.customer-sidebar{width:250px;background:linear-gradient(180deg,#1e3a8a,#1e40af);color:#fff;padding:20px;height:100vh;position:fixed;left:0;top:0}.customer-sidebar-header{text-align:center;margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #374151}.customer-sidebar-header h2{font-size:1.5rem;margin-bottom:5px}.customer-id{font-size:.8rem;opacity:.8;background:#ffffff1a;padding:4px 8px;border-radius:12px;display:inline-block}.customer-sidebar-nav{display:flex;flex-direction:column;gap:8px}.customer-sidebar-link{display:flex;align-items:center;gap:12px;padding:12px 16px;color:#fff;text-decoration:none;border-radius:8px;transition:all .3s ease}.customer-sidebar-link:hover{background:#ffffff1a}.customer-sidebar-link.customer-active{background:#fff3;font-weight:600}.customer-sidebar-icon{font-size:1.2rem}.logout-section{margin-top:auto;padding:20px 0;border-top:1px solid rgba(255,255,255,.1)}.logout-btn{width:100%;padding:12px 16px;background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .3s ease}.logout-btn:hover{background:#ffffff1a;border-color:#ffffff80}.logout-icon{font-size:1.1em}.customer-layout{display:flex;min-height:100vh}.customer-main-content{flex:1;margin-left:250px;padding:20px;background-color:#f8fafc}
