/* ========================================================================
   TeacherFlow 2026 — Modern Marketable UI
   Visual system only. No application logic, API, auth or data behavior here.
   ======================================================================== */

:root{
  --tf-cream:#f7f8f6;
  --tf-canvas:#f2f5f2;
  --tf-surface:#ffffff;
  --tf-surface-2:#f7f9f7;
  --tf-line:#dde5df;
  --tf-line-strong:#cfd9d2;
  --tf-ink:#21362e;
  --tf-muted:#6d7a73;
  --tf-green:#3f725d;
  --tf-green-deep:#315d4b;
  --tf-green-soft:#edf4ef;
  --tf-amber:#a9772d;
  --tf-amber-soft:#f8f0df;
  --tf-blue:#56758a;
  --tf-danger:#a65356;
  --tf-radius:12px;
  --tf-radius-sm:9px;
  --tf-control-h:40px;
  --tf-icon-control:36px;
  --tf-shadow:0 8px 24px rgba(34,52,43,.055);
}
html{background:var(--tf-canvas);}
body{font-family:Arial,Helvetica,sans-serif;}
button,input,select,textarea{font:inherit}

/* ============================ AUTH EXPERIENCE ============================ */
body.tf-auth-page{
  min-height:100svh!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
  color:var(--tf-ink)!important;
  background:
    radial-gradient(circle at 12% 10%,rgba(112,156,133,.18),transparent 27%),
    radial-gradient(circle at 86% 92%,rgba(219,175,111,.15),transparent 25%),
    linear-gradient(135deg,#f4efe6 0%,#fffaf2 48%,#f2eee6 100%)!important;
  overflow-x:hidden!important;
}
body.tf-auth-page::before{
  content:""!important;
  position:fixed!important;
  inset:auto auto -18vw -12vw!important;
  width:38vw!important;
  height:38vw!important;
  min-width:340px!important;
  min-height:340px!important;
  border:1px solid rgba(63,114,93,.12)!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(255,255,255,.38),rgba(255,255,255,0) 68%)!important;
  pointer-events:none!important;
  z-index:0!important;
}
body.tf-auth-page::after{
  content:"";
  position:fixed;
  top:-190px;
  right:-190px;
  width:430px;
  height:430px;
  border-radius:50%;
  border:1px solid rgba(180,138,77,.12);
  background:radial-gradient(circle,rgba(255,255,255,.42),rgba(255,255,255,0) 70%);
  pointer-events:none;
  z-index:0;
}
body.tf-auth-page .login-wrap,
body.tf-auth-page .auth-wrap{
  position:relative!important;
  z-index:1!important;
  width:min(1220px,calc(100% - 40px))!important;
  min-height:calc(100svh - 40px)!important;
  margin:20px auto!important;
  display:grid!important;
  grid-template-columns:minmax(360px,.92fr) minmax(440px,1.08fr)!important;
  align-items:stretch!important;
  gap:0!important;
  overflow:hidden!important;
  border:1px solid rgba(70,88,79,.12)!important;
  border-radius:26px!important;
  background:rgba(255,253,249,.82)!important;
  box-shadow:0 28px 70px rgba(46,55,50,.10)!important;
  backdrop-filter:none!important;
}
body.tf-auth-page .auth-brand-panel{
  position:relative;
  min-height:620px;
  padding:42px 44px 38px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  color:#f6fbf8;
  background:
    linear-gradient(100deg,rgba(12,42,32,.86) 0%,rgba(12,42,32,.73) 52%,rgba(12,42,32,.48) 100%),
    url("https://images.pexels.com/photos/5905435/pexels-photo-5905435.jpeg?auto=compress&cs=tinysrgb&w=2800&q=94") center 58%/cover no-repeat,
    linear-gradient(150deg,#183f33 0%,#2f6651 56%,#4c806b 100%);
}
body.tf-auth-page .auth-brand-panel::before,
body.tf-auth-page .auth-brand-panel::after{
  content:"";
  position:absolute;
  border-radius:50%;
  pointer-events:none;
}
body.tf-auth-page .auth-brand-panel::before{
  width:330px;height:330px;right:-155px;top:64px;
  border:1px solid rgba(255,255,255,.10);
}
body.tf-auth-page .auth-brand-panel::after{
  width:218px;height:218px;right:-74px;top:120px;
  border:1px solid rgba(255,255,255,.075);
}
body.tf-auth-page .auth-brand-logo{
  position:relative;z-index:1;
  width:min(250px,72%);height:auto;filter:brightness(0) invert(1);opacity:.98;
}
body.tf-auth-page .auth-brand-copy{position:relative;z-index:1;margin:auto 0 24px;max-width:440px}
body.tf-auth-page .auth-brand-kicker{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;
  font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#dbe9e2;
}
body.tf-auth-page .auth-brand-kicker::before{content:"";width:24px;height:1px;background:#dbe9e2}
body.tf-auth-page .auth-brand-copy h2{
  margin:0 0 14px;font-size:clamp(31px,3.2vw,48px);line-height:1.04;letter-spacing:-1.6px;font-weight:800;color:#fff;
}
body.tf-auth-page .auth-brand-copy p{margin:0;max-width:405px;color:#dbe6e0;font-size:13px;line-height:1.7}
body.tf-auth-page .auth-brand-points{
  position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
}
body.tf-auth-page .auth-brand-point{
  min-width:0;padding:11px 10px;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.055);
}
body.tf-auth-page .auth-brand-point span{display:block;margin-bottom:6px;color:#cadbd2;font-size:8px;font-weight:800;letter-spacing:.12em}
body.tf-auth-page .auth-brand-point strong{display:block;font-size:11px;color:#fff;margin-bottom:2px}
body.tf-auth-page .auth-brand-point small{display:block;color:#c8d8d0;font-size:8.5px;line-height:1.35}
body.tf-auth-page .auth-brand-foot{position:relative;z-index:1;margin-top:18px;font-size:9px;color:#bbcec4;letter-spacing:.04em}

body.tf-auth-page .card{
  width:min(520px,calc(100% - 56px))!important;
  margin:auto!important;
  padding:42px 40px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--tf-ink)!important;
}
body.tf-auth-page .card::before{content:"WELCOME TO TEACHERFLOW";display:block;margin-bottom:12px;color:var(--tf-green);font-size:9px;font-weight:800;letter-spacing:.13em}
body.tf-auth-page.tf-admin-auth .card::before{content:"TEACHERFLOW ADMINISTRATION"}
body.tf-auth-page .card h1{
  margin:0 0 9px!important;font-size:clamp(27px,3vw,36px)!important;line-height:1.08!important;letter-spacing:-1px!important;color:var(--tf-ink)!important;font-weight:800!important;
}
body.tf-auth-page .card .intro{margin:0 0 26px!important;color:var(--tf-muted)!important;font-size:12px!important;line-height:1.65!important}
body.tf-auth-page .card form{display:grid!important;gap:15px!important}
body.tf-auth-page .card label{
  display:grid!important;gap:7px!important;margin:0!important;color:#43564d!important;font-size:10.5px!important;font-weight:700!important;letter-spacing:.01em!important;
}
body.tf-auth-page .card input,
body.tf-auth-page .card select{
  width:100%!important;height:48px!important;min-height:48px!important;padding:0 13px!important;
  border:1px solid #d9d2c8!important;border-radius:10px!important;outline:0!important;
  background:#fff!important;color:var(--tf-ink)!important;font-size:13px!important;box-shadow:none!important;
  transition:border-color .15s ease,box-shadow .15s ease,background .15s ease!important;
}
body.tf-auth-page .card input:hover,
body.tf-auth-page .card select:hover{border-color:#c7beb2!important}
body.tf-auth-page .card input:focus,
body.tf-auth-page .card select:focus{border-color:#7fa18f!important;box-shadow:0 0 0 3px rgba(63,114,93,.10)!important;background:#fff!important}
body.tf-auth-page .card input::placeholder{color:#a1aaa5!important}
body.tf-auth-page .card button[type="submit"],
body.tf-auth-page .card #loginButton,
body.tf-auth-page .card #signupButton,
body.tf-auth-page .card #requestButton,
body.tf-auth-page .card #verifyButton,
body.tf-auth-page .card #resetButton{
  width:100%!important;min-height:48px!important;margin-top:3px!important;padding:0 16px!important;
  border:1px solid #315f4c!important;border-radius:10px!important;background:var(--tf-green)!important;color:#fff!important;
  box-shadow:none!important;font-size:12px!important;font-weight:800!important;letter-spacing:.01em!important;cursor:pointer!important;
  transition:background .15s ease,transform .15s ease!important;
}
body.tf-auth-page .card button[type="submit"]:hover,
body.tf-auth-page .card #loginButton:hover,
body.tf-auth-page .card #signupButton:hover,
body.tf-auth-page .card #requestButton:hover,
body.tf-auth-page .card #verifyButton:hover,
body.tf-auth-page .card #resetButton:hover{background:#315f4c!important;transform:translateY(-1px)!important}
body.tf-auth-page .card .secondary{
  width:100%!important;min-height:44px!important;margin-top:-4px!important;border:1px solid #d9d2c8!important;border-radius:10px!important;background:#fff!important;color:#3c5549!important;font-size:11px!important;font-weight:800!important;box-shadow:none!important;
}
body.tf-auth-page .forgot-password-row{margin:-4px 0 0!important;text-align:right!important}
body.tf-auth-page .forgot-password-row a,
body.tf-auth-page .switch a,
body.tf-auth-page .account-switch a{color:var(--tf-green-deep)!important;font-weight:800!important;text-decoration:none!important}
body.tf-auth-page .forgot-password-row a:hover,
body.tf-auth-page .switch a:hover,
body.tf-auth-page .account-switch a:hover{text-decoration:underline!important}
body.tf-auth-page .switch,
body.tf-auth-page .account-switch{margin:20px 0 0!important;color:#858f89!important;font-size:10.5px!important;text-align:center!important;line-height:1.55!important}
body.tf-auth-page .error,
body.tf-auth-page .success{border-radius:9px!important;font-size:10.5px!important;line-height:1.45!important;box-shadow:none!important}
body.tf-auth-page .code-input{letter-spacing:.30em!important;text-align:center!important;font-size:20px!important;font-weight:800!important}
body.tf-auth-page .email-note{margin:-14px 0 18px!important;color:#77837d!important;font-size:10.5px!important}
body.tf-auth-page .brand{display:none!important}
body.tf-auth-page #pageLoading,
body.tf-auth-page .dashboard-loading-card{font-family:Arial,Helvetica,sans-serif!important}

@media(max-width:900px){
  body.tf-auth-page .login-wrap,
  body.tf-auth-page .auth-wrap{grid-template-columns:1fr!important;width:min(680px,calc(100% - 28px))!important;margin:14px auto!important;min-height:calc(100svh - 28px)!important}
  body.tf-auth-page .auth-brand-panel{min-height:250px;padding:28px 30px}
  body.tf-auth-page .auth-brand-copy{margin:38px 0 18px;max-width:560px}
  body.tf-auth-page .auth-brand-copy h2{font-size:30px;letter-spacing:-1px}
  body.tf-auth-page .auth-brand-points{grid-template-columns:repeat(3,1fr)}
  body.tf-auth-page .auth-brand-foot{display:none}
  body.tf-auth-page .card{width:min(560px,calc(100% - 36px))!important;padding:34px 22px 38px!important}
}
@media(max-width:560px){
  body.tf-auth-page .login-wrap,
  body.tf-auth-page .auth-wrap{width:calc(100% - 16px)!important;margin:8px auto!important;border-radius:18px!important;min-height:calc(100svh - 16px)!important}
  body.tf-auth-page .auth-brand-panel{min-height:184px;padding:22px 22px 20px}
  body.tf-auth-page .auth-brand-logo{width:190px}
  body.tf-auth-page .auth-brand-copy{margin:auto 0 0}
  body.tf-auth-page .auth-brand-copy h2{font-size:23px;margin-bottom:7px}
  body.tf-auth-page .auth-brand-copy p{font-size:10.5px;line-height:1.5}
  body.tf-auth-page .auth-brand-kicker{display:none}
  body.tf-auth-page .auth-brand-points{display:none}
  body.tf-auth-page .card{width:calc(100% - 26px)!important;padding:28px 8px 30px!important}
  body.tf-auth-page .card h1{font-size:27px!important}
  body.tf-auth-page .card .intro{font-size:11px!important;margin-bottom:22px!important}
}

/* =============================== DASHBOARD =============================== */
body.tf-dashboard-page{
  background:var(--tf-canvas)!important;color:var(--tf-ink)!important;
  font-family:Arial,Helvetica,sans-serif!important;
}
body.tf-dashboard-page .app{background:var(--tf-canvas)!important}
body.tf-dashboard-page .sidebar{
  width:252px!important;background:#fffdf9!important;border-right:1px solid var(--tf-line)!important;box-shadow:none!important;
}
body.tf-dashboard-page .tf-sidebar-header{padding:22px 18px 12px!important}
body.tf-dashboard-page .tf-sidebar-brand{border:0!important;background:transparent!important;box-shadow:none!important}
body.tf-dashboard-page .tf-sidebar-brand-image{max-width:190px!important}
body.tf-dashboard-page .tf-sidebar-nav{padding:8px 12px 14px!important;gap:4px!important}
body.tf-dashboard-page .tf-side-item{
  min-height:44px!important;padding:7px 9px!important;border:1px solid transparent!important;border-radius:10px!important;background:transparent!important;color:#526158!important;box-shadow:none!important;
}
body.tf-dashboard-page .tf-side-item:hover{background:#f7f3ec!important;border-color:#eee6da!important;transform:none!important}
body.tf-dashboard-page .tf-side-item.active{background:#eaf2ed!important;border-color:#d9e7df!important;color:#2f5d4a!important}
body.tf-dashboard-page .tf-side-item .nav-icon{width:30px!important;height:30px!important;border-radius:8px!important;box-shadow:none!important}
body.tf-dashboard-page .tf-side-item .nav-label{font-size:11.5px!important;font-weight:700!important}
body.tf-dashboard-page .tf-sidebar-footer{padding:14px 14px 18px!important;border-top:1px solid #eee7dc!important}
body.tf-dashboard-page .main{padding:28px clamp(18px,2.5vw,38px) 42px!important;background:var(--tf-canvas)!important}
body.tf-dashboard-page .view{max-width:1420px;margin:0 auto!important}
body.tf-dashboard-page .page-titlebar{
  margin:0 0 16px!important;padding:0 2px 14px!important;border-bottom:1px solid var(--tf-line)!important;align-items:flex-end!important;
}
body.tf-dashboard-page .page-titlebar h1{margin:0!important;color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important;font-size:27px!important;line-height:1.08!important;letter-spacing:-.65px!important}
body.tf-dashboard-page .section-subtitle{margin-top:6px!important;color:var(--tf-muted)!important;font-size:10.5px!important;font-weight:500!important}
body.tf-dashboard-page .section-subtitle-icon{color:#70877b!important}
body.tf-dashboard-page .breadcrumb{margin-top:4px!important}
body.tf-dashboard-page .breadcrumb-home{min-height:26px!important;padding:3px 7px!important;margin-left:-7px!important;color:#708078!important;font-size:10px!important;border-radius:7px!important}
body.tf-dashboard-page .breadcrumb-home:hover{background:#eee9e0!important;color:#385949!important}
body.tf-dashboard-page .primary{
  border:1px solid #315f4c!important;border-radius:9px!important;background:var(--tf-green)!important;color:#fff!important;box-shadow:none!important;font-weight:800!important;
}
body.tf-dashboard-page .primary:hover{background:#315f4c!important;transform:none!important}
body.tf-dashboard-page .ghost{border:1px solid var(--tf-line-strong)!important;border-radius:9px!important;background:#fff!important;color:#506057!important;box-shadow:none!important}
body.tf-dashboard-page .ghost:hover{background:#f7f3ec!important;transform:none!important}
body.tf-dashboard-page .section,
body.tf-dashboard-page .analytics-panel,
body.tf-dashboard-page .setting-card,
body.tf-dashboard-page .about-feature-card,
body.tf-dashboard-page .about-info-card{
  border:1px solid var(--tf-line)!important;border-radius:14px!important;background:var(--tf-surface)!important;box-shadow:none!important;
}
body.tf-dashboard-page .section{padding:18px!important;margin-bottom:16px!important}
body.tf-dashboard-page .section-photo-hero{display:none!important}

/* Dashboard landing hero and metrics */
body.tf-dashboard-page .tf-dashboard-brand-above{margin:0 0 10px!important}
body.tf-dashboard-page .tf-hero-brand-full{max-width:210px!important}
body.tf-dashboard-page .tf-hero-clean{
  border:1px solid #dfe4db!important;border-radius:18px!important;background:
    radial-gradient(circle at 88% 20%,rgba(91,139,116,.11),transparent 28%),
    linear-gradient(135deg,#fffdf9 0%,#f6f3ec 100%)!important;box-shadow:none!important;overflow:hidden!important;
}
body.tf-dashboard-page .tf-hero-kicker{color:var(--tf-green)!important;font-size:9px!important;letter-spacing:.13em!important}
body.tf-dashboard-page .tf-hero-greeting{color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important;letter-spacing:-.8px!important}
body.tf-dashboard-page .tf-hero-message{color:#67766e!important}
body.tf-dashboard-page .tf-hero-avatar{border:3px solid #fff!important;box-shadow:0 0 0 1px #d8ded9!important}
body.tf-dashboard-page .dashboard-slideshow{border-radius:14px!important;box-shadow:none!important;border:1px solid #e6e0d7!important;overflow:hidden!important}
body.tf-dashboard-page .dashboard-slide-shade{background:linear-gradient(90deg,rgba(26,46,38,.56),rgba(26,46,38,.08))!important}
body.tf-dashboard-page .cards{gap:10px!important}
body.tf-dashboard-page .card{
  min-height:112px!important;padding:16px!important;border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fffdf9!important;box-shadow:none!important;
}
body.tf-dashboard-page .card:hover{transform:none!important;border-color:#d9d0c4!important}
body.tf-dashboard-page .card-icon{width:34px!important;height:34px!important;border-radius:9px!important;box-shadow:none!important}
body.tf-dashboard-page .metric{font-size:24px!important;letter-spacing:-.6px!important;color:var(--tf-ink)!important}
body.tf-dashboard-page .label{font-size:9.5px!important;color:#77827c!important}

/* Calendar */
body.tf-dashboard-page .calendar-viewbar{gap:6px!important;margin-bottom:10px!important}
body.tf-dashboard-page .calendar-view-btn{min-height:38px!important;padding:0 12px!important;border:1px solid var(--tf-line)!important;border-radius:8px!important;background:#fff!important;color:#66756d!important;box-shadow:none!important}
body.tf-dashboard-page .calendar-view-btn.active{border-color:#cadbd1!important;background:#eaf2ed!important;color:#2f5d4a!important}
body.tf-dashboard-page .toolbar{min-height:44px!important;border:1px solid var(--tf-line)!important;border-radius:10px!important;background:#faf7f1!important;padding:6px 9px!important}
body.tf-dashboard-page .toolbar button{border:1px solid #e0d8cd!important;border-radius:7px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .calendar{border-radius:10px!important;overflow:hidden!important}
body.tf-dashboard-page .calendar .dayname{background:#f1ede6!important;color:#65736b!important;border-color:#e4ddd3!important;font-size:9px!important}
body.tf-dashboard-page .calendar .day{background:#fff!important;border-color:#e8e1d7!important}
body.tf-dashboard-page .calendar .event{border-radius:6px!important;box-shadow:none!important;font-size:9px!important}

/* Tables / lists */
body.tf-dashboard-page .table,
body.tf-dashboard-page .data-table{border-collapse:separate!important;border-spacing:0!important}
body.tf-dashboard-page .table thead th,
body.tf-dashboard-page .data-table thead th{background:#f2eee7!important;color:#627168!important;border-color:#e4ddd3!important;font-size:9px!important;letter-spacing:.04em!important;text-transform:uppercase!important}
body.tf-dashboard-page .table td,
body.tf-dashboard-page .data-table td{border-color:#ece5dc!important;color:#405047!important;font-size:10.5px!important}
body.tf-dashboard-page .student{padding:11px 4px!important;border-color:#ece5dc!important}
body.tf-dashboard-page .action-icon{border:1px solid #e0d9cf!important;border-radius:7px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .action-icon:hover{background:#f6f2eb!important;transform:none!important}

/* Schedule manager */
body.tf-dashboard-page #schedule .regular-timetable-section,
body.tf-dashboard-page #schedule .schedule-section-card{padding:16px!important;border-radius:13px!important;background:#fffdf9!important}
body.tf-dashboard-page #schedule .regular-timetable-head h2,
body.tf-dashboard-page #schedule .schedule-list-title{font-size:18px!important;color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important;letter-spacing:-.25px!important}
body.tf-dashboard-page #schedule .regular-timetable-head p,
body.tf-dashboard-page #schedule .schedule-list-sub{color:var(--tf-muted)!important;font-size:10.5px!important}
body.tf-dashboard-page #schedule .regular-timetable-share,
body.tf-dashboard-page #schedule .regular-timetable-print{min-height:36px!important;border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;color:#4b5f54!important;box-shadow:none!important}
body.tf-dashboard-page #schedule .regular-timetable-scroll{border:1px solid var(--tf-line-strong)!important;border-radius:9px!important;box-shadow:none!important}
body.tf-dashboard-page #schedule .regular-timetable thead th{background:#f2eee7!important;color:#596960!important}
body.tf-dashboard-page #schedule .regular-timetable .time-cell{background:#faf7f1!important;color:#6d7972!important}
body.tf-dashboard-page #schedule .regular-timetable td.slot{background:#fff!important;border-color:#e9e2d8!important}
body.tf-dashboard-page #schedule .regular-slot-content.booked{border:1px solid #cfe0d7!important;border-left:3px solid var(--tf-green)!important;border-radius:6px!important;background:#f3f8f5!important}
body.tf-dashboard-page #schedule .schedule-month-filter select,
body.tf-dashboard-page #schedule .schedule-search{height:40px!important;border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page #schedule .student-schedule-group{margin:0!important;border:0!important;border-top:1px solid #ece5da!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
body.tf-dashboard-page #schedule .student-schedule-group:last-child{border-bottom:1px solid #ece5da!important}
body.tf-dashboard-page #schedule .student-schedule-trigger{min-height:62px!important;padding:10px 4px!important;background:transparent!important}
body.tf-dashboard-page #schedule .student-schedule-trigger:hover{background:#faf7f1!important}
body.tf-dashboard-page #schedule .student-schedule-avatar{width:34px!important;height:34px!important;flex-basis:34px!important;border:1px solid #d7e3dc!important;border-radius:50%!important;background:#edf3ef!important;color:#2f6651!important}
body.tf-dashboard-page #schedule .student-schedule-trigger-copy strong{font-size:13px!important;color:var(--tf-ink)!important}
body.tf-dashboard-page #schedule .student-schedule-trigger-copy small{font-size:9.8px!important;color:#77827c!important}
body.tf-dashboard-page #schedule .student-schedule-chevron{width:28px!important;height:28px!important;border:1px solid #e3ddd2!important;border-radius:7px!important;background:#fff!important;color:#68756f!important}
body.tf-dashboard-page #schedule .student-schedule-panel{padding:0 4px 14px!important;background:transparent!important}
body.tf-dashboard-page #schedule .student-schedule-overview{gap:0!important;border:1px solid #e3ddd2!important;border-radius:8px!important;overflow:hidden!important;background:#fff!important}
body.tf-dashboard-page #schedule .student-schedule-summary-card{border:0!important;border-radius:0!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page #schedule .student-schedule-summary-card:first-child{border-right:1px solid #e8e1d6!important}
body.tf-dashboard-page #schedule .student-schedule-change{border-radius:0!important;background:#fff!important;border-bottom:1px solid #f0ebe3!important}
body.tf-dashboard-page #schedule .student-schedule-detail-toggle summary{padding:6px 9px!important;border:1px solid #e1dbcf!important;border-radius:7px!important;background:#fff!important;color:#47685a!important}
body.tf-dashboard-page #schedule .student-schedule-class{border:1px solid #e8e2d8!important;border-radius:7px!important;background:#fff!important;box-shadow:none!important}

/* Students, analytics, lessons, announcements, info, settings */
body.tf-dashboard-page .student-card,
body.tf-dashboard-page .dashboard-package-card{border:1px solid var(--tf-line)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .analytics-kpi{border:1px solid var(--tf-line)!important;border-radius:12px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .analytics-panel-head{border-bottom:1px solid #ece5dc!important}
body.tf-dashboard-page .announcement{border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .announcement-page-hero,
body.tf-dashboard-page .about-professional-intro{border:1px solid var(--tf-line)!important;border-radius:16px!important;box-shadow:none!important}
body.tf-dashboard-page .about-professional-intro{background:linear-gradient(135deg,#fffdf9,#f4f0e8)!important}
body.tf-dashboard-page .about-intro-panel{border:1px solid #d9e3dc!important;border-radius:12px!important;background:#edf3ef!important;box-shadow:none!important}
body.tf-dashboard-page .settings-panel{padding:16px!important}
body.tf-dashboard-page .settings-grid{gap:10px!important}
body.tf-dashboard-page .setting-card{padding:16px!important}
body.tf-dashboard-page .setting-card h3{color:var(--tf-ink)!important;font-size:14px!important}
body.tf-dashboard-page .setting-card p{color:var(--tf-muted)!important;font-size:10.5px!important}
body.tf-dashboard-page .setting-card input,
body.tf-dashboard-page .setting-card select{border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .theme-choice{border:1px solid var(--tf-line)!important;border-radius:9px!important;background:#f5f1ea!important;padding:3px!important}
body.tf-dashboard-page .theme-choice button{border-radius:7px!important;box-shadow:none!important}
body.tf-dashboard-page .tf-reminder-status{border:1px solid #dbe5df!important;border-radius:9px!important;background:#f3f7f4!important}

/* Modal system */
body.tf-dashboard-page .modal-overlay{background:rgba(33,43,38,.42)!important;backdrop-filter:blur(2px)!important}
body.tf-dashboard-page .modal-card{border:1px solid var(--tf-line)!important;border-radius:16px!important;background:#fffdf9!important;box-shadow:0 20px 50px rgba(33,43,38,.16)!important}
body.tf-dashboard-page .form input,
body.tf-dashboard-page .form select,
body.tf-dashboard-page .form textarea{border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important}
body.tf-dashboard-page .form input:focus,
body.tf-dashboard-page .form select:focus,
body.tf-dashboard-page .form textarea:focus{border-color:#83a392!important;box-shadow:0 0 0 3px rgba(63,114,93,.09)!important;outline:0!important}

/* Dark mode: same hierarchy, not a separate visual language. */
body.tf-dashboard-page.dark-mode{--tf-canvas:#101713;--tf-surface:#17201b;--tf-surface-2:#1b251f;--tf-line:#314039;--tf-line-strong:#3b4b43;--tf-ink:#edf4ef;--tf-muted:#9eaca4;background:#101713!important}
body.tf-dashboard-page.dark-mode .app,
body.tf-dashboard-page.dark-mode .main{background:#101713!important}
body.tf-dashboard-page.dark-mode .sidebar{background:#151e19!important;border-color:#2c3933!important}
body.tf-dashboard-page.dark-mode .tf-side-item{color:#aab8b0!important}
body.tf-dashboard-page.dark-mode .tf-side-item:hover{background:#1b2721!important;border-color:#314039!important}
body.tf-dashboard-page.dark-mode .tf-side-item.active{background:#20342a!important;border-color:#355343!important;color:#dcece4!important}
body.tf-dashboard-page.dark-mode .section,
body.tf-dashboard-page.dark-mode .card,
body.tf-dashboard-page.dark-mode .analytics-panel,
body.tf-dashboard-page.dark-mode .setting-card,
body.tf-dashboard-page.dark-mode .announcement,
body.tf-dashboard-page.dark-mode .about-feature-card,
body.tf-dashboard-page.dark-mode .about-info-card{background:#17201b!important;border-color:#314039!important}
body.tf-dashboard-page.dark-mode .toolbar,
body.tf-dashboard-page.dark-mode .calendar-view-btn{background:#17201b!important;border-color:#34443c!important;color:#aab8b0!important}
body.tf-dashboard-page.dark-mode .calendar-view-btn.active{background:#20342a!important;border-color:#355343!important;color:#d9ebe2!important}
body.tf-dashboard-page.dark-mode .calendar .day{background:#17201b!important;border-color:#314039!important}
body.tf-dashboard-page.dark-mode .calendar .dayname,
body.tf-dashboard-page.dark-mode .table thead th,
body.tf-dashboard-page.dark-mode .data-table thead th{background:#202a24!important;color:#afbbb4!important;border-color:#344039!important}
body.tf-dashboard-page.dark-mode #schedule .regular-timetable-section,
body.tf-dashboard-page.dark-mode #schedule .schedule-section-card,
body.tf-dashboard-page.dark-mode #schedule .student-schedule-summary-card,
body.tf-dashboard-page.dark-mode #schedule .student-schedule-class{background:#17201b!important;border-color:#314039!important}
body.tf-dashboard-page.dark-mode #schedule .regular-timetable td.slot{background:#17201b!important;border-color:#314039!important}
body.tf-dashboard-page.dark-mode #schedule .regular-timetable thead th,
body.tf-dashboard-page.dark-mode #schedule .regular-timetable .time-cell{background:#202a24!important;color:#b5c1ba!important}
body.tf-dashboard-page.dark-mode #schedule .schedule-month-filter select,
body.tf-dashboard-page.dark-mode #schedule .schedule-search,
body.tf-dashboard-page.dark-mode #schedule .student-schedule-chevron,
body.tf-dashboard-page.dark-mode #schedule .student-schedule-detail-toggle summary{background:#111914!important;border-color:#3a4941!important;color:#d9e5de!important}
body.tf-dashboard-page.dark-mode .modal-card{background:#17201b!important;border-color:#34433b!important}

@media(max-width:950px){
  body.tf-dashboard-page .main{padding:18px 14px 34px!important}
  body.tf-dashboard-page .page-titlebar{align-items:flex-start!important}
  body.tf-dashboard-page .section{padding:14px!important}
}
@media(max-width:700px){
  body.tf-dashboard-page .page-titlebar h1{font-size:24px!important}
  body.tf-dashboard-page .cards{gap:8px!important}
  body.tf-dashboard-page .card{min-height:102px!important;padding:13px!important}
  body.tf-dashboard-page .section{border-radius:11px!important}
  body.tf-dashboard-page #schedule .student-schedule-overview{grid-template-columns:1fr!important}
  body.tf-dashboard-page #schedule .student-schedule-summary-card:first-child{border-right:0!important;border-bottom:1px solid #e8e1d6!important}
}

/* =============================== ADMIN ================================== */
body.tf-admin-page{margin:0!important;background:var(--tf-canvas)!important;color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important}
body.tf-admin-page .top{position:sticky!important;top:0!important;z-index:10!important;min-height:72px!important;padding:14px clamp(18px,4vw,48px)!important;border-bottom:1px solid var(--tf-line)!important;background:rgba(255,253,249,.96)!important;box-shadow:none!important;backdrop-filter:blur(14px)!important}
body.tf-admin-page .top .tf-logo{width:190px!important;height:auto!important}
body.tf-admin-page .admin-label{color:#68776f!important;font-size:11px!important;font-weight:700!important}
body.tf-admin-page .logout{min-height:38px!important;padding:0 12px!important;border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;color:#526158!important;box-shadow:none!important}
body.tf-admin-page main{width:min(1180px,calc(100% - 32px))!important;margin:0 auto!important;padding:34px 0 60px!important}
body.tf-admin-page .heading{margin-bottom:22px!important}
body.tf-admin-page .heading h1{margin:0 0 7px!important;color:var(--tf-ink)!important;font-size:30px!important;letter-spacing:-.8px!important}
body.tf-admin-page .heading p{margin:0!important;color:var(--tf-muted)!important;font-size:12px!important}
body.tf-admin-page .tabs{display:inline-flex!important;gap:4px!important;margin:0 0 16px!important;padding:4px!important;border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#eee9e1!important;box-shadow:none!important}
body.tf-admin-page .tabs button{min-height:36px!important;padding:0 12px!important;border:0!important;border-radius:8px!important;background:transparent!important;color:#68756e!important;box-shadow:none!important;font-size:10.5px!important;font-weight:800!important}
body.tf-admin-page .tabs button.active{background:#fff!important;color:#315f4c!important;box-shadow:0 1px 2px rgba(35,45,40,.06)!important}
body.tf-admin-page .panel{padding:18px!important;border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fffdf9!important;box-shadow:none!important}
body.tf-admin-page .toolbar{min-height:48px!important;margin-bottom:12px!important;padding-bottom:12px!important;border-bottom:1px solid #ece5da!important}
body.tf-admin-page .toolbar strong{font-size:14px!important;color:var(--tf-ink)!important}
body.tf-admin-page .primary{border:1px solid #315f4c!important;border-radius:8px!important;background:var(--tf-green)!important;color:#fff!important;box-shadow:none!important;font-weight:800!important}
body.tf-admin-page input,
body.tf-admin-page textarea,
body.tf-admin-page select{border:1px solid var(--tf-line-strong)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;color:var(--tf-ink)!important}
body.tf-admin-page input:focus,
body.tf-admin-page textarea:focus,
body.tf-admin-page select:focus{outline:0!important;border-color:#83a392!important;box-shadow:0 0 0 3px rgba(63,114,93,.09)!important}
body.tf-admin-page .account-row-main,
body.tf-admin-page .row{border-color:#ece5dc!important}
body.tf-admin-page .maintenance-admin-card,
body.tf-admin-page .maintenance-status-card,
body.tf-admin-page .tf-access-admin-card{border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important}
body.tf-admin-page .modal{background:rgba(32,42,37,.42)!important;backdrop-filter:blur(2px)!important}
body.tf-admin-page .modal-card{border:1px solid var(--tf-line)!important;border-radius:15px!important;background:#fffdf9!important;box-shadow:0 20px 48px rgba(34,44,39,.16)!important}

/* ============================= MAINTENANCE ============================== */
body.tf-maintenance-page{min-height:100svh!important;margin:0!important;display:grid!important;place-items:center!important;padding:24px!important;background:radial-gradient(circle at 20% 15%,rgba(77,125,101,.11),transparent 30%),linear-gradient(145deg,#f4efe6,#fffaf2)!important;color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important}
body.tf-maintenance-page .maintenance{width:min(620px,100%)!important;padding:42px 40px!important;border:1px solid var(--tf-line)!important;border-radius:20px!important;background:#fffdf9!important;box-shadow:var(--tf-shadow)!important;text-align:left!important}
body.tf-maintenance-page .logo{max-width:220px!important;margin:0 0 30px!important}
body.tf-maintenance-page .status{display:inline-flex!important;align-items:center!important;gap:8px!important;margin-bottom:18px!important;padding:7px 10px!important;border:1px solid #dce8e1!important;border-radius:999px!important;background:#eff5f1!important;color:#35604e!important;font-size:9px!important;font-weight:800!important;letter-spacing:.08em!important;text-transform:uppercase!important}
body.tf-maintenance-page .message{color:#53645b!important;line-height:1.7!important}
body.tf-maintenance-page .eta{border:1px solid #eadfcf!important;border-radius:10px!important;background:#faf5eb!important;box-shadow:none!important}
body.tf-maintenance-page .sync{opacity:.7!important}
body.tf-maintenance-page .actions a{border:1px solid var(--tf-line-strong)!important;border-radius:9px!important;background:#fff!important;color:#3c594c!important;box-shadow:none!important}

/* =========================== PUBLIC TIMETABLE ============================ */
body.tf-share-page{margin:0!important;padding:28px 18px!important;background:var(--tf-canvas)!important;color:var(--tf-ink)!important;font-family:Arial,Helvetica,sans-serif!important}
body.tf-share-page .wrap{width:min(1120px,100%)!important;margin:0 auto!important;padding:22px!important;border:1px solid var(--tf-line)!important;border-radius:16px!important;background:#fffdf9!important;box-shadow:none!important}
body.tf-share-page .kicker{color:var(--tf-green)!important;font-size:9px!important;letter-spacing:.11em!important}
body.tf-share-page h1{color:var(--tf-ink)!important;font-size:27px!important;letter-spacing:-.7px!important}
body.tf-share-page .sub{color:var(--tf-muted)!important}
body.tf-share-page .legend{padding:9px 10px!important;border:1px solid #e8e1d7!important;border-radius:9px!important;background:#faf7f1!important}
body.tf-share-page .table-wrap{border:1px solid var(--tf-line-strong)!important;border-radius:10px!important;box-shadow:none!important}
body.tf-share-page table th{background:#f1ede6!important;color:#5d6b64!important}
body.tf-share-page table td{border-color:#e8e1d7!important}
body.tf-share-page .available{background:#fff!important;color:#9ba49f!important}
body.tf-share-page .booked{background:#eff5f1!important;color:#315f4c!important}
body.tf-share-page .error{border:1px solid #ebd5d2!important;border-radius:9px!important;background:#fff4f2!important;color:#9b5554!important}

/* ========================================================================
   TeacherFlow v10 - Systematic alignment, controls, surfaces and contrast
   The alignment follows the job of each section rather than one blanket rule.
   ======================================================================== */

html{background:var(--tf-canvas)!important;color-scheme:light;}
body{color:var(--tf-ink);}

/* ---------- AUTH: reading/form content left, submit controls centered ---------- */
body.tf-auth-page{
  background:linear-gradient(145deg,#eef2ee 0%,#f7f8f6 52%,#eef2ef 100%)!important;
}
body.tf-auth-page::before,
body.tf-auth-page::after{opacity:.42!important;}
body.tf-auth-page .login-wrap,
body.tf-auth-page .auth-wrap{
  background:#fff!important;
  border-color:#dce4de!important;
  box-shadow:0 24px 64px rgba(37,55,46,.10)!important;
}
body.tf-auth-page .auth-brand-panel,
body.tf-auth-page .auth-brand-copy,
body.tf-auth-page .auth-brand-points,
body.tf-auth-page .auth-brand-point,
body.tf-auth-page .auth-brand-foot,
body.tf-auth-page .card,
body.tf-auth-page .card h1,
body.tf-auth-page .card .intro,
body.tf-auth-page .card form,
body.tf-auth-page .card label,
body.tf-auth-page .email-note,
body.tf-auth-page .error,
body.tf-auth-page .success{text-align:left!important;}
body.tf-auth-page .auth-brand-panel{
  background:
    linear-gradient(100deg,rgba(12,42,32,.87) 0%,rgba(12,42,32,.75) 54%,rgba(12,42,32,.52) 100%),
    url("https://images.pexels.com/photos/5905435/pexels-photo-5905435.jpeg?auto=compress&cs=tinysrgb&w=2800&q=94") center 58%/cover no-repeat,
    linear-gradient(150deg,#173e32 0%,#2f6651 56%,#4d806b 100%)!important;
}
body.tf-auth-page .auth-brand-logo{align-self:flex-start!important;filter:brightness(0) invert(1)!important;}
body.tf-auth-page .auth-brand-kicker{color:#f1d69a!important;text-shadow:0 1px 10px rgba(4,20,15,.28)!important;}
body.tf-auth-page .auth-brand-kicker::before{background:#f1d69a!important;}
body.tf-auth-page .auth-brand-copy h2{color:#fffaf0!important;text-shadow:0 2px 18px rgba(3,20,14,.36)!important;}
body.tf-auth-page .auth-brand-copy p{color:#edf5f0!important;text-shadow:0 1px 10px rgba(3,20,14,.30)!important;}
body.tf-auth-page .auth-brand-point{
  background:rgba(13,45,34,.42)!important;
  border-color:rgba(255,250,240,.22)!important;
  backdrop-filter:blur(2px)!important;
}
body.tf-auth-page .auth-brand-point span{color:#efd69f!important;}
body.tf-auth-page .auth-brand-point strong{color:#fff!important;}
body.tf-auth-page .auth-brand-point small{color:#e5efe9!important;}
body.tf-auth-page .auth-brand-foot{color:#d7e6de!important;}
body.tf-auth-page .card{background:transparent!important;}
body.tf-auth-page .card form{justify-items:stretch!important;}
body.tf-auth-page .card input,
body.tf-auth-page .card select,
body.tf-auth-page .card textarea{text-align:left!important;background:#fff!important;border-color:var(--tf-line-strong)!important;}
body.tf-auth-page .card button[type="submit"],
body.tf-auth-page .card #loginButton,
body.tf-auth-page .card #signupButton,
body.tf-auth-page .card #requestButton,
body.tf-auth-page .card #verifyButton,
body.tf-auth-page .card #resetButton,
body.tf-auth-page .card .secondary{
  min-height:46px!important;height:46px!important;border-radius:9px!important;font-size:12px!important;font-weight:800!important;text-align:center!important;
}
body.tf-auth-page .account-switch,
body.tf-auth-page .switch{text-align:center!important;margin-left:auto!important;margin-right:auto!important;}
body.tf-auth-page .forgot-password-row{text-align:right!important;}
body.tf-auth-page .code-input{text-align:center!important;}
body.tf-auth-page .error:empty,
body.tf-auth-page .success:empty{display:none!important;}

/* ---------- APP CANVAS + UNIFORM SURFACES ---------- */
body.tf-dashboard-page:not(.dark-mode),
body.tf-dashboard-page:not(.dark-mode)>.app,
body.tf-admin-page,
body.tf-share-page,
body.tf-maintenance-page{background:var(--tf-canvas)!important;background-image:none!important;}
body.tf-dashboard-page:not(.dark-mode) .main,
body.tf-dashboard-page:not(.dark-mode) .view{background:transparent!important;}

body.tf-dashboard-page:not(.dark-mode) :is(
  .section,.card,.analytics-panel,.settings-card,.setting-card,.profile-card,
  .schedule-card,.student-card,.about-feature-card,.about-info-card,.modal-card,
  .regular-timetable-section,.schedule-section-card,.teaching-log-toolbar,
  .teaching-class-list-section,.data-table-wrap,.calendar,.table-wrap
),
body.tf-admin-page :is(.panel,.modal-card,.maintenance-admin-card,.maintenance-status-card,.tf-access-admin-card),
body.tf-share-page .wrap,
body.tf-maintenance-page .maintenance{
  background:var(--tf-surface)!important;
  border-color:var(--tf-line)!important;
  box-shadow:var(--tf-shadow)!important;
}
body.tf-dashboard-page:not(.dark-mode) :is(input,select,textarea),
body.tf-admin-page :is(input,select,textarea){background:#fff!important;border-color:var(--tf-line-strong)!important;color:var(--tf-ink)!important;}

/* ---------- DASHBOARD ALIGNMENT GRAMMAR ---------- */
body.tf-dashboard-page{text-align:left!important;}
body.tf-dashboard-page :is(.view,.section,.card,.analytics-panel,.setting-card,.student-card,.announcement,.about-feature-card,.about-info-card,.modal-card){text-align:left!important;}
body.tf-dashboard-page .page-titlebar{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:16px!important;}
body.tf-dashboard-page .page-titlebar :is(h1,.section-subtitle,.breadcrumb){text-align:left!important;}
body.tf-dashboard-page .page-actions{margin-left:auto!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;text-align:right!important;}
body.tf-dashboard-page .table-action,
body.tf-dashboard-page .modal-actions,
body.tf-dashboard-page .form-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;text-align:right!important;}
body.tf-dashboard-page .empty{text-align:center!important;color:var(--tf-muted)!important;}
body.tf-dashboard-page :is(.badge,.status-badge,.regular-slot-badge){text-align:center!important;}
body.tf-dashboard-page .table :is(th,td),
body.tf-dashboard-page .data-table :is(th,td){text-align:left!important;}
body.tf-dashboard-page .table-action{text-align:right!important;}

/* Calendar: view selector + month are centered controls; event content reads left. */
body.tf-dashboard-page .calendar-viewbar{justify-content:center!important;text-align:center!important;}
body.tf-dashboard-page .calendar-view-btn{min-height:38px!important;height:38px!important;border-radius:9px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;}
body.tf-dashboard-page .toolbar{display:grid!important;grid-template-columns:40px minmax(0,1fr) 40px!important;align-items:center!important;gap:8px!important;}
body.tf-dashboard-page .toolbar>strong{text-align:center!important;color:var(--tf-ink)!important;}
body.tf-dashboard-page .toolbar>button:first-child{justify-self:start!important;}
body.tf-dashboard-page .toolbar>button:last-child{justify-self:end!important;}
body.tf-dashboard-page .calendar .dayname{text-align:center!important;}
body.tf-dashboard-page .calendar .day{text-align:left!important;background:#fff!important;}
body.tf-dashboard-page .calendar .day .date{text-align:right!important;}
body.tf-dashboard-page .calendar .event{text-align:left!important;}

/* Schedule: descriptive content left; actions right; timetable grid centered. */
body.tf-dashboard-page #schedule .regular-timetable-head{align-items:flex-start!important;text-align:left!important;}
body.tf-dashboard-page #schedule .regular-timetable-head>div:first-child{text-align:left!important;}
body.tf-dashboard-page #schedule .regular-timetable-actions{margin-left:auto!important;justify-content:flex-end!important;text-align:right!important;}
body.tf-dashboard-page #schedule .schedule-toolbar{align-items:flex-end!important;justify-content:space-between!important;}
body.tf-dashboard-page #schedule .schedule-toolbar>div:first-child{text-align:left!important;}
body.tf-dashboard-page #schedule .schedule-toolbar-controls{margin-left:auto!important;justify-content:flex-end!important;text-align:right!important;}
body.tf-dashboard-page #schedule :is(.student-schedule-trigger,.student-schedule-panel,.student-schedule-summary-card,.student-schedule-pattern,.student-schedule-change,.student-schedule-class){text-align:left!important;}
body.tf-dashboard-page #schedule .regular-timetable :is(th,td){text-align:center!important;}
body.tf-dashboard-page #schedule .regular-slot-content{text-align:left!important;}
body.tf-dashboard-page #schedule .regular-day-date{display:none!important;}

/* Teaching-log report controls: copy left, filters/actions right. */
body.tf-dashboard-page :is(.teaching-log-toolbar,.class-list-toolbar){display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:14px!important;}
body.tf-dashboard-page :is(.teaching-log-toolbar-copy,.class-list-toolbar-copy,.teaching-log-toolbar-text,.class-list-toolbar-text){text-align:left!important;}
body.tf-dashboard-page :is(.teaching-log-income-actions,.class-list-actions){margin-left:auto!important;display:flex!important;align-items:flex-end!important;justify-content:flex-end!important;gap:8px!important;text-align:right!important;}
body.tf-dashboard-page :is(.teaching-log-month-control,.teaching-log-rate-control,.class-list-control){text-align:left!important;}
body.tf-dashboard-page :is(.teaching-log-month-label,.teaching-log-rate-label,.class-list-control label){text-align:left!important;}

/* ---------- CONTROL SYSTEM ---------- */
body.tf-dashboard-page :is(
  .primary,.ghost,.secondary,.regular-timetable-share,.regular-timetable-print,
  .teaching-log-pdf-btn,.class-list-pdf-btn,.settings-logout-btn,.dashboard-logout,
  .tf-conflict-primary,.tf-conflict-secondary,.tf-conflict-review-btn
),
body.tf-admin-page :is(.primary,.secondary,.ghost,.logout),
body.tf-maintenance-page button{
  min-height:var(--tf-control-h)!important;height:var(--tf-control-h)!important;
  padding:0 14px!important;border-radius:9px!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;
  font-size:12px!important;font-weight:800!important;line-height:1!important;text-align:center!important;
  box-shadow:none!important;white-space:nowrap!important;
}
body.tf-dashboard-page .primary,
body.tf-admin-page .primary{background:var(--tf-green)!important;border:1px solid var(--tf-green-deep)!important;color:#fff!important;}
body.tf-dashboard-page .primary:hover,
body.tf-admin-page .primary:hover{background:var(--tf-green-deep)!important;transform:none!important;}
body.tf-dashboard-page :is(.ghost,.secondary,.regular-timetable-share,.regular-timetable-print),
body.tf-admin-page :is(.secondary,.ghost,.logout),
body.tf-maintenance-page button{background:#fff!important;border:1px solid var(--tf-line-strong)!important;color:#3d584c!important;}
body.tf-dashboard-page :is(.ghost,.secondary,.regular-timetable-share,.regular-timetable-print):hover,
body.tf-admin-page :is(.secondary,.ghost,.logout):hover,
body.tf-maintenance-page button:hover{background:var(--tf-surface-2)!important;transform:none!important;}
body.tf-dashboard-page :is(.teaching-log-pdf-btn,.class-list-pdf-btn){min-width:138px!important;background:var(--tf-green-deep)!important;border:1px solid #284f40!important;color:#fff!important;font-size:12px!important;}
body.tf-dashboard-page :is(.teaching-log-pdf-btn,.class-list-pdf-btn) svg{width:17px!important;height:17px!important;flex:0 0 17px!important;}
body.tf-dashboard-page .teaching-log-pdf-btn{width:auto!important;font-size:12px!important;padding:0 14px!important;}
body.tf-dashboard-page .teaching-log-pdf-btn span{display:inline!important;font-size:12px!important;}
body.tf-dashboard-page :is(.action-icon,.schedule-search-clear,.tf-modal-x,.tf-conflict-close,.tf-payment-required-close){
  width:var(--tf-icon-control)!important;height:var(--tf-icon-control)!important;min-width:var(--tf-icon-control)!important;min-height:var(--tf-icon-control)!important;
  padding:0!important;border-radius:9px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;
}
body.tf-dashboard-page .breadcrumb-home{min-height:34px!important;height:34px!important;padding:0 9px!important;border-radius:8px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;}
body.tf-dashboard-page .toolbar>button{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important;border-radius:9px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;}

/* ---------- ADMIN ---------- */
body.tf-admin-page{text-align:left!important;background:var(--tf-canvas)!important;}
body.tf-admin-page :is(main,.heading,.panel,form,.modal-card){text-align:left!important;}
body.tf-admin-page .top{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;background:#fff!important;}
body.tf-admin-page .top .brand{text-align:left!important;}
body.tf-admin-page .top>div:last-child{margin-left:auto!important;display:flex!important;justify-content:flex-end!important;text-align:right!important;}
body.tf-admin-page .tabs{justify-content:flex-start!important;text-align:left!important;}
body.tf-admin-page .tabs button{min-height:36px!important;height:36px!important;padding:0 12px!important;border-radius:8px!important;text-align:center!important;}
body.tf-admin-page .toolbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;text-align:left!important;}
body.tf-admin-page .toolbar>:last-child{text-align:right!important;}
body.tf-admin-page :is(.account-row-main,.row,.maintenance-admin-card,.maintenance-status-card,.tf-access-admin-card){text-align:left!important;}
body.tf-admin-page :is(.modal-actions,.actions){display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;text-align:right!important;}
body.tf-admin-page button{text-align:center!important;}

/* ---------- MAINTENANCE: one status message = one centered visual axis ---------- */
body.tf-maintenance-page{min-height:100svh!important;display:grid!important;place-items:center!important;padding:24px!important;background:#f2f5f2!important;}
body.tf-maintenance-page .maintenance{width:min(500px,100%)!important;padding:38px 36px!important;border-radius:16px!important;text-align:center!important;}
body.tf-maintenance-page .maintenance :is(h1,h2,p,.message,.eta,.sync){text-align:center!important;}
body.tf-maintenance-page .logo{display:block!important;width:64px!important;height:64px!important;max-width:64px!important;margin:0 auto 22px!important;border-radius:14px!important;}
body.tf-maintenance-page .status{display:inline-flex!important;justify-content:center!important;margin:0 auto 18px!important;text-align:center!important;}
body.tf-maintenance-page h1{margin:0 0 10px!important;font-size:27px!important;line-height:1.15!important;}
body.tf-maintenance-page .message{max-width:390px!important;margin:0 auto!important;color:var(--tf-muted)!important;line-height:1.65!important;}
body.tf-maintenance-page .eta{margin:15px auto 0!important;}
body.tf-maintenance-page .sync{margin:20px auto 0!important;}
body.tf-maintenance-page .actions{display:flex!important;justify-content:center!important;align-items:center!important;margin-top:22px!important;text-align:center!important;}
body.tf-maintenance-page button{min-width:132px!important;}

/* ---------- PUBLIC STATIC TIMETABLE: report-style centered header ---------- */
body.tf-share-page{background:var(--tf-canvas)!important;}
body.tf-share-page .wrap{padding:24px!important;border-radius:14px!important;text-align:center!important;}
body.tf-share-page :is(.kicker,h1,.sub,.note,.error){text-align:center!important;}
body.tf-share-page .legend{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:14px!important;text-align:center!important;}
body.tf-share-page .table-wrap{text-align:left!important;background:#fff!important;}
body.tf-share-page table :is(th,td){text-align:center!important;}

/* ---------- COLOR / TYPE CONSISTENCY ---------- */
body.tf-dashboard-page:not(.dark-mode) :is(.section,.card,.analytics-panel,.setting-card,.student-card,.about-feature-card,.about-info-card,.modal-card) :is(h1,h2,h3,strong),
body.tf-admin-page :is(.heading,.panel,.modal-card,.maintenance-admin-card,.maintenance-status-card,.tf-access-admin-card) :is(h1,h2,h3,strong),
body.tf-maintenance-page .maintenance :is(h1,h2,h3,strong),
body.tf-share-page .wrap :is(h1,h2,h3,strong){color:var(--tf-ink)!important;}
body.tf-dashboard-page:not(.dark-mode) :is(.section,.card,.analytics-panel,.setting-card,.student-card,.about-feature-card,.about-info-card,.modal-card) :is(p,small,.muted,.sub),
body.tf-admin-page :is(.heading,.panel,.modal-card) :is(p,small,.muted,.sub),
body.tf-maintenance-page .maintenance :is(p,small,.muted),
body.tf-share-page .wrap :is(p,small,.muted,.sub){color:var(--tf-muted)!important;}
body.tf-dashboard-page .success,body.tf-admin-page .success,body.tf-auth-page .success{color:#2f684f!important;}
body.tf-dashboard-page .error,body.tf-admin-page .error,body.tf-auth-page .error{color:#994f52!important;}

/* ---------- RESPONSIVE ALIGNMENT ---------- */
@media(max-width:900px){
  body.tf-dashboard-page .page-titlebar{align-items:flex-start!important;flex-wrap:wrap!important;}
  body.tf-dashboard-page .page-actions{width:100%!important;margin-left:0!important;justify-content:flex-start!important;text-align:left!important;}
  body.tf-dashboard-page #schedule :is(.regular-timetable-actions,.schedule-toolbar-controls){width:100%!important;margin-left:0!important;justify-content:flex-start!important;text-align:left!important;}
  body.tf-dashboard-page :is(.teaching-log-toolbar,.class-list-toolbar){align-items:stretch!important;flex-direction:column!important;}
  body.tf-dashboard-page :is(.teaching-log-income-actions,.class-list-actions){width:100%!important;margin-left:0!important;justify-content:flex-start!important;text-align:left!important;}
}
@media(max-width:650px){
  body.tf-auth-page .account-switch,body.tf-auth-page .switch{text-align:center!important;}
  body.tf-dashboard-page .calendar-viewbar{justify-content:center!important;}
  body.tf-dashboard-page .toolbar{grid-template-columns:36px minmax(0,1fr) 36px!important;}
  body.tf-dashboard-page :is(.teaching-log-income-actions,.class-list-actions){display:grid!important;grid-template-columns:1fr!important;}
  body.tf-dashboard-page :is(.teaching-log-month-control,.teaching-log-rate-control,.class-list-control,.teaching-log-pdf-btn,.class-list-pdf-btn){width:100%!important;}
  body.tf-admin-page .top{flex-wrap:wrap!important;}
  body.tf-admin-page .top>div:last-child{margin-left:0!important;width:100%!important;justify-content:flex-start!important;text-align:left!important;}
  body.tf-maintenance-page .maintenance{padding:30px 22px!important;}
}