*{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;min-height:100%}body{color:#1f2937;background:#f5f7fb;font-family:Arial,Helvetica,sans-serif}button,input{font-family:inherit}button{cursor:pointer}.app{background:#f5f7fb;width:100%;min-height:100vh;display:flex}.sidebar{background:#fff;border-right:1px solid #e5e7eb;flex-direction:column;width:250px;min-width:250px;min-height:100vh;padding:24px 14px;display:flex}.sidebar-logo{border-bottom:1px solid #f0f0f0;align-items:center;gap:12px;margin-bottom:20px;padding:4px 10px 28px;display:flex}.logo-icon{color:#fff;background:#2563eb;border-radius:9px;justify-content:center;align-items:center;width:40px;height:40px;font-size:13px;font-weight:700;display:flex}.logo-text{color:#111827;font-size:15px;font-weight:700;line-height:1.3}.sidebar-menu{flex-direction:column;gap:5px;display:flex}.menu-item{color:#6b7280;border-radius:8px;align-items:center;gap:12px;width:100%;padding:12px 13px;font-size:14px;text-decoration:none;transition:all .2s;display:flex}.menu-item:hover{color:#2563eb;background:#f1f5ff}.menu-item.active{color:#2563eb;background:#eaf1ff;font-weight:600}.main-area{flex:1;min-width:0;min-height:100vh}.navbar{background:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;width:100%;height:72px;padding:0 30px;display:flex}.search-box{color:#9ca3af;background:#f8fafc;border:1px solid #e5e7eb;border-radius:8px;align-items:center;gap:9px;width:320px;height:40px;padding:0 12px;display:flex}.search-box input{color:#374151;background:0 0;border:none;outline:none;width:100%;font-size:13px}.navbar-right{align-items:center;gap:22px;display:flex}.notification-btn{color:#6b7280;background:0 0;border:none;justify-content:center;align-items:center;width:36px;height:36px;display:flex;position:relative}.notification-dot{background:#ef4444;border-radius:50%;width:7px;height:7px;position:absolute;top:5px;right:5px}.profile{align-items:center;gap:10px;display:flex}.profile-info{flex-direction:column;gap:2px;display:flex}.main-content{width:100%;padding:30px}.dashboard{width:100%;max-width:1600px;margin:0 auto}.page-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.page-header h1{color:#111827;margin-bottom:7px;font-size:26px;font-weight:700}.page-header p{color:#6b7280;font-size:13px}.primary-btn{color:#fff;background:#2563eb;border:none;border-radius:8px;align-items:center;gap:7px;padding:11px 17px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:22px;display:grid}.stat-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:15px;padding:20px;display:flex}.stat-icon{color:#2563eb;background:#eff6ff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:46px;height:46px;display:flex}.stat-card span{color:#6b7280;font-size:12px}.stat-card h2{color:#111827;margin:4px 0;font-size:23px}.stat-card p{color:#22c55e;font-size:11px}.content-grid{grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:20px;display:grid}.section-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:22px}.section-header{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.section-header h2{color:#111827;margin-bottom:5px;font-size:17px}.section-header p{color:#9ca3af;font-size:12px}.view-btn{color:#2563eb;background:0 0;border:none;font-size:12px;font-weight:600}.training-list{flex-direction:column;display:flex}.training-item{border-bottom:1px solid #f0f0f0;align-items:center;gap:15px;width:100%;padding:15px 0;display:flex}.training-item:last-child{border-bottom:none}.training-date{color:#2563eb;background:#eff6ff;border-radius:8px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:52px;display:flex}.training-date strong{font-size:17px}.training-date span{font-size:9px;font-weight:700}.training-info{flex:1;min-width:0}.training-info h3{color:#111827;margin-bottom:5px;font-size:13px}.training-info p,.training-info span{color:#9ca3af;font-size:11px}.training-info span{margin-top:3px;display:block}.status{border-radius:20px;flex-shrink:0;padding:5px 9px;font-size:10px;font-weight:600}.status.upcoming{color:#2563eb;background:#eff6ff}.quick-actions{grid-template-columns:1fr 1fr;gap:12px;display:grid}.quick-actions button{color:#4b5563;background:#fafafa;border:1px solid #e5e7eb;border-radius:9px;flex-direction:column;justify-content:center;align-items:center;gap:9px;min-height:100px;font-size:11px;transition:all .2s;display:flex}.quick-actions button:hover{color:#2563eb;background:#f8fbff;border-color:#93c5fd}@media (width<=1100px){.stats-grid{grid-template-columns:1fr 1fr}.content-grid{grid-template-columns:1fr}}@media (width<=700px){.sidebar{width:70px;min-width:70px;padding:20px 9px}.sidebar-logo{justify-content:center;padding:0 0 25px}.logo-text{display:none}.menu-item{justify-content:center;padding:12px 5px}.menu-item span{display:none}.navbar{padding:0 15px}.search-box{width:200px}.profile-info{display:none}.main-content{padding:20px 15px}.stats-grid{grid-template-columns:1fr}.page-header{flex-direction:column;align-items:flex-start;gap:15px}.training-item{align-items:flex-start}.status{display:none}}.form-page,.list-page{width:100%;max-width:1200px;margin:0 auto}.form-page-header{margin-bottom:25px}.back-btn{color:#2563eb;background:0 0;border:none;align-items:center;gap:7px;margin-bottom:15px;padding:0;font-size:13px;display:flex}.form-page-header h1{color:#111827;margin-bottom:7px;font-size:26px}.form-page-header p{color:#6b7280;font-size:13px}.form-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:28px}.form-card-title{border-bottom:1px solid #e5e7eb;align-items:center;gap:13px;margin-bottom:25px;padding-bottom:22px;display:flex}.form-title-icon{color:#2563eb;background:#eff6ff;border-radius:9px;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.form-card-title h2{color:#111827;margin-bottom:4px;font-size:17px}.form-card-title p{color:#9ca3af;font-size:12px}.form-grid{grid-template-columns:1fr 1fr;gap:22px;display:grid}.form-group{flex-direction:column;gap:8px;display:flex}.form-group label{color:#374151;font-size:13px;font-weight:600}.form-group label span{color:#ef4444;margin-left:3px}.form-group input{color:#374151;background:#fff;border:1px solid #d1d5db;border-radius:7px;outline:none;height:44px;padding:0 13px;font-size:13px}.form-group input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #eff6ff}.form-group input::placeholder{color:#9ca3af}.form-actions{border-top:1px solid #e5e7eb;justify-content:flex-end;gap:12px;margin-top:30px;padding-top:22px;display:flex}.cancel-btn{color:#4b5563;background:#fff;border:1px solid #d1d5db;border-radius:7px;padding:11px 18px;font-size:13px}.save-btn{color:#fff;background:#2563eb;border:none;border-radius:7px;align-items:center;gap:7px;padding:11px 18px;font-size:13px;font-weight:600;display:flex}.list-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden}.list-toolbar{border-bottom:1px solid #e5e7eb;padding:18px}.list-search{color:#9ca3af;border:1px solid #d1d5db;border-radius:7px;align-items:center;gap:9px;width:350px;height:40px;padding:0 12px;display:flex}.list-search input{border:none;outline:none;width:100%;font-size:13px}.table-container{width:100%;overflow-x:auto}table{border-collapse:collapse;width:100%}th{color:#6b7280;text-align:left;white-space:nowrap;background:#f8fafc;padding:14px 16px;font-size:11px;font-weight:600}td{color:#4b5563;white-space:nowrap;border-top:1px solid #f0f0f0;padding:16px;font-size:12px}td strong{color:#111827}.table-status{color:#2563eb;background:#eff6ff;border-radius:20px;padding:5px 9px;font-size:10px;font-weight:600;display:inline-block}.table-actions{gap:6px;display:flex}.table-actions button{color:#6b7280;background:#fff;border:1px solid #e5e7eb;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.table-actions button:hover{color:#2563eb;border-color:#93c5fd}.table-actions .delete-action:hover{color:#ef4444;border-color:#fca5a5}.empty-state{text-align:center;flex-direction:column;align-items:center;padding:70px 20px;display:flex}.empty-icon{color:#2563eb;background:#eff6ff;border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;margin-bottom:15px;display:flex}.empty-state h3{color:#111827;margin-bottom:6px;font-size:16px}.empty-state p{color:#9ca3af;margin-bottom:18px;font-size:12px}@media (width<=700px){.form-grid{grid-template-columns:1fr}.form-card{padding:20px}.list-search{width:100%}.form-actions{flex-direction:column-reverse}.form-actions button{justify-content:center;width:100%}}.modal-card{background:#fff;border-radius:16px;width:100%;max-width:560px;padding:28px;box-shadow:0 20px 50px #00000026}.modal-header{justify-content:space-between;align-items:flex-start;margin-bottom:24px;display:flex}.modal-header h2{color:#1e293b;margin:0 0 6px;font-size:22px}.modal-header p{color:#64748b;margin:0;font-size:14px}.modal-close{cursor:pointer;color:#64748b;background:#f1f5f9;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.modal-close:hover{background:#e2e8f0}.form-group select{background:#fff;border:1px solid #dbe1ea;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-size:14px}.form-group select:focus{border-color:#2563eb}.table-subtext{color:#64748b;font-size:12px}.attendance-selection{background:#fff;border:1px solid #e5e7eb;border-radius:14px;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;padding:22px;display:grid}.attendance-selection .form-group{margin-bottom:0}.attendance-selection select,.attendance-selection input{background:#fff;border:1px solid #dbe1ea;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-size:14px}.attendance-selection select:focus,.attendance-selection input:focus{border-color:#2563eb}.attendance-info{background:#fff;border:1px solid #e5e7eb;border-radius:14px;grid-template-columns:repeat(5,1fr);gap:15px;margin-bottom:20px;padding:20px;display:grid}.attendance-info div{flex-direction:column;gap:6px;display:flex}.attendance-info span{color:#64748b;font-size:12px}.attendance-info strong{color:#1e293b;font-size:15px}.present-text{color:#16a34a!important}.absent-text{color:#dc2626!important}.attendance-toolbar{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:20px;padding:20px;display:flex}.attendance-toolbar h2{color:#1e293b;margin:0 0 5px;font-size:18px}.attendance-toolbar p{color:#64748b;margin:0;font-size:13px}.attendance-toolbar input{border:1px solid #dbe1ea;border-radius:8px;outline:none;width:260px;padding:10px 13px;font-size:13px}.attendance-toolbar input:focus{border-color:#2563eb}.attendance-buttons{gap:8px;display:flex}.attendance-btn{cursor:pointer;background:#fff;border:1px solid #dbe1ea;border-radius:7px;padding:7px 12px;font-size:12px;font-weight:600}.attendance-btn.present.active{color:#15803d;background:#dcfce7;border-color:#86efac}.attendance-btn.absent.active{color:#dc2626;background:#fee2e2;border-color:#fca5a5}.attendance-btn:hover{background:#f8fafc}.signin-time{color:#334155;align-items:center;gap:7px;font-size:13px;display:flex}.not-signed{color:#94a3b8;font-size:13px}.attendance-placeholder{text-align:center;color:#64748b;background:#fff;border:1px dashed #cbd5e1;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;min-height:300px;display:flex}.attendance-placeholder h3{color:#334155;margin:15px 0 6px}.attendance-placeholder p{margin:0;font-size:14px}@media (width<=900px){.attendance-info{grid-template-columns:repeat(2,1fr)}.attendance-selection{grid-template-columns:1fr}.attendance-toolbar{flex-direction:column;align-items:stretch}.attendance-toolbar input{width:100%}}.session-training-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;margin-bottom:20px;padding:22px}.session-training-card .form-group{max-width:600px;margin:0}.session-training-card select{background:#fff;border:1px solid #dbe1ea;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-size:14px}.session-training-card select:focus{border-color:#2563eb}.session-info{background:#fff;border:1px solid #e5e7eb;border-radius:14px;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:20px;padding:20px;display:grid}.session-info div{flex-direction:column;gap:6px;display:flex}.session-info span{color:#64748b;font-size:12px}.session-info strong{color:#1e293b;font-size:14px}.session-list-header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:20px;display:flex}.session-list-header h2{color:#1e293b;margin:0 0 5px;font-size:18px}.session-list-header p{color:#64748b;margin:0;font-size:13px}.session-count{color:#2563eb;background:#eff6ff;border-radius:20px;padding:7px 12px;font-size:13px;font-weight:600}.session-list{flex-direction:column;gap:12px;padding:20px;display:flex}.session-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:18px;padding:18px;display:flex}.session-card:hover{border-color:#cbd5e1}.session-day{text-align:center;min-width:65px}.session-day-number{color:#2563eb;background:#eff6ff;border-radius:10px;justify-content:center;align-items:center;width:42px;height:42px;margin:0 auto 5px;font-size:17px;font-weight:700;display:flex}.session-day span{color:#64748b;font-size:11px}.session-main{flex:1}.session-main h3{color:#1e293b;margin:0 0 6px;font-size:15px}.session-main p{color:#64748b;margin:0 0 10px;font-size:13px}.session-meta{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.session-meta span{color:#64748b;align-items:center;gap:6px;font-size:12px;display:flex}.session-delete{color:#dc2626;cursor:pointer;background:#fef2f2;border:none;border-radius:7px;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.session-delete:hover{background:#fee2e2}.session-modal{max-height:90vh;overflow-y:auto}.session-modal textarea{resize:vertical;border:1px solid #dbe1ea;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-family:inherit;font-size:14px}.session-modal textarea:focus{border-color:#2563eb}@media (width<=900px){.session-info{grid-template-columns:repeat(2,1fr)}.session-card{align-items:flex-start}}@media (width<=600px){.session-info,.session-form-grid{grid-template-columns:1fr}.session-list-header{flex-direction:column;align-items:flex-start;gap:12px}.session-card{flex-direction:column}.session-day{text-align:left}.session-day-number{margin-left:0}}.feedback-summary{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}.feedback-summary-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;align-items:center;gap:14px;padding:20px;display:flex}.feedback-summary-card svg{color:#2563eb}.feedback-summary-card span{color:#64748b;margin-bottom:5px;font-size:12px;display:block}.feedback-summary-card strong{color:#1e293b;font-size:20px}.feedback-summary-number{color:#2563eb;font-size:22px;font-weight:700}.feedback-list{flex-direction:column;gap:14px;padding:20px;display:flex}.feedback-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px;position:relative}.feedback-person{align-items:center;gap:12px;display:flex}.feedback-avatar{color:#2563eb;background:#eff6ff;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;font-weight:700;display:flex}.feedback-person div:last-child{flex-direction:column;gap:4px;display:flex}.feedback-person strong{color:#1e293b;font-size:14px}.feedback-person span{color:#94a3b8;font-size:12px}.feedback-rating{align-items:center;gap:10px;margin-top:15px;display:flex}.feedback-stars{color:#f59e0b;gap:2px;display:flex}.feedback-rating strong{color:#475569;font-size:13px}.feedback-details{border-top:1px solid #f1f5f9;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:16px;padding-top:15px;display:grid}.feedback-details div{flex-direction:column;gap:5px;display:flex}.feedback-details span{color:#94a3b8;font-size:11px}.feedback-details strong{color:#334155;font-size:13px}.feedback-comment{color:#475569;background:#f8fafc;border-radius:8px;margin:15px 0 0;padding:12px;font-size:13px;line-height:1.5}.feedback-delete{color:#dc2626;cursor:pointer;background:#fef2f2;border:none;border-radius:7px;justify-content:center;align-items:center;width:32px;height:32px;display:flex;position:absolute;top:16px;right:16px}.feedback-delete:hover{background:#fee2e2}.feedback-form-rating{margin-bottom:18px}.feedback-form-rating>label{color:#334155;margin-bottom:9px;font-size:13px;font-weight:600;display:block}.rating-buttons{gap:8px;display:flex}.rating-btn{cursor:pointer;color:#64748b;background:#fff;border:1px solid #dbe1ea;border-radius:7px;align-items:center;gap:5px;padding:8px 12px;display:flex}.rating-btn.active{color:#ea580c;background:#fff7ed;border-color:#fdba74}@media (width<=800px){.feedback-summary,.feedback-details{grid-template-columns:1fr}}.report-selection{background:#fff;border:1px solid #e5e7eb;border-radius:14px;margin-bottom:20px;padding:20px}.report-selection .form-group{max-width:600px;margin:0}.report-selection select{background:#fff;border:1px solid #dbe1ea;border-radius:8px;outline:none;width:100%;padding:12px 14px;font-size:14px}.report-training-header{background:#fff;border:1px solid #e5e7eb;border-radius:14px;justify-content:space-between;align-items:center;margin-bottom:20px;padding:22px;display:flex}.report-training-header>div:first-child>span{color:#2563eb;font-size:12px;font-weight:600}.report-training-header h2{color:#1e293b;margin:5px 0;font-size:21px}.report-training-header p{color:#64748b;margin:0;font-size:13px}.report-training-days{color:#2563eb;background:#eff6ff;border-radius:10px;align-items:center;gap:7px;padding:12px 16px;display:flex}.report-training-days strong{font-size:20px}.report-training-days span{font-size:12px}.report-stats{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}.report-stat-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;align-items:center;gap:13px;padding:18px;display:flex}.report-stat-icon{color:#2563eb;background:#eff6ff;border-radius:10px;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.report-stat-card span{color:#64748b;margin-bottom:4px;font-size:12px;display:block}.report-stat-card strong{color:#1e293b;font-size:20px}.report-section{margin-bottom:20px}.report-section-header{border-bottom:1px solid #e5e7eb;padding:20px}.report-section-header h2{color:#1e293b;margin:0 0 5px;font-size:18px}.report-section-header p{color:#64748b;margin:0;font-size:13px}.report-empty{text-align:center;color:#94a3b8;padding:40px 20px;font-size:14px}.report-status{border-radius:20px;padding:5px 9px;font-size:11px;font-weight:600;display:inline-block}.report-status.present{color:#15803d;background:#dcfce7}.report-status.absent{color:#dc2626;background:#fee2e2}.report-overview{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.report-overview-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;flex-direction:column;gap:7px;padding:20px;display:flex}.report-overview-card svg{color:#2563eb;margin-bottom:5px}.report-overview-card span{color:#64748b;font-size:12px}.report-overview-card strong{color:#1e293b;font-size:24px}@media (width<=900px){.report-stats,.report-overview{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.report-stats,.report-overview{grid-template-columns:1fr}.report-training-header{flex-direction:column;align-items:flex-start;gap:15px}}.dashboard-header{justify-content:space-between;align-items:center;margin-bottom:25px;display:flex}.dashboard-header h1{color:#1e293b;margin:0 0 6px;font-size:27px}.dashboard-header p{color:#64748b;margin:0;font-size:14px}.dashboard-content-grid{grid-template-columns:1.5fr 1fr;gap:20px;margin-bottom:20px;display:grid}.dashboard-section-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;overflow:hidden}.section-card-header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:20px;display:flex}.view-all-btn{color:#2563eb;cursor:pointer;background:0 0;border:none;align-items:center;gap:5px;font-size:13px;font-weight:600;display:flex}.upcoming-training-list{padding:8px 20px}.upcoming-training-item{border-bottom:1px solid #f1f5f9;align-items:center;gap:14px;padding:15px 0;display:flex}.upcoming-training-item:last-child{border-bottom:none}.training-date-box{background:#eff6ff;border-radius:9px;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:52px;display:flex}.training-date-box strong{color:#2563eb;font-size:17px}.training-date-box span{color:#64748b;text-transform:uppercase;font-size:10px}.upcoming-training-info{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.upcoming-training-info strong{color:#334155;white-space:nowrap;text-overflow:ellipsis;font-size:13px;overflow:hidden}.upcoming-training-info span{color:#94a3b8;font-size:11px}.dashboard-status{border-radius:20px;padding:5px 9px;font-size:10px;font-weight:600}.dashboard-status.upcoming{color:#2563eb;background:#eff6ff}.dashboard-status.today{color:#b45309;background:#fef3c7}.dashboard-status.completed{color:#15803d;background:#dcfce7}.quick-actions{padding:8px 20px 12px}.quick-actions button{text-align:left;cursor:pointer;background:0 0;border:none;border-bottom:1px solid #f1f5f9;align-items:center;gap:12px;width:100%;padding:14px 0;display:flex}.quick-actions button:last-child{border-bottom:none}.quick-actions button>svg{color:#94a3b8;margin-left:auto}.quick-action-icon{color:#2563eb;background:#eff6ff;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.quick-actions button div:nth-child(2){flex-direction:column;gap:4px;display:flex}.quick-actions strong{color:#334155;font-size:13px}.quick-actions span{color:#94a3b8;font-size:11px}.quick-actions button:hover{background:#f8fafc}.dashboard-empty{text-align:center;color:#94a3b8;flex-direction:column;justify-content:center;align-items:center;min-height:220px;padding:25px;display:flex}.dashboard-empty h3{color:#475569;margin:12px 0 5px;font-size:15px}.dashboard-empty p{margin:0 0 15px;font-size:12px}.dashboard-empty.small{min-height:100px}.completed-section{margin-bottom:30px}.completed-count{color:#15803d;background:#dcfce7;border-radius:20px;padding:6px 10px;font-size:11px;font-weight:600}@media (width<=1000px){.dashboard-content-grid{grid-template-columns:1fr}}@media (width<=600px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:15px}.upcoming-training-item{align-items:flex-start}.dashboard-status{display:none}}.feedback-record-header{border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;gap:20px;padding:20px;display:flex}.feedback-record-header h2{color:#1e293b;margin:0 0 5px;font-size:18px}.feedback-record-header p{color:#64748b;margin:0;font-size:13px}.feedback-form-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.feedback-stars{align-items:center;gap:3px;margin-top:5px;display:flex}.star-button{cursor:pointer;color:#94a3b8;background:0 0;border:none;padding:2px}.star-button:hover,.star-button.selected{color:#f59e0b}.feedback-stars span{color:#64748b;margin-left:8px;font-size:13px}.feedback-modal{max-width:700px;max-height:90vh;overflow-y:auto}.feedback-modal small{text-align:right;color:#94a3b8;margin-top:4px;font-size:11px;display:block}.feedback-modal textarea{resize:vertical;min-height:90px}@media (width<=700px){.feedback-form-grid{grid-template-columns:1fr}.feedback-record-header{flex-direction:column;align-items:stretch}}.training-count{color:#64748b;white-space:nowrap;font-size:13px}.table-status.today{color:#b45309;background:#fef3c7}.table-status.upcoming{color:#2563eb;background:#eff6ff}.table-status.completed{color:#15803d;background:#dcfce7}.navbar-search-wrapper{width:400px;position:relative}.search-box{box-sizing:border-box;background:#fff;border:1px solid #e1e5eb;border-radius:10px;align-items:center;gap:10px;width:100%;height:50px;padding:0 15px;display:flex}.search-box input{color:#222;background:0 0;border:none;outline:none;flex:1;font-size:14px}.search-box input::placeholder{color:#9aa1ac}.search-clear{cursor:pointer;color:#777;background:0 0;border:none;justify-content:center;align-items:center;display:flex}.search-clear:hover{color:#222}.search-results{z-index:1000;background:#fff;border:1px solid #e5e7eb;border-radius:10px;width:100%;position:absolute;top:58px;left:0;overflow:hidden;box-shadow:0 10px 30px #0000001f}.search-result-item{cursor:pointer;align-items:center;gap:12px;padding:14px 16px;transition:background .2s;display:flex}.search-result-item:hover{background:#f5f7fb}.search-result-item svg{color:#2563eb;flex-shrink:0}.search-result-item div{flex-direction:column;gap:3px;display:flex}.search-result-item strong{color:#222;font-size:14px}.search-result-item span{color:#8a919c;font-size:12px}.notification-wrapper{position:relative}.notification-btn{cursor:pointer;color:#687180;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;width:42px;height:42px;display:flex;position:relative}.notification-btn:hover{background:#f3f5f8}.notification-dot{background:#ef4444;border:2px solid #fff;border-radius:50%;width:8px;height:8px;position:absolute;top:7px;right:7px}.notification-dropdown{z-index:1000;background:#fff;border:1px solid #e5e7eb;border-radius:12px;width:360px;position:absolute;top:52px;right:-10px;overflow:hidden;box-shadow:0 12px 35px #00000026}.notification-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;padding:16px 18px;display:flex}.notification-header h3{color:#222;margin:0;font-size:16px}.notification-header span{color:#8a919c;margin-top:3px;font-size:12px;display:block}.notification-header button{cursor:pointer;color:#777;background:0 0;border:none}.notification-item{border-bottom:1px solid #f0f0f0;align-items:flex-start;gap:12px;padding:15px 18px;display:flex}.notification-icon{color:#2563eb;background:#eef4ff;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.notification-item strong{color:#222;font-size:13px;display:block}.notification-item p{color:#8a919c;margin:4px 0 0;font-size:12px;line-height:1.5}.view-notifications-btn{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;width:calc(100% - 32px);margin:16px;padding:11px;font-size:13px;font-weight:600}.view-notifications-btn:hover{background:#1d4ed8}@media (width<=700px){.navbar-search-wrapper{width:220px}.notification-dropdown{width:300px;right:-50px}.profile-info{display:none}}.profile-wrapper{position:relative}.profile{cursor:pointer;background:0 0;border:none;border-radius:10px;align-items:center;gap:10px;padding:5px 8px;display:flex}.profile:hover{background:#f5f7fb}.profile-avatar{color:#2563eb;background:#e5efff;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;font-size:16px;font-weight:700;display:flex}.profile-info{flex-direction:column;align-items:flex-start;gap:2px;display:flex}.profile-info strong{color:#222;font-size:14px}.profile-info span{color:#8a919c;font-size:12px}.profile-dropdown{z-index:1000;background:#fff;border:1px solid #e5e7eb;border-radius:12px;width:250px;padding:8px;position:absolute;top:55px;right:0;box-shadow:0 12px 35px #00000026}.profile-dropdown-header{align-items:center;gap:12px;padding:12px;display:flex}.profile-avatar.large{width:44px;height:44px}.profile-dropdown-header div:last-child{flex-direction:column;gap:3px;display:flex}.profile-dropdown-header strong{color:#222;font-size:14px}.profile-dropdown-header span{color:#8a919c;font-size:12px}.profile-divider{background:#eee;height:1px;margin:6px 0}.profile-menu-item{cursor:pointer;color:#333;text-align:left;background:0 0;border:none;border-radius:8px;align-items:center;gap:12px;width:100%;padding:11px 12px;font-size:13px;display:flex}.profile-menu-item:hover{background:#f5f7fb}.profile-menu-item svg{color:#687180}.logout-item,.logout-item svg{color:#dc2626}.logout-item:hover{background:#fff1f1}.training-details-page{padding-bottom:40px}.training-details-header{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px;display:flex}.training-title-row{align-items:center;gap:14px;margin-top:15px;display:flex}.training-details-icon{color:#2563eb;background:#eef4ff;border-radius:12px;justify-content:center;align-items:center;width:54px;height:54px;display:flex}.training-title-row h1{color:#20242b;margin:0;font-size:25px}.training-title-row p{color:#8a919c;margin:5px 0 0;font-size:13px}.training-status-badge{color:#2d7a3e;background:#eef7ee;border-radius:20px;padding:7px 13px;font-size:12px;font-weight:600}.training-info-card{background:#e7e9ed;border:1px solid #e7e9ed;border-radius:12px;grid-template-columns:repeat(5,1fr);gap:1px;margin-bottom:20px;display:grid;overflow:hidden}.training-info-item{background:#fff;align-items:flex-start;gap:12px;padding:18px;display:flex}.training-info-item svg{color:#2563eb;flex-shrink:0}.training-info-item div{flex-direction:column;gap:5px;display:flex}.training-info-item span{color:#8a919c;font-size:12px}.training-info-item strong{color:#252a31;font-size:13px}.training-detail-stats{grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px;display:grid}.detail-stat-card{background:#fff;border:1px solid #e7e9ed;border-radius:12px;align-items:center;gap:13px;padding:18px;display:flex}.detail-stat-icon{color:#2563eb;background:#eef4ff;border-radius:10px;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.detail-stat-card div:last-child{flex-direction:column;gap:4px;display:flex}.detail-stat-card span{color:#8a919c;font-size:12px}.detail-stat-card strong{color:#20242b;font-size:20px}.training-section-card{background:#fff;border:1px solid #e7e9ed;border-radius:12px;margin-bottom:20px;overflow:hidden}.section-card-header{border-bottom:1px solid #eee;padding:18px 20px}.section-card-header h2{color:#20242b;margin:0;font-size:16px}.section-card-header p{color:#8a919c;margin:5px 0 0;font-size:12px}.training-actions{grid-template-columns:repeat(5,1fr);gap:12px;padding:18px;display:grid}.training-actions button{text-align:left;cursor:pointer;background:#fff;border:1px solid #e4e7eb;border-radius:10px;align-items:center;gap:10px;padding:15px;transition:all .2s;display:flex}.training-actions button:hover{background:#f6f8fc;border-color:#cfd7e6;transform:translateY(-1px)}.training-actions button>svg{color:#2563eb;flex-shrink:0}.training-actions button span{flex-direction:column;gap:3px;display:flex}.training-actions button strong{color:#252a31;font-size:12px}.training-actions button small{color:#8a919c;font-size:10px}.detail-table-wrapper{overflow-x:auto}.detail-table{border-collapse:collapse;width:100%}.detail-table th{text-align:left;color:#737b88;background:#f8f9fb;border-bottom:1px solid #eee;padding:12px 18px;font-size:11px;font-weight:600}.detail-table td{color:#444b55;border-bottom:1px solid #f0f0f0;padding:13px 18px;font-size:12px}.detail-table tbody tr:last-child td{border-bottom:none}.detail-empty{text-align:center;color:#8a919c;padding:35px;font-size:13px}@media (width<=1000px){.training-info-card,.training-detail-stats,.training-actions{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.training-details-header{flex-direction:column}.training-info-card,.training-detail-stats,.training-actions{grid-template-columns:1fr}}.training-list-page{padding-bottom:40px}.page-header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;display:flex}.page-header h1{color:#20242b;margin:0;font-size:25px}.page-header p{color:#8a919c;margin:6px 0 0;font-size:13px}.primary-btn{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:8px;align-items:center;gap:8px;padding:11px 16px;font-size:13px;font-weight:600;display:inline-flex}.primary-btn:hover{background:#1d4ed8}.training-list-toolbar{justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px;display:flex}.training-search-box{background:#fff;border:1px solid #e1e5eb;border-radius:9px;align-items:center;gap:9px;width:420px;height:44px;padding:0 13px;display:flex}.training-search-box svg{color:#8a919c}.training-search-box input{color:#333;border:none;outline:none;flex:1;font-size:13px}.training-count{color:#8a919c;font-size:12px}.training-list-grid{grid-template-columns:repeat(3,1fr);gap:18px;display:grid}.training-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px;transition:all .2s}.training-card:hover{transform:translateY(-2px);box-shadow:0 7px 22px #00000012}.training-card-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.training-card-icon{color:#2563eb;background:#eef4ff;border-radius:10px;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.training-status{border-radius:20px;padding:5px 9px;font-size:10px;font-weight:600}.training-status.upcoming{color:#b77900;background:#fff7e6}.training-status.ongoing{color:#23813b;background:#eaf7ee}.training-status.completed{color:#626b78;background:#eef0f3}.training-card-title>span{color:#8a919c;font-size:11px}.training-card-title h2{color:#20242b;margin:5px 0 0;font-size:16px;line-height:1.4}.training-card-details{flex-direction:column;gap:10px;margin-top:18px;display:flex}.training-card-details div{align-items:center;gap:9px;display:flex}.training-card-details svg{color:#7d8794;flex-shrink:0}.training-card-details span{color:#626b78;font-size:12px}.training-card-actions{border-top:1px solid #eee;gap:9px;margin-top:18px;padding-top:15px;display:flex}.view-training-btn,.delete-training-btn{cursor:pointer;border-radius:7px;flex:1;justify-content:center;align-items:center;gap:7px;padding:9px;font-size:12px;font-weight:600;display:flex}.view-training-btn{color:#2563eb;background:#f5f8ff;border:1px solid #dbe4f7}.view-training-btn:hover{background:#eaf0ff}.delete-training-btn{color:#dc2626;background:#fff7f7;border:1px solid #f2d5d5}.delete-training-btn:hover{background:#fff0f0}.training-empty{text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:280px;padding:30px;display:flex}.training-empty-icon{color:#2563eb;background:#eef4ff;border-radius:50%;justify-content:center;align-items:center;width:65px;height:65px;margin-bottom:15px;display:flex}.training-empty h2{color:#252a31;margin:0;font-size:17px}.training-empty p{color:#8a919c;margin:7px 0 18px;font-size:12px}@media (width<=1100px){.training-list-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=700px){.page-header{flex-direction:column;align-items:flex-start}.training-list-toolbar{flex-direction:column;align-items:stretch}.training-search-box{box-sizing:border-box;width:100%}.training-list-grid{grid-template-columns:1fr}}.sessions-page{padding-bottom:40px}.session-selector-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;padding:18px;display:flex}.session-selector-label{align-items:center;gap:12px;display:flex}.session-selector-label>svg{color:#2563eb}.session-selector-label div{flex-direction:column;gap:4px;display:flex}.session-selector-label strong{color:#252a31;font-size:13px}.session-selector-label span{color:#8a919c;font-size:11px}.session-selector-card select{color:#333;background:#fff;border:1px solid #dfe3e8;border-radius:8px;outline:none;width:400px;height:42px;padding:0 12px}.session-training-summary{grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:18px;display:grid}.session-training-summary>div{background:#fff;border:1px solid #e5e7eb;border-radius:10px;flex-direction:column;gap:5px;padding:15px;display:flex}.session-training-summary span{color:#8a919c;font-size:11px}.session-training-summary strong{color:#252a31;font-size:13px}.session-empty{text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:280px;display:flex}.session-empty>svg{color:#2563eb;margin-bottom:12px}.session-empty h2{color:#252a31;margin:0;font-size:17px}.session-empty p{color:#8a919c;margin:6px 0 18px;font-size:12px}.sessions-list{flex-direction:column;gap:14px;display:flex}.session-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;display:flex;overflow:hidden}.session-day{background:#f3f7ff;border-right:1px solid #e2e8f5;flex-direction:column;flex-shrink:0;justify-content:center;align-items:center;width:85px;display:flex}.session-day span{color:#7b8798;letter-spacing:1px;font-size:9px;font-weight:700}.session-day strong{color:#2563eb;margin-top:3px;font-size:27px}.session-main{flex:1;padding:17px 20px}.session-card-top{justify-content:space-between;gap:15px;display:flex}.session-card-top h2{color:#252a31;margin:0;font-size:15px}.session-card-top span{color:#8a919c;margin-top:5px;font-size:11px;display:block}.session-delete-btn{color:#dc2626;cursor:pointer;background:#fff6f6;border:none;border-radius:7px;justify-content:center;align-items:center;width:34px;height:34px;display:flex}.session-delete-btn:hover{background:#ffeded}.session-times{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:17px;display:grid}.session-times>div{flex-direction:column;gap:4px;display:flex}.session-times svg{color:#2563eb;margin-bottom:2px}.session-times span{color:#8a919c;font-size:10px}.session-times strong{color:#333;font-size:12px}.session-description{color:#69717d;border-top:1px solid #eee;margin:15px 0 0;padding-top:12px;font-size:12px;line-height:1.6}.modal-overlay{z-index:2000;background:#00000073;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.session-modal{background:#fff;border-radius:14px;width:700px;max-width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 20px 50px #0003}.session-modal-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:flex-start;padding:20px;display:flex}.session-modal-header h2{color:#252a31;margin:0;font-size:18px}.session-modal-header p{color:#8a919c;margin:5px 0 0;font-size:12px}.session-modal-header>button{color:#777;cursor:pointer;background:0 0;border:none}.session-modal form{padding:20px}.session-form-grid{grid-template-columns:1fr 1fr;gap:16px;display:grid}.session-full{grid-column:1/-1}.session-form-grid input,.session-form-grid select,.session-form-grid textarea{box-sizing:border-box;width:100%}.session-modal-actions{border-top:1px solid #eee;justify-content:flex-end;gap:10px;margin-top:22px;padding-top:17px;display:flex}@media (width<=800px){.session-selector-card{flex-direction:column;align-items:stretch}.session-selector-card select{width:100%}.session-training-summary,.session-times{grid-template-columns:repeat(2,1fr)}}@media (width<=600px){.session-training-summary{grid-template-columns:1fr}.session-card{flex-direction:column}.session-day{border-bottom:1px solid #e2e8f5;border-right:none;flex-direction:row;gap:8px;width:100%;padding:10px}.session-day strong{font-size:20px}.session-form-grid{grid-template-columns:1fr}.session-full{grid-column:auto}.session-times{grid-template-columns:1fr 1fr}}.participants-page{padding-bottom:40px}.participants-filter-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px;padding:15px;display:flex}.participant-training-select{align-items:center;gap:9px;width:50%;display:flex}.participant-training-select svg{color:#2563eb}.participant-training-select select{color:#333;background:#fff;border:1px solid #dfe3e8;border-radius:8px;outline:none;width:100%;height:42px;padding:0 12px}.participant-search{border:1px solid #dfe3e8;border-radius:8px;align-items:center;gap:8px;width:35%;height:42px;padding:0 12px;display:flex}.participant-search svg{color:#8a919c}.participant-search input{border:none;outline:none;width:100%;font-size:13px}.participant-summary{grid-template-columns:repeat(2,1fr);gap:15px;margin-bottom:18px;display:grid}.participant-summary>div{background:#fff;border:1px solid #e5e7eb;border-radius:10px;align-items:center;gap:12px;padding:17px;display:flex}.participant-summary svg{color:#2563eb}.participant-summary div div{flex-direction:column;gap:4px;display:flex}.participant-summary span{color:#8a919c;font-size:11px}.participant-summary strong{color:#252a31;font-size:20px}.participants-table-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden}.participants-table-wrapper{overflow-x:auto}.participants-table{border-collapse:collapse;width:100%}.participants-table th{text-align:left;color:#737b88;background:#f8f9fb;border-bottom:1px solid #eee;padding:13px 18px;font-size:11px;font-weight:600}.participants-table td{color:#555d68;border-bottom:1px solid #f0f0f0;padding:14px 18px;font-size:12px}.participant-name{align-items:center;gap:10px;display:flex}.participant-avatar{color:#2563eb;background:#eef4ff;border-radius:50%;justify-content:center;align-items:center;width:34px;height:34px;font-size:12px;font-weight:700;display:flex}.participant-name strong{color:#252a31}.participant-contact{align-items:center;gap:7px;display:flex}.participant-contact svg{color:#8a919c}.participant-training-badge{color:#5e6876;background:#f2f5fa;border-radius:5px;padding:5px 8px;font-size:10px;font-weight:600;display:inline-block}.participant-delete-btn{color:#dc2626;cursor:pointer;background:#fff6f6;border:none;border-radius:7px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.participant-delete-btn:hover{background:#ffeded}.participants-empty{text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:280px;display:flex}.participants-empty>svg{color:#2563eb;margin-bottom:12px}.participants-empty h2{color:#252a31;margin:0;font-size:17px}.participants-empty p{color:#8a919c;margin:7px 0 18px;font-size:12px}.participant-modal{background:#fff;border-radius:14px;width:500px;max-width:100%;box-shadow:0 20px 50px #0003}.participant-modal-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:flex-start;padding:20px;display:flex}.participant-modal-header h2{color:#252a31;margin:0;font-size:18px}.participant-modal-header p{color:#8a919c;margin:5px 0 0;font-size:12px}.participant-modal-header>button{color:#777;cursor:pointer;background:0 0;border:none}.participant-modal form{padding:20px}.participant-modal-actions{border-top:1px solid #eee;justify-content:flex-end;gap:10px;margin-top:20px;padding-top:17px;display:flex}@media (width<=700px){.participants-filter-card{flex-direction:column;align-items:stretch}.participant-training-select,.participant-search{box-sizing:border-box;width:100%}.participant-summary{grid-template-columns:1fr}}
