@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap";
:root{--bg-app:#f5f7fb;--bg-sidebar:#fff;--bg-card:#ffffffe6;--bg-card-hover:#fffffff2;--border-color:#4caf6a26;--primary:#4caf6a;--primary-hover:#3e9155;--primary-glow:#4caf6a33;--text-main:#1f2937;--text-muted:#4b5563;--text-muted-dark:#9ca3af;--success:#4caf6a;--error:#ef4444;--font-family:"Plus Jakarta Sans", "Outfit", sans-serif;--transition-smooth:all .25s cubic-bezier(.4, 0, .2, 1)}.dark{--bg-app:#070a08;--bg-sidebar:#060907;--bg-card:#0f1310;--bg-card-hover:#161c17;--border-color:#6dd4771a;--primary:#4caf6a;--primary-hover:#6dd477;--primary-glow:#4caf6a40;--text-main:#f3f4f6;--text-muted:#9ca3af;--text-muted-dark:#6b7280;--success:#6dd477}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);color:var(--text-main);-webkit-font-smoothing:antialiased;background:linear-gradient(135deg,#f5f7fb 0%,#e8ecf4 50%,#f0f0ff 100%);min-height:100vh;transition:background-color .3s,color .3s}.dark body{background:linear-gradient(135deg,#070a08 0%,#0f1913 50%,#0b0f0c 100%)!important}a{color:inherit;text-decoration:none}.auth-page{background:radial-gradient(circle at 100% 0,#10b98114,#0000 45%),radial-gradient(circle at 0 100%,#4f46e50d,#0000 40%),#08090c;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{background-color:var(--bg-card);border:1px solid var(--border-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;flex-direction:column;gap:28px;width:100%;max-width:440px;padding:40px;display:flex;box-shadow:0 20px 40px #0006}.auth-header{text-align:center;flex-direction:column;align-items:center;gap:16px;display:flex}.logo-img{object-fit:contain;filter:drop-shadow(0 4px 8px #10b98133);max-height:60px}.auth-title{letter-spacing:-.5px;color:var(--text-main);font-size:22px;font-weight:800}.auth-subtitle{color:var(--text-muted);font-size:13px;font-weight:500;line-height:1.5}.auth-form{flex-direction:column;gap:20px;display:flex}.form-group{flex-direction:column;gap:8px;display:flex}.form-label{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);font-size:11px;font-weight:700}.input-wrapper{width:100%;position:relative}.input-icon{color:var(--text-muted-dark);font-size:14px;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.auth-input{border:1px solid var(--border-color);width:100%;height:44px;color:var(--text-main);font-family:var(--font-family);transition:var(--transition-smooth);background-color:#ffffff05;border-radius:10px;outline:none;padding:0 16px 0 42px;font-size:14px}.auth-input:focus{border-color:var(--primary);box-shadow:0 0 12px var(--primary-glow);background-color:#10b9810a}.primary-btn{background-color:var(--primary);color:#fff;height:44px;font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;font-size:14px;font-weight:700;display:flex}.primary-btn:hover{background-color:var(--primary-hover);box-shadow:0 0 16px var(--primary-glow)}.primary-btn:disabled{opacity:.6;cursor:not-allowed}.auth-switch{color:var(--text-muted);text-align:center;font-size:13px;font-weight:500}.auth-link{color:var(--primary);transition:var(--transition-smooth);font-weight:600}.auth-link:hover{color:var(--primary-hover);text-decoration:underline}.alert{border-radius:8px;align-items:center;gap:10px;padding:12px 16px;font-size:12px;font-weight:500;line-height:1.4;display:flex}.alert-error{color:var(--error);background-color:#ef44441a;border:1px solid #ef444433}.alert-success{color:var(--success);background-color:#10b9811a;border:1px solid #10b98133}.dashboard-container{grid-template-columns:260px 1fr;width:100vw;height:100vh;display:grid;overflow:hidden}.sidebar{border-right:1px solid var(--border-color);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(#4caf6a14,#7ed9570a),#fff;flex-direction:column;height:100vh;transition:background-color .3s,border-color .3s;display:flex;overflow:hidden}.dark .sidebar{background:linear-gradient(#4caf6a1f,#6dd4770f),#060907!important}.brand{align-items:center;gap:10px;padding:24px;display:flex}.sidebar-menu{flex-direction:column;flex:1;gap:6px;padding:16px 12px;display:flex;overflow-y:auto}.menu-item{color:var(--text-muted);transition:var(--transition-smooth);cursor:pointer;border-radius:8px;align-items:center;gap:12px;padding:12px 16px;font-size:13px;font-weight:600;display:flex}.menu-item:hover{background-color:var(--bg-card);color:var(--text-main)}.menu-item.active{color:#3e9155!important;background-color:#4caf6a1a!important;border:1px solid #4caf6a40!important;box-shadow:0 4px 12px #4caf6a14!important}.dark .menu-item.active{color:#6dd477!important;background-color:#4caf6a26!important;border:1px solid #4caf6a4d!important;box-shadow:0 4px 12px #4caf6a26!important}.auth-card,.profile-card,.batch-item-card,.lecture-item-row,.header,.menu-item,.content-body,.sidebar-footer,.logout-btn{transition:background-color .3s,border-color .3s,color .3s,box-shadow .3s}.menu-item i{font-size:16px}.sidebar-footer{border-top:1px solid var(--border-color);padding:16px 12px}.logout-btn{border:1px solid var(--border-color);width:100%;height:40px;color:var(--text-main);font-family:var(--font-family);cursor:pointer;transition:var(--transition-smooth);background-color:#0000;border-radius:8px;justify-content:center;align-items:center;gap:8px;font-size:13px;font-weight:600;display:flex}.logout-btn:hover{color:var(--error);background-color:#ef444414;border-color:#ef44444d}.main-content{background-color:var(--bg-app);flex-direction:column;height:100vh;display:flex;overflow-y:auto}.header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:24px 40px;display:flex}.header-title{letter-spacing:-.3px;font-size:20px;font-weight:800}.header-user{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:30px;align-items:center;gap:12px;padding:8px 16px;font-size:13px;font-weight:600;display:flex}.user-avatar{background-color:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:11px;font-weight:700;display:flex}.content-body{width:100%;max-width:1200px;margin:0 auto;padding:40px}.coming-soon{text-align:center;min-height:50vh;color:var(--text-muted-dark);flex-direction:column;justify-content:center;align-items:center;gap:20px;display:flex}.coming-soon-icon{color:var(--primary);filter:drop-shadow(0 0 10px var(--primary-glow));font-size:54px}.coming-soon-title{color:var(--text-main);font-size:24px;font-weight:800}.profile-grid{grid-template-columns:1fr;gap:24px;display:grid}.profile-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;flex-direction:column;gap:24px;padding:32px;display:flex}.profile-header{border-bottom:1px solid var(--border-color);align-items:center;gap:20px;padding-bottom:24px;display:flex}.profile-avatar-large{background:linear-gradient(135deg, var(--primary), var(--primary-hover));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;font-size:24px;font-weight:700;display:flex}.profile-name-info{flex-direction:column;gap:4px;display:flex}.profile-title{font-size:18px;font-weight:800}.profile-role{color:var(--primary-hover);text-transform:uppercase;font-size:12px;font-weight:600}.profile-info-grid{grid-template-columns:repeat(2,1fr);gap:20px;display:grid}.info-item{flex-direction:column;gap:6px;display:flex}.info-label{text-transform:uppercase;color:var(--text-muted);font-size:11px;font-weight:700}.info-value{color:var(--text-main);word-break:break-all;font-size:14px;font-weight:500}.admin-header-actions{gap:12px;display:flex}.table-wrapper{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;margin-top:24px;overflow:hidden}.admin-table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}.admin-table th{border-bottom:1px solid var(--border-color);color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;background-color:#ffffff03;padding:16px 24px;font-size:10px;font-weight:700}.admin-table td{border-bottom:1px solid var(--border-color);color:var(--text-main);padding:16px 24px;font-weight:500}.admin-table tr:last-child td{border-bottom:none}.admin-table tr:hover td{background-color:#ffffff04}.admin-badge{color:var(--primary-hover);background-color:#10b98126;border:1px solid #10b98133;border-radius:6px;padding:4px 8px;font-size:11px;font-weight:600}.spin{animation:1.5s linear infinite rotation}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sidebar-close-btn,.menu-toggle-btn{display:none}@media (max-width:768px){.dashboard-container{grid-template-columns:1fr}.sidebar{z-index:1000;width:260px;height:100vh;transition:transform .3s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:-260px}.sidebar.open{transform:translate(260px)}.sidebar-close-btn{color:var(--text-muted);cursor:pointer;transition:var(--transition-smooth);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;font-size:20px;display:flex!important}.sidebar-close-btn:hover{background-color:var(--bg-card);color:var(--text-main)}.menu-toggle-btn{border:1px solid var(--border-color);color:var(--text-main);cursor:pointer;width:36px;height:36px;transition:var(--transition-smooth);background:0 0;border-radius:8px;justify-content:center;align-items:center;font-size:16px;display:flex!important}.menu-toggle-btn:hover{background-color:var(--bg-card);border-color:var(--text-muted-dark)}.sidebar-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999;background-color:#04050899;width:100vw;height:100vh;position:fixed;top:0;left:0}.header{padding:16px 20px}.content-body{padding:20px}.profile-info-grid{grid-template-columns:1fr}}.search-section{flex-direction:column;gap:24px;display:flex}.search-form-inline{gap:12px;width:100%;max-width:600px;display:flex}.search-input-box{flex:1;position:relative}.search-input-box input{background-color:var(--bg-card);border:1px solid var(--border-color);width:100%;height:46px;color:var(--text-main);font-family:var(--font-family);transition:var(--transition-smooth);border-radius:12px;outline:none;padding:0 16px 0 46px;font-size:14px}.search-input-box input:focus{border-color:var(--primary);box-shadow:0 0 12px var(--primary-glow)}.search-input-box i{color:var(--text-muted);font-size:15px;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.all-batches-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-top:10px;display:grid}.batch-item-card{background-color:var(--bg-card);border:1px solid var(--border-color);transition:var(--transition-smooth);border-radius:16px;flex-direction:column;height:100%;display:flex;overflow:hidden}.batch-item-card:hover{border-color:#10b98140;transform:translateY(-4px);box-shadow:0 12px 24px #0000004d}.batch-thumbnail-container{aspect-ratio:16/9;border-bottom:1px solid var(--border-color);background-color:#0b0d14;width:100%;position:relative;overflow:hidden}.batch-thumbnail-container img{object-fit:cover;width:100%;height:100%;transition:transform .4s}.batch-item-card:hover .batch-thumbnail-container img{transform:scale(1.05)}.batch-card-body{flex-direction:column;flex:1;gap:14px;padding:20px;display:flex}.batch-card-title{color:var(--text-main);-webkit-line-clamp:2;-webkit-box-orient:vertical;height:42px;font-size:14px;font-weight:700;line-height:1.5;display:-webkit-box;overflow:hidden}.batch-price-badge{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:2;background:#0d0f16d9;border:1px solid #ffffff14;border-radius:8px;flex-direction:column;align-items:flex-end;gap:2px;padding:6px 12px;display:flex;position:absolute;top:10px;right:10px;box-shadow:0 4px 12px #0000004d}.batch-price-discount{color:var(--primary-hover);font-size:14px;font-weight:800}.batch-price-base{color:var(--text-muted);font-size:10px;text-decoration:line-through}.batch-card-footer{margin-top:auto;padding:0 20px 20px}.batch-buy-btn{border-radius:8px;justify-content:center;align-items:center;gap:6px;width:100%;height:38px;font-size:13px;font-weight:700;display:flex}.course-banner-card{background:linear-gradient(135deg, #4caf6a14 0%, #7ed9570a 100%), var(--bg-card);border:1px solid var(--border-color);border-radius:16px;transition:background-color .3s,border-color .3s,box-shadow .3s;box-shadow:0 4px 20px #00000005}.dark .course-banner-card{background:linear-gradient(135deg,#161c17bf 0%,#0f1310f2 100%)!important;box-shadow:0 10px 30px #00000040!important}.hero-garden{text-align:center;z-index:10;flex-direction:column;justify-content:center;align-items:center;min-height:80vh;padding:40px 20px;display:flex;position:relative}.hero-leaf-icon{margin-bottom:20px;font-size:64px;animation:3s ease-in-out infinite leaf-float}@keyframes leaf-float{0%{transform:translateY(0)rotate(0)}50%{transform:translateY(-10px)rotate(5deg)}to{transform:translateY(0)rotate(0)}}.hero-title{background:linear-gradient(135deg,#4caf6a,#7ed957);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:12px;font-size:clamp(36px,8vw,56px);font-weight:850}.dark .hero-title{background:linear-gradient(135deg,#6dd477,#90ff6b)!important;-webkit-text-fill-color:transparent!important;-webkit-background-clip:text!important;background-clip:text!important}.hero-subtitle{color:var(--text-main);opacity:.8;max-width:500px;margin-bottom:40px;font-size:clamp(16px,4vw,20px);line-height:1.6}.hero-buttons-container{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffff73;border:1px solid #4caf6a1a;border-radius:20px;margin-bottom:32px;padding:24px 32px;transition:background-color .3s,border-color .3s;box-shadow:0 8px 24px #4caf6a0d}.dark .hero-buttons-container{background:#0f131073!important;border-color:#6dd4771a!important}.hero-buttons{flex-wrap:wrap;justify-content:center;align-items:center;gap:20px;display:flex}.btn-garden{cursor:pointer;border:none;border-radius:28px;align-items:center;gap:8px;padding:14px 32px;font-size:16px;font-weight:700;text-decoration:none;transition:all .4s cubic-bezier(.34,1.56,.64,1);display:inline-flex}.btn-primary-garden{background:linear-gradient(135deg,#7ed957 0%,#4caf6a 100%);color:#fff!important}.btn-primary-garden:hover{background:linear-gradient(135deg,#90ff6b 0%,#66cb82 100%);transform:translateY(-4px)scale(1.05);box-shadow:0 8px 20px #4caf6a4d}.btn-secondary-garden{background:#4caf6a1a;border:2px solid #4caf6a;color:#3e9155!important}.dark .btn-secondary-garden{color:#6dd477!important;background:#6dd4771a!important;border-color:#6dd477!important}.btn-secondary-garden:hover{transform:translateY(-4px)scale(1.05)}.hero-description{color:var(--text-muted);opacity:.8;letter-spacing:.5px;text-transform:uppercase;font-size:12px;font-weight:700}.lecture-item-row.clickable{cursor:pointer}.lecture-item-row.clickable:hover{background-color:#4caf6a0d!important;border-color:#4caf6a40!important;box-shadow:0 4px 12px #4caf6a0a!important}.dark .lecture-item-row.clickable:hover{background-color:#6dd47708!important;border-color:#6dd47726!important}.lecture-item-row.clickable:hover .lecture-play-indicator{transform:scale(1.1);background-color:var(--primary)!important;color:#fff!important}