:root{--white: #ffffff;--navy: #2c3e50;--blue: #3498db;--darkblue: #2980b9;--button-radius: .7rem}.login-container{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;height:100vh;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;margin:0;padding:0;width:100%}.login-card{background:var(--white);border-radius:var(--button-radius);box-shadow:0 .9rem 1.7rem #00000040;width:400px;padding:2.5rem;text-align:center}.logo-container{display:flex;flex-direction:column;align-items:center;margin-bottom:.75rem}.company-logo{display:block;width:140px;height:auto;margin:0 auto 1rem;object-fit:contain}.brand-icon{font-size:2rem;opacity:.8;line-height:1;margin-bottom:.25rem}h1{color:var(--navy);margin-bottom:.5rem;font-weight:400;font-size:2rem;letter-spacing:-.5px}.subtitle{color:#7f8c8d;margin-bottom:2rem;font-size:.95rem;border-bottom:1px solid #ecf0f1;padding-bottom:1.5rem}.btn-auth0{background:#eb5424;border:none;border-radius:30px;color:#fff;cursor:pointer;font-size:1rem;font-weight:500;padding:.9rem 1.5rem;width:100%;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;box-shadow:0 4px 6px #eb542433}.btn-auth0:hover{background:#c43d1a;transform:translateY(-2px);box-shadow:0 6px 12px #eb54244d}.btn-auth0 span{font-size:1.2rem}.divider{margin:1.5rem 0;color:#bdc3c7;display:flex;align-items:center;gap:10px;font-size:.8rem;text-transform:uppercase;letter-spacing:1px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:#ecf0f1}.terms{font-size:.75rem;color:#95a5a6;margin-top:1.5rem;line-height:1.5}.terms a{color:var(--blue);text-decoration:none;font-weight:500}.terms a:hover{text-decoration:underline}@media(max-width:480px){.login-card{width:90%;padding:2rem}.brand-icon{font-size:2.2rem}h1{font-size:1.8rem}}.dashboard-container{max-width:1400px;margin:0 auto;padding:2rem}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap}.dashboard-header h1{margin:0;color:#2c3e50;font-size:2rem}.dashboard-date{color:#7f8c8d;margin-top:.25rem;font-size:.9rem}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-bottom:2rem}.stat-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 2px 8px #0000001a;display:flex;align-items:center;gap:1rem}.stat-icon{font-size:2.5rem;width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:#f8fafc;border-radius:12px}.stat-content{flex:1}.stat-label{display:block;color:#7f8c8d;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.25rem}.stat-value{display:block;font-size:2rem;font-weight:700;color:#2c3e50;line-height:1.2}.completion-section{background:#fff;border-radius:12px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 2px 8px #0000001a}.completion-header{display:flex;justify-content:space-between;margin-bottom:.75rem;font-weight:500}.completion-percent{font-weight:700;color:#27ae60}.progress-bar-large{height:8px;background:#ecf0f1;border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#3498db,#27ae60);transition:width .3s ease}.dashboard-columns{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.dashboard-card{background:#fff;border-radius:12px;padding:1.5rem;margin-bottom:2rem;box-shadow:0 2px 8px #0000001a}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;border-bottom:2px solid #f0f2f5;padding-bottom:.75rem}.card-header h2{margin:0;font-size:1.1rem;font-weight:600;color:#2c3e50}.view-all{color:#3498db;text-decoration:none;font-size:.85rem}.view-all:hover{text-decoration:underline}.ship-list{display:flex;flex-direction:column;gap:.75rem}.ship-item{display:flex;align-items:center;gap:1rem;padding:.75rem;background:#f8fafc;border-radius:8px}.ship-info{flex:2;min-width:0}.ship-name{font-weight:600;color:#2c3e50;display:block}.ship-full{font-size:.75rem;color:#7f8c8d}.ship-stats{font-weight:600;min-width:60px;text-align:center}.ship-stats .filled{color:#27ae60}.ship-stats .separator{color:#bdc3c7;margin:0 2px}.ship-progress{flex:1;height:6px;background:#ecf0f1;border-radius:3px;overflow:hidden}.progress-bar-small{height:100%;background:#27ae60;transition:width .3s ease}.critical-roles{display:flex;gap:.5rem}.critical-role{font-size:.7rem;padding:.2rem .5rem;background:#fee2e2;color:#e74c3c;border-radius:12px}.activity-list{display:flex;flex-direction:column;gap:1rem}.activity-item{display:flex;gap:.75rem;padding:.75rem;background:#f8fafc;border-radius:8px}.activity-icon{font-size:1.2rem;min-width:32px;text-align:center}.activity-content{flex:1}.activity-message{margin:0 0 .25rem;color:#2c3e50;font-size:.9rem}.activity-meta{font-size:.7rem;color:#7f8c8d;display:flex;gap:.75rem}.activity-user{color:#3498db}.quick-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.action-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem;background:#f8fafc;border-radius:8px;text-decoration:none;color:#2c3e50;transition:all .2s}.action-btn:hover{background:#3498db;color:#fff}.action-icon{font-size:1.2rem}.deficiency-list{display:flex;flex-direction:column;gap:.75rem}.deficiency-item{display:flex;align-items:center;justify-content:space-between;padding:.75rem;background:#f8fafc;border-radius:8px}.deficiency-role{display:flex;align-items:center;gap:.5rem;flex:1}.role-dot{width:8px;height:8px;border-radius:50%}.deficiency-count{font-weight:600;min-width:60px;text-align:center}.deficiency-count .needed{color:#e74c3c}.quick-fix{background:#3498db;color:#fff;padding:.25rem .75rem;border-radius:16px;text-decoration:none;font-size:.75rem}.quick-fix:hover{background:#2980b9}.timeframe-selector{display:flex;gap:.5rem}.timeframe-btn{padding:.5rem 1rem;border:1px solid #e0e0e0;background:#fff;border-radius:20px;cursor:pointer;font-size:.85rem;transition:all .2s}.timeframe-btn:hover{background:#f0f0f0}.timeframe-btn.active{background:#3498db;color:#fff;border-color:#3498db}.dashboard-loading{text-align:center;padding:3rem;color:#7f8c8d}.loading-spinner{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(max-width:1024px){.dashboard-container{padding:1rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-columns{grid-template-columns:1fr}}@media(max-width:640px){.stats-grid{grid-template-columns:1fr}.dashboard-header{flex-direction:column;align-items:flex-start}.quick-actions{grid-template-columns:1fr}.ship-item{flex-wrap:wrap}.ship-progress{width:100%}}.dashboard-container .stats-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:1.5rem!important;margin-bottom:2rem!important;width:100%!important}.dashboard-container .stat-card{background:#fff!important;border-radius:12px!important;padding:1.5rem!important;box-shadow:0 2px 8px #0000001a!important;display:flex!important;align-items:center!important;gap:1rem!important;width:auto!important;min-width:0!important}.dashboard-container .stat-card .stat-icon{font-size:2rem!important;width:48px!important;height:48px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#f8fafc!important;border-radius:12px!important;flex-shrink:0!important}.dashboard-container .stat-card .stat-content{flex:1!important;min-width:0!important}.dashboard-container .stat-card .stat-label{display:block!important;color:#7f8c8d!important;font-size:.8rem!important;text-transform:uppercase!important;letter-spacing:.5px!important;margin-bottom:.25rem!important}.dashboard-container .stat-card .stat-value{display:block!important;font-size:2rem!important;font-weight:700!important;color:#2c3e50!important;line-height:1.2!important}@media(max-width:1024px){.dashboard-container .stats-grid{grid-template-columns:repeat(2,1fr)!important}}@media(max-width:640px){.dashboard-container .stats-grid{grid-template-columns:1fr!important}}.employee-container{max-width:1400px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif}.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:10px 0;flex-wrap:wrap;gap:10px}.header h1{margin:0;color:#2c3e50;font-size:clamp(1.2rem,5vw,1.8rem)}.header-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.add-employee-btn,.edit-btn,.delete-btn{border:none;border-radius:8px;cursor:pointer;font-weight:600;padding:10px 14px}.add-employee-btn{background:#4c8eda;color:#fff}.edit-btn{background:#f0ad4e;color:#fff}.delete-btn{background:#d9534f;color:#fff}.detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.total-badge{background:#3498db;color:#fff;padding:6px 12px;border-radius:20px;font-weight:600;font-size:.9rem;white-space:nowrap}@media(max-width:480px){.header{flex-direction:column;align-items:flex-start}.total-badge{align-self:flex-start}}.search-section{margin-bottom:20px}.search-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.search-input{flex:1;min-width:300px;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:16px;transition:border-color .3s}.search-input:focus{outline:none;border-color:#3498db}.search-btn{padding:12px 24px;background:#3498db;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background .3s}.search-btn:hover{background:#2980b9}.clear-btn{padding:8px 16px;background:#e74c3c;color:#fff;border:none;border-radius:6px;cursor:pointer}.main-layout{display:flex;gap:20px}.employee-grid-container{flex:1}.employee-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:16px;margin-bottom:20px}.employee-card{background:#fff;border:1px solid #e0e0e0;border-radius:10px;overflow:hidden;transition:all .3s ease;box-shadow:0 2px 4px #0000001a}.employee-card:hover{box-shadow:0 4px 8px #00000026;transform:translateY(-2px)}.employee-card.expanded{grid-column:span 1;box-shadow:0 8px 16px #00000026}.card-header{display:flex;justify-content:space-between;align-items:center;padding:16px;cursor:pointer;background:linear-gradient(to right,#f8f9fa,#fff)}.employee-info h3{margin:0 0 8px;color:#2c3e50;font-size:16px}.badges{display:flex;gap:8px;flex-wrap:wrap}.role-badge.manager{background:#2980b9;color:#fff}.role-badge.supervisor{background:#f1c40f;color:#000}.role-badge.coordinator{background:#147380;color:#fff}.role-badge.lead{background:#f39c12;color:#fff}.role-badge.pier-agent{background:#27ae60;color:#fff}.role-badge.support{background:#7f8c8d;color:#fff}.role-badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600;text-transform:capitalize}.status-badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600}.status-badge.active{background:#27ae60;color:#fff}.status-badge.inactive{background:#e74c3c;color:#fff}.expand-btn{background:none;border:none;font-size:20px;cursor:pointer;color:#7f8c8d;padding:0 8px}.card-details{padding:16px;background:#f8f9fa;border-top:1px solid #e0e0e0}.detail-label{width:100px;color:#7f8c8d;font-weight:500}.detail-actions{display:flex;gap:10px;margin-top:12px}.edit-btn,.history-btn{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .3s}.edit-btn:hover{background:#2980b9}.history-btn{background:#95a5a6;color:#fff}.manage-roles-btn{background:#3498db;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;margin-right:8px}.manage-roles-btn:hover{background:#2980b9;transform:translateY(-1px)}.detail-actions{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #ecf0f1}.history-btn{background:#95a5a6;color:#fff;border:none;padding:8px 16px;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.history-btn:hover{background:#7f8c8d}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{max-width:900px;width:90%;max-height:90vh;overflow-y:auto;border-radius:12px;box-shadow:0 10px 40px #0003}.role-edit-section{margin:10px 0;padding:10px;background:#e8f4f8;border-radius:6px}.role-select{width:100%;padding:8px;border:2px solid #3498db;border-radius:4px;font-size:14px;background:#fff}.role-select:focus{outline:none;border-color:#2980b9}.edit-actions{display:flex;gap:10px;margin-top:10px}.save-btn,.cancel-btn{flex:1;padding:8px;border:none;border-radius:4px;cursor:pointer;font-weight:600;transition:all .3s}.cancel-btn{background:#e74c3c;color:#fff}.cancel-btn:hover:not(:disabled){background:#c0392b}.save-btn:disabled,.cancel-btn:disabled{opacity:.5;cursor:not-allowed}.edit-btn:disabled{opacity:.5;cursor:not-allowed}.pagination{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:20px}.pagination button{padding:8px 16px;border:1px solid #3498db;background:#fff;color:#3498db;border-radius:6px;cursor:pointer;transition:all .3s}.pagination button:hover:not(:disabled){background:#3498db;color:#fff}.pagination button:disabled{opacity:.5;cursor:not-allowed}.az-index{width:80px;background:#fff;border:1px solid #e0e0e0;border-radius:10px;overflow:hidden;position:sticky;top:20px;height:fit-content;max-height:calc(100vh - 100px);overflow-y:auto}.az-header{padding:12px;background:#2c3e50;color:#fff;text-align:center;font-weight:600}.az-letters{display:flex;flex-direction:column}.letter-btn{display:flex;flex-direction:column;align-items:center;padding:8px 4px;border:none;background:none;cursor:pointer;transition:all .2s;border-bottom:1px solid #f0f0f0}.letter-btn:hover:not(:disabled){background:#e3f2fd}.letter-btn.active{background:#3498db;color:#fff}.letter-btn.empty{opacity:.3;cursor:not-allowed}.letter{font-weight:700;font-size:18px}.count{font-size:11px;color:#7f8c8d}.letter-btn.active .count{color:#fffc}@media(max-width:768px){.main-layout{flex-direction:column-reverse}.az-index{width:100%;position:static;max-height:none;margin-bottom:20px}.az-letters{flex-direction:row;flex-wrap:wrap;justify-content:center}.employee-grid{grid-template-columns:1fr}}.role-manager-container{background:#fff;border-radius:12px;padding:24px;max-width:800px;margin:0 auto;box-shadow:0 4px 12px #00000026}.role-manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #ecf0f1}.role-manager-header h2{margin:0;color:#2c3e50}.close-btn{background:none;border:none;font-size:20px;cursor:pointer;color:#7f8c8d}.employee-info{background:#f8f9fa;padding:15px;border-radius:8px;margin-bottom:20px}.employee-info p{margin:5px 0}.roles-container{margin-bottom:20px}.hint{color:#7f8c8d;font-size:13px;font-style:italic;margin-bottom:15px}.role-card{border:1px solid #e0e0e0;border-radius:8px;margin-bottom:10px;overflow:hidden;transition:all .2s}.role-card.selected{border-left:4px solid #27ae60;background:#f9f9f9}.role-header{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;background:#fff;cursor:pointer}.role-checkbox{display:flex;align-items:center;gap:10px}.role-checkbox input[type=checkbox]{width:18px;height:18px;cursor:pointer}.role-checkbox label{cursor:pointer;font-size:16px}.expand-icon{color:#7f8c8d;font-size:12px}.duties-list{padding:15px;background:#f8f9fa;border-top:1px solid #e0e0e0}.duties-hint{font-size:12px;color:#7f8c8d;margin-bottom:10px}.duty-item{margin:8px 0;display:flex;align-items:center;gap:10px}.duty-item input[type=checkbox]{width:16px;height:16px;cursor:pointer}.duty-item label{cursor:pointer;font-size:14px}.duty-item label.disabled{color:#bdc3c7;cursor:not-allowed}.no-duties{padding:15px;color:#7f8c8d;font-style:italic;background:#f8f9fa}.summary-section{background:#f8f9fa;padding:15px;border-radius:8px;margin:20px 0}.summary-section p{margin:5px 0;font-size:14px}.action-buttons{display:flex;gap:10px;justify-content:flex-end}.save-btn,.cancel-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.save-btn{background:#27ae60;color:#fff}.save-btn:hover:not(:disabled){background:#229954}.cancel-btn{background:#e0e0e0;color:#2c3e50}.cancel-btn:hover{background:#d0d0d0}.save-btn:disabled{opacity:.5;cursor:not-allowed}.loading,.error{text-align:center;padding:40px;color:#7f8c8d}.role-management-container{max-width:1400px;margin:0 auto;padding:20px}.role-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #ecf0f1}.role-header h1{margin:0;color:#2c3e50;font-size:28px}.role-subtitle{margin:5px 0 0;color:#7f8c8d;font-size:14px}.new-role-btn{background:#27ae60;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s;white-space:nowrap}.new-role-btn:hover{background:#229954}.priority-legend{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px;padding:10px;background:#f8f9fa;border-radius:8px;justify-content:center}.legend-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#34495e}.color-dot{width:14px;height:14px;border-radius:4px}.color-dot.priority-5{background:#2980b9}.color-dot.priority-4{background:#f1c40f}.color-dot.priority-3{background:#147380}.color-dot.priority-2{background:#f39c12}.color-dot.priority-1{background:#27ae60}.color-dot.priority-0{background:#7f8c8d}.roles-list{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;overflow:hidden;margin-top:20px}.role-item{display:flex;align-items:center;padding:20px;border-bottom:1px solid #ecf0f1;background:#fff;transition:all .3s}.role-item:last-child{border-bottom:none}.role-item.inactive{opacity:.6;background:#f8f9fa}.role-drag-handle{font-size:20px;color:#bdc3c7;cursor:grab;padding:0 15px 0 5px;-webkit-user-select:none;user-select:none}.role-drag-handle:active{cursor:grabbing}.role-color-indicator{width:6px;height:50px;border-radius:3px;margin-right:20px}.role-content{flex:1;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.role-name-section{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:200px}.role-name{font-weight:600;color:#2c3e50;font-size:18px}.role-priority-badge{background:#3498db;color:#fff;padding:3px 8px;border-radius:4px;font-size:12px;font-weight:600}.role-count{color:#7f8c8d;font-size:13px;background:#ecf0f1;padding:3px 10px;border-radius:20px;white-space:nowrap}.role-details{display:flex;gap:20px;align-items:center;flex-wrap:wrap;min-width:200px}.role-minmax{color:#34495e;font-size:14px;background:#f8f9fa;padding:4px 10px;border-radius:20px;white-space:nowrap}.role-required{font-size:12px;padding:4px 12px;border-radius:20px;font-weight:600;white-space:nowrap}.role-required.required{background:#e8f5e9;color:#27ae60}.role-required.optional{background:#fff3e0;color:#f39c12}.role-actions{display:flex;align-items:center;gap:15px;min-width:100px;justify-content:flex-end}.active-toggle{position:relative;display:inline-block;width:50px;height:24px}.active-toggle input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:#e74c3c;transition:.4s;border-radius:24px}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.4s;border-radius:50%}input:checked+.toggle-slider{background-color:#27ae60}input:checked+.toggle-slider:before{transform:translate(26px)}.edit-role-btn{background:none;border:none;font-size:18px;cursor:pointer;padding:5px 10px;color:#7f8c8d;transition:color .3s;border-radius:4px}.edit-role-btn:hover{color:#3498db;background:#f0f0f0}.modal-content{background:#fff;padding:30px;border-radius:10px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto}.modal-content h2{margin-top:0;margin-bottom:20px;color:#2c3e50}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:5px;color:#34495e;font-weight:500}.form-group input[type=text],.form-group input[type=number]{width:100%;padding:10px 12px;border:2px solid #e0e0e0;border-radius:4px;font-size:14px;transition:border-color .3s}.form-group input:focus{outline:none;border-color:#3498db}.form-group.checkbox{display:flex;align-items:center}.form-group.checkbox label{display:flex;align-items:center;gap:8px;margin:0;cursor:pointer}.form-row{display:flex;gap:15px}.form-row .form-group{flex:1}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:30px}.modal-actions button{padding:10px 20px;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s}.modal-actions .cancel-btn{background:#e74c3c;color:#fff}.modal-actions .cancel-btn:hover:not(:disabled){background:#c0392b}.modal-actions .save-btn{background:#27ae60;color:#fff}.modal-actions .save-btn:hover:not(:disabled){background:#229954}.modal-actions button:disabled{opacity:.5;cursor:not-allowed}.loading{text-align:center;padding:40px;color:#7f8c8d}@media(max-width:768px){.role-header{flex-direction:column;align-items:flex-start;gap:15px}.role-item{flex-wrap:wrap}.role-content{flex-direction:column;align-items:flex-start}.role-name-section,.role-details{width:100%}.role-actions{width:100%;justify-content:flex-start}.priority-legend{gap:10px}}.shifts-container{max-width:1400px;margin:0 auto;padding:20px}.shifts-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding:10px 0;border-bottom:2px solid #ecf0f1}.shifts-header h1{margin:0;color:#2c3e50;font-size:28px}.new-shift-btn{background:#27ae60;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s}.new-shift-btn:hover{background:#229954}.filters-section{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:30px;padding:20px;background:#f8f9fa;border-radius:10px;align-items:flex-end}.filter-group{display:flex;flex-direction:column;gap:5px;min-width:200px}.filter-group label{font-size:12px;font-weight:600;color:#7f8c8d;text-transform:uppercase}.filter-group select,.filter-group input{padding:8px 12px;border:2px solid #e0e0e0;border-radius:6px;font-size:14px;background:#fff}.date-range{display:flex;align-items:center;gap:10px}.date-range input{width:130px}.clear-filters{padding:8px 16px;background:#e74c3c;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;height:38px}.shifts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(400px,1fr));gap:20px}.shift-card{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;overflow:hidden;transition:all .3s;border-top:4px solid;cursor:pointer}.shift-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.shift-card.expanded{grid-column:span 1}.shift-card-header{display:flex;justify-content:space-between;align-items:center;padding:16px;background:linear-gradient(to right,#f8f9fa,#fff)}.shift-ship-info{display:flex;align-items:center;gap:10px}.shift-ship{font-weight:700;font-size:18px;color:#2c3e50}.shift-date{color:#7f8c8d;font-size:14px}.shift-time{font-weight:600;color:#34495e}.shift-status{display:flex;align-items:center;gap:10px}.status-badge{padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600}.shift-card-stats{display:flex;justify-content:space-around;padding:12px;background:#f8f9fa;border-top:1px solid #ecf0f1;border-bottom:1px solid #ecf0f1}.stat{display:flex;flex-direction:column;align-items:center;gap:4px}.shift-card-details{padding:16px}.detail-row{display:flex;margin-bottom:8px;padding:4px 0}.detail-label{width:80px;color:#7f8c8d;font-weight:500}.detail-value{flex:1;color:#2c3e50}.shift-actions{display:flex;gap:8px;margin:20px 0;flex-wrap:wrap}.action-btn{padding:6px 12px;border:none;border-radius:4px;font-size:12px;font-weight:600;cursor:pointer;background:#ecf0f1;color:#34495e;transition:all .3s}.action-btn:hover{background:#bdc3c7}.action-btn.primary{background:#3498db;color:#fff}.action-btn.primary:hover{background:#2980b9}.action-btn.success{background:#27ae60;color:#fff}.action-btn.success:hover{background:#229954}.action-btn.warning{background:#f39c12;color:#fff}.action-btn.warning:hover{background:#e67e22}.action-btn.danger{background:#e74c3c;color:#fff}.action-btn.danger:hover:not(:disabled){background:#c0392b}.action-btn.danger:disabled{opacity:.5;cursor:not-allowed}.assignments-preview{margin-top:20px}.assignments-preview h4{margin:0 0 10px;font-size:14px;color:#34495e}.assignment-tags{display:flex;gap:8px;flex-wrap:wrap}.assignment-tag{padding:4px 8px;border-radius:4px;font-size:11px;font-weight:600}.assignment-tag.supervisor{background:#8e44ad;color:#fff}.assignment-tag.lead{background:#f39c12;color:#fff}.assignment-tag.pier-agent{background:#27ae60;color:#fff}.expand-btn{background:none;border:none;font-size:16px;cursor:pointer;color:#7f8c8d}.loading{text-align:center;padding:40px;color:#7f8c8d;font-size:18px}@media(max-width:768px){.shifts-grid{grid-template-columns:1fr}.filters-section{flex-direction:column}.filter-group{width:100%}.date-range{flex-direction:column;align-items:stretch}.date-range input{width:100%}}.auto-placement-container{max-width:1400px;margin:0 auto;padding:20px}.placement-header{margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #ecf0f1}.placement-header h1{margin:0;color:#2c3e50;font-size:32px;display:flex;align-items:center;gap:10px}.header-subtitle{color:#7f8c8d;font-size:14px;margin-top:5px}.shift-selector{margin-bottom:25px;display:flex;align-items:center;gap:15px;flex-wrap:wrap}.shift-selector label{font-weight:600;color:#34495e}.shift-selector select{padding:10px 15px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;min-width:350px;background:#fff;cursor:pointer}.shift-selector select:focus{outline:none;border-color:#3498db}.shift-summary-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;padding:20px;margin-bottom:25px;color:#fff;box-shadow:0 4px 15px #0000001a}.shift-summary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:10px}.shift-ship{font-size:24px;font-weight:700}.shift-datetime{font-size:16px;opacity:.9}.shift-summary-details{display:flex;gap:20px;font-size:14px;opacity:.9}.action-section{margin-bottom:30px}.auto-place-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:15px 30px;border-radius:50px;font-size:18px;font-weight:600;cursor:pointer;transition:all .3s;box-shadow:0 4px 15px #667eea66;width:100%;max-width:300px}.auto-place-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.auto-place-btn:disabled{opacity:.6;cursor:not-allowed}.requirements-section{margin-bottom:30px}.requirements-section h2{color:#2c3e50;margin-bottom:20px;font-size:20px}.requirements-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.requirement-card{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 8px #0000001a;transition:all .3s}.requirement-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.requirement-card.full{border-left:4px solid #27ae60}.requirement-card.partial{border-left:4px solid #f39c12}.requirement-card.empty{border-left:4px solid #e74c3c}.requirement-header{padding:12px 15px;display:flex;justify-content:space-between;align-items:center;color:#fff}.role-name{font-weight:600;font-size:16px}.role-priority{background:#fff3;padding:3px 8px;border-radius:4px;font-size:12px}.requirement-stats{padding:15px;display:flex;justify-content:space-around;background:#f8f9fa}.stat{text-align:center}.stat-label{display:block;font-size:11px;color:#7f8c8d;text-transform:uppercase;margin-bottom:4px}.stat-value{font-size:20px;font-weight:600;color:#2c3e50}.progress-bar{height:6px;background:#ecf0f1;width:100%}.deficiencies-section{background:#fff3e0;border-radius:10px;padding:20px;margin-bottom:30px;border-left:4px solid #f39c12}.deficiencies-section h2{color:#e67e22;margin-bottom:15px;font-size:18px;display:flex;align-items:center;gap:8px}.deficiency-list{display:flex;flex-direction:column;gap:10px}.deficiency-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a}.deficiency-role{font-weight:600;color:#2c3e50}.deficiency-count{color:#e67e22;font-weight:600}.quick-fix-btn{background:#3498db;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px;transition:background .3s}.quick-fix-btn:hover{background:#2980b9}.assignments-section{margin-bottom:30px}.assignments-section h2{color:#2c3e50;margin-bottom:20px;font-size:20px}.assignments-list{display:flex;flex-direction:column;gap:10px}.assignment-item{display:flex;align-items:center;gap:15px;padding:12px 15px;background:#fff;border-radius:8px;box-shadow:0 1px 3px #0000001a;flex-wrap:wrap}.assignment-role{padding:4px 12px;border-radius:20px;color:#fff;font-size:12px;font-weight:600;min-width:80px;text-align:center}.assignment-employee{font-weight:600;color:#2c3e50;flex:1}.assignment-status{padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600}.assignment-status.auto{background:#e8f5e9;color:#27ae60}.assignment-status.manual{background:#fff3e0;color:#f39c12}.assignment-status.locked{background:#e8eaf6;color:#3f51b5}.assignment-duty{background:#ecf0f1;padding:3px 8px;border-radius:4px;font-size:11px;color:#34495e}.no-assignments{text-align:center;padding:30px;background:#f8f9fa;border-radius:8px;color:#7f8c8d;font-style:italic}.suggestions-modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.suggestions-content{background:#fff;border-radius:12px;padding:30px;max-width:600px;width:90%;max-height:80vh;overflow-y:auto}.suggestions-content h3{color:#2c3e50;margin-bottom:10px;font-size:24px}.suggestions-subtitle{color:#7f8c8d;margin-bottom:20px}.suggestions-list{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.suggestion-item{display:flex;align-items:center;gap:12px;padding:12px;background:#f8f9fa;border-radius:8px;flex-wrap:wrap}.suggestion-employee{font-weight:600;color:#2c3e50;min-width:150px}.suggestion-role{padding:4px 12px;border-radius:20px;color:#fff;font-size:12px;font-weight:600}.suggestion-reason{color:#7f8c8d;font-size:12px;flex:1}.assign-suggestion-btn{background:#27ae60;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px;transition:background .3s}.assign-suggestion-btn:hover{background:#229954}.close-suggestions-btn{width:100%;padding:12px;background:#e74c3c;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;transition:background .3s}.close-suggestions-btn:hover{background:#c0392b}@media(max-width:768px){.requirements-grid{grid-template-columns:1fr}.shift-selector{flex-direction:column;align-items:stretch}.shift-selector select{min-width:auto}.shift-summary-header,.assignment-item,.suggestion-item{flex-direction:column;align-items:flex-start}}.phase-selector-section{margin:2rem 0}.phase-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1rem}.phase-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 2px 8px #0000001a;cursor:pointer;transition:all .2s;border:2px solid transparent}.phase-card.selected{border-color:#3498db;transform:scale(1.02);box-shadow:0 4px 12px #3498db33}.phase-card.active:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.phase-card.locked{opacity:.6;cursor:not-allowed;background:#f8fafc}.phase-card.disabled{opacity:.6;cursor:not-allowed;filter:grayscale(.5)}.phase-card.disabled:hover{transform:none;box-shadow:0 2px 8px #0000001a}.status-locked{color:#7f8c8d;font-size:12px;font-weight:500}.phase-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.phase-name{font-weight:600;font-size:1.1rem;color:#2c3e50}.phase-count{font-weight:600;color:#3498db}.phase-progress{height:8px;background:#ecf0f1;border-radius:4px;overflow:hidden;margin-bottom:1rem}.phase-status{font-size:.9rem}.status-full{color:#27ae60}.status-need{color:#e67e22}.status-locked{color:#7f8c8d;font-style:italic}.total-progress-section{margin:2rem 0;padding:1.5rem;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.progress-bar-large{height:12px;background:#ecf0f1;border-radius:6px;overflow:hidden;margin-top:.5rem}.assignment-phase{padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500}.phase-debark{background:#e1f5fe;color:#0288d1}.phase-embark{background:#fff3e0;color:#f57c00}.phase-unknown{background:#f0f0f0;color:#7f8c8d}@media(max-width:768px){.phase-cards{grid-template-columns:1fr;gap:1rem}}.assignments-container{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}.search-header{padding:12px;background:#f9fafb;border-bottom:1px solid #e5e7eb;display:flex;gap:8px}.search-input{flex:1;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px}.clear-search{padding:8px 12px;background:#fff;border:1px solid #d1d5db;border-radius:6px;cursor:pointer}.assignment-group{border-bottom:1px solid #e5e7eb}.assignment-group:last-child{border-bottom:none}.status-confirmed,.status-auto{background:#e6f7e6;color:#166534}.status-manual{background:#e6f0ff;color:#1e40af}.status-locked{background:#f3f4f6;color:#4b5563}.remove-button{width:24px;height:24px;border-radius:4px;border:1px solid #e5e7eb;background:#fff;color:#ef4444;font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .2s}.remove-button:hover:not(:disabled){background:#fee2e2;border-color:#ef4444}.remove-button:disabled{opacity:.5;cursor:not-allowed}.remove-hint{font-size:11px;color:#6b7280;margin-left:8px;font-style:italic}.group-header{padding:12px 16px;background:#fff;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background .2s}.group-header:hover{background:#f3f4f6}.group-title{display:flex;align-items:center;gap:8px}.expand-icon{font-size:12px;transition:transform .2s;color:#6b7280}.expand-icon.expanded{transform:rotate(90deg)}.group-title h3{margin:0;font-size:14px;font-weight:500;color:#374151}.count-badge{padding:2px 8px;border-radius:12px;font-size:12px;font-weight:500}.badge-blue{background:#e6f0ff;color:#1e40af}.badge-green{background:#e6f7e6;color:#166534}.badge-purple{background:#f3e8ff;color:#6b21a8}.badge-orange{background:#fff3e6;color:#9a3412}.assignment-count{font-size:12px;color:#6b7280}.group-content{padding:8px 16px 16px 32px;background:#fafafa}.phase-badge{padding:2px 6px;border-radius:4px;font-size:10px;font-weight:500;margin-left:4px}.phase-debark{background:#e6f0ff;color:#1e40af}.phase-embark{background:#e6f7e6;color:#166534}.assignment-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid #f0f0f0}.assignment-row:last-child{border-bottom:none}.employee-name{flex:1;font-size:13px;color:#1f2937}.status-badge{padding:2px 6px;border-radius:4px;font-size:11px;font-weight:500}.status-confirmed{background:#e6f7e6;color:#166534}.status-pending{background:#fff3e6;color:#9a3412}.status-unknown{background:#f3f4f6;color:#4b5563}.auto-badge{padding:2px 4px;background:#e0f2fe;color:#0369a1;border-radius:4px;font-size:10px;font-weight:500}.no-results{padding:24px;text-align:center;color:#6b7280;font-size:14px}.empty-group{padding:12px;text-align:center;color:#9ca3af;font-size:13px;font-style:italic}.employee-schedule{max-width:900px;margin:2rem auto;padding:0 1rem;font-family:inherit}.employee-header{display:flex;align-items:center;gap:1rem;background:#1e2a3a;color:#fff;padding:1.25rem 1.5rem;border-radius:10px;margin-bottom:1.5rem;box-shadow:0 2px 8px #00000026}.employee-avatar{width:52px;height:52px;border-radius:50%;background:#3b82f6;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;color:#fff;flex-shrink:0}.employee-info h2{margin:0 0 .25rem;font-size:1.1rem;font-weight:600}.role-badge{display:inline-block;padding:.2rem .6rem;border-radius:20px;font-size:.75rem;font-weight:600;color:#fff}.week-nav{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:.75rem 1rem;margin-bottom:1.25rem;box-shadow:0 1px 4px #0000000f}.week-nav button{background:#1e2a3a;color:#fff;border:none;padding:.4rem .9rem;border-radius:6px;cursor:pointer;font-size:.85rem;font-weight:500;transition:background .2s}.week-nav button:hover{background:#2d3f55}.week-label{font-weight:600;font-size:.95rem;color:#1e2a3a}.schedule-grid{display:flex;flex-direction:column;gap:.75rem}.day-card{background:#fff;border:1px solid #e2e8f0;border-radius:10px;padding:1rem 1.25rem;cursor:pointer;transition:box-shadow .2s,border-color .2s;box-shadow:0 1px 4px #0000000d}.day-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#3b82f6}.day-card.today{border-left:4px solid #3b82f6;background:#f0f7ff}.day-header{display:flex;align-items:baseline;gap:.5rem;margin-bottom:.4rem}.weekday{font-weight:700;font-size:.95rem;color:#1e2a3a;text-transform:uppercase;letter-spacing:.04em}.day-date{font-size:.85rem;color:#64748b}.shift-count{font-size:.78rem;color:#94a3b8;margin-bottom:.5rem}.shift-preview{display:flex;flex-wrap:wrap;gap:.4rem}.shift-pill{display:flex;gap:.35rem;background:#1e2a3a;color:#fff;padding:.25rem .6rem;border-radius:20px;font-size:.78rem;font-weight:500}.more-shifts{font-size:.78rem;color:#3b82f6;font-weight:600;align-self:center}.shift-details{margin-top:1rem;border-top:1px solid #e2e8f0;padding-top:1rem;display:flex;flex-direction:column;gap:.75rem}.shift-card{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:.9rem 1rem}.shift-card h4{margin:0 0 .2rem;font-size:.95rem;color:#1e2a3a}.shift-time{font-size:.85rem;color:#64748b;margin:0 0 .6rem}.shift-meta{display:flex;flex-direction:column;gap:.4rem}.shift-meta div{display:flex;align-items:center;gap:.5rem;font-size:.85rem;color:#475569}.shift-meta div span:first-child{width:80px;color:#94a3b8;font-size:.8rem}.duty-badge{display:inline-block;padding:.15rem .55rem;border-radius:20px;font-size:.75rem;font-weight:600;color:#fff}.duty-changed{margin-top:.5rem;font-size:.8rem;color:#f59e0b;font-weight:500}.shift-notes{margin-top:.4rem;font-size:.82rem;color:#64748b;font-style:italic}.today-focus{background:#1e2a3a;color:#fff;border-radius:10px;padding:1rem 1.25rem;margin-top:1.25rem}.today-focus h3{margin:0 0 .75rem;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em;color:#94a3b8}.today-shift{display:flex;align-items:center;gap:.75rem;margin-bottom:.5rem}.ship-abbr{background:#3b82f6;color:#fff;padding:.2rem .5rem;border-radius:5px;font-size:.8rem;font-weight:700}.loading{text-align:center;padding:3rem;color:#94a3b8;font-size:.95rem}.empty-state{text-align:center;padding:3rem;color:#94a3b8;background:#fff;border-radius:10px;border:1px dashed #e2e8f0}.empty-state p:first-child{font-size:1rem;font-weight:600;color:#475569;margin-bottom:.4rem}@media(max-width:600px){.employee-schedule{margin:1rem auto}.week-nav{flex-direction:column;gap:.5rem;text-align:center}.shift-meta div{flex-wrap:wrap}}.history-container{max-width:1200px;margin:0 auto;padding:20px}.history-header{margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #ecf0f1}.history-header h1{margin:0;color:#2c3e50;font-size:32px;display:flex;align-items:center;gap:10px}.history-subtitle{color:#7f8c8d;font-size:14px;margin-top:5px}.history-filters{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:15px;background:#fff;padding:15px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.filter-buttons{display:flex;gap:10px;flex-wrap:wrap}.filter-btn{padding:8px 16px;border:2px solid #e0e0e0;background:#fff;color:#34495e;border-radius:30px;cursor:pointer;font-size:13px;font-weight:600;transition:all .3s}.filter-btn:hover{border-color:#3498db;color:#3498db}.filter-btn.active{background:#3498db;border-color:#3498db;color:#fff}.search-box{flex:1;max-width:300px}.search-box input{width:100%;padding:8px 15px;border:2px solid #e0e0e0;border-radius:30px;font-size:14px;transition:all .3s}.search-box input:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.assignments-timeline{display:flex;flex-direction:column;gap:12px}.assignment-card{background:#fff;border-radius:12px;padding:16px;box-shadow:0 2px 4px #0000001a;cursor:pointer;transition:all .3s;border-left:4px solid transparent}.assignment-card:hover{transform:translate(5px);box-shadow:0 4px 12px #00000026;border-left-color:#3498db}.assignment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:10px}.assignment-employee-info{display:flex;align-items:center;gap:10px}.employee-name{font-weight:600;color:#2c3e50;font-size:16px}.assignment-ship{background:#ecf0f1;padding:4px 8px;border-radius:4px;font-size:12px;color:#34495e}.assignment-date{color:#7f8c8d;font-size:13px}.assignment-duty{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.duty-badge{padding:6px 12px;border-radius:20px;color:#fff;font-size:13px;font-weight:600}.view-history-btn{background:none;border:none;color:#3498db;font-size:13px;font-weight:600;cursor:pointer;padding:5px 10px;border-radius:4px;transition:all .3s}.view-history-btn:hover{background:#f0f7ff;text-decoration:underline}.history-modal{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:16px;width:90%;max-width:700px;max-height:80vh;overflow-y:auto;box-shadow:0 20px 40px #0003}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 25px;border-bottom:1px solid #ecf0f1;background:#f8f9fa;border-radius:16px 16px 0 0}.modal-header h2{margin:0;color:#2c3e50;font-size:20px}.close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#7f8c8d;transition:color .3s}.close-btn:hover{color:#e74c3c}.modal-body{padding:25px}.assignment-summary{background:#f8f9fa;border-radius:12px;padding:15px;margin-bottom:25px}.summary-row{display:flex;margin-bottom:8px;flex-wrap:wrap}.summary-label{width:100px;color:#7f8c8d;font-weight:500}.summary-value{flex:1;color:#2c3e50;font-weight:500}.current-duty-badge{display:inline-block;padding:4px 12px;border-radius:20px;color:#fff;font-size:13px;font-weight:600}.timeline{position:relative;padding-left:30px}.timeline-item{position:relative;margin-bottom:30px}.timeline-marker{position:absolute;left:-30px;top:0;width:20px;height:100%;display:flex;flex-direction:column;align-items:center}.marker-dot{width:12px;height:12px;background:#3498db;border-radius:50%;border:2px solid white;box-shadow:0 0 0 2px #3498db;z-index:2}.marker-line{width:2px;background:#e0e0e0;flex:1;margin:4px 0}.timeline-content{background:#f8f9fa;border-radius:12px;padding:15px}.change-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;flex-wrap:wrap;gap:8px}.change-time{color:#7f8c8d;font-size:13px}.changed-by{background:#ecf0f1;padding:3px 8px;border-radius:4px;font-size:12px;color:#34495e}.change-duties{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}.old-duty{padding:4px 8px;background:#ecf0f1;border-radius:4px;color:#7f8c8d;font-size:13px;text-decoration:line-through}.arrow{color:#7f8c8d;font-size:16px}.new-duty{padding:4px 12px;border-radius:20px;color:#fff;font-size:13px;font-weight:600}.change-reason{background:#fff3e0;padding:10px;border-radius:8px;margin-bottom:10px}.reason-label{font-weight:600;color:#e67e22;margin-right:8px}.reason-text{color:#2c3e50;font-size:13px}.supervisor-notes{background:#e8f4f8;padding:12px;border-radius:8px}.notes-label{display:block;font-weight:600;color:#2980b9;margin-bottom:5px}.notes-text{margin:0;color:#2c3e50;font-size:13px;font-style:italic}.no-data{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #0000001a}.no-data p{color:#2c3e50;font-size:18px;margin-bottom:10px}.no-data .subtitle{color:#7f8c8d;font-size:14px}.no-history{text-align:center;padding:30px;color:#7f8c8d;font-style:italic}.modal-footer{padding:15px 25px;border-top:1px solid #ecf0f1;text-align:right}.close-modal-btn{padding:8px 24px;background:#3498db;color:#fff;border:none;border-radius:30px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s}.close-modal-btn:hover{background:#2980b9;transform:translateY(-2px)}.loading{text-align:center;padding:60px 20px;color:#7f8c8d;font-size:16px}@media(max-width:768px){.history-filters{flex-direction:column;align-items:stretch}.search-box{max-width:none}.assignment-header,.change-header{flex-direction:column;align-items:flex-start}.modal-content{width:95%;max-height:90vh}}.budget-container{max-width:1400px;margin:0 auto;padding:20px}.budget-header{margin-bottom:30px;padding-bottom:15px;border-bottom:2px solid #ecf0f1}.budget-header h1{margin:0;color:#2c3e50;font-size:32px;display:flex;align-items:center;gap:10px}.budget-subtitle{color:#7f8c8d;font-size:14px;margin-top:5px}.budget-controls{display:flex;gap:15px;margin-bottom:30px;flex-wrap:wrap;background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.date-selector{display:flex;gap:10px}.month-select,.year-select,.ship-select{padding:10px 15px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;background:#fff;cursor:pointer;min-width:120px}.month-select:focus,.year-select:focus,.ship-select:focus{outline:none;border-color:#3498db}.new-sheet-btn{background:#27ae60;color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s;margin-left:auto}.new-sheet-btn:hover{background:#229954;transform:translateY(-2px)}.budget-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px}.budget-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 4px 12px #0000001a;cursor:pointer;transition:all .3s;position:relative;overflow:hidden}.budget-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #00000026}.card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}.card-header-actions{display:flex;gap:8px;align-items:center}.ship-name{font-weight:700;font-size:18px;color:#2c3e50;margin-right:8px}.ship-abbr{background:#ecf0f1;padding:3px 8px;border-radius:4px;font-size:12px;color:#34495e}.status-badge{padding:4px 12px;border-radius:20px;color:#fff;font-size:11px;font-weight:600;white-space:nowrap}.status-badge.large{padding:6px 16px;font-size:13px}.card-month{color:#7f8c8d;font-size:14px;margin-bottom:15px}.card-stats{display:flex;justify-content:space-between;margin-bottom:15px;padding:10px;background:#f8f9fa;border-radius:8px}.stat-row{display:flex;flex-direction:column;align-items:center}.stat-label{font-size:11px;color:#7f8c8d;text-transform:uppercase}.stat-value{font-size:16px;font-weight:600;color:#2c3e50}.card-costs{display:flex;justify-content:space-between;margin-bottom:15px;padding:10px;background:#e8f4f8;border-radius:8px}.cost-row{display:flex;flex-direction:column;align-items:center}.cost-row span:first-child{font-size:11px;color:#2980b9;text-transform:uppercase}.cost-row span:last-child{font-size:16px;font-weight:600;color:#2c3e50}.card-variance{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding:8px;background:#f8f9fa;border-radius:8px;font-weight:600}.progress-bar{height:6px;background:#ecf0f1;border-radius:3px;overflow:hidden}.card-delete-btn{width:32px;height:32px;border:none;border-radius:6px;background:#fff;color:#ef4444;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;border:1px solid #e5e7eb}.card-delete-btn:hover:not(:disabled){background:#fee2e2;border-color:#ef4444}.card-delete-btn:disabled{opacity:.5;cursor:not-allowed}.budget-detail{background:#fff;border-radius:16px;padding:30px;box-shadow:0 4px 12px #0000001a}.back-btn{background:none;border:none;color:#3498db;font-size:14px;font-weight:600;cursor:pointer;padding:5px 10px;margin-bottom:20px;display:inline-flex;align-items:center;gap:5px}.back-btn:hover{text-decoration:underline}.detail-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:15px}.detail-header h2{margin:0 0 10px;color:#2c3e50;font-size:24px}.header-actions{display:flex;gap:10px;flex-wrap:wrap}.edit-btn,.export-btn,.approve-btn,.delete-btn{padding:8px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:80px;height:36px;line-height:1;white-space:nowrap}.edit-btn{background:#3498db;color:#fff}.edit-btn:hover:not(:disabled){background:#2980b9}.export-btn{background:#27ae60;color:#fff}.export-btn:hover:not(:disabled){background:#229954}.approve-btn{background:#f39c12;color:#fff}.approve-btn:hover:not(:disabled){background:#e67e22}.delete-btn{background:#e74c3c;color:#fff}.delete-btn:hover:not(:disabled){background:#c0392b}.edit-btn:disabled,.export-btn:disabled,.approve-btn:disabled,.delete-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:30px}.summary-card{background:#f8f9fa;border-radius:12px;padding:20px;text-align:center;border-left:4px solid #3498db}.summary-card.variance{border-left-color:#f39c12}.summary-label{display:block;font-size:12px;color:#7f8c8d;text-transform:uppercase;margin-bottom:8px}.summary-value{font-size:24px;font-weight:600;color:#2c3e50}.variance-direction{font-size:14px;margin-left:5px}.roles-table-container{margin-top:30px}.roles-table-container h3{color:#2c3e50;margin-bottom:15px;font-size:18px}.roles-table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #0000001a}.roles-table th{background:#2c3e50;color:#fff;padding:12px;text-align:left;font-size:13px;font-weight:600}.roles-table td{padding:12px;border-bottom:1px solid #ecf0f1;color:#34495e}.roles-table tr:last-child td{border-bottom:none}.roles-table tr:hover td{background:#f8f9fa}.role-name{font-weight:600;color:#2c3e50}.variance-cell{font-weight:600}.no-data{text-align:center;padding:60px 20px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #0000001a;grid-column:1 / -1}.no-data p{color:#2c3e50;font-size:18px;margin-bottom:20px}.create-first-btn{background:#3498db;color:#fff;border:none;padding:12px 30px;border-radius:30px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s}.create-first-btn:hover{background:#2980b9;transform:translateY(-2px)}.loading{text-align:center;padding:60px 20px;color:#7f8c8d;font-size:18px}@media(max-width:768px){.budget-controls,.date-selector{flex-direction:column}.new-sheet-btn{margin-left:0}.budget-cards,.summary-cards{grid-template-columns:1fr}.roles-table{display:block;overflow-x:auto}.detail-header{flex-direction:column;align-items:flex-start}.header-actions{width:100%;flex-direction:column}.header-actions button{width:100%}}.create-shift-container{max-width:600px;margin:2rem auto;padding:2rem;background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a}.create-shift-container h1{margin-bottom:1.5rem;color:#2c3e50;font-size:1.8rem}.error-alert{background:#f8d7da;color:#721c24;padding:.75rem;border-radius:8px;margin-bottom:1.5rem;border:1px solid #f5c6cb}.form-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:1rem}.cancel-btn{padding:.75rem 1.5rem;background:#95a5a6;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:background .2s}.cancel-btn:hover{background:#7f8c8d}.submit-btn{padding:.75rem 1.5rem;background:#27ae60;color:#fff;border:none;border-radius:8px;cursor:pointer;font-weight:600;transition:background .2s}.submit-btn:hover:not(:disabled){background:#219a52}.submit-btn:disabled{opacity:.5;cursor:not-allowed}@media(max-width:768px){.create-shift-container{margin:1rem;padding:1rem}.form-row{grid-template-columns:1fr}}.edit-shift-container{max-width:600px;margin:2rem auto;padding:2rem;background:#fff;border-radius:12px;box-shadow:0 4px 12px #0000001a}.edit-shift-container .page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.edit-shift-container h1{margin:0;color:#2c3e50}.shift-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:#2c3e50}.form-group input,.form-group select,.form-group textarea{padding:.75rem;border:1px solid #e0e0e0;border-radius:8px;font-size:1rem;font-family:inherit}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.form-actions{display:flex;justify-content:flex-end;margin-top:1rem}.alert-error{background:#f8d7da;color:#721c24;padding:1rem;border-radius:8px;margin-bottom:1.5rem;border:1px solid #f5c6cb}@media(max-width:768px){.edit-shift-container{margin:1rem;padding:1rem}.form-row{grid-template-columns:1fr}}.requirements-container{max-width:800px;margin:2rem auto;padding:2rem}.requirements-container .page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.requirements-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 4px 12px #0000001a}.requirements-card h2{margin-bottom:1.5rem;color:#2c3e50}.requirements-list{margin-bottom:2rem;border:1px solid #ecf0f1;border-radius:8px;overflow:hidden}.no-requirements{padding:2rem;text-align:center;color:#7f8c8d;background:#f8fafc}.requirement-item{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid #ecf0f1;background:#fff}.requirement-item:last-child{border-bottom:none}.requirement-info{display:flex;gap:1rem;align-items:center}.requirement-phase{font-weight:600;color:#3498db}.requirement-role{color:#2c3e50}.requirement-controls{display:flex;gap:1rem;align-items:center}.requirement-count{width:80px;padding:.5rem;border:1px solid #e0e0e0;border-radius:4px;text-align:center}.requirement-assigned{color:#7f8c8d;font-size:.9rem}.remove-btn{background:none;border:none;font-size:1.2rem;cursor:pointer;opacity:.5;transition:opacity .2s}.remove-btn:hover{opacity:1}.add-requirement{margin-bottom:2rem;padding:1.5rem;background:#f8fafc;border-radius:8px}.add-requirement h3{margin-bottom:1rem;color:#2c3e50}.add-requirement-form{display:grid;grid-template-columns:1fr 1fr 100px auto;gap:1rem;align-items:start}.form-actions{display:flex;justify-content:flex-end}@media(max-width:768px){.requirements-container{padding:1rem;margin:1rem}.requirements-card{padding:1rem}.requirement-item{flex-direction:column;gap:.5rem;align-items:flex-start}.requirement-controls{width:100%;justify-content:space-between}.add-requirement-form{grid-template-columns:1fr}}.edit-budget-container{max-width:1200px;margin:2rem auto;padding:2rem}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.page-header h1{margin:0;color:#2c3e50}.page-header .subtitle{color:#7f8c8d;margin-top:.25rem}.header-actions{display:flex;gap:1rem}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}.summary-card{background:#fff;padding:1.5rem;border-radius:8px;box-shadow:0 2px 8px #0000001a}.summary-label{display:block;color:#7f8c8d;font-size:.9rem;margin-bottom:.5rem}.summary-value{display:block;font-size:1.5rem;font-weight:700;color:#2c3e50}.staffing-table-container{background:#fff;border-radius:8px;padding:1.5rem;box-shadow:0 2px 8px #0000001a}.table-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.table-header h2{margin:0;color:#2c3e50}.staffing-table{width:100%;border-collapse:collapse}.staffing-table th{text-align:left;padding:.75rem;background:#f8fafc;color:#5a6a7e;font-weight:600;font-size:.85rem;text-transform:uppercase}.staffing-table td{padding:.75rem;border-bottom:1px solid #ecf0f1}.staffing-table tbody tr:hover{background:#f8fafc}.staffing-table tbody tr.new-row{background:#e8f5e9}.staffing-table input[type=number]{width:100px;padding:.5rem;border:1px solid #e0e0e0;border-radius:4px}.staffing-table select{width:150px;padding:.5rem;border:1px solid #e0e0e0;border-radius:4px}.staffing-table tfoot{background:#f8fafc;font-weight:700}.staffing-table tfoot td{padding-top:1rem;border-top:2px solid #ecf0f1}.text-right{text-align:right}.delete-btn{background:none;border:none;font-size:1.2rem;cursor:pointer;opacity:.5;transition:opacity .2s}.delete-btn:hover{opacity:1}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:8px;padding:2rem;width:90%;max-width:500px;max-height:90vh;overflow-y:auto}.modal-content h3{margin-bottom:1.5rem;color:#2c3e50}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:500;color:#2c3e50}.modal-actions{display:flex;justify-content:flex-end;gap:1rem;margin-top:1.5rem}.error-alert{background:#f8d7da;color:#721c24;padding:1rem;border-radius:8px;margin:2rem auto;max-width:600px;text-align:center}.loading{text-align:center;padding:2rem;color:#7f8c8d}.no-data{text-align:center;padding:2rem;color:#7f8c8d;font-style:italic}@media(max-width:768px){.edit-budget-container{padding:1rem}.staffing-table{font-size:.9rem}.staffing-table input[type=number],.staffing-table select{width:80px}.form-row{grid-template-columns:1fr}}.reports-container{padding:24px;max-width:1400px;margin:0 auto}.reports-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.reports-header h1{margin:0;color:#2c3e50;font-size:28px}.refresh-btn{padding:8px 16px;background:#fff;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.refresh-btn:hover{background:#f3f4f6}.filters-card{background:#fff;border-radius:12px;padding:20px;margin-bottom:24px;box-shadow:0 2px 8px #0000001a}.filters-card h3{margin:0 0 16px;color:#374151;font-size:16px;font-weight:600}.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:20px}.filter-group{display:flex;flex-direction:column;gap:6px}.filter-group label{font-size:13px;font-weight:500;color:#4b5563}.date-range{display:flex;align-items:center;gap:8px}.date-input,.filter-select{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;flex:1}.date-input:focus,.filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.filter-actions{display:flex;gap:12px;justify-content:flex-end;border-top:1px solid #e5e7eb;padding-top:20px}.run-report-btn,.export-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.run-report-btn{background:#3b82f6;color:#fff}.run-report-btn:hover:not(:disabled){background:#2563eb}.export-btn{background:#10b981;color:#fff}.export-btn:hover:not(:disabled){background:#059669}.run-report-btn:disabled,.export-btn:disabled{opacity:.5;cursor:not-allowed}.summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:24px}.stat-card{background:#fff;border-radius:12px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 8px #0000001a;transition:transform .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.stat-icon{font-size:32px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:#f3f4f6;border-radius:12px}.stat-content{flex:1;display:flex;flex-direction:column}.stat-label{font-size:13px;color:#6b7280;margin-bottom:4px}.stat-value{font-size:24px;font-weight:600;color:#1f2937}.tabs{display:flex;gap:8px;margin-bottom:24px;border-bottom:2px solid #e5e7eb;padding-bottom:8px}.tab{padding:8px 16px;background:none;border:none;border-radius:6px;font-size:14px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s}.tab:hover{background:#f3f4f6;color:#374151}.tab.active{background:#3b82f6;color:#fff}.summary-view{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}.summary-card{padding:20px;background:#f9fafb;border-radius:8px}.summary-card h4{margin:0 0 16px;color:#374151;font-size:16px;font-weight:600}.breakdown-item{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;font-size:14px;color:#4b5563}.breakdown-value{font-weight:600;color:#1f2937}.progress-bar{height:8px;background:#e5e7eb;border-radius:4px;margin-bottom:16px;overflow:hidden}.progress-fill{height:100%;transition:width .3s ease}.phase-debark{background:#3b82f6}.phase-embark{background:#10b981}.list-view{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.results-header h3{margin:0;color:#374151;font-size:18px;font-weight:600}.record-count{font-size:13px;color:#6b7280;background:#f3f4f6;padding:4px 10px;border-radius:20px}.table-container{overflow-x:auto;border-radius:8px;border:1px solid #e5e7eb}.report-table{width:100%;border-collapse:collapse;font-size:14px}.report-table th{background:#f9fafb;padding:12px;text-align:left;font-weight:600;color:#374151;border-bottom:2px solid #e5e7eb}.report-table td{padding:12px;border-bottom:1px solid #e5e7eb;color:#4b5563}.report-table tr:hover{background:#f9fafb}.ship-badge{background:#e5e7eb;padding:4px 8px;border-radius:4px;font-weight:500;font-size:12px}.phase-badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.phase-debark{background:#dbeafe;color:#1e40af}.phase-embark{background:#d1fae5;color:#065f46}.status-badge{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:500}.status-auto{background:#e0f2fe;color:#0369a1}.status-manual{background:#fef3c7;color:#92400e}.charts-view{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #0000001a}.charts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:24px}.chart-card{padding:20px;background:#f9fafb;border-radius:8px}.chart-card h4{margin:0 0 16px;color:#374151;font-size:16px;font-weight:600}.bar-chart{display:flex;flex-direction:column;gap:12px}.chart-row{display:flex;align-items:center;gap:12px}.chart-label{width:100px;font-size:13px;color:#4b5563}.chart-bar-container{flex:1;height:24px;background:#e5e7eb;border-radius:12px;position:relative;overflow:hidden}.chart-bar{height:100%;border-radius:12px;transition:width .3s ease}.chart-value{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:600;color:#1f2937;text-shadow:0 1px 2px rgba(255,255,255,.5)}.simple-chart-placeholder{display:flex;justify-content:center;align-items:center;min-height:200px}.pie-placeholder{width:150px;height:150px;border-radius:50%;background:conic-gradient(#27ae60 0deg 277deg,#e74c3c 277deg 360deg);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.no-data{text-align:center;padding:60px 20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.no-data-icon{font-size:64px;margin-bottom:16px;opacity:.5}.no-data h3{margin:0 0 8px;color:#374151;font-size:20px}.no-data p{margin:0 0 24px;color:#6b7280}.user-management-container{max-width:1400px;margin:0 auto;padding:2rem}.user-management-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.user-management-header h1{margin:0;color:#2c3e50;font-size:1.8rem}.stats-badge{background:#f8fafc;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;color:#2c3e50;font-weight:500}.alert{padding:.75rem 1rem;border-radius:8px;margin-bottom:1.5rem}.alert-success{background:#d4edda;color:#155724;border-left:4px solid #27ae60}.alert-error{background:#f8d7da;color:#721c24;border-left:4px solid #e74c3c}.filters-bar{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.search-box{flex:2;min-width:250px}.filter-box{flex:1;min-width:150px}.form-control{width:100%;padding:.75rem 1rem;border:1px solid #e0e0e0;border-radius:8px;font-size:.9rem;transition:all .2s}.form-control:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a}.loading-state{text-align:center;padding:3rem;color:#7f8c8d}.table-container{overflow-x:auto;border-radius:12px;border:1px solid #ecf0f1;background:#fff}.data-table{width:100%;border-collapse:collapse}.data-table th{text-align:left;padding:1rem;background:#f8fafc;color:#5a6a7e;font-weight:600;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #ecf0f1}.data-table td{padding:1rem;border-bottom:1px solid #ecf0f1;vertical-align:middle}.data-table tr:hover td{background:#f8fafc}.current-row{background:#fff8e7}.user-name-cell{font-weight:500;color:#2c3e50}.badge{display:inline-block;padding:.2rem .5rem;border-radius:12px;font-size:.7rem;font-weight:500}.badge-info{background:#e0e0e0;color:#5a6a7e;margin-left:.5rem}.role-badge{display:inline-block;padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:600;color:#fff;text-transform:capitalize}.role-select{padding:.5rem;border-radius:6px;border:2px solid;background:#fff;font-size:.85rem;cursor:pointer;transition:all .2s}.role-select:focus{outline:none;box-shadow:0 0 0 2px #3498db33}.role-select:disabled{opacity:.5;cursor:not-allowed}.saving-text{margin-left:.5rem;font-size:.7rem;color:#3498db}.date-cell{color:#95a5a6;font-size:.85rem}.text-center{text-align:center}.pagination{display:flex;justify-content:center;align-items:center;gap:1rem;margin-top:2rem}.btn{padding:.5rem 1rem;border-radius:6px;font-size:.85rem;cursor:pointer;transition:all .2s}.btn-outline{background:#fff;border:1px solid #e0e0e0}.btn-outline:hover:not(:disabled){background:#3498db;color:#fff;border-color:#3498db}.btn-outline:disabled{opacity:.5;cursor:not-allowed}.page-info{font-size:.9rem;color:#7f8c8d}.role-legend{margin-top:2rem;padding:1rem;background:#f8fafc;border-radius:12px}.role-legend h4{margin:0 0 .75rem;font-size:.9rem;color:#2c3e50}.legend-grid{display:flex;flex-wrap:wrap;gap:1.5rem}.legend-item{display:flex;align-items:center;gap:.5rem;font-size:.85rem;flex-wrap:wrap}.legend-dot{width:10px;height:10px;border-radius:50%}.legend-role{font-weight:600;color:#2c3e50}.legend-desc{color:#7f8c8d;font-size:.75rem}@media(max-width:768px){.user-management-container{padding:1rem}.user-management-header{flex-direction:column;align-items:flex-start}.filters-bar{flex-direction:column}.data-table th:nth-child(4),.data-table td:nth-child(4),.data-table th:nth-child(5),.data-table td:nth-child(5){display:none}.legend-grid{flex-direction:column;gap:.5rem}}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background-color:#f5f5f5}.App{min-height:100vh}.main-nav{background:#2c3e50;padding:1rem 2rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.nav-brand{color:#fff;font-size:1.5rem;font-weight:700;letter-spacing:1px}.nav-links{display:flex;flex-direction:row;gap:1rem;flex-wrap:wrap}.main-nav a{color:#fff;text-decoration:none;font-weight:500;padding:.5rem 1rem;border-radius:4px;transition:all .3s;white-space:nowrap}.main-nav a:hover{background:#34495e;transform:translateY(-2px)}.main-nav a.active{background:#3498db}@media(max-width:768px){.main-nav{flex-direction:row;align-items:stretch;text-align:center}.nav-links{justify-content:center}}.unauthorized{text-align:center;padding:60px 20px;max-width:500px;margin:0 auto}.unauthorized h1{font-size:48px;color:#e74c3c;margin-bottom:20px}.unauthorized p{color:#7f8c8d;margin-bottom:30px;font-size:18px}.unauthorized a{display:inline-block;padding:12px 30px;background:#3498db;color:#fff;text-decoration:none;border-radius:30px;font-weight:600;transition:all .3s}.unauthorized a:hover{background:#2980b9;transform:translateY(-2px)}.nav-user{display:flex;align-items:center;gap:15px}.user-email{color:#fff;font-size:14px;background:#ffffff1a;padding:5px 10px;border-radius:20px}.logout-btn{background:#e74c3c;color:#fff;border:none;padding:5px 15px;border-radius:20px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s}.logout-btn:hover{background:#c0392b;transform:translateY(-2px)}:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;line-height:1.5;font-weight:400}body{margin:0;min-width:320px;min-height:100vh;background-color:#f5f5f5}*{margin:0;padding:0;box-sizing:border-box}