@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Playfair+Display:wght@700&display=swap";@import "https://fonts.googleapis.com/css2?family=Fredoka+One&family=Montserrat:wght@400;500;600;700&display=swap";.login-container{background:#fff;width:100%;min-height:100vh;font-family:Montserrat,sans-serif;overflow:hidden}.login-row{min-height:100vh}.left-section{background:#fff;justify-content:center;align-items:center;min-height:100vh;padding:40px 60px;display:flex;position:relative}.content-wrapper{width:100%;max-width:650px}.logo-container-login{margin-bottom:0;position:absolute;top:40px;left:60px}.brand-logo-login{object-fit:contain;width:95px;height:auto;display:block}.right-section{height:100vh;overflow:hidden;padding:0!important}.image-wrapper{width:100%;height:100vh;position:relative}.login-hero-image{object-fit:cover;border-left:2px solid #8fd5df;width:100%;height:100%}@media screen and (width<=1200px){.content-wrapper{max-width:560px}.logo-container-login{top:35px;left:45px}}@media screen and (width<=992px){.left-section{min-height:100vh;padding:35px}.content-wrapper{max-width:100%}.logo-container-login{top:30px;left:35px}.brand-logo-login{width:82px}}@media screen and (width<=768px){.left-section{padding:28px}.content-wrapper{max-width:100%}.logo-container-login{top:25px;left:28px}.brand-logo-login{width:75px}}@media screen and (width<=576px){.left-section{padding:22px}.logo-container-login{top:20px;left:22px}.brand-logo-login{width:68px}}.login-form-container{width:100%;max-width:400px;margin:0 auto}.login-title{color:#000;text-align:left;margin-top:24px;margin-bottom:40px;font-family:Playfair Display,serif;font-size:48px;font-weight:700;line-height:1.2}.login-form-container .ant-form-item{margin-bottom:24px}.login-form-container .ant-form-item-label{padding-bottom:6px}.login-form-container .ant-form-item-label>label{font-family:Montserrat,sans-serif;color:#000!important;font-size:14px!important;font-weight:600!important}.login-form-container .ant-form-item-required:before{display:none!important}.login-form-container .ant-input:not(.ant-input-affix-wrapper .ant-input){font-weight:500;height:48px!important;box-shadow:none!important;background:#fff!important;border:1px solid #4a4a4a!important;border-radius:24px!important;padding-left:20px!important;padding-right:20px!important;font-size:14px!important}.login-form-container .ant-input-affix-wrapper{align-items:center;font-weight:500;display:flex;height:48px!important;box-shadow:none!important;background:#fff!important;border:1px solid #4a4a4a!important;border-radius:24px!important;padding-left:20px!important;padding-right:20px!important;font-size:14px!important}.login-form-container .ant-input-suffix{margin-left:8px}.login-form-container .input-icon-suffix{color:#000;font-size:18px}.login-form-container .ant-input-affix-wrapper>input.ant-input{height:100%!important;box-shadow:none!important;background:0 0!important;border:none!important;border-radius:0!important;padding:0!important;font-size:14px!important}.login-form-container input::placeholder{font-size:14px;font-weight:400;color:#a0a0a0!important}.login-form-container .ant-input:focus,.login-form-container .ant-input-focused,.login-form-container .ant-input-affix-wrapper-focused{border-color:#54b9b9!important;box-shadow:0 0 0 2px #54b9b933!important}.login-form-container .login-submit-btn{justify-content:center;align-items:center;width:100%;margin-top:16px;font-family:Montserrat,sans-serif;transition:all .2s;display:flex;color:#fff!important;height:48px!important;box-shadow:none!important;background:#54b9b9!important;border:none!important;border-radius:24px!important;font-size:16px!important;font-weight:600!important}.login-form-container .login-submit-btn:hover,.login-form-container .login-submit-btn:focus{color:#fff!important;background:#479e9e!important}@media screen and (width<=768px){.login-form-container{max-width:100%}.login-title{margin-bottom:28px;font-size:38px}}body{color:#333;-webkit-font-smoothing:antialiased;background-color:#f8fafc;font-family:Montserrat,sans-serif;overflow-x:hidden}.dashboard-wrapper{background-color:#f8fafc;width:100%;min-height:100vh;display:flex}.logo-section{flex-direction:column;justify-content:center;align-items:center;gap:8px;margin-bottom:35px;padding:10px 0;display:flex}.brand-logo-img-standalone{object-fit:contain;max-width:120px;height:auto}.nav-item{text-transform:capitalize;color:#64748b;cursor:pointer;border-radius:14px;align-items:center;gap:14px;padding:12px 18px;font-size:15px;font-weight:600;transition:all .2s ease-in-out;display:flex}.nav-item .nav-icon{justify-content:center;align-items:center;font-size:18px;text-decoration:none;display:flex}.nav-item.active{color:#fff;background-color:#49a2a6}.main-area{flex-direction:column;flex:1;align-items:stretch;min-height:100vh;margin-left:260px;display:flex}.content-container{flex-direction:column;flex-grow:1;width:100%;padding:30px;display:flex}.search-bar{background:#f1f3f4;border-radius:12px;align-items:center;width:300px;padding:10px 15px;display:flex}.search-bar input{background:0 0;border:none;outline:none;width:100%;margin-left:10px;font-family:Montserrat,sans-serif}.top-nav-actions{align-items:center;gap:20px;display:flex}.profile-mini{align-items:center;gap:10px;font-weight:700;display:flex}.avatar-small{background:#ffcc80;border-radius:50%;justify-content:center;align-items:center;width:35px;height:35px;display:flex}.content-container{padding:30px 40px}.user-greeting-card{background:linear-gradient(135deg,#f0f8ff,#fff);border:1px solid #000;border-radius:50px;align-items:center;gap:15px;width:100%;max-width:1100px;height:65px;margin-bottom:35px;padding:0 20px;display:flex}.avatar-main{border-radius:50%;flex-shrink:0;width:45px;height:45px;overflow:hidden}.avatar-main img{object-fit:cover;width:100%;height:100%}.user-greeting-card h1{margin:0;font-family:Fredoka One,cursive;font-size:1.5rem}.hero-card{background:#fff;border:1px solid #000;border-radius:20px;flex-wrap:wrap;align-items:center;gap:25px;padding:35px;transition:all .4s;display:flex;position:relative;overflow:hidden}.hero-active{background-color:#5b7cfa;background-image:radial-gradient(at 15% 20%,#7df9ff 0,#0000 50%),radial-gradient(at 85% 15%,#c084fc 0,#0000 45%),radial-gradient(at 70% 75%,#00cfff 0,#0000 50%),radial-gradient(at 30% 85%,#6ee7f9 0,#0000 45%),radial-gradient(#3b82f6 0,#0000 60%);border-radius:24px}.hero-card:before{content:"";pointer-events:none;opacity:.15;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");border-radius:17px;position:absolute;inset:3px}.hero-inactive{background:#fff}.hero-active:before{content:"";opacity:.15;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");border:1px solid #000;position:absolute;inset:0}.hero-img-wrapper img{width:110px}.hero-info{flex:1}.hero-info h3{margin-bottom:5px;font-family:Fredoka One,cursive;font-size:1.4rem}.instructor{color:#000;margin-bottom:10px}.hero-meta{gap:20px;font-weight:600;display:flex}.join-now-btn{color:#fff;cursor:pointer;background:#64b5c1;border:none;border-radius:12px;padding:14px 35px;font-family:Fredoka One,cursive;transition:all .3s}.join-now-btn:hover{background:#4ea3af;transform:translateY(-2px)}.join-now-btn:active{transform:scale(.95)}.join-now-btn.locked{color:#666;cursor:not-allowed;opacity:.8;pointer-events:none;background:#bdbdbd}.dashboard-grid{grid-template-columns:2fr 1fr;gap:25px;margin-top:40px;display:grid}.status-row{gap:20px;margin-bottom:25px;display:flex}.status-card{background:#f3f4f6;border:1px solid #000;border-radius:20px;flex:1;min-height:150px;padding:25px;transition:all .3s}.status-card:not(.locked):hover{transform:translateY(-6px);box-shadow:0 10px 25px #00000014}.status-card.locked{opacity:.6;cursor:not-allowed}.icon-lock{margin-bottom:10px;font-size:2rem}.view-feedback-hint{color:#5cb3bb;text-align:right;margin-top:10px;font-size:.75rem;font-weight:600}.progress-section{border:1px solid #000;border-radius:20px;padding:25px}.progress-card-inner{align-items:center;gap:15px;margin-top:15px;display:flex}.mini-robot{width:55px}.progress-details{flex:1}.progress-header{justify-content:space-between;font-weight:600;display:flex}.progress-bar-bg{background:#eee;border-radius:20px;height:8px;margin:8px 0}.progress-bar-fill{background:#ffc107;border-radius:20px;height:100%;transition:all .4s}.certificate-sidebar{text-align:center;border:1px solid #ccc;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;min-height:250px;padding:24px;display:flex}.trophy-locked-icon{width:80px;height:80px;margin-bottom:12px}.big-lock{margin-bottom:10px;font-size:3rem}.certificate-img{border-radius:10px;width:100%;max-width:220px;margin-top:10px;box-shadow:0 4px 12px #0000001a}.view-certificate-btn,.download-btn{color:#fff;cursor:pointer;background-color:#56c0d8;border:none;border-radius:10px;margin-top:12px;padding:12px 20px;font-weight:600;transition:all .3s}.view-certificate-btn:hover,.download-btn:hover{background-color:#3aa9c0;transform:translateY(-2px)}.view-certificate-btn:active,.download-btn:active{transform:scale(.95)}.certificate-overlay{z-index:999;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.certificate-modal{text-align:center;background:#fff;border-radius:20px;width:750px;max-width:90%;padding:25px;animation:.25s popup;position:relative}@keyframes popup{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.certificate-preview{border-radius:10px;width:100%;margin-bottom:20px}@media (width<=900px){.dashboard-grid{grid-template-columns:1fr}.status-row{flex-direction:column}.hero-card{flex-direction:column;align-items:flex-start}}.custom-classroom-container{box-sizing:border-box;width:100%;padding:10px;font-family:Montserrat,sans-serif}.custom-header-controls{justify-content:space-between;align-items:center;width:100%;margin-bottom:25px;display:flex}.custom-tabs-group{gap:8px;display:flex}.custom-tabs-group .custom-tab-btn{color:#333;cursor:pointer;background:0 0;border:1px solid #e2e8f0;border-radius:8px;padding:6px 16px;font-size:15px;font-weight:500;transition:all .2s}.custom-tabs-group .custom-tab-btn.active{color:#fff;background-color:#000;border-color:#000}.custom-search-wrapper{align-items:center;display:flex;position:relative}.custom-search-wrapper input{border:1px solid #ccc;border-radius:12px;outline:none;width:220px;padding:8px 35px 8px 15px;font-size:15px}.custom-search-wrapper .custom-search-icon{color:#666;font-size:14px;position:absolute;right:12px}.custom-cards-list{flex-direction:column;gap:25px;width:100%;display:flex}.custom-class-card{box-shadow:0 4px 10px #00000005;background:#fff!important;border:1px solid #e5e7eb!important;border-radius:16px!important;flex-direction:column!important;width:100%!important;display:flex!important;overflow:hidden!important}.custom-card-top-bar{color:#fff!important;justify-content:space-between!important;align-items:center!important;width:100%!important;padding:12px 24px!important;font-size:16px!important;font-weight:600!important;display:flex!important}.custom-card-top-bar.top-blue{background-color:#72c5dd!important}.custom-card-top-bar.top-pink{background-color:#f18c98!important}.custom-card-top-bar.top-purple{background-color:#ba9ec7!important}.custom-card-middle-content{flex-direction:column!important;gap:12px!important;width:100%!important;padding:24px!important;display:flex!important}.custom-title-line{align-items:center!important;gap:15px!important;display:flex!important}.custom-card-middle-content h3{color:#000!important;margin:0!important;font-size:18px!important;font-weight:700!important}.custom-instructor{color:#4b5563!important;font-size:15px!important;font-weight:500!important}.custom-material-desc{color:#333!important;margin:0 0 10px!important;font-size:15px!important;line-height:1.5!important}.custom-card-bottom-bar{border-top:1px dashed #e2e8f0!important;justify-content:flex-end!important;align-items:center!important;gap:20px!important;width:100%!important;padding-top:15px!important;display:flex!important}.custom-time-lbl{color:#222!important;font-size:15px!important;font-weight:500!important}.custom-action-btn{color:#fff!important;cursor:pointer!important;background-color:#43a4b3!important;border:none!important;border-radius:20px!important;padding:8px 30px!important;font-size:15px!important;font-weight:600!important;transition:background .2s!important}.custom-action-btn:hover{background-color:#33818d!important}.icon-spin{animation:8s linear infinite spinEffect}@keyframes spinEffect{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.top-bar-date,.custom-instructor,.custom-time-lbl{align-items:center!important;gap:6px!important;display:flex!important}.top-bar-date svg,.custom-instructor svg,.custom-time-lbl svg{stroke-width:2.5px}@media (width<=768px){.material-header-banner{text-align:center;flex-direction:column;gap:20px}.material-item-card{flex-direction:column;align-items:flex-start}.feedback-card-header{flex-direction:column;align-items:flex-start;gap:5px}.material-detail-card{padding:20px}.drive-box{flex-direction:column;align-items:flex-start;gap:12px}}.material-page{padding:20px;font-family:Montserrat,sans-serif}.material-header-banner{color:#fff;-webkit-backdrop-filter:blur(20px);background-color:#5b7cfa;background-image:radial-gradient(at 15% 20%,#7df9ff 0,#0000 50%),radial-gradient(at 85% 15%,#c084fc 0,#0000 45%),radial-gradient(at 70% 75%,#00cfff 0,#0000 50%),radial-gradient(at 30% 85%,#6ee7f9 0,#0000 45%),radial-gradient(#3b82f6 0,#0000 60%);border:1px solid #ffffff26;border-radius:30px;justify-content:space-between;align-items:center;margin-bottom:30px;padding:30px;transition:all .3s;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #00aeff40,0 4px 20px #8b5cf633}.material-header-banner:before{content:"";pointer-events:none;background:linear-gradient(135deg,#ffffff2e,#ffffff05);position:absolute;inset:0}.material-header-banner:hover{transform:translateY(-2px);box-shadow:0 14px 45px #00aeff59,0 8px 30px #8b5cf647}.material-header-banner>*{z-index:2;position:relative}.header-content h1{margin:0;font-family:Fredoka One,cursive;font-size:2.5rem}.header-content p{margin-top:10px;font-size:1rem}.header-robot-img img{height:120px}.section-title{color:#1e293b;margin-bottom:20px;font-weight:700}.material-list{flex-direction:column;gap:15px;display:flex}.material-item-card{background:#fff;border:1.5px solid #e0e0e0;border-radius:15px;align-items:center;width:100%;max-width:1200px;padding:15px 20px;transition:transform .2s,border-color .2s;display:flex;box-shadow:0 4px 15px #0000000d}.material-item-card:hover{transform:translateY(-2px)}.material-item-card.clickable{cursor:pointer}.material-item-card.selected-topic{border-color:#59b3b5;box-shadow:0 8px 22px #59b3b52e}.icon-wrapper{color:#fff;background-color:#6fbabf;border:1.5px solid #e0e0e0;border-radius:12px;justify-content:center;align-items:center;width:50px;height:50px;margin-right:20px;display:flex}.icon-wrapper svg{width:22px;height:22px}.icon-circle{color:#fff;background:#59b3b5;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:55px;height:55px;display:flex}.icon-circle svg{width:24px;height:24px}.material-info{flex:1}.feedback-card-header{justify-content:space-between;align-items:center;display:flex}.feedback-card-header h3{color:#333;margin:0;font-size:1rem}.feedback-date{color:#888;font-size:.85rem}.material-info p{color:#666;margin-top:8px;font-size:.9rem}.material-detail-card{background:#f5f5f5;border-radius:20px;margin-top:30px;padding:30px;position:relative}.close-btn{cursor:pointer;background:#fff;border:none;border-radius:8px;width:35px;height:35px;position:absolute;top:20px;right:20px}.detail-header{align-items:center;gap:15px;display:flex}.detail-header h3{color:#1e293b;margin:0}.detail-header p{color:#64748b;margin:4px 0 0}.material-desc{background:#fff;border-radius:15px;margin-top:25px;padding:20px;line-height:1.7}.material-desc h4{color:#1e293b;margin:0 0 10px}.material-desc p{color:#334155;margin:0}.drive-box{color:#000;background:#fff;border:1px solid #ccc;border-radius:12px;justify-content:space-between;align-items:center;margin-top:25px;padding:15px 20px;text-decoration:none;display:flex}.drive-box img{object-fit:contain;width:42px;height:42px}.drive-box h4{margin:0}.drive-box p{color:#777;margin:4px 0 0;font-size:.9rem}.drive-box.clickable{cursor:pointer}.drive-box:hover{border-color:#59b3b5;box-shadow:0 6px 16px #59b3b51f}.select-prompt-box{background:#f8fafc;border:1px dashed #cbd5e1;border-radius:16px;margin-top:30px}@media (width<=768px){.material-header-banner{text-align:center;flex-direction:column;gap:20px}.material-item-card{flex-direction:column;align-items:flex-start}.feedback-card-header{flex-direction:column;align-items:flex-start;gap:5px}.material-detail-card{padding:20px}.drive-box{flex-direction:column;align-items:flex-start;gap:12px}}.feedback-page{padding:20px;font-family:Montserrat,sans-serif}.feedback-header-banner{color:#fff;background-color:#5b7cfa;background-image:radial-gradient(at 15% 20%,#7df9ff 0,#0000 50%),radial-gradient(at 85% 15%,#c084fc 0,#0000 45%),radial-gradient(at 70% 75%,#00cfff 0,#0000 50%),radial-gradient(at 30% 85%,#6ee7f9 0,#0000 45%),radial-gradient(#3b82f6 0,#0000 60%);border:1px solid #ffffff26;border-radius:30px;justify-content:space-between;align-items:center;margin-bottom:30px;padding:30px;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 40px #00aeff40,0 4px 20px #8b5cf633}.feedback-header-content h1{margin:0;font-family:Fredoka One,cursive;font-size:2.5rem}.feedback-header-content p{opacity:.9;margin:8px 0 0;font-weight:500}.feedback-robot-img img{height:120px}.feedback-section-title{color:#1f2937;margin-bottom:20px;font-size:1.3rem;font-weight:700}.feedback-list{flex-direction:column;gap:15px;display:flex}.feedback-item-card{cursor:pointer;background:#fff;border:1.5px solid #e0e0e0;border-radius:15px;align-items:center;padding:15px 20px;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex;box-shadow:0 4px 15px #0000000d}.feedback-item-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00000014}.feedback-item-card.selected-feedback{background:#f0fbfb;border-color:#59b3b5}.feedback-icon-wrapper{background-color:#6fbabf;border:1.5px solid #e0e0e0;border-radius:12px;justify-content:center;align-items:center;width:50px;min-width:50px;height:50px;margin-right:20px;font-size:1.3rem;display:flex}.feedback-info{flex:1;min-width:0}.feedback-card-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.feedback-card-header h3{color:#333;margin:0;font-size:1rem;font-weight:600}.feedback-date{color:#59b3b5;white-space:nowrap;background:#e6f7f7;border-radius:20px;padding:4px 10px;font-size:.75rem;font-weight:600}.feedback-preview{color:#888;margin:6px 0 0;font-size:.85rem}.feedback-detail-overlay{z-index:999;background:#0f172a73;justify-content:center;align-items:flex-start;padding:40px 20px;animation:.2s overlayFade;display:flex;position:fixed;inset:0;overflow-y:auto}@keyframes overlayFade{0%{opacity:0}to{opacity:1}}.teacher-feedback-card{background:#fff;border-radius:24px;width:100%;max-width:900px;padding:40px;animation:.25s cardPopIn;position:relative;box-shadow:0 20px 60px #0003}@keyframes cardPopIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.close-btn{cursor:pointer;color:#94a3b8;background:0 0;border:none;border-radius:8px;width:32px;height:32px;font-size:1.2rem;transition:color .2s,background .2s;position:absolute;top:25px;right:25px}.close-btn:hover{color:#1f2937;background:#f1f5f9}.feedback-detail-header{align-items:flex-start;gap:20px;display:flex}.feedback-icon-teal{color:#fff;background:#59b3b5;border-radius:50%;justify-content:center;align-items:center;width:64px;min-width:64px;height:64px;font-size:24px;display:flex}.feedback-detail-heading h3{color:#1f2937;margin:0;font-size:1.5rem;font-weight:700;line-height:1.35}.feedback-detail-heading p{color:#64748b;margin:10px 0 0;font-size:1rem}.feedback-detail-heading .dot{color:#cbd5e1}.detail-divider{background:#e5e7eb;height:1px;margin:25px 0}.feedback-image{border-radius:16px;width:100%;margin-bottom:25px;overflow:hidden}.feedback-image img{border-radius:16px;width:100%;height:auto;display:block}.feedback-text-section p{color:#1f2937;margin:0;font-size:1.05rem;line-height:1.9}@media (width<=700px){.teacher-feedback-card{border-radius:18px;padding:25px}.feedback-detail-header{gap:14px}.feedback-icon-teal{width:50px;min-width:50px;height:50px;font-size:20px}.feedback-detail-heading h3{font-size:1.2rem}.feedback-header-banner{text-align:center;flex-direction:column;gap:15px;padding:20px}}.teacher-page{padding:30px 40px}.teacher-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.search-box-teacher{border:1px solid #ddd;border-radius:25px;align-items:center;gap:8px;padding:6px 15px;display:flex}.search-box-teacher input{border:none;outline:none;font-size:14px}.teacher-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:30px;display:grid}.teacher-card{text-align:center;cursor:pointer;background:linear-gradient(#fff 70%,#eefbfb);border-radius:20px;padding:20px;transition:all .3s;box-shadow:0 4px 12px #00000008}.teacher-card:hover{transform:translateY(-6px);box-shadow:0 8px 24px #00000014}.teacher-img-wrapper{margin-bottom:20px}.teacher-img-wrapper img{object-fit:cover;border:3px solid #b2ebf2;border-radius:24px;width:140px;height:140px;box-shadow:0 6px 15px #00000014}.teacher-info-row{text-align:left;justify-content:space-between;align-items:center;gap:10px;display:flex}.teacher-name-col{color:#1e293b;flex-direction:column;min-width:60px;font-size:16px;font-weight:700;display:flex}.teacher-name-col .first-name,.teacher-name-col .last-name{line-height:1.2}.teacher-spec-col{color:#64748b;text-align:center;flex:1;font-size:14px}.view-btn{color:#0f172a;cursor:pointer;background:#b2ebf2;border:none;border-radius:20px;padding:6px 16px;font-size:14px;font-weight:500;transition:all .2s}.view-btn:hover{background:#81d4fa}.teacher-modal-overlay{z-index:999;background:#00000059;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.teacher-modal{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:900px;padding:40px;position:relative;box-shadow:0 10px 40px #00000026}.modal-close{color:#64748b;cursor:pointer;background:#f1f5f9;border:none;border-radius:8px;justify-content:center;align-items:center;width:36px;height:36px;font-size:18px;transition:all .2s;display:flex;position:absolute;top:20px;right:20px}.modal-close:hover{color:#0f172a;background:#e2e8f0}.teacher-modal-body{gap:50px;margin-top:10px;display:flex}.modal-left{flex-direction:column;width:300px;display:flex}.teacher-photo-frame{border:1px solid #e2e8f0;border-radius:16px;margin-bottom:20px;padding:12px}.teacher-photo-frame img{aspect-ratio:4/3;object-fit:cover;border-radius:10px;width:100%;display:block}.status-available{color:#166534;text-align:center;background:#dcfce7;border-radius:12px;margin-bottom:30px;padding:12px;font-weight:600}.social-section{color:#334155}.social-section h4{color:#0f172a;margin-bottom:15px;font-size:16px}.social-section p{align-items:center;gap:8px;margin:10px 0;font-size:14px;display:flex}.modal-right{flex-direction:column;flex:1;display:flex}.modal-right h1{color:#0f172a;margin-bottom:8px;font-size:32px}.teacher-role{color:#fff;background:#7bd3d6;border-radius:20px;align-self:flex-start;margin-bottom:30px;padding:6px 16px;font-size:14px;font-weight:500;display:inline-block}.info-list{flex-direction:column;gap:20px;margin-bottom:25px;display:flex}.info-box{align-items:center;gap:16px;display:flex}.icon-circle{background:#f1f5f9;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-size:20px;display:flex}.info-box p{color:#64748b;margin:0 0 2px;font-size:13px}.info-box strong{color:#1e293b;font-size:15px}.modal-divider{background:#cbd5e1;border:none;height:1px;margin:20px 0}.about-teacher{margin-bottom:30px}.about-teacher h3{color:#0f172a;margin-bottom:8px;font-size:18px}.about-teacher p{color:#475569;font-size:15px;line-height:1.6}.modal-action-row{justify-content:flex-end;margin-top:auto;display:flex}.request-button{color:#0f172a;cursor:pointer;background:#facc15;border:none;border-radius:25px;padding:10px 30px;font-size:15px;font-weight:600;transition:all .2s}.request-button:hover:not(:disabled){background:#eab308}.request-button:disabled{color:#94a3b8;cursor:not-allowed;background:#e2e8f0}@keyframes slideDown{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}.request-notification{color:#fff;z-index:9999;background:#22c55e;border-radius:10px;padding:12px 24px;font-weight:600;animation:.4s slideDown;position:fixed;top:20px;left:50%;transform:translate(-50%);box-shadow:0 5px 15px #0003}.cert-page{box-sizing:border-box;background:#f6f7fb;width:100%;min-height:100vh;padding:35px}.cert-header{justify-content:space-between;align-items:center;margin-bottom:30px;display:flex}.cert-title-area h2{margin-bottom:5px;font-size:28px;font-weight:600}.cert-title-area p{color:#777;font-size:14px}.cert-count-badge{color:#fff;background:#6c5ce7;border-radius:20px;margin-top:10px;padding:5px 14px;font-size:13px;font-weight:500;display:inline-block}.search-box-cert{position:relative}.search-box-cert input{border:1px solid #ddd;border-radius:10px;outline:none;width:230px;padding:10px 40px 10px 15px;transition:all .3s}.search-box-cert input:focus{border-color:#56bbc4}.search-icon{position:absolute;top:50%;right:12px;transform:translateY(-50%)}.cert-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:28px;display:grid}.cert-card{background:#fff;border-radius:16px;transition:all .3s;overflow:hidden;box-shadow:0 6px 22px #0000000d}.cert-card:hover{transform:translateY(-6px)}.cert-img-wrapper{box-sizing:border-box;background:#f8f9fa;justify-content:center;align-items:center;width:100%;height:190px;padding:16px;display:flex}.cert-img-wrapper iframe,.cert-img-wrapper img{object-fit:contain;border-radius:6px;width:100%;height:100%;box-shadow:0 4px 12px #0000000f}.cert-info{padding:20px}.cert-info h3{margin-bottom:6px;font-size:18px}.cert-info .instructor{color:#666;font-size:14px}.cert-date{color:#555;margin:12px 0;font-size:14px}.view-cert-btn{color:#fff;cursor:pointer;background:#56bbc4;border:none;border-radius:10px;justify-content:space-between;align-items:center;width:100%;padding:12px;transition:all .25s;display:flex}.view-cert-btn:hover{background:#43aab3}.arrow-icon{font-size:18px}.cert-modal-overlay{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:999;background:#00000073;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:fixed;top:0;left:0}.cert-modal{text-align:center;background:#fff;border-radius:24px;width:950px;max-width:95%;padding:35px;animation:.3s popup;position:relative;box-shadow:0 20px 60px #00000026}.modal-close{cursor:pointer;background:#eee;border:none;border-radius:10px;width:36px;height:36px;font-size:18px;transition:all .2s;position:absolute;top:18px;right:18px}.modal-close:hover{background:#ddd}.modal-cert-img{object-fit:contain;border-radius:14px;width:100%;max-height:480px;margin-bottom:20px}.modal-cert-info h3{color:#1e293b;margin-bottom:5px;font-size:20px;font-weight:700}.modal-cert-info p{color:#64748b;margin-bottom:25px;font-size:15px}.download-btn{color:#fff;cursor:pointer;background:#3a9f2d;border:none;border-radius:30px;padding:12px 36px;font-size:15px;font-weight:600;transition:all .25s}.download-btn:hover{background:#2f8423}.teacher-profile-page{flex-direction:column;gap:24px;padding:10px;display:flex}.profile-banner{border-radius:28px;width:100%;height:220px;overflow:hidden;box-shadow:0 5px 15px #0000000d}.profile-banner img{object-fit:cover;width:100%;height:100%}.profile-header{margin-top:-70px;padding-left:40px}.profile-header h1{color:#111827;margin-top:10px;font-size:3rem;font-weight:800}.profile-image-section{width:fit-content;position:relative}.profile-image{object-fit:cover;background:#fff;border:5px solid #fff;border-radius:50%;width:120px;height:120px;box-shadow:0 5px 15px #00000014}.edit-photo-btn{color:#111827;cursor:pointer;background:#fff;border:none;border-radius:50%;width:36px;height:36px;position:absolute;bottom:5px;right:0;box-shadow:0 3px 10px #0000001a}.profile-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;padding:28px;box-shadow:0 4px 12px #0f172a0a}.card-header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}.card-header h3{color:#111827;font-size:1.4rem;font-weight:700}.edit-btn{cursor:pointer;background:#f3f4f6;border:none;border-radius:12px;align-items:center;gap:8px;padding:10px 18px;font-size:.95rem;font-weight:600;transition:all .2s;display:flex}.edit-btn:hover{background:#e5e7eb}.profile-grid{grid-template-columns:1fr 1fr;gap:30px;display:grid}.profile-item{flex-direction:column;gap:8px;display:flex}.profile-item label{color:#6b7280;font-size:1rem;font-weight:600}.profile-item p{color:#111827;font-size:1.15rem;font-weight:600}.full-width{grid-column:span 2}.with-icon{align-items:center;gap:10px;display:flex}@media (width<=900px){.profile-grid{grid-template-columns:1fr}.full-width{grid-column:span 1}.profile-header h1{font-size:2.2rem}}@media (width<=600px){.profile-banner{height:160px}.profile-header{padding-left:20px}.profile-image{width:90px;height:90px}.profile-header h1{font-size:1.8rem}}.profile-item input,.profile-item textarea{border:1px solid #dcdcdc;border-radius:12px;outline:none;width:100%;margin-top:6px;padding:12px 14px;font-size:14px}.profile-item textarea{resize:vertical;min-height:100px}.profile-item input:focus,.profile-item textarea:focus{border-color:#ea7e69}.dashboard-wrapper{background:#f5f7fb;width:100%;min-height:100vh;display:flex}.sidebar{z-index:100;background:#fff;border-right:1px solid #e5e7eb;flex-direction:column;width:260px;height:100vh;padding:24px 18px;display:flex;position:fixed;top:0;left:0}.logo-section{justify-content:center;align-items:center;margin-bottom:35px;display:flex}.logo-section img{object-fit:contain;width:120px}.nav-menu{flex-direction:column;gap:10px;display:flex}.nav-item{cursor:pointer;color:#334155;border-radius:16px;align-items:center;gap:14px;padding:14px 16px;font-size:.97rem;font-weight:700;transition:background .25s,color .25s,transform .15s;display:flex}.nav-item svg{font-size:1.2rem}.nav-item:hover{color:#56bbc4;background:#56bbc41f;transform:translate(2px)}.nav-item.active{color:#fff;background:#56bbc4;box-shadow:0 10px 20px #56bbc440}.nav-item.active svg{color:#fff}.main-area{background:#f8fafc;flex-direction:column;flex:1;margin-left:260px;padding:20px;display:flex}.dashboard-header{background:#fffffff2;border:1px solid #e5e7eb;border-radius:22px;justify-content:space-between;align-items:center;width:100%;margin-bottom:20px;padding:18px 24px;display:flex;box-shadow:0 4px 10px #0f172a08,0 10px 25px #0f172a0a}.header-left{cursor:pointer;align-items:center;gap:14px;display:flex}.header-avatar{object-fit:cover;border:3px solid #56bbc433;border-radius:50%;width:52px;height:52px}.header-left h2{color:#0f172a;margin:0;font-size:1.05rem;font-weight:800}.header-left p{color:#64748b;margin-top:4px;font-size:.9rem;font-weight:600}.edit-profile-btn{color:#fff;cursor:pointer;background:#56bbc4;border:none;border-radius:14px;padding:12px 18px;font-size:.92rem;font-weight:700;transition:transform .15s,box-shadow .2s}.content-container{flex:1}@media (width<=900px){.sidebar{width:220px}.main-area{margin-left:220px}}@media (width<=700px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:16px}.edit-profile-btn{width:100%}}.dashboard-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffeb;border:1px solid #e8edf3;border-radius:22px;justify-content:space-between;align-items:center;width:100%;padding:18px 24px;transition:all .25s;display:flex;box-shadow:0 4px 10px #0f172a08,0 12px 30px #0f172a0d}.header-left{align-items:center;gap:16px;display:flex}.header-avatar{object-fit:cover;border:3px solid #38bdf833;border-radius:50%;width:52px;height:52px;transition:all .25s;box-shadow:0 4px 10px #38bdf826}.header-avatar:hover{transform:scale(1.03)}.header-left h2{color:#0f172a;letter-spacing:-.3px;margin:0;font-size:1.1rem;font-weight:800}.header-left p{color:#64748b;margin:4px 0 0;font-size:.9rem;font-weight:600}.edit-profile-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#38bdf8,#0ea5e9);border:none;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:12px 18px;font-size:.95rem;font-weight:700;transition:transform .15s,box-shadow .2s,opacity .2s;display:flex;box-shadow:0 10px 20px #0ea5e940}.edit-profile-btn:hover{transform:translateY(-2px);box-shadow:0 14px 28px #0ea5e959}.edit-profile-btn:active{transform:scale(.98)}.edit-profile-btn:focus-visible{outline-offset:3px;outline:3px solid #38bdf84d}@media (width<=768px){.dashboard-header{border-radius:18px;padding:16px}.header-avatar{width:46px;height:46px}.header-left h2{font-size:1rem}.edit-profile-btn{padding:10px 14px;font-size:.85rem}}@media (width<=560px){.dashboard-header{flex-direction:column;align-items:flex-start;gap:16px}.edit-profile-btn{width:100%}}.class-page{width:100%}.class-topbar{background:#fff;border:1px solid #dcdcdc;border-radius:18px;justify-content:space-between;align-items:center;margin-bottom:18px;padding:14px 20px;display:flex}.teacher-info{align-items:center;gap:14px;display:flex}.teacher-info img{object-fit:cover;border-radius:50%;width:52px;height:52px}.teacher-info h1{color:#000;margin:0;font-size:2.2rem;font-weight:900}.create-btn{color:#fff;cursor:pointer;background:#56bbc4;border:none;border-radius:14px;padding:12px 20px;font-size:1rem;font-weight:700}.page-title{color:#000;margin-bottom:18px;font-size:3rem;font-weight:900}.class-stats{grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:18px;display:grid}.stat-box{background:#fff;border:1px solid #d7d7d7;border-radius:22px;align-items:center;gap:18px;min-height:120px;padding:18px 20px;display:flex}.stat-icon{border-radius:20px;justify-content:center;align-items:center;width:76px;height:76px;font-size:34px;display:flex}.blue{background:#d9f7fb}.green{background:#dcf7e5}.yellow{background:#ffe57f}.stat-box h2{margin:0;font-size:3rem;font-weight:900}.stat-box p{color:#444;margin-top:6px;font-size:1rem}.search-box{margin-bottom:18px}.search-box input{border:1px solid #cfcfcf;border-radius:16px;outline:none;width:420px;height:52px;padding:0 18px;font-size:1rem}.class-card{background:#fff;border:1px solid #d7d7d7;border-radius:22px;grid-template-columns:90px 1.1fr 120px 1fr 220px;align-items:center;gap:16px;padding:14px 16px;display:grid}.class-icon{border-radius:18px;justify-content:center;align-items:center;width:72px;height:72px;font-size:32px;display:flex}.pink{background:#ffb3cc}.orange{background:#ffd76d}.cyan{background:#58c1cb}.purple{background:#af97ff}.class-name h2{color:#000;margin:0;font-size:2rem;font-weight:900}.status{border-radius:999px;margin-top:8px;padding:5px 16px;font-size:.95rem;font-weight:600;display:inline-block}.active-status{background:#c9f3f8}.done-status{color:#fff;background:#777}.student-count h3{margin:0;font-size:2rem;font-weight:900}.student-count p{margin-top:4px;font-size:1rem}.schedule h3{margin:0;font-size:1.6rem;font-weight:900}.schedule p{margin-top:6px;font-size:1rem}.progress-section p{margin-bottom:10px;font-size:1rem}.progress-pink{background:#ff79a8}.progress-yellow{background:#f8cf63}.progress-cyan{background:#49b7c3}.progress-purple{background:#a58cf0}.progress-value{text-align:right;margin-top:4px;font-size:.95rem;font-weight:900}.home-page{flex-direction:column;gap:22px;padding:5px;display:flex}.section-wrap{flex-direction:column;gap:14px;display:flex}.section-title-row{justify-content:space-between;align-items:center;display:flex}.section-title{color:#0f172a;letter-spacing:-.5px;margin:0;font-size:1.5rem;font-weight:800}.today-card{background:#fff;border:1px solid #e8edf3;border-radius:24px;align-items:center;gap:22px;padding:22px;transition:all .3s;display:flex;box-shadow:0 4px 10px #0f172a08,0 10px 25px #0f172a0a}.today-card:hover{transform:translateY(-2px)}.robot-img{object-fit:contain;background:#f8fafc;border-radius:18px;width:110px;height:110px;padding:12px}.today-card h2{color:#0f172a;margin:0;font-size:1.4rem;font-weight:800}.class-level{color:#64748b;margin-top:5px;font-size:.95rem;font-weight:600}.class-info{flex-wrap:wrap;gap:18px;margin-top:16px;display:flex}.class-info span{color:#334155;align-items:center;gap:8px;font-size:.95rem;font-weight:600;display:flex}.info-icon{color:#38bdf8;font-size:20px}.stat-card{background:#fff;border:1px solid #e8edf3;border-radius:22px;align-items:center;gap:16px;padding:22px;transition:all .25s;display:flex;box-shadow:0 4px 10px #0f172a08,0 10px 25px #0f172a0a}.stat-card:hover{transform:translateY(-3px)}.stat-icon{border-radius:18px;justify-content:center;align-items:center;width:65px;height:65px;display:flex}.stat-icon svg{font-size:28px}.blue{color:#0ea5e9;background:#dff5fb}.green{color:#16a34a;background:#dcfce7}.red{color:#f43f5e;background:#ffe4e6}.stat-card h3{color:#0f172a;margin:0;font-size:1.6rem;font-weight:800}.stat-card p{color:#64748b;margin-top:4px;font-size:.95rem;font-weight:600;line-height:1.4}.overview-grid{grid-template-columns:1fr 1fr;gap:18px;display:grid}.overview-card{background:#fff;border:1px solid #e8edf3;border-radius:24px;padding:22px;box-shadow:0 4px 10px #0f172a08,0 10px 25px #0f172a0a}.overview-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.overview-header h3{color:#0f172a;margin:0;font-size:1.15rem;font-weight:800}.overview-header span{color:#38bdf8;cursor:pointer;font-weight:700}.overview-item{align-items:center;gap:16px;margin-bottom:20px;display:flex}.overview-item:last-child{margin-bottom:0}.gear{color:#f43f5e;background:#ffe4e6;border-radius:16px;justify-content:center;align-items:center;width:55px;height:55px;display:flex}.gear svg{font-size:24px}.overview-info{flex:1}.overview-info h4{color:#0f172a;margin:0;font-size:1rem;font-weight:800}.overview-info p{color:#64748b;margin:5px 0 10px;font-size:.93rem;font-weight:600}.progress-bar{background:#e2e8f0;border-radius:20px;width:100%;height:8px;overflow:hidden}.progress{background:linear-gradient(90deg,#ff7aa2,#ff4d8d);border-radius:20px;height:100%}.calendar-item{gap:16px;margin-bottom:20px;display:flex}.calendar-item:last-child{margin-bottom:0}.date-box{text-align:center;background:#f8fafc;border:1px solid #e2e8f0;border-radius:18px;width:75px;min-width:75px;padding:12px}.date-box span{color:#64748b;font-size:.85rem;font-weight:700;display:block}.date-box h2{color:#0f172a;margin:5px 0 0;font-size:1.7rem;font-weight:800}.calendar-item h4{color:#0f172a;margin:0;font-size:1rem;font-weight:800}.calendar-item p{color:#64748b;margin:6px 0 10px;font-size:.93rem;font-weight:600}.calendar-time{color:#334155;align-items:center;gap:7px;font-size:.92rem;font-weight:700;display:flex}@media (width<=1000px){.stats-grid,.overview-grid{grid-template-columns:1fr}}@media (width<=700px){.today-card{flex-direction:column;align-items:flex-start}.robot-img{width:90px;height:90px}.class-info{flex-direction:column;gap:10px}}.view-link{color:#2563eb;font-size:14px;font-weight:600;text-decoration:none;transition:all .2s}.view-link:hover{color:#1d4ed8}.myclasses-page{color:#1e293b;flex-direction:column;gap:24px;width:100%;font-family:Inter,sans-serif;display:flex}.myclasses-header{background:#fff;border:1px solid #e5e7eb;border-radius:20px;justify-content:space-between;align-items:center;padding:12px 24px;display:flex}.myclasses-profile{align-items:center;gap:12px;display:flex}.myclasses-profile img{object-fit:cover;border-radius:50%;width:45px;height:45px}.myclasses-profile h1{margin:0;font-size:1.5rem;font-weight:800}.create-btn{color:#fff;cursor:pointer;background:#56bbc4;border:none;border-radius:12px;align-items:center;gap:6px;padding:10px 18px;font-size:.9rem;font-weight:700;transition:background .2s;display:flex}.create-btn:hover{background:#45a4ad}.page-title{margin:8px 0 0;font-size:2.2rem;font-weight:800}.stats-card{background:#fff;border:1px solid #e2e8f0;border-radius:24px;align-items:center;gap:20px;padding:24px;display:flex}.stats-icon{border-radius:18px;justify-content:center;align-items:center;width:64px;height:64px;display:flex}.stats-card.blue .stats-icon{color:#56bbc4;background:#e0f7fa}.stats-card.green .stats-icon{color:#53c58a;background:#e8f5e9}.stats-card.yellow .stats-icon{color:#e1b500;background:#fef9c3}.stats-info{flex-direction:column;display:flex}.stats-info h2{margin:0;font-size:2.2rem;font-weight:800;line-height:1}.stats-info p{color:#64748b;margin:4px 0 0;font-size:1rem;font-weight:500}.search-box{box-sizing:border-box;background:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:center;gap:12px;width:450px;padding:10px 16px;display:flex}.search-box svg,.search-box i{color:#94a3b8;align-items:center;font-size:1.2rem;display:flex}.search-box input{color:#1e293b;background:0 0;border:none;outline:none;width:100%;padding:0;font-size:1rem}.search-box input::placeholder{color:#94a3b8}.class-list{flex-direction:column;gap:16px;display:flex}.class-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;grid-template-columns:2.2fr 1fr 1.5fr 1.8fr;align-items:center;padding:20px 24px;display:grid}.class-left{align-items:center;gap:16px;display:flex}.class-icon{border-radius:14px;justify-content:center;align-items:center;width:60px;height:60px;display:flex}.bg-robotic{color:#db2777;background:#fce7f3}.bg-programing{color:#ca8a04;background:#fef9c3}.bg-science{color:#0284c7;background:#e0f2fe}.bg-desain{color:#9333ea;background:#f3e8ff}.class-details{flex-direction:column;display:flex}.class-details h2{margin:0;font-size:1.3rem;font-weight:800}.status{color:#0d9488;background:#ccfbf1;border-radius:20px;align-self:flex-start;margin-top:4px;padding:4px 12px;font-size:.8rem;font-weight:700;display:inline-block}.status.done{color:#475569;background:#e2e8f0}.class-student h2{margin:0;font-size:1.3rem;font-weight:800}.class-student p{color:#94a3b8;margin:2px 0 0;font-size:.9rem}.class-schedule h3{margin:0;font-size:1.05rem;font-weight:800}.class-schedule p{color:#94a3b8;margin:4px 0 0;font-size:.95rem}.class-progress{flex-direction:column;display:flex}.class-progress h3{color:#64748b;margin:0 0 8px;font-size:.95rem;font-weight:500}.progress-container{align-items:center;gap:12px;display:flex}.progress-bar{background:#f1f5f9;border-radius:20px;flex-grow:1;height:12px;overflow:hidden}.progress-fill{border-radius:20px;height:100%}.fill-robotic{background:#f472b6}.fill-programing{background:#fbbf24}.fill-science{background:#22d3ee}.fill-desain{background:#a78bfa}.class-progress span{color:#0f172a;white-space:nowrap;font-size:.85rem;font-weight:800}.calendar-page-container{box-sizing:border-box;background:0 0;flex-direction:column;gap:20px;width:100%;display:flex}.calendar-filters-top{flex-direction:column;align-items:center;gap:14px;display:flex}.dropdown-selectors{gap:12px;display:flex}.cal-select{color:#111827;cursor:pointer;background:#fff;border:1px solid #d8dee9;border-radius:8px;outline:none;min-width:120px;height:40px;padding:0 12px;font-size:14px}.calendar-navigation-title{align-items:center;gap:18px;display:flex}.current-month-text{color:#111827;font-size:30px;font-weight:600}.nav-arrow-buttons{gap:8px;display:flex}.arrow-btn{cursor:pointer;color:#4b5563;background:#fff;border:1px solid #d8dee9;border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.arrow-btn:hover{background:#f8fafc}.calendar-grid-card{background:#fff;flex-direction:column;width:100%;display:flex;overflow:hidden}.calendar-grid-header{border-bottom:1px solid #ececec;grid-template-columns:70px repeat(7,1fr);display:grid}.time-column-header{border-right:1px solid #ececec}.day-header-cell{border-right:1px solid #ececec;flex-direction:column;padding:12px;display:flex}.day-header-cell:last-child{border-right:none}.day-name{color:#6b7280;text-transform:uppercase;font-size:11px;font-weight:700}.day-date{color:#111827;margin-top:4px;font-size:18px;font-weight:700}.calendar-grid-body{flex-direction:column;display:flex}.calendar-time-row{border-bottom:1px solid #ececec;grid-template-columns:70px 1fr;min-height:74px;display:grid}.calendar-time-row:last-child{border-bottom:none}.time-label-cell{color:#9ca3af;text-align:center;background:#fff;border-right:1px solid #ececec;padding-top:10px;font-size:13px}.days-slots-row{grid-template-columns:repeat(7,1fr);display:grid}.event-slot-cell{box-sizing:border-box;border-right:1px solid #ececec;padding:2px;position:relative}.event-slot-cell:last-child{border-right:none}.today-highlight{background:#eef6ff!important}.event-card-item{box-sizing:border-box;text-align:left;border-radius:4px;flex-direction:column;gap:3px;width:calc(100% - 4px);min-height:66px;margin:2px;padding:8px;display:flex}.event-card-time-row{align-items:center;gap:4px;font-size:12px;font-weight:700;display:flex}.video-icon-style{width:12px;height:12px}.event-teacher{font-size:13px;font-weight:700;line-height:1.2}.event-subject,.event-subject-only{font-size:13px;font-weight:600;line-height:1.2}.blue-schedule-card{color:#0284c7;background:#eaf7ff;border-left:3px solid #0284c7}.purple-schedule-card{color:#7c3aed;background:#f4ecff;border-left:3px solid #7c3aed}.red-schedule-card{color:#e11d48;background:#ffe7ec;border-left:3px solid #e11d48}.orange-schedule-card{color:#d97706;background:#fff3e0;border-left:3px solid #d97706}@media (width<=992px){.current-month-text{font-size:22px}.calendar-time-row{min-height:65px}.day-date{font-size:16px}.event-card-item{min-height:58px;padding:6px}}.feedback-page{color:#1e293b;box-sizing:border-box;background-color:#fff;width:100%;padding:24px;font-family:Inter,sans-serif}.feedback-top-bar{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;justify-content:space-between;align-items:center;margin-bottom:24px;padding:12px 24px;display:flex}.profile-info-group{align-items:center;gap:12px;display:flex}.avatar-placeholder{background-color:#f1f5f9;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.2rem;display:flex}.welcome-text{color:#0f172a;margin:0;font-size:1.4rem;font-weight:800}.edit-profile-btn{color:#fff;cursor:pointer;background-color:#4fb2be;border:none;border-radius:20px;align-items:center;gap:6px;padding:8px 16px;font-size:.85rem;font-weight:600;display:flex}.feedback-dashboard-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;margin-bottom:24px;padding:24px}.feedback-dashboard-inner{justify-content:space-between;gap:24px;display:flex}.left-alert-panel{flex-grow:1}.section-title-main{color:#0f172a;margin-top:0;margin-bottom:20px;font-size:1.4rem;font-weight:800}.deadline-alert-box{background-color:#fff1f2;border:1px solid #ffe4e6;border-radius:12px;align-items:flex-start;gap:14px;padding:16px;display:flex}.alert-text-wrapper{flex-direction:column;gap:4px;display:flex}.alert-title{color:#1e293b;font-size:.95rem;font-weight:700}.highlight-red{color:#ef4444}.alert-subtitle{color:#475569;margin:0;font-size:.85rem}.right-counter-panel{text-align:center;box-sizing:border-box;border:1px solid #e2e8f0;border-radius:12px;width:140px;padding:14px}.counter-label{color:#475569;margin:0;font-size:.75rem}.counter-number{color:#0f172a;margin:4px 0;font-size:2rem;font-weight:800}.counter-status-text{color:#ef4444;margin:0;font-size:.85rem;font-weight:700}.feedback-main-container{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:24px}.class-selector-group{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.selector-label{color:#0f172a;font-size:.95rem;font-weight:700}.class-dropdown-select{color:#334155;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;outline:none;width:100%;padding:10px 16px;font-size:.9rem}.info-deadline-banner{color:#334155;background-color:#f0f9ff;border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:24px;padding:12px 16px;font-size:.8rem;display:flex}.info-left-text{align-items:center;gap:8px;display:flex}.info-right-text{align-items:center;gap:16px;display:flex}.badge-countdown{color:#fff;background-color:#38bdf8;border-radius:6px;padding:4px 10px;font-weight:700}.list-title{color:#0f172a;margin-top:0;margin-bottom:14px;font-size:1.1rem;font-weight:700}.list-container{flex-direction:column;gap:12px;display:flex}.student-row-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.student-left-info{align-items:center;gap:20px;display:flex}.row-index-number{color:#0f172a;width:16px;font-size:1.1rem;font-weight:800}.student-avatar-img{object-fit:cover;background-color:#e2e8f0;border-radius:50%;width:44px;height:44px}.student-name-text{color:#1e293b;font-size:1.1rem;font-weight:700}.student-right-actions{align-items:center;gap:40px;display:flex}.status-badge{text-align:center;border-radius:20px;min-width:80px;padding:4px 16px;font-size:.85rem;font-weight:600}.status-badge.badge-pending{color:#f43f5e;background-color:#fff1f2;border:1px solid #ffe4e6}.status-badge.badge-success{color:#16a34a;background-color:#f0fdf4;border:1px solid #dcfce7}.action-button-group{justify-content:flex-end;width:160px;display:flex}.action-btn-feedback{color:#fff;cursor:pointer;background-color:#4fb2be;border:none;border-radius:8px;width:100%;padding:10px 16px;font-size:.85rem;font-weight:600}.completed-action-wrapper{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.action-btn-edit{color:#4fb2be;cursor:pointer;background-color:#fff;border:1px solid #4fb2be;border-radius:8px;width:100%;padding:8px 16px;font-size:.85rem;font-weight:600}.filled-timestamp-text{color:#94a3b8;white-space:nowrap;font-size:.65rem}.fb-modal-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:9999;background:#00000073;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.2s ease-out fadeIn;display:flex;position:fixed;inset:0}.fb-modal-content{background:#fff;border-radius:20px;width:90%;max-width:680px;padding:36px;animation:.25s ease-out slideUp;position:relative;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.fb-modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.fb-modal-title{color:#0f172a;margin:0;font-size:1.5rem;font-weight:700}.fb-modal-close-btn{cursor:pointer;background:#f1f5f9;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:all .2s;display:flex}.fb-modal-close-btn:hover{background:#e2e8f0}.fb-modal-student-profile{background:#f8fafc;border-radius:12px;align-items:center;gap:16px;margin-bottom:28px;padding:12px 16px;display:flex}.fb-modal-avatar{object-fit:cover;background:#e2e8f0;border-radius:50%;width:52px;height:52px}.fb-modal-student-name{color:#1e293b;font-size:1.2rem;font-weight:700}.fb-modal-body{flex-direction:column;gap:22px;display:flex}.fb-modal-field-group{flex-direction:column;gap:10px;display:flex}.fb-modal-label{color:#0f172a;font-size:1rem;font-weight:700}.fb-modal-textarea{color:#334155;resize:vertical;box-sizing:border-box;border:1px solid #cbd5e1;border-radius:12px;outline:none;width:100%;min-height:240px;padding:16px;font-family:inherit;font-size:1rem;line-height:1.6;transition:border-color .2s,box-shadow .2s}.fb-modal-textarea::placeholder{color:#94a3b8}.fb-modal-textarea:focus{border-color:#4fb2be;box-shadow:0 0 0 4px #4fb2be26}.fb-modal-upload-wrapper{align-items:center;display:flex;position:relative}.fb-modal-upload-input{color:#64748b;box-sizing:border-box;background:#fff;border:1px solid #cbd5e1;border-radius:12px;outline:none;width:100%;padding:14px 60px 14px 16px;font-size:.95rem}.fb-modal-upload-input:focus{border-color:#4fb2be}.fb-modal-upload-btn{cursor:pointer;background:#f8fafc;border:none;border-radius:10px;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s;display:flex;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.fb-modal-upload-btn:hover{background:#e2e8f0}.fb-modal-upload-btn input{display:none}.upload-error{color:#ef4444;margin-top:8px;font-size:13px;font-weight:500}.image-preview-container{border:1px solid #e2e8f0;border-radius:12px;margin-top:10px;position:relative;overflow:hidden}.image-preview{object-fit:cover;width:100%;max-height:250px;display:block}.remove-image-btn{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:35px;height:35px;font-size:18px;font-weight:700;transition:all .2s;display:flex;position:absolute;top:10px;right:10px}.remove-image-btn:hover{background:#dc2626}.fb-modal-footer{justify-content:center;align-items:center;gap:16px;margin-top:32px;display:flex}.fb-btn-cancel{color:#334155;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:10px;padding:12px 32px;font-size:1rem;font-weight:600;transition:all .2s}.fb-btn-cancel:hover{background:#f8fafc;border-color:#94a3b8}.fb-btn-submit{color:#fff;cursor:pointer;background:#4fb2be;border:none;border-radius:10px;padding:12px 32px;font-size:1rem;font-weight:600;transition:all .2s}.fb-btn-submit:hover{background:#3f9aa5}.fb-btn-submit:active{transform:scale(.98)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=768px){.fb-modal-content{width:95%;max-height:90vh;padding:20px;overflow-y:auto}.fb-modal-title{font-size:1.25rem}.fb-modal-avatar{width:46px;height:46px}.fb-modal-student-name{font-size:1rem}.fb-modal-textarea{min-height:180px}.fb-modal-footer{flex-direction:column}.fb-btn-cancel,.fb-btn-submit{width:100%}}.fb-btn-submit:disabled{color:#f1f5f9;cursor:not-allowed;opacity:.7;background:#94a3b8;transform:none}.fb-btn-cancel:focus-visible,.fb-btn-submit:focus-visible{outline-offset:2px;outline:3px solid #4fb2be66}.salary-page{color:#0f172a;box-sizing:border-box;background-color:#fff;width:100%;padding:32px;font-family:Inter,sans-serif}.salary-main-title{color:#0f172a;margin-top:0;margin-bottom:24px;font-size:1.8rem;font-weight:800}.salary-summary-grid{grid-template-columns:repeat(3,1fr);gap:24px;margin-bottom:32px;display:grid}.summary-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;align-items:flex-start;gap:16px;padding:24px;display:flex;position:relative;overflow:hidden;box-shadow:0 1px 3px #00000003}.card-icon-wrapper{border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.icon-total{background-color:#ecfdf5}.icon-pending{background-color:#fffbeb}.icon-paid{background-color:#f0fdf4}.card-info-content{flex-direction:column;gap:4px;display:flex}.card-label{color:#475569;margin:0;font-size:.85rem;font-weight:500}.card-amount-group{flex-direction:column;gap:2px;display:flex}.currency-symbol{color:#0f172a;font-size:1.2rem;font-weight:800}.card-amount{color:#0f172a;margin:0;font-size:1.6rem;font-weight:800}.amount-pending .currency-symbol,.amount-pending .card-amount{color:#d97706}.amount-paid .currency-symbol,.amount-paid .card-amount{color:#10b981}.card-subtext{color:#94a3b8;margin:0;font-size:.8rem}.card-bottom-bar{height:4px;position:absolute;bottom:0;left:0;right:0}.bar-total{background-color:#4fb2be}.bar-pending{background-color:#f59e0b}.bar-paid{background-color:#10b981}.salary-main-container{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:24px 0 0;overflow:hidden}.salary-filter-row{grid-template-columns:210px 220px 1fr;gap:16px;padding:0 24px 24px;display:grid}.filter-input-wrapper{background-color:#fff;border:1px solid #cbd5e1;border-radius:12px;align-items:center;gap:10px;padding:10px 14px;display:flex}.filter-select{color:#334155;cursor:pointer;appearance:none;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") 100% no-repeat;border:none;outline:none;width:100%;padding-right:20px;font-size:.9rem;font-weight:500}.filter-search-input{color:#334155;background:0 0;border:none;outline:none;width:100%;font-size:.9rem}.filter-search-input::placeholder{color:#94a3b8}.salary-table-responsive{width:100%;overflow-x:auto}.salary-table{border-collapse:collapse;width:100%;font-size:.95rem}.salary-table thead{background-color:#fff;border-top:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}.salary-table th{color:#0f172a;padding:16px 12px;font-size:.95rem;font-weight:700}.salary-table tbody tr{border-bottom:1px solid #f1f5f9}.salary-table tbody tr:last-child{border-bottom:none}.salary-table td{vertical-align:middle;padding:16px 12px}.class-cell-group{flex-direction:column;gap:2px;display:flex}.class-name-main{color:#1e293b;font-weight:600}.class-grade-sub{color:#94a3b8;font-size:.8rem}.status-pill{text-align:center;border-radius:6px;min-width:65px;padding:4px 14px;font-size:.8rem;font-weight:700;display:inline-block}.pill-paid{color:#10b981;background-color:#e6fcf5}.pill-pending{color:#f59e0b;background-color:#fff3e0}.create-class-page{color:#0f172a;box-sizing:border-box;background-color:#fff;width:100%;padding:24px 32px;font-family:Inter,sans-serif}.cc-top-bar{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-sizing:border-box;background:#ffffffeb;border:1px solid #e8edf3;border-radius:22px;justify-content:space-between;align-items:center;width:100%;margin-bottom:24px;padding:18px 24px;display:flex;box-shadow:0 4px 10px #0f172a08,0 12px 30px #0f172a0d}.cc-profile-group{align-items:center;gap:16px;display:flex}.cc-profile-avatar{object-fit:cover;border:3px solid #38bdf833;border-radius:50%;width:52px;height:52px;transition:all .25s;box-shadow:0 4px 10px #38bdf826}.cc-profile-avatar:hover{transform:scale(1.03)}.cc-profile-text{text-align:left;flex-direction:column;display:flex}.cc-welcome-text{color:#0f172a;letter-spacing:-.3px;margin:0;font-size:1.1rem;font-weight:800}.cc-sub-text{color:#64748b;margin:4px 0 0;font-size:.9rem;font-weight:600}.cc-back-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.cc-back-btn:hover{color:#0f172a;background-color:#f1f5f9}.cc-edit-link-btn{color:#64748b;cursor:pointer;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:6px;align-items:center;gap:4px;padding:4px 8px;font-size:.75rem;font-weight:600;transition:all .2s;display:flex}.cc-edit-link-btn:hover{color:#0f172a;background-color:#f1f5f9;border-color:#cbd5e1}.cc-gdrive-card{color:#475569;box-sizing:border-box;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;align-items:center;gap:10px;width:100%;margin-bottom:16px;padding:10px 16px;font-size:.9rem;display:flex}.cc-section-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.cc-main-title{color:#0f172a;margin:0;font-size:1.8rem;font-weight:800}.cc-save-btn{color:#fff;cursor:pointer;background-color:#4fb2be;border:none;border-radius:12px;padding:10px 20px;font-size:.9rem;font-weight:700;transition:background-color .2s}.cc-save-btn:hover{background-color:#3fa1ad}.cc-hero-card{box-sizing:border-box;background-color:#fff;border:1px solid #cbd5e1;border-radius:20px;justify-content:space-between;align-items:center;min-height:180px;margin-bottom:24px;padding:40px 48px;display:flex;position:relative;overflow:hidden}.cc-hero-left{flex-direction:column;display:flex}.cc-class-name-placeholder{color:#0f172a;margin:0 0 6px;font-size:2.4rem;font-weight:800}.cc-grade-placeholder{color:#475569;margin:0 0 32px;font-size:1.1rem;font-weight:500}.cc-meta-info-group{flex-direction:column;gap:12px;display:flex}.cc-meta-item{color:#475569;align-items:center;gap:10px;font-size:1rem;font-weight:500;display:flex}.cc-hero-right{justify-content:center;align-items:center;display:flex}.cc-robot-img{object-fit:contain;border-radius:16px;width:140px;height:140px}.cc-tabs-container{background-color:#fff;border:1px solid #4fb2be;border-radius:16px;overflow:hidden}.cc-tabs-nav{background-color:#4fb2be;align-items:center;gap:8px;padding:8px 16px;display:flex}.cc-tab-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:20px;padding:6px 16px;font-size:.9rem;font-weight:700;transition:all .2s}.cc-tab-btn.active{color:#4fb2be;background-color:#fff}.cc-tab-content{padding:32px}.cc-materials-panel{flex-direction:column;gap:20px;display:flex}.cc-form-group{flex-direction:column;gap:8px;display:flex}.cc-form-label{color:#0f172a;font-size:.95rem;font-weight:700}.cc-form-input{color:#334155;box-sizing:border-box;background-color:#e2e8f0;border:1px solid #cbd5e1;border-radius:8px;outline:none;width:100%;max-width:480px;padding:12px 16px;font-size:.9rem;transition:all .2s}.cc-form-input:focus{background-color:#fff;border-color:#4fb2be;box-shadow:0 0 0 2px #4fb2be26}.cc-form-input::placeholder{color:#94a3b8}.cc-upload-zone{cursor:pointer;background-color:#fff;border:2px dashed #4fb2be;border-radius:16px;justify-content:center;align-items:center;margin-top:16px;padding:24px;display:flex}.cc-upload-inner{align-items:center;gap:16px;display:flex}.cc-upload-text-group{flex-direction:column;gap:4px;display:flex}.cc-upload-main-text{color:#475569;margin:0;font-size:.95rem;font-weight:700}.cc-link-highlight{color:#4fb2be;text-decoration:none}.cc-upload-sub-text{color:#94a3b8;margin:0;font-size:.8rem}.cc-empty-tab-text{color:#94a3b8;text-align:center;padding:80px 0;font-size:.95rem}.cc-file-list-container{margin-top:20px;animation:.2s ease-out fadeIn}.cc-file-list-title{color:#1e293b;margin-bottom:10px;font-size:.95rem;font-weight:700}.cc-file-list{flex-direction:column;gap:8px;display:flex}.cc-file-item{background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;justify-content:space-between;align-items:center;padding:10px 16px;transition:background-color .15s;display:flex}.cc-file-item:hover{background-color:#f1f5f9}.cc-file-item-left{align-items:center;gap:12px;display:flex;overflow:hidden}.cc-file-details{flex-direction:column;display:flex;overflow:hidden}.cc-file-name{color:#334155;white-space:nowrap;text-overflow:ellipsis;font-size:.9rem;font-weight:600;overflow:hidden}.cc-file-size{color:#64748b;font-size:.75rem}.cc-file-remove-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:50%;padding:4px 8px;font-size:.85rem;font-weight:700;transition:all .2s}.cc-file-remove-btn:hover{color:#ef4444;background-color:#fee2e2}.cc-upload-error-msg{color:#ef4444;margin-top:8px;font-size:.85rem;font-weight:500}*{box-sizing:border-box;margin:0;padding:0}body{color:#1e293b;-webkit-font-smoothing:antialiased;background-color:#f8fafc;font-family:Inter,Plus Jakarta Sans,system-ui,-apple-system,sans-serif}.admin-layout{background-color:#f8fafc;min-height:100vh;display:flex}.sidebar{z-index:50;background-color:#fff;border-right:1px solid #f1f5f9;flex-direction:column;width:260px;height:100vh;padding:24px 16px;display:flex;position:fixed;top:0;left:0;box-shadow:0 1px 3px #0000000d}.sidebar-logo-section{justify-content:center;margin-top:16px;margin-bottom:28px;padding:0 8px;display:flex}.logo-box{background:0 0;border:none;justify-content:center;align-items:center;width:100%;display:flex}.sidebar-logo-img{object-fit:contain;width:55%;height:auto}.sidebar-nav{flex-direction:column;gap:8px;display:flex}.nav-item{color:#64748b;border-radius:12px;align-items:center;gap:16px;padding:14px 16px;font-size:15px;font-weight:600;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover{color:#1e293b;background-color:#f8fafc}.nav-icon{color:#94a3b8;justify-content:center;align-items:center;display:flex}.nav-item.active{color:#fff;background-color:#56bbc4;box-shadow:0 4px 12px #56bbc440}.nav-item.active .nav-icon{color:#fff}.main-content-container{flex-direction:column;flex:1;margin-left:260px;display:flex}.top-navbar{z-index:40;background-color:#0000;justify-content:space-between;align-items:center;padding:20px 32px;display:flex;position:sticky;top:0}.header-title h1{color:#0f172a;margin:0;font-size:28px;font-weight:700}.header-title p{color:#64748b;margin:4px 0 0;font-size:14px}.header-actions{align-items:center;gap:24px;display:flex}.notification-trigger{color:#1e293b;cursor:pointer;background:#fff;border-radius:50%;align-items:center;padding:8px;display:flex;position:relative;box-shadow:0 2px 8px #0000000a}.badge-count{color:#fff;background-color:#ef4444;border:2px solid #fff;border-radius:90px;justify-content:center;align-items:center;min-width:18px;height:18px;font-size:10px;font-weight:700;display:flex;position:absolute;top:-4px;right:-4px}.admin-profile{cursor:pointer;background:#fff;border-radius:30px;align-items:center;gap:12px;padding:6px 14px 6px 6px;display:flex;box-shadow:0 2px 8px #0000000a}.avatar-circle{color:#475569;background-color:#e2e8f0;border:1px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.profile-info{flex-direction:column;display:flex}.profile-role-row{align-items:center;gap:4px;display:flex}.profile-role{color:#64748b;font-size:12px}.dropdown-arrow{color:#64748b}.profile-name{color:#1e293b;margin:0;font-size:14px;font-weight:600}.dashboard-main-view{flex:1;padding:0 32px 32px}.notif-overlay{z-index:999;background-color:#0000000a;justify-content:flex-end;align-items:flex-start;width:100vw;height:100vh;display:flex;position:fixed;inset:0}.notif-modal-card{background:#fff;border:1px solid #f0f0f0;border-radius:16px;flex-direction:column;width:400px;max-width:90vw;height:calc(100vh - 40px);margin:20px;animation:.3s ease-out slideInRight;display:flex;overflow:hidden;box-shadow:0 10px 30px #00000014}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.notif-modal-header{border-bottom:1px solid #f3f4f6;justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.notif-modal-header h3{color:#111827;margin:0;font-size:1.2rem;font-weight:700}.notif-close-btn{color:#9ca3af;cursor:pointer;background:0 0;border:none;font-size:24px;transition:color .2s}.notif-close-btn:hover{color:#374151}.notif-tabs{background-color:#fff;border-bottom:1px solid #f3f4f6;gap:8px;padding:12px 24px;display:flex;overflow-x:auto}.notif-tab-btn{color:#9ca3af;text-transform:lowercase;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:20px;padding:6px 12px;font-size:.85rem;font-weight:500;transition:all .2s}.notif-tab-btn.active{color:#fff;background-color:#22d3ee}.notif-list-container{flex-direction:column;flex:1;gap:12px;padding:16px 24px;display:flex;overflow-y:auto}.notif-list-container::-webkit-scrollbar{width:5px}.notif-list-container::-webkit-scrollbar-thumb{background-color:#e5e7eb;border-radius:4px}.notif-item-card{background-color:#fff;border:1px solid #e5e7eb;border-radius:12px;align-items:flex-start;gap:14px;padding:12px;transition:transform .2s,box-shadow .2s;display:flex}.notif-item-card:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000008}.notif-text-content{text-align:left;flex-direction:column;gap:4px;display:flex}.notif-message{color:#374151;margin:0;font-size:.88rem;line-height:1.4}.notif-message strong{color:#111827;font-weight:600}.notif-hour{color:#6b7280;font-weight:400}.notif-time{color:#9ca3af;font-size:.78rem}.notif-icon-circle{border:1px solid #0000;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.notif-icon-circle.bg-green-light{color:#059669;background-color:#ecfdf5;border-color:#a7f3d0}.notif-icon-circle.bg-blue-light{color:#2563eb;background-color:#eff6ff;border-color:#bfdbfe}.notif-icon-circle.bg-orange-light{color:#ea580c;background-color:#fff7ed;border-color:#fed7aa}.notif-icon-circle.bg-pink-light{color:#db2777;background-color:#fdf2f8;border-color:#fbcfe8}.notif-icon-drive{background-color:#fff;border:1px solid #e5e7eb;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;display:flex;box-shadow:0 1px 3px #0000000d}@media (width>=768px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width>=1024px){.tables-row{flex-direction:row}.flex-7{flex:1.1;min-width:0}.flex-5{flex:.9;min-width:0}}@media (width>=640px){.actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.actions-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.modal-form input[type=text],.modal-form input[type=email],.modal-form input[type=date],.modal-form input[type=time],.modal-form textarea,.modal-form select{color:#374151;box-sizing:border-box;background-color:#e5e7eb;border:none;border-radius:6px;outline:none;width:100%;padding:10px 12px;font-size:.9rem}.home-container{box-sizing:border-box;flex-direction:column;gap:24px;width:100%;display:flex}.stats-grid{grid-template-columns:repeat(1,minmax(0,1fr));gap:24px;display:grid}@media (width>=768px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.stat-card{background-color:#fff;background-clip:padding-box;border-radius:16px;align-items:center;gap:20px;padding:20px 24px;display:flex;box-shadow:0 4px 6px -1px #00000005,0 2px 4px -1px #00000003}.border-teacher{border-left:4px solid #22d3ee}.border-student{border-left:4px solid #3b82f6}.border-classes{border-left:4px solid #a855f7}.border-feedback{border-left:4px solid #f97316}.bg-teacher{color:#06b6d4;background-color:#ecfeff}.bg-student{color:#2563eb;background-color:#eff6ff}.bg-classes{color:#9333ea;background-color:#faf5ff}.bg-feedback{color:#ea580c;background-color:#fff7ed}.icon-size{width:24px;height:24px}.stat-info{flex-direction:column;display:flex}.stat-label{color:#64748b;font-size:14px;font-weight:700}.stat-number{color:#0f172a;margin-top:4px;font-size:28px;font-weight:900;line-height:1}.tables-row{flex-direction:column;gap:24px;width:100%;display:flex}@media (width>=1024px){.tables-row{flex-direction:row}.flex-7{flex:1.1;min-width:0}.flex-5{flex:.9;min-width:0}}.data-table-card{box-sizing:border-box;background-color:#fff;border-radius:16px;flex-direction:column;padding:24px;display:flex;box-shadow:0 4px 6px -1px #00000005}.table-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.table-title{color:#0f172a;font-size:18px;font-weight:800}.table-link{color:#22d3ee;font-size:12px;font-weight:600;text-decoration:none}.table-link:hover{text-decoration:underline}.salary-summary{margin-bottom:24px}.salary-label{color:#94a3b8;font-size:12px;font-weight:700}.salary-amount{color:#0f172a;margin-top:6px;font-size:26px;font-weight:900}.table-responsive{width:100%;padding-bottom:4px;overflow-x:auto}.main-table{border-collapse:collapse;text-align:left;table-layout:auto;width:100%;font-size:14px}.main-table th{color:#94a3b8;white-space:nowrap;border-bottom:1.5px solid #000;padding:0 8px 12px;font-weight:700}.main-table td{color:#334155;white-space:nowrap;border-bottom:1px solid #f1f5f9;padding:14px 8px}.main-table th:first-child,.main-table td:first-child{padding-left:4px}.main-table th:last-child,.main-table td:last-child{padding-right:4px}.main-table tbody tr:last-child td{border-bottom:none}.text-dark{color:#0f172a!important}.text-gray{color:#64748b}.text-center{text-align:center}.text-right{text-align:right}.align-salary th:nth-child(2),.align-salary td:nth-child(2){text-align:center}.align-salary th:nth-child(3),.align-salary td:nth-child(3){text-align:right}.quick-action-card{background-color:#fff;border-radius:16px;padding:24px;box-shadow:0 4px 6px -1px #00000005}.quick-action-title{align-items:center;gap:12px;margin-bottom:20px;display:flex}.quick-action-title h3{color:#0f172a;font-size:16px;font-weight:800}.flash-badge{color:#fff;background-color:#3b82f6;border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;display:flex}.flash-icon{width:14px;height:14px}.actions-grid{grid-template-columns:repeat(1,minmax(0,1fr));gap:16px;display:grid}@media (width>=640px){.actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.actions-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.action-btn{cursor:pointer;text-align:left;background:0 0;border:1px solid #e2e8f0;border-radius:14px;align-items:center;gap:16px;width:100%;padding:16px;transition:all .2s ease-in-out;display:flex}.action-btn:hover{background-color:#f8fafc;transform:translateY(-1px)}.action-btn:first-child:hover{border-color:#93c5fd}.action-btn:nth-child(2):hover{border-color:#a7f3d0}.action-btn:nth-child(3):hover{border-color:#ddd6fe}.action-btn:nth-child(4):hover{border-color:#fed7aa}.action-icon-circle{border-radius:9999px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.bg-action-blue{background-color:#eff6ff}.bg-action-green{background-color:#ecfdf5}.bg-action-purple{background-color:#f5f3ff}.bg-action-orange{background-color:#fff7ed}.icon-size-sm{width:20px;height:20px}.action-text{flex-direction:column;display:flex}.action-name{color:#1e293b;font-size:14px;font-weight:700}.action-sub{color:#94a3b8;margin-top:2px;font-size:11px}.modal-overlay{z-index:999;background-color:#0006;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-card{background:#fff;border-radius:12px;width:100%;max-width:550px;padding:24px;font-family:inherit;position:relative;box-shadow:0 4px 20px #00000026}.modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-indicator{background-color:#00bcd4;border-radius:2px;width:4px;height:20px;display:inline-block}.modal-title-wrapper h3{color:#111827;margin:0;font-size:1.25rem;font-weight:700}.modal-close-btn{cursor:pointer;color:#6b7280;background:0 0;border:none;font-size:1.5rem;transition:color .2s}.modal-close-btn:hover{color:#111827}.modal-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-row{gap:16px;display:flex}.flex-1{flex:1}.form-group label{color:#111827;font-size:.95rem;font-weight:600}.modal-form input[type=text],.modal-form input[type=date],.modal-form input[type=time],.modal-form textarea,.modal-form select{color:#374151;box-sizing:border-box;background-color:#e5e7eb;border:none;border-radius:6px;outline:none;width:100%;padding:10px 12px;font-size:.9rem}.modal-form textarea{resize:none}.radio-group{gap:20px;margin-top:4px;display:flex}.radio-label{cursor:pointer;color:#111827;align-items:center;gap:8px;font-size:.95rem;font-weight:500;display:flex}.radio-label input[type=radio]{display:none}.custom-radio{background-color:#e5e7eb;border-radius:50%;width:16px;height:16px;display:inline-block;position:relative}.radio-label input[type=radio]:checked+.custom-radio{background-color:#d1d5db}.modal-actions{justify-content:flex-end;gap:12px;margin-top:12px;display:flex}.btn-save{color:#111827;cursor:pointer;background-color:#fff;border:1px solid #111827;border-radius:6px;padding:6px 20px;font-size:.9rem;font-weight:500}.btn-create{color:#fff;cursor:pointer;background-color:#4cd0e1;border:none;border-radius:6px;padding:6px 20px;font-size:.9rem;font-weight:500;box-shadow:0 2px 4px #0000001a}.btn-save:hover{background-color:#f3f4f6}.btn-create:hover{background-color:#26c6da}.student-modal{border-radius:12px;width:90%;max-width:550px;padding:24px}.student-indicator{border-radius:4px;width:4px;height:20px;display:inline-block;background-color:#22d3ee!important}.student-modal input[type=date].input-date-custom{color:#6b7280}.student-modal input[type=text],.student-modal input[type=email],.student-modal input[type=date]{box-sizing:border-box;color:#1f2937;background-color:#e5e7eb;border:none;border-radius:6px;outline:none;width:100%;padding:12px;font-size:14px}.student-modal input:focus{background-color:#d1d5db}.single-action{justify-content:flex-end;margin-top:20px;display:flex}.btn-save-custom{color:#fff;cursor:pointer;background-color:#4ec3cc;border:none;border-radius:6px;padding:10px 28px;font-size:15px;font-weight:500;transition:background .2s}.btn-save-custom:hover{background-color:#3caab3}.create-modal-content{background:#fff;border-radius:16px;width:500px;padding:24px;font-family:inherit;position:relative;box-shadow:0 4px 12px #00000026}.classes-page-container{flex-direction:column;gap:20px;width:100%;display:flex}.classes-header-section .header-text h2{color:#000;margin:0;font-size:26px;font-weight:700}.classes-header-section .header-text p{color:#64748b;margin:4px 0 0;font-size:14px}.filter-bar{background:#fff;border:1px solid #e2e8f0;border-radius:16px;align-items:center;gap:12px;width:100%;padding:16px;display:flex}.search-wrapper{flex:1;max-width:400px;position:relative}.search-icon{color:#94a3b8;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.search-wrapper input{color:#334155;border:1px solid #cbd5e1;border-radius:30px;outline:none;width:100%;padding:10px 16px 10px 44px;font-size:14px}.filter-dropdowns{gap:8px;display:flex}.dropdown-container{display:inline-block;position:relative}.dropdown-btn{color:#334155;cursor:pointer;-webkit-user-select:none;user-select:none;background:#fff;border:1px solid #cbd5e1;border-radius:30px;align-items:center;gap:10px;padding:10px 18px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dropdown-btn:hover{background-color:#f8fafc;border-color:#94a3b8}.dropdown-btn.has-value{color:#0d9488;background-color:#f0fdfa;border-color:#0d9488;font-weight:600}.dropdown-btn.active{border-color:#0d9488;box-shadow:0 0 0 2px #0d948826}.dropdown-arrow{color:#64748b;transition:transform .2s}.dropdown-arrow.rotated{transform:rotate(180deg)}.dropdown-menu{z-index:100;background:#fff;border:1px solid #e2e8f0;border-radius:12px;min-width:190px;max-height:280px;padding:6px;animation:.15s ease-out dropdownFadeIn;position:absolute;top:calc(100% + 6px);left:0;overflow-y:auto;box-shadow:0 10px 25px -5px #0000001a,0 8px 10px -6px #0000000d}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{color:#334155;cursor:pointer;white-space:nowrap;border-radius:8px;padding:8px 12px;font-size:13.5px;transition:background .15s,color .15s}.dropdown-item:hover{color:#0f172a;background-color:#f1f5f9}.dropdown-item.selected{color:#0d9488;background-color:#f0fdfa;font-weight:600}.dropdown-section-header{text-transform:uppercase;color:#94a3b8;letter-spacing:.5px;padding:6px 12px 2px;font-size:11px;font-weight:700}.dropdown-divider{background-color:#f1f5f9;height:1px;margin:4px 0}.btn-create-class{color:#fff;cursor:pointer;background-color:#4fb7c5;border:none;border-radius:12px;align-items:center;gap:8px;margin-left:auto;padding:11px 20px;font-size:15px;font-weight:600;display:flex;box-shadow:0 2px 6px #4fb7c533}.table-responsive{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;max-height:600px;position:relative;overflow:auto}.table-responsive::-webkit-scrollbar{width:6px;height:6px}.table-responsive::-webkit-scrollbar-track{background:#f8fafc;border-radius:8px}.table-responsive::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:8px}.table-responsive::-webkit-scrollbar-thumb:hover{background:#94a3b8}.classes-table{border-collapse:separate;border-spacing:0;text-align:left;width:100%;font-size:14px}.classes-table th{z-index:10;color:#475569;background-color:#f8fafc;border-bottom:1px solid #e2e8f0;padding:16px;font-weight:600;position:sticky;top:0}.classes-table td{color:#1e293b;vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:16px}.classes-table tr:last-child td{border-bottom:none}.font-semibold{font-weight:600}.schedule-cell{vertical-align:middle}.schedule-item-block{flex-direction:column;gap:2px;display:flex}.schedule-item-block+.schedule-item-block{border-top:1px dashed #e2e8f0;margin-top:6px;padding-top:6px}.schedule-day-text{color:#0f172a;font-size:14px;font-weight:500}.schedule-time-text{color:#0f172a;font-size:13.5px;font-weight:400}.status-badge{color:#1e293b;font-weight:500}.class-action-buttons{justify-content:center;align-items:center;gap:8px;display:inline-flex}.btn-edit-action,.btn-delete-action{cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:inline-flex}.btn-edit-action{color:#0f766e}.btn-edit-action:hover{color:#0d9488;background-color:#f0fdfa}.btn-delete-action{color:#ef4444}.btn-delete-action:hover{color:#b91c1c;background-color:#fee2e2}.teacher-detail-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;margin-top:10px;overflow:hidden}.tabs-container{border-bottom:1px solid #f1f5f9;gap:24px;padding:0 24px;display:flex}.tab-item{color:#64748b;cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;padding:14px 4px;font-size:14px;font-weight:600;transition:all .2s}.tab-item.active{color:#4fb7c5;border-bottom:3px solid #4fb7c5}.sessions-table-wrapper{padding:20px 24px;overflow-x:auto}.sessions-table-header-info{color:#334155;justify-content:space-between;align-items:center;margin-bottom:16px;font-size:14px;display:flex}.selected-class-badge{color:#166534;background-color:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:4px 12px;font-size:13.5px}.selected-class-meta{color:#64748b;font-size:13px}.sessions-mini-table{border-collapse:collapse;text-align:left;width:100%;font-size:13.5px}.sessions-mini-table th{color:#475569;background-color:#f8fafc;border-bottom:1px solid #e2e8f0;padding:12px 16px;font-weight:600}.sessions-mini-table td{vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:14px 16px}.sessions-mini-table tr:hover{background-color:#f8fafc}.session-date-col{flex-direction:column;gap:2px;display:flex}.session-time-badge{color:#0f172a;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;padding:4px 10px;font-size:12.5px;font-weight:500;display:inline-block}.teacher-name-assigned{color:#0f172a;font-weight:500}.teacher-name-unassigned{color:#94a3b8;font-style:italic}.status-pill{text-transform:capitalize;border-radius:20px;padding:4px 12px;font-size:12px;font-weight:600;display:inline-block}.status-pill.status-completed{color:#166534;background-color:#dcfce7}.status-pill.status-scheduled{color:#0369a1;background-color:#e0f2fe}.status-pill.status-cancelled{color:#991b1b;background-color:#fee2e2}.card-content{align-items:flex-start;padding:24px;display:flex}.profile-main-info{gap:20px;display:flex}.teacher-large-avatar{object-fit:cover;border-radius:50%;width:90px;height:90px}.profile-text-group h3{color:#000;margin:0 0 4px;font-size:20px;font-weight:700}.badge-guru-aktif{color:#22c55e;margin-bottom:16px;font-size:13px;font-weight:700;display:inline-block}.badge-guru-unassigned{color:#94a3b8;margin-bottom:16px;font-size:13px;font-weight:600;display:inline-block}.meta-list{flex-direction:column;gap:8px;display:flex}.meta-item{color:#64748b;align-items:center;gap:12px;font-size:13px;display:flex}.meta-item svg{color:#94a3b8}.additional-info-box{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:20px}.additional-info-box h4{color:#000;margin:0 0 16px;font-size:15px;font-weight:700}.info-grid{flex-direction:column;gap:10px;display:flex}.info-row{font-size:13px;line-height:1.4;display:flex}.info-label{color:#64748b;width:110px}.info-value{color:#1e293b;flex:1}.create-modal-overlay{z-index:1000;background:#0006;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.create-modal-content{background:#fff;border-radius:16px;width:500px;padding:24px;position:relative;box-shadow:0 4px 12px #00000026}.modal-close-btn{cursor:pointer;color:#64748b;background:0 0;border:none;font-size:20px;position:absolute;top:24px;right:24px}.modal-title-wrapper{align-items:center;margin-bottom:24px;display:flex}.modal-title-bar{background-color:#4fb7c5;border-radius:2px;width:4px;height:24px;margin-right:12px}.create-modal-content h3{color:#0f172a;margin:0;font-size:20px;font-weight:700}.modal-form-group{margin-bottom:16px}.modal-form-group label{color:#1e293b;margin-bottom:8px;font-size:14px;font-weight:600;display:block}.modal-input{color:#334155;box-sizing:border-box;background-color:#e2e8f0;border:none;border-radius:8px;outline:none;width:100%;padding:12px 16px;font-size:14px}.modal-input::placeholder{color:#94a3b8}.modal-input:focus{background-color:#f1f5f9;border:1px solid #cbd5e1}select.modal-input{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-position:right 14px center;background-repeat:no-repeat;padding-right:36px}.modal-input:disabled{cursor:not-allowed;opacity:.85}textarea.modal-input{resize:vertical;min-height:80px}.modal-row{gap:16px;display:flex}.modal-row .modal-form-group{flex:1}.modal-radio-group{align-items:center;gap:16px;height:44px;display:flex}.modal-radio-label{color:#1e293b;cursor:pointer;align-items:center;gap:8px;font-size:14px;font-weight:500;display:flex}.modal-footer{justify-content:flex-end;gap:12px;margin-top:32px;display:flex}.btn-modal-cancel{cursor:pointer;background:0 0;border:1px solid #1e293b;border-radius:8px;padding:10px 24px;font-weight:500}.btn-modal-create{color:#fff;cursor:pointer;background:#4fb7c5;border:none;border-radius:8px;padding:10px 24px;font-weight:500}.modal-radio-label input[type=radio]{display:none}.modal-custom-radio{box-sizing:border-box;background-color:#d1d5db;border-radius:50%;width:20px;height:20px;transition:all .2s;display:inline-block;position:relative}.modal-radio-label input[type=radio]:checked+.modal-custom-radio{background-color:#4fb7c5;border:4px solid #e2e8f0}.session-row-item{cursor:pointer;transition:all .15s ease-in-out}.session-row-item:hover{background-color:#f1f5f9!important}.session-row-item.selected-session-row{background-color:#f0fdfa!important}.session-number-badge{color:#0f172a;font-weight:600}.btn-view-teacher-link{color:#0d9488;cursor:pointer;white-space:nowrap;background:#f8fafc;border:1px solid #cbd5e1;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .2s}.btn-view-teacher-link:hover{color:#fff;background-color:#0d9488;border-color:#0d9488;box-shadow:0 2px 4px #0d948833}.session-active-indicator-pill{color:#0f766e;text-transform:uppercase;letter-spacing:.5px;background-color:#ccfbf1;border-radius:6px;margin-bottom:6px;padding:3px 10px;font-size:11.5px;font-weight:700;display:inline-block}.box-header-flex{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.box-header-flex h4{color:#0f172a;margin:0;font-size:15px;font-weight:700}.btn-back-to-sessions{color:#0284c7;cursor:pointer;background:0 0;border:none;padding:0;font-size:12.5px;font-weight:600}.btn-back-to-sessions:hover{text-decoration:underline}.session-switch-hint{color:#64748b;margin:0 0 12px;font-size:12px}.session-quick-list{flex-direction:column;gap:8px;max-height:220px;padding-right:4px;display:flex;overflow-y:auto}.session-quick-card{text-align:left;cursor:pointer;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;flex-direction:column;gap:4px;padding:10px 14px;transition:all .2s;display:flex}.session-quick-card:hover{background-color:#f1f5f9;border-color:#cbd5e1}.session-quick-card.active{background-color:#f0fdfa;border-color:#0d9488;box-shadow:0 0 0 1px #0d9488}.quick-card-header{justify-content:space-between;align-items:center;display:flex}.quick-session-badge{color:#0f172a;font-size:12.5px;font-weight:700}.quick-status-tag{text-transform:capitalize;border-radius:12px;padding:2px 8px;font-size:10.5px;font-weight:600}.quick-status-tag.status-completed{color:#166534;background-color:#dcfce7}.quick-status-tag.status-scheduled{color:#0369a1;background-color:#e0f2fe}.quick-teacher-text{align-items:center;gap:6px;font-size:12.5px;display:flex}.quick-teacher-label{color:#64748b;font-weight:500}.toast-notification{z-index:9999;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fff;border:1px solid #e2e8f0;border-radius:14px;align-items:center;gap:12px;min-width:320px;max-width:440px;padding:14px 20px;animation:.3s cubic-bezier(.16,1,.3,1) forwards toastSlideIn;display:flex;position:fixed;top:24px;right:24px;box-shadow:0 12px 32px #0f172a1f,0 4px 12px #0f172a14}@keyframes toastSlideIn{0%{opacity:0;transform:translateY(-20px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.toast-notification.toast-success{border-left:5px solid #10b981}.toast-notification.toast-success .toast-icon{color:#10b981}.toast-notification.toast-error{border-left:5px solid #ef4444}.toast-notification.toast-error .toast-icon{color:#ef4444}.toast-notification.toast-warning{border-left:5px solid #f59e0b}.toast-notification.toast-warning .toast-icon{color:#f59e0b}.toast-notification.toast-info{border-left:5px solid #0284c7}.toast-notification.toast-info .toast-icon{color:#0284c7}.toast-icon{flex-shrink:0;justify-content:center;align-items:center;display:flex}.toast-content{color:#1e293b;flex:1;font-size:14px;font-weight:500;line-height:1.4}.toast-close-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:4px;transition:all .15s;display:flex}.toast-close-btn:hover{color:#475569;background-color:#f1f5f9}.confirm-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:10000;background:#0f172a73;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.2s ease-out modalFadeIn;display:flex;position:fixed;top:0;left:0}.confirm-modal-content{text-align:center;background:#fff;border-radius:20px;width:90%;max-width:440px;padding:28px;animation:.25s cubic-bezier(.16,1,.3,1) modalScaleUp;box-shadow:0 20px 40px -8px #0f172a33}@keyframes modalScaleUp{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.confirm-icon-wrapper{color:#ef4444;background:#fef2f2;border:1px solid #fee2e2;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 16px;display:flex}.confirm-title{color:#0f172a;margin:0 0 8px;font-size:19px;font-weight:700}.confirm-message{color:#64748b;margin:0 0 24px;font-size:14px;line-height:1.5}.confirm-actions{justify-content:center;gap:12px;display:flex}.btn-confirm-cancel{color:#475569;cursor:pointer;background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;flex:1;padding:11px 20px;font-size:14px;font-weight:600;transition:all .2s}.btn-confirm-cancel:hover{color:#0f172a;background:#f1f5f9}.btn-confirm-proceed{cursor:pointer;border:none;border-radius:12px;flex:1;padding:11px 20px;font-size:14px;font-weight:600;transition:all .2s}.btn-confirm-proceed.danger{color:#fff;background:#ef4444;box-shadow:0 4px 12px #ef444440}.btn-confirm-proceed.danger:hover{background:#dc2626;box-shadow:0 6px 16px #dc262659}.teacher-page-container{flex-direction:column;gap:20px;width:100%;display:flex}.teacher-header-section h2{color:#0f172a;margin:0;font-size:28px;font-weight:700}.teacher-header-section p{color:#64748b;margin:4px 0 0;font-size:14px}.teacher-stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;width:100%;display:grid}.teacher-filter-bar{background:#fff;border:1px solid #e2e8f0;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:16px;display:flex}.teacher-table-responsive{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;overflow:hidden}.teacher-data-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.teacher-data-table th{color:#475569;background-color:#f8fafc;border-bottom:1px solid #e2e8f0;padding:16px;font-weight:600}.teacher-data-table td{color:#1e293b;vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:16px}.teacher-data-table tr:last-child td{border-bottom:none}.teacher-name-cell{font-weight:500}.teacher-detail-tabs-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;margin-top:8px;overflow:hidden}.teacher-avatar-img{object-fit:cover;border-radius:50%;width:90px;height:90px}.student-page-container{flex-direction:column;gap:20px;width:100%;display:flex}.student-stats-grid{grid-template-columns:repeat(4,1fr);gap:16px;width:100%;display:grid}.stat-card-item{background:#fff;border:1px solid #e2e8f0;border-radius:20px;align-items:center;gap:16px;padding:24px 20px;display:flex;position:relative;overflow:hidden}.stat-card-item:before{content:"";width:100%;height:4px;position:absolute;top:0;left:0}.stat-card-item.blue-cyan:before{background:linear-gradient(90deg,#4fb7c5,#bae6fd)}.stat-card-item.blue-primary:before{background:linear-gradient(90deg,#3b82f6,#93c5fd)}.stat-card-item.purple:before{background:linear-gradient(90deg,#a855f7,#c084fc)}.stat-card-item.orange:before{background:linear-gradient(90deg,#f97316,#fde047)}.stat-icon-wrapper{border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.stat-card-item.blue-cyan .stat-icon-wrapper{background-color:#e0f2fe}.stat-card-item.blue-primary .stat-icon-wrapper{background-color:#dbeafe}.stat-card-item.purple .stat-icon-wrapper{background-color:#f3e8ff}.stat-card-item.orange .stat-icon-wrapper{background-color:#ffedd5}.circle-inner-icon{border:2.5px solid;border-radius:50%;width:12px;height:12px}.stat-card-item.blue-cyan .circle-inner-icon{color:#0284c7}.stat-card-item.blue-primary .circle-inner-icon{color:#2563eb}.stat-card-item.purple .circle-inner-icon{color:#9333ea}.stat-card-item.orange .circle-inner-icon{color:#ea580c}.stat-text-info{flex-direction:column;display:flex}.stat-title{color:#1e293b;font-size:14px;font-weight:600}.stat-value{color:#000;margin-top:4px;font-size:24px;font-weight:800}.student-filter-bar{background:#fff;border:1px solid #e2e8f0;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:16px;display:flex}.search-input-wrapper{flex:1;position:relative}.search-icon-inside{color:#94a3b8;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.search-input-wrapper input{color:#334155;border:1px solid #cbd5e1;border-radius:12px;outline:none;width:100%;padding:11px 16px 11px 48px;font-size:14px}.filter-dropdown-group{gap:10px;display:flex}.filter-select-btn{color:#1e293b;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:12px;align-items:center;gap:10px;padding:11px 18px;font-size:14px;font-weight:500;display:flex}.student-table-responsive{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;overflow:hidden}.student-data-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.student-data-table th{color:#475569;background-color:#f8fafc;border-bottom:1px solid #e2e8f0;padding:16px;font-weight:600}.student-data-table td{color:#1e293b;vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:16px}.student-data-table tr:last-child td{border-bottom:none}.student-name-cell{font-weight:500}.status-badge-active{color:#10b981;font-weight:600}.action-buttons-cell{justify-content:center;align-items:center;gap:12px;display:flex}.btn-action-edit,.btn-action-delete{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:inline-flex}.btn-action-edit:hover{color:#0284c7;background-color:#e0f2fe}.btn-action-delete:hover{color:#ef4444;background-color:#fee2e2}.student-detail-tabs-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;margin-top:8px;overflow:hidden}.detail-tabs-navigation{border-bottom:1px solid #f1f5f9;gap:24px;padding:0 24px;display:flex}.tab-nav-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;padding:14px 4px;font-size:14px;font-weight:700}.tab-nav-btn.active{color:#ef4444;border-bottom:3px solid #ef4444}.detail-card-content{grid-template-columns:1.2fr 1fr;align-items:start;gap:32px;padding:24px;display:grid}.profile-identity-box{gap:20px;display:flex}.student-avatar-img{object-fit:cover;border-radius:50%;width:90px;height:90px}.identity-text-details h3{color:#000;margin:0;font-size:20px;font-weight:700}.label-status-active{color:#22c55e;margin-top:4px;margin-bottom:16px;font-size:13px;font-weight:700;display:inline-block}.identity-meta-rows{flex-direction:column;gap:8px;display:flex}.meta-row-item{color:#64748b;align-items:center;gap:12px;font-size:13px;display:flex}.meta-row-item svg{color:#94a3b8}.profile-supplementary-box{background-color:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:20px}.profile-supplementary-box h4{color:#000;margin:0 0 16px;font-size:15px;font-weight:700}.supplementary-rows-list{flex-direction:column;gap:10px;display:flex}.supp-row{font-size:13px;line-height:1.4;display:flex}.supp-label{color:#64748b;width:110px}.supp-value{color:#1e293b;flex:1}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background-color:#0f172a99;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.2s ease-out fadeIn;display:flex;position:fixed;top:0;left:0}.modal-content-box{background:#fff;border-radius:12px;flex-direction:column;width:90%;max-width:500px;max-height:90vh;padding:20px;animation:.3s ease-out slideUp;display:flex;overflow:hidden;box-shadow:0 10px 25px #00000026}.modal-header{background:#f8fafc;border:none;border-radius:4px;justify-content:space-between;align-items:center;padding:20px 24px;display:flex;position:relative}.modal-title-wrapper{align-items:center;gap:12px;display:flex}.modal-title-bar{background-color:#06b6d4;border-radius:2px;width:4px;height:20px}.modal-header h3{color:#0f172a;margin:0;font-size:18px;font-weight:700}.modal-close{color:#64748b;cursor:pointer;background:0 0;border:none;font-size:18px;position:absolute;top:12px;right:12px}.modal-close:hover{color:#0f172a}.modal-body-content{flex-direction:column;gap:20px;padding:20px 0;display:flex;overflow-y:auto}.form-group-custom{flex-direction:column;gap:8px;display:flex}.form-group-custom label{color:#1e293b;font-size:14px;font-weight:600}.form-group-custom input[type=text],.form-group-custom input[type=email],.form-group-custom select{color:#475569;background-color:#e2e8f0;border:none;border-radius:6px;outline:none;padding:12px 14px;font-size:14px;transition:background-color .2s}.form-group-custom input[type=text]:focus,.form-group-custom input[type=email]:focus,.form-group-custom select:focus{background-color:#cbd5e1}.modal-footer-actions{background:0 0;border-top:none;justify-content:flex-end;padding:10px 0 0;display:flex}.btn-save-primary{color:#fff;cursor:pointer;background-color:#4cd5c5;border:none;border-radius:6px;padding:10px 24px;font-size:14px;font-weight:600;transition:background-color .2s}.btn-save-primary:hover{background-color:#3bbcb3}.salary-page-container{box-sizing:border-box;flex-direction:column;gap:20px;width:100%;display:flex}.salary-summary-grid{grid-template-columns:repeat(4,1fr);gap:16px;width:100%;display:grid}.salary-summary-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;align-items:center;gap:16px;padding:24px 20px;display:flex;position:relative;overflow:hidden}.salary-summary-card:before{content:"";width:100%;height:4px;position:absolute;top:0;left:0}.salary-summary-card.total:before{background:linear-gradient(90deg,#4fb7c5,#bae6fd)}.salary-summary-card.due:before{background:linear-gradient(90deg,#3b82f6,#93c5fd)}.salary-summary-card.pending:before{background:linear-gradient(90deg,#a855f7,#c084fc)}.salary-summary-card.paid:before{background:linear-gradient(90deg,#f97316,#fde047)}.summary-icon-circle{border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.salary-summary-card.total .summary-icon-circle{color:#0284c7;background-color:#e0f2fe}.salary-summary-card.due .summary-icon-circle{color:#2563eb;background-color:#dbeafe}.salary-summary-card.pending .summary-icon-circle{color:#9333ea;background-color:#f3e8ff}.salary-summary-card.paid .summary-icon-circle{color:#ea580c;background-color:#ffedd5}.inner-icon-dot{border:2.5px solid;border-radius:50%;width:12px;height:12px}.summary-info-text{flex-direction:column;display:flex}.summary-card-title{color:#1e293b;font-size:14px;font-weight:600}.summary-card-value{color:#000;margin-top:4px;font-size:22px;font-weight:800}.salary-filter-control-bar{background:#fff;border:1px solid #e2e8f0;border-radius:16px;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;display:flex}.salary-search-box-wrapper{flex:1;max-width:320px;position:relative}.salary-search-input{color:#334155;border:1px solid #cbd5e1;border-radius:12px;outline:none;width:100%;padding:10px 16px 10px 42px;font-size:14px}.salary-search-icon-inside{color:#94a3b8;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.salary-dropdown-selectors-group{gap:10px;display:flex}.salary-filter-dropdown-btn{color:#1e293b;cursor:pointer;background:#fff;border:1px solid #cbd5e1;border-radius:12px;align-items:center;gap:10px;padding:10px 16px;font-size:14px;display:flex}.salary-table-border-wrapper{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;overflow:hidden}.salary-main-data-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.salary-main-data-table th{color:#475569;background-color:#f8fafc;border-bottom:1px solid #e2e8f0;padding:16px;font-weight:600}.salary-main-data-table td{color:#1e293b;vertical-align:middle;border-bottom:1px solid #f1f5f9;padding:16px}.salary-main-data-table tr:last-child td{border-bottom:none}.teacher-name-cell-text{font-weight:500}.text-center-th,.text-center-td{text-align:center}.font-bold{font-weight:700}.font-medium{font-weight:500}.color-green-done{color:#10b981}.color-orange-pending{color:#f97316}.salary-status-badge{border-radius:6px;padding:4px 12px;font-size:13px;font-weight:700;display:inline-block}.salary-status-badge.paid{color:#0ca678;background-color:#e6fcf5}.salary-status-badge.unpaid{color:#e64980;background-color:#fff0f6}.salary-action-cell-icons{justify-content:center;align-items:center;gap:10px;display:flex}.salary-action-icon-btn{color:#475569;cursor:pointer;background:0 0;border:none;padding:2px;display:inline-flex}.salary-lower-detail-card{background:#fff;border:1px solid #e2e8f0;border-radius:20px;width:100%;margin-top:4px;overflow:hidden}.salary-detail-tabs-header{border-bottom:1px solid #f1f5f9;padding:0 24px}.salary-tab-header-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-bottom:3px solid #0000;padding:14px 4px;font-size:14px;font-weight:700}.salary-tab-header-btn.active{color:#ef4444;border-bottom:3px solid #ef4444}.salary-detail-card-layout-grid{grid-template-columns:1fr 1.1fr 1.2fr;align-items:start;gap:24px;padding:24px;display:grid}.salary-teacher-identity-side-box{text-align:center;flex-direction:column;align-items:center;display:flex}.avatar-frame-circular{background-color:#f1f5f9;border-radius:50%;width:85px;height:85px;margin-bottom:10px;overflow:hidden}.avatar-frame-circular img{object-fit:cover;width:100%;height:100%}.detail-teacher-title-name{color:#000;text-transform:capitalize;margin:0;font-size:18px;font-weight:700}.detail-status-green-pill{color:#22c55e;margin-top:2px;margin-bottom:14px;font-size:12px;font-weight:700}.teacher-meta-spec-rows-list{text-align:left;flex-direction:column;gap:8px;width:100%;display:flex}.meta-spec-item{color:#64748b;align-items:center;gap:10px;font-size:13px;display:flex}.icon-placeholder-box{font-size:15px}.salary-calculation-breakdown-box{width:100%}.calc-info-card-bordered{background-color:#fff;border:1px solid #e2e8f0;border-radius:14px;flex-direction:column;gap:12px;padding:16px 20px;display:flex}.calc-row-item-line{align-items:center;font-size:13px;display:flex}.calc-lbl{color:#1e293b;width:125px;font-weight:500}.calc-val{color:#1e293b;font-weight:500}.calc-divider-dashed-line{border-top:1px dashed #cbd5e1;width:100%;margin:4px 0}.total-gaji-highlight-row{font-weight:700}.calc-lbl-total{color:#0ea5e9;width:125px;font-weight:700}.calc-val-total{color:#0ea5e9;font-weight:700}.salary-bank-payment-details-box{width:100%}.payment-block-main-title{color:#000;margin:0 0 14px;font-size:14px;font-weight:700}.payment-data-rows-list{flex-direction:column;gap:10px;display:flex}.payment-data-line-row{font-size:13px;line-height:1.4;display:flex}.p-lbl{color:#000;width:140px;font-weight:700}.p-val{color:#1e293b;flex:1;font-weight:400}